:root{
  --black:#0e0d10;
  --ink:#1f1e23;
  --raised:#28272d;
  --border:#2a292e;
  --hairline:rgba(255,255,255,.06);
  --gold:#9a8f72;
  --gold-dim:#6e6658;
  --title:#cfc9bb;
  --body:#b3b1b6;
  --muted:#8a898d;
  --hint:#6e6d70;
  --measure:44rem;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} }

body{
  margin:0;
  background:var(--black);
  color:var(--body);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

a{color:var(--gold); text-decoration:none; border-bottom:1px solid rgba(154,143,114,.35)}
a:hover,a:focus-visible{color:#b8ac8b; border-bottom-color:#b8ac8b}
:focus-visible{outline:2px solid var(--gold); outline-offset:3px; border-radius:2px}

h1,h2,h3{color:var(--title); font-weight:400; line-height:1.25; margin:0}
p{margin:0 0 1.1em}
p:last-child{margin-bottom:0}

.wrap{width:100%; max-width:var(--measure); margin:0 auto; padding:0 24px}

.skip{position:absolute; left:-9999px}
.skip:focus{position:static; display:inline-block; padding:8px 14px}

/* ---- top bar ---- */
.bar{
  position:sticky; top:0; z-index:20;
  background:rgba(14,13,16,.82);
  -webkit-backdrop-filter:saturate(140%) blur(12px);
  backdrop-filter:saturate(140%) blur(12px);
  border-bottom:1px solid var(--hairline);
}
.bar .wrap{display:flex; align-items:center; gap:20px; min-height:52px}
.bar .brand{
  display:flex; align-items:center; gap:9px;
  color:var(--title); font-size:15px; letter-spacing:.02em;
  border:0; margin-right:auto;
}
.bar nav{display:flex; gap:20px; font-size:14px}
.bar nav a{color:var(--muted); border:0; letter-spacing:.01em}
.bar nav a:hover{color:var(--gold)}
.bar nav a[aria-current="page"]{color:var(--gold)}
@media (max-width:560px){
  .bar nav a[data-optional]{display:none}
}

/* ---- hero (home) ---- */
.hero{padding:88px 0 72px; text-align:center; position:relative; overflow:hidden}
.hero::before{
  content:""; position:absolute; inset:-30% 0 auto; height:520px;
  background:radial-gradient(60% 50% at 50% 45%, rgba(154,143,114,.10), transparent 70%);
  pointer-events:none;
}
.hero > *{position:relative}

.mark{width:76px; height:76px; margin:0 auto 30px; display:block}
.halo{transform-origin:60px 66px; animation:breathe 11s ease-in-out infinite}
@keyframes breathe{
  0%,100%{opacity:.7; transform:scale(1)}
  45%{opacity:1; transform:scale(1.12)}
}
@media (prefers-reduced-motion: reduce){ .halo{animation:none} }

.hero h1{font-size:clamp(2.5rem,9vw,3.6rem); letter-spacing:-.015em; margin-bottom:14px}
.tagline{color:var(--gold); font-size:clamp(1rem,3.6vw,1.15rem); letter-spacing:.06em; margin-bottom:22px}
.lede{font-size:clamp(1.05rem,3.6vw,1.22rem); color:var(--body); max-width:34rem; margin:0 auto 34px}

.cta-row{display:flex; flex-wrap:wrap; gap:12px; justify-content:center; align-items:center}
.btn{display:inline-block; border:0; padding:13px 26px; border-radius:999px; font-size:16px; letter-spacing:.01em}
.btn-primary{background:var(--gold); color:#141319; font-weight:500}
.btn-primary:hover,.btn-primary:focus-visible{background:#b0a488; color:#141319}
.btn-ghost{border:1px solid var(--border); color:var(--body); background:transparent}
.btn-ghost:hover,.btn-ghost:focus-visible{border-color:var(--gold); color:var(--gold)}
.status{display:block; margin-top:18px; font-size:13px; color:var(--hint); letter-spacing:.03em}

/* ---- page head (sub-pages) ---- */
.pagehead{padding:56px 0 8px}
.pagehead h1{font-size:clamp(1.9rem,6.5vw,2.5rem); letter-spacing:-.01em; margin-bottom:12px}
.pagehead .stamp{font-size:13.5px; color:var(--hint); letter-spacing:.02em; margin:0}
.pagehead .standfirst{margin-top:16px; font-size:1.08rem; color:var(--body)}

/* ---- sections ---- */
section{padding:64px 0; border-top:1px solid var(--hairline)}
section.plain{border-top:0; padding-top:34px}
.eyebrow{
  display:block; margin-bottom:14px;
  font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-dim);
}
section h2{font-size:clamp(1.5rem,5vw,1.9rem); letter-spacing:-.01em; margin-bottom:20px}
section h3{font-size:1.05rem; color:var(--title); margin-bottom:6px}

.pillars{display:grid; gap:22px; margin-top:34px}
@media (min-width:680px){ .pillars{grid-template-columns:repeat(3,1fr); gap:26px} }
.pillar p{font-size:15.5px; color:var(--muted); margin:0}

/* ---- night phases ---- */
.phases{list-style:none; margin:30px 0 0; padding:0; display:grid; gap:1px;
  background:var(--hairline); border:1px solid var(--hairline); border-radius:12px; overflow:hidden}
.phases li{background:var(--black); padding:16px 18px; display:grid; gap:2px}
@media (min-width:620px){ .phases li{grid-template-columns:9.5rem 1fr; gap:18px; align-items:baseline} }
.phases b{color:var(--title); font-weight:400; letter-spacing:.01em}
.phases span{color:var(--muted); font-size:15.5px}

/* ---- routines ---- */
.routines{display:grid; gap:14px; margin-top:30px; padding:0; list-style:none}
@media (min-width:620px){ .routines{grid-template-columns:1fr 1fr} }
.routines li{background:var(--ink); border:1px solid var(--border); border-radius:12px; padding:15px 17px}
.routines b{display:block; color:var(--title); font-weight:400; margin-bottom:3px}
.routines span{color:var(--muted); font-size:14.5px; line-height:1.5; display:block}

/* ---- privacy claim ---- */
.claim{
  margin-top:30px; padding:26px 24px;
  border:1px solid var(--border); border-radius:14px;
  background:linear-gradient(180deg, rgba(154,143,114,.055), rgba(154,143,114,0));
}
.claim ul{list-style:none; margin:0; padding:0; display:grid; gap:12px}
.claim li{display:flex; gap:12px; align-items:flex-start; font-size:15.5px; color:var(--body)}
.claim li::before{content:"—"; color:var(--gold); flex:none; line-height:1.65}
.footnote{margin-top:20px; font-size:14px; color:var(--hint)}

/* ---- FAQ / disclosure lists ---- */
.faq{margin-top:28px; display:grid; gap:0; border-top:1px solid var(--hairline)}
.faq details{border-bottom:1px solid var(--hairline); padding:16px 0}
.faq summary{
  cursor:pointer; color:var(--title); font-size:16.5px;
  list-style:none; display:flex; justify-content:space-between; gap:16px; align-items:center;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; color:var(--gold); font-size:19px; line-height:1; flex:none}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:12px 0 0; color:var(--muted); font-size:15.5px}
.faq details p + p{margin-top:.9em}

/* ---- long-form copy ---- */
.policy{font-size:15.5px}
.policy h2{font-size:1.15rem; margin:34px 0 10px; color:var(--title)}
.policy h2:first-of-type{margin-top:24px}
.policy ul{margin:0 0 1.1em; padding-left:1.2em; color:var(--muted)}
.policy li{margin-bottom:.45em}
.policy p{color:var(--muted)}

.disclaimer{
  margin-top:28px; padding:18px 20px;
  border-left:2px solid var(--gold-dim); background:rgba(255,255,255,.02);
  font-size:14.5px; color:var(--muted);
}

/* ---- contact ---- */
.contact-card{
  margin-top:26px; padding:26px 24px; text-align:center;
  border:1px solid var(--border); border-radius:14px; background:var(--ink);
}
.contact-card .addr{display:inline-block; margin:6px 0 10px;
  font-size:clamp(1.05rem,4.4vw,1.3rem); letter-spacing:.01em}
.contact-card p{color:var(--muted); font-size:15px}

/* ---- key/value spec list ---- */
.spec{list-style:none; margin:24px 0 0; padding:0; display:grid; gap:1px;
  background:var(--hairline); border:1px solid var(--hairline); border-radius:12px; overflow:hidden}
.spec li{background:var(--black); padding:13px 18px; display:grid; gap:2px; font-size:15.5px}
@media (min-width:620px){ .spec li{grid-template-columns:11rem 1fr; gap:18px; align-items:baseline} }
.spec b{color:var(--title); font-weight:400}
.spec span{color:var(--muted)}

/* ---- footer ---- */
footer{padding:44px 0 60px; border-top:1px solid var(--hairline); font-size:14px; color:var(--hint)}
footer .rows{display:flex; flex-wrap:wrap; gap:8px 20px; justify-content:space-between; align-items:baseline}
footer a{color:var(--muted); border-bottom-color:rgba(255,255,255,.12)}
footer a:hover{color:var(--gold)}