/* Readable orange for TEXT on paper (about 5:1). Fills, bands and the reels keep the full orange. */
:root{--orange-text:color-mix(in srgb,var(--orange) 68%,#000)}
.full .next,.full .cities .add,.rec-card .role,.sig-head .eyebrow{color:var(--orange-text)}
.full .claim-sub{margin:0;font:700 13px/1.4 var(--mono)}
.band.orange .ways a:hover,.band.orange .chatnow:hover,.band.orange .mailbox .big:hover{color:inherit;text-decoration:underline;text-decoration-thickness:var(--rule)}

/* Full page, reels direction. Loaded after study.css: same tokens, grid and type.
   Content markup is the approved site's; this file sets it on the twelve columns. */

.full .ticks,.full .ticks i{border-color:currentColor}
.full section{scroll-margin-top:60px}
.full main>section{padding-block:clamp(44px,6.5vw,104px)}
.full main>section.band{padding-block:clamp(52px,7.5vw,120px)}
.full main>#years{padding-block:0 clamp(44px,6.5vw,104px)}
.band.black{background:var(--ink);color:var(--paper)}
.band.orange{background:var(--orange)}
.band.mustard{background:var(--mustard)}

/* sticky navigation */
.full .top{position:sticky;top:0;z-index:40;background:var(--paper);border-bottom:var(--rule) solid var(--ink)}
.full .top a[aria-current]{border-bottom-color:var(--ink)}
.full .top .home{margin-right:0}
.full .top .tape-counter{margin-right:auto;flex:none;font-size:13px}

/* ---------- section heads: short words sit beside their text, long words run the full measure ---------- */
.full .sec-head{display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--g);align-items:end;padding-block:clamp(10px,1.4vw,22px) clamp(28px,4vw,60px)}
.full .giant{margin:0 0 0 -.045em;padding-bottom:.06em;font:400 clamp(56px,min(19.5vw,calc(88vw/(var(--n)*.62))),340px)/.78 var(--head);letter-spacing:-.045em}
.full .side .giant{grid-column:1/9;font-size:clamp(56px,min(19.5vw,calc(60vw/(var(--n)*.66))),340px)}
.full .side .sec-side{grid-column:9/13;padding-bottom:1.2em}
.full .stack .giant{grid-column:1/13}
.full .stack .sec-side{grid-column:1/8;padding-top:clamp(16px,2vw,30px)}
.full .sec-side:empty{display:none}
.full .lead{margin:0 0 20px;font-size:clamp(15px,1.25vw,18px);max-width:46ch}
.sub{margin:0 0 .5em;font:400 clamp(20px,2.1vw,32px)/1.05 var(--head);letter-spacing:-.02em}
.eyebrow{margin:0 0 12px;font:700 12px/1.3 var(--mono)}

/* buttons */
.go,#copyMail{display:inline-block;font:700 13px/1 var(--mono);padding:13px 18px;border:var(--rule) solid var(--ink);background:var(--ink);color:var(--paper);text-decoration:none;cursor:pointer;border-radius:0}
.go.ghost{background:none;color:inherit;border-color:currentColor}
.band.black .go:not(.ghost){background:var(--paper);color:var(--ink);border-color:var(--paper)}
.go:hover,#copyMail:hover{background:var(--orange);border-color:var(--orange);color:var(--ink)}
.band.orange .go:hover,.band.orange #copyMail:hover{background:var(--paper);border-color:var(--paper)}

/* ---------- hero: one photo in the overlap, not two ---------- */
.full .reels-hero{border-top:0}

/* ---------- the cities: where the work is aimed ---------- */
.cities-block{padding-top:clamp(12px,1.5vw,22px)}
.cities-label{margin:0;font:700 12px/1.3 var(--mono)}
.cities-block .cities{padding-top:clamp(6px,.8vw,12px)}

/* ---------- why these cities (no longer used on the page) ---------- */
.story{padding-block:0 clamp(28px,4vw,60px)}
.story-grid{display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--g);border-top:var(--rule) solid var(--ink);padding-top:16px}
.story .label{grid-column:1/4;align-self:start;margin-top:8px}
.story-txt{grid-column:4/11}
.story-lead{margin:0 0 .7em;font:400 clamp(20px,2.2vw,34px)/1.08 var(--head);letter-spacing:-.025em}
.story-quote{margin:0 0 18px;padding:0;border:0;font:400 15px/1.65 var(--mono);letter-spacing:0;max-width:66ch}
.story-quote cite{margin-top:8px}
.story p{margin:0}

