/* =====================================================
   RANKWISE — Styles
   DM Serif Display + DM Sans
   Cream base · Sienna earned · Green for growth
   ===================================================== */

/* ── VARIABLES ──────────────────── */
:root {
  --cream:   #f9f1dc;
  --cream-2: #f0e0b3;
  --dark:    #1f1f25;
  --dark-2:  #1a1a1a;
  --mindaro: #caf291;
  --green:   #186D57;
  --green-2: #1a7a62;
  --sienna:  #da5720;
  --warm:    #b7b1a6;
  --warm-2:  #8a847a;
  --white:   #ffffff;
  --text:    #222222;
  --text-2:  #4a4540;
  --text-3:  #bbbbbb;
  --rc:  rgba(34,34,34,.11);
  --rd:  rgba(255,255,255,.08);
  --rg:  rgba(255,255,255,.11);
  --fh: 'DM Serif Display', Georgia, serif;
  --fb: 'DM Sans', system-ui, sans-serif;
  --text-hero: clamp(48px, 8vw, 108px);
  --text-h2:   clamp(36px, 5.5vw, 66px);
  --text-h3:   clamp(26px, 3.5vw, 40px);
  --text-h4:   clamp(20px, 2.5vw, 28px);
  --text-lg:   clamp(17px, 2vw, 20px);
  --text-base: 16px;
  --text-sm:   14px;
  --text-meta: 11px;
  --max:   1160px;
  --pad:   clamp(24px, 5vw, 68px);
  --nav-h: 64px;
  --sp:    clamp(72px, 9vw, 116px);
  --sp-sm: clamp(44px, 6vw, 72px);
}

/* ── RESET ──────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html { scroll-behavior:smooth }
body {
  font-family:var(--fb); background:var(--cream); color:var(--dark);
  line-height:1.6; overflow-x:hidden; -webkit-font-smoothing:antialiased; font-size:16px;
}
a { color:inherit; text-decoration:none }
button { cursor:pointer; border:none; background:none; font-family:inherit }
.w { max-width:var(--max); margin:0 auto; padding:0 var(--pad) }
.sp    { padding:var(--sp) 0 }
.sp-sm { padding:var(--sp-sm) 0 }

/* ── TYPOGRAPHY ─────────────────── */
h1, h2, h3, h4, h5 { 
  font-family:var(--fh); line-height:1.06; 
  letter-spacing:-.02em; font-weight:400; 
}
.h-hero { font-size:var(--text-hero); line-height:1.02 }
.h-xl   { font-size:var(--text-h2) }
.h-lg   { font-size:var(--text-h3) }
.h-md   { font-size:var(--text-h4) }
.body-lg, .hero-sub, .manifesto-copy { 
  font-family:var(--fb); font-size:var(--text-lg); 
  line-height:1.78; color:var(--text-2); font-weight:300; 
}
.body-md, p { 
  font-family:var(--fb); font-size:var(--text-base); 
  line-height:1.78; font-weight:300; 
}
.lbl {
  font-family:var(--fb); font-size:var(--text-meta); font-weight:500;
  letter-spacing:.18em; text-transform:uppercase; color:var(--dark-2);
  display:block; margin-bottom:14px;
}
.lbl-2 { color:var(--white) }

/* ── REVEAL ─────────────────────── */
.rv { opacity:0; transform:translateY(14px); transition:opacity .55s ease,transform .55s ease }
.rv.on { opacity:1; transform:none }
.rv.d1 { transition-delay:.08s }
.rv.d2 { transition-delay:.16s }
.rv.d3 { transition-delay:.24s }

