/* Board 4: three fresh directions. Inter, black and white, static logos and avatars, clients panel. */
:root{--font:'Inter',ui-sans-serif,system-ui,sans-serif}
.logo i,.sq::before{display:none}
.wm{font-weight:600;font-size:15px;letter-spacing:-.025em;white-space:nowrap}
/* Dot matrix menu icons */
.dnav{position:fixed;z-index:130;top:0;left:0;right:0;display:flex;justify-content:flex-end;align-items:center;height:64px;padding:0 var(--gut);font-size:14px;transition:background .4s,color .4s,box-shadow .4s}
.dnav .wm{margin-right:auto}
.dnav.panel_open{color:#fff;background:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.dnav.panel_open .wm{opacity:1}
.dnav.panel_open .dl.cta{background:rgba(255,255,255,.22);color:#fff;opacity:1}
.dnav.panel_open .dl.cta{background:#fff;color:#0F0F0F}
.dnav.is_solid{background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 1px 0 #ECECEC;color:#0F0F0F}
.dnav.is_hidden{transform:none}
.dnav.on_dark:not(.is_solid){color:#fff}
.dnav nav{display:flex;gap:clamp(18px,2.4vw,34px)}
.dl{display:inline-flex;align-items:center;gap:8px;cursor:pointer}
.di{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;width:14px;height:14px}
.di i{display:block;width:2px;height:2px;background:currentColor;opacity:.3;transition:opacity .25s}
.di i:nth-child(1),.di i:nth-child(4),.di i:nth-child(6),.di i:nth-child(7),.di i:nth-child(10),.di i:nth-child(11),.di i:nth-child(13),.di i:nth-child(16){opacity:.9}
.dl:hover .di i{animation:dot .9s steps(1) infinite;animation-delay:calc(var(--k) * 45ms)}
@keyframes dot{0%{opacity:.15}30%{opacity:1}60%{opacity:.35}100%{opacity:.9}}
.dnav .dl.cta{padding:6px 12px;border-radius:999px;background:rgba(15,15,15,.07);color:inherit;font-size:13px}
.dnav.on_dark:not(.is_solid) .dl.cta{background:rgba(255,255,255,.14)}
.dnav .wm{opacity:0;transition:opacity .4s}
.dnav.is_solid .wm,.dnav.keepwm .wm{opacity:1}
/* Clients panel */
.cp{position:fixed;z-index:120;padding-top:64px;inset:0;background:#0F0F0F;color:#fff;overflow:auto;opacity:0;visibility:hidden;transition:opacity .5s var(--ease),visibility 0s linear .5s}
.cp.open{opacity:1;visibility:visible;transition:opacity .5s var(--ease)}
.cp_top{display:none}
.cp_tabs{display:flex;justify-content:flex-start;gap:clamp(24px,4vw,64px);color:#7A7A7A}
.cp_tabs button{color:inherit}
.cp_tabs button.on{color:#fff;text-decoration:underline;text-underline-offset:5px}
.cp_mark{width:18px;height:18px;border-radius:50%;background:#fff}
.cp_list{padding:20px var(--gut) 80px}
.cp_row{display:flex;align-items:center;gap:18px;padding:6px 0;font-size:clamp(28px,4.6vw,66px);font-weight:500;letter-spacing:-.04em;line-height:1;color:#fff;transition:opacity .4s,transform .8s var(--ease)}
.cp_row[hidden]{display:none}
.cp_row i{flex:none;width:clamp(44px,5vw,72px);height:clamp(44px,5vw,72px);overflow:hidden;background:#fff;display:grid;place-items:center}
.cp_row i img{width:100%;height:100%;object-fit:cover}
.cp_row i img.logo_img{width:auto;height:auto;max-width:80%;max-height:60%;filter:brightness(0)}
.cp_row{opacity:.32}
.cp_row:hover{opacity:1}
.cp_row .dotsep{color:#555;margin:0 4px}
/* Hero A, Humanrace */
.hA{position:relative;height:100svh;min-height:600px;background:#0F0F0F;color:#fff}
.hA span{position:absolute;font-size:12px;line-height:1.5;color:#B3B3B3;max-width:22em}
.hA .c1{left:var(--gut);top:80px}.hA .c2{right:var(--gut);top:80px;text-align:right}.hA .c3{left:var(--gut);bottom:28px}.hA .c4{right:var(--gut);bottom:28px;text-align:right}
.hA_word{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:clamp(34px,5.2vw,78px);font-weight:600;letter-spacing:-.04em;white-space:nowrap}
.hA_word sup{font-size:.35em;vertical-align:top;margin-left:.08em;font-weight:500}
/* Hero B, Clavo white */
.hB{padding:calc(64px + clamp(40px,6vw,90px)) var(--gut) 0}
.hB_row{display:grid;grid-template-columns:1fr minmax(0,.5fr) auto;gap:30px;align-items:center}
.hB_h{font-size:clamp(30px,3.6vw,56px);font-weight:500;letter-spacing:-.04em;line-height:1.05;max-width:12em}
.hB_d{max-width:24em;font-size:13.5px;line-height:1.55;color:var(--muted2)}
.hB .circle{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;border:1px solid var(--line2);font-size:11px;text-align:center;line-height:1.3}
.hB_img{aspect-ratio:2.23;margin-top:clamp(20px,2.4vw,36px);overflow:hidden;background:#111}
img[data-wide]{display:block;width:100%;height:100%;object-fit:cover}
/* Hero C, Numinous */
.hC{position:relative;height:100svh;min-height:620px;background:#0F0F0F;color:#fff;overflow:hidden}
.hC>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(18px) grayscale(1);opacity:.35;transform:scale(1.1)}
.hC_in{position:absolute;inset:0;padding:calc(64px + 30px) var(--gut) 30px;display:flex;flex-direction:column;justify-content:space-between}
.hC_h{font-size:clamp(20px,1.9vw,28px);font-weight:500;letter-spacing:-.02em;line-height:1.25;max-width:18em}
.hC_mark{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:13px;letter-spacing:.3em;color:#B3B3B3}
.hC_bot{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;font-size:12.5px;line-height:1.5;color:#B3B3B3}
.hC_bot p{max-width:26em}
/* Shared sections */
.blurb{padding:calc(var(--sp) * .5) var(--gut)}
.blurb_t{max-width:21em;font-size:clamp(26px,3.1vw,46px);font-weight:500;letter-spacing:-.035em;line-height:1.22}
.blurb_t.in{text-indent:12%}
.row_lab{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted2);text-align:center}
.logos_f{padding:0 var(--gut) calc(var(--sp) * .5)}
.logos_f .logos{margin-top:clamp(28px,3vw,44px)}
.av{padding:0 var(--gut) calc(var(--sp) * .5)}
.av_row{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(12px,1.4vw,20px);width:min(1100px,100%);margin:clamp(28px,3vw,44px) auto 0}
.av_row figure{width:clamp(56px,6.2vw,88px);aspect-ratio:1;border-radius:50%;overflow:hidden;background:var(--soft);margin:0}
.av_row img{width:100%;height:100%;object-fit:cover}
.av_grid{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line);margin-top:clamp(28px,3vw,44px)}
.av_grid figure{display:grid;place-items:center;aspect-ratio:1;margin:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.av_grid figure i{display:block;width:62%;aspect-ratio:1;border-radius:50%;overflow:hidden;background:var(--soft)}
.av_grid img{width:100%;height:100%;object-fit:cover}
.abt{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,90px);padding:calc(var(--sp) * .5) var(--gut)}
.abt h2{font-size:clamp(26px,2.8vw,42px);font-weight:500;letter-spacing:-.035em;line-height:1.08}
.abt p{margin-top:16px;max-width:30em;font-size:15.5px;line-height:1.55;color:var(--muted2)}
.abt .clk{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:28px;padding-top:18px;border-top:1px solid var(--line2)}
.abt .clk b{display:block;font-size:clamp(22px,2.2vw,32px);font-weight:500;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.abt .clk span{display:block;margin-top:4px;font-size:12.5px;color:var(--muted2)}
.ctf{padding:calc(var(--sp) * .5) var(--gut)}
.ctf_grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,90px)}
.ctf h2{font-size:clamp(40px,5vw,80px);font-weight:500;letter-spacing:-.05em;line-height:1}
.ctf_mail{display:inline-block;margin-top:18px;font-size:clamp(18px,1.8vw,26px);border-bottom:1px solid currentColor}
.ctf_links{display:flex;gap:18px;margin-top:14px;font-size:14px;color:var(--muted2)}
.ctf_l{font-size:15.5px;font-weight:500;margin-bottom:16px}
.footf{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:18px var(--gut) 24px;border-top:1px solid var(--line);font-size:13px;color:var(--muted2)}
.footf nav{display:flex;gap:22px}
.footf .credits{flex-basis:100%;font-size:11px;color:var(--muted)}
@media (max-width:980px){.hB_row{grid-template-columns:1fr}.abt,.ctf_grid{grid-template-columns:1fr}.av_grid{grid-template-columns:repeat(4,1fr)}.dnav nav .dl:not(.cta):not([data-clients]){display:none}.abt .clk{grid-template-columns:1fr 1fr}}

.band_dark .abt h2,.band_dark .clk b,.band_dark .blurb_t{color:#fff}

/* Distinct dot icons: each item has its own pattern */
.di[data-p="work"] i:nth-child(n){opacity:.9}
.di[data-p="work"] i:nth-child(6),.di[data-p="work"] i:nth-child(7),.di[data-p="work"] i:nth-child(10),.di[data-p="work"] i:nth-child(11){opacity:.25}
.di[data-p="clients"] i{opacity:.25}
.di[data-p="clients"] i:nth-child(2),.di[data-p="clients"] i:nth-child(3),.di[data-p="clients"] i:nth-child(5),.di[data-p="clients"] i:nth-child(8),.di[data-p="clients"] i:nth-child(9),.di[data-p="clients"] i:nth-child(12),.di[data-p="clients"] i:nth-child(14),.di[data-p="clients"] i:nth-child(15){opacity:.9}
.di[data-p="studio"] i{opacity:.25}
.di[data-p="studio"] i:nth-child(1),.di[data-p="studio"] i:nth-child(6),.di[data-p="studio"] i:nth-child(11),.di[data-p="studio"] i:nth-child(16),.di[data-p="studio"] i:nth-child(4),.di[data-p="studio"] i:nth-child(7),.di[data-p="studio"] i:nth-child(10),.di[data-p="studio"] i:nth-child(13){opacity:.9}
.di[data-p="contact"] i{opacity:.25}
.di[data-p="contact"] i:nth-child(2),.di[data-p="contact"] i:nth-child(3),.di[data-p="contact"] i:nth-child(5),.di[data-p="contact"] i:nth-child(6),.di[data-p="contact"] i:nth-child(7),.di[data-p="contact"] i:nth-child(8),.di[data-p="contact"] i:nth-child(10),.di[data-p="contact"] i:nth-child(11),.di[data-p="contact"] i:nth-child(14),.di[data-p="contact"] i:nth-child(15){opacity:.9}
.di[data-p="talk"] i{opacity:.25}
.di[data-p="talk"] i:nth-child(3),.di[data-p="talk"] i:nth-child(4),.di[data-p="talk"] i:nth-child(7),.di[data-p="talk"] i:nth-child(8),.di[data-p="talk"] i:nth-child(10),.di[data-p="talk"] i:nth-child(13){opacity:.9}
.dl:hover .di[data-p="work"] i{animation-name:dotw}.dl:hover .di[data-p="clients"] i{animation-name:dotc}.dl:hover .di[data-p="studio"] i{animation-name:dots}.dl:hover .di[data-p="contact"] i{animation-name:dotk}
@keyframes dotw{0%{opacity:.9}50%{opacity:.2}100%{opacity:.9}}
@keyframes dotc{0%{opacity:.2}40%{opacity:1}100%{opacity:.2}}
@keyframes dots{0%{opacity:.25}25%{opacity:1}50%{opacity:.25}75%{opacity:1}100%{opacity:.25}}
@keyframes dotk{0%{opacity:1}100%{opacity:.2}}
/* Eight key artists, the rest faded behind */
.av_row figure:nth-child(n+9){opacity:.22}
.av_grid figure:nth-child(n+9) i{opacity:.22}

/* Eight artists and a "many more" tile */
.av_row figure:nth-child(n+9),.av_grid figure:nth-child(n+9) i{opacity:1}
.av_more{display:grid;place-items:center;width:clamp(56px,6.2vw,88px);aspect-ratio:1;border-radius:50%;border:1px solid var(--line2);font-size:11px;letter-spacing:.02em;text-align:center;line-height:1.2;color:var(--muted2)}
.av_grid .av_more{width:62%;border-radius:50%}
/* Logos and artists side by side */
.cl2{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(24px,5vw,80px);padding:0 var(--gut)}
.cl2 h3{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted2);padding-bottom:14px;border-bottom:1px solid var(--fg)}
.cl2 .r{display:flex;align-items:center;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:clamp(16px,1.5vw,22px);font-weight:500;letter-spacing:-.02em}
.cl2 .r i{display:grid;place-items:center;width:44px;height:44px;flex:none;overflow:hidden;background:var(--soft)}
.cl2 .r i img{width:100%;height:100%;object-fit:cover}
.cl2 .r i .logo_img{width:auto;height:auto;max-width:78%;max-height:60%}
.cl2 .r.more{color:var(--muted2);font-weight:400}
.cl2b{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,80px);padding:0 var(--gut)}
.cl2b .lg8{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.cl2b .lg8 .ltile{aspect-ratio:1.6}
.cl2b .fg8{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.cl2b .fg8 figure{aspect-ratio:1.6;overflow:hidden;background:var(--soft);margin:0}
.cl2b .fg8 img{width:100%;height:100%;object-fit:cover}
.cl2b .fg8 .av_more,.cl2b .lg8 .av_more{width:100%;aspect-ratio:1.6;border-radius:0}
/* Case studies: logos hint, no previews */
.csl{padding:0 var(--gut)}
.csl_h{font-size:clamp(26px,3vw,46px);font-weight:500;letter-spacing:-.035em;line-height:1.08;max-width:16em}
.csl .logos{justify-content:flex-start;margin:clamp(22px,2.4vw,34px) 0 0;width:auto}
.csl .pw{margin-top:clamp(28px,3vw,44px)}
.csl.dark{margin:0;padding:clamp(40px,5vw,80px) var(--gut);background:#0F0F0F;color:#fff}
.csl.dark .logo_img{filter:brightness(0) invert(1)}
.csl.dark .pw input{border-color:rgba(255,255,255,.3);color:#fff}
.csl.dark .pw .btn{background:#fff;color:#0F0F0F}
.csl_row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);align-items:end}
.csl_line{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;font-size:clamp(18px,2vw,30px);font-weight:500;letter-spacing:-.03em}
.csl_line .logo_img{height:calc(16px * var(--lh,1))}
.pw{display:flex;gap:8px;align-items:center;max-width:420px}
.pw input{flex:1;min-width:0;height:46px;padding:0 16px;border:1px solid var(--line2);background:transparent;font-size:15px;outline:none;color:inherit}
.pw .btn{--btn_h:46px;border-radius:0}
/* More contact forms */
.kf{padding:0 var(--gut)}
.kf6{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);align-items:center}
.kf6 h3,.kf7 h3,.kf9 h3{font-size:clamp(34px,4.4vw,70px);font-weight:500;letter-spacing:-.045em;line-height:1}
.kf6 .one{display:flex;gap:8px;margin-top:22px;max-width:480px}
.kf6 .one input{flex:1;height:50px;padding:0 16px;border:0;border-bottom:1px solid var(--fg);background:transparent;font-size:16px;outline:none;color:inherit}
.kf6 small{display:block;margin-top:12px;font-size:13px;color:var(--muted2)}
.kf7 .steps{margin-top:24px;border-top:1px solid var(--line)}
.kf7 .steps label{display:grid;grid-template-columns:48px 1fr 1fr;align-items:center;gap:20px;padding:18px 0;border-bottom:1px solid var(--line);font-size:15px}
.kf7 .steps label span:first-child{font-size:12px;color:var(--muted)}
.kf7 .steps input,.kf7 .steps textarea{border:0;background:transparent;font-size:16px;outline:none;color:inherit;padding:4px 0}
.kf8{margin:0 calc(var(--gut) * -1);padding:clamp(40px,5vw,80px) var(--gut);background:var(--soft);display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(24px,4vw,64px)}
.kf8 h3{font-size:clamp(28px,3.4vw,52px);font-weight:500;letter-spacing:-.04em;line-height:1.02}
.kf8 p{margin-top:12px;font-size:15px;color:var(--muted2)}
.kf8 .field input,.kf8 .field textarea{background:#fff}
.kf9 .row{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:16px;align-items:end;margin-top:28px}
.kf9 .row input{height:44px;border:0;border-bottom:1px solid var(--fg);background:transparent;font-size:15px;outline:none;color:inherit;padding:0}
.kf10{display:grid;grid-template-columns:1fr 1fr;min-height:560px}
.kf10 .img{overflow:hidden;background:#111}
.kf10 .img img{width:100%;height:100%;object-fit:cover}
.kf10 .pan{padding:clamp(28px,3.6vw,56px);background:#0F0F0F;color:#fff;--bg:#0F0F0F;--fg:#fff;--soft:#1B1B1B;--muted:#7A7A7A;--muted2:#B3B3B3;--line:rgba(255,255,255,.12)}
.kf10 .pan h3{font-size:clamp(30px,3.4vw,52px);font-weight:500;letter-spacing:-.04em;line-height:1}
.kf10 .pan p{margin:14px 0 18px;font-size:14.5px;color:#B3B3B3}
@media (max-width:980px){.cl2,.cl2b,.csl_row,.kf6,.kf8,.kf10{grid-template-columns:1fr}.kf9 .row{grid-template-columns:1fr}.kf7 .steps label{grid-template-columns:1fr}}

.csl .pf_err{min-height:18px;font-size:13.5px;color:var(--accent);margin-top:8px}
.csl .pf_open{display:none;gap:12px;align-items:center;margin-top:12px}
.csl.is_open .pf_form_plain{display:none}
.csl.is_open .pf_open{display:flex}
:root{--mono:'DM Mono',ui-monospace,SFMono-Regular,Menlo,monospace}
/* Scroll hint */
.shint{display:inline-flex;align-items:center;gap:10px}
@keyframes wheel{0%{transform:translateY(0);opacity:1}70%{transform:translateY(10px);opacity:0}100%{transform:translateY(0);opacity:0}}
/* Logos as they were, then artists in two columns */
.cla{padding:0 var(--gut)}
.cla .logos{margin-top:clamp(28px,3vw,44px)}
.cla_cols{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(24px,5vw,80px);margin-top:clamp(28px,3vw,44px);border-top:1px solid var(--line)}
.cla_cols .r{position:relative;display:flex;align-items:center;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:clamp(16px,1.5vw,22px);font-weight:500;letter-spacing:-.02em}
.cla_cols .r i{display:block;width:44px;height:44px;flex:none;overflow:hidden;background:var(--soft)}
.cla_cols .r i img{width:100%;height:100%;object-fit:cover}
.morebox{position:relative;grid-column:1 / -1;padding:14px 0;font-size:15px;color:var(--muted2)}
.morebox .stack{display:inline-flex;align-items:center;gap:12px;cursor:default}
.morebox .pics{display:inline-flex}
.morebox .pics i{display:block;width:36px;height:36px;border-radius:50%;overflow:hidden;background:var(--soft);border:2px solid var(--bg);margin-left:-10px;opacity:0;transform:translateX(-8px) scale(.8);transition:opacity .4s var(--ease),transform .5s var(--ease)}
.morebox .pics i:first-child{margin-left:0}
.morebox .pics img{width:100%;height:100%;object-fit:cover}
.morebox:hover .pics i{opacity:.55;transform:none}
.morebox:hover .pics i:nth-child(2){transition-delay:60ms}.morebox:hover .pics i:nth-child(3){transition-delay:120ms}
[data-tip]{position:relative}
[data-tip]::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 8px);transform:translate(-50%,4px);padding:5px 9px;border-radius:4px;background:#0F0F0F;color:#fff;font-size:11.5px;font-weight:500;letter-spacing:0;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .25s,transform .3s var(--ease);z-index:5}
[data-tip]:hover::after{opacity:1;transform:translate(-50%,0)}
/* Case studies with artist portraits, boxed */
.csp .box{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));border-top:1px solid var(--line2);border-left:1px solid var(--line2);margin-top:clamp(22px,2.4vw,34px);max-width:960px}
.csp .box figure{margin:0;padding:14px;border-right:1px solid var(--line2);border-bottom:1px solid var(--line2);display:grid;place-items:center}
.csp .box figure i{display:block;width:100%;aspect-ratio:1;border-radius:50%;overflow:hidden;background:var(--soft)}
.csp .box.sq figure i{border-radius:0}
.csp .box img{width:100%;height:100%;object-fit:cover}
.csp.dark{margin:0;padding:clamp(40px,5vw,80px) var(--gut);background:#0F0F0F;color:#fff}
.csp.dark .box,.csp.dark .box figure{border-color:rgba(255,255,255,.25)}
.csp.dark .pw input{border-color:rgba(255,255,255,.3);color:#fff}
.csp.dark .pw .btn{background:#fff;color:#0F0F0F}
.csp .strip{display:flex;gap:10px;margin-top:clamp(22px,2.4vw,34px)}
.csp .strip figure{margin:0;width:clamp(64px,7vw,96px);aspect-ratio:1;border:1px solid var(--line2);padding:6px}
.csp .strip figure i{display:block;width:100%;height:100%;overflow:hidden;background:var(--soft)}
.csp .strip img{width:100%;height:100%;object-fit:cover}
/* Worldwide displays */
.ww{padding:0 var(--gut)}
.ww h3{font-size:clamp(26px,3vw,46px);font-weight:500;letter-spacing:-.035em;line-height:1.08;max-width:14em}
.ww .sub{margin-top:14px;max-width:30em;font-size:15px;line-height:1.5;color:var(--muted2)}
.ww_clk{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:clamp(28px,3vw,44px);padding-top:18px;border-top:1px solid var(--line2)}
.ww_clk b{display:block;font-family:var(--mono);font-weight:400;font-size:clamp(26px,2.8vw,42px);letter-spacing:-.02em;line-height:1}
.ww_clk span{display:block;margin-top:8px;font-size:12.5px;color:var(--muted2)}
.ww_rows{margin-top:clamp(22px,2.4vw,34px);border-top:1px solid var(--line);max-width:720px}
.ww_rows div{display:flex;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--line);font-size:16px}
.ww_rows b{font-family:var(--mono);font-weight:400}
.ww_line{margin-top:clamp(22px,2.4vw,34px);font-family:var(--mono);font-size:clamp(13px,1.2vw,16px);letter-spacing:.02em;color:var(--muted2)}
.ww_line b{color:var(--fg);font-weight:400}
.ww.dark{margin:0;padding:clamp(40px,5vw,80px) var(--gut);background:#0F0F0F;color:#fff}
.ww.dark .ww_clk b{font-size:clamp(44px,6vw,96px)}
.ww.dark .ww_clk{border-color:rgba(255,255,255,.3)}
.ww_split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);align-items:start}
/* Rollout variants */
.ro{padding:0 var(--gut)}
.ro h3{font-size:clamp(26px,3vw,46px);font-weight:500;letter-spacing:-.035em;line-height:1.08;max-width:14em}
.ro p.sub{margin-top:14px;max-width:32em;font-size:15px;line-height:1.5;color:var(--muted2)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:clamp(22px,2.4vw,34px);max-width:720px}
.chips span{padding:9px 14px;border:1px solid var(--line2);border-radius:999px;font-size:13.5px}
.ro_rows{margin-top:clamp(22px,2.4vw,34px);border-top:1px solid var(--line)}
.ro_rows div{display:grid;grid-template-columns:48px 1fr 1fr;gap:20px;padding:16px 0;border-bottom:1px solid var(--line);font-size:16px}
.ro_rows div span:first-child{font-size:12px;color:var(--muted)}
.ro_rows div span:last-child{font-size:14px;color:var(--muted2)}
.ro_grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:clamp(22px,2.4vw,34px)}
.ro_grid div{padding:20px;background:var(--soft);min-height:120px;display:flex;flex-direction:column;justify-content:space-between;font-size:15px;font-weight:500}
.ro_grid div small{font-size:12.5px;font-weight:400;color:var(--muted2)}
.ro_inline{margin-top:clamp(22px,2.4vw,34px);max-width:30em;font-size:clamp(20px,2vw,30px);font-weight:500;letter-spacing:-.03em;line-height:1.3}
.ro_inline span{color:var(--muted)}
.ro_split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px)}
.ro_list{columns:2;gap:40px;font-size:15px;line-height:2}
/* Contact: email first */
.ce{padding:0 var(--gut)}
.ce h3{font-size:clamp(34px,4.4vw,70px);font-weight:500;letter-spacing:-.045em;line-height:1}
.ce_mail{display:inline-block;margin-top:clamp(18px,2vw,28px);font-size:clamp(22px,3vw,48px);font-weight:500;letter-spacing:-.035em;border-bottom:2px solid currentColor;padding-bottom:4px}
.ce_soc{display:flex;gap:14px;margin-top:22px}
.ce_soc a{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border:1px solid var(--line2);border-radius:999px;font-size:13.5px;font-weight:500}
.ce_soc a svg{width:16px;height:16px}
.ce_form{margin-top:clamp(40px,5vw,72px);padding-top:clamp(24px,2.6vw,36px);border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(24px,4vw,64px)}
.ce_form p{font-size:14.5px;color:var(--muted2);max-width:24em}
@media (max-width:980px){.cla_cols,.ww_split,.ro_split,.ce_form{grid-template-columns:1fr}.csp .box{grid-template-columns:repeat(4,1fr)}.ww_clk{grid-template-columns:1fr 1fr}.ro_grid{grid-template-columns:1fr}.ro_list{columns:1}}
/* Scroll hint as a dot icon: rows light up top to bottom, like the menu icons */
.shint{display:inline-flex;align-items:center;gap:8px}
.di[data-p="scroll"] i{opacity:.2;animation:sdrop 1.6s steps(1) infinite}
.di[data-p="scroll"] i:nth-child(n+5){animation-delay:.2s}
.di[data-p="scroll"] i:nth-child(n+9){animation-delay:.4s}
.di[data-p="scroll"] i:nth-child(n+13){animation-delay:.6s}
@keyframes sdrop{0%{opacity:.95}25%{opacity:.2}100%{opacity:.2}}
.hA .shint .di{position:static;max-width:none;color:inherit;line-height:0}

.di[data-p="home"] i{opacity:.25}
.di[data-p="home"] i:nth-child(2),.di[data-p="home"] i:nth-child(3),.di[data-p="home"] i:nth-child(5),.di[data-p="home"] i:nth-child(6),.di[data-p="home"] i:nth-child(7),.di[data-p="home"] i:nth-child(8),.di[data-p="home"] i:nth-child(9),.di[data-p="home"] i:nth-child(12),.di[data-p="home"] i:nth-child(13),.di[data-p="home"] i:nth-child(16){opacity:.9}
.dl:hover .di[data-p="home"] i{animation-name:dotc}

.cp_row i.mono{display:grid;place-items:center;background:#1E1E1E;color:#8A8A8A;font-size:.34em;font-weight:500;letter-spacing:0}
.av_more{cursor:pointer}

/* Recognition: a small cup */
.di[data-p="awards"] i{opacity:.25}
.di[data-p="awards"] i:nth-child(1),.di[data-p="awards"] i:nth-child(2),.di[data-p="awards"] i:nth-child(3),.di[data-p="awards"] i:nth-child(4),.di[data-p="awards"] i:nth-child(6),.di[data-p="awards"] i:nth-child(7),.di[data-p="awards"] i:nth-child(11),.di[data-p="awards"] i:nth-child(14),.di[data-p="awards"] i:nth-child(15){opacity:.9}
.dl:hover .di[data-p="awards"] i{animation-name:dots}

/* Clients panel: closing "and many more" row */
.cp_row.cp_more{cursor:default}.cp_row.cp_more i{font-style:normal;background:transparent;border:1px solid rgba(255,255,255,.4);color:#fff;font-size:.55em;font-weight:300;letter-spacing:0}.cp_row.cp_more span{color:#9A9A9A}