/* ---------- the Netherlands offer ---------- */
.full main>#nl-offer{padding-block:clamp(24px,3.2vw,48px)}
.nl-offer{display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--g);align-items:end}
.nl-offer .eyebrow{grid-column:1/13}
.nl-big{grid-column:1/10;margin:0;font:400 clamp(26px,4.2vw,72px)/.96 var(--head);letter-spacing:-.035em}
.nl-go{grid-column:10/13;margin:0 0 .4em;justify-self:end}
.full main>#signal{padding-top:clamp(36px,5vw,80px)}

/* ---------- the signal chain ---------- */
.sig-head{display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--g);align-items:end;padding-block:clamp(18px,2.4vw,40px) clamp(30px,4.5vw,72px)}
.sig-head .eyebrow{grid-column:1/13;color:#A83600;font-size:13px;margin-bottom:16px}
.sig-head h2{grid-column:1/10;margin:0 0 0 -.04em;font:400 clamp(36px,7.4vw,132px)/.86 var(--head);letter-spacing:-.045em}
.sig-head .lead{grid-column:10/13;margin:0 0 .6em}
.chain{position:relative;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);column-gap:var(--g)}
.chain::before{content:"";position:absolute;left:0;right:0;top:calc(clamp(44px,5.2vw,84px)/2 - 1px);height:var(--rule);background:var(--ink)}
.chain li{position:relative;min-width:0}
.chain .glyph{display:block;width:clamp(44px,5.2vw,84px);padding-right:10px;background:var(--paper);box-sizing:content-box}
.chain svg{display:block;width:100%;height:auto;fill:var(--ink)}
.chain li:nth-child(odd) svg{fill:var(--ink)}
.chain b{display:block;margin:16px 0 6px;font:400 clamp(17px,1.7vw,26px)/1.05 var(--head);letter-spacing:-.02em}
.chain li>span:last-child{display:block;font-size:13px;line-height:1.5;max-width:26ch}
.chain .pulse{position:absolute;z-index:1;top:calc(clamp(44px,5.2vw,84px)/2 - 6px);left:0;width:12px;height:12px;background:var(--orange);animation:signal 7s linear infinite}
@keyframes signal{from{left:0}to{left:calc(100% - 12px)}}
.chain li:hover svg{fill:var(--orange)}

/* ---------- featured ---------- */
.feat{display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--g);align-items:end;padding-top:clamp(20px,3vw,48px)}
.feat .fa-art{grid-column:1/5}
.feat .fa-art img{width:100%;height:auto}
.feat-txt{grid-column:6/13}
.feat-txt .eyebrow{color:var(--orange)}
.feat-txt h2{margin:0 0 .22em;font:400 clamp(40px,6.6vw,116px)/.88 var(--head);letter-spacing:-.04em}
.btns{display:flex;flex-wrap:wrap;gap:10px;margin:0}

/* ---------- stories ---------- */
.st-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(34px,4.5vw,72px) var(--g)}
.st{grid-column:span 6;border-top:var(--rule) solid var(--ink);padding-top:14px}
.st p{margin:0}
.st-what{font-size:12px}
.st-pull{margin:14px 0 16px!important;font:400 clamp(26px,3.5vw,58px)/.98 var(--head);letter-spacing:-.035em;max-width:16ch}
.st blockquote{margin:0 0 12px;padding:0;border:0;font:400 15px/1.65 var(--mono);letter-spacing:0;max-width:58ch}
.st-src{font-size:12px}
.press{margin:clamp(40px,6vw,96px) 0 0;padding:clamp(22px,3vw,44px) 0 0;border-top:var(--rule) solid var(--ink);display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--g)}
.press blockquote{grid-column:1/11;margin:0;padding:0;border:0;max-width:none;font:400 clamp(24px,3.3vw,54px)/1.04 var(--head);letter-spacing:-.03em}
.press figcaption{grid-column:1/11;margin-top:18px;font:700 13px var(--mono)}
.press-more{display:grid;grid-template-columns:repeat(12,1fr);gap:30px var(--g);margin-top:clamp(30px,4vw,60px)}
.press-more figure{grid-column:1/8;margin:0;border-top:var(--rule) solid var(--ink);padding-top:14px}
.press-more blockquote{margin:0;padding:0;border:0;max-width:36ch;font:400 clamp(18px,1.9vw,28px)/1.12 var(--head);letter-spacing:-.02em}
.press-more figcaption{margin-top:12px;font:700 12px var(--mono)}
.reviews{margin-top:clamp(40px,6vw,96px);padding-top:16px;border-top:var(--rule) solid var(--ink)}
.rv-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(24px,3vw,44px) var(--g);margin-top:18px}
.rv-grid figure{grid-column:span 4;margin:0}
.rv-grid blockquote{margin:0;padding:0;border:0;max-width:none;font:400 15px/1.6 var(--mono);letter-spacing:0}
.rv-grid figcaption{margin-top:10px;font:700 13px var(--mono)}
.intl{margin-top:clamp(30px,4vw,60px);padding-top:16px;border-top:var(--rule) solid var(--ink);display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--g)}
.intl .label{grid-column:1/4;align-self:start;margin-top:4px}
.intl p{grid-column:4/12;margin:0;font:400 clamp(17px,1.7vw,26px)/1.25 var(--head);letter-spacing:-.02em}
#mobile .svc li{grid-column:span 4}