/* ── BUTTONS ────────────────────── */
.btn {
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--fb); font-weight:500; font-size:16px;
  letter-spacing:.01em; padding:10px 30px; border-radius:100vmax;
  transition:background .15s,color .15s,border-color .15s;
  white-space:nowrap; cursor:pointer;
}
.btn-primary { background:var(--sienna); color:#fff }
.btn-primary:hover { background:#c44c1b }
.btn-dark { background:var(--dark); color:var(--cream) }
.btn-dark:hover { background:#111116 }
.btn-ghost { background:transparent; color:var(--dark); border:1px solid var(--rc) }
.btn-ghost:hover { border-color:var(--dark); background:var(--dark); color:var(--cream) }
.btn-ghost-d { background:transparent; color:var(--cream); border:1px solid rgba(249,241,220,.25) }
.btn-ghost-d:hover { background:var(--cream); color:var(--dark) }
.btn-ghost-s { background:transparent; color:#fff; border:1px solid rgba(255,255,255,.3) }
.btn-ghost-s:hover { background:#fff; color:var(--sienna) }
.btn-lg { font-size:16px; padding:15px 30px }

/* =====================================================
   NAVIGATION
   ===================================================== */
#nav {
  position:fixed; top:0; left:0; right:0; z-index:900;
  display:flex; flex-direction:column;
  background:transparent; transition:background .2s,border-color .2s;
  border-bottom:1px solid transparent;
}
#nav.solid {
  background:rgba(249,241,220,.96);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom-color:var(--rc);
}
.nav-in {
  height:var(--nav-h);
  max-width:var(--max); margin:0 auto; padding:0 var(--pad);
  width:100%; display:flex; align-items:center; justify-content:space-between;
  gap:8px;
}
.logo { display:flex; align-items:center; }
.logo img { height: 22px; width: auto; display: block; }
.nav-links { display:flex; align-items:center; list-style:none; gap:0 }
.nav-links a,.nav-links button {
  font-family:var(--fb); font-size:14px; font-weight:500;
  color:var(--dark-2); padding:6px 11px; border-radius:3px;
  transition:color .15s; letter-spacing:.01em; cursor:pointer;
  background:none; border:none; display:flex; align-items:center; gap:4px;
  white-space:nowrap;
}
.nav-links a:hover,.nav-links button:hover { color:var(--dark) }
.nav-links a.on { color:var(--dark); position:relative }
.nav-links a.on::after {
  content:''; position:absolute; bottom:0; left:11px; right:11px;
  height:2px; background:var(--sienna); border-radius:2px;
}
.nav-links .has-dd button { gap:4px }
.dd-arrow { width:10px; height:10px; transition:transform .2s; opacity:.5 }
.has-dd.open .dd-arrow { transform:rotate(180deg) }
.nav-r { display:flex; align-items:center; gap:14px; flex-shrink:0 }
.nav-tel { 
  font-family:var(--fb); font-size:12px; font-weight:400; 
  color:var(--dark-2); letter-spacing:.04em; 
  transition:all .15s;
  display:flex; align-items:center; gap:6px;
  white-space:nowrap;
}
.nav-tel svg { opacity:.4; flex-shrink:0 }
.nav-tel:hover { color:var(--sienna) }
.hbg { display:none; flex-direction:column; gap:5px; padding:5px }
.hbg span { display:block; width:20px; height:1.5px; background:var(--dark); border-radius:1px }

/* ── MEGA DROPDOWN ──────────────── */
.dd-panel {
  position:fixed; left:0; right:0; top:var(--nav-h);
  background:var(--white); border-bottom:1px solid var(--rc);
  z-index:850; overflow:hidden;
  opacity:0; transform:translateY(-6px); pointer-events:none;
  transition:opacity .2s ease, transform .2s ease;
  box-shadow:0 12px 40px rgba(34,34,34,.08);
}
.dd-panel.open { opacity:1; transform:translateY(0); pointer-events:all }
.dd-inner {
  max-width:var(--max); margin:0 auto; padding:40px var(--pad) 36px;
  display:grid; grid-template-columns:repeat(4,1fr); gap:0;
}
.dd-col-head {
  font-family:var(--fb); font-size:9px; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--warm);
  padding:0 0 12px 0; border-bottom:1px solid var(--rc); margin-bottom:4px;
}
.dd-item {
  display:flex; align-items:center; gap:12px;
  padding:10px 0; border-bottom:1px solid transparent;
  cursor:pointer; position:relative; transition:padding-left .15s;
}
.dd-item::before {
  content:''; position:absolute; left:0; top:0; bottom:0;
  width:0; background:var(--dark); transition:width .15s;
}
.dd-item:hover { padding-left:12px }
.dd-item:hover::before { width:2px }
.dd-num { font-family:var(--fb); font-size:10px; color:var(--warm); letter-spacing:.08em; flex-shrink:0; min-width:20px }
.dd-name { font-family:var(--fh); font-size:17px; color:var(--dark); letter-spacing:-.01em; transition:color .15s }
.dd-item:hover .dd-name { color:var(--dark) }
.dd-foot {
  max-width:var(--max); margin:0 auto;
  padding:16px var(--pad) 24px;
  border-top:1px solid var(--rc);
  display:flex; align-items:center; justify-content:space-between;
}
.dd-foot-note { font-size:12px; color:var(--dark-2) }
.dd-overlay { position:fixed; inset:0; z-index:840; display:none }
.dd-overlay.open { display:block }

/* Main content spacing below fixed nav */
.page-wrap { padding-top:var(--nav-h) }

/* =====================================================
   HOME — HERO (optimized for LCP)
   ===================================================== */
.hero { 
  background:var(--cream); 
  padding:clamp(72px,10vw,116px) 0 clamp(56px,7vw,80px); 
  border-bottom:1px solid var(--rc);
}
.hero-h1 { 
  font-size:clamp(52px,8.5vw,112px); line-height:1.02; 
  letter-spacing:-.03em; margin-bottom:clamp(28px,3.5vw,44px); max-width:920px;
}
.hero-h1 .accent { color:var(--sienna) }
.hero-row { 
  display:flex; align-items:flex-end; justify-content:space-between; 
  gap:32px; flex-wrap:wrap; padding-top:clamp(24px,3vw,36px); 
  border-top:1px solid var(--rc);
}
.hero-sub { max-width:420px; font-size:15px; line-height:1.78; color:var(--text-2); font-weight:300 }
.hero-btns { display:flex; align-items:center; gap:12px; flex-shrink:0 }
.proof { display:grid; grid-template-columns:repeat(4,1fr); margin-top:clamp(40px,5vw,64px); border-top:1px solid var(--rc) }
.proof-cell { padding:clamp(16px,2.5vw,28px) clamp(16px,2vw,24px); border-right:1px solid var(--rc) }
.proof-cell:first-child { padding-left:0 }
.proof-cell:last-child  { border-right:none }
.proof-n { font-family:var(--fh); font-size:clamp(28px,3.5vw,46px); letter-spacing:-.03em; line-height:1; color:var(--dark); margin-bottom:5px }
.proof-l { font-size:11px; color:var(--warm); letter-spacing:.04em; font-family:var(--fb) }

/* ── SERVICES LIST ──────────────── */
.svc-section { background:var(--white); border-bottom:1px solid var(--rc); padding:var(--sp) 0 }
.svc-header { 
  display:grid; grid-template-columns:1fr 2fr; gap:48px; 
  align-items:end; padding:0 0 clamp(28px,4vw,44px); border-bottom:1px solid var(--rc);
}
.svc-header p { max-width:460px; font-size:15px; line-height:1.78; color:var(--text-2); font-weight:300 }
.svc-list { display:flex; flex-direction:column }
.svc-row {
  display:grid; grid-template-columns:52px 1fr 200px 28px;
  align-items:center; gap:24px;
  padding:clamp(18px,2.5vw,28px) 0;
  border-bottom:1px solid var(--rc);
  cursor:pointer; position:relative; transition:padding-left .15s;
}
.svc-row::before {
  content:''; position:absolute; left:0; top:0; bottom:0;
  width:0; background:var(--dark); transition:width .15s;
}
.svc-row:hover { padding-left:16px }
.svc-row:hover::before { width:3px }
.svc-num { font-family:var(--fb); font-size:11px; font-weight:400; color:var(--warm); letter-spacing:.1em }
.svc-name { font-family:var(--fh); font-size:clamp(22px,3vw,38px); letter-spacing:-.02em; color:var(--dark); white-space:nowrap }
.svc-brief { font-size:12px; color:var(--warm); text-align:right; line-height:1.5; font-family:var(--fb) }
.svc-arr { font-size:22px; color:var(--warm); transition:color .15s,transform .15s; text-align:right; font-family:var(--fh) }
.svc-row:hover .svc-arr { color:var(--dark); transform:translateX(4px) }

/* ── QUOTE ──────────────────────── */
.quote-bg { background:var(--cream-2); border-top:1px solid var(--rc); border-bottom:1px solid var(--rc) }
.quote-inner { padding:clamp(64px,9vw,110px) 0; max-width:820px; padding-top:0; padding-bottom:40px; border-bottom:1px solid var(--rc) }
.quote-brace { font-family:var(--fh); font-size:100px; color:rgba(34,34,34,.07); line-height:1; margin-bottom:-20px; font-style:italic }
.quote-body { font-family:var(--fh); font-size:clamp(22px,3vw,40px); font-style:italic; color:var(--dark); line-height:1.32; margin-bottom:24px; letter-spacing:-.01em }
.quote-rule { width:36px; height:1.5px; background:var(--warm); margin-bottom:14px }
.quote-name { font-family:var(--fb); font-size:11px; color:var(--warm-2); letter-spacing:.07em; text-transform:uppercase }

/* ── TESTIMONIALS ───────────────── */
.testi-strip { display:grid; grid-template-columns:repeat(3,1fr); margin-top:clamp(36px,5vw,56px); border-top:1px solid var(--rc) }
.testi-cell { padding:clamp(20px,2.5vw,32px); border-right:1px solid var(--rc) }
.testi-cell:last-child { border-right:none }
.testi-stars { font-size:11px; color:var(--dark); letter-spacing:2px; margin-bottom:10px; opacity:.5 }
.testi-q { font-family:var(--fh); font-size:15px; font-style:italic; color:var(--text-2); line-height:1.6; margin-bottom:12px }
.testi-who { font-family:var(--fb); font-size:11px; color:var(--warm-2) }

/* ── WHY ────────────────────────── */
.why-bg { background:var(--cream-2); border-top:1px solid var(--rc); border-bottom:1px solid var(--rc) }
.why-rows { display:flex; flex-direction:column; margin-top:32px; max-width:680px }
.why-row { display:flex; gap:18px; align-items:flex-start; padding:18px 0; border-bottom:1px solid rgba(34,34,34,.09) }
.why-row:last-child { border-bottom:none; padding-bottom:0 }
.why-dash { font-family:var(--fh); font-size:18px; color:var(--warm); flex-shrink:0; margin-top:2px }
.why-t { font-family:var(--fh); font-size:18px; color:var(--dark); margin-bottom:4px; letter-spacing:-.01em }
.why-d { font-size:13px; color:var(--text-2); line-height:1.72; font-weight:300 }
.why-nums { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--rc); border:1px solid var(--rc); border-radius:2px; overflow:hidden; margin-bottom:20px }
.wn { background:var(--white); padding:24px; text-align:center }
.wn-v { font-family:var(--fh); font-size:clamp(22px,2.8vw,32px); font-style:italic; color:var(--dark); line-height:1; margin-bottom:4px }
.wn-l { font-size:11px; color:var(--warm); line-height:1.4; font-family:var(--fb) }
.why-quote { background:var(--white); border:1px solid var(--rc); border-radius:2px; padding:24px }
.wq-mark { font-family:var(--fh); font-size:72px; color:rgba(34,34,34,.08); line-height:1; margin-bottom:-12px; font-style:italic }
.wq-body { font-family:var(--fh); font-size:17px; font-style:italic; color:var(--dark); line-height:1.55; margin-bottom:14px; letter-spacing:-.01em }
.wq-rule { width:32px; height:1.5px; background:var(--warm); margin-bottom:10px }

/* ── METHOD ─────────────────────── */
.method-section { background:var(--dark) }
.method-grid { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:start }
.method-h2 { color:var(--cream) }
.method-h2 em { font-style:italic; color:rgba(249,241,220,.55) }
.method-p { font-size:15px; line-height:1.78; color:var(--cream); font-weight:300; margin:14px 0 36px }
.steps { display:flex; flex-direction:column }
.step { display:flex; position:relative }
.step:not(:last-child) { padding-bottom:28px }
.step:not(:last-child)::after { content:''; position:absolute; left:13px; top:26px; bottom:4px; width:1px; background:rgba(255,255,255,.07) }
.step-n { width:26px; height:26px; border-radius:50%; background:rgba(255,255,255,.1); color:var(--cream); font-family:var(--fb); font-size:11px; font-weight:500; display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-right:18px }
.step-t { font-family:var(--fh); font-size:18px; color:var(--cream); margin-bottom:4px; letter-spacing:-.01em }
.step-d { font-size:13px; color:var(--cream); line-height:1.72; font-weight:300 }
.stats-panel { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.05); border-radius:2px; overflow:hidden }
.sp-cell { background:var(--dark-2); padding:28px 24px }
.sp-val { font-family:var(--fh); font-size:clamp(30px,4vw,46px); font-style:italic; color:var(--cream-2); line-height:1; margin-bottom:6px; letter-spacing:-.03em }
.sp-lbl { font-size:12px; color:rgba(255,255,255,.3); line-height:1.5; font-family:var(--fb); font-weight:300 }
.sp-note { margin-top:20px; font-size:11px; color:rgba(255,255,255,.2); line-height:1.7; font-family:var(--fb) }

