/* 6 Nov pass 2: the menu slides in from the right as a side panel, like the Group Partners intelligent menu */
nav.main{display:block !important;position:fixed !important;inset:0 !important;top:0 !important;z-index:60;background:none !important;border:0 !important;padding:0 !important;visibility:hidden;pointer-events:none}
nav.main.on{visibility:visible;pointer-events:auto}
nav.main .np-scrim{position:absolute;inset:0;background:rgba(0,0,0,.5);opacity:0;transition:opacity .45s ease}
nav.main.on .np-scrim{opacity:1}
nav.main .np{position:absolute;top:0;right:0;bottom:0;width:min(440px,100vw);background:#000;color:#fff;display:flex;flex-direction:column;padding:calc(22px + env(safe-area-inset-top)) clamp(26px,3vw,40px) calc(26px + env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;transform:translate3d(100%,0,0);transition:transform .5s cubic-bezier(.2,.7,.1,1);box-shadow:-1px 0 0 rgba(255,198,41,.28),-24px 0 60px rgba(0,0,0,.6)}
nav.main.on .np{transform:none}
nav.main .navdots{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:.55;pointer-events:none}
nav.main .np>*:not(canvas){position:relative;z-index:1}
nav.main .np-top{display:flex;align-items:center;min-height:52px;margin-right:60px}
nav.main a.np-home{font:800 12px/1 Archivo,Arial,sans-serif;font-stretch:80%;text-transform:uppercase;letter-spacing:.3em;color:#fff;text-decoration:none;box-shadow:none;padding:0}
nav.main a.np-home:hover{color:#FFC629}
nav.main .np-here{margin:clamp(28px,5vh,46px) 0 0;font:400 17px/1.4 Atkinson,Arial,sans-serif;color:rgba(255,255,255,.66)}
nav.main .np-here b{font-weight:700;color:#fff}
nav.main .np-here a{display:inline;padding:0;font:inherit;color:#FFC629;text-decoration:none;box-shadow:none;border-bottom:1px solid rgba(255,198,41,.5);white-space:nowrap;letter-spacing:0}
nav.main .np-l{list-style:none;margin:clamp(16px,3vh,26px) 0 0;padding:0;border-top:1px solid rgba(255,255,255,.14)}
nav.main .np-l li{border-bottom:1px solid rgba(255,255,255,.14)}
nav.main .np-l a{position:relative;display:block;padding:15px 36px 14px 0;color:#fff;text-decoration:none;box-shadow:none;font:inherit;letter-spacing:0}
nav.main .np-n{display:block;font:800 clamp(25px,3.3vh,31px)/1.06 Archivo,Arial,sans-serif;font-stretch:82%;letter-spacing:-.012em;transition:transform .35s cubic-bezier(.2,.7,.1,1)}
nav.main .np-d{display:block;margin-top:5px;font:400 15px/1.35 Atkinson,Arial,sans-serif;color:rgba(255,255,255,.56)}
nav.main .np-l a::after{content:"\2192";position:absolute;right:2px;top:50%;margin-top:-.6em;font-size:18px;color:rgba(255,255,255,.35);transition:transform .3s,color .3s}
nav.main .np-l a:hover .np-n,nav.main .np-l a:focus-visible .np-n{transform:translateX(4px)}
nav.main .np-l a:hover::after,nav.main .np-l a:focus-visible::after{color:#fff;transform:translateX(3px)}
nav.main .np-l a:focus-visible,nav.main .np-ask:focus-visible{outline:2px solid #FFC629;outline-offset:2px}
nav.main .np-l a[aria-current]{padding-left:18px}
nav.main .np-l a[aria-current]::before{content:"";position:absolute;left:0;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:#FFC629;box-shadow:0 0 0 4px rgba(255,198,41,.14),0 0 12px rgba(255,198,41,.8)}
nav.main .np-l a[aria-current] .np-d{color:#FFC629}
nav.main .np-l a[aria-current]::after{content:none}
nav.main .np-l a.sug::after{color:#FFC629}
nav.main .np-f{margin-top:auto;padding-top:clamp(26px,5vh,42px)}
nav.main a.np-ask{display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:12px;padding:15px 20px;border-radius:2px;background:#FFC629;color:#0E1414;text-decoration:none;box-shadow:0 0 24px rgba(255,198,41,.25);font:inherit;letter-spacing:0}
nav.main .np-an{font:800 20px/1.1 Archivo,Arial,sans-serif;font-stretch:84%}
nav.main .np-ad{grid-row:2;font:400 14px/1.3 Atkinson,Arial,sans-serif;color:rgba(14,20,20,.75)}
nav.main .np-ask i{grid-row:1/3;grid-column:2;font-style:normal;font-size:22px;transition:transform .3s}
nav.main a.np-ask:hover i{transform:translateX(3px)}
nav.main a.np-ask[aria-current]{box-shadow:0 0 0 2px #fff}
body.menu-open{overflow:hidden}
body.menu-open header.v2{z-index:80;position:fixed}
@media (max-height:640px){nav.main .np-n{font-size:23px}nav.main .np-l a{padding:10px 36px 9px 0}nav.main .np-d{font-size:14px}}
@media (prefers-reduced-motion:reduce){nav.main .np,nav.main .np-scrim,nav.main .np-n,nav.main .np-l a::after{transition:none}}
@media (max-width:600px){body.menu-open header.v2 .brand{visibility:hidden}}

/* 6 Nov pass 2: home hero. One three-line block, "Nothing is / real until / it connects.", set clear of the spark.
   The image is placed so the spark sits about 73% across on desktop and high on the right on phones. */
body.v3 .hero{--F:min(10.4vw,17.5svh,172px)}
body.v3 .hero .ph{container-type:size;overflow:hidden}
body.v3 .hero .ph img{position:absolute;max-width:none;object-fit:cover;--IW:max(130cqw,177.78cqh);width:var(--IW);height:calc(var(--IW) * .5625);left:clamp(calc(100cqw - var(--IW)),calc(72cqw - var(--IW) * .797),0px);top:clamp(calc(100cqh - var(--IW) * .5625),calc(50cqh - var(--IW) * .297),0px)}
@supports not (width:1cqw){body.v3 .hero .ph img{position:static;width:100%;height:100%;object-position:100% 50%}}
body.v3 .hero h1{font:900 var(--F)/.88 Archivo,Arial,sans-serif;font-stretch:78%;letter-spacing:-.02em;word-spacing:.04em;margin-left:-.05em;font-kerning:normal;text-wrap:nowrap}
body.v3 .hero h1 span{display:block;white-space:nowrap}
body.v3 .hero .kick{margin-top:clamp(24px,2.8vw,40px);font:600 clamp(18px,1.5vw,22px)/1.42 Archivo,Arial,sans-serif;letter-spacing:.004em}
@media (min-width:761px){
 body.v3 .hero .copy{top:50%;bottom:auto;transform:translateY(-50%)}
 body.v3 .hero .ph::after{background:linear-gradient(90deg,rgba(0,0,0,.74) 0,rgba(0,0,0,.42) 36%,rgba(0,0,0,0) 60%),linear-gradient(180deg,rgba(0,0,0,.5) 0,rgba(0,0,0,0) 16%,rgba(0,0,0,0) 76%,#000 100%)}
}
/* tablets held upright: words low, spark high */
@media (min-width:761px) and (orientation:portrait){
 body.v3 .hero .copy{top:auto;bottom:clamp(56px,8vh,96px);transform:none}
 body.v3 .hero .ph img{left:clamp(calc(100cqw - var(--IW)),calc(66cqw - var(--IW) * .797),0px);top:clamp(calc(100cqh - var(--IW) * .5625),calc(30cqh - var(--IW) * .297),0px);--IW:max(150cqw,240cqh)}
 body.v3 .hero .ph::after{background:linear-gradient(180deg,rgba(0,0,0,.5) 0,rgba(0,0,0,0) 16%,rgba(0,0,0,0) 46%,rgba(0,0,0,.78) 76%,#000 100%)}
}
@media (max-width:760px){
 body.v3 .hero{--F:calc((100vw - 36px) / 4.4)}
 body.v3 .hero .ph{height:82svh;min-height:560px;max-height:800px}
 body.v3 .hero .ph img{--IW:max(150cqw,256cqh);left:clamp(calc(100cqw - var(--IW)),calc(68cqw - var(--IW) * .797),0px);top:clamp(calc(100cqh - var(--IW) * .5625),calc(30cqh - var(--IW) * .297),0px)}
 body.v3 .hero .ph::after{background:linear-gradient(180deg,rgba(0,0,0,.55) 0,rgba(0,0,0,0) 14%,rgba(0,0,0,0) 44%,rgba(0,0,0,.82) 74%,#000 100%)}
 body.v3 .hero .copy{bottom:30px}
 body.v3 .hero h1{font-stretch:68%;letter-spacing:-.018em;line-height:.9;margin-left:-.04em}
 body.v3 .hero .kick{font-size:17px;margin-top:20px}
}

/* 6 Nov pass 2: balanced breaks and no widows, sitewide */
h1,h2,h3,figcaption,.strap,.lead,.sub,.aim,.kick span,.lbl,.n,.np-d,blockquote{text-wrap:balance}
p.bal{text-wrap:balance}
p,li{text-wrap:pretty}
.readout span.rl{display:block;text-wrap:balance}
.readout span.cf{display:block;margin-top:4px;color:#fff;font-weight:700}

/* 6 Nov pass 2: "Every gap has a name." stands back from the gap so its glow is clear */
@media (min-width:761px){
 .chap.gap .copy{right:calc(37% + clamp(64px,8vw,150px))}
 .chap.gap .strap{max-width:23em}
}
@media (max-width:760px){
 .chap.gap .ph img{object-position:50% 50%}
 .chap.gap h2{font-size:min(54px,calc((100vw - 120px) / 5.4))}
 .chap.gap h2 span:not(.dots){display:block}
 .chap.gap .copy .wrap{padding-right:18%}
 .chap.gap h2 span:not(.dots){white-space:nowrap}
 .chap.gap .strap{max-width:19.5em;padding-right:4%}
}

/* 6 Nov pass 2: four-up cards go two-up until there is room, so headlines keep their shape */
@media (min-width:761px) and (max-width:1180px){.grid.g4,.cases{grid-template-columns:1fr 1fr}}

/* 6 Nov pass 2: headlines as small set pieces: kerning on, tracking tightens as size grows, even leading */
h1,h2,h3{font-kerning:normal;font-feature-settings:"kern" 1,"liga" 1}
.ihero h1{letter-spacing:-.027em;word-spacing:.06em;line-height:.87}
.chap h2,.band h2{letter-spacing:-.024em;word-spacing:.05em}
.what h2,.conn h2,.proof h2,.close h2,.connectors h2,.blk h2,.build3 h3{line-height:.98;letter-spacing:-.02em}
.card h3,.case h3,.book h3{line-height:1.06}
.nw{white-space:nowrap}

/* Nicole's NYC logo in the header, 6 Nov 2026 (from her BW_NYC_SHORT_SLUG artwork) */
header.v2 .brand img{height:44px;width:auto}
@media (max-width:760px){header.v2 .brand img{height:36px}}

/* 10 Nov 06:39: "The right expertise / at the moment it counts." on the weld image; phones a touch smaller so "at the moment" stays clear of the lit gap */
@media (max-width:760px){
 .chap.gap h2{font-size:min(54px,calc((100vw - 120px) / 6))}
}