/* ---------- 35 years: collage, then the wall ---------- */
.full #stage{border-top:var(--rule) solid var(--ink)}
.stage-word{position:absolute;left:var(--pad);bottom:9%;z-index:3;margin:0;font:400 15.5cqw/.78 var(--head);letter-spacing:-.045em}
.full #stage{container-type:inline-size}
.years-intro{padding-block:0 clamp(24px,3vw,44px)}
.years-intro .sub{margin-top:clamp(14px,1.6vw,24px)}
.wall{columns:4;column-gap:var(--g)}
.wall figure{margin:0 0 var(--g);break-inside:avoid}
.wall a{display:block;background:var(--tan)}
.wall img{width:100%;height:auto;filter:grayscale(1) contrast(1.15);mix-blend-mode:multiply;transition:filter .25s ease}
.wall figure:hover img,.wall a:focus-visible img{filter:none;mix-blend-mode:normal}
.wall figcaption{padding-top:7px;font-size:11px;line-height:1.35}

/* ---------- recognition ---------- */
#recognition .cols{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(30px,4vw,60px) var(--g)}
#recognition .cols>div{border-top:var(--rule) solid var(--ink);padding-top:14px}
#recognition .cols>div:nth-child(1){grid-column:1/5;grid-row:1}
#recognition .cols>div:nth-child(3){grid-column:5/9;grid-row:1}
#recognition .cols>div:nth-child(4){grid-column:9/13;grid-row:1}
#recognition .cols>div:nth-child(2){grid-column:1/13;grid-row:2;columns:3;column-gap:var(--g)}
#recognition h3{margin:0 0 16px;font:400 clamp(20px,2.1vw,32px)/1.05 var(--head);letter-spacing:-.02em;column-span:all}
#recognition p{margin:0 0 16px;break-inside:avoid;line-height:1.5}
#recognition .when{font-size:12px}
.academy{display:grid;grid-template-columns:repeat(12,1fr);gap:20px var(--g);margin-top:clamp(30px,4vw,60px);padding-top:14px;border-top:var(--rule) solid var(--ink)}
.academy h3{grid-column:1/5;column-span:none}
.academy>div{grid-column:span 4}
.academy.labels p,.academy.press-links ul{grid-column:5/13;margin:0;font:400 clamp(17px,1.7vw,26px)/1.3 var(--head);letter-spacing:-.02em}
.academy.press-links ul{list-style:none;padding:0;display:grid;gap:8px}
.academy h4{margin:0 0 8px;font:700 14px/1.3 var(--mono)}
.academy ul{list-style:none;margin:0;padding:0;line-height:1.6}
#recognition .note{margin:clamp(24px,3vw,44px) 0 0;font-size:12px}

