:root{
  --ivory:#F6F3EB;
  --paper:#FBF9F4;
  --ink:#171717;
  --blue:#2B4352;
  --dust:#A8BAC2;
  --grey:#C9C6BF;
  --warm:#DED6C9;
  --line:rgba(23,23,23,.19);
  --serif:'Playfair Display', Georgia, 'Times New Roman', serif;
  --sans:'Inter', Arial, Helvetica, sans-serif;
  --mono:'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --hand:'Caveat', 'Bradley Hand', cursive;
  --shadow:0 18px 60px rgba(24,29,31,.11);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--ivory)}
body{margin:0;background:var(--ivory);color:var(--ink);font-family:var(--sans);line-height:1.5;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;z-index:99;pointer-events:none;background:url('assets/noise.svg');opacity:.055;mix-blend-mode:multiply}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button{font:inherit;color:inherit}
::selection{background:var(--dust);color:var(--ink)}
.container{width:min(1240px,calc(100% - 56px));margin:0 auto}
.narrow{width:min(860px,calc(100% - 56px));margin:0 auto}

/* loader */
.site-loader{position:fixed;inset:0;z-index:1000;background:var(--ivory);display:grid;place-items:center;transition:opacity .45s ease,visibility .45s ease}
.site-loader.is-hidden{opacity:0;visibility:hidden}
.loader-mark{text-align:center}
.loader-ur{font-family:var(--serif);font-size:4rem;line-height:1;color:var(--blue);letter-spacing:-.08em}
.loader-line{width:92px;height:3px;background:var(--blue);margin:8px auto 16px;transform:rotate(-2deg)}
.loader-copy{font-family:var(--mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--blue)}

