:root{
  --sky-top:#191331;
  --sky-mid:#251C48;
  --sky-low:#3A2D63;
  --card:#2A2150;
  --card-edge:rgba(212,177,106,.22);
  --line:rgba(200,186,235,.16);
  --gold:#D4B16A;
  --gold-soft:#C9A45C;
  --cream:#F3ECD8;
  --lavender:#B7AAD8;
  --text:#D9D1EE;
  --moonlight:#F7F1DC;
  --wrap:74rem;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:linear-gradient(180deg,var(--sky-top) 0%,var(--sky-mid) 45%,var(--sky-low) 100%);
  background-attachment:fixed;
  color:var(--text);
  font-family:"EB Garamond",Georgia,serif;
  font-size:1.125rem;
  line-height:1.7;
}
img,svg{max-width:100%}
a{color:var(--cream);text-decoration-color:var(--gold);text-underline-offset:.2em}
a:hover{color:var(--gold)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 1.5rem}
.narrow{max-width:44rem}

/* ---- masthead ---- */
.masthead{border-bottom:1px solid var(--line)}
.masthead .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-top:1.2rem;padding-bottom:1.2rem}
.wordmark{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-weight:500;font-size:1.05rem;letter-spacing:.42em;
  text-transform:uppercase;color:var(--gold);text-decoration:none
}
.wordmark:hover{color:var(--cream)}
.masthead nav{display:flex;gap:1.5rem;font-size:.92rem}
.masthead nav a{text-decoration:none;color:var(--lavender)}
.masthead nav a:hover{color:var(--cream)}

.crumbs{font-size:.85rem;color:var(--lavender);padding:1.2rem 0 0;font-style:italic}
.crumbs a{text-decoration:none;color:var(--lavender)}
.crumbs a:hover{color:var(--cream)}
.crumbs span{padding:0 .45rem;opacity:.45}

/* ---- hero ---- */
.hero{padding:2rem 0 2.8rem}
.hero-grid{display:grid;grid-template-columns:1fr 20rem;gap:3.2rem;align-items:center}
.eyebrow{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:.88rem;text-transform:uppercase;letter-spacing:.34em;
  color:var(--gold-soft);font-weight:600;margin:0 0 1rem
}
h1{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-weight:500;font-size:clamp(2.2rem,5vw,3.4rem);
  line-height:1.1;letter-spacing:.005em;margin:0 0 1.1rem;color:var(--moonlight)
}
.standfirst{font-style:italic;font-size:1.22rem;color:var(--lavender);margin:0;max-width:34rem}

