/* =========================================================
   TAB Media — brand layer (loaded last on every page)
   Midnight Navy #101D32 · Slate Navy #243650 · Champagne #B8A77E
   Warm White #F5F3EE · Charcoal #20242B
   Type: Inter Tight (display) · Inter (text) · Instrument Serif (accent italic)
   ========================================================= */
:root{
  --navy:#101D32;--slate:#243650;--champagne:#B8A77E;--champagne-deep:#7A6A44;--champagne-tint:#ECE6D8;
  --paper:#F5F3EE;--ink:#20242B;--muted:#5B6170;--line:#D9D4C9;--mist:#E3E7EE;
  --lime:var(--champagne-tint);--lilac:var(--mist);
}
body{background:var(--paper);color:var(--ink);font-family:'Inter',system-ui,sans-serif;font-feature-settings:"ss01","cv11"}
::selection{background:var(--champagne);color:var(--navy)}
a:focus-visible,button:focus-visible,summary:focus-visible,:focus-visible{outline-color:var(--slate)}
.skip,.skip-link{background:var(--navy);color:var(--paper)}

/* ---------- Wordmark ---------- */
.logo,.brand{display:inline-flex;align-items:center;line-height:0}
.wordmark{display:block;height:30px;width:auto;max-width:none}
footer .wordmark{height:32px}
@media(max-width:650px){.wordmark{height:24px}footer .wordmark{height:26px}}

/* ---------- Type ---------- */
h1,.section-heading h2,.about-copy h2,.contact h2,.subpage :is(.hero-title,.section-title,.lp-section-title,.lp-hero h1){font-family:'Inter Tight',sans-serif}
h1{letter-spacing:-.045em}
.section-heading h2,.section-heading .studies-title{letter-spacing:-.035em}
.contact h2{letter-spacing:-.045em}
.serif,.subpage .hero-title>span,.lp-hero h1>span,.subpage :is(.section-title span,.lp-section-title .red),.step-num{
  font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.01em;color:var(--champagne-deep)}
.contact h2 .serif,.contact .contact-intro h2 .serif{letter-spacing:-.01em}
.eyebrow,.subpage .eyebrow{color:var(--slate)}
.period{color:var(--champagne)}
.growth svg{stroke:var(--champagne)}