/* ── FAQ ────────────────────────── */
.faq-bg { background:var(--white); border-bottom:1px solid var(--rc) }
.faq-grid { display:grid; grid-template-columns:3fr 5fr; gap:72px; align-items:start }
.faq-l { position:sticky; top:calc(var(--nav-h) + 20px) }
.faq-l p { font-size:14px; color:var(--warm-2); line-height:1.78; margin-bottom:28px; font-weight:300 }
.faq-contact { display:flex; flex-direction:column }
.faq-cl { display:flex; align-items:center; gap:10px; padding:12px 0; border-bottom:1px solid var(--rc); font-family:var(--fb); font-size:13px; color:var(--dark); transition:opacity .15s }
.faq-cl:last-child { border-bottom:none }
.faq-cl:hover { opacity:.7 }
.faq-cl svg { opacity:.4; flex-shrink:0 }
.faq-items { display:flex; flex-direction:column }
.faq-item { border-bottom:1px solid var(--rc) }
.faq-item:first-child { border-top:1px solid var(--rc) }
.faq-q { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:18px 0; cursor:pointer; font-family:var(--fh); font-size:18px; color:var(--dark); letter-spacing:-.01em; user-select:none }
.faq-chev { width:15px; height:15px; flex-shrink:0; color:var(--warm); transition:transform .25s }
.faq-item.open .faq-chev { transform:rotate(180deg) }
.faq-a { display:grid; grid-template-rows:0fr; overflow:hidden; transition:grid-template-rows .3s ease }
.faq-item.open .faq-a { grid-template-rows:1fr }
.faq-a-in { min-height:0; padding:0 0 0; font-family:var(--fb); font-size:14px; color:var(--warm-2); line-height:1.78; font-weight:300; transition:padding .3s ease }
.faq-item.open .faq-a-in { padding:0 0 18px }

