/* ============================================================
   Be Au Sm  |  inner-page components
   Shares tokens, buttons, reveals, nav, and footer with style.css
   ============================================================ */

/* ---------- element tiles (HTML, data-driven) ---------- */
.ptiles{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;transition:opacity .45s,transform .5s var(--ease-out)}
.ptiles.is-out{opacity:0;transform:translateY(10px)}
.ptile{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;width:var(--pt,92px);aspect-ratio:1;border:1.5px solid rgba(255,255,255,.85);color:var(--gold-2);background:rgba(255,255,255,.02);overflow:hidden;animation:ptin .7s var(--ease-out) both}
.ptile:nth-child(2){animation-delay:.08s}.ptile:nth-child(3){animation-delay:.16s}.ptile:nth-child(4){animation-delay:.24s}.ptile:nth-child(5){animation-delay:.32s}.ptile:nth-child(6){animation-delay:.4s}.ptile:nth-child(7){animation-delay:.48s}.ptile:nth-child(8){animation-delay:.56s}.ptile:nth-child(9){animation-delay:.64s}.ptile:nth-child(10){animation-delay:.72s}
@keyframes ptin{from{opacity:0;transform:translateY(-16px) rotateX(-40deg)}to{opacity:1;transform:none}}
.ptile::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.5) 50%,transparent 65%);transform:translateX(-140%);mix-blend-mode:overlay;animation:tilesheen 1.1s var(--ease-out) .9s forwards}
.ptile i{position:absolute;top:6%;left:8%;font-style:normal;font-size:calc(var(--pt,92px)*.13);font-weight:600;color:var(--gold-2);opacity:.9}
.ptile b{font-size:calc(var(--pt,92px)*.42);font-weight:700;line-height:1;letter-spacing:-.02em;background:var(--gold-foil);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:foil 7s linear infinite}
.ptile small{margin-top:5%;font-size:calc(var(--pt,92px)*.095);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--gold-2);white-space:nowrap;max-width:92%;overflow:hidden;text-overflow:ellipsis}
.ptile em{font-style:normal;font-size:calc(var(--pt,92px)*.1);color:var(--gold-2);opacity:.85;margin-top:2%}
.ptile--x{border-color:rgba(255,255,255,.18);color:rgba(255,255,255,.35)}
.ptile--x b{background:none;color:rgba(255,255,255,.35);-webkit-text-fill-color:rgba(255,255,255,.35);animation:none}
.ptile--x small{color:rgba(255,255,255,.35);font-size:calc(var(--pt,92px)*.085)}
.ptile--x::after{display:none}
.ptile-gap{width:calc(var(--pt,92px)*.35);flex:0 0 auto}
.light .ptile{border-color:var(--green);background:#fff}
.light .ptile i,.light .ptile small,.light .ptile em{color:var(--green)}
.light .ptile--x{border-color:rgba(16,32,26,.18)}
.light .ptile--x b,.light .ptile--x small{color:rgba(16,32,26,.35);-webkit-text-fill-color:rgba(16,32,26,.35)}

.speller{display:grid;gap:22px}
.speller__field{display:flex;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.04);max-width:520px;transition:border-color .3s}
.speller__field:focus-within{border-color:var(--gold)}
.speller__field input{flex:1;min-width:0;background:none;border:0;color:#fff;font:inherit;font-size:18px;padding:16px 18px;outline:none}
.speller__field input::placeholder{color:rgba(255,255,255,.4)}
.speller__field span{padding:16px 18px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-2);font-weight:600;align-self:center}
.speller__out{--pt:clamp(64px,7vw,96px);min-height:calc(var(--pt) + 8px)}
.speller__note{font-family:var(--serif);font-size:22px;color:rgba(255,255,255,.75)}
.light .speller__field{border-color:var(--line);background:#fff}
.light .speller__field input{color:var(--text)}
.light .speller__field input::placeholder{color:var(--muted)}
.light .speller__field span{color:var(--green)}
.light .speller__note{color:var(--text-2)}

/* ---------- page hero ---------- */
.phero{position:relative;background:radial-gradient(120% 80% at 20% 0%,#134232 0%,var(--ink) 60%);color:#fff;overflow:hidden;padding:calc(var(--nav-h) + clamp(60px,8vw,110px)) 0 clamp(70px,8vw,110px)}
.phero__bg{position:absolute;inset:0;z-index:0}
.phero__bg img{width:100%;height:100%;object-fit:cover;object-position:center 30%;opacity:.28;filter:saturate(.5);transform:scale(1.08)}
.phero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,23,15,.55),rgba(6,23,15,.35) 50%,var(--ink) 100%)}
.phero__inner{position:relative;z-index:2;display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(30px,5vw,80px);align-items:end}
.phero__inner--solo{grid-template-columns:1fr;max-width:900px}
.phero h1{font-family:var(--serif);font-weight:500;font-size:clamp(48px,7.3vw,102px);line-height:.94;letter-spacing:-.025em;margin-top:22px}
.phero h1 .em{color:transparent;background:var(--gold-foil);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;animation:foil 7s linear infinite}
.phero__lead{margin-top:24px;max-width:600px;font-size:18px;line-height:1.7;color:rgba(255,255,255,.75)}
.phero__cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.phero__frame{position:relative;aspect-ratio:4/4.4;overflow:hidden;box-shadow:0 60px 120px -40px rgba(0,0,0,.8)}
.phero__frame img{width:100%;height:100%;object-fit:cover;object-position:center 25%;transform:scale(1.12);transition:transform 2.4s var(--ease-out)}
.in .phero__frame img{transform:none}
.phero__frame::before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.14) 50%,transparent 60%);transform:translateX(-120%);animation:sheen 9s ease-in-out infinite 3s;pointer-events:none}
.phero__frame figcaption{position:absolute;left:0;bottom:0;z-index:3;background:rgba(6,23,15,.85);backdrop-filter:blur(10px);color:#fff;padding:12px 16px;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:600}
.phero__frame figcaption span{color:var(--gold-2)}
.crumb{display:flex;gap:10px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.5);font-weight:600}
.crumb a:hover{color:var(--gold-2)}
.crumb i{font-style:normal;color:var(--gold)}