/* global nav */
.topbar{position:sticky;top:0;z-index:80;background:rgba(246,243,235,.9);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px;font-family:var(--serif);font-size:1.02rem;letter-spacing:.07em;text-transform:uppercase;white-space:nowrap}
.brand-mark{font-size:1.35rem;letter-spacing:-.08em;color:var(--blue);position:relative;padding-right:10px}
.brand-mark::after{content:"";position:absolute;left:0;right:7px;bottom:-2px;height:2px;background:var(--blue);transform:rotate(-2deg)}
.brand-name{opacity:.95}
.navlinks{display:flex;gap:25px;align-items:center;font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase}
.navlinks>a:not(.nav-cta){position:relative;opacity:.72}
.navlinks>a:not(.nav-cta)::after{content:"";position:absolute;left:0;right:100%;bottom:-6px;height:1px;background:var(--blue);transition:right .25s ease}
.navlinks>a:hover{opacity:1}.navlinks>a:hover::after{right:0}
.nav-cta{background:var(--blue);color:white;padding:11px 16px;border:1px solid var(--blue);transition:.25s ease}.nav-cta:hover{background:transparent;color:var(--blue)}
.menu{display:none;border:0;background:none;padding:8px;font-family:var(--mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.12em}

/* record ticker */
.record-strip{border-bottom:1px solid var(--line);overflow:hidden;background:var(--paper)}
.record-track{display:flex;width:max-content;animation:marquee 28s linear infinite}
.record-track span{display:inline-flex;align-items:center;gap:18px;padding:9px 28px;font-family:var(--mono);font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;color:#4e585e}
.record-track i{width:5px;height:5px;border-radius:50%;background:var(--blue);display:inline-block}
@keyframes marquee{to{transform:translateX(-50%)}}

/* recurring type */
.eyebrow,.meta,.kicker{font-family:var(--mono);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase}
.eyebrow{color:var(--blue)}
.hand{font-family:var(--hand);font-size:1.55rem;line-height:1.05;letter-spacing:.01em}
.serif{font-family:var(--serif)}
.underline{position:relative;display:inline-block}.underline::after{content:"";position:absolute;left:-2%;right:-2%;height:4px;background:var(--blue);bottom:.02em;transform:rotate(-1.2deg);opacity:.94}

/* paper language */
.paper{background:var(--paper);box-shadow:var(--shadow);position:relative}
.paper::before,.paper::after{content:"";position:absolute;z-index:-1;background:var(--warm);opacity:.55}
.paper::before{width:86px;height:24px;top:-12px;left:9%;transform:rotate(-4deg)}
.paper::after{width:70px;height:20px;bottom:-8px;right:12%;transform:rotate(3deg)}
.torn-top{clip-path:polygon(0 2%,6% 0,13% 2%,22% .4%,31% 1.8%,41% .5%,52% 2%,64% .5%,76% 1.5%,88% 0,100% 2%,100% 100%,0 100%)}
.torn-all{clip-path:polygon(1% 2%,8% .2%,17% 1.4%,28% 0,39% 1.8%,50% .2%,62% 1.5%,74% .1%,85% 1.7%,98% .5%,100% 12%,98.6% 23%,100% 37%,98.4% 52%,100% 68%,98.2% 83%,100% 98%,87% 99.2%,72% 98%,58% 100%,42% 98.5%,28% 100%,15% 98.4%,1% 100%,0 86%,1.4% 72%,0 56%,1.2% 39%,0 21%)}
.blue-note{background:var(--blue);color:white}
.dust-note{background:var(--dust)}

/* homepage hero */
.hero{position:relative;padding:64px 0 92px;border-bottom:1px solid var(--line);overflow:hidden}
.hero::after{content:"RECORD / 2026";position:absolute;right:-36px;top:50%;transform:rotate(90deg) translateY(-50%);transform-origin:center;font-family:var(--mono);font-size:.55rem;letter-spacing:.22em;color:rgba(43,67,82,.42)}
.hero-top{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:end}
.hero-title{margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(4.4rem,9.7vw,9.2rem);letter-spacing:-.068em;line-height:.86;text-transform:uppercase}
.hero-title span{display:block}.hero-title .small{font-size:.43em;letter-spacing:.12em;margin-left:.04em;margin-bottom:.03em}.hero-title .record{font-size:.72em;letter-spacing:.14em;margin-left:.2em;margin-top:.18em}
.hero-title .unheard{position:relative;display:inline-block;padding-bottom:.035em}.hero-title .unheard::after{content:"";position:absolute;left:2.5%;right:1.5%;bottom:-.055em;height:0;border-bottom:4px solid var(--blue);border-radius:50%;transform:rotate(-.65deg);transform-origin:left center;pointer-events:none}
.hero-intro{padding-bottom:8px}.hero-tagline{font-family:var(--serif);font-style:italic;font-size:clamp(1.55rem,2.8vw,2.45rem);line-height:1.16;margin:0 0 20px}.hero-intro>p{max-width:540px;color:#3e4549;margin:0 0 28px;font-size:.96rem}
.btns{display:flex;gap:10px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;gap:12px;justify-content:center;min-height:47px;padding:0 19px;border:1px solid var(--ink);font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;transition:.22s ease;background:transparent}.btn:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,0,0,.08)}.btn.primary{background:var(--blue);color:white;border-color:var(--blue)}.btn.soft{background:var(--paper);border-color:var(--line)}
.hero-collage{position:relative;height:655px;margin-top:64px}
.hero-photo{position:absolute;left:1%;top:9%;width:57%;height:72%;object-fit:cover;filter:grayscale(100%) contrast(.92);box-shadow:var(--shadow);z-index:1}
.hero-paper{position:absolute;right:1%;top:1%;width:36%;padding:40px 36px 38px;z-index:3;transform:rotate(1.1deg)}
.hero-paper .hand{font-size:2rem}.hero-paper .rule{height:1px;background:rgba(255,255,255,.45);margin:24px 0}.hero-paper .meta{opacity:.8}
.hero-note{position:absolute;right:2%;bottom:2%;width:27%;padding:26px 28px;transform:rotate(-2.2deg);z-index:4}
.hero-note::before{content:"";position:absolute;width:78px;height:22px;background:rgba(214,205,192,.76);top:-10px;left:35%;transform:rotate(5deg)}
.hero-entry{position:absolute;left:43%;bottom:1%;width:24%;padding:22px 20px;z-index:4;transform:rotate(1.7deg);border:1px solid var(--line)}
.hero-entry strong{font-family:var(--serif);font-weight:400;font-size:1.65rem;line-height:1.08;display:block;margin:10px 0}
.scribble-arrow{position:absolute;left:56%;top:2%;font-family:var(--hand);font-size:1.5rem;color:var(--blue);transform:rotate(-7deg);z-index:5}

/* section frame */
.section{padding:106px 0;border-bottom:1px solid var(--line);position:relative}
.section-header{display:grid;grid-template-columns:.28fr 1.25fr .58fr;gap:36px;align-items:start;margin-bottom:52px}
.section-no{font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--blue);padding-top:10px}
.section h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.8rem,5.8vw,5.8rem);line-height:.94;letter-spacing:-.04em;margin:0}
.section-lede{margin:8px 0 0;color:#4e5558;font-size:.88rem;max-width:340px}

/* One Question homepage */
.question-stage{display:grid;grid-template-columns:1.2fr .8fr;gap:28px;align-items:stretch}
.question-sheet{padding:52px 52px 46px;min-height:530px;display:flex;flex-direction:column;justify-content:space-between;border:1px solid rgba(23,23,23,.07)}
.question-sheet .q-no{font-family:var(--mono);font-size:.63rem;letter-spacing:.16em;color:var(--blue)}
.question-sheet .question{font-family:var(--serif);font-size:clamp(3rem,5.4vw,5.9rem);line-height:.97;letter-spacing:-.045em;margin:30px 0}.question em{position:relative}.question em::after{content:"";position:absolute;left:-7%;right:-8%;top:52%;height:55%;border:2px solid var(--dust);border-radius:50%;transform:rotate(-5deg);pointer-events:none}
.question-sheet-footer{display:flex;align-items:end;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding-top:22px}
.question-sheet-footer p{font-family:var(--serif);font-style:italic;font-size:1.2rem;margin:0;max-width:430px}
.q-collage{position:relative;min-height:530px;background:var(--blue);overflow:hidden}
.q-collage img{position:absolute;width:82%;height:78%;right:-8%;top:0;object-fit:cover;filter:grayscale(100%) contrast(.9)}
.q-collage .mini-note{position:absolute;left:7%;bottom:7%;width:58%;background:var(--paper);padding:22px;transform:rotate(-2deg);box-shadow:var(--shadow)}
.q-collage .mini-note::before{content:"";position:absolute;width:72px;height:18px;background:var(--warm);top:-8px;right:20%;transform:rotate(7deg)}
.q-collage .index{position:absolute;left:7%;top:7%;font-family:var(--mono);font-size:.6rem;letter-spacing:.17em;color:white;text-transform:uppercase;writing-mode:vertical-rl;transform:rotate(180deg)}

/* manifesto */
.manifesto{background:var(--paper)}
.manifesto-wrap{display:grid;grid-template-columns:1.18fr .82fr;gap:60px}
.manifesto-main{font-family:var(--serif);font-size:clamp(3rem,5.6vw,5.6rem);line-height:.98;letter-spacing:-.045em;margin:0}.manifesto-main em{color:var(--blue)}
.manifesto-side{padding-top:10px}.manifesto-side p{font-family:var(--serif);font-size:1.3rem;line-height:1.5;margin:0 0 26px}.manifesto-side .hand{color:var(--blue);font-size:1.8rem}
.manifesto-rule{height:1px;background:var(--line);margin:28px 0}

/* record cards */
.record-grid{display:grid;grid-template-columns:1.2fr .78fr .78fr;gap:18px;align-items:start}
.record-card{position:relative;background:var(--paper);border:1px solid var(--line);overflow:hidden;transition:.28s ease}.record-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.record-card:nth-child(2){margin-top:72px}.record-card:nth-child(3){margin-top:20px}
.record-card img{width:100%;height:290px;object-fit:cover;filter:grayscale(100%) contrast(.9);transition:.35s ease}.record-card.feature img{height:410px}.record-card:hover img{transform:scale(1.018)}
.record-card-copy{padding:24px}.record-card h3{font-family:var(--serif);font-weight:400;font-size:2rem;line-height:1.04;margin:9px 0 12px}.record-card p{font-size:.82rem;color:#545b5e;margin:0}.record-card .stamp{position:absolute;top:16px;right:16px;background:var(--paper);padding:8px 10px;font-family:var(--mono);font-size:.52rem;letter-spacing:.13em;text-transform:uppercase;border:1px solid var(--line);transform:rotate(2deg)}

/* research */
.research-band{background:var(--blue);color:white;border-bottom:0}
.research-band .section-no,.research-band .eyebrow{color:var(--dust)}
.research-band .section-lede{color:rgba(255,255,255,.72)}
.research-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:70px;align-items:start}
.research-index{border-top:1px solid rgba(255,255,255,.35);padding-top:18px}
.research-index .big{font-family:var(--serif);font-size:8rem;line-height:.8}.research-index p{font-family:var(--mono);font-size:.58rem;letter-spacing:.15em;text-transform:uppercase;color:var(--dust)}
.research-copy{max-width:700px}.research-copy h3{font-family:var(--serif);font-weight:400;font-size:clamp(2.2rem,4vw,4rem);line-height:1.02;margin:0 0 24px}.research-copy p{color:rgba(255,255,255,.82);font-size:.94rem}.research-copy .quote{font-family:var(--serif);font-style:italic;font-size:1.5rem;color:white;border-left:1px solid var(--dust);padding-left:22px;margin:32px 0}
.research-band .btn{color:white;border-color:rgba(255,255,255,.7)}

/* method */
.method-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.method{min-height:260px;padding:26px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);position:relative;background:rgba(251,249,244,.35)}
.method .num{font-family:var(--mono);font-size:.58rem;color:var(--blue);letter-spacing:.15em}.method h3{font-family:var(--serif);font-weight:400;font-size:2rem;margin:54px 0 10px}.method p{font-size:.78rem;color:#555e62;max-width:220px}.method .hand{position:absolute;right:14px;top:17px;color:var(--dust);transform:rotate(6deg);font-size:1.15rem}

/* take part */
.take-part{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.take-card{min-height:390px;padding:40px;position:relative;overflow:hidden;border:1px solid var(--line)}
.take-card.blue-note{border:0}.take-card h3{font-family:var(--serif);font-weight:400;font-size:clamp(2.5rem,4vw,4rem);line-height:1;margin:60px 0 16px;max-width:490px}.take-card p{max-width:480px;font-size:.86rem}.take-card .hand-corner{position:absolute;right:28px;top:24px;font-family:var(--hand);font-size:1.4rem;transform:rotate(5deg)}
.take-card .btn{position:absolute;bottom:34px;left:40px}.take-card.blue-note .btn{border-color:white;color:white}

/* footer */
.footer{padding:68px 0 28px;background:var(--paper)}
.footer-top{display:grid;grid-template-columns:1.45fr .7fr .7fr;gap:50px;align-items:start}
.footer-lockup{font-family:var(--serif);font-size:clamp(2.4rem,5vw,4.6rem);line-height:.9;letter-spacing:-.04em}.footer-lockup em{display:block;font-size:.45em;margin-top:16px;font-weight:400}
.footer-col{display:grid;gap:10px;font-family:var(--mono);font-size:.62rem;letter-spacing:.09em;text-transform:uppercase}.footer-col strong{color:var(--blue);font-size:.58rem;letter-spacing:.16em;margin-bottom:5px}.footer-col a{opacity:.75}.footer-col a:hover{opacity:1}
.footer-bottom{border-top:1px solid var(--line);margin-top:54px;padding-top:17px;display:flex;justify-content:space-between;gap:20px;font-family:var(--mono);font-size:.55rem;letter-spacing:.12em;text-transform:uppercase;color:#667075}

/* pages */
.page-hero{padding:72px 0 82px;border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.page-hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:60px;align-items:center}
.page-hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(4rem,8vw,7.8rem);letter-spacing:-.055em;line-height:.88;margin:18px 0 24px}
.page-hero .lede{max-width:640px;font-family:var(--serif);font-size:1.35rem;color:#444c50}
.page-collage{height:470px;position:relative}.page-collage .photo{position:absolute;right:0;top:0;width:76%;height:78%;object-fit:cover;filter:grayscale(100%) contrast(.9);box-shadow:var(--shadow)}
.page-collage .note{position:absolute;left:0;bottom:0;width:58%;padding:25px;transform:rotate(-3deg);z-index:2}.page-collage .note .hand{font-size:1.65rem}.page-collage .label{position:absolute;right:4%;bottom:3%;font-family:var(--mono);font-size:.55rem;letter-spacing:.15em;text-transform:uppercase;color:var(--blue)}
.prose{max-width:800px;margin:0 auto;font-family:var(--serif);font-size:1.2rem;line-height:1.65}.prose h2{font-size:2.7rem;line-height:1.04;font-weight:400;margin:2.2em 0 .6em}.prose h3{font-size:1.7rem;font-weight:400;margin:2em 0 .6em}.prose p{margin:1em 0}.prose strong{font-weight:500}.prose .policy-kicker{font-family:var(--mono);font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:var(--blue)}

/* form page */
.form-card{display:grid;grid-template-columns:.85fr 1.15fr;gap:0;border:1px solid var(--line);background:var(--paper);box-shadow:var(--shadow)}
.form-art{min-height:590px;background:var(--blue);position:relative;overflow:hidden}.form-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(100%) contrast(.9);opacity:.82}.form-art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(43,67,82,.05),rgba(43,67,82,.75))}.form-art-note{position:absolute;z-index:2;left:34px;right:34px;bottom:35px;color:white}.form-art-note .hand{font-size:2rem}.form-panel{padding:52px;display:flex;flex-direction:column;justify-content:center}.form-panel h2{font-family:var(--serif);font-size:3.5rem;line-height:.98;font-weight:400;margin:14px 0 20px}.form-panel p{color:#51595d;max-width:570px}.form-meta{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:28px 0}.form-meta div{padding:15px;border:1px solid var(--line);font-family:var(--mono);font-size:.58rem;letter-spacing:.09em;text-transform:uppercase;color:#596267}

/* stories */
.story-coming{display:grid;grid-template-columns:1.05fr .95fr;gap:26px}.story-cover{min-height:600px;position:relative;overflow:hidden;background:var(--blue)}.story-cover img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}.story-cover::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.6))}.story-cover-copy{position:absolute;left:34px;right:34px;bottom:34px;color:white;z-index:2}.story-cover-copy h2{font-family:var(--serif);font-weight:400;font-size:3rem;line-height:1;margin:8px 0}.story-side{display:grid;gap:20px}.story-note{padding:36px;min-height:210px;border:1px solid var(--line);position:relative}.story-note h3{font-family:var(--serif);font-weight:400;font-size:2.2rem;margin:10px 0}.story-note p{font-size:.84rem;color:#555e62}.story-note.blue-note p{color:rgba(255,255,255,.8)}

/* policies */
.policy-nav{display:flex;gap:9px;flex-wrap:wrap;margin-top:30px}.policy-nav a{padding:10px 13px;border:1px solid var(--line);font-family:var(--mono);font-size:.57rem;letter-spacing:.1em;text-transform:uppercase;background:var(--paper)}
.policy-list{display:grid;grid-template-columns:.35fr 1fr;gap:40px;padding:32px 0;border-top:1px solid var(--line)}.policy-list:first-child{border-top:0}.policy-list .policy-num{font-family:var(--mono);font-size:.58rem;letter-spacing:.14em;color:var(--blue);text-transform:uppercase}.policy-list h3{font-family:var(--serif);font-weight:400;font-size:2.3rem;line-height:1.05;margin:0 0 12px}.policy-list p{font-family:var(--serif);font-size:1.05rem;margin:.8em 0;color:#3f4649}.policy-list ul{font-family:var(--serif);font-size:1rem;padding-left:1.2em;color:#3f4649}

/* reveal */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}.reveal.delay1{transition-delay:.1s}.reveal.delay2{transition-delay:.2s}

@media(max-width:1000px){
 .hero-top,.page-hero-grid,.manifesto-wrap,.research-layout,.form-card,.story-coming{grid-template-columns:1fr}
 .hero-intro{max-width:700px}.hero-collage{height:720px}.hero-photo{left:0;top:7%;width:66%;height:60%}.hero-paper{right:0;top:1%;width:42%}.hero-note{right:1%;bottom:1%;width:31%}.hero-entry{left:31%;bottom:0;width:28%}
 .section-header{grid-template-columns:.25fr 1fr}.section-lede{grid-column:2}
 .record-grid{grid-template-columns:1fr 1fr}.record-card.feature{grid-column:1/-1}.record-card:nth-child(2),.record-card:nth-child(3){margin-top:0}
 .method-grid{grid-template-columns:1fr 1fr}.take-part,.question-stage{grid-template-columns:1fr}.q-collage{min-height:430px}
 .page-collage{height:420px;max-width:700px}.form-art{min-height:420px}
 .footer-top{grid-template-columns:1.4fr 1fr 1fr}
}
@media(max-width:760px){
 .container,.narrow{width:min(100% - 30px,1240px)}
 .nav{min-height:68px}.brand-name{display:none}.menu{display:block}.navlinks{display:none;position:absolute;left:0;right:0;top:68px;padding:22px 15px 28px;background:var(--ivory);border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:0}.navlinks.open{display:flex}.navlinks a{padding:13px 6px;border-bottom:1px solid var(--line)}.navlinks .nav-cta{margin-top:12px;text-align:center;border-bottom:0}
 .hero{padding-top:48px}.hero-top{gap:34px}.hero-title{font-size:clamp(4rem,20vw,6.6rem);line-height:.88}.hero-title .record{margin-top:.2em}.hero-title .unheard::after{border-bottom-width:3px;bottom:-.06em}.hero-collage{height:auto;margin-top:48px;display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}.hero-photo{position:relative;left:auto;top:auto;width:100%;height:430px;grid-column:1/-1;object-fit:cover}.hero-paper{position:relative;right:auto;top:auto;width:88%;grid-column:1/-1;justify-self:end;margin-top:-72px;padding:30px 25px;transform:rotate(1deg)}.hero-note{position:relative;left:auto;right:auto;bottom:auto;width:100%;grid-column:1;margin-top:4px;transform:rotate(-1.5deg)}.hero-entry{position:relative;left:auto;right:auto;bottom:auto;width:100%;grid-column:2;margin-top:28px;transform:rotate(1.2deg)}.scribble-arrow{display:none}
 .section{padding:78px 0}.section-header{grid-template-columns:1fr;gap:12px}.section-lede{grid-column:auto}.section h2{font-size:clamp(2.7rem,12vw,4.5rem)}
 .question-sheet{padding:34px 26px;min-height:510px}.question-sheet-footer{align-items:flex-start;flex-direction:column}.q-collage{min-height:390px}.q-collage img{width:88%}
 .manifesto-main{font-size:clamp(2.8rem,12vw,4.6rem)}
 .record-grid{grid-template-columns:1fr}.record-card.feature{grid-column:auto}.record-card img,.record-card.feature img{height:360px}
 .method-grid{grid-template-columns:1fr}.method{min-height:220px}.take-part{grid-template-columns:1fr}.take-card{min-height:360px;padding:32px}.take-card .btn{left:32px}
 .footer-top{grid-template-columns:1fr 1fr}.footer-lockup{grid-column:1/-1}.footer-bottom{flex-direction:column}
 .page-hero{padding:56px 0}.page-hero h1{font-size:clamp(3.6rem,15vw,6rem)}.page-collage{height:390px}.page-collage .photo{width:82%;height:74%}.page-collage .note{width:66%}
 .form-panel{padding:34px 26px}.form-panel h2{font-size:2.9rem}.form-meta{grid-template-columns:1fr}.form-art{min-height:360px}
 .story-cover{min-height:500px}.policy-list{grid-template-columns:1fr;gap:8px}
}
@media(max-width:480px){
 .hero-collage{height:auto;grid-template-columns:1fr}.hero-photo{width:100%;height:360px;grid-column:1}.hero-paper{width:92%;grid-column:1;margin-top:-56px}.hero-note{width:88%;grid-column:1;justify-self:start;margin-top:2px}.hero-entry{width:82%;grid-column:1;justify-self:end;margin-top:4px}.hero-title{font-size:clamp(3.6rem,19vw,5rem);letter-spacing:-.055em}
 .question-sheet .question{font-size:clamp(2.7rem,13vw,4rem)}.q-collage{min-height:360px}.q-collage .mini-note{width:69%}
 .footer-top{grid-template-columns:1fr}.footer-lockup{grid-column:auto}.record-card img,.record-card.feature img{height:300px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}.record-track{animation:none}.reveal{transition:none;opacity:1;transform:none}.btn,.record-card{transition:none}}

/* v1.1 collision safeguards */
.hero-title,.section h2,.page-hero h1{overflow-wrap:normal;word-break:normal}
.hero-collage>*{max-width:100%}
@media (min-width:761px) and (max-width:1120px){
  .hero-title{font-size:clamp(4.2rem,9vw,7rem)}
  .hero-paper .hand{font-size:1.7rem}
  .hero-entry strong{font-size:1.4rem}
}
@media(max-width:760px){
  .section-header{margin-bottom:38px}
  .page-hero-grid{gap:34px}
}

/* v1.2 final homepage polish */
html{scroll-padding-top:96px}
.topbar{background:rgba(246,243,235,.965);box-shadow:0 5px 18px rgba(23,23,23,.035)}
.section{scroll-margin-top:92px}
.hero{padding-bottom:56px}
.hero-title .unheard{padding-bottom:.075em}
.hero-title .unheard::after{
  left:4%;
  right:5%;
  bottom:-.095em;
  height:7px;
  border:0;
  background:var(--blue);
  border-radius:0;
  clip-path:polygon(0 44%,7% 22%,15% 38%,25% 18%,35% 37%,48% 14%,59% 34%,72% 16%,83% 34%,92% 20%,100% 39%,99% 68%,90% 55%,80% 72%,68% 56%,56% 76%,43% 59%,31% 78%,20% 58%,9% 74%,1% 61%);
  transform:rotate(-.75deg);
  opacity:.97;
}
.hero-collage{height:590px;margin-top:54px}
.hero-photo{left:2%;top:7%;width:58%;height:74%}
.hero-paper{right:1%;top:0;width:36%;padding:40px 36px 38px}
.hero-note{right:2%;bottom:14%;width:27%;padding:24px 26px;z-index:5}
.hero-entry{left:45%;bottom:0;width:24%;z-index:6;transform:rotate(1.1deg)}
.scribble-arrow{display:none}

/* Keep decorative layers intentional: no half-hidden copy. */
.hero-note,.hero-entry,.hero-paper{isolation:isolate}

@media(max-width:1000px){
  .hero{padding-bottom:48px}
  .hero-collage{height:650px;margin-top:48px}
  .hero-photo{left:0;top:6%;width:64%;height:61%}
  .hero-paper{right:0;top:0;width:42%}
  .hero-note{right:0;bottom:17%;width:31%}
  .hero-entry{left:34%;bottom:0;width:29%}
}
@media(max-width:760px){
  html{scroll-padding-top:78px}
  .section{scroll-margin-top:76px}
  .hero{padding-bottom:40px}
  .hero-title .unheard::after{height:5px;bottom:-.105em;left:4%;right:6%}
  .hero-collage{height:auto;margin-top:42px}
  .hero-photo{position:relative;left:auto;top:auto;width:100%;height:430px}
  .hero-paper{position:relative;right:auto;top:auto;width:88%;margin-top:-64px}
  .hero-note{position:relative;right:auto;bottom:auto;width:100%;margin-top:4px}
  .hero-entry{position:relative;left:auto;bottom:auto;width:100%;margin-top:18px}
}
@media(max-width:480px){
  .hero-photo{height:360px}
  .hero-paper{width:92%;margin-top:-52px}
  .hero-note{width:88%}
  .hero-entry{width:82%;margin-top:8px}
}

/* v1.3 — handwritten metadata, collision cleanup, living-motion pass */

/* Small editorial metadata now uses the pencil/handwritten voice.
   Navigation, buttons, ticker and utility UI stay monospaced for clarity. */
.eyebrow,
.meta,
.kicker,
.section-no,
.question-sheet .q-no,
.q-collage .index,
.record-card .stamp,
.research-index p,
.method .num,
.page-collage .label,
.prose .policy-kicker,
.policy-list .policy-num{
  font-family:var(--hand);
  font-size:1.08rem;
  line-height:1;
  letter-spacing:.015em;
  text-transform:none;
  font-weight:500;
}

/* Slightly smaller where the annotation is intentionally quiet. */
.page-collage .label,
.record-card .stamp,
.method .num,
.research-index p,
.policy-list .policy-num{
  font-size:.98rem;
}

/* Page hero: give large editorial lines enough breathing room. */
.page-hero h1{
  line-height:.93;
}

/* Page collages should feel layered, not collided.
   Photo occupies the upper field; note lives in the open lower field. */
.page-collage{
  height:500px;
  min-height:500px;
  overflow:visible;
}
.page-collage .photo{
  top:0;
  right:0;
  width:78%;
  height:66%;
  z-index:1;
  transform-origin:center center;
  animation:pagePhotoFloat 9.5s ease-in-out infinite alternate;
}
.page-collage .note{
  left:3%;
  bottom:2%;
  width:52%;
  z-index:3;
  transform:rotate(-2.2deg);
  animation:pageNoteFloat 7.5s ease-in-out infinite alternate;
}
.page-collage .label{
  right:4%;
  bottom:5%;
  z-index:4;
}

/* The homepage collage gets a very subtle living-record motion. */
.hero-photo{
  transform-origin:center center;
  animation:heroPhotoBreath 13s ease-in-out infinite alternate;
}
.hero-paper{
  animation:heroPaperFloat 8s ease-in-out infinite alternate;
}
.hero-note{
  animation:heroNoteFloat 7s ease-in-out infinite alternate;
}
.hero-entry{
  animation:heroEntryFloat 9s ease-in-out infinite alternate;
}

/* Editorial imagery gently breathes instead of feeling static. */
.record-card img,
.story-cover img,
.q-collage img,
.form-art img{
  transform-origin:center center;
  animation:editorialBreath 12s ease-in-out infinite alternate;
}
.record-card:nth-child(2) img{animation-delay:-3.5s}
.record-card:nth-child(3) img{animation-delay:-6s}
.q-collage img{animation-duration:14s}
.form-art img{animation-duration:15s}

/* Paper notes move independently by only a few pixels. */
.q-collage .mini-note{
  animation:miniNoteFloat 7.2s ease-in-out infinite alternate;
}
.take-card{
  transition:transform .32s ease, box-shadow .32s ease;
}
.take-card:hover{
  transform:translateY(-5px) rotate(.15deg);
  box-shadow:var(--shadow);
}

@keyframes pagePhotoFloat{
  0%{transform:translate3d(0,0,0) scale(1)}
  100%{transform:translate3d(0,-8px,0) scale(1.012)}
}
@keyframes pageNoteFloat{
  0%{transform:translate3d(0,0,0) rotate(-2.2deg)}
  100%{transform:translate3d(5px,-7px,0) rotate(-1.25deg)}
}
@keyframes heroPhotoBreath{
  0%{transform:translate3d(0,0,0) scale(1)}
  100%{transform:translate3d(-5px,-6px,0) scale(1.012)}
}
@keyframes heroPaperFloat{
  0%{transform:translate3d(0,0,0) rotate(1.1deg)}
  100%{transform:translate3d(0,-6px,0) rotate(.6deg)}
}
@keyframes heroNoteFloat{
  0%{transform:translate3d(0,0,0) rotate(-2.2deg)}
  100%{transform:translate3d(-4px,-7px,0) rotate(-1.3deg)}
}
@keyframes heroEntryFloat{
  0%{transform:translate3d(0,0,0) rotate(1.1deg)}
  100%{transform:translate3d(4px,-5px,0) rotate(.45deg)}
}
@keyframes editorialBreath{
  0%{transform:scale(1) translate3d(0,0,0)}
  100%{transform:scale(1.025) translate3d(0,-4px,0)}
}
@keyframes miniNoteFloat{
  0%{transform:translate3d(0,0,0) rotate(-2deg)}
  100%{transform:translate3d(5px,-6px,0) rotate(-1deg)}
}

/* Tablet: retain separation between photo and note. */
@media(max-width:1000px){
  .page-collage{height:470px;min-height:470px}
  .page-collage .photo{width:78%;height:64%}
  .page-collage .note{left:2%;bottom:2%;width:54%}
}

/* Mobile: stop using overlap entirely for page hero collages.
   The editorial feeling comes from rotation, paper and motion instead. */
@media(max-width:760px){
  .eyebrow,.meta,.kicker,.section-no,
  .question-sheet .q-no,.q-collage .index,.record-card .stamp,
  .research-index p,.method .num,.page-collage .label,
  .prose .policy-kicker,.policy-list .policy-num{
    font-size:1rem;
  }
  .page-hero h1{line-height:.95}
  .page-collage{
    height:auto;
    min-height:0;
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
    max-width:none;
  }
  .page-collage .photo{
    position:relative;
    right:auto;
    top:auto;
    width:92%;
    height:330px;
    justify-self:end;
  }
  .page-collage .note{
    position:relative;
    left:auto;
    bottom:auto;
    width:72%;
    justify-self:start;
    margin-top:-18px;
  }
  .page-collage .label{
    position:relative;
    right:auto;
    bottom:auto;
    justify-self:end;
    margin-right:4%;
  }
}

@media(max-width:480px){
  .page-collage .photo{width:100%;height:300px}
  .page-collage .note{width:82%;margin-top:-10px}
}

@media(prefers-reduced-motion:reduce){
  .hero-photo,.hero-paper,.hero-note,.hero-entry,
  .page-collage .photo,.page-collage .note,
  .record-card img,.story-cover img,.q-collage img,.form-art img,
  .q-collage .mini-note{
    animation:none !important;
  }
  .take-card:hover{transform:none}
}

/* v1.4 — stronger handwritten system, cleaner collisions, better motion, moodboard dash */

/* Make editorial micro-copy clearly handwritten across the site. */
.eyebrow,
.meta,
.kicker,
.section-no,
.question-sheet .q-no,
.q-collage .index,
.record-card .stamp,
.research-index p,
.method .num,
.page-collage .label,
.prose .policy-kicker,
.policy-list .policy-num{
  font-family:var(--hand) !important;
  font-size:1.12rem !important;
  font-weight:500 !important;
  line-height:1.06 !important;
  letter-spacing:0 !important;
  text-transform:none !important;
}

.q-collage .index,
.record-card .stamp,
.page-collage .label,
.research-index p,
.method .num,
.policy-list .policy-num{
  font-size:1rem !important;
}

/* Keep functional utility blocks readable. */
.navlinks,
.nav-cta,
.btn,
.footer-col,
.footer-bottom,
.form-meta div,
.record-strip .record-track,
.loader-copy{
  font-family:var(--mono);
}

/* Hero wordmark underline — closer to the moodboard brush dash. */
.hero-title .unheard{
  padding-bottom:.12em;
}
.hero-title .unheard::after{
  left:1%;
  right:1%;
  bottom:-.20em;
  height:22px;
  background:url('assets/unheard-underline.svg') center / 100% 100% no-repeat;
  border:0;
  clip-path:none;
  transform:none;
  border-radius:0;
  opacity:1;
}

/* Give the first homepage image a better crop and a more alive feel. */
.hero-photo,
.page-collage .photo,
.q-collage img,
.form-art img,
.record-card img,
.story-cover img{
  object-position:center 32%;
  filter:grayscale(100%) contrast(.93) brightness(1.02);
  will-change:transform;
}

.hero-photo{
  object-position:center 30%;
}

/* Light movement over the hero image to suggest a living sky. */
.hero-collage::before{
  content:"";
  position:absolute;
  left:2%;
  top:7%;
  width:58%;
  height:74%;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(115deg, rgba(255,255,255,0) 24%, rgba(255,255,255,.085) 42%, rgba(255,255,255,0) 61%);
  mix-blend-mode:screen;
  animation:skySweep 18s ease-in-out infinite;
}

/* Stronger but still subtle motion on imagery and notes. */
.hero-photo{animation:heroPhotoBreathV14 16s ease-in-out infinite alternate;}
.hero-paper{animation:heroPaperFloatV14 10s ease-in-out infinite alternate;}
.hero-note{animation:heroNoteFloatV14 9s ease-in-out infinite alternate;}
.hero-entry{animation:heroEntryFloatV14 11s ease-in-out infinite alternate;}
.page-collage .photo{animation:pagePhotoFloatV14 13s ease-in-out infinite alternate;}
.page-collage .note{animation:pageNoteFloatV14 9s ease-in-out infinite alternate;}
.record-card img,.story-cover img,.q-collage img,.form-art img{animation:editorialBreathV14 15s ease-in-out infinite alternate;}
.q-collage .mini-note{animation:miniNoteFloatV14 8.2s ease-in-out infinite alternate;}

@keyframes skySweep{
  0%{transform:translateX(-8%) skewX(-8deg);opacity:.15}
  35%{opacity:.42}
  100%{transform:translateX(8%) skewX(-8deg);opacity:.12}
}
@keyframes heroPhotoBreathV14{
  0%{transform:translate3d(0,0,0) scale(1)}
  100%{transform:translate3d(-7px,-10px,0) scale(1.04)}
}
@keyframes heroPaperFloatV14{
  0%{transform:translate3d(0,0,0) rotate(1.1deg)}
  100%{transform:translate3d(2px,-9px,0) rotate(.45deg)}
}
@keyframes heroNoteFloatV14{
  0%{transform:translate3d(0,0,0) rotate(-2.2deg)}
  100%{transform:translate3d(-5px,-9px,0) rotate(-1.15deg)}
}
@keyframes heroEntryFloatV14{
  0%{transform:translate3d(0,0,0) rotate(1.1deg)}
  100%{transform:translate3d(6px,-6px,0) rotate(.35deg)}
}
@keyframes pagePhotoFloatV14{
  0%{transform:translate3d(0,0,0) scale(1)}
  100%{transform:translate3d(0,-10px,0) scale(1.03)}
}
@keyframes pageNoteFloatV14{
  0%{transform:translate3d(0,0,0) rotate(-2.2deg)}
  100%{transform:translate3d(6px,-7px,0) rotate(-1.1deg)}
}
@keyframes editorialBreathV14{
  0%{transform:scale(1) translate3d(0,0,0)}
  100%{transform:scale(1.035) translate3d(0,-6px,0)}
}
@keyframes miniNoteFloatV14{
  0%{transform:translate3d(0,0,0) rotate(-2deg)}
  100%{transform:translate3d(7px,-7px,0) rotate(-.8deg)}
}

/* Safer layout spacing on page heroes and footer. */
.page-hero-grid{align-items:start;}
.page-collage{
  margin-top:10px;
  height:520px;
  min-height:520px;
  isolation:isolate;
}
.page-collage .photo{
  width:76%;
  height:68%;
}
.page-collage .note{
  left:2%;
  bottom:3%;
  width:54%;
}
.page-collage .label{
  right:3%;
  bottom:7%;
}

.footer-lockup{
  max-width:510px;
  line-height:.9;
}
.footer-lockup em{
  display:block;
  clear:both;
  position:relative;
  margin-top:24px;
  padding-top:6px;
  line-height:1.12;
  font-style:italic;
}

@media(max-width:1000px){
  .hero-collage::before{left:0; top:6%; width:64%; height:61%;}
  .page-collage{height:490px;min-height:490px}
  .page-collage .photo{width:78%;height:64%}
  .page-collage .note{width:58%}
}

@media(max-width:760px){
  .hero-title .unheard::after{bottom:-.18em;height:18px}
  .hero-collage::before{left:0;top:0;width:100%;height:430px}
  .page-hero{padding-bottom:92px}
  .page-hero-grid{gap:40px}
  .page-collage{height:auto;min-height:0;margin-top:6px;display:grid;gap:16px}
  .page-collage .photo{position:relative;width:100%;height:340px;justify-self:end}
  .page-collage .note{position:relative;width:min(78%,420px);left:auto;bottom:auto;justify-self:start;margin-top:-2px}
  .page-collage .label{position:relative;right:auto;bottom:auto;justify-self:end;margin-right:2px}
  .footer-lockup{max-width:100%}
  .footer-lockup em{margin-top:20px;line-height:1.1}
}

@media(max-width:480px){
  .hero-title .unheard::after{height:16px;bottom:-.16em}
  .hero-collage::before{height:360px}
  .page-collage .photo{height:310px}
  .page-collage .note{width:84%}
  .footer-lockup em{font-size:.48em}
}

@media(prefers-reduced-motion:reduce){
  .hero-collage::before,
  .hero-photo,.hero-paper,.hero-note,.hero-entry,
  .page-collage .photo,.page-collage .note,
  .record-card img,.story-cover img,.q-collage img,.form-art img,
  .q-collage .mini-note{
    animation:none !important;
  }
}

/* v1.5 — corrected hero image, visible sky motion, clean today circle, no UNHEARD underline */

/* Remove the hero underline completely. */
.hero-title .unheard::after{display:none !important;content:none !important;background:none !important;border:0 !important;}
.hero-title .unheard{padding-bottom:0 !important;}

/* Hand-drawn oval around "today" — positioned as a full oval, not a crossed line. */
.question em{position:relative;display:inline-block;z-index:1;}
.question em::after{
  content:"" !important;
  position:absolute !important;
  left:-13% !important;
  right:-13% !important;
  top:39% !important;
  height:74% !important;
  border:0 !important;
  border-radius:0 !important;
  background:url('assets/today-oval-final.svg') center / 100% 100% no-repeat !important;
  transform:rotate(-2deg) !important;
  pointer-events:none;
  z-index:-1;
}

/* New high-resolution homepage photograph. */
.hero-photo-frame{
  position:absolute;
  left:1.5%;
  top:7%;
  width:60%;
  height:75%;
  overflow:hidden;
  box-shadow:var(--shadow);
  z-index:1;
  background:#d8d5ce;
}
.hero-photo-frame .hero-photo{
  position:absolute !important;
  inset:-2% !important;
  left:auto !important;
  top:auto !important;
  width:104% !important;
  height:104% !important;
  max-width:none !important;
  object-fit:cover;
  object-position:center 45%;
  filter:grayscale(100%) contrast(1.02) brightness(1.03);
  z-index:1;
  animation:heroSceneMove 15s ease-in-out infinite alternate !important;
  transform-origin:center 42%;
  will-change:transform,object-position;
}

/* Separate animated cloud-light layer so the image reads as genuinely alive. */
.sky-motion{
  position:absolute;
  left:-24%;
  top:-12%;
  width:150%;
  height:60%;
  z-index:2;
  pointer-events:none;
  opacity:.26;
  mix-blend-mode:screen;
  filter:blur(18px);
  background:
    radial-gradient(ellipse at 18% 48%, rgba(255,255,255,.55) 0 8%, rgba(255,255,255,0) 27%),
    radial-gradient(ellipse at 48% 28%, rgba(255,255,255,.36) 0 10%, rgba(255,255,255,0) 30%),
    radial-gradient(ellipse at 78% 50%, rgba(255,255,255,.46) 0 9%, rgba(255,255,255,0) 28%);
  animation:cloudDrift 13s linear infinite alternate;
  will-change:transform,opacity;
}
.sky-motion::after{
  content:"";
  position:absolute;
  inset:10% -10% 0;
  background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.14) 47%,transparent 72%);
  animation:cloudLight 9s ease-in-out infinite alternate;
}

