@charset "UTF-8";
:root { color-scheme: dark; --night:#1c101b; --ivory:#fff6ec; --rose:#ecb799; --soft:#d2c0bd; --line:rgba(255,244,232,.2); }
* { box-sizing: border-box; }
html,body { margin:0; min-width:320px; min-height:100%; }
body { background:var(--night); color:var(--ivory); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif; -webkit-font-smoothing:antialiased; }
.page { isolation:isolate; min-height:100vh; min-height:100svh; display:flex; flex-direction:column; position:relative; overflow:hidden; background:var(--night); }
.hero-art { position:absolute; inset:0; z-index:-2; width:100%; height:100%; object-fit:cover; object-position:center center; }
.page::before { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(90deg,rgba(23,12,22,.93) 0%,rgba(23,12,22,.89) 26%,rgba(23,12,22,.61) 50%,rgba(23,12,22,.08) 80%),linear-gradient(0deg,rgba(23,12,22,.68),transparent 23%,transparent 75%,rgba(23,12,22,.32)); }
.topbar,.footer { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:0 clamp(25px,5.8vw,100px); position:relative; }
.topbar { padding:30px 0; border-bottom:1px solid var(--line); }
.site-name { display:flex; align-items:center; gap:12px; font-size:14px; font-weight:600; letter-spacing:-.025em; white-space:nowrap; }
.asterisk { color:var(--rose); font-family:Georgia,serif; font-size:30px; line-height:.6; }
.top-status { display:flex; gap:11px; align-items:center; font-size:10px; font-weight:700; letter-spacing:.22em; white-space:nowrap; color:#e5d4ce; }
.status-dot { width:6px; height:6px; border-radius:50%; background:var(--rose); box-shadow:0 0 0 5px rgba(236,183,153,.14); }
.hero { flex:1; min-height:590px; display:flex; align-items:center; padding:80px clamp(25px,8.4vw,145px) 95px; position:relative; }
.content { width:min(100%,850px); }
.eyebrow { display:flex; align-items:center; gap:14px; color:var(--rose); font-size:11px; font-weight:700; letter-spacing:.24em; }
.rule { display:block; width:34px; height:1px; background:var(--rose); }
h1 { margin:31px 0 32px; font-family:Georgia,"Times New Roman",serif; font-weight:400; font-size:clamp(68px,8vw,132px); line-height:.99; letter-spacing:-.07em; text-wrap:balance; }
h1 em { font-weight:400; color:var(--rose); }
.full-stop { color:var(--ivory); }
.intro { max-width:480px; margin:0; color:#e1d1cb; font-size:clamp(15px,1.28vw,18px); line-height:1.85; text-wrap:pretty; }
.farewell { display:flex; align-items:center; gap:16px; margin-top:50px; color:var(--ivory); font-size:12px; letter-spacing:.045em; }
.farewell-line { display:block; width:45px; height:1px; background:var(--rose); }
.side-label { position:absolute; right:clamp(25px,5.8vw,100px); bottom:54px; color:rgba(255,246,236,.56); font-size:10px; letter-spacing:.25em; font-weight:600; }
.footer { padding:25px 0 28px; border-top:1px solid var(--line); font-size:11px; letter-spacing:.04em; color:#d1c0bc; }
.footer-mark { color:var(--rose); font-family:Georgia,serif; font-size:24px; line-height:.6; }
@media (max-width:700px) {
  .page { min-height:100svh; }
  .hero-art { object-position:65% center; }
  .page::before { background:linear-gradient(180deg,rgba(23,12,22,.45) 0%,rgba(23,12,22,.47) 20%,rgba(23,12,22,.84) 50%,rgba(23,12,22,.98) 86%),linear-gradient(90deg,rgba(23,12,22,.34),transparent 76%); }
  .topbar,.footer { margin:0 24px; }
  .topbar { padding:24px 0; }
  .site-name { font-size:12px; }
  .top-status { font-size:0; gap:0; }
  .status-dot { width:8px; height:8px; }
  .hero { min-height:660px; align-items:flex-end; padding:205px 25px 100px; }
  .eyebrow { font-size:10px; letter-spacing:.18em; }
  .rule { width:25px; }
  h1 { font-size:clamp(51px,12.4vw,82px); line-height:1.01; margin:25px 0 22px; }
  .intro { max-width:370px; font-size:15px; line-height:1.7; }
  .intro br { display:none; }
  .farewell { margin-top:32px; font-size:11px; }
  .side-label { right:25px; bottom:36px; font-size:8px; }
  .footer { padding:21px 0 23px; font-size:10px; }
  .footer-mark { display:none; }
  .footer span:last-child { white-space:nowrap; }
}
@media (max-width:360px) { h1 { font-size:49px; } .intro { font-size:14px; } }