/* ---------- section scaffolding ---------- */
.sec{position:relative;padding:clamp(90px,11vw,150px) 0;overflow:hidden}
.sec--ink{background:var(--ink);color:#fff}
.sec--ink2{background:var(--ink-2);color:#fff}
.sec--green{background:var(--green);color:#fff}
.sec--paper{background:var(--paper);color:var(--text)}
.sec--cream{background:var(--cream);color:var(--text)}
.sec--paper2{background:var(--paper-2);color:var(--text)}
.sec--white{background:#fff;color:var(--text)}
.sec .lead{color:var(--text-2)}
.sec--ink .lead,.sec--ink2 .lead,.sec--green .lead{color:rgba(255,255,255,.72)}
.sec--ink .h2 .em,.sec--ink2 .h2 .em,.sec--green .h2 .em{color:var(--gold-2)}
.head{max-width:760px}
.head .h2{margin-top:18px}
.head .lead{margin-top:22px}
.head--c{text-align:center;margin:0 auto}
.head--c .lead{margin-left:auto;margin-right:auto}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,100px);align-items:center}
.split--top{align-items:start}
.sticky{position:sticky;top:calc(var(--nav-h) + 30px)}

/* ---------- The Whole Day (sticky clock + stops) ---------- */
.day{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(40px,6vw,110px);align-items:start}
.clock{position:sticky;top:calc(var(--nav-h) + 40px)}
.clock__time{font-family:var(--serif);font-weight:600;font-size:clamp(70px,9vw,140px);line-height:.9;letter-spacing:-.04em;color:#fff;transition:opacity .3s,transform .4s var(--ease-out)}
.clock__time.swap{opacity:0;transform:translateY(10px)}
.clock__time small{display:block;font-size:.28em;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-2);font-family:var(--sans);font-weight:600;margin-top:16px}
.clock__bar{margin-top:34px;height:2px;background:rgba(255,255,255,.12);position:relative;max-width:360px}
.clock__bar i{position:absolute;left:0;top:0;height:100%;width:0;background:var(--gold-foil);background-size:220% 100%;animation:foil 7s linear infinite;transition:width .6s var(--ease-out)}
.clock__note{margin-top:26px;font-family:var(--serif);font-size:22px;line-height:1.35;color:rgba(255,255,255,.8);max-width:36ch;font-weight:500}
.stops{display:grid;gap:14px}
.stop{position:relative;display:grid;grid-template-columns:96px 1fr;gap:26px;padding:30px 30px 30px 26px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.02);transition:background .5s,border-color .5s,transform .5s var(--ease-out);overflow:hidden}
.stop::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(232,210,143,.12) 50%,transparent 70%);transform:translateX(-120%)}
.stop.on{background:rgba(201,169,97,.07);border-color:rgba(201,169,97,.5);transform:translateX(8px)}
.stop.on::after{animation:shine 1s var(--ease-out) forwards}
.stop__t{font-family:var(--serif);font-size:26px;color:var(--gold-2);line-height:1.1;font-weight:500}
.stop__t small{display:block;font-family:var(--sans);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-top:6px;font-weight:600}
.stop h3{font-family:var(--serif);font-size:clamp(22px,2vw,28px);font-weight:500;letter-spacing:-.01em}
.stop p{margin-top:8px;font-size:15.5px;line-height:1.6;color:rgba(255,255,255,.7)}
.stop q{font-family:var(--serif);display:block;margin-top:12px;font-size:16px;color:var(--gold-2);quotes:"\201C" "\201D"}

