/* ClickBurst v4 — studio layer. Every rule is scoped to html.cb4on-<feature>,
   so switching a flag off in cb-v4.js removes its styles too. */
.cb4{--cb4-ink:#111111;--cb4-paper:#F4F1EA;--cb4-white:#FFFDF8;--cb4-lime:#D8FF3E;--cb4-blue:#2457FF;--cb4-red:#FF4D3D;--cb4-line:#D4D0C7;--cb4-display:"Space Grotesk",system-ui,sans-serif;--cb4-sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;--cb4-ease:cubic-bezier(.16,1,.3,1);--cb4-io:cubic-bezier(.76,0,.24,1)}

/* ---------- CALM REVEALS (Ganesh 11:28: nothing flies in from the sides; no wipes) ----------
   One quiet entrance for every block: short fade + 10px rise. Overrides the older left/right/tilt/blur/sweep layers. */
html.cb4on-calm .reveal:not(.cap),html.cb4on-calm .reveal.scroll-flow:not(.cap),html.cb4on-calm .reveal[data-enter]:not(.cap){opacity:0!important;filter:none!important;clip-path:none!important;transform:translate3d(0,10px,0)!important;transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .85s cubic-bezier(.16,1,.3,1)!important;will-change:auto!important;perspective:none!important}
html.cb4on-calm .reveal.in:not(.cap),html.cb4on-calm .reveal.scroll-flow.in:not(.cap),html.cb4on-calm .reveal.in[data-enter]:not(.cap){opacity:1!important;transform:none!important}
html.cb4on-calm .reveal::after,html.cb4on-calm .reveal::before{display:none!important}
html.cb4on-calm .section-head.reveal>*,html.cb4on-calm .proof-wrap.reveal .proof-story,html.cb4on-calm .proof-wrap.reveal .proof-metrics,html.cb4on-calm .creative-card.reveal>*,html.cb4on-calm .service-row.reveal h3,html.cb4on-calm .service-row.reveal p,html.cb4on-calm .service-row.reveal .num,html.cb4on-calm .service-row.reveal .arrow,html.cb4on-calm .process-step.reveal strong,html.cb4on-calm .process-step.reveal p{transform:none!important}
html.cb4on-calm .reveal:nth-child(2){transition-delay:.06s!important}
html.cb4on-calm .reveal:nth-child(3){transition-delay:.12s!important}
html.cb4on-calm .reveal:nth-child(4){transition-delay:.18s!important}
html.cb4on-calm .reveal:nth-child(n+5){transition-delay:.22s!important}
html.cb4on-calm .cbd-reveal:not(.cbd-in){transform:translate3d(0,10px,0)}
html.cb4on-calm .cb2-rv:not(.cb2-in){transform:translate3d(0,10px,0)}
@media (prefers-reduced-motion:reduce){ html.cb4on-calm .reveal:not(.cap),html.cb4on-calm .reveal[data-enter]:not(.cap){opacity:1!important;transform:none!important;transition:none!important} }

/* ---------- PERF: CSS animations pause while their section is off screen ---------- */
.cb4-idle,.cb4-idle *{animation-play-state:paused!important}

/* ---------- A. smooth scroll: native smooth anchors would fight the inertia ---------- */
html.cb4on-smooth{scroll-behavior:auto!important}

/* shared kicker */
.cb4-film-k{display:inline-flex;align-items:center;gap:10px;font:700 11px/1 var(--cb4-display);letter-spacing:.2em;text-transform:uppercase}
.cb4-film-k svg{width:14px;height:14px;fill:var(--cb4-lime)}

/* ---------- B. film strip ---------- */
html.cb4on-filmstrip .cb4-film{position:relative;background:var(--cb4-ink);color:var(--cb4-white);isolation:isolate;overflow:clip}
html.cb4on-filmstrip .cb4-film-pin{padding:clamp(76px,10vw,120px) 0 clamp(60px,8vw,96px);display:flex;flex-direction:column;gap:clamp(26px,4vh,46px)}
html.cb4on-filmstrip .cb4-film.is-pinned .cb4-film-pin{position:sticky;top:0;height:100vh;height:100svh;padding:clamp(104px,14vh,140px) 0 clamp(22px,4vh,44px);justify-content:center;overflow:hidden;box-sizing:border-box}
html.cb4on-filmstrip .cb4-film-head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:14px 32px}
html.cb4on-filmstrip .cb4-film-head .cb4-film-k{grid-column:1/-1;color:#B3AFA6}
html.cb4on-filmstrip .cb4-film h2{margin:0;font:700 clamp(46px,min(7.4vw,12vh),118px)/.86 var(--cb4-display);letter-spacing:-.045em;color:var(--cb4-white)}
html.cb4on-filmstrip .cb4-film h2 span{color:transparent;-webkit-text-stroke:1.5px var(--cb4-lime)}
html.cb4on-filmstrip .cb4-film-meta{display:flex;flex-direction:column;align-items:flex-end;gap:14px;padding-bottom:6px}
html.cb4on-filmstrip .cb4-film-count{font:600 13px/1 var(--cb4-display);letter-spacing:.16em;color:#85817A;font-variant-numeric:tabular-nums}
html.cb4on-filmstrip .cb4-film-count b{color:var(--cb4-lime);font-size:30px;letter-spacing:-.02em;margin-right:4px}
html.cb4on-filmstrip .cb4-film-all{display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border:1px solid rgba(244,241,234,.28);border-radius:999px;color:var(--cb4-white);font:600 13px/1 var(--cb4-display);letter-spacing:.02em;text-decoration:none;transition:background .25s ease,color .25s ease,border-color .25s ease}
html.cb4on-filmstrip .cb4-film-all:hover,html.cb4on-filmstrip .cb4-film-all:focus-visible{background:var(--cb4-lime);color:var(--cb4-ink);border-color:var(--cb4-lime)}
html.cb4on-filmstrip .cb4-film-rail{position:relative}
html.cb4on-filmstrip .cb4-film-track{--fh:clamp(240px,44vh,460px);display:flex;align-items:stretch;gap:0;margin:0;padding:0 max(24px,calc((100vw - 1280px)/2));list-style:none;will-change:transform}
html.cb4on-filmstrip .cb4-film:not(.is-pinned) .cb4-film-track{--fh:clamp(300px,98vw,440px);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;overscroll-behavior-x:contain;padding:0 18px;scroll-padding:0 18px}
html.cb4on-filmstrip .cb4-film:not(.is-pinned) .cb4-film-track::-webkit-scrollbar{display:none}
/* each frame = a piece of 35mm film: sprockets top + bottom */
html.cb4on-filmstrip .cb4-frame{position:relative;flex:0 0 auto;display:flex;flex-direction:column;gap:8px;padding:30px 12px;background:#1A1A1A;scroll-snap-align:start;border-left:1px solid #000}
html.cb4on-filmstrip .cb4-frame::before,html.cb4on-filmstrip .cb4-frame::after{content:"";position:absolute;left:0;right:0;height:10px;background:radial-gradient(circle at 50% 50%,#0B0B0B 0 2.4px,transparent 2.6px) 0 0/16px 10px repeat-x,linear-gradient(#0B0B0B,#0B0B0B) 0 50%/100% 0 no-repeat;opacity:1}
html.cb4on-filmstrip .cb4-frame::before{top:9px;background:repeating-linear-gradient(90deg,#0B0B0B 0 8px,transparent 8px 16px);height:7px;border-radius:2px;left:6px;right:6px}
html.cb4on-filmstrip .cb4-frame::after{bottom:9px;background:repeating-linear-gradient(90deg,#0B0B0B 0 8px,transparent 8px 16px);height:7px;border-radius:2px;left:6px;right:6px}
html.cb4on-filmstrip .cb4-frame:first-child{border-radius:8px 0 0 8px;border-left:0}
html.cb4on-filmstrip .cb4-frame-top,html.cb4on-filmstrip .cb4-frame-bot{display:flex;justify-content:space-between;align-items:center;font:600 10px/1 var(--cb4-display);letter-spacing:.16em;text-transform:uppercase;color:#85817A;font-variant-numeric:tabular-nums}
html.cb4on-filmstrip .cb4-frame-top span:first-child{color:var(--cb4-lime)}
html.cb4on-filmstrip .cb4-frame-bot i{flex:1;height:1px;margin:0 10px;background:rgba(244,241,234,.16)}
html.cb4on-filmstrip .cb4-frame-media{position:relative;display:block;height:var(--fh);aspect-ratio:9/16;padding:0;border:0;border-radius:4px;overflow:hidden;background:#0B0B0B;cursor:pointer;-webkit-tap-highlight-color:transparent}
html.cb4on-filmstrip .cb4-frame-media img,html.cb4on-filmstrip .cb4-frame-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .9s var(--cb4-ease),filter .5s ease}
html.cb4on-filmstrip .cb4-frame-media img{filter:grayscale(.35) contrast(1.04)}
html.cb4on-filmstrip .cb4-frame-media video{opacity:0;transition:opacity .35s ease}
html.cb4on-filmstrip .cb4-frame-media.is-playing video{opacity:1}
html.cb4on-filmstrip .cb4-frame-media:hover img,html.cb4on-filmstrip .cb4-frame-media:focus-visible img{filter:none;transform:scale(1.04)}
html.cb4on-filmstrip .cb4-frame-media:focus-visible{outline:2px solid var(--cb4-lime);outline-offset:3px}
html.cb4on-filmstrip .cb4-frame-play{position:absolute;left:12px;bottom:12px;width:34px;height:34px;border-radius:50%;background:var(--cb4-lime);display:grid;place-items:center;transition:transform .4s var(--cb4-ease),opacity .3s ease;z-index:2}
html.cb4on-filmstrip .cb4-frame-play::before{content:"";width:0;height:0;border-left:9px solid var(--cb4-ink);border-top:6px solid transparent;border-bottom:6px solid transparent;margin-left:2px}
html.cb4on-filmstrip .cb4-frame-media.is-playing .cb4-frame-play{transform:scale(.6);opacity:0}
html.cb4on-filmstrip .cb4-frame-end{border-radius:0 8px 8px 0;justify-content:center;padding:30px 12px}
html.cb4on-filmstrip .cb4-frame-end a{display:flex;flex-direction:column;justify-content:flex-end;height:calc(var(--fh) + 36px);aspect-ratio:9/16.6;padding:22px;border-radius:4px;background:var(--cb4-lime);color:var(--cb4-ink);text-decoration:none;transition:background .3s ease}
html.cb4on-filmstrip .cb4-frame-end a span{font:600 12px/1 var(--cb4-display);letter-spacing:.16em;text-transform:uppercase}
html.cb4on-filmstrip .cb4-frame-end a b{font:700 clamp(30px,3vw,44px)/.95 var(--cb4-display);letter-spacing:-.04em;margin-top:8px}
html.cb4on-filmstrip .cb4-frame-end a em{font-style:normal;font:500 40px/1 var(--cb4-display);margin-top:auto;order:-1;align-self:flex-end;transition:transform .4s var(--cb4-ease)}
html.cb4on-filmstrip .cb4-frame-end a:hover em{transform:translate(6px,-6px) rotate(-45deg)}
html.cb4on-filmstrip .cb4-film-bar{height:2px;background:rgba(244,241,234,.12);border-radius:2px;overflow:hidden}
html.cb4on-filmstrip .cb4-film-bar i{display:block;height:100%;background:var(--cb4-lime);transform:scaleX(0);transform-origin:left center}
/* entrance */
html.cb4on-filmstrip .cb4-film .cb4-frame{opacity:0;transform:translate3d(60px,0,0);transition:opacity .7s ease calc(var(--i,0)*70ms),transform 1s var(--cb4-ease) calc(var(--i,0)*70ms)}
html.cb4on-filmstrip .cb4-film.in .cb4-frame{opacity:1;transform:none}
@media (max-width:900px){
  html.cb4on-filmstrip .cb4-film-head{grid-template-columns:1fr}
  html.cb4on-filmstrip .cb4-film-meta{flex-direction:row;align-items:center;justify-content:space-between}
  html.cb4on-filmstrip .cb4-film-track{--fh:clamp(300px,100vw,430px)}
  html.cb4on-filmstrip .cb4-frame{padding:26px 9px}
}
@media (max-width:480px){ html.cb4on-filmstrip .cb4-film-track{--fh:min(98vw,420px)} html.cb4on-filmstrip .cb4-frame-media{height:auto;width:62vw} html.cb4on-filmstrip .cb4-frame-end a{height:auto;width:62vw;aspect-ratio:9/17.2} }
@media (prefers-reduced-motion:reduce){ html.cb4on-filmstrip .cb4-film .cb4-frame{opacity:1;transform:none;transition:none} }

/* ---------- C. liquid ripple ---------- */
html.cb4on-liquid .cb4-liq-on{filter:url(#cb4-liquid)!important;transform:scale(1.06)!important}

/* ---------- D. fullscreen menu ---------- */
html.cb4on-menu .nav .menu{display:grid!important;place-items:center!important;align-self:center;width:42px;height:42px;padding:0!important;flex:0 0 42px;line-height:0}
html.cb4on-menu .nav .menu span{margin:0!important}
html.cb4on-menu .site-navbar .hamburger-btn{display:flex!important}
html.cb4on-menu #mobileMenu,html.cb4on-menu .mobile-nav-drawer,html.cb4on-menu .mobile-nav-overlay{display:none!important}
html.cb4-menu-open,html.cb4-menu-open body{overflow:hidden!important}
.cb4-menu{position:fixed;inset:0;z-index:100000;color:var(--cb4-white);font-family:var(--cb4-sans)}
.cb4-menu[hidden]{display:none}
.cb4-menu-wipe,.cb4-menu-panel{position:absolute;inset:0;clip-path:inset(0 0 100% 0);transition:clip-path .62s var(--cb4-io)}
.cb4-menu-wipe{background:var(--cb4-lime)}
.cb4-menu-panel{background:var(--cb4-ink);transition-delay:.09s;display:flex;flex-direction:column;padding:clamp(18px,3vw,34px) clamp(18px,4vw,56px) clamp(20px,3vw,36px);overflow-y:auto;overscroll-behavior:contain}
.cb4-menu.is-open .cb4-menu-wipe,.cb4-menu.is-open .cb4-menu-panel{clip-path:inset(0)}
.cb4-menu.is-closing .cb4-menu-wipe{clip-path:inset(0 0 0 0);transition-delay:.12s}
.cb4-menu.is-closing .cb4-menu-panel{clip-path:inset(100% 0 0 0);transition-delay:0s;transition-duration:.5s}
.cb4-menu.is-closing .cb4-menu-wipe{clip-path:inset(100% 0 0 0)}
.cb4-menu-top{display:flex;align-items:center;gap:18px;padding-bottom:18px;border-bottom:1px solid rgba(244,241,234,.12)}
.cb4-menu-brand{display:inline-flex;align-items:center;gap:10px;font:700 18px/1 var(--cb4-display);letter-spacing:-.02em}
.cb4-menu-brand img{border-radius:8px}
.cb4-menu-tag{font:600 10px/1 var(--cb4-display);letter-spacing:.2em;text-transform:uppercase;color:#85817A}
.cb4-menu-x{margin-left:auto;display:inline-flex;align-items:center;gap:12px;padding:10px 6px 10px 16px;border:1px solid rgba(244,241,234,.22);border-radius:999px;background:transparent;color:var(--cb4-white);font:600 12px/1 var(--cb4-display);letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
.cb4-menu-x i{position:relative;width:26px;height:26px;border-radius:50%;background:var(--cb4-lime);transition:transform .4s var(--cb4-ease)}
.cb4-menu-x i::before,.cb4-menu-x i::after{content:"";position:absolute;left:7px;right:7px;top:50%;height:1.6px;margin-top:-.8px;background:var(--cb4-ink);transform:rotate(45deg)}
.cb4-menu-x i::after{transform:rotate(-45deg)}
.cb4-menu-x:hover i,.cb4-menu-x:focus-visible i{transform:rotate(90deg)}
.cb4-menu-x:focus-visible,.cb4-menu-nav a:focus-visible,.cb4-menu-foot a:focus-visible{outline:2px solid var(--cb4-lime);outline-offset:4px}
.cb4-menu-nav{flex:1;display:flex;align-items:center;padding:clamp(18px,4vh,40px) 0}
.cb4-menu-nav ol{list-style:none;margin:0;padding:0;width:100%}
.cb4-menu-nav li{overflow:hidden;border-bottom:1px solid rgba(244,241,234,.08)}
.cb4-menu-nav a{display:flex;align-items:baseline;gap:clamp(12px,2vw,28px);padding:.04em 0 .06em;color:var(--cb4-white);text-decoration:none;font:700 clamp(44px,9.2vh,118px)/.98 var(--cb4-display);letter-spacing:-.05em;transform:translate3d(0,108%,0);transition:transform .8s var(--cb4-ease),color .25s ease,opacity .3s ease}
.cb4-menu.is-open .cb4-menu-nav a{transform:none;transition-delay:calc(.24s + var(--i,0)*.05s),0s,0s}
.cb4-menu-nav a .cb4-m-n{font:600 12px/1 var(--cb4-display);letter-spacing:.14em;color:#85817A;transform:translateY(-1.9em);min-width:2.2em}
.cb4-menu-nav a .cb4-m-a{margin-left:auto;font-size:.42em;color:var(--cb4-lime);opacity:0;transform:translate(-14px,10px);transition:opacity .25s ease,transform .45s var(--cb4-ease)}
.cb4-menu-nav a[aria-current="page"] .cb4-m-t{color:var(--cb4-lime)}
@media (hover:hover) and (pointer:fine){
  .cb4-menu.has-hover .cb4-menu-nav a{opacity:.28}
  .cb4-menu.has-hover .cb4-menu-nav a:hover{opacity:1;color:var(--cb4-lime)}
  .cb4-menu-nav a:hover .cb4-m-a{opacity:1;transform:none}
  .cb4-menu-nav a:hover .cb4-m-t{transform:translateX(10px)}
  .cb4-menu-nav a .cb4-m-t{display:inline-block;transition:transform .5s var(--cb4-ease)}
}
.cb4-menu-foot{display:flex;flex-wrap:wrap;align-items:center;gap:10px 26px;padding-top:18px;border-top:1px solid rgba(244,241,234,.12);opacity:0;transform:translateY(14px);transition:opacity .5s ease,transform .7s var(--cb4-ease)}
.cb4-menu.is-open .cb4-menu-foot{opacity:1;transform:none;transition-delay:.55s}
.cb4-menu-foot a{color:#B3AFA6;font:600 13px/1.2 var(--cb4-display);letter-spacing:.02em;text-decoration:none;transition:color .2s ease}
.cb4-menu-foot a:hover{color:var(--cb4-white)}
.cb4-menu-foot .cb4-menu-cta{margin-left:auto;padding:13px 20px;border-radius:999px;background:var(--cb4-lime);color:var(--cb4-ink)!important}
.cb4-menu-nav,.cb4-menu-top,.cb4-menu-foot{position:relative;z-index:2}
.cb4-menu-pv{position:fixed;left:0;top:0;z-index:1;pointer-events:none;width:clamp(170px,15vw,230px)}
.cb4-menu-pv-in{position:relative;width:100%;aspect-ratio:9/16;margin:-89% 0 0 -50%;border-radius:10px;overflow:hidden;background:#0B0B0B;transform:scale(.4) rotate(-6deg);opacity:0;transition:transform .5s var(--cb4-ease),opacity .25s ease;box-shadow:0 30px 70px -20px rgba(0,0,0,.7);border:1px solid rgba(216,255,62,.5)}
.cb4-menu-pv.on .cb4-menu-pv-in{transform:none;opacity:1}
.cb4-menu-pv img,.cb4-menu-pv video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cb4-menu-pv-tc{position:absolute;left:10px;top:10px;padding:4px 7px 4px 16px;border-radius:4px;background:rgba(17,17,17,.7);font:700 9px/1 var(--cb4-display);letter-spacing:.18em;color:var(--cb4-white)}
.cb4-menu-pv-tc::before{content:"";position:absolute;left:6px;top:50%;width:5px;height:5px;margin-top:-2.5px;border-radius:50%;background:var(--cb4-red);animation:cb4-blink 1s steps(2) infinite}
@keyframes cb4-blink{50%{opacity:0}}
@media (max-width:640px){
  .cb4-menu-tag{display:none}
  .cb4-menu-nav a{font-size:clamp(40px,12.5vw,62px)}
  .cb4-menu-nav a .cb4-m-n{transform:translateY(-1.4em)}
  .cb4-menu-foot .cb4-menu-cta{margin-left:0;width:100%;text-align:center}
}
@media (prefers-reduced-motion:reduce){ .cb4-menu-wipe,.cb4-menu-panel,.cb4-menu-nav a,.cb4-menu-foot{transition:none!important} }

/* ---------- E. decode: keep scrambling glyphs from shifting baselines ---------- */
html.cb4on-decode main h2,html.cb4on-decode .cb4-menu-nav .cb4-m-t{font-variant-ligatures:none}

/* ---------- F. build your brief ---------- */
html.cb4on-brief .cb4-brief{position:relative;background:var(--cb4-paper);color:var(--cb4-ink);padding:clamp(80px,10vw,140px) 0;border-top:1px solid var(--cb4-ink)}
html.cb4on-brief .cb4-brief-in{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(32px,6vw,96px);align-items:start}
html.cb4on-brief .cb4-brief-head{position:sticky;top:120px}
html.cb4on-brief .cb4-brief-head .cb4-film-k{color:var(--cb4-ink)}
html.cb4on-brief .cb4-brief-head .cb4-film-k svg{fill:var(--cb4-blue)}
html.cb4on-brief .cb4-brief h2{margin:18px 0 20px;font:700 clamp(46px,6.6vw,104px)/.88 var(--cb4-display);letter-spacing:-.05em}
html.cb4on-brief .cb4-brief h2 span{background:var(--cb4-lime);padding:0 .08em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
html.cb4on-brief .cb4-brief-head p{max-width:30ch;margin:0;color:#4a4842;font:500 16px/1.55 var(--cb4-sans)}
html.cb4on-brief .cb4-brief-form{display:grid;gap:clamp(22px,3vw,32px)}
html.cb4on-brief .cb4-brief-form fieldset{margin:0;padding:0 0 clamp(20px,2.6vw,28px);border:0;border-bottom:1px solid var(--cb4-line);min-width:0}
html.cb4on-brief .cb4-brief-form legend,html.cb4on-brief .cb4-brief-name label{display:flex;align-items:baseline;gap:12px;padding:0;margin-bottom:16px;font:700 clamp(19px,1.8vw,24px)/1.1 var(--cb4-display);letter-spacing:-.02em}
html.cb4on-brief .cb4-brief-form legend b,html.cb4on-brief .cb4-brief-name label b{font:700 11px/1 var(--cb4-display);letter-spacing:.14em;color:var(--cb4-blue)}
html.cb4on-brief .cb4-brief-form legend small,html.cb4on-brief .cb4-brief-name label small{font:500 12px/1 var(--cb4-sans);letter-spacing:0;color:#85817A}
html.cb4on-brief .cb4-chips{display:flex;flex-wrap:wrap;gap:10px}
html.cb4on-brief .cb4-chip{position:relative;cursor:pointer;-webkit-tap-highlight-color:transparent}
html.cb4on-brief .cb4-chip input{position:absolute;opacity:0;width:1px;height:1px}
html.cb4on-brief .cb4-chip span{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;border:1px solid var(--cb4-ink);border-radius:999px;background:transparent;font:600 14px/1 var(--cb4-display);letter-spacing:-.005em;transition:background .2s ease,color .2s ease,transform .2s var(--cb4-ease)}
html.cb4on-brief .cb4-chip span::before{content:"";width:7px;height:7px;border-radius:50%;border:1px solid currentColor;transition:background .2s ease,transform .3s var(--cb4-ease)}
html.cb4on-brief .cb4-chip:hover span{background:rgba(17,17,17,.06)}
html.cb4on-brief .cb4-chip input:checked+span{background:var(--cb4-ink);color:var(--cb4-lime)}
html.cb4on-brief .cb4-chip input:checked+span::before{background:var(--cb4-lime);border-color:var(--cb4-lime);transform:scale(1.15)}
html.cb4on-brief .cb4-chip input:focus-visible+span{outline:2px solid var(--cb4-blue);outline-offset:3px}
html.cb4on-brief .cb4-chip:active span{transform:scale(.97)}
html.cb4on-brief .cb4-brief-name input{width:100%;box-sizing:border-box;height:52px;padding:0 18px;border:1px solid var(--cb4-ink);border-radius:14px;background:var(--cb4-white);font:500 16px/1 var(--cb4-sans);color:var(--cb4-ink)}
html.cb4on-brief .cb4-brief-name input:focus{outline:2px solid var(--cb4-blue);outline-offset:2px}
html.cb4on-brief .cb4-brief-out{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:end;margin-top:6px}
html.cb4on-brief .cb4-bubble{position:relative;padding:16px 18px 18px;border-radius:18px 18px 18px 4px;background:var(--cb4-ink);color:var(--cb4-white)}
html.cb4on-brief .cb4-bubble-k{display:block;margin-bottom:10px;font:700 10px/1 var(--cb4-display);letter-spacing:.18em;text-transform:uppercase;color:var(--cb4-lime)}
html.cb4on-brief .cb4-bubble pre{margin:0;white-space:pre-wrap;word-break:break-word;font:500 13.5px/1.55 var(--cb4-sans);color:#E9E6DE}
html.cb4on-brief .cb4-brief-go{display:inline-flex;align-items:center;gap:14px;padding:20px 26px;border-radius:999px;background:var(--cb4-ink);color:var(--cb4-white);text-decoration:none;font:700 16px/1 var(--cb4-display);letter-spacing:-.01em;white-space:nowrap;transition:background .25s ease,color .25s ease,transform .3s var(--cb4-ease)}
html.cb4on-brief .cb4-brief-go em{font-style:normal;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--cb4-lime);color:var(--cb4-ink);transition:transform .4s var(--cb4-ease)}
html.cb4on-brief .cb4-brief.ready .cb4-brief-go{background:var(--cb4-lime);color:var(--cb4-ink);box-shadow:0 0 0 1px var(--cb4-ink)}
html.cb4on-brief .cb4-brief.ready .cb4-brief-go em{background:var(--cb4-ink);color:var(--cb4-lime)}
html.cb4on-brief .cb4-brief-go:hover em{transform:rotate(45deg)}
html.cb4on-brief .cb4-brief-go:focus-visible{outline:2px solid var(--cb4-blue);outline-offset:3px}
html.cb4on-brief.cb4-brief-inview .cbd-fab{opacity:0!important;pointer-events:none!important;transform:translate3d(0,24px,0) scale(.9)!important}
@media (max-width:900px){
  html.cb4on-brief .cb4-brief-in{grid-template-columns:1fr}
  html.cb4on-brief .cb4-brief-head{position:static}
  html.cb4on-brief .cb4-brief-out{grid-template-columns:1fr}
  html.cb4on-brief .cb4-brief-go{justify-content:center}
  html.cb4on-brief .cb4-chip span{padding:0 15px;font-size:13.5px}
}

/* ---------- G. world clocks ---------- */
html.cb4on-clocks .cb4-clocks{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:18px clamp(24px,4vw,60px);padding:22px 0;border-top:1px solid rgba(244,241,234,.1)}
html.cb4on-clocks .cb4-clocks-k{display:flex;align-items:center;gap:10px;margin:0;font:600 11px/1.3 var(--cb4-display);letter-spacing:.18em;text-transform:uppercase;color:#B3AFA6}
html.cb4on-clocks .cb4-clocks-k i{width:7px;height:7px;border-radius:50%;background:var(--cb4-lime);box-shadow:0 0 0 0 rgba(216,255,62,.6);animation:cb4-pulse 2s ease-out infinite}
@keyframes cb4-pulse{70%{box-shadow:0 0 0 8px rgba(216,255,62,0)}100%{box-shadow:0 0 0 0 rgba(216,255,62,0)}}
html.cb4on-clocks .cb4-clocks ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
html.cb4on-clocks .cb4-clocks li{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto auto;column-gap:12px;align-items:center;padding:12px 14px;border:1px solid rgba(244,241,234,.1);border-radius:14px;min-width:0}
html.cb4on-clocks .cb4-dial{grid-row:1/4;width:40px;height:40px}
html.cb4on-clocks .cb4-dial circle:first-child{fill:none;stroke:rgba(244,241,234,.28);stroke-width:1}
html.cb4on-clocks .cb4-dial line{stroke:var(--cb4-white);stroke-linecap:round}
html.cb4on-clocks .cb4-dial .h{stroke-width:2.2}
html.cb4on-clocks .cb4-dial .m{stroke-width:1.5}
html.cb4on-clocks .cb4-dial .s{stroke:var(--cb4-lime);stroke-width:.9}
html.cb4on-clocks .cb4-dial .c{fill:var(--cb4-lime)}
html.cb4on-clocks .night .cb4-dial circle:first-child{fill:rgba(36,87,255,.14)}
html.cb4on-clocks .cb4-clk-c{font:600 10px/1.2 var(--cb4-display);letter-spacing:.16em;text-transform:uppercase;color:#85817A;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.cb4on-clocks .cb4-clk-t{font:700 clamp(22px,2.2vw,30px)/1 var(--cb4-display);letter-spacing:-.03em;color:var(--cb4-white);font-variant-numeric:tabular-nums}
html.cb4on-clocks .cb4-clk-t i{font-style:normal;animation:cb4-blink 2s steps(2) infinite;color:var(--cb4-lime)}
html.cb4on-clocks .cb4-clk-z{font:500 11px/1.2 var(--cb4-sans);color:#85817A;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:1000px){ html.cb4on-clocks .cb4-clocks{grid-template-columns:1fr} }
@media (max-width:640px){ html.cb4on-clocks .cb4-clocks ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} html.cb4on-clocks .cb4-clocks li{padding:10px;column-gap:9px} html.cb4on-clocks .cb4-dial{width:32px;height:32px} }
@media (prefers-reduced-motion:reduce){ html.cb4on-clocks .cb4-clk-t i,html.cb4on-clocks .cb4-clocks-k i{animation:none} }