@keyframes heroSceneMove{
  0%{transform:scale(1.02) translate3d(0,0,0);object-position:48% 43%;}
  100%{transform:scale(1.075) translate3d(-10px,-7px,0);object-position:54% 48%;}
}
@keyframes cloudDrift{
  0%{transform:translate3d(-4%,0,0) scale(1);opacity:.16;}
  50%{opacity:.34;}
  100%{transform:translate3d(12%,5px,0) scale(1.07);opacity:.22;}
}
@keyframes cloudLight{
  from{transform:translateX(-9%);opacity:.3;}
  to{transform:translateX(12%);opacity:.8;}
}

/* Old collage sky overlay is no longer needed with the real animated sky layer. */
.hero-collage::before{display:none !important;}

@media(max-width:1000px){
  .hero-photo-frame{left:0;top:6%;width:64%;height:61%;}
}
@media(max-width:760px){
  .hero-photo-frame{position:relative;left:auto;top:auto;width:100%;height:430px;grid-column:1;overflow:hidden;}
  .hero-photo-frame .hero-photo{position:absolute !important;inset:-2% !important;width:104% !important;height:104% !important;}
  .sky-motion{height:56%;}
  .question em::after{left:-10% !important;right:-10% !important;top:41% !important;height:70% !important;}
}
@media(max-width:480px){
  .hero-photo-frame{height:360px;}
}