/* ---------- lists of offers (services, studio, mobile) ---------- */
.svc{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(22px,3vw,44px) var(--g)}
.svc li{grid-column:span 4;border-top:var(--rule) solid currentColor;padding-top:14px}
#mobile .svc li{grid-column:span 6}
.svc b{display:block;font:400 clamp(20px,2.1vw,32px)/1.05 var(--head);letter-spacing:-.02em}
.svc span{display:block;margin-top:8px;max-width:44ch}
.svc.big-list{row-gap:0}
.svc.big-list li{grid-column:1/13;display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--g);align-items:end;padding-block:clamp(12px,1.5vw,22px)}
.svc.big-list li:last-child{border-bottom:var(--rule) solid currentColor}
.svc.big-list b{grid-column:1/10;font-size:clamp(28px,5.4vw,96px);line-height:.92;letter-spacing:-.04em}
.svc.big-list span{grid-column:10/13;margin:0 0 .5em}
.svc.sm{display:block}
.svc.sm li{border-top:1px solid currentColor;padding:8px 0}
.svc.sm b{font:700 14px/1.4 var(--mono);letter-spacing:0}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);column-gap:var(--g);row-gap:30px;counter-reset:step}
.steps li{counter-increment:step;border-top:var(--rule) solid var(--ink);padding-top:12px;min-width:0}
.steps li::before{content:counter(step);display:block;font:400 clamp(40px,5vw,84px)/.9 var(--head);letter-spacing:-.04em;margin-bottom:10px}
.steps b{display:block;font:400 clamp(18px,1.8vw,26px)/1.05 var(--head);letter-spacing:-.02em;margin-bottom:8px}
.steps span{display:block;font-size:13px;line-height:1.55}
.offer{display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--g);background:var(--mustard);padding:clamp(20px,2.6vw,40px) 0;margin-bottom:clamp(30px,4vw,60px)}
.offer>*{grid-column:2/11;margin:0}
.offer .big{margin:0 0 .35em;font:400 clamp(26px,3.9vw,66px)/.98 var(--head);letter-spacing:-.035em}
.offer p:last-child{max-width:60ch}

/* ---------- Dolby Atmos ---------- */
.orbit{position:relative;height:clamp(260px,34vw,460px);margin:10px 0 24px;overflow:hidden}
.orbit .oc{position:absolute;left:0;top:0;width:clamp(34px,4.6vw,84px);aspect-ratio:1;background-size:cover;background-position:center;background-color:var(--orange);border:var(--rule) solid var(--paper)}
.orbit .oc:hover,.orbit .oc:focus-visible{border-color:var(--orange)}
.orbit .you{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:50;font:700 12px var(--mono);text-transform:lowercase;background:var(--paper);color:var(--ink);padding:6px 10px}
.sw{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:clamp(30px,4vw,60px)}
.sw button{font:700 13px/1 var(--mono);text-transform:lowercase;padding:13px 18px;border:var(--rule) solid var(--paper);background:none;color:var(--paper);cursor:pointer;border-radius:0}
.sw button[aria-pressed=true]{background:var(--paper);color:var(--ink)}
.sw small{font-size:12px;opacity:.75;max-width:52ch}
.alist{display:grid;grid-template-columns:repeat(12,1fr);gap:30px var(--g)}
.alist>div{grid-column:1/13}
.alist h3{margin:0 0 6px;padding-top:14px;border-top:var(--rule) solid currentColor;font:400 clamp(20px,2.1vw,32px)/1.05 var(--head);letter-spacing:-.02em}
.alist ul{list-style:none;margin:0;padding:0;columns:3;column-gap:var(--g)}
.alist li{break-inside:avoid}
.alist a{display:flex;gap:8px;align-items:baseline;padding:9px 0;border-bottom:1px solid rgb(249 218 181/.35);text-decoration:none}
.alist a:hover{color:var(--orange)}
.alist b{font-weight:700}
.alist i{margin-left:auto;font-style:normal}

/* ---------- software ---------- */
#software .lead{font:400 clamp(22px,2.8vw,46px)/1.04 var(--head);letter-spacing:-.03em;max-width:24ch}
#software p{margin:0}

/* ---------- about ---------- */
.about{display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--g);align-items:start}
.about-txt{grid-column:1/8}
.about-txt p{margin:0 0 1.1em;max-width:62ch;font-size:15px;line-height:1.65}
.about-txt .lead{font:400 clamp(24px,3vw,50px)/1.02 var(--head);letter-spacing:-.03em;max-width:20ch;margin-bottom:.8em}
.about-pic{grid-column:9/13;margin:0;background:var(--orange)}
.about-pic img{width:100%;height:auto;filter:grayscale(1) contrast(1.2);mix-blend-mode:multiply}
blockquote{margin:clamp(24px,3vw,48px) 0 0;padding-top:16px;border-top:var(--rule) solid var(--ink);font:400 clamp(22px,2.6vw,42px)/1.06 var(--head);letter-spacing:-.025em;max-width:24ch}
blockquote cite{display:block;margin-top:14px;font:700 13px var(--mono);letter-spacing:0;font-style:normal}

