/* Amanda Collette | staging | celestial night-sky theme */
:root{
  --night:#06040c; --night-2:#0d0918; --night-3:#150f26;
  --purple:#6B3FA0; --purple-soft:#9b6fd6; --teal:#2A9D8F; --teal-soft:#5fd3c4;
  --ink:#f1ecfa; --muted:#bfb5d4; --line:rgba(155,111,214,.28);
  --serif:"Cinzel",Georgia,serif; --body:"Cormorant Garamond",Georgia,serif; --sans:"Inter",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);font-family:var(--body);font-size:1.25rem;line-height:1.7;
  background:var(--night);min-height:100vh;position:relative;overflow-x:hidden}
/* Starfield + nebula layers */
body::before,body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:-2}
body::before{
  background:
    radial-gradient(ellipse 60% 45% at 15% 85%,rgba(107,63,160,.32),transparent 70%),
    radial-gradient(ellipse 50% 40% at 90% 10%,rgba(42,157,143,.22),transparent 70%),
    radial-gradient(ellipse 40% 35% at 70% 70%,rgba(107,63,160,.18),transparent 70%),
    linear-gradient(180deg,var(--night) 0%,var(--night-2) 60%,var(--night-3) 100%);
}
body::after{z-index:-1;opacity:.9;
  background-image:
    radial-gradient(1px 1px at 20px 30px,#fff,transparent),
    radial-gradient(1px 1px at 120px 80px,rgba(255,255,255,.8),transparent),
    radial-gradient(1.5px 1.5px at 200px 160px,var(--teal-soft),transparent),
    radial-gradient(1px 1px at 300px 40px,#fff,transparent),
    radial-gradient(1px 1px at 380px 220px,rgba(255,255,255,.7),transparent),
    radial-gradient(1.5px 1.5px at 60px 260px,var(--purple-soft),transparent),
    radial-gradient(1px 1px at 250px 300px,#fff,transparent),
    radial-gradient(1px 1px at 160px 380px,rgba(255,255,255,.6),transparent),
    radial-gradient(2px 2px at 340px 360px,rgba(255,255,255,.9),transparent);
  background-size:400px 400px;animation:twinkle 7s ease-in-out infinite alternate}
@keyframes twinkle{from{opacity:.55}to{opacity:1}}
@media (prefers-reduced-motion:reduce){body::after{animation:none}}

a{color:var(--teal-soft)} a:hover{color:#fff}
img{max-width:100%;height:auto;display:block}

.staging-banner{background:linear-gradient(90deg,var(--purple),var(--teal));color:#fff;text-align:center;
  font:600 .78rem/1.4 var(--sans);letter-spacing:.14em;padding:.5rem 1rem}

/* Nav */
.site-nav{position:sticky;top:0;z-index:50;background:rgba(6,4,12,.82);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line)}
.site-nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:.8rem 1.25rem;max-width:1100px;margin:auto}
.brand{font-family:var(--serif);color:var(--ink);text-decoration:none;letter-spacing:.12em;font-size:1.05rem}
.brand span{color:var(--teal-soft)}
.site-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.25rem 1.1rem}
.site-nav a{font:500 .82rem var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-decoration:none;padding:.3rem 0;border-bottom:1px solid transparent}
.site-nav a:hover,.site-nav a[aria-current="page"]{color:#fff;border-bottom-color:var(--teal)}

/* Layout */
main{max-width:1100px;margin:auto;padding:0 1.25rem}
section{padding:4.5rem 0}
.narrow{max-width:720px;margin:auto}
.center{text-align:center}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.2;letter-spacing:.04em;margin:0 0 1rem}
h1{font-size:clamp(2.2rem,6vw,3.8rem);
  background:linear-gradient(180deg,#e6fffb 0%,var(--teal-soft) 45%,var(--purple-soft) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 0 40px rgba(95,211,196,.18)}
h2{font-size:clamp(1.6rem,4vw,2.4rem);color:#efe6ff;text-shadow:0 0 24px rgba(155,111,214,.35)}
h3{font-size:1.25rem;color:var(--teal-soft)}
.sub{font-size:1.45rem;color:var(--muted);font-style:italic}
p{margin:0 0 1.1rem}

/* Celestial divider: ✦ line ☾ line ✦ */
.divider{display:flex;align-items:center;justify-content:center;gap:.8rem;color:var(--purple-soft);margin:2.5rem auto;max-width:420px;font-size:1rem}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--teal),transparent)}

/* Hero — single column by default; 2-col only on wide landscape heroes */
.hero{display:grid;grid-template-columns:1fr;gap:2.5rem;align-items:center;padding-top:3.5rem}
.hero > *{min-width:0;max-width:100%}
@media(min-width:880px){.hero:not(.stack){grid-template-columns:1.05fr 1fr}}
.hero-img{width:100%;border-radius:18px;border:1px solid var(--line);
  box-shadow:0 0 0 6px rgba(107,63,160,.08),0 0 60px rgba(107,63,160,.35),0 0 120px rgba(42,157,143,.12)}
.cover{max-width:min(420px,100%);width:100%;margin:auto}
.banner-img{width:100%;border-radius:18px}
h1,h2,.sub,p{overflow-wrap:anywhere}

/* Moon glyph accent */
.moon{display:inline-block;width:46px;height:46px;border-radius:50%;margin-bottom:1rem;
  box-shadow:inset -12px -4px 0 0 var(--teal-soft);filter:drop-shadow(0 0 12px rgba(95,211,196,.6));transform:rotate(-20deg)}

/* Buttons */
.btn{display:inline-block;font:600 .9rem var(--sans);letter-spacing:.08em;text-transform:uppercase;text-decoration:none;
  padding:1rem 1.6rem;border-radius:999px;color:#fff;
  background:linear-gradient(135deg,var(--purple),#4b2a78 55%,var(--teal));
  box-shadow:0 0 22px rgba(107,63,160,.5);border:1px solid rgba(255,255,255,.12);transition:transform .2s,box-shadow .2s}
.btn:hover{color:#fff;transform:translateY(-2px);box-shadow:0 0 34px rgba(95,211,196,.45)}
.btn.secondary{background:transparent;border:1px solid var(--teal);box-shadow:none;color:var(--teal-soft)}
.btn.secondary:hover{background:rgba(42,157,143,.12)}
.btn.tbd{border-style:dashed;opacity:.75}
.actions{display:flex;flex-wrap:wrap;gap:1rem;margin-top:1.6rem}
.center .actions{justify-content:center}
.soft{font-family:var(--sans);font-size:.95rem;letter-spacing:.04em}
.note{font:italic 1.05rem var(--body);color:var(--muted);margin-top:1rem}

/* Cards: three paths */
.paths{display:grid;gap:1.5rem;margin-top:2rem}
@media(min-width:820px){.paths{grid-template-columns:repeat(3,1fr)}}
.card{position:relative;padding:2rem 1.6rem;border-radius:18px;border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(21,15,38,.85),rgba(6,4,12,.85));overflow:hidden}
.card::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background:
   radial-gradient(1.5px 1.5px at 80% 18%,#fff,transparent),
   radial-gradient(1px 1px at 88% 30%,var(--teal-soft),transparent),
   radial-gradient(1px 1px at 72% 26%,#fff,transparent)}
.num{font-family:var(--serif);font-size:2.4rem;color:var(--purple-soft);opacity:.8;display:block;margin-bottom:.4rem}
.optional{font:500 .72rem var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--teal-soft);border:1px solid var(--teal);border-radius:999px;padding:.15rem .6rem;margin-left:.4rem;vertical-align:middle}

/* Panel */
.panel{border:1px solid var(--line);border-radius:22px;padding:3rem 2rem;
  background:radial-gradient(ellipse at top,rgba(107,63,160,.22),transparent 65%),rgba(13,9,24,.75)}
.disclosure{border-left:3px solid var(--teal);padding:1rem 1.25rem;background:rgba(42,157,143,.08);border-radius:0 12px 12px 0;font-size:1.1rem}

/* Video */
.video{position:relative;aspect-ratio:16/9;border-radius:18px;overflow:hidden;border:1px solid var(--line);box-shadow:0 0 60px rgba(107,63,160,.35)}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* Close */
.close{text-align:center;padding:4rem 0 5rem}
.close p{font-family:var(--serif);font-size:1.5rem;color:#efe6ff}
footer{border-top:1px solid var(--line);text-align:center;padding:2rem 1rem;font:400 .85rem var(--sans);color:var(--muted)}
footer .stars{color:var(--purple-soft);letter-spacing:.6em}