@media(prefers-reduced-motion:reduce){
  .hero-photo-frame .hero-photo,.sky-motion,.sky-motion::after{animation:none !important;}
}

/* v1.6 FINAL — precise circle, true animated sky, max-quality hero, final layout QA */

/* No underline below UNHEARD. */
.hero-title .unheard::after{
  display:none !important;
  content:none !important;
}
.hero-title .unheard{padding-bottom:0 !important;}

/* Full hand-drawn oval around the entire word "today?".  The stroke sits above
   the paper, so the top half can never disappear behind the sheet background. */
.question em{
  position:relative !important;
  display:inline-block !important;
  z-index:2 !important;
  isolation:isolate;
  white-space:nowrap;
}
.question em::after{
  content:"" !important;
  position:absolute !important;
  left:-11% !important;
  top:-10% !important;
  width:122% !important;
  height:122% !important;
  right:auto !important;
  bottom:auto !important;
  z-index:3 !important;
  pointer-events:none !important;
  background:url('assets/today-oval-final.svg') center / 100% 100% no-repeat !important;
  border:0 !important;
  border-radius:0 !important;
  clip-path:none !important;
  transform:rotate(-2.2deg) !important;
  opacity:.95 !important;
}

/* Maximum-quality homepage hero. */
.hero-photo-frame{
  overflow:hidden;
  background:#c7c6c2;
}
.hero-photo-frame .hero-photo{
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center 49% !important;
  filter:grayscale(100%) contrast(1.04) brightness(1.02) !important;
  animation:heroSceneFinal 18s ease-in-out infinite alternate !important;
  transform-origin:center center;
  z-index:1;
}