/* ---------- Header & buttons ---------- */
.header,.site-header{border-bottom-color:var(--line)}
.header nav a[aria-current="page"]{text-decoration-color:var(--champagne)}
.nav-cta,.dark,.button.dark{background:var(--navy);color:var(--paper)}
.button:hover,.nav-cta:hover{background:var(--slate)}
.nav-cta span,.button.dark span{color:var(--champagne)}
.dot{background:var(--champagne);box-shadow:0 0 0 4px #b8a77e33}

/* ---------- Hero ---------- */
.orbit-ring{border-color:#b8a77e99;background:repeating-conic-gradient(from 0deg,transparent 0 29deg,#b8a77e88 29deg 30deg)}
.orbit-core{background:var(--navy);color:var(--champagne);font-family:'Inter Tight',sans-serif;font-weight:300;font-size:64px;transform:rotate(0)}
.orbit:hover .orbit-core{transform:rotate(12deg)}
.orbit-caption{color:var(--muted)}
.hero-art{background:var(--navy);color:var(--paper);border-radius:10px;isolation:isolate}
.hero-art::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 60% 90% at 88% 10%,#24365099,transparent 70%);z-index:0;pointer-events:none}
.art-grid{background-image:linear-gradient(#b8a77e14 1px,transparent 1px),linear-gradient(90deg,#b8a77e14 1px,transparent 1px);z-index:0}
.art-top{color:#f5f3eecc}.art-bottom{color:#b7bfcc}
.live i{background:var(--champagne);box-shadow:0 0 0 0 #b8a77e88;animation:livepulse 2.4s ease-out infinite}
.art-statement{position:absolute;left:27px;top:50%;transform:translateY(-58%);z-index:2;display:flex;flex-direction:column;line-height:.92}
.art-statement span{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:clamp(46px,7.2vw,112px);letter-spacing:-.05em;color:var(--paper)}
.art-statement em{font-family:'Instrument Serif',Georgia,serif;font-weight:400;font-size:clamp(56px,8.6vw,134px);letter-spacing:-.02em;color:var(--champagne)}
.art-chart{position:absolute;right:0;bottom:0;width:62%;height:78%;z-index:1;overflow:visible}
.art-chart .area{fill:url(#artfill)}
.art-chart .line{fill:none;stroke:var(--champagne);stroke-width:2;vector-effect:non-scaling-stroke;stroke-dasharray:1400;stroke-dashoffset:1400;animation:draw 2.2s cubic-bezier(.6,0,.2,1) .2s forwards}
.art-chart circle{fill:var(--paper);stroke:var(--champagne);stroke-width:2;vector-effect:non-scaling-stroke}
.art-chart .pulse{fill:var(--champagne)}
.art-kpis{position:absolute;right:26px;top:62px;z-index:3;list-style:none;margin:0;padding:0;display:flex;gap:10px}
.art-kpis li{background:#f5f3ee0f;border:1px solid #b8a77e40;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-radius:8px;padding:12px 16px;min-width:128px;display:flex;flex-direction:column;gap:6px}
.art-kpis strong{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:28px;letter-spacing:-.03em;color:var(--paper);line-height:1}
.art-kpis span{font-size:9px;letter-spacing:.9px;text-transform:uppercase;color:#b7bfcc}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes livepulse{0%{box-shadow:0 0 0 0 #b8a77e88}80%,100%{box-shadow:0 0 0 7px #b8a77e00}}
@media(min-width:1600px){.hero-art{height:480px}}
@media(max-width:1000px){.art-kpis li{min-width:0;padding:10px 12px}.art-kpis strong{font-size:22px}.art-chart{width:70%}}
@media(max-width:650px){
  .hero-art{height:360px}
  .art-statement{left:16px;top:auto;bottom:74px;transform:none}
  .art-statement span{font-size:13vw}.art-statement em{font-size:15vw}
  .art-kpis{left:15px;right:15px;top:44px;gap:6px}
  .art-kpis li{flex:1;padding:9px 10px;gap:4px}.art-kpis strong{font-size:18px}.art-kpis span{font-size:6.5px;letter-spacing:.4px}
  .art-chart{width:100%;height:55%}
}

/* ---------- Services (navy) ---------- */
.services{background:var(--navy);color:var(--paper)}
.services .eyebrow{color:var(--champagne)}
.services .serif{color:var(--champagne)}
.service-list details{border-color:#f5f3ee1f!important}
.service-index{color:var(--champagne)}
.service-list details[open] h3,.service-list details[open] .plus,.service-content a{color:var(--champagne)}
.service-list summary:hover h3{color:#e6dcc2}

/* ---------- Ticker ---------- */
.ticker{background:var(--champagne);color:var(--navy)}
.ticker>div{font-family:'Inter Tight',sans-serif;letter-spacing:-.03em}
.ticker .tick-sep{font-family:'Inter Tight',sans-serif;font-weight:300;color:var(--navy);opacity:.55}

/* ---------- About ---------- */
.portrait{background:var(--mist)}
.portrait::before{content:"";position:absolute;inset:auto -14px -14px auto;width:60%;height:60%;border-right:1px solid var(--champagne);border-bottom:1px solid var(--champagne);z-index:-1}
.portrait-label{background:var(--navy);color:var(--paper)}
.portrait-star{display:none}
.about-copy blockquote{border-left-color:var(--champagne);font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-size:27px;color:var(--navy)}
.text-link{border-bottom-color:var(--champagne)}

/* ---------- Contact ---------- */
.contact{background:var(--champagne-tint)}
.contact-bottom{border-top-color:#20242b33}
.contact-doodle{color:var(--champagne)}
.form-field input,.form-field textarea,.form-field select{background:#fbfaf7;border:1px solid #cfc6ae;border-radius:6px;font-family:'Inter',sans-serif;color:var(--ink)}
.form-field input:focus,.form-field textarea:focus{outline:2px solid var(--navy);outline-offset:1px;border-color:var(--navy)}
.privacy-choice input{accent-color:var(--navy)}
.contact-form .button{border-radius:6px}

/* ---------- Footer ---------- */
footer,.site-footer{background:var(--navy);color:var(--paper)}
.footer-top p,.footer-bottom{color:#b7bfcc}
.footer-bottom{border-top-color:#f5f3ee1f}
.footer-legal a{border-bottom-color:#b8a77e66}
.footer-top>a:not(.logo):hover,.footer-bottom a:hover{color:var(--champagne)}

/* ---------- Case cards / work ---------- */
.case-lime{background:var(--champagne-tint)}
.case-lilac{background:var(--mist)}
.case{border:1px solid transparent}
.case:hover{border-color:var(--champagne)}
.circle-arrow{border-color:#20242b55}

/* ---------- Subpages ---------- */
.stats-strip{background:var(--navy);color:var(--paper)}
.stats-strip .stat-cell{border-right-color:#f5f3ee1f}
.stats-strip :is(.stat-number){color:var(--paper)}
.stats-strip :is(.stat-label){color:var(--champagne)}
.stats-strip :is(.stat-sub,.stat-desc){color:#b7bfcc}
.stats-strip .stat-delta{background:#b8a77e26;color:#e6dcc2}
.organic-strip{background:var(--mist)}
.subpage :is(.insight-card,.result-card,.prob-card,.process-card,.phase-card,.scale-card,.why-card){background:var(--mist)}
.subpage :is(.insight-card,.result-card,.process-card,.phase-card,.why-card):nth-child(2n){background:var(--champagne-tint)}
.subpage :is(.insight-num,.result-value,.process-num,.phase-num,.why-num){font-family:'Inter Tight',sans-serif;color:var(--navy)}
.after,.scale-card.active .scale-badge,.tl-result{background:var(--navy);color:var(--paper)}
.tl-item:before{background:var(--champagne)}
.legend-dot,.bar-fill{background:var(--champagne)}
.bar-row:nth-child(2n) .bar-fill{background:var(--slate)}
.legend-item:nth-child(2) .legend-dot{background:var(--slate)}
.ic,.icon{color:var(--champagne-deep)}
.subpage svg text{font-family:'Inter',sans-serif}
.error-code>span{color:var(--champagne)}
.subpage-main>.cta-section{background:var(--navy);color:var(--paper)}
.cta-section :is(p,.body-text){color:#c9cfd9}
.cta-section .serif,.cta-section h2 span{color:var(--champagne)}
.cta-section :is(.button.dark,.dark,.btn){background:var(--champagne);color:var(--navy)}
.cta-section :is(.button.dark,.dark):hover{background:#cbbd98}
.cta-section .button.dark span{color:var(--navy)}
.cta-section a:not(.button):not(.btn-cta){color:var(--champagne)}
.offer-card.featured,.offer-card--featured{border-color:var(--champagne)}

/* ---------- Cookie banner ---------- */
.cookie-banner{background:var(--paper);border-color:var(--line)}
.cookie-actions button{border-color:var(--navy);color:var(--navy);font-family:'Inter',sans-serif;border-radius:6px}
#cookie-accept,#cookie-save{background:var(--navy);color:var(--paper)}
#cookie-categories input{accent-color:var(--navy)}

@media(prefers-reduced-motion:reduce){.art-chart .line{stroke-dashoffset:0}}

/* spacing between hero panel and navy services */
.hero{padding-bottom:clamp(48px,6vw,90px)}
.cta-section .eyebrow{color:var(--champagne)}
.cta-section .section-title{color:var(--paper)}
.cta-section .section-title em{font-family:'Instrument Serif',Georgia,serif;font-weight:400;color:var(--champagne)}
.btn-cta{background:var(--navy);color:var(--paper)}
.cta-section .btn-cta{background:var(--champagne);color:var(--navy)}
.cta-section .btn-cta:hover{background:#cbbd98}
.study-button--demos{background:var(--navy);color:var(--paper)}
.study-button--demos .study-arrow{color:var(--champagne)}
.study-button:hover{border-color:var(--champagne)}
/* charcoal surfaces -> midnight navy */
.button-primary,.model,.footer,.zero-banner,.roi-block,.pill.highlight,.device-switch button[aria-pressed=true],.subpage :is(.btn-cta,.offer-btn,.btn-lp-primary){background:var(--navy)}
.button-primary:hover,.subpage :is(.btn-cta,.offer-btn,.btn-lp-primary):hover{background:var(--slate)}
.model .serif,.zero-banner .serif,.roi-block .serif{color:var(--champagne)}
.eyebrow-line{background:var(--champagne)}
.subpage-main>.cta-section .btn-cta{background:var(--champagne);color:var(--navy)}
.gallery-star,.contact-spark,.asterisk{color:var(--champagne);font-family:'Inter Tight',sans-serif;font-weight:300}
.gallery-star{background:var(--navy);border-radius:50%}