@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=Inter:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');

/* Complete alternate site direction based on Clipping Bridge Brand Guidelines.
   The production site remains unchanged. */
.brand-preview{
  --ink:#111111;--ink-2:#ffffff;--ink-3:#f7f6f1;
  --paper:#f1f0ea;--acid:#6a3ac7;--acid-line:#4d2698;
  --gray:#5b5e61;--muted:#5b5e61;--line:#cbc9c1;--line-2:#a8a6a0;
  --mono:'IBM Plex Mono',ui-monospace,monospace;
  --sans:Inter,Arial,sans-serif;
  background:var(--paper);color:var(--ink)
}
.brand-preview h1,.brand-preview h2,.brand-preview h3,.brand-preview .display{font-family:'Space Grotesk',Inter,sans-serif}
.brand-preview .topline{background:var(--ink);color:#fff}
.brand-preview .nav-wrap{background:rgba(241,240,234,.97);border-color:var(--line)}
.brand-preview .brand{font-family:'Space Grotesk',sans-serif;letter-spacing:.11em;color:var(--ink)}
.brand-preview .brand img{display:none}
.brand-preview #nav a,.brand-preview .text-action{color:#5b5e61}
.brand-preview #nav a:hover,.brand-preview #nav a[aria-current=page],.brand-preview .text-action:hover{color:var(--ink)}
.brand-preview .menu{color:var(--ink);border-color:var(--line-2)}
.brand-preview .button{background:var(--acid);border-color:var(--acid);color:#fff;box-shadow:none}
.brand-preview .button:hover{background:#5830aa;border-color:#5830aa}
.brand-preview .button.ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.brand-preview .button.dark{background:var(--ink);border-color:var(--ink);color:#fff}
.brand-preview .hero,.brand-preview .section{border-color:var(--line)}
.brand-preview .page-hero{border-color:var(--line);background:#fff}
.brand-preview .page-hero p{color:var(--gray)}
.brand-preview .crumbs a{color:var(--gray)}
.brand-preview .hero-label,.brand-preview .label,.brand-preview .eyebrow,.brand-preview .link,.brand-preview .cards .more,.brand-preview .crumbs{color:var(--acid)}
.brand-preview .status{background:var(--acid);box-shadow:none;border-radius:0;transform:rotate(45deg)}
.brand-preview .hero h1{font-weight:600;letter-spacing:-.065em;max-width:12ch}
.brand-preview .outline{--stroke:var(--acid);--ofill:var(--paper);-webkit-text-stroke-width:2px}
.brand-preview .hero-bottom p,.brand-preview .lede,.brand-preview .cards p,.brand-preview .bento p,.brand-preview .price-model p{color:var(--gray)}
.brand-preview .cta-note a{color:var(--acid)}
.brand-preview .round-arrow{border-color:var(--line-2)}
.brand-preview .fanout{background:var(--ink);border-color:var(--ink);color:#fff}
.brand-preview .fanout .src small{color:#aaa}
.brand-preview .fanout .wires path{stroke:#5b5e61}
.brand-preview .fanout .wires .flow{stroke:var(--acid)}
.brand-preview .fanout .phone{border-color:#535353;background:#171717}
.brand-preview .fanout .phone footer em{background:var(--acid);color:#fff}
.brand-preview .fanout.motion-surface::after{display:none}
.brand-preview .platform-strip{border-color:var(--line)}
.brand-preview .platform-strip b{color:var(--ink)}
.brand-preview .ticker{background:var(--ink);color:#fff}
.brand-preview .section.light{background:#fff;color:var(--ink);border-color:var(--line)}
.brand-preview .section.acid{background:var(--paper);color:var(--ink);border-color:var(--line)}
.brand-preview .section.acid .button.ghost,.brand-preview .section.light .button.ghost{color:var(--ink);border-color:var(--ink)}
.brand-preview .section.acid .eyebrow,.brand-preview .section.light .eyebrow{color:var(--acid);border-color:var(--line)}
.brand-preview .cards{border-color:var(--line)}
.brand-preview .cards>*{border-color:var(--line)}
.brand-preview .cards a.card:hover{background:#e8e6df}
.brand-preview .process-list,.brand-preview .process-list article{border-color:var(--line)}
.brand-preview .process-list p,.brand-preview .process-list ul{color:var(--gray)}
.brand-preview .flow{background:var(--ink);color:#fff}
.brand-preview .steps li,.brand-preview .price-model article,.brand-preview .calculator,.brand-preview .case-grid{border-color:var(--line)}
.brand-preview .bento>*,.brand-preview .board{background:#fff;color:var(--ink);border-color:var(--line)}
.brand-preview .board-title,.brand-preview .board-table th,.brand-preview .board-table td,.brand-preview .board-foot{border-color:var(--line)}
.brand-preview .board-title strong,.brand-preview .big-stat{color:var(--acid)}
.brand-preview .bar-chart{border-color:var(--line)}
.brand-preview .bar-chart i,.brand-preview .meter b{background:var(--acid)}
.brand-preview .queue li{border-color:var(--line)}
.brand-preview .chip.approved{background:var(--acid);color:#fff}
.brand-preview .chip.rejected{background:var(--ink);color:#fff}
.brand-preview .offer{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.brand-preview .tiers{border-color:var(--line)}
.brand-preview .tiers article+article{border-color:var(--line)}
.brand-preview .tiers article.featured{background:#fff;box-shadow:inset 0 3px 0 var(--acid)}
.brand-preview .tiers p,.brand-preview .tiers li,.brand-preview .included li{color:var(--gray)}
.brand-preview .calc-result{border-color:var(--line)}
.brand-preview .calc-result b{color:var(--ink)}
.brand-preview .budget-table th,.brand-preview .budget-table td,.brand-preview .included li{border-color:var(--line)}
.brand-preview .compare th,.brand-preview .compare td{border-color:var(--line)}
.brand-preview .compare thead th.us{background:var(--acid);color:#fff}
.brand-preview .compare td.us{background:rgba(106,58,199,.07);color:var(--ink)}
.brand-preview .compare tbody th{color:var(--ink)}
.brand-preview .compare td{color:var(--gray)}
.brand-preview .case-main{background:#fff}
.brand-preview .case-side{background:var(--paper)}
.brand-preview .slot{border-color:var(--line-2);color:var(--gray)}
.brand-preview .slot b{color:var(--ink)}
.brand-preview .levels,.brand-preview .levels article{border-color:var(--line)}
.brand-preview .levels p{color:var(--gray)}
.brand-preview .rule-strip{background:#fff;color:var(--gray)}
.brand-preview .rule-strip b{color:var(--ink)}
.brand-preview .big-link{border-color:var(--line)}
.brand-preview .faq details{border-color:var(--line)}
.brand-preview .faq details p{color:var(--gray)}
.brand-preview .form-panel .aside-list,.brand-preview .form-panel .aside-list li{border-color:var(--line)}
.brand-preview .form-panel .aside-list li,.brand-preview .cb-form .check>span{color:var(--gray)}
.brand-preview .form-panel .aside-list b{color:var(--ink)}
.brand-preview .cb-form label>span{color:var(--acid)}
.brand-preview .cb-form input,.brand-preview .cb-form textarea,.brand-preview .cb-form select{color:var(--ink);border-color:var(--line-2)}
.brand-preview .cb-form select option{background:#fff;color:var(--ink)}
.brand-preview .booking-embed{background:#fff;border-color:var(--line)}
.brand-preview .booking-fallback p{color:var(--gray)}
.brand-preview .contact-list a{border-color:var(--line)}
.brand-preview .principles,.brand-preview .trust-list,.brand-preview .trust-list li{border-color:var(--line)}
.brand-preview .principles p,.brand-preview .trust-list li{color:var(--gray)}
.brand-preview .poster img{border-color:var(--line)}
.brand-preview .post-list,.brand-preview .post-list a{border-color:var(--line)}
.brand-preview .post-list p{color:var(--gray)}
.brand-preview .prose{color:#343536}
.brand-preview .prose h2,.brand-preview .prose h3,.brand-preview .prose strong{color:var(--ink)}
.brand-preview .prose blockquote{background:#fff;color:var(--ink)}
.brand-preview .prose th,.brand-preview .prose td,.brand-preview .article-cta{border-color:var(--line)}
.brand-preview .cta-band{background:var(--ink);color:#fff}
.brand-preview .cta-band .outline{--stroke:#fff;--ofill:var(--ink)}
.brand-preview .site-footer{background:var(--ink);color:#fff}
.brand-preview .site-footer .brand{color:#fff}
.brand-preview .motion-surface::after{background:none}
.brand-preview .button:after{display:none}
.brand-preview .status{animation:none}

/* Brand film: introduces a dense visual beat between the hero and problem. */
.brand-preview .brand-film{background:var(--ink);color:#fff;padding-top:clamp(3rem,6vw,5rem);padding-bottom:clamp(3rem,6vw,5rem)}
.brand-preview .film-heading{display:grid;grid-template-columns:1.1fr .7fr;gap:clamp(2rem,7vw,8rem);align-items:end;margin-bottom:2rem}
.brand-preview .film-heading h2{font-size:clamp(3rem,7vw,7.4rem);line-height:.86;letter-spacing:-.07em;margin:1rem 0 0}
.brand-preview .film-heading p{color:#c8c8c3;font-size:1.05rem;max-width:34rem;margin:0}
.brand-preview .film-frame{border:1px solid #3c3c3c;background:#080808;position:relative;overflow:hidden;aspect-ratio:16/9}
.brand-preview .film-frame video{width:100%;height:100%;display:block;object-fit:cover}
.brand-preview .film-meta{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;gap:1rem;padding:.8rem 1rem;background:rgba(17,17,17,.88);color:#fff;font:500 .65rem var(--mono);letter-spacing:.08em}

/* Horizontal clip-format study. Cards are explicitly illustrative. */
.brand-preview .clip-showcase{background:#fff;overflow:hidden}
.brand-preview .showcase-head{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(2rem,7vw,8rem);align-items:end;margin-bottom:2.5rem}
.brand-preview .showcase-head h2{font-size:clamp(2.8rem,6vw,6rem);line-height:.88;letter-spacing:-.065em;margin:1rem 0 0}
.brand-preview .showcase-head p{color:var(--gray);max-width:36rem}
.brand-preview .carousel-controls{display:flex;gap:.5rem;margin-top:1.4rem}
.brand-preview .carousel-controls button{width:3rem;height:3rem;border:1px solid var(--ink);background:transparent;color:var(--ink);font-size:1.2rem;cursor:pointer;transition:background .2s,color .2s}
.brand-preview .carousel-controls button:hover{background:var(--ink);color:#fff}
.brand-preview .clip-rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(250px,26vw);gap:1rem;overflow-x:auto;scroll-snap-type:x proximity;padding:0 var(--pad) 1.2rem;margin-left:calc(var(--pad)*-1);margin-right:calc(var(--pad)*-1);scrollbar-color:var(--acid) var(--paper);overscroll-behavior-inline:contain}
.brand-preview .clip-study{scroll-snap-align:start;border:1px solid var(--line);background:var(--paper)}
.brand-preview .clip-canvas{aspect-ratio:9/14;padding:1.2rem;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}
.brand-preview .clip-canvas:after{content:"";position:absolute;left:1.2rem;right:1.2rem;bottom:3.2rem;height:1px;background:currentColor;opacity:.35}
.brand-preview .clip-canvas strong{font-family:'Space Grotesk',sans-serif;font-size:clamp(2rem,3.5vw,3.7rem);line-height:.88;letter-spacing:-.06em;position:relative;z-index:1}
.brand-preview .clip-canvas i{font:500 .68rem var(--mono);font-style:normal;align-self:flex-end}
.brand-preview .clip-market{font:500 .66rem var(--mono);letter-spacing:.08em}
.brand-preview .clip-canvas.opinion{background:var(--acid);color:#fff}
.brand-preview .clip-canvas.story{background:var(--ink);color:#fff}
.brand-preview .clip-canvas.tactical{background:var(--paper);color:var(--ink)}
.brand-preview .clip-canvas.tactical strong{color:var(--acid)}
.brand-preview .clip-canvas.localized{background:#dcd9cf;color:var(--ink)}
.brand-preview .clip-canvas.localized:before{content:"FR → US";position:absolute;right:-1rem;bottom:4.5rem;font:500 3rem var(--mono);color:rgba(106,58,199,.17);transform:rotate(-90deg)}
.brand-preview .clip-canvas.proof{background:#fff;color:var(--ink)}
.brand-preview .clip-canvas.proof strong{border-left:.35rem solid var(--acid);padding-left:1rem}
.brand-preview .clip-study footer{padding:1rem 1.1rem 1.2rem;border-top:1px solid var(--line);display:grid;gap:.35rem}
.brand-preview .clip-study footer b{font-size:.95rem}
.brand-preview .clip-study footer span{font-size:.78rem;color:var(--gray)}
.brand-preview .showcase-note{font:500 .62rem var(--mono);letter-spacing:.08em;color:var(--gray);margin:1rem 0 0}

/* Editorial rhythm: subtle route notation occupies space without decorative filler. */
.brand-preview .section:not(.brand-film):not(.clip-showcase){position:relative}
.brand-preview .section:not(.brand-film):not(.clip-showcase):after{content:"CB / DISTRIBUTION";position:absolute;right:var(--pad);bottom:1rem;font:500 .56rem var(--mono);letter-spacing:.12em;color:rgba(91,94,97,.42)}

@media(max-width:960px){
  .brand-preview #nav{background:var(--paper);border-color:var(--line)}
  .brand-preview #nav a{color:var(--ink)}
  .brand-preview .nav-mobile-only{color:var(--acid)!important}
}

@media(max-width:760px){
  .brand-preview .hero h1{max-width:none}.brand-preview .topline span:last-child{display:none}
  .brand-preview .film-heading,.brand-preview .showcase-head{grid-template-columns:1fr}
  .brand-preview .clip-rail{grid-auto-columns:minmax(245px,78vw)}
  .brand-preview .film-meta{position:static;flex-direction:column;background:var(--ink)}
  .brand-preview .film-frame{aspect-ratio:auto}
  .brand-preview .film-frame video{aspect-ratio:16/9}
}