/* Real sky crop from the same hi-res photograph, independently animated. */
.hero-sky{
  position:absolute;
  z-index:2;
  top:-2%;
  left:-7%;
  width:114%;
  height:47%;
  max-width:none;
  object-fit:cover;
  object-position:center top;
  filter:grayscale(100%) contrast(1.04) brightness(1.03);
  pointer-events:none;
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 72%,rgba(0,0,0,.88) 82%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 0%,#000 72%,rgba(0,0,0,.88) 82%,transparent 100%);
  animation:heroSkyFinal 15s ease-in-out infinite alternate;
  will-change:transform;
}

/* Remove old synthetic sky overlay completely. */
.sky-motion,.sky-motion::after,.hero-collage::before{display:none !important;}

@keyframes heroSceneFinal{
  0%{transform:scale(1.002) translate3d(0,0,0)}
  100%{transform:scale(1.035) translate3d(-5px,-4px,0)}
}
@keyframes heroSkyFinal{
  0%{transform:translate3d(-1.5%,0,0) scale(1.015)}
  45%{transform:translate3d(1.8%,-2px,0) scale(1.035)}
  100%{transform:translate3d(4.8%,1px,0) scale(1.055)}
}

/* Final collision safeguards. */
.hero-paper,.hero-note,.hero-entry,.page-collage .note,.q-collage .mini-note{
  overflow:visible;
}
.question-sheet{overflow:visible;}
.question-stage{isolation:isolate;}
.page-hero-grid{align-items:start;}