/* ---------- contact ---------- */
.contact{display:grid;grid-template-columns:repeat(12,1fr);gap:40px var(--g)}
.contact .who{grid-column:1/7}
.contact .mailbox{grid-column:7/13}
.contact .who,.contact .mailbox{border-top:var(--rule) solid var(--ink);padding-top:14px}
.contact p{margin:0 0 14px}
.contact .name{font:400 clamp(36px,5.4vw,92px)/.9 var(--head);letter-spacing:-.04em;margin-bottom:.15em}
.ways{list-style:none;margin:22px 0 0;padding:0}
.ways li{display:grid;grid-template-columns:minmax(120px,1fr) 2fr;gap:12px;align-items:baseline;padding:10px 0;border-top:1px solid var(--ink)}
.ways span{font:700 12px var(--mono)}
.ways a,.ways em,.chatnow{font:400 clamp(17px,1.7vw,24px)/1.1 var(--head);font-style:normal;text-decoration:none;background:none;border:0;padding:0;color:inherit;cursor:pointer;text-align:left}
.ways a:hover,.chatnow:hover{color:var(--paper)}
.mailbox .big{display:block;font:400 clamp(24px,3.3vw,56px)/1 var(--head);letter-spacing:-.035em;text-decoration:none;margin-bottom:16px}
.mailbox .big:hover{color:var(--paper)}
.formnote{margin-left:12px;font-size:13px}
.soc-h{margin-top:clamp(30px,4vw,60px)}
.social{display:flex;flex-wrap:wrap;gap:8px 22px}
.social a{font:700 13px var(--mono);text-transform:lowercase;white-space:nowrap}

/* ---------- footer ---------- */
footer.wrap{padding-block:0 110px}
.foot{display:grid;grid-template-columns:repeat(12,1fr);gap:26px var(--g);align-items:start;padding-top:22px}
.foot>img{grid-column:1/4;grid-row:1/3;width:100%;height:auto}
.foot .cities{grid-column:5/13;padding:0;font-size:clamp(13px,2vw,36px)}
.foot .social{grid-column:5/13}
.foot .legal{grid-column:5/13;margin:0;display:flex;gap:22px;font:700 13px var(--mono);text-transform:lowercase}