/* ---------- tracks grid (speaking page) ---------- */
.tgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.tcard{position:relative;padding:36px 34px 30px;background:#fff;border:1px solid var(--line);overflow:hidden;transition:transform .5s var(--ease-out),box-shadow .5s,border-color .5s;display:flex;flex-direction:column}
.tcard::before{content:"";position:absolute;left:0;top:0;right:0;height:3px;background:var(--gold-foil);background-size:220% 100%;animation:foil 7s linear infinite;transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease-out)}
.tcard::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(201,169,97,.14) 50%,transparent 70%);transform:translateX(-120%);pointer-events:none}
.tcard:hover{transform:translateY(-6px);box-shadow:0 40px 60px -40px rgba(16,32,26,.45);border-color:rgba(201,169,97,.6)}
.tcard:hover::before{transform:scaleX(1)}
.tcard:hover::after{animation:shine 1s var(--ease-out) forwards}
.tcard__n{font-family:var(--serif);font-size:30px;color:var(--gold-3);font-weight:500;line-height:1}
.tcard h3{margin-top:14px;font-family:var(--serif);font-size:clamp(26px,2.4vw,34px);font-weight:500;letter-spacing:-.01em}
.tcard .who{margin-top:6px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--green);font-weight:600}
.tcard p{margin-top:14px;font-size:15.5px;line-height:1.65;color:var(--text-2)}
.tcard ul{margin-top:18px;display:grid;gap:6px}
.tcard li{position:relative;padding-left:20px;font-size:14.5px;color:var(--text)}
.tcard li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;background:var(--gold);transform:rotate(45deg)}
.tcard .link{margin-top:auto;padding-top:26px;color:var(--green)}
.tcard--dark{background:var(--ink);color:#fff;border-color:rgba(255,255,255,.1)}
.tcard--dark p{color:rgba(255,255,255,.7)}
.tcard--dark li{color:#fff}
.tcard--dark .who{color:var(--gold-2)}
.tcard--dark .link{color:var(--gold-2)}

/* ---------- format strip ---------- */
.formats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);background:#fff}
.fmt{display:block;padding:28px 26px;border-right:1px solid var(--line);transition:background .4s,transform .4s var(--ease-out);color:inherit}
a.fmt:hover{background:var(--paper);transform:translateY(-3px)}
.fmt:last-child{border-right:0}
.fmt:hover{background:var(--paper)}
.fmt b{display:block;font-family:var(--serif);font-size:22px;font-weight:500}
.fmt span{display:block;margin-top:8px;font-size:14px;color:var(--text-2);line-height:1.5}
.fmt i{display:block;font-style:normal;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-3);font-weight:600;margin-bottom:10px}

