/*
   Christina Marie · Alchemy layer
   Design & development: 528 Studio · 528studio.com
*/

/* ---------- self-hosted type (Inter + Cormorant Garamond, OFL) ---------- */
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/inter-var.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:italic;font-weight:100 900;font-display:swap;src:url(../fonts/inter-var-italic.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:300 700;font-display:swap;src:url(../fonts/cormorant-var.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:300 700;font-display:swap;src:url(../fonts/cormorant-var-italic.woff2) format('woff2')}

/* ---------- smooth scroll plumbing ---------- */
html.lenis,html.lenis body{height:auto}
.lenis:not(.lenis-autoToggle).lenis-stopped{overflow:clip}
.lenis.lenis-smooth iframe{pointer-events:none}
html.pre-on,html.pre-on body{overflow:hidden}

/* ---------- hairline progress (transform only) ---------- */
.progress{width:100%!important;transform:scaleX(0);transform-origin:0 50%;will-change:transform}

/* ---------- preloader: lead lines, gold lines, then the crack of light ---------- */
.pre{position:fixed;inset:0;z-index:10000;pointer-events:none;animation:preFail .01s 5.6s forwards}
html:not(.fx) .pre,html.no-pre .pre{display:none}
@keyframes preFail{to{visibility:hidden;opacity:0}}
.pre-half{position:absolute;inset:0;background:#160C12;will-change:transform;transition:transform 1.3s cubic-bezier(.77,0,.18,1)}
.pre-a{clip-path:polygon(0 0,62.2% 0,38.2% 100%,0 100%);
  background:radial-gradient(70% 60% at 30% 40%,rgba(217,132,153,.10),transparent 70%),#160C12}
.pre-b{clip-path:polygon(61.6% 0,100% 0,100% 100%,37.6% 100%);
  background:radial-gradient(70% 60% at 70% 60%,rgba(199,165,103,.08),transparent 70%),#160C12}
.pre-exit .pre-a{transform:translate3d(-104%,0,0)}
.pre-exit .pre-b{transform:translate3d(104%,0,0)}
.pre-seam{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .35s ease;
  filter:drop-shadow(0 0 5px rgba(246,231,194,.95)) drop-shadow(0 0 22px rgba(199,165,103,.8))}
.pre-seam line{stroke:#FBEFD0;stroke-width:1.6;vector-effect:non-scaling-stroke}
.pre-crack .pre-seam{opacity:1}
.pre-exit .pre-seam{opacity:0;transition-duration:.6s}
.pre-core{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;
  transition:opacity .45s ease,transform .9s cubic-bezier(.77,0,.18,1)}
.pre-crack .pre-core{opacity:0;transform:scale(.97)}
.sigil{width:min(32vw,148px);height:auto;overflow:visible}
.sigil path{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;
  animation:sgDraw 1.05s cubic-bezier(.65,0,.35,1) forwards}
.sigil .lead path{stroke:#8f8a93;stroke-width:1}
.sigil .gold path{stroke:url(#sgGold);stroke-width:1.7;animation-duration:1.15s}
.sigil .lead path:nth-child(2){animation-delay:.1s}.sigil .lead path:nth-child(3){animation-delay:.2s}.sigil .lead path:nth-child(4){animation-delay:.3s}
.sigil .gold path:nth-child(1){animation-delay:.55s}.sigil .gold path:nth-child(2){animation-delay:.68s}
.sigil .gold path:nth-child(3){animation-delay:.81s}.sigil .gold path:nth-child(4){animation-delay:.94s}
.sigil .dot{fill:#E9CC8E;transform-box:fill-box;transform-origin:center;transform:scale(0);animation:sgDot .7s cubic-bezier(.34,1.56,.64,1) 1.35s forwards}
@keyframes sgDraw{to{stroke-dashoffset:0}}
@keyframes sgDot{to{transform:scale(1)}}
.pre-name{font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(1.7rem,3.6vw,2.4rem);color:#F3E6CF;
  letter-spacing:.01em;opacity:0;transform:translateY(14px);animation:preUp 1s cubic-bezier(.16,1,.3,1) .75s forwards}
.pre-tag{font-family:var(--sans);font-size:10.5px;letter-spacing:.46em;text-transform:uppercase;color:rgba(199,165,103,.9);
  opacity:0;transform:translateY(10px);animation:preUp 1s cubic-bezier(.16,1,.3,1) 1s forwards;padding-left:.46em}
@keyframes preUp{to{opacity:1;transform:none}}

/* hero copy waits for the curtain (with a failsafe) */
.fx:not(.fx-ready) .hero-content{opacity:0;animation:heroFail .01s 4.8s forwards}
@keyframes heroFail{to{opacity:1}}

/* ---------- light motes ---------- */
.fx-motes{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:30}

/* ---------- words rising out of a mask ---------- */
.fx .is-split .sw{display:inline-block;vertical-align:baseline;clip-path:inset(-.2em -.3em -.24em -.3em)}
.fx .is-split .swi{display:inline-block;transform:translate3d(0,122%,0);opacity:0;
  transition:transform 1.3s cubic-bezier(.16,1,.3,1),opacity .8s ease;transition-delay:calc(var(--i,0) * 46ms)}
.fx .is-split.split-in .swi{transform:none;opacity:1}

/* ---------- lead into gold ---------- */
.fx .tm-lead{filter:grayscale(1) brightness(.94) contrast(1.06)}
.tm-fallback{transition:filter 1.9s cubic-bezier(.6,.05,.25,1)!important}
.tm-canvas{position:absolute;display:block;pointer-events:none;transition:opacity .5s ease;transform-origin:50% 50%}
.tm-sweep{position:absolute;inset:0;pointer-events:none;z-index:3;mix-blend-mode:screen;
  background:linear-gradient(115deg,transparent 38%,rgba(246,231,194,.7) 50%,transparent 62%);background-size:300% 100%;
  background-position:100% 0;animation:tmSweep 1.9s cubic-bezier(.6,.05,.25,1) forwards}
@keyframes tmSweep{to{background-position:0 0}}

/* ---------- tilt + light ---------- */
.tilt{transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity 1.1s cubic-bezier(.16,1,.3,1),box-shadow .6s ease!important}
.tilt-glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:5;opacity:0;transition:opacity .45s ease;
  background:radial-gradient(520px circle at var(--mx,50%) var(--my,50%),rgba(255,244,220,.22),transparent 42%)}
.tilt:hover .tilt-glare{opacity:1}
.qcard,.fork-card,.love-card{position:relative}

/* ---------- magnetic CTAs + gold sheen ---------- */
.mag{transition:transform .45s cubic-bezier(.2,.8,.2,1),background .4s,box-shadow .4s,color .4s,opacity 1.1s ease!important}
.btn-gold{position:relative;overflow:hidden;isolation:isolate}
.btn-gold::after{content:"";position:absolute;inset:-2px;z-index:-1;pointer-events:none;
  background:linear-gradient(110deg,transparent 30%,rgba(255,250,235,.6) 48%,transparent 66%);
  transform:translateX(-130%);transition:transform 1s cubic-bezier(.2,.7,.3,1)}
.btn-gold:hover::after{transform:translateX(130%)}

/* ---------- nav follows the surface beneath it ---------- */
nav{transition:background .5s ease,padding .5s ease,box-shadow .5s ease}
nav.scrolled.on-dark{background:rgba(22,12,18,.66);box-shadow:0 1px 0 rgba(248,241,234,.08)}
nav.scrolled.on-dark .nav-links a{color:var(--bone)}
nav.scrolled.on-dark .nav-cta{border-color:rgba(248,241,234,.55)}
nav.scrolled.on-dark .nav-cta:hover{background:var(--bone);color:var(--ink)}
nav.scrolled.on-dark .logo img{filter:brightness(0) invert(1)}
nav.on-dark .burger span{background:var(--bone)}

/* ---------- sections slide over each other on rounded shoulders ---------- */
:root{--lift:clamp(26px,3.6vw,54px)}
#about,#courses,#coaching,#retreats,#speaking,#results,#society{border-radius:var(--lift) var(--lift) 0 0;margin-top:calc(-1 * var(--lift));z-index:1}
#about,#coaching,#speaking,#society{box-shadow:0 -24px 60px -36px rgba(22,12,18,.55)}
.seen,.author,#podcast,#love,.cosmic,.molten,.book,footer{z-index:1}

/* ---------- hero: "Rewrite your story." is written in, after the headline ---------- */
.fx .hero h1 .rw{clip-path:inset(-.25em 101% -.35em -.2em);transition:clip-path 1.6s cubic-bezier(.65,0,.35,1) .95s}
.fx.fx-ready .hero h1 .rw,.fx-reduced .hero h1 .rw{clip-path:inset(-.25em -.25em -.35em -.2em)}

/* ---------- cosmic love floats ---------- */
.cosmic-shot{animation:cosmicFloat 7s ease-in-out infinite}
@keyframes cosmicFloat{0%,100%{translate:0 0}50%{translate:0 -12px}}
.cosmic-art{position:relative}
.cosmic-art::before{content:"";position:absolute;left:8%;top:6%;width:min(360px,60%);aspect-ratio:1;border-radius:50%;pointer-events:none;z-index:-1;
  background:radial-gradient(closest-side,rgba(217,132,153,.30),rgba(199,165,103,.12) 60%,transparent);filter:blur(6px)}

/* ---------- hero: a crack of light where the image splits ---------- */
.hero-seam{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;opacity:0;overflow:visible;
  filter:drop-shadow(0 0 4px rgba(246,231,194,.95)) drop-shadow(0 0 20px rgba(199,165,103,.75));transition:none}
.hero-seam line{stroke:#FBEFD0;stroke-width:1.6;vector-effect:non-scaling-stroke}

/* ---------- REWRITE: the old story, edited live ---------- */
.rewrite{position:relative;background:
  radial-gradient(60% 50% at 50% 55%,rgba(217,132,153,.10),transparent 70%),var(--cream)}
.rw-sticky{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  padding:16vh 5vw;overflow:hidden}
.rw-live{height:400vh}
.rw-live .rw-sticky{position:sticky;top:0;height:100vh;min-height:560px;padding:0 5vw}
.rw-glow{position:absolute;inset:-20%;pointer-events:none;
  background:radial-gradient(34% 38% at 38% 46%,rgba(217,132,153,.16),transparent 70%),
             radial-gradient(30% 34% at 64% 58%,rgba(199,165,103,.15),transparent 70%);
  transform:translate3d(0,var(--gy,0px),0) scale(var(--gs,1))}
.rw-head{position:relative;display:flex;flex-direction:column;align-items:center;gap:18px;margin-bottom:5.5vh}
.rw-head .eyebrow{justify-content:center}
.rw-dots{display:flex;gap:9px}
.rw-dots i{width:36px;height:2px;border-radius:2px;background:rgba(28,19,24,.12);position:relative;overflow:hidden}
.rw-dots i::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--gold-deep),#E9CC8E);
  transform:scaleX(var(--f,1));transform-origin:0 50%}
.rw-live .rw-dots i::after{transform:scaleX(var(--f,0))}
.rw-lines{position:relative;display:flex;flex-direction:column;gap:.16em;font-size:clamp(1.5rem,7.2vw,5.6rem);font-weight:300;
  letter-spacing:-.03em;line-height:1.1;color:var(--ink)}
.rw-line{display:flex;flex-wrap:nowrap;justify-content:center;align-items:baseline;white-space:nowrap;transition:none}
.rw-line>span{margin-right:.26em}
.rw-line>span:last-child{margin-right:0}
.rw-live .rw-line{opacity:var(--o,.15);transform:translate3d(0,var(--ly,0px),0)}
.rw-old{display:none}
.rw-live .rw-old{display:inline-block;position:relative;white-space:nowrap;overflow:hidden;color:rgba(28,19,24,.92)}
.rw-old-in{display:inline-block;white-space:nowrap}
.rw-ch{display:inline-block;will-change:transform,opacity}
.rw-strike{position:absolute;left:0;right:0;top:55%;height:.07em;border-radius:.05em;
  background:linear-gradient(90deg,var(--gold-deep),#EED39A 55%,var(--gold));transform:scaleX(var(--s,0));transform-origin:0 50%;
  box-shadow:0 0 .35em rgba(199,165,103,.55)}
.rw-new{display:inline-block;white-space:nowrap;overflow:hidden;vertical-align:baseline;
  font-family:var(--serif);font-style:italic;font-weight:500;letter-spacing:-.012em;padding-right:.06em;
  background:linear-gradient(100deg,#9C7A35 0%,#D9B871 30%,#F3DFAE 50%,#C7A567 72%,#9C7A35 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.rw-new-in{display:inline-block;padding-right:.06em;
  background:linear-gradient(100deg,#9C7A35 0%,#D9B871 30%,#F3DFAE 50%,#C7A567 72%,#9C7A35 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.rw-live .rw-new{background:none;padding-right:0}
.rw-ul-host{position:relative}
.rw-ul{position:absolute;left:-2%;width:104%;bottom:-.2em;height:.32em;overflow:visible;pointer-events:none}
.rw-ul path{fill:none;stroke:var(--gold);stroke-width:3.2;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:var(--u,0)}
.rw-live .rw-ul path{stroke-dashoffset:var(--u,1)}
.rw-final{position:relative;max-width:900px;margin:6.5vh auto 0;font-size:clamp(1.05rem,1.9vw,1.55rem);color:#6f5f66;
  font-weight:300;line-height:1.5;letter-spacing:-.01em}
.rw-final .serif-i{color:var(--rose-deep);font-size:1.12em}
.rw-live .rw-final{opacity:var(--fo,0);transform:translate3d(0,calc((1 - var(--fo,0)) * 26px),0)}
.rw-dust{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.rw-cue{position:absolute;bottom:4.5vh;left:50%;transform:translateX(-50%);font-size:10px;letter-spacing:.32em;text-transform:uppercase;
  color:var(--muted);opacity:var(--co,0);display:flex;align-items:center;gap:10px}
.rw-cue::before,.rw-cue::after{content:"";width:22px;height:1px;background:currentColor;opacity:.5}

/* ---------- PATHS: the climb ---------- */
@media (min-width:1025px){
  .path-grid{grid-template-columns:repeat(3,1fr)!important;gap:28px!important;align-items:start;position:relative}
  .fx .path-grid .path-card:nth-child(1){margin-top:170px}
  .fx .path-grid .path-card:nth-child(2){margin-top:85px}
}
.path-grid{position:relative}
.path-grid>.path-card{position:relative;z-index:1}
.climb{position:absolute;left:0;top:0;pointer-events:none;overflow:visible;z-index:0}
.climb .route{fill:none;stroke:rgba(169,134,63,.32);stroke-width:1.2;stroke-dasharray:1.5 7;stroke-linecap:round}
.climb .draw{fill:none;stroke:url(#climbGold);stroke-width:2.2;stroke-linecap:round;
  filter:drop-shadow(0 0 6px rgba(199,165,103,.45))}
.climb .wp .dot{fill:var(--bone);stroke:var(--gold);stroke-width:1.6;transition:fill .6s ease}
.climb .wp.on .dot{fill:var(--gold)}
.climb .wp .halo{fill:none;stroke:rgba(199,165,103,.7);stroke-width:1;opacity:0;transform-box:fill-box;transform-origin:center}
.climb .wp.on .halo{animation:wpOnce 1.6s cubic-bezier(.16,1,.3,1) forwards}
@keyframes wpOnce{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(3.4)}}
.climb .wp text{font-family:var(--sans);font-size:10px;letter-spacing:.24em;text-transform:uppercase;fill:var(--gold-deep);opacity:0;transition:opacity .6s ease}
.climb .wp.on text{opacity:1}
.climb .summit{opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(.4) rotate(-30deg);
  transition:opacity .8s ease,transform 1.1s cubic-bezier(.34,1.56,.64,1)}
.climb .summit.on{opacity:1;transform:none}
.path-card{transition:transform .6s cubic-bezier(.2,.7,.3,1),box-shadow .8s ease}
.path-card.lit{box-shadow:0 0 0 1px rgba(199,165,103,.6),0 50px 90px -50px rgba(169,134,63,.6)}
@media (hover:none){.path-card p{opacity:1!important;max-height:none!important;margin-bottom:18px!important}}

/* ---------- ABOUT: the word lead turns to gold ---------- */
.lead-w,.gold-w{display:inline-block;-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.04em}
.lead-w{background-image:linear-gradient(100deg,#F6E7C2 0%,#D9B871 22%,#C7A567 38%,#9b97a0 58%,#cfccd3 70%,#8a8690 100%);
  background-size:300% 100%;background-position:100% 0;transition:background-position 2.6s cubic-bezier(.6,.05,.2,1) .5s}
.about-copy.in .lead-w,.fx-reduced .lead-w{background-position:0 0}
.gold-w{background-image:linear-gradient(100deg,#B08A3E 0%,#E9CC8E 25%,#FFF3D6 40%,#C7A567 55%,#A9863F 80%,#E9CC8E 100%);
  background-size:250% 100%;animation:goldFlow 7s ease-in-out infinite alternate}
@keyframes goldFlow{from{background-position:0 0}to{background-position:100% 0}}

/* ---------- COURSES: a floating course player ---------- */
.feature .media.course-ui{overflow:visible;border-radius:0;min-height:540px;display:flex;align-items:center;justify-content:center}
.course-ui .cu-glow{position:absolute;inset:6% 4%;border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(217,132,153,.28),rgba(199,165,103,.12) 55%,transparent)}
.cu-card{position:absolute;will-change:transform}
.cu-player{position:relative;width:min(100%,470px);border-radius:24px;padding:14px;color:var(--bone);
  background:linear-gradient(165deg,#2E1B26,#160C12 70%);border:1px solid rgba(248,241,234,.09);
  box-shadow:0 60px 120px -50px rgba(28,19,24,.75),0 0 0 1px rgba(199,165,103,.08) inset}
.cu-bar{display:flex;align-items:center;gap:10px;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:rgba(248,241,234,.62);padding:4px 6px 12px}
.cu-dot{width:7px;height:7px;border-radius:50%;background:var(--rose);box-shadow:0 0 0 0 rgba(217,132,153,.6);animation:cuPulse 2.4s ease-out infinite}
@keyframes cuPulse{0%{box-shadow:0 0 0 0 rgba(217,132,153,.55)}100%{box-shadow:0 0 0 10px rgba(217,132,153,0)}}
.cu-chip{margin-left:auto;border:1px solid rgba(199,165,103,.45);color:var(--gold);border-radius:30px;padding:5px 10px;letter-spacing:.16em}
.cu-screen{position:relative;aspect-ratio:16/10;border-radius:16px;overflow:hidden;display:flex;align-items:flex-end;padding:22px 24px;isolation:isolate}
.cu-art{position:absolute;inset:-30%;z-index:-1;
  background:radial-gradient(40% 45% at 30% 35%,rgba(217,132,153,.85),transparent 70%),
             radial-gradient(38% 42% at 72% 62%,rgba(199,165,103,.75),transparent 72%),
             radial-gradient(60% 60% at 50% 50%,#5a2d43,#1d0f17 80%);
  animation:cuDrift 16s ease-in-out infinite alternate;animation-play-state:paused}
.course-ui.in .cu-art{animation-play-state:running}
@keyframes cuDrift{from{transform:translate3d(-4%,-3%,0) rotate(0deg)}to{transform:translate3d(4%,3%,0) rotate(8deg)}}
.cu-screen::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 35%,rgba(22,12,18,.72))}
.cu-title small{display:block;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:rgba(248,241,234,.7)}
.cu-title b{display:block;font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(2rem,3.4vw,2.7rem);line-height:1;margin:8px 0 8px;color:#fff;letter-spacing:-.01em}
.cu-title span{font-size:.82rem;color:rgba(248,241,234,.78);max-width:260px;display:block;line-height:1.45}
.cu-play{position:absolute;right:20px;bottom:22px;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;
  background:rgba(251,247,242,.16);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.5)}
.cu-play svg{width:18px;height:18px;fill:#fff;margin-left:3px}
.cu-progress{height:3px;border-radius:3px;background:rgba(248,241,234,.12);margin:16px 6px 10px;overflow:hidden}
.cu-progress i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--gold-deep),#EED39A);transform-origin:0 50%;
  transform:scaleX(.38);animation:cuProg 18s ease-in-out infinite alternate;animation-play-state:paused}
.course-ui.in .cu-progress i{animation-play-state:running}
@keyframes cuProg{from{transform:scaleX(.24)}to{transform:scaleX(.72)}}
.cu-wave{display:flex;align-items:center;gap:3px;height:26px;padding:0 6px}
.cu-wave i{flex:1;height:100%;border-radius:2px;background:linear-gradient(180deg,rgba(233,204,142,.9),rgba(217,132,153,.6));
  transform:scaleY(var(--h,.4));animation:cuWave 1.6s ease-in-out infinite alternate;animation-delay:var(--dl,0s);animation-play-state:paused}
.course-ui.in .cu-wave i{animation-play-state:running}
@keyframes cuWave{from{transform:scaleY(calc(var(--h,.4) * .35))}to{transform:scaleY(var(--h,.4))}}
.cu-list{top:-2%;right:-6%;width:250px;border-radius:18px;padding:18px 18px 12px;color:var(--ink);
  background:rgba(255,253,249,.86);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border:1px solid rgba(199,165,103,.3);box-shadow:0 40px 80px -40px rgba(28,19,24,.55)}
.cu-list small{font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-deep);display:block;margin-bottom:10px}
.cu-list ul{list-style:none}
.cu-list li{display:flex;align-items:center;gap:11px;padding:9px 0;border-top:1px solid var(--line);font-size:.86rem;font-weight:400}
.cu-list li:first-child{border-top:none}
.cu-list .ck{width:18px;height:18px;border-radius:50%;border:1.5px solid rgba(169,134,63,.55);flex:none;position:relative}
.cu-list .done .ck{background:linear-gradient(120deg,var(--gold),var(--gold-deep));border-color:transparent}
.cu-list .done .ck::after{content:"";position:absolute;left:5.5px;top:3px;width:4px;height:8px;border:solid #fff;border-width:0 1.6px 1.6px 0;transform:rotate(45deg)}
.cu-list .now .ck::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--rose)}
.cu-list .now{color:var(--rose-deep)}
.cu-pill{bottom:4%;left:-4%;display:flex;align-items:center;gap:10px;padding:13px 20px;border-radius:40px;
  background:linear-gradient(120deg,#E9CC8E,var(--gold) 45%,var(--gold-deep));color:#2a1d0b;font-size:11.5px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:600;box-shadow:0 26px 50px -24px rgba(169,134,63,.8)}
.cu-spark{width:14px;height:14px;position:relative}
.cu-spark::before,.cu-spark::after{content:"";position:absolute;left:50%;top:50%;background:#2a1d0b;border-radius:2px}
.cu-spark::before{width:2px;height:14px;transform:translate(-50%,-50%)}
.cu-spark::after{width:14px;height:2px;transform:translate(-50%,-50%)}
@media(max-width:1024px){.feature .media.course-ui{min-height:500px;max-width:560px;margin:56px auto 0;width:100%}}
@media(max-width:680px){
  .feature .media.course-ui{min-height:440px}
  .cu-list{width:200px;right:-2%;top:-6%;padding:14px 14px 8px}
  .cu-list li{font-size:.76rem;padding:7px 0}
  .cu-pill{left:-1%;bottom:0;font-size:10px;padding:11px 16px}
}

/* ---------- MOLTEN: ENOUGH fills with gold ---------- */
.molten{position:relative;padding:14vh 4vw 9vh;text-align:center;overflow:hidden;
  background:radial-gradient(60% 70% at 50% 60%,rgba(199,165,103,.10),transparent 70%),linear-gradient(180deg,var(--cream),var(--bone))}
.molten-svg{display:block;width:min(100%,1480px);height:auto;margin:0 auto;overflow:visible}
.mg-t{font-family:'Inter',system-ui,sans-serif;font-weight:800;font-size:262px;letter-spacing:-11px}
.mg-fill{fill:rgba(199,165,103,.07)}
.mg-outline{fill:none;stroke:rgba(169,134,63,.55);stroke-width:1.3}
.molten-cap{margin-top:4.5vh;display:flex;flex-direction:column;align-items:center;gap:14px}
.molten-cap .eyebrow{justify-content:center}
.molten-cap p{font-size:clamp(1.6rem,3.6vw,3rem);font-weight:300;letter-spacing:-.025em;line-height:1.1}
.molten-cap p .serif-i{color:var(--rose-deep)}

/* ---------- BOOK: drag hint ---------- */
.book-hint{margin-top:18px;display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--muted);
  transition:opacity .6s ease}
.book-hint span{width:26px;height:1px;background:currentColor;position:relative}
.book-hint span::after{content:"";position:absolute;right:-1px;top:-3px;width:6px;height:6px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
.book-hint.used{opacity:0}
#bookCanvas{cursor:grab;touch-action:pan-y}
#bookCanvas.grabbing{cursor:grabbing}
html:not(.fx) .book-hint,.fx-reduced .book-hint{display:none}

/* ---------- LOVE: two lights drawn together ---------- */
.love{overflow:hidden}
.love-orbs{position:absolute;inset:0;pointer-events:none;z-index:0}
.love-orbs i{position:absolute;top:42%;width:62vmax;height:62vmax;margin:-31vmax 0 0 -31vmax;border-radius:50%;will-change:transform}
.love-orbs .o1{left:22%;background:radial-gradient(closest-side,rgba(217,132,153,.30),rgba(217,132,153,.10) 55%,transparent)}
.love-orbs .o2{left:78%;background:radial-gradient(closest-side,rgba(199,165,103,.28),rgba(199,165,103,.08) 55%,transparent)}
.love .wrap{position:relative;z-index:1}

/* ---------- RESULTS: letters that land on the pile ---------- */
.results{padding:0!important;overflow:visible!important;background:linear-gradient(180deg,var(--bone),var(--cream))}
.letters-stage{position:relative;padding:13vh 5vw 14vh}
.letter-pile{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:1180px;margin:0 auto}
.stack-live{height:300vh}
.stack-live .letters-stage{position:sticky;top:0;height:100vh;min-height:620px;padding:0 5vw;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.stack-live .results-head{margin-bottom:5.5vh}
.stack-live .letter-pile{display:block;width:min(90vw,600px)}
.letter{position:relative;background:#FFFDF8;border:1px solid rgba(199,165,103,.34);border-radius:6px;padding:42px 40px 30px;
  box-shadow:0 34px 70px -42px rgba(28,19,24,.5),0 2px 0 rgba(255,255,255,.8) inset;text-align:left}
.letter::before{content:"";position:absolute;inset:10px;border:1px solid rgba(199,165,103,.18);border-radius:3px;pointer-events:none}
.stack-live .letter{position:absolute;left:0;right:0;top:0;will-change:transform}
.letter-seal{position:absolute;top:-20px;right:30px;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 34% 30%,#F3DFAE,#C7A567 48%,#8C6A2C);color:#3a2a10;font-family:var(--serif);font-style:italic;
  font-weight:600;font-size:1.05rem;box-shadow:0 10px 22px -10px rgba(80,55,15,.75),0 0 0 3px rgba(199,165,103,.22)}
.letter p{font-family:var(--serif);font-size:clamp(1.15rem,1.75vw,1.42rem);line-height:1.5;color:#3d3238;font-weight:500}
.letter .who{display:flex;align-items:baseline;gap:12px;margin-top:22px;padding-top:16px;border-top:1px solid rgba(199,165,103,.25)}
.letter .who b{font-size:.92rem;font-weight:600;letter-spacing:.01em}
.letter .who small{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep)}
.letter .shade{position:absolute;inset:0;border-radius:inherit;background:#2A1822;opacity:var(--sh,0);pointer-events:none}
@media(max-width:1024px){.letter-pile{grid-template-columns:1fr}}
@media(max-width:680px){.letter{padding:36px 24px 24px}.stack-live{height:290vh}}

/* ---------- SOCIETY: the sigil turns ---------- */
.society-sigil{position:absolute;left:50%;top:50%;width:min(92vw,760px);height:auto;transform:translate(-50%,-50%);z-index:1;pointer-events:none;opacity:.6}
.society-sigil .rot{transform-origin:100px 100px;animation:sigilSpin 160s linear infinite}
.society-sigil path{fill:none;stroke:rgba(199,165,103,.5);stroke-width:.32;stroke-dasharray:1;stroke-dashoffset:1;
  transition:stroke-dashoffset 2.8s cubic-bezier(.65,0,.35,1)}
.society-sigil path:nth-child(2){transition-delay:.25s}.society-sigil path:nth-child(3){transition-delay:.5s}.society-sigil path:nth-child(4){transition-delay:.75s}
.society.lit .society-sigil path,.fx-reduced .society-sigil path,html:not(.fx) .society-sigil path{stroke-dashoffset:0}
@keyframes sigilSpin{to{transform:rotate(360deg)}}

/* ---------- FOOTER: the last line, filled in gold ---------- */
.foot-giant{font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(2.4rem,10.6vw,11.5rem);line-height:.95;letter-spacing:-.02em;
  text-align:center;white-space:nowrap;margin:0 auto 7vh;padding:0 .08em .06em;color:transparent;-webkit-text-stroke:1px rgba(199,165,103,.5);
  background:linear-gradient(90deg,#E9CC8E,#C7A567 50%,#A9863F) no-repeat 0 0/var(--fill,100%) 100%;-webkit-background-clip:text;background-clip:text}
.fx .foot-giant{--fill:0%}

/* ---------- subpage hero settles in ---------- */
.fx .phero img.bg{scale:1.12;transition:scale 2.8s cubic-bezier(.16,1,.3,1)}
.fx.fx-ready .phero img.bg{scale:1}
.phero .backlink{transition:color .3s,transform .4s}
.phero .backlink:hover{transform:translateX(-4px)}

/* ---------- thanks page: the seal turns gold ---------- */
.ty .seal{box-shadow:0 0 0 0 rgba(199,165,103,.5);animation:sealPulse 2.8s ease-out 1s 2}
@keyframes sealPulse{0%{box-shadow:0 0 0 0 rgba(199,165,103,.5)}100%{box-shadow:0 0 0 22px rgba(199,165,103,0)}}

/* ================= PHONES: epic, never simplified ================= */
/* screen heights that respect the iPhone toolbar */
@supports (height:100svh){
  .hero{height:100svh}
  .rw-live .rw-sticky,.stack-live .letters-stage{height:100svh}
}
/* rewrite becomes stanzas on phones */
.rw-br{display:none;margin:0!important}
@media (max-width:600px){
  .rw-lines{font-size:clamp(1.8rem,9vw,3.2rem);gap:.5em;line-height:1.04}
  .rw-line{flex-wrap:wrap}
  .rw-br{display:block;flex-basis:100%;height:0}
  .rw-line>.rw-s{margin-right:0}
  .rw-head{margin-bottom:5vh}
  .rw-final{margin-top:5.5vh;font-size:1.04rem;padding:0 3vw}
  .rw-live{height:370vh}
}
/* the menu opens like a lens from the burger */
.mobile-menu{z-index:7990!important;inset:0;transform:none!important;visibility:hidden;
  clip-path:circle(0% at calc(100% - 9vw) 42px);transition:clip-path .85s cubic-bezier(.77,0,.18,1),visibility 0s .85s!important;
  background:radial-gradient(90% 60% at 88% 0%,rgba(217,132,153,.26),transparent 60%),
             radial-gradient(70% 50% at 0% 100%,rgba(199,165,103,.18),transparent 62%),var(--plum-deep)!important;
  justify-content:flex-start!important;align-items:stretch!important;gap:0!important;
  padding:clamp(92px,13vh,128px) 9vw max(26px,calc(env(safe-area-inset-bottom) + 18px))!important;overflow:hidden}
.mobile-menu.open{visibility:visible;clip-path:circle(150% at calc(100% - 9vw) 42px);transition:clip-path 1s cubic-bezier(.77,0,.18,1),visibility 0s 0s!important}
.mm-sigil{position:absolute;right:-34%;bottom:-14%;width:122vw;max-width:640px;opacity:.15;pointer-events:none;animation:sigilSpin 150s linear infinite}
.mm-sigil path{fill:none;stroke:var(--gold);stroke-width:.4}
.mm-eyebrow{position:relative;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:3.2vh;display:flex;align-items:center;gap:12px;
  opacity:0;transition:opacity .6s ease .2s}
.mm-eyebrow::before{content:"";width:26px;height:1px;background:currentColor;flex:none}
.mobile-menu.open .mm-eyebrow{opacity:1}
.mm-links{position:relative;display:flex;flex-direction:column;gap:.18em}
.mobile-menu .mm-links a{font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(1.9rem,9.2vw,3rem);line-height:1.14;color:var(--bone);
  opacity:0;transform:translateY(28px);display:flex;align-items:baseline;gap:16px;
  transition:opacity .5s ease,transform .9s cubic-bezier(.16,1,.3,1),color .3s}
.mobile-menu .mm-links a::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(199,165,103,.38),transparent);transform:translateY(-.32em)}
.mobile-menu.open .mm-links a{opacity:1;transform:none}
.mobile-menu.open .mm-links a:nth-child(1){transition-delay:.26s,.26s,0s}
.mobile-menu.open .mm-links a:nth-child(2){transition-delay:.31s,.31s,0s}
.mobile-menu.open .mm-links a:nth-child(3){transition-delay:.36s,.36s,0s}
.mobile-menu.open .mm-links a:nth-child(4){transition-delay:.41s,.41s,0s}
.mobile-menu.open .mm-links a:nth-child(5){transition-delay:.46s,.46s,0s}
.mobile-menu.open .mm-links a:nth-child(6){transition-delay:.51s,.51s,0s}
.mobile-menu.open .mm-links a:nth-child(7){transition-delay:.56s,.56s,0s}
.mobile-menu.open .mm-links a:nth-child(8){transition-delay:.61s,.61s,0s}
.mobile-menu .mm-links a:active{color:var(--gold)}
.mobile-menu .mm-cta{position:relative;margin-top:auto;align-self:stretch;justify-content:center;font-family:var(--sans);font-style:normal;font-size:12.5px;
  color:#241a0d;opacity:0;transform:translateY(20px);transition:opacity .6s ease .7s,transform .9s cubic-bezier(.16,1,.3,1) .7s}
.mobile-menu.open .mm-cta{opacity:1;transform:none}
.mm-social{position:relative;margin-top:18px;display:flex;gap:10px;justify-content:center;font-size:10px;letter-spacing:.26em;text-transform:uppercase;
  color:rgba(248,241,234,.55);opacity:0;transition:opacity .6s ease .85s}
.mobile-menu.open .mm-social{opacity:1}
.mobile-menu .mm-social a{font-family:var(--sans);font-style:normal;font-size:inherit;color:inherit;opacity:1}
/* burger becomes a cross; the bar goes clear while the menu is open */
.burger span{transition:transform .55s cubic-bezier(.7,0,.2,1),opacity .3s ease,background .3s ease}
.burger.on span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.burger.on span:nth-child(2){opacity:0;transform:scaleX(.2)}
.burger.on span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
html.menu-open nav{background:transparent!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
html.menu-open nav .logo img{filter:brightness(0) invert(1)!important}
html.menu-open .burger span{background:var(--bone)!important}
html.menu-open,html.menu-open body{overflow:hidden}
/* a quiet gold pill that follows the thumb */
.mcta{display:none}
@media (max-width:760px){
  .mcta{position:fixed;left:50%;bottom:calc(14px + env(safe-area-inset-bottom));z-index:7980;display:inline-flex;align-items:center;gap:11px;
    padding:14px 24px 14px 19px;border-radius:40px;white-space:nowrap;
    background:rgba(22,12,18,.8);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
    border:1px solid rgba(199,165,103,.55);color:#F3E6CF;font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;
    box-shadow:0 20px 44px -18px rgba(22,12,18,.75);transform:translate(-50%,190%);opacity:0;
    transition:transform .75s cubic-bezier(.16,1,.3,1),opacity .5s ease}
  .mcta.show{transform:translate(-50%,0);opacity:1}
  html.menu-open .mcta{opacity:0;pointer-events:none}
  .mcta-dot{width:7px;height:7px;border-radius:50%;background:var(--gold);animation:cuPulse 2.4s ease-out infinite}
}
/* labels stay on one line */
@media (max-width:600px){
  .eyebrow{font-size:10.5px!important;letter-spacing:.24em!important;gap:11px!important}
  .eyebrow::before{width:22px!important;flex:none}
  .molten{padding-left:2vw;padding-right:2vw}
  .foot-giant{margin-bottom:6vh}
}
/* phones: the device mockups need a real width (auto margins were shrinking them to zero) */
@media (max-width:1024px){
  .devices{width:100%!important;max-width:480px;margin:0 auto}
}
@media (max-width:480px){
  .devices{height:400px!important}
  .tablet{width:78%!important}
  .phone{width:42%!important}
  .phone .ig{padding:12px}
  .phone .ig .name{font-size:.72rem}
  .phone .ig .handle{font-size:.6rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

/* touch gets a tactile press */
@media (hover:none){
  .path-card:active,.fork-card:active,.love-card:active,.qcard:active,.sb:active,.card:active{transform:scale(.985);transition-duration:.15s}
  .btn:active{transform:scale(.97)}
}

/* ---------- reduced motion: everything lands, nothing travels ---------- */
@media (prefers-reduced-motion:reduce){
  .pre{display:none}
  .fx .is-split .swi{transform:none;opacity:1;transition:none}
  .gold-w,.cu-art,.cu-progress i,.cu-wave i,.society-sigil .rot,.cu-dot,.cosmic-shot,.ty .seal,.mm-sigil,.mcta-dot{animation:none!important}
  .fx .hero h1 .rw,.fx .phero img.bg{transition:none!important}
  .btn-gold::after{display:none}
}