/* Desktop spacing is deliberately generous but never clipped by the sticky nav. */
.page-hero{padding-top:74px;padding-bottom:96px;}
.page-hero h1{margin-bottom:28px;}

/* The handwritten system should be unmistakably consistent. */
.eyebrow,.meta,.kicker,.section-no,.question-sheet .q-no,.q-collage .index,
.record-card .stamp,.research-index p,.method .num,.page-collage .label,
.prose .policy-kicker,.policy-list .policy-num{
  font-family:var(--hand) !important;
  font-style:normal !important;
  font-weight:500 !important;
  letter-spacing:0 !important;
  text-transform:none !important;
}

@media(max-width:1000px){
  .hero-sky{height:46%;}
  .question em::after{left:-10% !important;width:120% !important;top:-8% !important;height:120% !important;}
}

@media(max-width:760px){
  .hero-photo-frame .hero-photo{object-position:center 47% !important;}
  .hero-sky{top:-2%;left:-8%;width:116%;height:45%;}
  .question em::after{left:-9% !important;width:118% !important;top:-5% !important;height:116% !important;transform:rotate(-2deg) !important;}
  .page-hero{padding-top:58px;padding-bottom:82px;}
}

@media(max-width:480px){
  .hero-sky{height:44%;}
  .question em::after{left:-8% !important;width:116% !important;top:-4% !important;height:114% !important;}
}