/* ---------- floating tools: chat, player, ink picker, consent (the site's own widgets) ---------- */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.inks{grid-column:5/13;justify-self:start;display:flex;gap:7px;align-items:center;padding:8px 10px;background:var(--paper);border:var(--rule) solid var(--ink);font:700 12px var(--mono);text-transform:lowercase}
.inks button{width:22px;height:22px;border:var(--rule) solid var(--ink);cursor:pointer;padding:0;border-radius:0}
.inks button[aria-pressed=true]{outline:var(--rule) solid var(--ink);outline-offset:2px}
.inks .rnd{background:conic-gradient(red,yellow,lime,cyan,blue,magenta,red)}
.chat-launch{position:fixed;right:14px;bottom:14px;z-index:61;font:700 13px/1 var(--mono);text-transform:lowercase;padding:13px 18px;border:var(--rule) solid var(--ink);background:var(--orange);color:var(--ink);cursor:pointer;border-radius:0}
.chat-launch[aria-expanded=true]{background:var(--ink);color:var(--paper)}
#chat-panel{position:fixed;right:14px;bottom:66px;z-index:62;width:min(400px,calc(100vw - 28px));max-height:min(640px,calc(100vh - 140px));overflow:auto;background:var(--paper);color:var(--ink);border:var(--rule) solid var(--ink);padding:18px}
#chat-panel[hidden],.chat-contact-detail[hidden]{display:none}
#chat-panel .eyebrow{display:block;font-size:11px;margin:0}
#chat-panel h2{margin:.2em 0;font:400 34px/1 var(--head);letter-spacing:-.03em}
.gemma-intro{margin:0 0 12px;font-size:13px}
.close-inline{position:absolute;right:10px;top:6px;font:400 26px var(--head);background:none;border:0;cursor:pointer;color:inherit}
.gemma-log{display:grid;gap:8px;max-height:240px;overflow:auto;margin-bottom:10px}
.gemma-message{padding:10px 12px;font-size:14px;line-height:1.45;white-space:pre-wrap;border:var(--rule) solid var(--ink)}
.gemma-message.visitor{background:var(--ink);color:var(--paper);margin-left:36px}
.gemma-message.assistant{margin-right:36px}
.gemma-message:empty{display:none}
#gemma-message{width:100%;font:400 15px var(--mono);padding:11px 12px;border:var(--rule) solid var(--ink);background:#fff8;color:var(--ink);border-radius:0;resize:vertical}
.gemma-send-row{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:8px;font-size:12px}
#chat-panel .pill{font:700 13px/1 var(--mono);text-transform:lowercase;padding:12px 16px;border:var(--rule) solid var(--ink);background:var(--ink);color:var(--paper);cursor:pointer;border-radius:0}
.gemma-disclosure{font-size:11px;opacity:.75;margin:12px 0}
.gemma-quick{display:flex;flex-wrap:wrap;gap:8px}
.gemma-quick button,.gemma-quick a,#chat-panel .line-link{font:700 11px var(--mono);text-transform:lowercase;padding:9px 11px;border:var(--rule) solid var(--ink);background:none;color:inherit;text-decoration:none;cursor:pointer;border-radius:0}
.chat-contact-detail{margin-top:12px;font-size:12px}
.chat-contact-value{display:block;font:400 18px var(--head);margin:.3em 0 .6em;text-decoration:none}
.listenbox{position:fixed;left:14px;bottom:14px;z-index:60;width:min(360px,calc(100vw - 28px))}
#listenBtn,#bgSound{font:700 13px/1 var(--mono);text-transform:lowercase;padding:13px 18px;border:var(--rule) solid var(--ink);background:var(--paper);color:var(--ink);cursor:pointer;border-radius:0}
#listenBtn[aria-expanded=true]{display:block;width:100%;text-align:left;background:var(--orange);color:var(--ink);font-size:14px;padding:15px 18px}   /* a full-width close bar on top of the player */
#listenPlayer{margin-top:8px;border:var(--rule) solid var(--ink);background:var(--ink)}
#listenPlayer iframe{display:block;width:100%;height:min(450px,calc(100vh - 150px));border:0}
.consent{position:fixed;left:0;right:0;bottom:0;z-index:90;display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;background:var(--ink);color:var(--paper);border-top:4px solid var(--orange);padding:16px var(--pad);font-size:13px}
.consent p{margin:0;flex:1 1 320px;max-width:70ch}
.consent a{color:var(--orange)}
.consent button{font:700 13px/1 var(--mono);text-transform:lowercase;padding:13px 18px;border:var(--rule) solid var(--paper);background:var(--paper);color:var(--ink);cursor:pointer;border-radius:0}
.consent button.no{background:none;color:var(--paper)}

/* ---------- play: filter key ---------- */
.filter{gap:8px}
.filter button{display:flex;align-items:center;gap:8px;font:700 12px/1 var(--mono);padding:9px 11px;border:var(--rule) solid var(--ink);background:none;color:var(--ink);cursor:pointer;border-radius:0}
.filter button::before{content:"";width:12px;height:12px;border:var(--rule) solid var(--ink)}
.filter button[data-f=""]::before{display:none}
.filter .k-rec::before{background:var(--orange)}.filter .k-mix::before{background:var(--mustard)}.filter .k-both::before{background:var(--both)}
.filter button[aria-pressed=true]{background:var(--ink);color:var(--paper)}
.filter button[aria-pressed=true]::before{border-color:var(--paper)}
.rec-card[hidden]{display:none}

/* ---------- software section: product cards ---------- */
.softcards{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--g)}
.softcards .card{display:block;border-top:var(--rule) solid var(--ink);padding-top:16px;text-decoration:none}
.softcards .logo{background:var(--paper);aspect-ratio:16/9;display:grid;place-items:center;margin-bottom:16px}
.softcards .logo.k{background:var(--ink)}
.softcards .logo img{max-width:44%;max-height:70%;height:auto}
.softcards h2{margin:0 0 .3em;font:400 clamp(30px,4.4vw,72px)/.92 var(--head);letter-spacing:-.04em}
.softcards p{margin:0 0 14px;max-width:52ch}
.softcards .pill{display:inline-block;font:700 12px/1 var(--mono);text-transform:lowercase;padding:8px 10px;border:var(--rule) solid var(--ink)}
.softcards .pill.on{background:var(--ink);color:var(--paper)}
.softcards .card:hover h2{text-decoration:underline;text-decoration-thickness:var(--rule)}
#software .lead{font:400 15px/1.55 var(--mono);letter-spacing:0;max-width:46ch}
#software .more{margin-top:clamp(28px,3.5vw,52px)}