/* ---- the dial ---- */
.dial{
  background:radial-gradient(circle at 50% 38%,#2E2456 0%,#1D163A 78%);
  border:1px solid var(--card-edge);border-radius:22px;
  padding:1.3rem;margin:0;
  box-shadow:0 0 60px rgba(212,177,106,.07)
}
.dial figcaption{
  font-family:"Cormorant Garamond",Georgia,serif;
  color:var(--lavender);font-size:.8rem;text-transform:uppercase;
  letter-spacing:.22em;text-align:center;margin-top:.8rem
}

/* ---- fact strip ---- */
.facts{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:0 0 2.8rem}
.facts dl{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:0}
.facts div{padding:1.2rem 1.3rem;border-left:1px solid var(--line)}
.facts div:first-child{border-left:0;padding-left:0}
.facts dt{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:.78rem;text-transform:uppercase;letter-spacing:.26em;color:var(--gold-soft);margin-bottom:.35rem
}
.facts dd{margin:0;font-family:"Cormorant Garamond",Georgia,serif;font-size:1.3rem;font-weight:500;color:var(--cream);text-transform:capitalize}

/* ---- sections ---- */
.section{padding:0 0 3rem}
h2{
  font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;
  font-size:1.9rem;margin:0 0 1.2rem;line-height:1.2;color:var(--moonlight)
}
h3{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:1.2rem;margin:0 0 .5rem;color:var(--cream)}
p{margin:0 0 1.1rem}

.two{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem}
.moon-card{
  background:var(--card);border:1px solid var(--card-edge);
  border-radius:18px;padding:1.6rem 1.7rem
}
.moon-card .glyph{font-size:1.6rem;line-height:1;display:block;margin-bottom:.6rem;color:var(--gold)}
.moon-card ul{list-style:none;margin:0;padding:0;font-size:1.02rem}
.moon-card li{padding:.55rem 0;border-top:1px solid var(--line)}
.moon-card li:first-child{border-top:0}
.moon-card b{
  display:block;font-family:"Cormorant Garamond",Georgia,serif;
  font-size:.76rem;text-transform:uppercase;letter-spacing:.24em;
  color:var(--gold-soft);font-weight:600
}

.layer{border-left:1px solid var(--card-edge);padding:0 0 .1rem 1.5rem;margin:0 0 1.7rem}
.layer h3{
  font-family:"Cormorant Garamond",Georgia,serif;color:var(--gold-soft);
  font-size:.82rem;text-transform:uppercase;letter-spacing:.28em;font-weight:600;margin-bottom:.5rem
}

.heart p:first-of-type::first-letter{
  font-family:"Cormorant Garamond",Georgia,serif;font-size:3.4rem;line-height:.8;
  float:left;padding:.12rem .55rem 0 0;color:var(--gold);font-weight:500
}

.verdict{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem;margin-top:.4rem}
.verdict div{padding:1.4rem 1.5rem;background:var(--card);border:1px solid var(--card-edge);border-radius:18px}
.verdict div:first-child h3::before{content:"\263D\00a0\00a0";color:var(--gold)}
.verdict div:last-child h3::before{content:"\263E\00a0\00a0";color:var(--lavender)}

/* ---- cta ---- */
.cta{
  background:radial-gradient(ellipse at 50% 0%,#332961 0%,#221A47 70%);
  border:1px solid var(--card-edge);border-radius:22px;
  color:var(--text);padding:2.4rem 2.2rem;margin:0 0 3rem;text-align:center
}
.cta h2{margin-bottom:.7rem}
.cta p{color:var(--lavender);max-width:38rem;margin-left:auto;margin-right:auto;font-style:italic}
.cta a{
  display:inline-block;margin-top:.8rem;
  background:linear-gradient(180deg,#E0BE79,#C9A45C);color:#241C42;
  padding:.85rem 1.9rem;text-decoration:none;font-weight:600;font-size:1rem;
  border-radius:999px;font-family:"EB Garamond",Georgia,serif;letter-spacing:.02em
}
.cta a:hover{background:linear-gradient(180deg,#EACB88,#D4B16A);color:#241C42}

/* ---- faq ---- */
.faq details{border-top:1px solid var(--line);padding:1rem 0}
.faq details:last-of-type{border-bottom:1px solid var(--line)}
.faq summary{
  cursor:pointer;font-family:"Cormorant Garamond",Georgia,serif;font-size:1.18rem;
  font-weight:600;color:var(--cream);list-style:none;display:flex;justify-content:space-between;gap:1rem
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--gold);font-family:Georgia,serif}
.faq details[open] summary::after{content:"\2212"}
.faq details p{margin:.7rem 0 0;color:var(--lavender)}

/* ---- related ---- */
.related ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem}
.related a{
  display:block;padding:.95rem 1.1rem;background:var(--card);
  border:1px solid var(--line);border-radius:14px;text-decoration:none;font-size:1rem
}
.related a:hover{border-color:var(--card-edge);background:#332961}
.related em{
  display:block;font-style:normal;font-family:"Cormorant Garamond",Georgia,serif;
  font-size:.74rem;text-transform:uppercase;letter-spacing:.2em;color:var(--gold-soft);margin-top:.2rem
}

footer{border-top:1px solid var(--line);margin-top:1rem;padding:2rem 0 3.2rem;font-size:.92rem;color:var(--lavender);text-align:center}
footer a{text-decoration:none;color:var(--lavender)}
footer a:hover{color:var(--cream)}
footer p:first-child{font-style:italic}

@media (max-width:860px){
  .hero-grid{grid-template-columns:1fr;gap:2.2rem}
  .dial{max-width:19rem;margin:0 auto}
  .facts dl{grid-template-columns:1fr 1fr}
  .facts div{border-left:0;border-top:1px solid var(--line);padding-left:0}
  .facts div:nth-child(-n+2){border-top:0}
  .two,.verdict{grid-template-columns:1fr}
  .related ul{grid-template-columns:1fr}
  .masthead nav{display:none}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}

/* ---- hub page ---- */
.hub-jump{
  display:flex;flex-wrap:wrap;gap:.5rem;
  padding:0 0 2.6rem;border-bottom:1px solid var(--line);margin-bottom:2.6rem
}
.hub-jump a{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:.82rem;text-transform:uppercase;letter-spacing:.18em;
  color:var(--gold-soft);text-decoration:none;
  border:1px solid var(--card-edge);border-radius:999px;
  padding:.5rem 1rem;background:var(--card)
}
.hub-jump a:hover{color:var(--cream);border-color:var(--gold)}
.hub-jump a span{margin-right:.3rem}

.hub-sign{padding:0 0 2.8rem}
.hub-sign h2 span{color:var(--gold);margin-right:.4rem}
.hub-note{font-style:italic;color:var(--lavender);margin:-.4rem 0 1.2rem;max-width:44rem}
.hub-grid{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem
}
.hub-grid a{
  display:block;padding:.8rem 1rem;background:var(--card);
  border:1px solid var(--line);border-radius:12px;
  text-decoration:none;font-size:.98rem
}
.hub-grid a:hover{border-color:var(--card-edge);background:#332961}
.hub-grid em{
  display:block;font-style:normal;
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:.72rem;text-transform:uppercase;letter-spacing:.18em;
  color:var(--gold-soft);margin-top:.15rem
}
@media (max-width:900px){.hub-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:480px){.hub-grid{grid-template-columns:1fr}}