/* ── GLOBAL CTA STRIP ───────────── */
.cta-strip { background:var(--sienna); color:#fff }
.cta-in { padding:var(--sp) 0 }
.cta-lbl { 
  font-size:var(--text-meta); font-weight:500; letter-spacing:.18em; 
  text-transform:uppercase; color:rgba(255,255,255,.45); margin-bottom:16px; display:block;
}
.cta-h2 { font-size:var(--text-h2); color:#fff; margin-bottom:20px }
.cta-h2 em { font-style:normal !important; color:#fff !important; position:relative; display:inline-block }
.cta-h2 em::after {
  content:''; position:absolute; bottom:-4px; left:0; width:100%; height:3px;
  background:linear-gradient(90deg, transparent 0%, transparent 35%, #ffe180 35%, #ffe180 100%);
  background-size:10em 100%;
  animation:snakeSweep 7s linear infinite;
}
@keyframes snakeSweep { 0% { background-position:0 0 } 100% { background-position:10em 0 } }
.cta-body { font-size:var(--text-lg); color:rgba(255,255,255,.68); max-width:460px; margin-bottom:32px }
.cta-btns { display:flex; align-items:center; gap:12px; flex-wrap:wrap }
.btn-cta-primary {
  display:inline-flex; align-items:center; gap:9px;
  font-family:var(--fb); font-weight:500; font-size:15px;
  letter-spacing:.02em; padding:16px 34px; border-radius:3px;
  background:var(--white); color:var(--sienna);
  transition:background .15s, color .15s;
  white-space:nowrap; cursor:pointer; border:none;
}
.btn-cta-primary:hover { background:var(--cream-2); color:var(--sienna) }
.cta-phone-link {
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--fb); font-size:17px; font-weight:500; 
  color:rgba(255,255,255,0.95); letter-spacing:.01em;
  text-decoration:none; transition:transform .15s, color .15s;
  padding:8px 12px; white-space:nowrap;
}
.cta-phone-link:hover { color:#fff; transform:translateX(4px) }
.cta-phone-link svg { opacity:.7 }
.cta-trust-row {
  margin-top:14px; font-family:var(--fb); font-size:11px; font-weight:400;
  color:rgba(255,255,255,.38); letter-spacing:.07em; text-transform:uppercase;
}

/* =====================================================
   CASE PAGE
   ===================================================== */
.case-hero { background:var(--cream); border-bottom:1px solid var(--rc); padding:clamp(64px,10vw,108px) 0 clamp(44px,6vw,68px) }
.case-hero h1 { font-size:clamp(48px,7.5vw,100px); line-height:1.03; letter-spacing:-.03em; color:var(--dark); margin:14px 0 20px }
.case-hero h1 em { font-style:italic }
.case-hero p { font-family:var(--fb); font-size:16px; line-height:1.78; color:var(--text-2); max-width:560px; font-weight:300 }
.case-stack { display:flex; flex-direction:column }
.case-row {
  display:grid; grid-template-columns:1fr 1fr;
  min-height:520px; border-bottom:1px solid var(--rc);
  position:relative; overflow:hidden; cursor:pointer;
}
.case-row:last-child { border-bottom:none }
.case-row.flip { direction:rtl }
.case-row.flip > * { direction:ltr }
.case-img { position:relative; overflow:hidden; background:var(--dark); min-height:400px }
.case-row:hover .case-img-inner { transform:scale(1.03) }
.case-img-inner {
  position:absolute; inset:0; transition:transform .5s ease;
  background-size:cover; background-position:center;
}
.case-img-1 { background:linear-gradient(135deg, #1f2937 0%, #374151 40%, #1e3a5f 100%) }
.case-img-2 { background:linear-gradient(145deg, #162c27 0%, #186D57 50%, #0f3d2e 100%) }
.case-img-3 { background:linear-gradient(120deg, #2d1810 0%, #7c2d12 40%, #da5720 100%) }
.case-img-4 { background:linear-gradient(150deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%) }
.case-img-inner::after {
  content:''; position:absolute; inset:0;
  background-image:repeating-linear-gradient(0deg, transparent, transparent 40px, rgba(255,255,255,.02) 40px, rgba(255,255,255,.02) 41px),
                    repeating-linear-gradient(90deg, transparent, transparent 40px, rgba(255,255,255,.02) 40px, rgba(255,255,255,.02) 41px);
}
.case-img-tag {
  position:absolute; bottom:24px; left:24px; z-index:1;
  font-family:var(--fb); font-size:10px; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase;
  color:rgba(255,255,255,.5); background:rgba(0,0,0,.3);
  backdrop-filter:blur(8px); padding:6px 12px; border-radius:2px;
}
.case-text {
  padding:clamp(40px,5vw,72px);
  display:flex; flex-direction:column; justify-content:center;
  background:var(--white); position:relative; overflow:hidden;
}
.case-text::before {
  content:''; position:absolute; left:0; top:0; bottom:0;
  width:0; background:var(--dark); transition:width .25s ease;
}
.case-row:hover .case-text::before { width:3px }
.case-num { font-family:var(--fb); font-size:11px; color:var(--warm); letter-spacing:.12em; margin-bottom:16px }
.case-title { font-family:var(--fh); font-size:clamp(24px,3vw,38px); color:var(--dark); letter-spacing:-.02em; line-height:1.15; margin-bottom:14px }
.case-intro { font-size:14px; color:var(--text-2); line-height:1.75; font-weight:300; margin-bottom:28px; max-width:380px }
.case-details { display:flex; flex-direction:column; margin-bottom:28px }
.case-detail-row {
  display:grid; grid-template-columns:80px 1fr;
  gap:12px; padding:10px 0;
  border-bottom:1px solid var(--rc);
  position:relative; transition:padding-left .15s;
}
.case-detail-row:last-child { border-bottom:none }
.case-detail-row::before {
  content:''; position:absolute; left:0; top:0; bottom:0;
  width:0; background:var(--warm); transition:width .12s;
}
.case-detail-row:hover { padding-left:8px }
.case-detail-row:hover::before { width:2px }
.cdr-label { font-family:var(--fb); font-size:9px; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--warm); padding-top:2px }
.cdr-val { font-size:13px; color:var(--text-2); line-height:1.65; font-weight:300 }
.case-metrics { display:flex; gap:24px; border-top:1px solid var(--rc); padding-top:20px }
.case-m-v { font-family:var(--fh); font-size:clamp(28px,3.5vw,42px); font-style:italic; color:var(--dark); line-height:1; letter-spacing:-.03em; margin-bottom:3px }
.case-m-l { font-size:11px; color:var(--warm); letter-spacing:.04em; font-family:var(--fb) }
.case-service-tag {
  display:inline-block; font-family:var(--fb); font-size:10px; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase; color:var(--dark);
  background:var(--cream); border:1px solid var(--rc);
  padding:4px 10px; border-radius:2px; margin-bottom:20px;
}

/* =====================================================
   INNER PAGE TEMPLATE
   ===================================================== */
.ih { background:var(--cream); border-bottom:1px solid var(--rc); padding:clamp(64px,10vw,108px) 0 clamp(44px,6vw,68px) }
.ih h1 { font-size:clamp(48px,7.5vw,100px); line-height:1.03; letter-spacing:-.03em; color:var(--dark); margin:14px 0 20px }
.ih h1 em { font-style:italic }
.ih p { font-family:var(--fb); font-size:16px; line-height:1.78; color:var(--text-2); max-width:560px; font-weight:300 }
.ih-btns { display:flex; gap:12px; flex-wrap:wrap; margin-top:32px }
.ps { border-bottom:1px solid var(--rc) }
.ps.cream  { background:var(--cream) }
.ps.white  { background:var(--white) }
.ps.dark   { background:#282833; border-bottom-color:var(--rd) }
.ps.green  { background:var(--green); border-bottom-color:var(--rg) }
.ps.cream2 { background:var(--cream-2); border-top:1px solid var(--rc) }
.stat-bar { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--rc); border:1px solid var(--rc); border-radius:2px; overflow:hidden }
.sc { background:var(--white); padding:26px 20px; text-align:center }
.sc-v { font-family:var(--fh); font-size:clamp(26px,3.5vw,40px); font-style:italic; color:var(--dark); line-height:1; margin-bottom:6px }
.sc-l { font-family:var(--fb); font-size:11px; color:var(--warm); letter-spacing:.03em }
.two-col { display:grid; grid-template-columns:5fr 4fr; gap:64px; align-items:start }
.feat-list { display:flex; flex-direction:column }
.feat-row { display:flex; gap:18px; align-items:flex-start; padding:18px 0; border-bottom:1px solid var(--rc) }
.feat-row:first-child { padding-top:0 }
.feat-row:last-child  { border-bottom:none }
.feat-n { font-family:var(--fb); font-size:10px; font-weight:400; color:var(--warm); letter-spacing:.1em; flex-shrink:0; margin-top:4px; min-width:22px }
.feat-t { font-family:var(--fh); font-size:18px; color:var(--dark); margin-bottom:3px; letter-spacing:-.01em }
.feat-d { font-family:var(--fb); font-size:13px; color:var(--text-2); line-height:1.72; font-weight:300 }
.sticky-card { background:var(--white); border:1px solid var(--rc); border-radius:2px; padding:28px; position:sticky; top:calc(var(--nav-h) + 20px) }
.sk-hl { font-family:var(--fh); font-size:22px; color:var(--dark); margin-bottom:7px; letter-spacing:-.01em }
.sk-body { font-family:var(--fb); font-size:13px; color:var(--dark-2); line-height:1.72; margin-bottom:20px; font-weight:300 }
.sk-stats { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:20px }
.sk-s { background:var(--cream); border:1px solid var(--rc); border-radius:2px; padding:14px; text-align:center }
.sk-s-v { font-family:var(--fh); font-size:19px; font-style:italic; color:var(--dark); line-height:1; margin-bottom:2px }
.sk-s-l { font-family:var(--fb); font-size:10px; color:var(--warm); letter-spacing:.03em }
.sk-list { list-style:none; display:flex; flex-direction:column; gap:8px; margin-bottom:22px }
.sk-list li { font-family:var(--fb); font-size:13px; color:var(--dark-2); display:flex; align-items:flex-start; gap:8px; font-weight:300 }
.sk-list li::before { content:'–'; color:var(--warm); font-family:var(--fh); flex-shrink:0 }
.sk-links { display:flex; flex-direction:column; border-top:1px solid var(--rc); padding-top:14px; margin-top:16px }
.sk-cl { display:flex; align-items:center; gap:8px; font-family:var(--fb); font-size:12px; font-weight:300; color:var(--warm-2); padding:8px 0; border-bottom:1px solid var(--rc); transition:color .15s }
.sk-cl:last-child { border-bottom:none }
.sk-cl:hover { color:var(--dark) }
.sk-cl svg { opacity:.4; flex-shrink:0 }
.proc-list { display:flex; flex-direction:column }
.proc { display:flex; position:relative }
.proc:not(:last-child) { padding-bottom:28px }
.proc:not(:last-child)::after { content:''; position:absolute; left:12px; top:24px; bottom:4px; width:1px; background:var(--rc) }
.proc-n { width:24px; height:24px; border-radius:50%; background:var(--dark); color:var(--cream); font-family:var(--fb); font-size:10px; font-weight:500; display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-right:18px }
.proc-t { font-family:var(--fh); font-size:17px; color:var(--dark); margin-bottom:3px; letter-spacing:-.01em }
.proc-d { font-family:var(--fb); font-size:13px; color:var(--dark-2); line-height:1.72; font-weight:300 }

/* ── TEAM / OM ──────────────────── */
.team-rows { display:flex; flex-direction:column }
.team-row { display:grid; grid-template-columns:40px 2fr 3fr; gap:22px; align-items:start; padding:18px 0; border-bottom:1px solid var(--rc) }
.team-row:last-child { border-bottom:none }
.t-av { width:40px; height:40px; border-radius:50%; background:var(--dark); display:flex; align-items:center; justify-content:center; font-family:var(--fb); font-size:12px; font-weight:500; color:var(--cream); flex-shrink:0 }
.t-av.s { background:var(--sienna) }
.t-av.g { background:var(--green) }
.t-name { font-family:var(--fh); font-size:17px; color:var(--dark); margin-bottom:2px; letter-spacing:-.01em }
.t-role { font-family:var(--fb); font-size:11px; color:var(--warm-2); letter-spacing:.06em; text-transform:uppercase }
.t-bio  { font-family:var(--fb); font-size:13px; color:var(--warm-2); line-height:1.65; font-weight:300 }
.val-rows { display:flex; flex-direction:column }
.val-row { display:grid; grid-template-columns:2fr 3fr; gap:22px; align-items:start; padding:18px 0; border-bottom:1px solid var(--rc) }
.val-row:last-child { border-bottom:none }
.val-t { font-family:var(--fh); font-size:18px; color:var(--dark); letter-spacing:-.01em }
.val-d { font-family:var(--fb); font-size:13px; color:var(--warm-2); line-height:1.72; font-weight:300 }
.tl-list { display:flex; flex-direction:column }
.tl { display:flex; position:relative }
.tl:not(:last-child) { padding-bottom:24px }
.tl:not(:last-child)::before { content:''; position:absolute; left:10px; top:20px; bottom:0; width:1px; background:var(--rc) }
.tl-dot { width:20px; height:20px; border-radius:50%; border:1.5px solid var(--warm); background:var(--cream); display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-right:18px }
.tl-dot-i { width:6px; height:6px; border-radius:50%; background:var(--dark) }
.tl-yr { font-family:var(--fb); font-size:10px; color:var(--warm-2); margin-bottom:3px; letter-spacing:.1em }
.tl-t { font-family:var(--fh); font-size:16px; color:var(--dark); margin-bottom:3px; letter-spacing:-.01em }
.tl-d { font-family:var(--fb); font-size:13px; color:var(--warm-2); line-height:1.65; font-weight:300 }

/* ── KONTAKT ────────────────────── */
.k-grid { display:grid; grid-template-columns:2fr 3fr; gap:72px; align-items:start }
.k-rows { display:flex; flex-direction:column }
.k-row { display:flex; align-items:center; gap:16px; padding:14px 0; border-bottom:1px solid var(--rc) }
.k-row:last-child { border-bottom:none }
.k-ic { width:34px; height:34px; background:rgba(34,34,34,.06); border-radius:3px; display:flex; align-items:center; justify-content:center; color:var(--dark); flex-shrink:0; opacity:.7 }
.k-lbl { font-family:var(--fb); font-size:9px; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--warm); margin-bottom:3px }
.k-val { font-family:var(--fh); font-size:16px; color:var(--dark); letter-spacing:-.01em }
.form-card { background:var(--cream); border-radius:10px; padding:clamp(28px,4vw,48px) }
.form-hl { font-family:var(--fh); font-size:clamp(28px,3.5vw,40px); color:var(--dark); margin-bottom:28px; letter-spacing:-.01em }
form { display:flex; flex-direction:column; gap:18px }
.fg { display:flex; flex-direction:column; gap:6px }
.fg-row { display:grid; grid-template-columns:1fr 1fr; gap:18px }
label { font-family:var(--fb); font-size:13px; font-weight:500; letter-spacing:.01em; text-transform:none; color:var(--dark) }
label.required::after { content:" *"; color:var(--sienna) }
.fg-opt { font-weight:300; opacity:.55; font-size:12px }
input,select,textarea { background:var(--white); border:1px solid rgba(0,0,0,.1); border-radius:4px; padding:12px 15px; font-family:var(--fb); font-size:15px; color:var(--dark); width:100%; transition:border-color .2s,box-shadow .2s; outline:none; appearance:none; font-weight:300 }
input::placeholder,textarea::placeholder { color:var(--warm) }
input:focus,select:focus,textarea:focus { border-color:var(--sienna); box-shadow:0 0 0 3px rgba(218,87,32,.08) }
input.fg-error,select.fg-error,textarea.fg-error { border-color:var(--sienna); background:rgba(218,87,32,.03) }
select { cursor:pointer }
textarea { min-height:110px; resize:vertical }
.f-sub { width:100%; justify-content:center; font-size:15px; padding:15px; gap:10px; border:none; cursor:pointer; transition:background .15s,opacity .15s }
.f-sub:disabled { opacity:.7; cursor:not-allowed }
.f-sub-arrow { transition:transform .2s }
.f-sub:hover .f-sub-arrow { transform:translateX(3px) }

/* ── INLINE FILE UPLOAD ────────── */
.file-upload-inline {
  display:inline-flex; align-items:center; gap:7px;
  font-family:var(--fb); font-size:13px; font-weight:400;
  color:var(--warm-2); cursor:pointer; transition:color .15s;
  letter-spacing:0; text-transform:none; white-space:nowrap;
}
.file-upload-inline:hover { color:var(--sienna) }
.file-upload-inline svg { flex-shrink:0; opacity:.6 }

/* ── NEWSLETTER CHECKBOX ───────── */
.newsletter-toggle {
  display:flex; align-items:center; gap:10px; cursor:pointer;
  font-family:var(--fb); font-size:13px; font-weight:400; color:var(--warm-2);
  letter-spacing:0; text-transform:none; user-select:none;
}
.newsletter-toggle input { position:absolute; opacity:0; width:0; height:0 }
.nl-check {
  width:18px; height:18px; border:1.5px solid rgba(0,0,0,.15); border-radius:3px;
  background:var(--white); flex-shrink:0; position:relative; transition:all .15s;
}
.newsletter-toggle input:checked ~ .nl-check {
  background:var(--sienna); border-color:var(--sienna);
}
.newsletter-toggle input:checked ~ .nl-check::after {
  content:''; position:absolute; left:5px; top:2px;
  width:5px; height:9px; border:solid #fff; border-width:0 2px 2px 0;
  transform:rotate(45deg);
}
.fg-row-bottom { display:flex; flex-wrap:wrap; align-items:center; gap:16px 24px }
.newsletter-toggle { width:100% }

/* ── FORM SUCCESS STATE ────────── */
.form-success { text-align:center; padding:56px 24px }
.form-success-anim { margin-bottom:20px }
.form-check-svg { overflow:visible }
.form-check-circle { stroke-dasharray:150; stroke-dashoffset:150; animation:circleIn .5s ease forwards }
.form-check-path { stroke-dasharray:50; stroke-dashoffset:50; animation:checkIn .3s ease forwards .4s }
@keyframes circleIn { to { stroke-dashoffset:0 } }
@keyframes checkIn { to { stroke-dashoffset:0 } }
.form-success-h { font-family:var(--fh); font-size:clamp(28px,4vw,36px); color:var(--dark); margin-bottom:10px; letter-spacing:-.02em }
.form-success-p { font-family:var(--fb); font-size:15px; color:var(--warm-2); font-weight:300; max-width:320px; margin:0 auto; line-height:1.65 }

/* ── FORM SPINNER ──────────────── */
.f-sub-spinner {
  display:inline-block; width:16px; height:16px;
  border:2px solid rgba(255,255,255,.3); border-top-color:#fff;
  border-radius:50%; animation:formSpin .6s linear infinite;
}
@keyframes formSpin { to { transform:rotate(360deg) } }

/* ── NEXT STEPS ─────────────────── */
.next-steps { display:flex; flex-direction:column; margin:28px 0 0 }
.ns-row {
  display:grid; grid-template-columns:44px 1fr;
  gap:16px; align-items:start; padding:16px 0;
  border-bottom:1px solid var(--rc); position:relative;
}
.ns-row:last-child { border-bottom:none }
.ns-num {
  width:36px; height:36px; border-radius:50%;
  background:var(--dark); color:var(--cream);
  font-family:var(--fb); font-size:12px; font-weight:500;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.ns-t { font-family:var(--fh); font-size:16px; color:var(--dark); margin-bottom:3px; letter-spacing:-.01em }
.ns-d { font-family:var(--fb); font-size:13px; color:var(--warm-2); line-height:1.65; font-weight:300 }

/* ── TRUST BADGES ───────────────── */
.trust-badges { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:28px }
.trust-badge {
  display:inline-flex; align-items:center; gap:6px;
  font-family:var(--fb); font-size:11px; font-weight:500;
  color:rgba(255,255,255,.6); letter-spacing:.04em;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.15);
  padding:5px 11px; border-radius:100px;
}
.trust-badge-icon { font-size:12px; line-height:1 }

/* ── FILE UPLOAD (legacy) ──────── */
.file-upload-label {
  display:flex; align-items:center; justify-content:center;
  gap:10px; background:transparent; border:1px dashed var(--warm);
  border-radius:3px; padding:14px; font-family:var(--fb); font-size:13px;
  color:var(--text-2); cursor:pointer; transition:all 0.2s ease;
  font-weight:400; text-transform:none; letter-spacing:0;
}
.file-upload-label:hover { border-color:var(--sienna); color:var(--sienna); background:rgba(218,87,32,.03) }

/* ── ACCENT COLORS IN HEADERS ──── */
h1 em, h2 em, .hero-h1 em, .ih h1 em {
  font-style:normal !important;
  color:var(--sienna) !important; 
}

/* =====================================================
   INSIKTER — BLOG
   ===================================================== */
.insikter-hero { background:var(--cream); border-bottom:1px solid var(--rc); padding:clamp(64px,9vw,100px) 0 clamp(36px,5vw,56px) }
.insikter-meta { display:flex; align-items:baseline; justify-content:space-between; gap:24px; flex-wrap:wrap; margin-top:20px }
.insikter-count { font-family:var(--fb); font-size:13px; color:var(--warm) }
.feat-article {
  display:grid; grid-template-columns:1.1fr 1fr;
  border:1px solid var(--rc); border-radius:2px;
  overflow:hidden; background:var(--white);
  cursor:pointer; margin-bottom:2px; transition:border-color .15s;
}
.feat-article:hover { border-color:rgba(34,34,34,.22) }
.feat-article:hover .fa-img-inner { transform:scale(1.03) }
.fa-img { position:relative; overflow:hidden; min-height:400px; background:var(--dark) }
.fa-img-inner { position:absolute; inset:0; transition:transform .5s ease }
.fa-img-1 { background:linear-gradient(135deg,#1a1a2e 0%,#2d1b4e 40%,#162c27 100%) }
.fa-img-2 { background:linear-gradient(145deg,#1f2937 0%,#1e3a5f 50%,#0c2340 100%) }
.fa-img-3 { background:linear-gradient(120deg,#2d1810 0%,#7c2d12 40%,#da5720 80%,#7c2d12 100%) }
.fa-img-4 { background:linear-gradient(150deg,#162c27 0%,#186D57 50%,#0f3d2e 100%) }
.fa-cat-tag {
  position:absolute; top:20px; left:20px; z-index:1;
  font-family:var(--fb); font-size:10px; font-weight:500; letter-spacing:.12em; text-transform:uppercase;
  color:rgba(255,255,255,.7); background:rgba(0,0,0,.35); backdrop-filter:blur(6px);
  padding:5px 11px; border-radius:2px;
}
.fa-text { padding:clamp(28px,3.5vw,48px); display:flex; flex-direction:column; justify-content:center; background:var(--white) }
.fa-cat { font-family:var(--fb); font-size:10px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--sienna); margin-bottom:14px }
.fa-title { font-family:var(--fh); font-size:clamp(22px,2.8vw,36px); color:var(--dark); letter-spacing:-.02em; line-height:1.15; margin-bottom:14px }
.fa-excerpt { font-family:var(--fb); font-size:14px; color:var(--text-2); line-height:1.75; font-weight:300; margin-bottom:24px; flex:1 }
.fa-meta { display:flex; align-items:center; gap:16px; font-family:var(--fb); font-size:11px; color:var(--warm); letter-spacing:.04em }
.fa-meta span { display:flex; align-items:center; gap:5px }
.fa-read {
  display:inline-flex; align-items:center; gap:6px;
  font-family:var(--fb); font-size:12px; font-weight:500;
  color:var(--dark); margin-top:18px; transition:gap .15s;
}
.fa-read:hover { gap:10px }

/* ── ARTICLE LIST ROWS ──────────── */
.article-list { display:flex; flex-direction:column; border-top:1px solid var(--rc) }
a.article-row, a.ma-row, a.feat-article { text-decoration:none; color:inherit }
.article-row {
  display:grid; grid-template-columns:1fr auto 28px;
  align-items:center; gap:20px;
  padding:clamp(22px,3vw,32px) 0;
  border-bottom:1px solid var(--rc);
  cursor:pointer; position:relative; transition:padding-left .15s;
}
.ar-meta { font-family:var(--fb); font-size:11px; color:var(--warm); letter-spacing:.04em; text-align:right; flex-shrink:0; white-space:nowrap }
.article-row::before {
  content:''; position:absolute; left:0; top:0; bottom:0;
  width:0; background:var(--dark); transition:width .15s;
}
.article-row:hover { padding-left:14px }
.article-row:hover::before { width:2px }
.ar-num { font-family:var(--fb); font-size:11px; color:var(--warm); letter-spacing:.1em }
.ar-title { font-family:var(--fh); font-size:clamp(17px,2.2vw,24px); color:var(--dark); letter-spacing:-.02em; line-height:1.2 }
.ar-excerpt { font-family:var(--fb); font-size:12px; color:var(--warm-2); line-height:1.5; font-weight:300; margin-top:4px }
.ar-cat { font-family:var(--fb); font-size:10px; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--sienna); text-align:right }
.ar-arr { font-family:var(--fh); font-size:22px; color:var(--warm); text-align:right; transition:color .15s,transform .15s }
.article-row:hover .ar-arr { color:var(--dark); transform:translateX(4px) }

/* ── PAGINATION ─────────────────── */
.insikter-pagination {
  display:flex; align-items:center; justify-content:center;
  gap:4px; padding:clamp(20px,3vw,36px) 0;
  border-top:1px solid var(--rc); flex-wrap:wrap;
}
.pg-btn {
  font-family:var(--fb); font-size:12px; font-weight:500;
  padding:7px 13px; border-radius:3px;
  border:1px solid var(--rc); background:transparent; color:var(--warm-2);
  cursor:pointer; transition:background .15s,color .15s,border-color .15s;
  min-width:34px; text-align:center;
}
.pg-btn:hover { border-color:var(--dark); color:var(--dark) }
.pg-btn.active { background:var(--dark); color:var(--cream); border-color:var(--dark) }
.pg-btn.disabled { opacity:.3; pointer-events:none; cursor:default }
.pg-sep { font-family:var(--fb); font-size:12px; color:var(--warm); padding:0 4px }

/* ── SINGLE ARTICLE VIEW ────────── */
.article-back {
  display:inline-flex; align-items:center; gap:7px;
  font-family:var(--fb); font-size:12px; color:var(--warm-2);
  transition:color .15s; margin-bottom:24px;
}
.article-back:hover { color:var(--dark) }
.article-back:before { content:'←'; font-family:var(--fh); font-size:16px }
.article-hero-img {
  width:100%; height:clamp(240px,35vw,480px);
  border-radius:2px; overflow:hidden; margin:28px 0 0; position:relative;
}
.article-hero-img-inner { position:absolute; inset:0 }
.article-header { background:var(--cream); padding:clamp(48px,7vw,80px) 0 0; border-bottom:1px solid var(--rc) }
.article-cat { font-family:var(--fb); font-size:10px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--sienna); margin-bottom:14px; display:block }
.article-h1 { font-family:var(--fh); font-size:clamp(34px,5vw,64px); color:var(--dark); letter-spacing:-.03em; line-height:1.06; margin-bottom:18px }
.article-byline { display:flex; align-items:center; gap:20px; font-family:var(--fb); font-size:12px; color:var(--warm); letter-spacing:.04em; padding-bottom:28px }
.article-body-wrap { background:var(--white); border-bottom:1px solid var(--rc) }
.article-grid { display:grid; grid-template-columns:1fr 280px; gap:64px; align-items:start; padding:clamp(40px,6vw,72px) 0 }
.article-prose { max-width:660px }
.article-prose h2 { font-family:var(--fh); font-size:clamp(22px,2.8vw,32px); color:var(--dark); letter-spacing:-.02em; margin:36px 0 14px; line-height:1.15 }
.article-prose h2:first-child { margin-top:0 }
.article-prose p { font-family:var(--fb); font-size:15px; color:var(--text-2); line-height:1.82; font-weight:300; margin-bottom:18px }
.article-prose a { color: var(--sienna); text-decoration: underline; text-decoration-color: rgba(0,0,0,0.2); text-underline-offset: 3px }
.article-prose ul { list-style:none; display:flex; flex-direction:column; gap:8px; margin-bottom:18px; padding-left:0 }
.article-prose ul li { font-family:var(--fb); font-size:15px; color:var(--text-2); line-height:1.72; font-weight:300; display:flex; align-items:flex-start; gap:10px }
.article-prose ul li::before { content:'–'; color:var(--dark); font-family:var(--fh); flex-shrink:0; margin-top:1px }
.article-prose strong { font-weight:500; color:var(--dark) }
.article-prose .callout { background:var(--cream); border-left:3px solid var(--dark); padding:18px 22px; margin:24px 0; border-radius:0 2px 2px 0 }
.article-prose .callout p { margin-bottom:0; font-style:italic }
.article-sidebar { position:sticky; top:calc(var(--nav-h) + 20px) }
.article-sidebar-card { background:var(--cream); border:1px solid var(--rc); border-radius:2px; padding:24px }
.asc-head { font-family:var(--fh); font-size:18px; color:var(--dark); margin-bottom:8px; letter-spacing:-.01em }
.asc-body { font-family:var(--fb); font-size:13px; color:var(--warm-2); line-height:1.65; font-weight:300; margin-bottom:18px }
.author-card { display:flex; gap:14px; align-items:center; padding:24px 0; border-top:1px solid var(--rc); margin-top:32px }
.author-av { width:44px; height:44px; border-radius:50%; background:var(--dark); display:flex; align-items:center; justify-content:center; font-family:var(--fb); font-size:14px; font-weight:500; color:var(--cream); flex-shrink:0 }
.author-name { font-family:var(--fh); font-size:16px; color:var(--dark); letter-spacing:-.01em; margin-bottom:2px }
.author-role { font-family:var(--fb); font-size:11px; color:var(--warm-2); letter-spacing:.04em }
.more-articles { background:var(--cream); border-top:1px solid var(--rc) }
.ma-list { display:flex; flex-direction:column }
.ma-row {
  display:grid; grid-template-columns:1fr auto 28px;
  gap:20px; align-items:center; padding:clamp(22px,3vw,32px) 0;
  border-bottom:1px solid var(--rc); cursor:pointer;
  position:relative; transition:padding-left .15s;
}
.ma-row::before { content:''; position:absolute; left:0; top:0; bottom:0; width:0; background:var(--dark); transition:width .15s }
.ma-row:hover { padding-left:12px }
.ma-row:hover::before { width:2px }
.ma-title { font-family:var(--fh); font-size:clamp(17px,2.2vw,22px); color:var(--dark); letter-spacing:-.02em; line-height:1.2 }
.ma-excerpt { font-family:var(--fb); font-size:12px; color:var(--warm-2); line-height:1.5; font-weight:300; margin-top:4px }
.ma-date { font-family:var(--fb); font-size:11px; color:var(--warm); letter-spacing:.04em; white-space:nowrap }
.ma-arr { font-family:var(--fh); font-size:20px; color:var(--warm); transition:color .15s,transform .15s; flex-shrink:0 }
.ma-row:hover .ma-arr { color:var(--dark); transform:translateX(4px) }

/* =====================================================
   FOOTER
   ===================================================== */
footer { background:var(--dark-2); padding:clamp(48px,6vw,80px) 0 0 }
.foot-main {
  display:grid; grid-template-columns:2.5fr 1fr 1fr; gap:48px;
  padding-bottom:clamp(40px,5vw,64px);
}
.foot-brand p {
  font-family:var(--fb); font-size:14px; color:#bbbbbb;
  line-height:1.75; margin:16px 0 24px; max-width:260px; font-weight:300;
}
.foot-contacts { display:flex; flex-direction:column; gap:8px }
.fc { display:flex; align-items:center; gap:8px; font-family:var(--fb); font-size:14px; color:#bbbbbb; transition:color .15s }
.fc:hover { color:rgba(255,255,255,.9) }
.fc svg { opacity:.45; flex-shrink:0 }
.foot-h { font-family:var(--fb); font-size:14px; font-weight:500; letter-spacing:.04em; text-transform:uppercase; color:#fff; margin-bottom:18px }
.foot-links { list-style:none; display:flex; flex-direction:column; gap:10px }
.foot-links a { font-family:var(--fb); font-size:15px; color:#bbbbbb; transition:color .15s; font-weight:300 }
.foot-links a:hover { color:rgba(255,255,255,.95) }

/* ── SOCIAL ICONS ───────────────── */
.foot-social {
  display:flex; align-items:center; gap:16px; flex-wrap:wrap;
}
.foot-social a {
  display:flex; align-items:center; justify-content:center;
  width:42px; height:42px; border-radius:50%;
  border:2px solid #ffffff59;
  color:#fff; transition:all .2s;
}
.foot-social a:hover {
  border-color:rgba(255,255,255,.7);
  background:rgba(255,255,255,.08);
}
.foot-social a svg { width:18px; height:18px }
.foot-social-desktop { margin-top:28px }
.foot-social-mobile { display:none; padding-bottom:0 }

/* ── FOOTER BOTTOM ──────────────── */
.foot-bot {
  display:flex; justify-content:space-between; align-items:center;
  padding:20px 0; flex-wrap:wrap; gap:16px;
  border-top:1px solid rgba(255,255,255,.06);
}
.foot-copy { font-family:var(--fb); font-size:12px; color:rgba(255,255,255,.25) }
.foot-legal { display:flex; gap:20px }
.foot-legal a { font-family:var(--fb); font-size:12px; color:rgba(255,255,255,.25); transition:color .15s }
.foot-legal a:hover { color:rgba(255,255,255,.6) }

/* =====================================================
   MOBILE STICKY CTA BAR
   ===================================================== */
.sticky-cta {
  display:none; position:fixed; bottom:0; left:0; right:0; z-index:800;
  background:var(--dark); border-top:1px solid rgba(255,255,255,.08);
  padding:14px 48px 14px var(--pad);
  flex-direction:row; align-items:center; justify-content:space-between; gap:12px;
  transform:translateY(100%); transition:transform .3s ease;
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
}
.sticky-cta.visible { transform:translateY(0); display:flex }
.sticky-cta-close {
  position:absolute; top:0; bottom:0; right:0;
  width:48px; height:100%; 
  display:flex; align-items:center; justify-content:center;
  font-size:22px; color:rgba(255,255,255,.4);
  cursor:pointer; background:none; border:none; z-index:10; transition:color .15s;
}
.sticky-cta-close:hover { color:#fff }
.sticky-cta-text { font-family:var(--fb); font-size:13px; font-weight:400; color:rgba(249,241,220,.65); line-height:1.35; flex:1 }
.sticky-cta-text strong { color:var(--cream); font-weight:500 }
.sticky-cta-btns { display:flex; align-items:center; gap:8px; flex-shrink:0 }
@media (min-width:769px) { .sticky-cta { display:none !important } }

/* Prevent body scroll when mobile menu is open */
body.no-scroll { overflow:hidden; height:100vh }

/* =====================================================
   RESPONSIVE
   ===================================================== */
@media (max-width:1100px) {
  .dd-inner { grid-template-columns:repeat(2,1fr) }
  .nav-links, .nav-tel { display:none }
  .nav-r .btn.btn-dark { display:none }
  .hbg { display:flex }
  .mob-push-menu { display:block }
}
@media (max-width:1024px) {
  .k-grid { display:flex; flex-direction:column }
  .k-grid > div:nth-child(2) { order:-1; margin-bottom:40px }
  .k-grid > div { width:100% }
  .form-card { width:100% }
  .svc-header { grid-template-columns:1fr }
  .method-grid,.two-col,.faq-grid,.k-grid { grid-template-columns:1fr; gap:48px }
  .stat-bar { grid-template-columns:1fr 1fr }
  .proof { grid-template-columns:1fr 1fr }
  .testi-strip { grid-template-columns:1fr }
  .testi-cell { border-right:none; border-bottom:1px solid var(--rc) }
  .testi-cell:last-child { border-bottom:none }
  .foot-main { grid-template-columns:1fr 1fr; gap:32px }
  .stats-panel { grid-template-columns:1fr 1fr }
  .faq-l { position:static }
  .case-row { grid-template-columns:1fr; min-height:auto }
  .case-row.flip { direction:ltr }
  .case-img { min-height:280px }
  .case-img-inner { position:relative; height:280px; inset:unset }
  .feat-article { grid-template-columns:1fr }
  .fa-img { min-height:260px }
  .fa-img-inner { position:relative; height:260px; inset:unset }
  .article-grid { grid-template-columns:1fr; gap:40px }
  .article-sidebar { position:static }
  .article-row { grid-template-columns:1fr auto 20px }
}

/* MOBILE MENU OVERLAY — hidden by default */
.mob-push-menu { display:none }

@media (max-width:768px) {
  .hero-row { flex-direction:column; align-items:flex-start }
  .proof { grid-template-columns:1fr 1fr }
  .svc-row { grid-template-columns:40px 1fr 20px }
  .svc-name { white-space:normal }
  .svc-brief { display:none }
  .why-nums { grid-template-columns:1fr 1fr }
  .team-row { grid-template-columns:40px 1fr }
  .t-bio { display:none }
  .val-row { grid-template-columns:1fr }
  .cta-btns { flex-direction:column; align-items:stretch }
  .btn-cta-primary { width:100%; justify-content:center; text-align:center }
  .foot-main { grid-template-columns:1fr 1fr; gap:32px 24px }
  .foot-brand { grid-column:1 / -1 }
  .foot-social-desktop { display:none }
  .foot-social-mobile { display:flex; padding:0; margin:32px 0 0; gap:18px }
  .foot-bot { flex-direction:column; align-items:flex-start; gap:10px; margin-top:28px }
  .fg-row { grid-template-columns:1fr }
  .stat-bar { grid-template-columns:1fr 1fr }
  .case-metrics { flex-wrap:wrap; gap:16px }
  .dd-inner { grid-template-columns:1fr }
  .dd-panel { overflow-y:auto; max-height:70vh }
  .article-row { grid-template-columns:1fr 20px; gap:12px }
  .ar-meta { display:none }
  .feat-article { grid-template-columns:1fr }
  .trust-badges { gap:7px }

  /* FORM MOBILE */
  .form-card { padding:28px 20px; margin:0; width:100%; box-sizing:border-box; border-radius:10px }

  /* NAV: sticky on mobile, switches to fixed when menu is open */
  #nav {
    position:sticky !important; top:0; z-index:999;
    height:auto !important;
    background:var(--cream) !important;
    border-bottom:1px solid var(--rc);
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    flex-direction:column;
  }
  #nav.menu-open {
    position:fixed !important; left:0; right:0;
  }
  body.no-scroll .page-wrap { padding-top:var(--nav-h) }
  .nav-in { height:var(--nav-h) }
  .page-wrap { padding-top:0 }

  /* MOBILE MENU */
  .mob-push-menu {
    display:block; position:fixed;
    top:var(--nav-h); left:0; right:0; bottom:0; 
    background:var(--cream); z-index:998;
    overflow-y:auto; max-height:0;
    transition:max-height .4s ease;
  }
  .mob-push-menu.is-open { max-height:calc(100vh - var(--nav-h)) }
  .mob-nav-links { list-style:none; display:flex; flex-direction:column; padding:0 var(--pad) }
  .mob-nav-links > li { border-bottom:1px solid rgba(34,34,34,.1) }
  .mob-nav-links a, .mob-acc-trigger { 
    display:flex; align-items:center; justify-content:space-between; 
    width:100%; font-family:var(--fh); font-size:clamp(26px,6vw,34px); 
    color:var(--dark); padding:20px 0; text-decoration:none; font-weight:400; 
    letter-spacing:-.02em; background:none; border:none; text-align:left; 
    cursor:pointer; transition:color .2s; 
  }
  .mob-nav-links a:hover, .mob-acc-trigger:hover { color:var(--sienna) }
  .mob-nav-links a.on { color:var(--sienna) }
  .mob-acc-chev { width:24px; height:24px; transition:transform .35s ease; color:var(--warm-2) }
  .mob-accordion.open .mob-acc-chev { transform:rotate(180deg); color:var(--sienna) }
  .mob-acc-content { list-style:none; max-height:0; overflow:hidden; transition:max-height .4s cubic-bezier(.4,0,.2,1); padding-left:20px }
  .mob-acc-content li { border-bottom:1px solid rgba(34,34,34,.06) }
  .mob-acc-content li:last-child { border-bottom:none }
  .mob-acc-content a { font-family:var(--fb); font-size:16px; font-weight:300; padding:12px 0; color:var(--text-2); justify-content:flex-start; gap:12px }
  .mob-acc-content a .arr { font-family:monospace; font-weight:500; color:var(--sienna); opacity:.7; font-size:14px }
  .mob-cat-head { font-family:var(--fb); font-size:10px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--warm); padding:24px 0 8px 0 !important; border-bottom:none !important }
  .mob-foot { margin-top:10px; padding:24px var(--pad) 48px; display:flex; flex-direction:column; gap:14px }
  .mob-foot a { font-family:var(--fb); font-size:14px; color:var(--text-2); display:flex; align-items:center; gap:10px; transition:color .15s; text-decoration:none }
  .mob-foot a:hover { color:var(--dark) }
  .mob-foot a svg { color:var(--warm-2); flex-shrink:0 }

  /* HAMBURGER ANIMATION */
  .hbg span { transition:all .35s ease; transform-origin:center }
  .hbg.open span:nth-child(1) { transform:translateY(6.5px) rotate(45deg) }
  .hbg.open span:nth-child(2) { opacity:0 }
  .hbg.open span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg) }

}

/* ── LCP Performance: reduce hero complexity on mobile ── */
@media (max-width:768px) {
  .hero { padding:clamp(48px,8vw,80px) 0 clamp(40px,5vw,56px) }
  .hero-h1 { font-size:clamp(44px,11vw,64px) }
  .rv { transition-duration:.35s }
  .rv.d1 { transition-delay:.04s }
  .rv.d2 { transition-delay:.08s }
  .rv.d3 { transition-delay:.12s }
}

/* ── Content visibility for off-screen sections ── */
.method-section,
.faq-bg,
.more-articles {
  content-visibility:auto;
  contain-intrinsic-size:auto 600px;
}

/* =====================================================
   FORM ERROR STATE
   ===================================================== */
.form-error {
  background:rgba(218,87,32,.07);
  border:1px solid rgba(218,87,32,.25);
  border-radius:6px;
  padding:18px 22px;
  margin-top:12px;
}
.form-error p {
  font-family:var(--fb);
  font-size:14px;
  color:var(--sienna);
  line-height:1.65;
  font-weight:400;
  margin:0;
}
.form-error p a {
  color:var(--sienna);
  text-decoration:underline;
  text-underline-offset:2px;
}
.form-error p a:hover { opacity:.75 }

/* =====================================================
   ACCESSIBILITY — REDUCED MOTION
   Respects OS-level "reduce motion" preference.
   Disables all scroll-reveal transitions and animations.
   ===================================================== */
@media (prefers-reduced-motion: reduce) {
  .rv {
    opacity:1;
    transform:none;
    transition:none;
  }
  .rv.on {
    opacity:1;
    transform:none;
  }
  * {
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}

/* =====================================================
   480px BREAKPOINT — Small phones (320–480px)
   Prevents overflow and cramping on narrow viewports.
   ===================================================== */
@media (max-width:480px) {
  /* Proof bar: 4-col → 2-col at 768px → 1-col at 480px */
  .proof { grid-template-columns:1fr }
  .proof-cell { border-right:none; border-bottom:1px solid var(--rc) }
  .proof-cell:last-child { border-bottom:none }

  /* Stat bar: 2-col → 1-col to avoid overflow */
  .stat-bar { grid-template-columns:1fr }

  /* Why-nums panel: keep 2-col but reduce padding */
  .why-nums { grid-template-columns:1fr 1fr }

  /* Stats panel in method section */
  .stats-panel { grid-template-columns:1fr }

  /* Form grid back to single column */
  .fg-row { grid-template-columns:1fr }

  /* K-grid (contact) goes full vertical */
  .k-grid { grid-template-columns:1fr; gap:36px }

  /* Prevent long words overflowing headings */
  h1, h2, h3, .h-hero, .h-xl, .h-lg { overflow-wrap:break-word; word-break:break-word }
}

/* =====================================================
   PRINT STYLES
   Removes chrome, dark backgrounds, sticky elements.
   ===================================================== */
@media print {
  #nav,
  .sticky-cta,
  .cta-strip,
  .hbg,
  .mob-push-menu,
  .dd-panel,
  .dd-overlay { display:none !important }

  body { background:#fff; color:#000; font-size:12pt }
  .page-wrap { padding-top:0 !important }

  a { color:#000; text-decoration:underline }
  a[href^="http"]::after { content:" (" attr(href) ")"; font-size:9pt; color:#555 }

  footer { background:#fff; color:#000; padding:16pt 0 0 }
  footer .foot-brand p,
  footer .fc,
  footer .foot-links a,
  footer .foot-copy,
  footer .foot-legal a { color:#444 }
  footer .foot-social { display:none }

  .method-section { background:#f5f5f5 }
  .method-h2, .method-p, .step-t, .step-d, .sp-val, .sp-lbl { color:#000 }

  .rv { opacity:1 !important; transform:none !important }
}

/* =====================================================
   COOKIE CONSENT STRIP
   ===================================================== */
.cookie-strip {
  position:fixed; bottom:0; left:0; right:0; z-index:9999;
  background:var(--dark); color:rgba(255,255,255,.85);
  font-family:var(--fb); font-size:13px; font-weight:300;
  display:flex; align-items:center; justify-content:center; gap:16px;
  padding:10px var(--pad);
  transform:translateY(100%);
  transition:transform .3s ease;
}
.cookie-strip.visible { transform:translateY(0) }
.cookie-strip p { margin:0; line-height:1.5 }
.cookie-strip a { color:var(--cream); text-decoration:underline; text-underline-offset:2px }
.cookie-strip button {
  background:var(--cream); color:var(--dark);
  border:none; border-radius:6px;
  font-family:var(--fb); font-size:12px; font-weight:500;
  padding:6px 18px; cursor:pointer; white-space:nowrap;
  transition:opacity .15s;
}
.cookie-strip button:hover { opacity:.85 }