/* ---------- endorsement wall ---------- */
.ewall{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ecard{position:relative;padding:34px 32px 30px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1);overflow:hidden;transition:transform .5s var(--ease-out),border-color .5s}
.ecard::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(232,210,143,.12) 50%,transparent 70%);transform:translateX(-120%)}
.ecard:hover{transform:translateY(-6px);border-color:rgba(201,169,97,.5)}
.ecard:hover::after{animation:shine 1s var(--ease-out) forwards}
.ecard .mark{font-family:var(--serif);font-size:64px;line-height:.6;color:var(--gold);margin-bottom:22px}
.ecard p{font-family:var(--serif);font-size:20px;line-height:1.4;color:#fff}
.ecard .who{margin-top:22px;padding-top:18px;border-top:1px solid rgba(255,255,255,.1)}
.ecard .who b{display:block;font-size:15px;letter-spacing:.02em;color:var(--gold-2);font-weight:600}
.ecard .who span{display:block;margin-top:3px;font-size:13px;color:rgba(255,255,255,.6);line-height:1.4}
.ewall--2{grid-template-columns:repeat(2,1fr)}
.ecard--name{display:flex;flex-direction:column;justify-content:flex-end;min-height:260px}
.ecard--name .big{font-family:var(--serif);font-size:clamp(30px,2.8vw,40px);line-height:1.05;color:#fff;letter-spacing:-.01em}
.ecard--name .tag{margin-bottom:auto}

/* ---------- story timeline (About) ---------- */
.story{position:relative;padding-left:0}
.story__line{position:absolute;left:calc(50% - 1px);top:0;bottom:0;width:2px;background:var(--line)}
.story__line i{position:absolute;left:0;top:0;width:100%;height:0;background:var(--green);transition:height .3s linear}
.chapter{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,7vw,120px);padding:clamp(40px,5vw,70px) 0;align-items:center}
.chapter__year{font-family:var(--serif);font-size:clamp(64px,8vw,120px);line-height:.9;letter-spacing:-.04em;color:var(--green);font-weight:500}
.chapter__year small{display:block;font-family:var(--sans);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-top:14px}
.chapter:nth-child(even) .chapter__year{text-align:right}
.chapter:nth-child(even) .chapter__body{order:-1}
.chapter__dot{position:absolute;left:calc(50% - 8px);top:50%;width:16px;height:16px;background:var(--paper);border:2px solid var(--green);transform:rotate(45deg) translateY(-50%);transition:background .4s,transform .4s}
.chapter.in .chapter__dot{background:var(--gold)}
.chapter h3{font-family:var(--serif);font-size:clamp(26px,2.6vw,36px);font-weight:500;letter-spacing:-.01em}
.chapter p{margin-top:12px;font-size:16px;line-height:1.7;color:var(--text-2)}
.chapter .stat{display:inline-flex;flex-direction:column;margin-top:18px;padding:14px 18px;border:1px solid var(--line);background:#fff}
.chapter .stat b{font-family:var(--serif);font-size:32px;line-height:1;color:var(--green);font-weight:600}
.chapter .stat span{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-top:6px}
.chapter figure{margin:0;overflow:hidden;box-shadow:0 40px 70px -40px rgba(16,32,26,.5)}
.chapter figure img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform 1.4s var(--ease-out)}
.chapter figure:hover img{transform:scale(1.04)}

/* ---------- mantras ---------- */
.mantras{display:grid;gap:0}
.mantra{padding:clamp(34px,4vw,54px) 0;border-top:1px solid rgba(255,255,255,.12);display:grid;grid-template-columns:70px 1fr;gap:24px;align-items:start;transition:padding-left .5s var(--ease-out)}
.mantra:hover{padding-left:14px}
.mantra:last-child{border-bottom:1px solid rgba(255,255,255,.12)}
.mantra i{font-style:normal;font-family:var(--serif);font-size:26px;color:var(--gold-3);padding-top:8px}
.mantra b{display:block;font-family:var(--serif);font-weight:500;font-size:clamp(26px,3.2vw,44px);line-height:1.1;letter-spacing:-.02em;color:#fff}
.mantra p{margin-top:12px;font-size:16px;line-height:1.65;color:rgba(255,255,255,.66);max-width:64ch}

/* ---------- fun facts marquee ---------- */
.facts .marquee__track{animation-duration:80s}
.fact{flex:0 0 auto;display:flex;align-items:center;gap:16px;padding:0 30px;white-space:nowrap;font-family:var(--serif);font-size:24px;color:var(--text)}
.fact .dot{width:7px;height:7px;background:var(--gold);transform:rotate(45deg)}

/* ---------- episodes ---------- */
.shows2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.showcard{display:grid;grid-template-columns:150px 1fr;gap:26px;padding:26px;background:rgba(6,23,15,.6);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(12px);transition:border-color .4s,transform .5s var(--ease-out)}
.showcard:hover{border-color:rgba(201,169,97,.5);transform:translateY(-4px)}
.showcard img{width:100%;aspect-ratio:1;object-fit:cover;box-shadow:0 20px 40px -20px rgba(0,0,0,.7)}
.showcard h3{font-family:var(--serif);font-size:26px;font-weight:500}
.showcard .meta{margin-top:6px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-2);font-weight:600}
.showcard p{margin-top:10px;font-size:14.5px;line-height:1.6;color:rgba(255,255,255,.7)}
.showcard .links{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.showcard .links a{font-size:12px;font-weight:600;padding:9px 12px;border:1px solid rgba(255,255,255,.2);color:#fff;transition:background .3s,border-color .3s,color .3s}
.showcard .links a:hover{background:var(--gold);border-color:var(--gold);color:var(--ink)}
.eps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ep{position:relative;background:#fff;border:1px solid var(--line);overflow:hidden;transition:transform .5s var(--ease-out),box-shadow .5s;display:flex;flex-direction:column}
.ep:hover{transform:translateY(-6px);box-shadow:0 40px 60px -40px rgba(16,32,26,.5)}
.ep__thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--ink);cursor:pointer}
.ep__thumb img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease-out)}
.ep:hover .ep__thumb img{transform:scale(1.05)}
.ep__play{position:absolute;left:50%;top:50%;width:64px;height:64px;transform:translate(-50%,-50%);background:var(--gold-foil);background-size:220% 100%;animation:foil 7s linear infinite;display:flex;align-items:center;justify-content:center;color:var(--ink);transition:transform .4s var(--ease-out)}
.ep__play svg{width:22px;height:22px;margin-left:3px}
.ep:hover .ep__play{transform:translate(-50%,-50%) scale(1.1)}
.ep__thumb iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ep__body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:8px;flex:1}
.ep__body small{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-3);font-weight:600}
.ep__body b{font-family:var(--serif);font-size:19px;font-weight:500;line-height:1.25}
.ep__body a{margin-top:auto;padding-top:10px;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--green)}
.guests{display:flex;flex-wrap:wrap;gap:10px}
.guests li{padding:12px 18px;border:1px solid rgba(255,255,255,.14);font-family:var(--serif);font-size:19px;color:#fff;transition:border-color .3s,transform .4s var(--ease-out)}
.guests li:hover{border-color:var(--gold);transform:translateY(-3px)}
.guests li small{display:block;font-family:var(--sans);font-size:11px;color:rgba(255,255,255,.55);letter-spacing:.04em;margin-top:3px}

/* ---------- stories (editorial) ---------- */
.prose{max-width:66ch;font-size:18px;line-height:1.8;color:var(--text)}
.prose p+p{margin-top:22px}
.prose .drop::first-letter{font-family:var(--serif);font-size:4.2em;line-height:.8;float:left;padding:8px 12px 0 0;color:var(--green)}
.pull{font-family:var(--serif);font-size:clamp(32px,3.8vw,52px);line-height:1.12;letter-spacing:-.02em;font-weight:500;color:var(--text);max-width:22ch}
.pull .em{color:var(--green)}
.storycard{position:relative;padding:34px 34px 30px;background:#fff;border:1px solid var(--line);overflow:hidden;transition:transform .5s var(--ease-out),box-shadow .5s}
.storycard::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--gold)}
.storycard:hover{transform:translateY(-4px);box-shadow:0 30px 50px -35px rgba(16,32,26,.4)}
.storycard i{display:block;font-style:normal;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-3);font-weight:600}
.storycard h3{margin-top:12px;font-family:var(--serif);font-size:26px;font-weight:500;letter-spacing:-.01em}
.storycard p{margin-top:12px;font-size:15.5px;line-height:1.65;color:var(--text-2)}
.sgrid{display:grid;grid-template-columns:1fr 1fr;gap:18px}

