/* Aly Pratkelis. One day of Colorado light: --bg and --fg are set by app.js from scroll position. */
@font-face{font-family:"Italiana";src:url(assets/fonts/italiana.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:300;src:url(assets/fonts/cormorant-italic-300.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:400;src:url(assets/fonts/cormorant-italic-400.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Instrument Sans";font-weight:400;src:url(assets/fonts/instrument-sans-400.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Instrument Sans";font-weight:500;src:url(assets/fonts/instrument-sans-500.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Instrument Sans";font-weight:600;src:url(assets/fonts/instrument-sans-600.woff2) format("woff2");font-display:swap}

:root{
  --bone:#efe7db; --sand:#e9d6bb; --apricot:#e3bf9c; --mauve:#c3a9bd; --iris:#8f87bd;
  --indigo:#1d1643; --midnight:#0a0812; --ink:#191420; --paper:#f4eee4; --ember:#ee7a35;
  --bg:var(--bone); --fg:var(--ink);
  --display:"Italiana","Didot",serif; --accent:"Cormorant Garamond","Georgia",serif; --sans:"Instrument Sans",system-ui,sans-serif;
  --gut:clamp(16px,3.2vw,48px); --vh:100vh;
}
@supports(height:100svh){:root{--vh:100svh}}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font:400 16px/1.6 var(--sans);overflow-x:clip;transition:color .45s}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-underline-offset:.2em;text-decoration-thickness:1px}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0;padding:0}
ul,ol{list-style:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
em{font-family:var(--accent);font-style:italic;font-weight:300;letter-spacing:-.01em}
:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.skip{position:fixed;left:12px;top:-60px;z-index:60;background:var(--ink);color:var(--paper);padding:10px 16px}
.skip:focus{top:12px}
.label{font:500 11px/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase}
h2{font:400 clamp(44px,8.4vw,132px)/.96 var(--display);letter-spacing:-.005em}
h3{font:400 clamp(30px,4.2vw,60px)/1.02 var(--display)}
.btn{display:inline-block;padding:14px 24px;background:var(--fg);color:var(--bg);font:500 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;border:1px solid var(--fg);border-radius:99px;transition:background .25s,color .25s}
.btn:hover{background:transparent;color:var(--fg)}
.btn-ghost{background:transparent;color:var(--fg)}
.btn-ghost:hover{background:var(--fg);color:var(--bg)}

/* No script: keep the dark chapters readable without the light engine */
html:not(.js) [data-light=blue],html:not(.js) [data-light=night]{background:var(--indigo);color:var(--paper)}

/* NAV */
.nav{position:fixed;inset:0 0 auto;z-index:40;display:flex;align-items:center;gap:clamp(16px,4vw,64px);padding:14px var(--gut);pointer-events:none}
.nav::before{content:"";position:absolute;inset:0 0 -22px;z-index:-1;background:linear-gradient(var(--bg) 58%,transparent);pointer-events:none}
.nav>*{pointer-events:auto}
.nav-mark svg{display:block;width:32px;height:32px;color:var(--fg);transition:color .45s}
.nav nav{flex:1;display:flex;justify-content:space-between;max-width:none}
.nav nav a{position:relative;font:600 11px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;padding:8px 0 8px 12px}
.nav nav a::before{content:"";position:absolute;left:0;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:currentColor;transform:scale(0);transition:transform .25s}
.nav nav a.on::before,.nav nav a:hover::before{transform:scale(1)}

/* 01 HERO */
.hero{height:calc(var(--vh)*2.7);position:relative}
.hero-pin{position:sticky;top:0;height:var(--vh);overflow:hidden}
.masthead{position:absolute;inset:clamp(52px,9vh,84px) 0 auto;margin:0;font-weight:400;text-align:center;line-height:.8}
.masthead-name{display:block;font:400 min(17vw,38vh)/.86 var(--display);text-transform:uppercase;white-space:nowrap;letter-spacing:calc(var(--track,0)*1em);will-change:letter-spacing}
.masthead-aly{position:absolute;z-index:3;left:calc(var(--gut) + .5vw);top:-.04em;font:300 italic min(10vw,22vh)/.8 var(--accent);color:var(--ember)}
.hero-figure{position:absolute;left:50%;bottom:0;height:calc(var(--vh)*.92);aspect-ratio:2/3;transform:translateX(-50%)}
.hero-arch,.hero-cut{position:absolute;inset:0;width:100%;height:100%}
.hero-arch{clip-path:inset(var(--a-t,100%) var(--a-x,50%) 0 var(--a-x,50%) round 50vh 50vh 0 0)}
.hero-arch img,.hero-cut{width:100%;height:100%;object-fit:cover;object-position:50% 100%}
.hero-side{position:absolute;bottom:clamp(24px,6vh,60px);font:400 clamp(24px,2.7vw,42px)/1.08 var(--display)}
.hero-side .label{display:block;margin-bottom:12px}
.hero-side-l{left:var(--gut)}
.hero-side-r{right:var(--gut);text-align:right;bottom:clamp(92px,13vh,120px)}
.hero-claim{position:absolute;left:var(--gut);bottom:clamp(24px,6vh,60px);width:min(30vw,calc(50vw - 31vh));font:400 clamp(46px,6.6vw,104px)/.94 var(--display);opacity:var(--claim,0);transform:translateY(calc((1 - var(--claim,0))*24px))}
.hero-claim em{display:block}
.hero-hint{position:absolute;left:50%;top:calc(var(--vh) - 34px);transform:translateX(-50%);display:none}

/* STATEMENT */
.statement{padding:clamp(90px,16vh,190px) var(--gut) clamp(70px,12vh,140px)}
.statement-text{max-width:22em;margin-top:28px;font:400 clamp(32px,5.3vw,84px)/1.06 var(--display)}
.statement-text span{opacity:.14;transition:opacity .3s}
.statement-text span.lit{opacity:1}
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,3vw,44px);margin-top:clamp(56px,10vh,110px);border-top:1px solid color-mix(in srgb,currentColor 35%,transparent);padding-top:22px}
.facts dt{font:400 clamp(40px,5.4vw,84px)/1 var(--display)}
.facts dd{margin-top:10px;font-size:14px;line-height:1.4;max-width:18em}

/* 02 BOOK */
.book{position:relative;height:calc(var(--vh)*6.4)}
.book-pin{position:sticky;top:0;height:var(--vh);overflow:hidden}
.book-kicker{position:absolute;left:var(--gut);top:clamp(70px,11vh,104px)}
.book-word{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:400 min(19vw,44vh,calc(128vw/var(--len,6)))/1 var(--display);white-space:nowrap;text-transform:uppercase;pointer-events:none}
.book-word span{display:block;transition:opacity .35s,letter-spacing .7s cubic-bezier(.2,.7,.2,1)}
.book-word span.swap{opacity:0;letter-spacing:.06em}
.book-arch{position:absolute;left:50%;top:50%;height:calc(var(--vh)*.8);aspect-ratio:2/3;transform:translate(-50%,-47%);border-radius:50vh 50vh 0 0;overflow:hidden;background:rgba(0,0,0,.08);box-shadow:0 30px 70px -30px rgba(50,25,10,.5)}
.look{position:absolute;inset:0;clip-path:inset(100% 0 0 0);will-change:clip-path}
.look:first-child{clip-path:none}
.look img{width:100%;height:100%;object-fit:cover;transform:scale(calc(1.14 - var(--in,1)*.14));will-change:transform}
.book-meta{position:absolute;left:var(--gut);bottom:clamp(24px,5vh,48px)}
.book-count{font:400 clamp(36px,4.4vw,68px)/1 var(--display)}
.book-count i{font:300 italic .8em var(--accent);margin:0 .1em;opacity:.7}
.book-note{margin-top:8px;font:italic 400 clamp(19px,1.7vw,25px)/1.1 var(--accent)}
.book-rail{position:absolute;right:var(--gut);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:8px}
.book-rail button{display:block;width:44px;height:60px;overflow:hidden;border-radius:22px 22px 0 0;opacity:.5;transition:opacity .25s,transform .25s}
.book-rail button img{width:100%;height:100%;object-fit:cover}
.book-rail button:hover,.book-rail button.on{opacity:1}
.book-rail button.on{transform:translateX(-8px)}

/* RANGE */
.range{position:relative;padding:clamp(80px,14vh,160px) var(--gut)}
.range-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:clamp(28px,5vh,56px)}
.range-head p{max-width:26em;font-size:15px}
.range-list li{border-top:1px solid color-mix(in srgb,currentColor 40%,transparent)}
.range-list li:last-child{border-bottom:1px solid color-mix(in srgb,currentColor 40%,transparent)}
.range-list button{display:block;width:100%;padding:.2em 0 .18em;text-align:left;font:400 clamp(34px,6.4vw,104px)/1.08 var(--display);text-transform:uppercase}
.range-list button span{display:inline-block;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.range-list button:hover span,.range-list button:focus-visible span{transform:translateX(.35em)}
.range-list li>img{display:none;width:min(62vw,300px);max-height:380px;object-fit:cover;margin:6px 0 18px}
.range-list li.open>img{display:block}
.range-float{position:fixed;left:0;top:0;z-index:20;width:clamp(200px,20vw,300px);aspect-ratio:3/4;object-fit:cover;pointer-events:none;border-radius:150px 150px 0 0;opacity:0;transition:opacity .25s;will-change:transform}
.range-float.show{opacity:1}
.range-foot{margin-top:28px;font:italic 400 clamp(22px,2.4vw,34px)/1.2 var(--accent)}
.range-foot span{display:block;opacity:.7}

/* 03 STAGE */
.stage{padding:clamp(80px,14vh,170px) var(--gut) clamp(50px,8vh,90px)}
.stage-open .label{margin-bottom:22px}
.stage-grid{display:grid;grid-template-columns:5fr 6fr;gap:clamp(24px,5vw,90px);margin-top:clamp(40px,8vh,90px);align-items:start}
.stage figcaption,.capitol figcaption{margin-top:10px;font-size:13px;line-height:1.4}
.stage-gown img{border-radius:40vw 40vw 0 0}
.titles li{display:grid;grid-template-columns:92px 1fr;gap:12px;padding:20px 0;border-top:1px solid color-mix(in srgb,currentColor 40%,transparent);font-size:15px}
.titles li span{font:500 11px/1.9 var(--sans);letter-spacing:.14em;text-transform:uppercase}
.titles b{display:block;font:400 clamp(26px,3vw,46px)/1.05 var(--display);margin-bottom:6px}
.stage-tv{margin-top:clamp(28px,6vh,64px);width:min(100%,520px);margin-left:auto}
.capitol{display:grid;grid-template-columns:6fr 5fr;gap:clamp(24px,5vw,90px);align-items:center;margin-top:clamp(70px,14vh,170px)}
.capitol-copy{order:-1}
.capitol-copy h3{margin-bottom:24px;font-size:clamp(40px,6vw,92px)}
.capitol-copy p{max-width:32em;margin-bottom:16px}
.capitol-photo{max-width:560px;margin-left:auto}
.capitol-photo img{border-radius:40vw 40vw 0 0}
.orgs{display:flex;flex-wrap:wrap;gap:6px 22px;margin-top:24px;font:italic 400 21px/1.25 var(--accent)}

/* CROSSING */
.crossing{height:calc(var(--vh)*.9);display:flex;align-items:center;justify-content:center;text-align:center;padding:0 var(--gut);font:300 italic clamp(38px,6.6vw,104px)/1 var(--accent)}

/* 04 SKY */
.sky{position:relative;padding:0}
.sky-head{position:relative;z-index:3;padding:clamp(40px,8vh,80px) var(--gut) 0;pointer-events:none;width:max-content;max-width:100%}
.sky-head .label{margin-bottom:18px}
.sky-how{margin-top:16px;font:italic 400 22px/1.2 var(--accent)}
.only-touch{display:none}
.sky-view{position:relative;height:calc(var(--vh)*.92);min-height:560px;margin-top:calc(var(--vh)*-.24);overflow:hidden;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.sky-view.grabbing{cursor:grabbing}
#skyCanvas{position:absolute;inset:0;width:100%;height:100%}
.sky-world{--s:min(50vw,calc(var(--vh)*.72));position:absolute;left:50%;top:50%;width:var(--s);height:var(--s);margin-left:calc(var(--s)*-.5 - 13vw);margin-top:calc(var(--s)*-.5);will-change:transform}
.sky-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.sky-lines line{stroke:var(--mauve);stroke-width:1.2;vector-effect:non-scaling-stroke;opacity:0;transition:opacity 1s}
.sky.seen .sky-lines line{opacity:.65}
.star{position:absolute;width:0;height:0;color:var(--paper)}
.star button{position:absolute;left:-44px;top:-44px;width:88px;height:88px;display:grid;place-items:center;border-radius:50%}
.star i{display:block;width:14px;height:14px;background:currentColor;border-radius:50%;box-shadow:0 0 22px 6px rgba(200,185,255,.55);transition:transform .35s,box-shadow .35s;animation:twinkle 4.2s ease-in-out infinite;animation-delay:calc(var(--n)*-.7s)}
.star.side-l b{left:auto;right:30px;top:-.5em;transform:none}
.star.side-r b{left:30px;top:-.5em;transform:none}
.star.next i{background:transparent;border:1.5px solid currentColor;box-shadow:0 0 16px 2px rgba(200,185,255,.3)}
.star b{position:absolute;top:66px;left:50%;transform:translateX(-50%);white-space:nowrap;font:400 clamp(19px,1.8vw,27px)/1 var(--display)}
.star button:hover i,.star.on i{transform:scale(1.5);box-shadow:0 0 34px 12px rgba(238,122,53,.55);background:var(--ember)}
.star.next.on i{background:var(--ember);border-color:var(--ember)}
.star.apex i{width:18px;height:18px;border-radius:0;clip-path:polygon(50% 0,59% 41%,100% 50%,59% 59%,50% 100%,41% 59%,0 50%,41% 41%);box-shadow:none;transform:scale(1.7);filter:drop-shadow(0 0 8px rgba(255,240,210,.9))}
.star.apex button:hover i,.star.apex.on i{transform:scale(2.3);background:var(--ember)}
.star.apex b{top:-.5em;left:34px;transform:none}
@keyframes twinkle{50%{opacity:.62}}
.paused .star i{animation-play-state:paused}
.star-card{position:absolute;z-index:4;right:var(--gut);top:50%;transform:translateY(-44%);width:min(420px,34vw);padding:20px;background:rgba(244,238,228,.96);color:var(--ink);border-radius:210px 210px 0 0}
.star-photo{height:clamp(150px,30vh,290px);overflow:hidden;border-radius:190px 190px 0 0}
.star-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.star-body{padding:18px 6px 4px}
.star-body h3{margin:8px 0 10px;font-size:clamp(32px,3vw,46px)}
.star-body p{font-size:15px;line-height:1.5}
.star-body .label{font-size:11px}
.star-link{margin-top:10px}
.star-step{display:flex;gap:8px;padding:12px 6px 2px}
.star-step button{width:44px;height:44px;border:1px solid currentColor;border-radius:50%;font-size:17px;line-height:1}
.star-step button:hover{background:var(--ink);color:var(--paper)}
.star-swap{animation:starin .45s ease}
@keyframes starin{from{opacity:0;transform:translateY(8px)}}

/* DREAMSCAPE */
.dream{padding:clamp(80px,14vh,170px) var(--gut) clamp(50px,8vh,100px)}
.dream-top .label{margin-bottom:22px}
.dream-spread{display:grid;grid-template-columns:5fr 6fr;gap:clamp(24px,5vw,90px);margin-top:clamp(40px,8vh,90px);align-items:start}
.dream-a img{border-radius:40vw 40vw 0 0}
.dream-lede{font:400 clamp(28px,3.2vw,50px)/1.1 var(--display);margin-bottom:24px}
.dream-copy p:not(.dream-lede):not(.dream-cta){max-width:34em}
.dream-do{display:flex;flex-wrap:wrap;gap:4px 22px;margin:22px 0 26px;font:italic 400 22px/1.3 var(--accent)}
.dream-cta{display:flex;flex-wrap:wrap;gap:10px}
.dream-b{grid-column:2;width:min(100%,560px);margin-left:auto;margin-top:-6vw}
.ticker{margin-top:clamp(60px,10vh,120px)}
.ticker-track{margin:18px calc(var(--gut)*-1) 0;overflow:hidden}
.ticker-run{display:flex;gap:.8em;width:max-content;font:400 clamp(36px,5.4vw,84px)/1.1 var(--display);white-space:nowrap;animation:tick 60s linear infinite}
.ticker-run span::after{content:"✦";margin-left:.8em;font-size:.32em;vertical-align:.7em;color:var(--mauve)}
.ticker:hover .ticker-run,.paused .ticker-run{animation-play-state:paused}
@keyframes tick{to{transform:translateX(-50%)}}
.press{margin-top:clamp(60px,10vh,120px)}
.press ul{margin-top:18px}
.press li{border-top:1px solid rgba(244,238,228,.28)}
.press li:last-child{border-bottom:1px solid rgba(244,238,228,.28)}
.press a{display:grid;grid-template-columns:4fr 3fr 1fr;gap:16px;align-items:baseline;padding:16px 0;text-decoration:none;transition:padding .3s}
.press a:hover{padding-left:14px}
.press span{font:400 clamp(26px,3vw,46px)/1.1 var(--display)}
.press em{font-size:21px}
.press i{font:500 11px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;text-align:right}

/* 05 FIRE */
.fire{height:calc(var(--vh)*2.2);position:relative}
.fire-pin{position:sticky;top:0;height:var(--vh);overflow:hidden;background:#000}
.fire-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:52% 40%;transform:scale(calc(1.18 - var(--f,0)*.18));filter:brightness(calc(.25 + var(--f,0)*.85));will-change:transform}
.fire-embers{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.fire-line{position:absolute;left:var(--gut);top:clamp(70px,13vh,130px);color:var(--paper);opacity:var(--f,0)}
.fire-pin::after{content:"";position:absolute;inset:0 0 auto;height:calc(var(--vh)*.3);background:linear-gradient(var(--bg),transparent);pointer-events:none}

/* COMP CARD */
.card-sec{display:grid;grid-template-columns:1fr minmax(0,auto);gap:clamp(30px,6vw,110px);align-items:center;padding:clamp(80px,14vh,170px) var(--gut)}
.card-copy .label{margin-bottom:20px}
.card-copy p:not(.label):not(.card-btns){max-width:26em;margin-top:18px}
.card-btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.comp-wrap{perspective:1600px}
.comp{position:relative;width:min(440px,86vw);aspect-ratio:5.5/8.5;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.comp.flip{transform:rotateY(180deg)}
.comp-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:var(--paper);color:var(--ink);overflow:hidden;box-shadow:0 30px 80px -20px rgba(0,0,0,.7)}
.comp-front img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.comp-name{position:absolute;left:0;right:0;top:14px;text-align:center;font:400 clamp(38px,9.4cqw,48px)/1 var(--display);text-transform:uppercase;color:var(--ink);font-size:min(46px,10.4vw)}
.comp-mark{position:absolute;right:14px;bottom:14px;width:36px;height:36px;color:var(--ink)}
.comp-back{transform:rotateY(180deg);padding:14px;display:flex;flex-direction:column;gap:12px}
.comp-frames{flex:1;min-height:0;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:6px}
.comp-frames img{width:100%;height:100%;min-height:0;object-fit:cover;object-position:50% 25%}
.comp-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px 6px}
.comp-stats dt{font:500 9px/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase;opacity:.7}
.comp-stats dd{font:400 21px/1.2 var(--display)}
.comp-rep{font:500 9.500px/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase}

/* CONTACT */
.contact{padding:clamp(60px,10vh,120px) var(--gut) clamp(70px,12vh,130px)}
.doors{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,2vw,28px);margin-top:clamp(30px,6vh,60px)}
.door{position:relative;display:flex;flex-direction:column;min-height:clamp(380px,62vh,600px);padding:clamp(110px,18vh,190px) clamp(18px,2.4vw,34px) 24px;border:1px solid rgba(244,238,228,.4);border-bottom-width:3px;border-radius:50vh 50vh 0 0;text-decoration:none;overflow:hidden;isolation:isolate;transition:color .4s,border-color .4s}
.door-glow{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#f7d9ad,#ee7a35 70%,#7d2f12);opacity:0;transition:opacity .5s}
.door:hover,.door:focus-visible{color:var(--midnight);border-color:#f7d9ad}
.door:hover .door-glow,.door:focus-visible .door-glow{opacity:1}
.door b{display:block;margin-top:14px;font:400 clamp(36px,4.4vw,68px)/1 var(--display)}
.door-note{display:block;margin-top:14px;font-size:15px;line-height:1.45}
.door-go{margin-top:auto;padding-top:18px;font:italic 400 24px/1 var(--accent)}
.speak{display:grid;grid-template-columns:1fr 1fr;gap:18px 24px;margin-top:clamp(50px,9vh,100px);max-width:900px;scroll-margin-top:90px}
.speak h3,.speak-note{grid-column:1/-1}
.speak-note{margin-top:-8px;font-size:15px;max-width:38em}
.field{display:flex;flex-direction:column;gap:6px}
.field-wide{grid-column:1/-1}
.field label{font:500 11px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase}
.field input,.field textarea{width:100%;padding:12px 2px;background:transparent;border:0;border-bottom:1px solid rgba(244,238,228,.55);border-radius:0;color:inherit;font:400 17px/1.4 var(--sans)}
.field input:focus,.field textarea:focus{outline:0;border-bottom:2px solid var(--ember)}
.field [aria-invalid=true]{border-bottom:2px solid var(--ember)}
.speak-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.speak-status{flex:1 1 280px;font-size:15px}

/* FOOTER */
.foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 40px;padding:30px var(--gut) clamp(90px,12vh,110px);border-top:1px solid rgba(244,238,228,.2)}
.foot-line{display:flex;align-items:center;gap:12px;font:400 26px/1 var(--display)}
.foot-line svg{width:34px;height:34px}
.foot ul{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:14px}
.foot-credit{width:100%;font-size:13px;opacity:.8}

/* THE DIAL */
.dial{position:fixed;right:var(--gut);bottom:14px;z-index:30;width:116px;color:var(--fg);transition:color .45s}
.dial svg{display:block;width:100%;height:auto;overflow:visible}
.dial-track{fill:none;stroke:currentColor;stroke-width:1;stroke-dasharray:2 4;opacity:.7}
.dial-horizon{stroke:currentColor;stroke-width:1}
.dial-sun{fill:var(--sun,#ee7a35)}
.dial-halo{fill:var(--sun,#ee7a35);opacity:.25}
.dial-range{position:absolute;left:0;top:0;width:100%;height:62px;margin:0;opacity:0;cursor:grab;touch-action:none}
.dial-range:active{cursor:grabbing}
.dial:has(.dial-range:focus-visible) svg{outline:2px solid currentColor;outline-offset:4px}
.dial-label{display:block;margin-top:5px;text-align:center;font:600 10px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap}

/* TABLET AND PHONE */
@media (max-width:980px){
  .star-card{position:relative;right:auto;top:auto;transform:none;width:min(92%,460px);margin:-30px auto 0}
  .sky-world{--s:min(70vw,calc(var(--vh)*.66));margin-left:calc(var(--s)*-.5)}
  .capitol,.stage-grid,.dream-spread{grid-template-columns:1fr}
  .capitol-copy{order:0}
  .capitol-photo{margin:0 auto;max-width:80%}
  .dream-b{grid-column:1;margin-top:0}
  .card-sec{grid-template-columns:1fr;justify-items:center}
  .card-copy{justify-self:start}
}
@media (max-width:760px){
  .nav{padding:10px var(--gut);gap:14px}
  .nav-mark svg{width:26px;height:26px}
  .nav nav a{font-size:10px;letter-spacing:.08em;padding:8px 0 8px 9px}
  .nav nav a::before{width:5px;height:5px;margin-top:-2.500px}
  .nav .opt{display:none}
  .masthead{top:86px}
  .masthead-name{font-size:17vw}
  .masthead-aly{font-size:16vw;left:var(--gut);top:-.68em}
  .hero-figure{height:calc(var(--vh)*.82);max-width:none}
  .hero-arch{clip-path:inset(var(--a-t,100%) var(--a-x,50%) 0 var(--a-x,50%) round 46vw 46vw 0 0)}
  .hero-side{display:none}
  .hero-claim{left:var(--gut);width:auto;bottom:calc(var(--vh)*.12);font-size:14vw;color:var(--paper);text-shadow:0 0 28px rgba(10,8,18,.75),0 1px 6px rgba(10,8,18,.55)}
  .facts{grid-template-columns:1fr 1fr}
  .book-word{font-size:min(22vw,calc(128vw/var(--len,6)));align-items:flex-start;padding-top:calc(var(--vh)*.09)}
  .book-kicker{top:58px}
  .book-arch{height:auto;width:min(78vw,calc(var(--vh)*.5));top:auto;bottom:calc(var(--vh)*.13);transform:translateX(-50%)}
  .book-meta{bottom:calc(var(--vh)*.02);display:flex;align-items:baseline;gap:12px}
  .book-count{font-size:32px}
  .book-note{margin:0;font-size:18px}
  .book-rail{display:none}
  .range-float{display:none}
  .sky-head{width:auto}
  .sky-view{height:calc(var(--vh)*.66);min-height:440px;margin-top:0}
  .sky-world{--s:min(78vw,calc(var(--vh)*.5))}
  .only-fine{display:none}.only-touch{display:inline}
  .star button{left:-26px;top:-26px;width:52px;height:52px}
  .star b{top:30px;font-size:17px}
  .star.side-l b{right:18px;top:-.5em}
  .star.side-r b{left:18px;top:-.5em}
  .star.apex b{left:24px;top:-.5em}
  .star.next b{left:auto;right:-14px;transform:none}
  .star.first b{left:-14px;transform:none}
  .star-card{width:calc(100% - var(--gut)*2);margin-top:0}
  .press a{grid-template-columns:1fr auto;gap:2px 12px}
  .press em{grid-column:1;grid-row:2}
  .press i{grid-column:2;grid-row:1}
  .fire-img{object-position:50% 40%}
  .doors{grid-template-columns:1fr}
  .door{min-height:0;padding-top:64px;border-radius:46vw 46vw 0 0;text-align:center;align-items:center}
  .speak{grid-template-columns:1fr}
  .dial{width:72px;right:10px;bottom:8px}
  .dial-range{height:40px}
  .dial-label{font-size:8px;letter-spacing:.1em}
}
@media (pointer:coarse){.only-fine{display:none}.only-touch{display:inline}.range-float{display:none}}

/* REDUCED MOTION / PAUSED: everything stays, nothing moves */
.rm .hero{height:auto}
.rm .hero-pin{position:relative}
.rm .book{height:auto}
.rm .book-pin{position:relative;height:auto;overflow:visible;padding:90px var(--gut) 40px}
.rm .book-word,.rm .book-meta,.rm .book-rail{display:none}
.rm .book-kicker{position:static;margin-bottom:24px}
.rm .book-arch{position:static;transform:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;height:auto;width:auto;aspect-ratio:auto;border-radius:0;background:none;box-shadow:none;overflow:visible}
.rm .look{position:relative;clip-path:none!important;inset:auto}
.rm .look img{transform:none;height:auto;aspect-ratio:2/3}
.rm .fire{height:auto}
.rm .fire-pin{position:relative}
.rm .fire-img{transform:none;filter:none}
.rm .fire-line{opacity:1}
.rm .statement-text span{opacity:1}
.rm .ticker-run,.rm .star i{animation:none}
.rm .comp{transition:none}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition-duration:.01ms!important}}

/* PRINT: the comp card only, letter landscape */
@media print{
  @page{size:letter landscape;margin:.4in}
  html,body{background:#fff!important;color:#000!important}
  body>*:not(main){display:none!important}
  main>*:not(.card-sec){display:none!important}
  .card-sec{display:block;padding:0}
  .card-copy{display:none}
  .comp-wrap{perspective:none}
  .comp{display:flex;gap:.3in;width:auto;aspect-ratio:auto;transform:none!important;transform-style:flat}
  .comp-face{position:relative;inset:auto;width:4.6in;height:7.1in;transform:none;box-shadow:none;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .comp-name{font-size:40px}
}

.dial-pause{display:block;font:500 11px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;text-decoration:underline;text-underline-offset:.3em}

/* Short landscape phones: the rail would run into the dial */
@media (max-height:520px){.book-rail{display:none}}