/* ---------- launch pages: links onward, questions ---------- */
.more{display:flex;flex-wrap:wrap;gap:10px;margin:clamp(28px,3.5vw,52px) 0 0}
.qa{margin:0;display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(22px,3vw,40px) var(--g)}
.qa>div{grid-column:span 6;border-top:var(--rule) solid var(--ink);padding-top:12px}
.qa dt{font:400 clamp(18px,1.9vw,28px)/1.08 var(--head);letter-spacing:-.02em;margin-bottom:8px}
.qa dd{margin:0;max-width:60ch;line-height:1.6}
.full .top a[aria-current=page]{border-bottom-color:var(--ink)}
#privacy .svc.sm li{display:grid;grid-template-columns:minmax(160px,1fr) 3fr;gap:14px;padding:14px 0}
#privacy .svc.sm span{margin:0;max-width:70ch}

/* ---------- phone ---------- */
@media (max-width:1100px){.wall{columns:3}.alist ul{columns:2}.steps{grid-template-columns:repeat(3,1fr)}}
@media (max-width:820px){
  .full .side .giant,.full .side .sec-side,.full .stack .sec-side{grid-column:1/13}
  .full .side .sec-side{padding-top:20px}
  .full .sec-head{align-items:start}
  .full .giant{font-size:clamp(48px,min(24vw,calc(92vw/(var(--n)*.62))),200px)}
  .nl-big,.nl-go{grid-column:1/13}.nl-go{justify-self:start;margin-top:16px}
  .softcards{grid-template-columns:1fr}
  .qa>div{grid-column:1/13}#privacy .svc.sm li{grid-template-columns:1fr}
  .story .label,.story-txt{grid-column:1/13}
  .st{grid-column:1/13}.rv-grid figure{grid-column:1/13}.press-more figure{grid-column:1/13}.press blockquote,.press figcaption{grid-column:1/13}.intl .label,.intl p{grid-column:1/13}.intl p{margin-top:10px}
  .sig-head h2,.sig-head .lead{grid-column:1/13}.sig-head .lead{margin-top:16px}
  .chain{grid-template-columns:1fr;row-gap:22px}
  .chain::before{left:calc(22px - 1px);right:auto;top:0;bottom:0;width:var(--rule);height:auto}
  .chain li:not(.pulse){display:grid;grid-template-columns:54px 1fr;column-gap:14px;align-items:start}
  .chain .glyph{width:44px;padding:0 0 8px;grid-row:1/3}
  .chain b{margin:0 0 4px}
  .chain .pulse{left:16px;top:0;animation-name:signal-v}
  .feat .fa-art{grid-column:1/13;margin-bottom:22px}.feat-txt{grid-column:1/13}
  .stage-word{left:calc(55.5% + 16px);bottom:auto;top:4%;font-size:6.2cqw;color:var(--ink)}
  .wall{columns:2}
  #recognition .cols>div:nth-child(n){grid-column:1/13;grid-row:auto;columns:1}
  .academy h3,.academy>div{grid-column:1/13}.academy.labels p,.academy.press-links ul{grid-column:1/13}
  .steps{grid-template-columns:1fr}
  .svc li,#mobile .svc li{grid-column:1/13}
  .svc.big-list b,.svc.big-list span{grid-column:1/13}
  .svc.big-list span{margin-top:8px}
  .offer>*{grid-column:1/13;padding-inline:16px}
  .alist ul{columns:1}
  .about-txt,.about-pic{grid-column:1/13}.about-pic{margin-top:26px}
  .contact .who,.contact .mailbox{grid-column:1/13}
  .foot>img{grid-column:1/8}.foot .cities,.foot .social,.foot .legal{grid-column:1/13}
  .inks{grid-column:1/13}
  .ways li{grid-template-columns:1fr;gap:2px}
  .foot>*{min-width:0}.foot .social{gap:10px 18px}
  .listenbox{width:auto;right:110px}
}
@keyframes signal-v{from{top:0}to{top:calc(100% - 12px)}}
@media (prefers-reduced-motion:reduce){.wall img{transition:none}.chain .pulse{animation:none;display:none}}