/* =====================================================================
   استودیو بُرد — Board Studio
   Hand-written HTML/CSS (no framework, no build). RTL / Persian.
   ===================================================================== */

/* ---- Abar (brand typeface) — paths relative to this file (assets/) ---- */
@font-face{font-family:'Abar';src:url('fonts/AbarLowFaNum-Regular.woff2') format('woff2');font-weight:400;font-display:swap;}
@font-face{font-family:'Abar';src:url('fonts/AbarLowFaNum-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap;}
@font-face{font-family:'Abar';src:url('fonts/AbarLowFaNum-Bold.woff2') format('woff2');font-weight:700;font-display:swap;}
@font-face{font-family:'Abar';src:url('fonts/AbarLowFaNum-ExtraBold.woff2') format('woff2');font-weight:800;font-display:swap;}
@font-face{font-family:'AbarHigh';src:url('fonts/AbarHighFaNum-Bold.woff2') format('woff2');font-weight:700;font-display:swap;}
@font-face{font-family:'AbarHigh';src:url('fonts/AbarHighFaNum-ExtraBold.woff2') format('woff2');font-weight:800;font-display:swap;}
@font-face{font-family:'AbarHigh';src:url('fonts/AbarHighFaNum-Black.woff2') format('woff2');font-weight:900;font-display:swap;}

/* ---- Design tokens ---- */
:root{
  --board:#EE4234; --board-dark:#D63C2A;
  --ink:#1D1D1F; --ink2:#2C2C2E; --ink3:#404040;
  --graytx:#808080; --line:#D2D2D7; --pale:#E5E5EA; --faint:#FAFAFA;
  --hair:#ededee;            /* hairline borders */
  --shell:1280px;
  --font:'Abar',sans-serif;
  --display:'AbarHigh','Abar',sans-serif;
}

/* ---- Reset ---- */
*,*::before,*::after{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:var(--font); color:var(--ink); background:#fff;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden; line-height:1.5;
}
h1,h2,h3,h4,p{margin:0;}
img,svg{display:block; max-width:100%;}
a{color:inherit; text-decoration:none;}
button{font:inherit; color:inherit; background:none; border:none; padding:0; margin:0; cursor:pointer;}
strong{font-weight:700;}
::selection{background:var(--board); color:#fff;}

/* ---- Layout helpers ---- */
.shell{width:100%; max-width:var(--shell); margin-inline:auto; padding-inline:24px;}
.center{text-align:center;}
.display{font-family:var(--display);}
@media(min-width:768px){ .shell{padding-inline:40px;} }

.mw-560{max-width:560px;margin-inline:auto;} .mw-600{max-width:600px;margin-inline:auto;}
.mw-620{max-width:620px;margin-inline:auto;} .mw-680{max-width:680px;margin-inline:auto;}
.mw-740{max-width:740px;margin-inline:auto;} .mw-760{max-width:760px;margin-inline:auto;}
.mw-820{max-width:820px;} .mw-900{max-width:900px;margin-inline:auto;}
.mw-980{max-width:980px;margin-inline:auto;} .mw-1080{max-width:1080px;margin-inline:auto;}

/* Eyebrow (red dot + spaced label) */
.eyebrow{display:flex; align-items:center; gap:10px;}
.eyebrow .dot{width:10px; height:10px; background:var(--board); display:block;}
.eyebrow .label{font-size:13px; font-weight:600; letter-spacing:3px; color:var(--graytx);}
.eyebrow .label.nowrap{white-space:nowrap;}

/* ---- Buttons ---- */
.btn{display:inline-flex; align-items:center; justify-content:center; white-space:nowrap;
  font-weight:600; border-radius:2px; transition:all .3s ease-out; cursor:pointer;}
.btn--primary{background:var(--board); color:#fff; padding:16px 36px; font-size:16px;}
.btn--primary:hover{background:var(--board-dark); transform:translateY(-2px); box-shadow:0 12px 28px rgba(238,66,52,.28);}
.btn--primary-sm{background:var(--board); color:#fff; height:40px; padding:0 20px; font-size:14px;}
.btn--primary-sm:hover{background:var(--board-dark); transform:translateY(-1px); box-shadow:0 8px 22px rgba(238,66,52,.26);}
.btn--primary-lg{padding:20px 40px; font-size:17px;}
.btn--primary-lg:hover{box-shadow:0 14px 30px rgba(238,66,52,.34);}
.btn--outline{background:transparent; color:var(--ink); border:1.5px solid var(--line); padding:16px 28px; font-size:16px;}
.btn--outline:hover{background:var(--ink); color:#fff; border-color:var(--ink);}
.btn--dark{background:var(--ink); color:#fff; padding:14px 36px; font-size:16px;}
.btn--dark:hover{background:#000; transform:translateY(-2px);}
.btn--ghost{background:transparent; color:var(--ink2); border:1.5px solid var(--line); padding:12px 28px; font-size:15px;}
.btn--ghost:hover{background:#f5f5f5; color:var(--ink); border-color:#c7c7cc;}
.link-red{font-size:15px; font-weight:600; color:var(--board);}

/* ---- Animations ---- */
@keyframes bUp{from{opacity:0; transform:translateY(26px);} to{opacity:1; transform:translateY(0);}}
@keyframes bCue{0%{opacity:.25; transform:translateY(0);} 50%{opacity:1;} 100%{opacity:.25; transform:translateY(7px);}}
.reveal{animation:bUp .8s both ease-out;}
.d1{animation-delay:.06s;} .d2{animation-delay:.16s;} .d3{animation-delay:.26s;}
@media(prefers-reduced-motion:reduce){ .reveal{animation:none;} }

/* =====================================================================
   HEADER
   ===================================================================== */
.site-header{position:sticky; top:0; z-index:50; background:rgba(255,255,255,.85);
  backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border-bottom:1px solid var(--hair);}
.header-inner{display:flex; align-items:center; justify-content:space-between; height:64px; padding-inline:20px;}
.logo{display:flex; align-items:center; color:var(--board);}
.logo svg{height:30px; width:auto; fill:currentColor;}
.nav{display:none; align-items:center; gap:36px;}
.nav-link{font-size:15px; font-weight:500; color:var(--ink2); transition:color .2s;}
.nav-link:hover{color:var(--board);}
.header-actions{display:flex; align-items:center; gap:8px;}
.header-cta{display:none;}
.burger{width:40px; height:40px; margin-left:-4px; display:flex; align-items:center; justify-content:center; color:var(--ink);}
.burger svg{width:24px; height:24px; stroke:currentColor; fill:none;}
.mobile-menu{position:absolute; top:100%; left:0; right:0; border-top:1px solid var(--hair); background:#fff; box-shadow:0 14px 26px rgba(0,0,0,.07);}
.mobile-menu.hidden{display:none;}
.mobile-menu .inner{padding:4px 20px 12px; display:flex; flex-direction:column;}
.mobile-link{text-align:right; font-size:17px; font-weight:600; color:var(--ink); padding:12px 0; border-bottom:1px solid #f2f2f2;}
.mobile-cta{margin:16px 0 8px; width:100%; background:var(--board); color:#fff; border-radius:2px; padding:14px 0; font-size:16px; font-weight:600; text-align:center;}
@media(min-width:768px){
  .header-inner{height:74px; padding-inline:40px;}
  .logo svg{height:34px;}
  .nav{display:flex;}
  .header-cta{display:inline-flex;}
  .burger{display:none;}
  .mobile-menu{display:none !important;}
}

/* =====================================================================
   SCREENS (router show/hide)
   ===================================================================== */
main[data-screen].hidden{display:none;}
.screen-min{min-height:calc(100vh - 64px);}

/* =====================================================================
   HOME — hero
   ===================================================================== */
.hero{position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:64px 24px 80px; overflow:hidden; min-height:calc(100vh - 64px);}
.hero-watermark{position:absolute; left:-7%; bottom:-16%; width:70vw; max-width:720px;
  color:#F4F4F6; pointer-events:none; z-index:0;}
.hero-watermark svg{width:100%; height:auto; fill:currentColor;}
.hero-inner{position:relative; z-index:10; display:flex; flex-direction:column; align-items:center;}
.hero-title{font-family:var(--display); margin-top:24px; font-weight:900; line-height:1.02;
  letter-spacing:-1.5px; color:var(--ink); font-size:clamp(44px,9vw,108px);}
.hero-sub{max-width:600px; margin-top:28px; font-size:clamp(17px,2.4vw,23px); line-height:1.75; color:var(--ink2);}
.hero-sub strong{font-weight:700; color:var(--board);}
.hero-actions{display:flex; flex-direction:column; gap:14px; margin-top:40px; width:100%;}
.scroll-cue{position:absolute; bottom:28px; left:50%; transform:translateX(-50%);
  display:none; flex-direction:column; align-items:center; gap:8px; z-index:10;}
.scroll-cue .t{font-size:12px; letter-spacing:2px; color:#a1a1a6;}
.scroll-cue .l{width:1px; height:32px; display:block;
  background:linear-gradient(#c9c9ce,transparent); animation:bCue 1.8s infinite ease-in-out;}
@media(min-width:640px){
  .hero{padding-top:96px;}
  .hero-actions{flex-direction:row; width:auto;}
  .scroll-cue{display:flex;}
}
@media(min-width:768px){ .hero-title{letter-spacing:-2px;} }

/* HOME — manifesto teaser */
.teaser{padding:80px 24px;}
.teaser .label{font-size:13px; font-weight:600; letter-spacing:3px; color:var(--graytx); margin-bottom:28px;}
.teaser p{font-weight:500; color:var(--ink); letter-spacing:-.5px; line-height:1.55; font-size:clamp(22px,4.5vw,40px);}
.teaser p span{color:var(--board);}
@media(min-width:768px){ .teaser{padding:128px 40px;} .teaser .label{margin-bottom:36px;} }

/* HOME — case studies */
.cases{background:var(--faint); border-top:1px solid #f0f0f1; border-bottom:1px solid #f0f0f1;}
.cases .pad{padding-top:80px; padding-bottom:80px;}
.section-head{display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-bottom:40px;}
.section-head h2{font-family:var(--display); font-weight:800; letter-spacing:-1px; color:var(--ink); line-height:1.1; font-size:clamp(30px,5vw,56px); max-width:640px;}
.case-grid{display:grid; grid-template-columns:1fr; gap:24px;}
.case-card{text-align:right; background:#fff; border:1px solid var(--hair); border-radius:6px; overflow:hidden; transition:all .3s;}
.case-card:hover{transform:translateY(-6px); box-shadow:0 22px 48px rgba(0,0,0,.10); border-color:#e2e2e4;}
.case-thumb{height:200px; position:relative; background:#EFEFF1; overflow:hidden; display:flex; align-items:flex-end; padding:24px;}
.case-thumb.alt{background:#E9E9EB;}
.case-thumb .mark{position:absolute; top:24px; right:24px; width:22px; height:22px; background:var(--board);}
.case-thumb .mark.ink{background:var(--ink);}
.case-thumb .bar1{position:absolute; top:58px; right:24px; width:70px; height:6px; background:rgba(0,0,0,.1);}
.case-thumb .bar2{position:absolute; top:74px; right:24px; width:46px; height:6px; background:rgba(0,0,0,.1);}
.case-thumb .cat{font-size:13px; font-weight:600; letter-spacing:.3px; color:var(--graytx);}
.case-body{padding:28px;}
.case-body h3{font-family:var(--display); font-size:24px; font-weight:700; color:var(--ink); letter-spacing:-.5px;}
.case-body p{margin:14px 0 20px; font-size:16px; line-height:1.7; color:var(--ink2);}
.case-body .more{font-size:15px; font-weight:600; color:var(--board);}
@media(min-width:768px){
  .cases .pad{padding-top:112px; padding-bottom:112px;}
  .section-head{margin-bottom:56px;}
  .case-grid{grid-template-columns:1fr 1fr; gap:28px;}
  .case-thumb{height:240px;}
  .case-body{padding:32px;}
  .case-body h3{font-size:26px;}
}

/* HOME — services preview */
.svc-preview{max-width:1280px; margin-inline:auto; padding:80px 24px;}
.svc-preview h2{font-family:var(--display); font-weight:800; letter-spacing:-1px; color:var(--ink);
  margin:16px 0 48px; font-size:clamp(28px,4.5vw,52px);}
.pillars{display:grid; grid-template-columns:1fr; border-top:1px solid #e7e7e9;}
.pillar{text-align:right; padding:36px 0; border-bottom:1px solid #e7e7e9; transition:background .3s;}
.pillar:hover{background:linear-gradient(to left,var(--faint),transparent);}
.pillar .num{font-family:var(--display); font-size:42px; font-weight:800; color:var(--board); letter-spacing:-1px;}
.pillar h3{margin:20px 0 12px; font-size:23px; font-weight:700; color:var(--ink);}
.pillar p{font-size:15px; line-height:1.7; color:var(--ink3); max-width:300px;}
@media(min-width:768px){
  .svc-preview{padding:128px 40px;}
  .svc-preview h2{margin-bottom:64px;}
  .pillars{grid-template-columns:1fr 1fr 1fr;}
  .pillar{padding:36px 0;}
  .pillar.p1{padding-left:32px;} .pillar.p2{padding-inline:32px;} .pillar.p3{padding-right:32px;}
}

/* Dark CTA band */
.cta-dark{background:var(--ink); color:#fff;}
.cta-dark .pad{max-width:900px; margin-inline:auto; padding:80px 24px; text-align:center;}
.cta-dark h2{font-family:var(--display); font-weight:800; letter-spacing:-1px; line-height:1.15; font-size:clamp(28px,5vw,58px);}
.cta-dark p{margin:24px auto 40px; max-width:560px; font-size:19px; line-height:1.7; color:#c7c7cc;}
@media(min-width:768px){ .cta-dark .pad{padding:128px 40px;} }

/* =====================================================================
   MANIFESTO
   ===================================================================== */
.mani-hero{padding-top:64px; padding-bottom:56px; border-bottom:1px solid var(--hair);}
.mani-hero .eyebrow{margin-bottom:28px;}
.mani-hero h1{font-family:var(--display); font-weight:900; line-height:1.04; letter-spacing:-1.4px;
  color:var(--ink); font-size:clamp(36px,7vw,86px);}
.mani-hero p{max-width:760px; margin-top:32px; font-size:18px; line-height:1.85; color:var(--ink2);}
.mani-block{display:grid; grid-template-columns:36px 1fr; gap:20px; padding:48px 0; border-bottom:1px solid var(--hair);}
.mani-block.last{border-bottom:none; padding-bottom:48px;}
.mani-num{font-family:var(--display); font-size:26px; font-weight:800; color:var(--board);}
.mani-block h2{font-family:var(--display); font-weight:800; letter-spacing:-.8px; color:var(--ink);
  margin-bottom:24px; font-size:clamp(24px,3.6vw,40px);}
.mani-block h2 .en{color:#c7c7cc; font-weight:600; font-size:.62em;}
.mani-block p{font-size:18px; line-height:1.9; color:var(--ink2);}
.mani-cols{display:grid; grid-template-columns:1fr; gap:32px; margin-bottom:44px;}
.mani-cols .k{font-size:13px; font-weight:600; letter-spacing:.3px; color:var(--graytx); margin-bottom:12px;}
.mani-cols p{font-size:17px;}
.cv-label{font-size:13px; font-weight:600; letter-spacing:.3px; color:var(--graytx); margin-bottom:16px;}
.cv-grid{display:grid; grid-template-columns:1fr; gap:20px;}
.cv-card{background:var(--faint); border:1px solid var(--hair); border-radius:6px; padding:24px;}
.cv-card .n{font-family:var(--display); font-size:20px; font-weight:800; color:var(--board); margin-bottom:14px;}
.cv-card h4{margin-bottom:10px; font-size:19px; font-weight:700; color:var(--ink);}
.cv-card p{font-size:15px; line-height:1.75; color:var(--ink3);}
.tags{display:flex; gap:14px; flex-wrap:wrap;}
.tag-pill{border:1.5px solid var(--ink); border-radius:999px; padding:8px 20px; font-size:15px; font-weight:600; color:var(--ink);}
.tag-pill.red{border-color:var(--board); color:var(--board);}
@media(min-width:640px){ .mani-cols{grid-template-columns:1fr 1fr;} .cv-grid{grid-template-columns:1fr 1fr 1fr;} }
@media(min-width:768px){
  .mani-hero{padding-top:96px; padding-bottom:80px;}
  .mani-hero .eyebrow{margin-bottom:32px;}
  .mani-hero h1{letter-spacing:-1.8px;}
  .mani-hero p{font-size:21px;}
  .mani-block{grid-template-columns:96px 1fr; gap:40px; padding:74px 0;}
  .mani-block.last{padding-top:74px; padding-bottom:96px;}
  .mani-num{font-size:30px;}
  .mani-cols{gap:36px;}
  .mani-cols p{font-size:18px;}
  .mani-block p{font-size:19px;}
  .cv-card{padding:28px;}
}

/* =====================================================================
   SERVICES
   ===================================================================== */
.svc-hero{padding-top:64px; padding-bottom:48px;}
.svc-hero .eyebrow{margin-bottom:20px;}
.svc-hero h1{font-family:var(--display); font-weight:900; line-height:1.05; letter-spacing:-1.2px;
  color:var(--ink); font-size:clamp(36px,6vw,76px);}
.svc-hero p{max-width:680px; margin-top:28px; font-size:18px; line-height:1.8; color:var(--ink2);}
.tabs-band{background:var(--faint); border-top:1px solid #f0f0f1; border-bottom:1px solid #f0f0f1;}
.tabs{display:grid; grid-template-columns:1fr 1fr 1fr;}
.tab{text-align:right; cursor:pointer; padding:24px 16px; transition:all .2s; border-bottom:2px solid transparent;}
.tab.active{border-bottom-color:var(--board);}
.tab .en{font-size:11px; font-weight:700; letter-spacing:2px; color:#a1a1a6; margin-bottom:8px;}
.tab .ti{font-size:15px; font-weight:700; color:#86868b;}
.tab.active .ti{color:var(--board);}
.svc-detail{max-width:1280px; margin-inline:auto; padding:48px 24px;}
.pillar-detail{display:grid; grid-template-columns:1fr; gap:40px; align-items:start;}
.pillar-detail .num{font-family:var(--display); font-size:56px; font-weight:800; color:var(--board); letter-spacing:-2px; line-height:1;}
.pillar-detail h2{font-family:var(--display); margin:20px 0 16px; font-size:28px; font-weight:800; letter-spacing:-.8px; color:var(--ink);}
.pillar-detail .desc{font-size:17px; line-height:1.85; color:var(--ink2);}
.pillar-items{display:grid; grid-template-columns:1fr; gap:16px;}
.pillar-item{background:#fff; border:1px solid var(--hair); border-radius:6px; padding:20px; display:flex; gap:14px; align-items:flex-start;}
.pillar-item .d{width:8px; height:8px; background:var(--board); display:block; margin-top:8px; flex-shrink:0;}
.pillar-item span:last-child{font-size:16px; font-weight:600; line-height:1.5; color:var(--ink);}
.process{background:#fff; border-top:1px solid #f0f0f1;}
.process .pad{max-width:1280px; margin-inline:auto; padding:64px 24px;}
.process .head{text-align:center; margin-bottom:48px;}
.process .head .k{font-size:13px; font-weight:600; letter-spacing:3px; color:var(--graytx); margin-bottom:14px;}
.process .head h2{font-family:var(--display); font-weight:800; letter-spacing:-1px; color:var(--ink); font-size:clamp(26px,3.8vw,46px);}
.timeline{position:relative;}
.timeline .rail{display:none; position:absolute; top:22px; right:9%; left:9%; height:2px; background:var(--pale);}
.steps{position:relative; display:grid; grid-template-columns:1fr 1fr; column-gap:24px; row-gap:40px;}
.step{text-align:center;}
.step .circle{width:46px; height:46px; border-radius:999px; background:var(--board); color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:18px; margin:0 auto 20px;}
.step h4{margin-bottom:10px; font-size:19px; font-weight:700; color:var(--ink);}
.step p{font-size:14px; line-height:1.7; color:var(--ink3); max-width:220px; margin-inline:auto;}
.svc-cta{background:var(--ink); color:#fff;}
.svc-cta .pad{max-width:760px; margin-inline:auto; padding:64px 24px; text-align:center;}
.svc-cta h2{font-family:var(--display); font-weight:800; letter-spacing:-.8px; line-height:1.2; margin-bottom:32px; font-size:clamp(26px,4vw,46px);}
@media(min-width:768px){
  .svc-hero{padding-top:96px; padding-bottom:56px;}
  .svc-hero h1{letter-spacing:-1.6px;}
  .svc-hero p{font-size:20px;}
  .tab{padding:28px 24px;}
  .tab .en{font-size:12px;}
  .tab .ti{font-size:19px;}
  .svc-detail{padding:90px 40px;}
  .pillar-detail .num{font-size:64px;}
  .pillar-detail h2{font-size:34px;}
  .pillar-detail .desc{font-size:18px;}
  .pillar-items{grid-template-columns:1fr 1fr; gap:22px;}
  .pillar-item{padding:24px;}
  .pillar-item span:last-child{font-size:17px;}
  .process .pad{padding:90px 40px;}
  .process .head{margin-bottom:64px;}
  .timeline .rail{display:block;}
  .steps{grid-template-columns:repeat(4,1fr);}
  .svc-cta .pad{padding:96px 40px;}
}
@media(min-width:1024px){
  .pillar-detail{grid-template-columns:.9fr 1.1fr; gap:60px;}
}

/* =====================================================================
   CASE STUDY
   ===================================================================== */
.case-back{padding-top:40px;}
.case-back a{font-size:15px; font-weight:600; color:var(--graytx); transition:color .2s;}
.case-back a:hover{color:var(--board);}
.case-hero{padding-top:32px;}
.case-tags{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:24px;}
.ctag{font-size:12px; font-weight:600; letter-spacing:.3px; color:var(--graytx); border:1px solid #e7e7e9; border-radius:999px; padding:6px 16px;}
.ctag.red{font-weight:700; color:var(--board); border-color:#f3c9c4;}
.case-hero h1{font-family:var(--display); font-weight:900; line-height:1.05; letter-spacing:-1.2px; color:var(--ink); font-size:clamp(34px,6vw,78px);}
.case-hero .lead{max-width:760px; margin:28px 0 40px; font-weight:500; line-height:1.65; color:var(--ink2); font-size:clamp(19px,2.6vw,27px);}
.case-hero .lead span{color:var(--board);}
.case-figure{position:relative; border-radius:8px; overflow:hidden; display:flex; align-items:flex-end;
  padding:28px; height:clamp(240px,42vw,500px); background:linear-gradient(135deg,#EDEDF0,#E2E2E6);}
.case-figure .mark{position:absolute; top:28px; left:28px; width:74px; height:74px; background:var(--board);}
.case-figure .b1{position:absolute; top:120px; left:28px; width:200px; height:14px; background:rgba(0,0,0,.08);}
.case-figure .b2{position:absolute; top:144px; left:28px; width:130px; height:14px; background:rgba(0,0,0,.08);}
.case-figure .ph{color:#86868b; font-size:14px; font-weight:600; letter-spacing:.3px;}
.case-sec{padding-top:64px;}
.case-sec .k{font-size:13px; font-weight:600; letter-spacing:3px; color:var(--graytx); margin-bottom:28px;}
.challenge-grid{display:grid; grid-template-columns:1fr; gap:20px;}
.ch-card{background:#F5F5F5; border-radius:6px; padding:28px;}
.ch-card .n{font-family:var(--display); font-size:22px; font-weight:800; color:var(--board); margin-bottom:14px;}
.ch-card h4{margin-bottom:10px; font-size:19px; font-weight:700; color:var(--ink);}
.ch-card p{font-size:15px; line-height:1.75; color:var(--ink3);}
.strategy-grid{display:grid; grid-template-columns:1fr; gap:40px; align-items:start;}
.strategy-grid > p{font-size:18px; line-height:1.95; color:var(--ink2);}
.keypoints{display:flex; flex-direction:column; gap:16px;}
.keypoint{display:flex; gap:12px; align-items:flex-start;}
.keypoint .d{width:8px; height:8px; background:var(--board); display:block; margin-top:8px; flex-shrink:0;}
.keypoint span:last-child{font-size:16px; font-weight:600; color:var(--ink); line-height:1.5;}
.outcomes{background:var(--ink); color:#fff; margin-top:64px;}
.outcomes .pad{max-width:1080px; margin-inline:auto; padding:56px 24px;}
.outcomes .k{font-size:13px; font-weight:600; letter-spacing:3px; color:#86868b; margin-bottom:36px;}
.metrics{display:grid; grid-template-columns:1fr 1fr; column-gap:24px; row-gap:36px;}
.metric .big{font-family:var(--display); font-weight:800; color:var(--board); letter-spacing:-1px; line-height:1; font-size:clamp(34px,4.6vw,58px);}
.metric .cap{margin-top:14px; font-size:15px; color:#c7c7cc; line-height:1.5;}
.case-final{max-width:1080px; margin-inline:auto; padding:64px 24px; text-align:center;}
.case-final h2{font-family:var(--display); font-weight:800; letter-spacing:-.8px; color:var(--ink); margin-bottom:28px; font-size:clamp(26px,3.6vw,42px);}
@media(min-width:768px){
  .case-back{padding-top:48px;}
  .case-hero{padding-top:40px;}
  .case-hero .lead{margin-bottom:48px;}
  .case-figure{padding:44px;}
  .case-figure .mark{top:44px; left:44px;}
  .case-figure .b1{top:138px; left:44px;}
  .case-figure .b2{top:162px; left:44px;}
  .case-sec{padding-top:90px;}
  .case-sec .k{margin-bottom:32px;}
  .challenge-grid{grid-template-columns:1fr 1fr 1fr;}
  .ch-card{padding:32px;}
  .strategy-grid{grid-template-columns:1.2fr .8fr; gap:54px;}
  .strategy-grid > p{font-size:19px;}
  .outcomes{margin-top:90px;}
  .outcomes .pad{padding:80px 40px;}
  .outcomes .k{margin-bottom:44px;}
  .metrics{grid-template-columns:repeat(4,1fr);}
  .case-final{padding:80px 40px;}
}

/* =====================================================================
   DISCOVERY (wizard)
   ===================================================================== */
.discovery .pad{padding-top:48px; padding-bottom:96px;}
.discovery .eyebrow{margin-bottom:20px;}
.wiz-head{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:14px;}
.wiz-head h1{font-family:var(--display); font-weight:800; letter-spacing:-.8px; color:var(--ink); font-size:clamp(26px,4.2vw,42px);}
.wiz-head .count{font-size:14px; font-weight:600; color:var(--graytx); white-space:nowrap;}
.progress{height:4px; background:var(--pale); border-radius:4px; overflow:hidden; margin-bottom:14px;}
.progress .bar{height:100%; background:var(--board); border-radius:4px; transition:width .5s; width:25%;}
.step-dots{display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:40px;}
.step-dots .d{display:flex; align-items:center; gap:8px;}
.step-dots .d .pt{width:10px; height:10px; border-radius:999px; flex-shrink:0;}
.step-dots .d .nm{font-size:12px; font-weight:600; white-space:nowrap;}
.wizard-step{display:none; flex-direction:column; gap:24px;}
.wizard-step.active{display:flex;}
.field{display:flex; flex-direction:column;}
.field > label{display:block; font-size:14px; font-weight:600; color:var(--ink); margin-bottom:10px;}
.field .opt{color:#a1a1a6; font-weight:400;}
.input,.textarea,.select{width:100%; font-size:16px; padding:14px 16px; border:1px solid var(--pale);
  border-radius:6px; background:var(--faint); color:var(--ink); outline:none; transition:border-color .2s,background .2s,box-shadow .2s; font-family:var(--font);}
.textarea{resize:vertical; line-height:1.7;}
.select{cursor:pointer;}
.input:focus,.textarea:focus,.select:focus{border-color:var(--board); background:#fff; box-shadow:0 0 0 4px rgba(238,66,52,.1);}
.row2{display:grid; grid-template-columns:1fr; gap:20px;}
.chip-row,.rcard-row{display:flex; gap:12px; flex-wrap:wrap;}
.chip{border:1.5px solid var(--pale); border-radius:999px; padding:10px 20px; font-size:15px; font-weight:600; color:var(--ink2); transition:all .2s;}
.chip.is-on{border-color:var(--board); color:var(--board);}
.rcard-grid{display:grid; grid-template-columns:1fr; gap:12px;}
.rcard{text-align:right; border:1.5px solid var(--pale); border-radius:8px; padding:16px 20px; font-size:15px; font-weight:600; color:var(--ink2); transition:all .2s;}
.rcard.center{text-align:center; padding:14px 20px;}
.rcard.is-on{border-color:var(--board); color:var(--ink); background:#fff8f7;}
.wiz-nav{display:flex; justify-content:space-between; align-items:center; margin-top:48px; padding-top:28px; border-top:1px solid var(--hair);}
.btn-back.invisible{visibility:hidden;}
.btn-next{background:var(--ink); color:#fff; border-radius:2px; padding:14px 36px; font-size:16px; font-weight:600; white-space:nowrap; transition:all .3s;}
.btn-next:hover{background:#000; transform:translateY(-2px);}
.btn-next.submit{background:var(--board);}
.btn-next.submit:hover{background:var(--board-dark); box-shadow:0 12px 28px rgba(238,66,52,.28);}
@media(min-width:640px){
  .step-dots{grid-template-columns:repeat(4,1fr);}
  .row2{grid-template-columns:1fr 1fr;}
  .rcard-grid{grid-template-columns:1fr 1fr;}
}
@media(min-width:768px){ .discovery .pad{padding-top:56px; padding-bottom:112px;} .step-dots{margin-bottom:48px;} }

/* =====================================================================
   THANK YOU
   ===================================================================== */
.thanks{background:var(--faint); display:flex; align-items:center; justify-content:center; padding:80px 24px; min-height:calc(100vh - 64px);}
.thanks .inner{text-align:center; max-width:620px;}
.thanks .check{width:84px; height:84px; border-radius:999px; background:var(--board);
  display:flex; align-items:center; justify-content:center; margin:0 auto 36px;}
.thanks .check svg{width:40px; height:40px; stroke:#fff; fill:none;}
.thanks h1{font-family:var(--display); font-weight:800; letter-spacing:-1px; color:var(--ink); font-size:clamp(30px,5vw,52px);}
.thanks p{margin:24px auto 36px; max-width:480px; font-size:18px; line-height:1.8; color:var(--ink2);}
.thanks .detail{background:#fff; border:1px solid var(--hair); border-radius:8px; padding:28px;
  display:inline-flex; gap:32px; text-align:center; margin-bottom:40px; flex-wrap:wrap; justify-content:center;}
.thanks .detail .k{font-size:12px; letter-spacing:.3px; color:var(--graytx); margin-bottom:8px;}
.thanks .detail .v{font-size:17px; font-weight:700; color:var(--ink);}
@media(min-width:768px){ .thanks p{font-size:19px;} .thanks .detail{gap:40px;} }

/* =====================================================================
   FOOTER
   ===================================================================== */
.site-footer{background:#161617; color:var(--pale);}
.site-footer .pad{padding-top:64px; padding-bottom:40px;}
.foot-grid{display:grid; grid-template-columns:1fr; gap:40px; align-items:start;}
.foot-brand .mk{color:#fff; margin-bottom:20px;}
.foot-brand .mk svg{height:24px; width:auto; fill:currentColor;}
.foot-brand p{max-width:300px; font-size:14px; line-height:1.8; color:#9a9aa0;}
.foot-col .h{font-size:12px; letter-spacing:2px; color:#6e6e73; margin-bottom:16px;}
.foot-nav{display:flex; flex-direction:column; gap:14px; align-items:flex-start;}
.foot-nav a{font-size:15px; color:var(--pale); transition:color .2s;}
.foot-nav a:hover{color:var(--board);}
.foot-contact{display:flex; flex-direction:column; gap:14px; font-size:14px; line-height:1.7; color:#c7c7cc;}
.foot-contact .red{color:var(--board);}
.foot-bottom{margin-top:56px; padding-top:24px; border-top:1px solid #2a2a2c;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:13px; color:#6e6e73;}
@media(min-width:768px){
  .site-footer .pad{padding-top:80px;}
  .foot-grid{grid-template-columns:1.6fr 1fr 1fr; gap:50px;}
}

/* LTR helper for phone/email/inputs */
.ltr{direction:ltr; text-align:right;}

/* =====================================================================
   TEAM
   ===================================================================== */
.team{padding-block:80px;}
.team h2{font-family:var(--display); font-weight:800; letter-spacing:-1px; color:var(--ink); margin:16px 0; font-size:clamp(28px,4.5vw,52px);}
.team-lead{max-width:620px; font-size:18px; line-height:1.8; color:var(--ink2); margin-bottom:48px;}
.team-grid{display:grid; grid-template-columns:1fr; gap:24px;}
.member{text-align:right;}
.member .avatar{position:relative; aspect-ratio:1/1; background:var(--faint); border:1px solid var(--hair); border-radius:8px; display:flex; align-items:center; justify-content:center; overflow:hidden; margin-bottom:18px; transition:all .3s;}
.member .avatar span{font-family:var(--display); font-size:clamp(40px,7vw,64px); font-weight:800; color:var(--ink);}
.member .avatar::after{content:""; position:absolute; top:14px; right:14px; width:18px; height:18px; background:var(--board);}
.member:hover .avatar{transform:translateY(-4px); border-color:#e2e2e4; box-shadow:0 16px 36px rgba(0,0,0,.08);}
.member h3{font-family:var(--display); font-size:21px; font-weight:700; color:var(--ink);}
.member .role{margin-top:6px; font-size:14px; font-weight:600; letter-spacing:.3px; color:var(--graytx);}
@media(min-width:640px){ .team-grid{grid-template-columns:1fr 1fr;} }
@media(min-width:768px){ .team{padding-block:128px;} .team-grid{grid-template-columns:repeat(4,1fr); gap:28px;} .team-lead{margin-bottom:64px;} }

/* Anchors styled as buttons / cards for multipage navigation */
a.case-card, a.pillar, a.member, a.post-card{display:block;}
.nav-link.current{color:var(--board);}

/* Generic back link */
.backlink{font-size:15px; font-weight:600; color:var(--graytx); transition:color .2s;}
.backlink:hover{color:var(--board);}

/* =====================================================================
   WORKS GALLERY
   ===================================================================== */
.works-list{padding-bottom:80px;}
.case-grid.cols3{gap:24px;}
@media(min-width:768px){ .works-list{padding-bottom:112px;} .case-grid.cols3{grid-template-columns:repeat(3,1fr); gap:28px;} }

/* =====================================================================
   TEAM MEMBER PROFILE
   ===================================================================== */
.profile-back{padding-top:40px;}
.profile-hero{padding-top:24px; padding-bottom:8px;}
.profile-top{display:grid; grid-template-columns:1fr; gap:28px; align-items:center;}
.profile-avatar{position:relative; aspect-ratio:1/1; max-width:200px; background:var(--faint); border:1px solid var(--hair); border-radius:12px; display:flex; align-items:center; justify-content:center; overflow:hidden;}
.profile-avatar span{font-family:var(--display); font-size:clamp(64px,14vw,104px); font-weight:800; color:var(--ink);}
.profile-avatar::after{content:""; position:absolute; top:16px; right:16px; width:22px; height:22px; background:var(--board);}
.profile-name{font-family:var(--display); font-weight:900; letter-spacing:-1px; color:var(--ink); font-size:clamp(34px,6vw,64px);}
.profile-role{margin-top:10px; font-size:18px; font-weight:600; color:var(--board);}
.profile-tag{margin-top:18px; max-width:600px; font-size:18px; line-height:1.85; color:var(--ink2);}
.profile-body{display:grid; grid-template-columns:1fr; gap:40px; align-items:start; padding-top:48px; padding-bottom:16px;}
.profile-body h2{font-family:var(--display); font-size:clamp(22px,3vw,30px); font-weight:800; letter-spacing:-.5px; color:var(--ink); margin-bottom:18px;}
.profile-body p{font-size:18px; line-height:1.95; color:var(--ink2); margin-bottom:18px;}
.expertise{display:flex; flex-direction:column; gap:14px;}
.expertise .item{display:flex; gap:12px; align-items:flex-start; background:#fff; border:1px solid var(--hair); border-radius:8px; padding:16px 18px;}
.expertise .item .d{width:8px; height:8px; background:var(--board); display:block; margin-top:8px; flex-shrink:0;}
.expertise .item span:last-child{font-size:16px; font-weight:600; color:var(--ink); line-height:1.5;}
@media(min-width:768px){
  .profile-top{grid-template-columns:200px 1fr; gap:44px;}
  .profile-body{grid-template-columns:1.2fr .8fr; gap:56px; padding-top:64px;}
}

/* =====================================================================
   BLOG
   ===================================================================== */
.blog-hero{padding-top:48px; padding-bottom:8px;}
.post-list{padding-top:40px; padding-bottom:80px;}
.post-grid{display:grid; grid-template-columns:1fr; gap:24px;}
.post-card{text-align:right; background:#fff; border:1px solid var(--hair); border-radius:8px; padding:28px; transition:all .3s;}
.post-card:hover{transform:translateY(-6px); box-shadow:0 22px 48px rgba(0,0,0,.10); border-color:#e2e2e4;}
.post-meta{display:flex; gap:10px; align-items:center; flex-wrap:wrap; font-size:12px; font-weight:600; letter-spacing:.3px; color:var(--graytx); margin-bottom:16px;}
.post-meta .cat{color:var(--board);}
.post-meta .sep{color:var(--line);}
.post-card h3{font-family:var(--display); font-size:22px; font-weight:700; color:var(--ink); line-height:1.35; letter-spacing:-.3px;}
.post-card p{margin:12px 0 16px; font-size:15px; line-height:1.7; color:var(--ink2);}
.post-card .more{font-size:15px; font-weight:600; color:var(--board);}
@media(min-width:640px){ .post-grid{grid-template-columns:1fr 1fr;} }
@media(min-width:768px){ .post-list{padding-bottom:112px;} }
@media(min-width:1024px){ .post-grid{grid-template-columns:repeat(3,1fr); gap:28px;} }

/* Single post (prose) */
.post-single{padding-top:24px; padding-bottom:80px;}
.post-single .meta{display:flex; gap:10px; align-items:center; flex-wrap:wrap; font-size:13px; font-weight:600; color:var(--graytx); margin-bottom:20px;}
.post-single .meta .cat{color:var(--board);}
.post-single .meta .sep{color:var(--line);}
.post-single h1{font-family:var(--display); font-weight:900; line-height:1.1; letter-spacing:-1px; color:var(--ink); font-size:clamp(32px,5.5vw,60px);}
.post-single .lead{margin:24px 0 8px; font-size:clamp(19px,2.4vw,24px); font-weight:500; line-height:1.7; color:var(--ink2);}
.prose{padding-top:20px;}
.prose p{font-size:18px; line-height:1.95; color:var(--ink2); margin-bottom:24px;}
.prose h2{font-family:var(--display); font-size:clamp(22px,3vw,32px); font-weight:800; letter-spacing:-.5px; color:var(--ink); margin:36px 0 16px;}
.prose blockquote{margin:28px 0; padding:6px 22px; border-right:3px solid var(--board); color:var(--ink); font-size:20px; line-height:1.7; font-weight:600;}
.prose strong{color:var(--ink); font-weight:700;}

/* Journal (recent posts on home) */
.journal{padding-block:80px;}
@media(min-width:768px){ .journal{padding-block:128px;} }