/* ---------- forms ---------- */
.form{display:grid;grid-template-columns:1fr 1fr;gap:16px 18px}
.form .full{grid-column:1/-1}
.ff{display:grid;gap:8px}
.ff label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--gold-2)}
.ff input,.ff select,.ff textarea{width:100%;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.18);color:#fff;font:inherit;font-size:16px;padding:16px 18px;outline:none;transition:border-color .3s,background .3s;border-radius:0;-webkit-appearance:none;appearance:none}
.ff input:focus,.ff select:focus,.ff textarea:focus{border-color:var(--gold);background:rgba(255,255,255,.07)}
.ff input::placeholder,.ff textarea::placeholder{color:rgba(255,255,255,.35)}
.ff textarea{min-height:130px;resize:vertical}
.ff select{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 10 10' fill='none' stroke='%23C9A961' stroke-width='1.4'><path d='M1 3l4 4 4-4'/></svg>");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px}
.ff select option{color:#111}
.form__foot{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin-top:8px}
.form__foot small{font-size:13px;color:rgba(255,255,255,.55);max-width:46ch;line-height:1.5}
.form-ok{display:none;padding:34px;border:1px solid rgba(201,169,97,.5);background:rgba(201,169,97,.08)}
.form-ok b{display:block;font-family:var(--serif);font-size:30px;font-weight:500;color:#fff}
.form-ok p{margin-top:10px;color:rgba(255,255,255,.75)}
.form.is-done{display:none}
.form.is-done+.form-ok{display:block}
.hp{display:none}
.expect{display:grid;gap:0}
.expect li{display:grid;grid-template-columns:48px 1fr;gap:18px;padding:22px 0;border-top:1px solid rgba(255,255,255,.12)}
.expect li:last-child{border-bottom:1px solid rgba(255,255,255,.12)}
.expect i{font-style:normal;font-family:var(--serif);font-size:24px;color:var(--gold-2)}
.expect b{display:block;font-size:16px;font-weight:600;color:#fff}
.expect span{display:block;margin-top:4px;font-size:14.5px;color:rgba(255,255,255,.65);line-height:1.55}

/* ---------- misc ---------- */
.gold-rule{height:1px;background:var(--gold-foil);background-size:220% 100%;animation:foil 7s linear infinite;opacity:.7}
.note-draft{display:none}
.nav__link.is-active{color:#fff}
.nav__link.is-active::after{transform:scaleX(1)}

@media (max-width:1024px){
  .phero__inner,.split,.day,.chapter,.shows2,.sgrid,.tgrid{grid-template-columns:1fr}
  .phero__frame{max-width:560px}
  .clock,.sticky{position:static}
  .story__line{left:8px}
  .chapter__dot{left:0}
  .chapter{padding-left:36px}
  .chapter:nth-child(even) .chapter__year{text-align:left}
  .chapter:nth-child(even) .chapter__body{order:0}
  .formats{grid-template-columns:1fr 1fr}
  .fmt:nth-child(2n){border-right:0}
  .fmt:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .ewall,.eps{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .form,.ewall,.ewall--2,.eps{grid-template-columns:1fr}
  .stop{grid-template-columns:1fr;gap:10px}
  .showcard{grid-template-columns:1fr}
  .showcard img{max-width:180px}
  .formats{grid-template-columns:1fr}
  .fmt{border-right:0;border-bottom:1px solid var(--line)}
  .mantra{grid-template-columns:1fr;gap:8px}
}

/* endorsement wall v2: seven quotes, one featured */
[data-d="7"]{transition-delay:.84s}
.ecard{display:flex;flex-direction:column}
.ecard p{flex:0 0 auto;margin-bottom:22px}
.ecard .who{margin-top:auto;padding-top:18px}
.ecard--feature{grid-column:1/-1;padding:44px 48px 38px}
.ecard--feature .mark{font-size:84px}
.ecard--feature p{font-size:clamp(22px,2.1vw,29px);line-height:1.32;max-width:1080px}
.ecard--feature .who b{font-size:17px}
@media (max-width:700px){.ecard--feature{padding:32px 26px 28px}.ecard--feature p{font-size:21px}}


/* media page gallery */
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.mgrid figure{margin:0;overflow:hidden;border-radius:10px;background:rgba(0,0,0,.04);aspect-ratio:4/3;animation:mgridIn .7s var(--ease-out) both}
@keyframes mgridIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.mgrid img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s cubic-bezier(.2,.7,.3,1)}
.mgrid figure:hover img{transform:scale(1.05)}
@media(max-width:640px){.mgrid{grid-template-columns:repeat(2,1fr);gap:10px}}


/* Keep the rotating periodic lockup on ONE row on phones.
   Widest phrase is 4 tiles + 3 word gaps (.35 each) + 6 flex gaps:
   4p + 1.05p + 6g <= container, so p <= (100vw - 40px gutter - 6g) / 5.05.
   Divided by 5.2 for headroom. */
@media (max-width:640px){
  .hero__spell .ptiles{--pt:min(66px,calc((100vw - 80px) / 5.2));gap:6px}
}