@media(prefers-reduced-motion:reduce){
  .hero-photo-frame .hero-photo,.hero-sky{animation:none !important;}
}

/* v1.7 — final motion + submit-card collision fix */

/* Faster, clearly visible cloud drift on the homepage hero. */
.hero-sky{
  animation:heroSkyWind 7.5s ease-in-out infinite alternate !important;
  will-change:transform;
}
@keyframes heroSkyWind{
  0%{transform:translate3d(-5%,0,0) scale(1.02)}
  45%{transform:translate3d(1.5%,-2px,0) scale(1.045)}
  100%{transform:translate3d(7%,1px,0) scale(1.065)}
}

/* Separate hair layer: a tiny wind sway, independent from the body and sky. */
.hero-hair{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:center 49%;
  z-index:4;
  pointer-events:none;
  filter:grayscale(100%) contrast(1.04) brightness(1.02);
  transform-origin:34% 60%;
  animation:hairInWind 3.1s ease-in-out infinite alternate;
  will-change:transform;
}
@keyframes hairInWind{
  0%{transform:translate3d(-1px,0,0) rotate(-.15deg) skewX(-.2deg) scale(1.001)}
  35%{transform:translate3d(2px,-1px,0) rotate(.18deg) skewX(.25deg) scale(1.003)}
  70%{transform:translate3d(5px,-2px,0) rotate(.42deg) skewX(.55deg) scale(1.006)}
  100%{transform:translate3d(3px,0,0) rotate(.16deg) skewX(.28deg) scale(1.003)}
}

/* Submit / Take-part cards: keep text and CTA in normal flow so they can never overlap. */
.take-card{
  min-height:410px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.take-card h3{
  margin-bottom:16px;
}
.take-card p{
  margin-top:0;
  margin-bottom:28px;
  max-width:100%;
}
.take-card .btn{
  position:static !important;
  left:auto !important;
  bottom:auto !important;
  margin-top:auto;
  flex:0 0 auto;
}

@media(max-width:760px){
  .hero-hair{object-position:center 47%;}
  .take-card{min-height:380px;}
}
@media(max-width:480px){
  .take-card{min-height:360px;}
}

@media(prefers-reduced-motion:reduce){
  .hero-sky,.hero-hair{animation:none !important;}
}

/* v1.9 — restore all site motion; homepage photo itself stays still, only sky moves */
.hero-photo-frame .hero-photo{
  animation:none !important;
  transform:none !important;
  will-change:auto !important;
}
.hero-hair{
  display:none !important;
  animation:none !important;
  transform:none !important;
  will-change:auto !important;
}
.hero-sky{
  animation:heroSkyWind 7.5s ease-in-out infinite alternate !important;
  will-change:transform !important;
}
@media(prefers-reduced-motion:reduce){
  .hero-sky{animation:none !important;}
}