/*
Theme Name: Hide ORM
Theme URI: https://hide.co.il
Author: Mendi Soudry
Description: Boutique digital reputation-management (ORM) theme — Intelligence White edition. Hebrew RTL.
Version: 3.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: hide-orm
*/

/* ============================================================
   Design Tokens — Light (default) · Hide Digital v4
   ============================================================ */
:root {
  --bg:        #F4F1EA;
  --bg-alt:    #ECE8DF;
  --bg-dark:   #101310;
  --surface:   #FBF9F5;
  --border:    rgba(23,26,23,.12);
  --border-2:  rgba(23,26,23,.06);

  --ink:       #171A17;
  --ink-2:     #262925;
  --text:      #262925;
  --muted:     #6C6F66;

  --accent:    #1E4837;
  --accent-h:  #164030;
  --accent-bg: rgba(30,72,55,.08);

  --gold:      #A8894A;
  --gold-line: rgba(168,137,74,.22);

  --danger:     #8A2B2B;
  --danger-bg:  rgba(138,43,43,.08);
  --success:    var(--accent);
  --success-bg: var(--accent-bg);
  --warning:    var(--gold);
  --warning-bg: rgba(168,137,74,.08);

  --btn-bg:    #FFFFFF;
  --btn-ink:   #171A17;

  --sans:   'Assistant', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mono:   'IBM Plex Mono', 'SFMono-Regular', Consolas, monospace;
  --serif:  'Rubik', Georgia, serif;

  --wrap:      1200px;
  --read:      860px;
  --card-r:    12px;
  --radius-sm: 4px;
  --radius-lg: 16px;
  --section-v: 100px;

  /* Figma design token aliases */
  --paper:      #F4F1EA;
  --paper2:     #ECE8DF;
  --card:       #FBF9F5;
  --txt:        #262925;
  --line:       rgba(23,26,23,.14);
  --line-soft:  rgba(23,26,23,.08);
  --on-dark:    #EAE7DF;
  --muted-dark: #9EA096;
  --line-dark:  rgba(234,231,223,.14);
}


/* ── Skip link ──────────────────────────────────────────────── */
.skip-link {
  position: absolute; inset-inline-start: -9999px; top: auto;
  width: 1px; height: 1px; overflow: hidden; z-index: 99999; text-decoration: none;
}
.skip-link:focus {
  position: fixed; inset-inline-start: 0; top: 0;
  width: auto; height: auto; padding: 14px 28px;
  background: var(--accent); color: #fff;
  font: 600 0.9375rem/1 var(--sans); border-radius: 0 0 var(--card-r) 0; outline: none;
}

/* ── Reset basics ───────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; overscroll-behavior-y: none; }
html { background: #171A17; }
body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--sans);
  font-weight: 400;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: inherit; }
img { max-width: 100%; height: auto; display: block; }

/* ── Containers ─────────────────────────────────────────────── */
.wrap { max-width: var(--wrap); margin: 0 auto; }
.read { max-width: var(--read); margin: 0 auto; }

/* ── Scroll reveal ──────────────────────────────────────────── */
.reveal {
  opacity: 0; filter: blur(5px); transform: translateY(12px);
  transition: opacity .6s ease, filter .6s ease, transform .6s ease;
  transition-delay: calc(var(--ri, 0) * .07s);
}
.reveal.in-view { opacity: 1; filter: blur(0); transform: none; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; filter: none; transform: none; transition: none; }
}

/* ── Animations ─────────────────────────────────────────────── */
@keyframes hf-up   { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes hf-fade { from { opacity: 0; } to { opacity: 1; } }
.hf-up   { animation: hf-up   .55s cubic-bezier(.16,1,.3,1) .1s both; }
.hf-fade { animation: hf-fade .5s ease .05s both; }

@keyframes drift {
  from { transform: translateY(-100vh); }
  to   { transform: translateY(100vh); }
}
@keyframes glow-pulse {
  0%,100% { opacity: .35; transform: scale(1); }
  50%      { opacity: .7;  transform: scale(1.18); }
}
@keyframes blink {
  0%,100% { opacity: 1; }
  50%      { opacity: 0; }
}
.blink-cursor { animation: blink 1.1s step-end infinite; }
.status-dot {
  display: inline-block; width: 7px; height: 7px; border-radius: 50%;
  background: var(--accent); animation: blink 2.2s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  .blink-cursor, .status-dot, .hd-bar, .hero-glow { animation: none !important; }
}


/* ── Logo image ─────────────────────────────────────────────── */
.brand-logo-img {
  width: 42px; height: 42px; object-fit: contain; flex: none;
  border-radius: 4px;
}
.footer-logo-img {
  width: 72px; height: 72px; object-fit: contain;
  border-radius: 4px; margin-block-end: 10px;
}

/* ============================================================
   Navigation — always-dark
   ============================================================ */
.site-nav {
  position: sticky; top: 0; z-index: 1000;
  background: rgba(23,26,23,.92);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-block-end: 1px solid rgba(234,231,223,.14);
  display: flex; align-items: center; justify-content: space-between;
  min-height: 72px;
  padding-inline: max(40px, calc((100% - 1200px) / 2 + 40px));
}
/* Stick right below the WP admin toolbar instead of leaving a gap when scrolling logged in. */
.admin-bar .site-nav { top: 32px; }
@media screen and (max-width: 782px) {
  .admin-bar .site-nav { top: 46px; }
}

/* Brand */
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; }
.brand-mark {
  width:38px; height:38px; background:#EAE7DF; color:var(--gold);
  display:grid; place-items:center; font:700 1.375rem/1 var(--serif);
  border-radius:2px; flex:none;
}
.brand-text { display:flex; flex-direction:column; gap:3px; }
.brand .word, .brand-name { font:700 0.8125rem/1.2 var(--mono); color:#EAE7DF; letter-spacing:.01em; }
.nav-tagline, .brand-tagline { font:400 0.625rem/1 var(--mono); color:rgba(234,231,223,.5); letter-spacing:.06em; }

/* Nav links */
.nav-links { display:flex; align-items:center; gap:28px; }
.nav-links a {
  font:400 0.875rem/1 var(--sans); color:rgba(234,231,223,.8);
  text-decoration:none; transition:color .2s; letter-spacing:.01em;
}
.nav-links a:hover, .nav-links .current-menu-item > a { color:#EAE7DF; }
.nav-links a.is-active { color:var(--gold); }

/* Nav CTA */
.nav-cta {
  display:inline-flex; align-items:center; padding:10px 20px;
  background:#EAE7DF; color:#171A17; font:600 0.8125rem/1 var(--sans);
  border-radius:2px; text-decoration:none; flex:none;
  transition:opacity .2s; white-space:nowrap;
}
.nav-cta, .nav-links a.nav-cta { color:#171A17; }
.nav-cta:hover, .nav-links a.nav-cta:hover { opacity:.88; color:#171A17; }

/* Lang switcher — native <details> */
.lang-switcher { position:relative; }
.lang-switcher > summary {
  list-style:none; cursor:pointer; display:flex; align-items:center; gap:7px;
  padding:7px 10px; border:1px solid rgba(234,231,223,.22); border-radius:2px;
  color:rgba(234,231,223,.75); font:400 0.8125rem/1 var(--sans);
  transition:border-color .2s, color .2s;
}
.lang-switcher > summary::-webkit-details-marker { display:none; }
.lang-switcher > summary:hover { border-color:rgba(234,231,223,.5); color:#EAE7DF; }
.lang-drop {
  position:absolute; top:calc(100% + 10px); inset-inline-end:0;
  background:#171A17; border:1px solid rgba(234,231,223,.14);
  border-radius:3px; min-width:198px; max-height:72vh; overflow-y:auto;
  z-index:200; box-shadow:0 20px 44px rgba(0,0,0,.45);
  display:flex; flex-direction:column; padding:6px;
}
.lang-drop a {
  display:flex; align-items:center; gap:12px; padding:9px 12px;
  color:#EAE7DF; text-decoration:none; font:400 0.875rem/1 var(--sans);
  border-radius:2px; transition:background .15s;
}
.lang-drop a:hover { background:rgba(234,231,223,.08); }
.lang-drop a[aria-current="true"] { background:rgba(234,231,223,.12); font-weight:600; }

/* Hamburger */
.nav-toggle {
  display:none; flex-direction:column; justify-content:center; align-items:center; gap:5px;
  width:40px; height:40px; background:transparent;
  border:1px solid rgba(234,231,223,.22); border-radius:2px;
  cursor:pointer; padding:0; flex:none; transition:border-color .2s;
}
.nav-toggle:hover { border-color:rgba(234,231,223,.5); }
.nav-toggle-bar { display:block; width:20px; height:1.5px; background:#EAE7DF; border-radius:1px; }

/* ============================================================
   Buttons
   ============================================================ */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--btn-bg);
  color: var(--btn-ink);
  font: 600 0.75rem/1 var(--sans);
  letter-spacing: .04em;
  padding: 13px 26px;
  border-radius: var(--radius-sm);
  border: 1.5px solid var(--border);
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  transition: background .2s, border-color .2s, color .2s, transform .15s, box-shadow .2s;
}
.btn:hover { border-color: var(--gold); color: var(--gold); transform: translateY(-1px); }
.btn:active { transform: none; }
.btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

.btn--sm  { font-size: 0.6875rem; padding: 9px 18px; }
.btn--md  { font-size: 0.8125rem; padding: 13px 24px; }
.btn--lg  { font-size: 0.9375rem; padding: 16px 34px; }

.btn--primary {
  background: var(--accent);
  color: #FFFFFF;
  border-color: var(--accent);
}
.btn--primary:hover {
  background: var(--accent-h); border-color: var(--accent-h); color: #FFFFFF;
  box-shadow: 0 8px 24px rgba(30,72,55,.28); transform: translateY(-1px);
}

.btn--ghost {
  background: transparent;
  border-color: var(--border);
  color: var(--text);
}
.btn--ghost:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-bg); }

.btn--outline {
  background: transparent;
  border: 1.5px solid var(--ink);
  color: var(--ink);
}
.btn--outline:hover {
  background: var(--accent-bg);
  border-color: var(--accent);
  color: var(--accent);
  transform: translateY(-1px);
}

.btn--solid {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}
.btn--solid:hover { background: var(--accent-h); border-color: var(--accent-h); }

.btn-submit {
  display: block; width: 100%;
  background: var(--accent); color: #FFFFFF;
  font: 600 0.875rem/1 var(--sans); letter-spacing: .03em;
  padding: 18px 28px; border-radius: var(--radius-sm); border: none;
  cursor: pointer; transition: background .2s, box-shadow .2s;
}
.btn-submit:hover { background: var(--accent-h); box-shadow: 0 6px 20px rgba(30,72,55,.28); }

/* ============================================================
   HOME HERO — new Figma 2-col split layout
   ============================================================ */
.home-hero {
  padding: 100px max(40px, calc((100% - var(--wrap)) / 2 + 40px)) 80px;
  border-block-end: 1px solid var(--border);
}
.home-hero-inner {
  display: grid; grid-template-columns: 1.05fr .95fr; gap: 60px; align-items: center;
  max-width: var(--wrap); margin: 0 auto;
}
.home-hero-copy { display: flex; flex-direction: column; }
.home-hero-eyebrow {
  display: flex; align-items: center; gap: 12px;
  font: 600 0.6875rem/1 var(--mono); letter-spacing: .16em; text-transform: uppercase;
  color: var(--accent); margin: 0 0 20px;
}
.eyebrow-bar { display: block; width: 24px; height: 1px; background: var(--accent); flex: none; }
.home-hero-h1 {
  font: 700 clamp(2.25rem, 5vw, 3.5rem)/1.12 var(--serif);
  color: var(--ink); letter-spacing: -.02em; margin: 0 0 24px;
}
.hero-em { font-style: italic; text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; color: var(--accent); }
.home-hero-lead {
  font: 400 1.0625rem/1.8 var(--sans); color: var(--text);
  max-width: 520px; margin: 0 0 32px;
}
.home-hero-actions { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; margin-block-end: 20px; }
.wa-dot-inline { width: 8px; height: 8px; background: #25D366; border-radius: 50%; flex: none; display: inline-block; }
.btn-text-link { font: 500 0.875rem/1 var(--sans); color: var(--muted); text-decoration: none; transition: color .15s; }
.btn-text-link:hover { color: var(--accent); }
.home-hero-mono { font: 400 0.75rem/1 var(--mono); color: var(--muted); letter-spacing: .04em; margin: 0; }

/* SERP Dossier — new */
.home-hero-dossier { display: flex; justify-content: flex-end; }
.serp-dossier {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: 4px; padding: 20px 24px 16px;
  box-shadow: 0 20px 44px rgba(23,26,23,.08), 0 4px 12px rgba(23,26,23,.04);
  width: 100%; max-width: 420px;
}
.serp-dossier-header { margin-block-end: 14px; }
.serp-dossier-label { font: 600 0.625rem/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.serp-dossier-row {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 10px 0; border-block-end: 1px solid var(--border-2);
}
.serp-dossier-row:last-of-type { border: none; }
.serp-rank { font: 600 0.6875rem/1 var(--mono); color: var(--muted); min-width: 16px; padding-block-start: 2px; }
.serp-info { display: flex; flex-direction: column; gap: 3px; }
.serp-title { font: 500 0.8125rem/1.4 var(--sans); color: var(--ink); }
.serp-url   { font: 400 0.6875rem/1 var(--mono); color: var(--muted); }
.serp-dossier-row--negative .serp-title { color: var(--danger); text-decoration: line-through; text-decoration-color: rgba(138,43,43,.4); }
.serp-dossier-row--positive .serp-title { color: var(--accent); }
.serp-dossier-divider {
  padding: 12px 0; text-align: center;
  font: 600 0.6875rem/1 var(--mono); letter-spacing: .08em;
  color: var(--gold); border-block-end: 1px solid var(--border-2);
}
.serp-dossier-status {
  display: flex; align-items: center; gap: 8px;
  margin-block-start: 14px; font: 400 0.7188rem/1 var(--mono); color: var(--muted);
}

/* Trust band */
.trust-band { border-block: 1px solid var(--border); background: var(--surface); }
.trust-band-inner {
  max-width: var(--wrap); margin: 0 auto;
  padding: 28px clamp(24px,4vw,40px);
  display: flex; align-items: center; gap: 0;
}
.trust-stat { flex: 1; text-align: center; padding: 8px 16px; }
.trust-num { display: block; font: 700 clamp(1.375rem, 2.8vw, 2rem)/1 var(--serif); color: var(--ink); margin-block-end: 6px; }
.trust-label { display: block; font: 400 0.7813rem/1.4 var(--sans); color: var(--muted); }
.trust-div { width: 1px; height: 48px; background: var(--border); flex: none; }

/* SERP Dossier */
.home-hero-dossier { display: flex; justify-content: flex-end; }
.serp-dossier {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--card-r); padding: 20px 24px 16px;
  box-shadow: 0 20px 44px rgba(23,26,23,.08), 0 4px 12px rgba(23,26,23,.04);
  width: 100%; max-width: 420px; font-family: var(--sans);
}
.serp-header { margin-block-end: 14px; }
.serp-label { font: 600 0.625rem/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.serp-item {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 10px 0; border-block-end: 1px solid var(--border-2);
}
.serp-item:last-of-type { border: none; }
.serp-rank {
  font: 600 0.6875rem/1 var(--mono); color: var(--muted);
  min-width: 16px; padding-block-start: 2px;
}
.serp-content { display: flex; flex-direction: column; gap: 3px; }
.serp-title { font: 500 0.8125rem/1.4 var(--sans); color: var(--ink); }
.serp-url   { font: 400 0.6875rem/1 var(--mono); color: var(--muted); }
.serp-item--negative .serp-title { color: var(--danger); text-decoration: line-through; text-decoration-color: rgba(138,43,43,.4); }
.serp-item--positive .serp-title { color: var(--accent); }
.serp-divider {
  padding: 12px 0; text-align: center;
  font: 600 0.6875rem/1 var(--mono); letter-spacing: .08em;
  color: var(--gold); border-block-end: 1px solid var(--border-2);
}
.serp-status {
  display: flex; align-items: center; gap: 7px; padding-block-start: 12px;
  font: 500 0.6875rem/1 var(--mono); color: var(--muted); letter-spacing: .06em;
}

/* ============================================================
   Hero Media (legacy — keep for other pages)
   ============================================================ */
.hero-media {
  max-width: var(--wrap); margin: 0 auto; padding: 0 40px 64px;
}
.img-slot {
  position: relative; width: 100%; display: flex; align-items: center;
  justify-content: center; overflow: hidden;
  background: var(--bg-alt); border: 1px solid var(--border);
}
.img-slot::after {
  content: ''; position: absolute; inset: 0;
  background-image: linear-gradient(rgba(0,0,0,.025) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(0,0,0,.025) 1px, transparent 1px);
  background-size: 32px 32px; pointer-events: none;
}
.img-slot .label {
  position: relative; z-index: 1;
  font: 500 0.75rem/1.4 var(--mono); letter-spacing: .06em; color: var(--muted);
  padding: 12px 18px; text-align: center;
}
.img-slot.r-rounded { border-radius: var(--radius-lg); }
.img-slot.r-soft    { border-radius: 8px; }
.img-slot img { width: 100%; height: 100%; object-fit: cover; display: block; }

.img-slot--mock {
  border-radius: var(--radius-lg);
  box-shadow: 0 24px 64px rgba(0,0,0,.07), 0 4px 16px rgba(0,0,0,.04);
  border: 1px solid var(--border);
  overflow: hidden;
}
.img-slot--mock::after { display: none; }

/* ============================================================
   Trust Stats — accent band
   ============================================================ */
.trust-stats {
  background: var(--accent);
}
.trust-stats .inner {
  max-width: var(--wrap); margin: 0 auto; padding: 40px 40px;
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
}
.trust-stats .stat {
  flex: 1; min-width: 160px; text-align: center; padding: 10px 28px;
}
.trust-stats .stat .num {
  display: block; font: 700 clamp(1.5rem,3vw,2rem)/1 var(--serif); color: #FFFFFF; margin-block-end: 8px;
}
.trust-stats .stat .label {
  display: block; font: 400 0.8125rem/1.5 var(--sans); color: rgba(255,255,255,.68);
}
.trust-stats .stat-div { width: 1px; height: 40px; background: rgba(255,255,255,.18); flex: none; }

/* ============================================================
   Process Section — 3-col grid layout
   ============================================================ */
.process-section {
  border-block-start: 1px solid var(--border);
  border-block-end: 1px solid var(--border);
  padding: var(--section-v) max(40px, calc((100% - var(--wrap)) / 2 + 40px));
}
.process-inner { max-width:var(--wrap); margin:0 auto; }
.process-header { margin-block-end:48px; }
.process-eyebrow { font:600 0.6875rem/1 var(--mono); letter-spacing:.16em; text-transform:uppercase; color:var(--accent); margin:0 0 14px; }
.process-title { font:700 clamp(1.625rem,3.2vw,2.25rem)/1.2 var(--serif); color:var(--ink); margin:0; }
.process-steps { display:flex; flex-direction:column; }
.process-step {
  display:grid; grid-template-columns:110px 300px 1fr; gap:32px;
  align-items:baseline; padding-block:30px;
  border-block-end:1px solid var(--border);
}
.process-step:first-child { border-block-start:1px solid var(--border); }
.step-num { font:500 0.8125rem/1 var(--mono); color:var(--muted); letter-spacing:.14em; }
.step-body { display:contents; }
.step-title { font:600 1.3125rem/1.3 var(--serif); color:var(--ink); }
.step-desc { font:400 0.9688rem/1.75 var(--sans); color:var(--muted); margin:0; }

/* ============================================================
   Section & Group Blocks
   ============================================================ */
.section {
  max-width: var(--wrap); margin: 0 auto; padding: var(--section-v) 40px;
}
.section--tight { padding-block: 70px; }
.section .kicker {
  font: 600 0.6875rem/1 var(--mono); letter-spacing: .16em; text-transform: uppercase;
  color: var(--accent); margin-block-end: 18px;
}
.section h2.big {
  font: 700 clamp(1.75rem,3.5vw,2.625rem)/1.15 var(--serif);
  color: var(--ink); letter-spacing: -.01em; margin: 0 0 20px;
}
.section .sub { font: 400 1.125rem/1.75 var(--sans); color: var(--text); max-width: 620px; margin: 0; }

.group-block { margin-block-end: 64px; }
.group-block:last-child { margin-block-end: 0; }
.group-block .head { margin-block-end: 28px; }
.group-block .head .label {
  font: 700 1.375rem/1.25 var(--serif); color: var(--ink); margin: 0 0 6px;
}
.group-block .head .sub { font: 400 0.9375rem/1.6 var(--sans); color: var(--text); margin: 0; }

/* ============================================================
   Card Grid
   ============================================================ */
.card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

.card {
  display: flex; flex-direction: column;
  padding: 28px 24px 24px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-block-start: 3px solid var(--accent);
  border-radius: var(--card-r);
  text-decoration: none;
  position: relative; overflow: hidden;
  transition: transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s, border-color .25s;
}
.card::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(115deg, transparent 25%, rgba(30,72,55,.05) 50%, transparent 75%);
  background-size: 250% 100%; background-position: 250% 0;
  transition: background-position .5s ease;
  border-radius: inherit; pointer-events: none;
}
.card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 48px rgba(23,26,23,.09), 0 4px 12px rgba(23,26,23,.04);
  border-block-start-color: var(--gold);
}
.card:hover::after { background-position: -80% 0; }
.card:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

.card .eyebrow-tag {
  font: 600 0.625rem/1 var(--mono); letter-spacing: .12em; text-transform: uppercase;
  color: var(--accent); margin-block-end: 12px;
}
.card .title {
  font: 600 1.1875rem/1.35 var(--serif); color: var(--ink); margin-block-end: 12px;
}
.card .lead {
  font: 400 0.875rem/1.65 var(--sans); color: var(--text); margin: 0 0 16px; flex: 1;
}
.card .more {
  font: 600 0.6875rem/1 var(--mono); letter-spacing: .08em; text-transform: uppercase;
  color: var(--accent); margin-block-start: auto;
  display: flex; align-items: center; gap: 6px;
}
.card .more { transition: transform .2s ease; }
.card:hover .more { transform: translateX(-3px); }

.guide-badge, .case-badge {
  display: inline-block; font: 600 0.625rem/1 var(--mono); letter-spacing: .12em;
  border-radius: 3px; padding: 4px 8px; margin-block-end: 12px;
}
.guide-badge { color: var(--accent); background: var(--accent-bg); border: 1px solid rgba(30,72,55,.20); }
.case-badge  { color: #e8925a; background: rgba(232,146,90,.08); border: 1px solid rgba(232,146,90,.25); }

/* ============================================================
   FAQ — native details/summary
   ============================================================ */
.faq-section { padding:var(--section-v) max(40px, calc((100% - var(--wrap)) / 2 + 40px)); }
.faq-inner { max-width:var(--read); margin:0 auto; }
.faq-section-title,
.faq-title { font:700 clamp(1.625rem,3vw,2.25rem)/1.2 var(--serif); color:var(--ink); margin:0 0 40px; }
.faq-list { margin:0; padding:0; }
.faq-list details { border-block-end:1px solid var(--border); }
.faq-list details:first-of-type { border-block-start:1px solid var(--border); }
.faq-list summary {
  cursor:pointer; list-style:none; display:flex; justify-content:space-between;
  align-items:center; gap:20px; padding-block:22px;
  font:600 1.0625rem/1.45 var(--serif); color:var(--text);
}
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary:hover { color:var(--accent); }
.faq-x { font-family:var(--mono); font-size:1.375rem; line-height:1; color:var(--muted); flex:none; transition:transform .25s ease; }
details[open] .faq-x { transform:rotate(45deg); }
details[open] summary { color:var(--accent); }
.faq-answer { font:400 0.9688rem/1.8 var(--sans); color:var(--muted); margin:0; padding-block-end:24px; max-width:64ch; }

/* Service page FAQ — also uses details/summary */
.c-faq { margin:44px 0; }
.c-faq-title { font:700 1.375rem/1.3 var(--serif); color:var(--ink); margin:0 0 22px; }
.c-faq details { border-block-start:1px solid var(--border); }
.c-faq details:last-child { border-block-end:1px solid var(--border); }
.c-faq summary {
  cursor:pointer; list-style:none; display:flex; justify-content:space-between;
  align-items:center; gap:16px; padding-block:20px;
  font:600 1rem/1.45 var(--serif); color:var(--text);
}
.c-faq summary::-webkit-details-marker { display:none; }
.c-faq summary:hover { color:var(--accent); }
.c-faq .faq-answer { margin:0; padding-block-end:20px; font:400 0.9375rem/1.8 var(--sans); color:var(--muted); }

/* ============================================================
   About Section
   ============================================================ */
.about-section { background: var(--bg-alt); border-block-start: 1px solid var(--border); border-block-end: 1px solid var(--border); }
.about-inner {
  max-width: var(--wrap); margin: 0 auto; padding: var(--section-v) 40px;
  display: grid; grid-template-columns: 1fr 1.1fr; gap: 72px; align-items: start;
}
.about-eyebrow {
  font: 600 0.6875rem/1 var(--mono) !important; letter-spacing: .16em; text-transform: uppercase;
  color: var(--accent) !important; margin-block-end: 18px !important;
}
.about-title {
  font: 700 clamp(1.625rem,3.2vw,2.375rem)/1.2 var(--serif);
  color: var(--ink); margin: 0 0 20px;
}
.about-lead {
  font: 500 1.0625rem/1.75 var(--sans); color: var(--ink); margin: 0 0 16px;
}
.about-body {
  font: 400 0.9375rem/1.8 var(--sans); color: var(--text); margin: 0;
}
.about-principles { margin: 0; padding: 0; display: flex; flex-direction: column; }
.principle-item {
  display: grid; grid-template-columns: 110px 1fr; gap: 20px;
  padding-block: 22px; border-block-end: 1px solid var(--border);
  align-items: start;
}
.principle-item:first-child { border-block-start: 1px solid var(--border); }
.principle-label {
  font: 600 0.8125rem/1.4 var(--mono); color: var(--accent); letter-spacing: .04em;
  padding-block-start: 2px;
}
.principle-desc { font: 400 0.875rem/1.75 var(--sans); color: var(--text); margin: 0; }

/* ============================================================
   Contact CTA Section — paper2 2-col with intake card-link
   ============================================================ */
.contact-cta-section { display:none; } /* replaced by .contact-section */
.contact-section {
  background:var(--bg-alt);
  border-block:1px solid var(--border-2);
}
.contact-inner {
  display:grid; grid-template-columns:1fr 1fr; gap:72px;
  align-items:center; max-width:var(--wrap); margin:0 auto;
  padding:96px clamp(24px,4vw,40px);
}
.contact-eyebrow-gold {
  font:600 0.6875rem/1 var(--mono); letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold); margin:0 0 16px; display:flex; align-items:center; gap:10px;
}
.contact-eyebrow-gold::before { content:''; display:block; width:24px; height:1px; background:var(--gold); flex:none; }
.contact-section h2 { font:700 clamp(1.625rem,3vw,2.375rem)/1.2 var(--serif); color:var(--ink); margin:0 0 20px; }
.contact-lead { font:400 1rem/1.8 var(--sans); color:var(--text); margin:0 0 24px; }
.mono-bullets { list-style:none; padding:0; margin:0 0 24px; display:flex; flex-direction:column; }
.mono-bullets li { display:flex; align-items:baseline; gap:14px; padding-block:12px; border-block-end:1px solid var(--border-2); font:400 0.8438rem/1.5 var(--mono); color:var(--muted); }
.mono-bullets li::before { content:'//'; color:var(--accent); flex:none; font-size:0.6875rem; }
.contact-direct-links { display:flex; flex-direction:column; gap:10px; }
.contact-direct-links a { font:400 0.875rem/1 var(--sans); color:var(--muted); text-decoration:none; display:flex; align-items:center; gap:8px; }
.contact-direct-links a:hover { color:var(--accent); }
.contact-intake-card {
  background:var(--surface); border:1px solid var(--border);
  border-radius:4px; text-decoration:none; color:var(--text); display:block;
  transition:border-color .2s;
}
.contact-intake-card:hover { border-color:var(--accent); }
.contact-intake-bar {
  padding:14px 20px; border-block-end:1px solid var(--border-2);
  display:flex; align-items:center; gap:10px;
  font:400 0.75rem/1 var(--mono); color:var(--muted);
}
.intake-dot { width:10px; height:10px; border-radius:50%; flex:none; }
.intake-dot--r { background:#FF5F57; }
.intake-dot--y { background:#FFBD2E; }
.intake-dot--g { background:#28CA41; }
.contact-intake-body { padding:40px 36px; display:flex; flex-direction:column; gap:20px; }
.contact-intake-title { font:700 clamp(1.25rem,2.2vw,1.625rem)/1.25 var(--serif); color:var(--ink); margin:0; }
.contact-intake-desc { font:400 0.9375rem/1.75 var(--sans); color:var(--muted); margin:0; }
.wa-inline { display:flex; align-items:center; gap:8px; font:400 0.8438rem/1 var(--sans); color:var(--muted); }
.wa-inline .green-dot { width:8px; height:8px; border-radius:50%; background:#25D366; flex:none; }

/* ============================================================
   Breadcrumb
   ============================================================ */
.breadcrumb {
  max-width: var(--wrap); margin: 0 auto; padding: 24px 40px 0;
  font: 400 0.75rem/1 var(--mono); letter-spacing: .06em; color: var(--muted);
}
.breadcrumb a { color: var(--muted); text-decoration: none; transition: color .2s; }
.breadcrumb a:hover { color: var(--accent); }
.breadcrumb .sep { margin: 0 8px; color: var(--border-2); }
.breadcrumb .here { color: var(--ink); }

/* ============================================================
   Hero — service pages
   ============================================================ */
.hero {
  max-width: var(--read); margin: 0 auto; padding: 64px 40px 48px;
}
.hero .eyebrow {
  font: 600 0.6875rem/1 var(--mono); letter-spacing: .16em; text-transform: uppercase;
  color: var(--accent); margin-block-end: 16px;
  display: flex; align-items: center; gap: 10px;
}
.hero .eyebrow::before {
  content: ''; display: block; width: 24px; height: 1px; background: var(--accent); flex: none;
}
.hero h1 {
  font: 900 clamp(2.25rem,5vw,4rem)/1.1 var(--serif); color: var(--ink);
  letter-spacing: -.015em; margin: 0 0 22px;
}
.hero .lead { font: 400 1.1875rem/1.75 var(--sans); color: var(--text); margin: 0; }
.hero .eyebrow.hf-fade { animation: hf-fade .45s ease .1s both; }
.hero h1.hf-up  { animation: hf-up .55s cubic-bezier(.16,1,.3,1) .22s both; }
.hero .lead.hf-up { animation: hf-up .5s ease .38s both; }
.hero-media.hf-fade { animation: hf-fade .5s ease .5s both; }

/* ============================================================
   Content blocks
   ============================================================ */
.content {
  max-width: var(--read); margin: 0 auto; padding: 48px 40px 28px;
}
.content h2 {
  font: 700 clamp(1.375rem,2.8vw,1.875rem)/1.3 var(--serif);
  color: var(--ink-2); margin: 50px 0 16px;
}
.content h2:first-child { margin-top: 0; }
.content p { font: 400 1.0625rem/1.9 var(--sans); color: var(--text); margin: 0 0 20px; }

.c-list { margin: 8px 0 28px; display: flex; flex-direction: column; gap: 12px; }
.c-list .row { display: flex; gap: 14px; align-items: flex-start; }
.c-list .dot {
  width: 6px; height: 6px; background: var(--accent); border-radius: 50%;
  margin-top: 11px; flex: none;
}
.c-list .txt { font: 400 1.0625rem/1.75 var(--sans); color: var(--text); }

.c-olist { padding-inline-start: 1.5em; margin: 24px 0; display: flex; flex-direction: column; gap: 10px; }
.c-olist li { color: var(--text); line-height: 1.75; font-size: 1rem; padding-inline-start: 4px; }
.c-olist li::marker { color: var(--accent); font-weight: 700; }

.c-quote {
  border-inline-start: 3px solid var(--accent);
  padding: 6px 24px; margin: 36px 0;
  background: var(--accent-bg);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.c-quote .txt { font: 500 1.3125rem/1.55 var(--serif); color: var(--ink-2); }

.c-figure { margin: 32px 0; }
.c-figure figcaption { font: 400 0.75rem/1.5 var(--mono); color: var(--muted); margin-top: 10px; }

.p-rich {
  font: 400 1rem/1.8 var(--sans); color: var(--text);
  margin-block: 28px; padding: 18px 22px;
  border-inline-start: 2px solid var(--accent);
  background: var(--accent-bg); border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.p-rich a {
  color: var(--accent); text-decoration: underline;
  text-decoration-thickness: 1px; text-underline-offset: 3px;
  font-weight: 600; transition: opacity .18s;
}
.p-rich a:hover { opacity: .75; }

/* ============================================================
   Inline CTA
   ============================================================ */
.inline-cta { max-width: var(--read); margin: 0 auto; padding: 16px 40px 64px; }
.inline-cta .box {
  padding: 32px 36px;
  border: 1.5px solid var(--accent);
  border-radius: var(--card-r);
  background: var(--accent-bg);
  display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap;
}
.inline-cta .lead { font: 400 1.125rem/1.5 var(--serif); color: var(--ink-2); }

/* ============================================================
   Related cards
   ============================================================ */
.related {
  border-block-start: 1px solid var(--border);
  background: var(--bg-alt);
}
.related .inner { max-width: var(--wrap); margin: 0 auto; padding: 70px 40px; }
.related h2 { font: 700 1.375rem/1.2 var(--serif); color: var(--ink); margin: 0 0 30px; }

/* ============================================================
   Monitoring Mock Dashboard
   ============================================================ */
.monitor-mock {
  width: 100%; height: 100%;
  background: #0A1020;
  border-radius: 10px 10px 0 0;
  display: flex; flex-direction: column; overflow: hidden;
}
.mm-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 20px;
  border-block-end: 1px solid rgba(255,255,255,.07);
  background: rgba(255,255,255,.03);
}
.mm-title { font: 600 0.6875rem/1 var(--mono); color: var(--accent); letter-spacing: .14em; text-transform: uppercase; }
.mm-status { display: flex; align-items: center; gap: 7px; font: 400 0.75rem/1 var(--sans); color: #4ade80; }
.mm-dot {
  width: 7px; height: 7px; border-radius: 50%; background: #4ade80;
  box-shadow: 0 0 0 0 rgba(74,222,128,.4); animation: mm-pulse 2s infinite;
}
@keyframes mm-pulse {
  0%  { box-shadow: 0 0 0 0 rgba(74,222,128,.4); }
  70% { box-shadow: 0 0 0 8px rgba(74,222,128,0); }
  100%{ box-shadow: 0 0 0 0 rgba(74,222,128,0); }
}
.mm-body { display: flex; flex-direction: column; gap: 0; flex: 1; padding: 18px; overflow: hidden; }
.mm-kpis { display: flex; gap: 12px; margin-block-end: 18px; }
.mm-kpi {
  flex: 1; background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07); border-radius: 7px;
  padding: 12px 14px; display: flex; flex-direction: column; gap: 4px;
}
.mm-kpi .num { font: 700 1.5rem/1 var(--mono); }
.mm-kpi .num.green  { color: #4ade80; }
.mm-kpi .num.yellow { color: #fbbf24; }
.mm-kpi .num.blue   { color: var(--gold); }
.mm-kpi .lbl { font: 400 0.6875rem/1.4 var(--sans); color: rgba(255,255,255,.45); }
.mm-feed { display: flex; flex-direction: column; gap: 8px; flex: 1; overflow: hidden; }
.mm-feed-head {
  font: 600 0.6875rem/1 var(--mono); color: rgba(255,255,255,.35);
  letter-spacing: .10em; margin-block-end: 4px; text-transform: uppercase;
}
.mm-row {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 12px; border-radius: 6px;
  background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.06);
  animation: mm-slide .4s ease both;
}
.mm-row.pos { border-inline-start: 2px solid #4ade80; }
.mm-row.neg { border-inline-start: 2px solid #f87171; }
.mm-row.neu { border-inline-start: 2px solid #fbbf24; }
.mm-row:nth-child(2) { animation-delay: .08s; }
.mm-row:nth-child(3) { animation-delay: .16s; }
.mm-row:nth-child(4) { animation-delay: .24s; }
@keyframes mm-slide { from { opacity: 0; transform: translateX(8px); } to { opacity: 1; transform: none; } }
.mm-src  { font: 600 0.6875rem/1 var(--mono); color: rgba(255,255,255,.5); width: 56px; flex: none; letter-spacing: .04em; }
.mm-txt  { font: 400 0.75rem/1.4 var(--sans); color: rgba(255,255,255,.65); flex: 1; }
.mm-time { font: 400 0.6875rem/1 var(--mono); color: rgba(255,255,255,.3); flex: none; }

/* ============================================================
   Site Footer — 5-column navy grid
   ============================================================ */
.site-footer {
  background: var(--ink);
  border-block-start: 1px solid rgba(255,255,255,.06);
}
.site-footer .inner {
  max-width: var(--wrap); margin: 0 auto; padding: 72px 40px 36px;
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.8fr 1fr 1fr 1fr 1.3fr;
  gap: 40px;
}
.footer-about p {
  font: 400 0.875rem/1.75 var(--sans); color: rgba(255,255,255,.45);
  max-width: 280px; margin: 0 0 20px;
}
.footer-brand {
  display: flex; align-items: center; gap: 10px; margin-block-end: 18px;
}
.footer-brand .mark { color: var(--gold); font: 900 1.25rem/1 var(--serif); }
.footer-brand .mark::after { content: 'H'; }
.footer-brand .word { font: 700 0.9375rem/1 var(--sans); color: rgba(255,255,255,.85); }
.footer-brand .tld { color: rgba(255,255,255,.35); font-weight: 400; }
.footer-badges { display: flex; gap: 8px; flex-wrap: wrap; }
.footer-badges .badge {
  font: 500 0.625rem/1 var(--mono); letter-spacing: .12em;
  color: rgba(255,255,255,.5); border: 1px solid rgba(255,255,255,.12);
  border-radius: 20px; padding: 6px 12px;
}
.footer-col { display: flex; flex-direction: column; }
.footer-col .h {
  font: 700 0.625rem/1 var(--mono); letter-spacing: .16em; text-transform: uppercase;
  color: rgba(255,255,255,.35); margin-block-end: 16px;
}
.footer-col .h a { color: inherit; text-decoration: none; }
.footer-col .h a:hover { color: rgba(255,255,255,.7); }
.footer-col a {
  font: 400 0.8125rem/1 var(--sans); color: rgba(255,255,255,.55);
  text-decoration: none; display: block; padding-block: 5px;
  transition: color .2s;
}
.footer-col a:hover { color: rgba(255,255,255,.9); }
.footer-contact .h {
  font: 700 0.625rem/1 var(--mono); letter-spacing: .16em; text-transform: uppercase;
  color: rgba(255,255,255,.35); margin-block-end: 16px;
}
.footer-contact p {
  font: 400 0.875rem/1.75 var(--sans); color: rgba(255,255,255,.45); margin: 0 0 18px;
}
.footer-nav-links { display: flex; flex-direction: column; gap: 8px; margin-block-start: 18px; }
.footer-nav-links a {
  font: 400 0.8125rem/1 var(--sans); color: rgba(255,255,255,.45);
  text-decoration: none; transition: color .2s;
}
.footer-nav-links a:hover { color: rgba(255,255,255,.9); }
.footer-bottom {
  margin-block-start: 52px; padding-block-start: 24px;
  border-block-start: 1px solid rgba(255,255,255,.06);
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px;
}
.footer-bottom .copy { font: 400 0.75rem/1 var(--mono); color: rgba(255,255,255,.25); letter-spacing: .04em; }
.footer-bottom .legal { display: flex; gap: 22px; }
.footer-bottom .legal a {
  font: 400 0.8125rem/1 var(--sans); color: rgba(255,255,255,.35);
  text-decoration: none; transition: color .2s;
}
.footer-bottom .legal a:hover { color: rgba(255,255,255,.75); }

/* ============================================================
   Accessibility Widget
   ============================================================ */
.a11y-btn {
  position: fixed; inset-inline-start: 20px; bottom: 24px; z-index: 9000;
  background: var(--accent); color: #fff; border: none; border-radius: 50%;
  width: 52px; height: 52px; display: flex; align-items: center; justify-content: center;
  cursor: pointer; box-shadow: 0 4px 20px rgba(30,72,55,.3); transition: transform .2s, box-shadow .2s;
}
.a11y-btn:hover, .a11y-btn:focus-visible {
  transform: scale(1.08); box-shadow: 0 8px 28px rgba(30,72,55,.4);
  outline: 2px solid var(--accent); outline-offset: 3px;
}
.a11y-btn svg { width: 26px; height: 26px; fill: currentColor; }
.a11y-panel {
  position: fixed; inset-inline-start: 20px; bottom: 84px; z-index: 8999;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: 8px; padding: 20px 18px 14px; width: 240px;
  box-shadow: 0 12px 40px rgba(0,0,0,.12); display: none;
}
.a11y-panel.open { display: block; }
.a11y-panel-title {
  font: 700 0.875rem/1.3 var(--mono); letter-spacing: .06em; color: var(--accent);
  margin: 0 0 14px; text-transform: uppercase;
  border-block-end: 1px solid var(--border); padding-block-end: 10px;
}
.a11y-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 0; border-block-end: 1px solid var(--border);
  font: 400 0.8125rem/1.4 var(--sans); color: var(--text);
}
.a11y-row:last-of-type { border-block-end: none; }
.a11y-controls { display: flex; gap: 5px; }
.a11y-ctrl {
  background: var(--bg-alt); border: 1px solid var(--border); border-radius: 4px;
  color: var(--ink); font: 600 0.8125rem/1 var(--mono); padding: 5px 10px;
  cursor: pointer; transition: background .15s; min-width: 30px;
}
.a11y-ctrl:hover, .a11y-ctrl:focus-visible { background: var(--accent); color: #fff; outline: none; border-color: var(--accent); }
.a11y-toggle-btn {
  background: var(--bg-alt); border: 1px solid var(--border); border-radius: 20px;
  padding: 4px 12px; font: 600 0.6875rem/1.5 var(--mono); color: var(--muted);
  cursor: pointer; transition: background .15s, color .15s;
}
.a11y-toggle-btn.on { background: var(--accent); color: #fff; border-color: var(--accent); }
.a11y-reset {
  display: block; width: 100%; margin-block-start: 12px;
  background: transparent; border: 1px solid var(--border); border-radius: 4px;
  padding: 7px; font: 400 0.75rem/1 var(--mono); letter-spacing: .04em;
  color: var(--muted); cursor: pointer; transition: border-color .15s, color .15s; text-align: center;
}
.a11y-reset:hover { border-color: var(--accent); color: var(--accent); }
html.a11y-big-text    { font-size: 112%; }
html.a11y-bigger-text { font-size: 128%; }
html.a11y-contrast    { filter: contrast(180%) !important; }
html.a11y-links a     { text-decoration: underline !important; }
html.a11y-readable *  { font-family: Arial, Helvetica, sans-serif !important; }

/* ============================================================
   Cookie Banner
   ============================================================ */
.cookie-banner {
  position: fixed; bottom: 0; inset-inline: 0; z-index: 9100;
  background: var(--ink); border-block-start: 1px solid rgba(255,255,255,.08);
  padding: 16px 28px; display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
}
.cookie-banner p {
  flex: 1; min-width: 220px; margin: 0;
  font: 400 0.875rem/1.75 var(--sans); color: rgba(255,255,255,.7);
}
.cookie-banner a { color: var(--gold); text-decoration: underline; }
.cookie-banner-actions { display: flex; gap: 10px; flex-shrink: 0; }
.cookie-accept {
  background: var(--accent); color: #fff; border: none; border-radius: var(--radius-sm);
  padding: 10px 24px; font: 700 0.6875rem/1 var(--mono); letter-spacing: .08em; text-transform: uppercase;
  cursor: pointer; transition: opacity .15s; white-space: nowrap;
}
.cookie-accept:hover { opacity: .85; }
.cookie-decline {
  background: transparent; color: rgba(255,255,255,.5);
  border: 1px solid rgba(255,255,255,.15); border-radius: var(--radius-sm);
  padding: 10px 16px; font: 400 0.75rem/1 var(--mono); cursor: pointer; white-space: nowrap;
  transition: color .15s, border-color .15s;
}
.cookie-decline:hover { color: rgba(255,255,255,.85); border-color: rgba(255,255,255,.35); }

/* ============================================================
   WhatsApp Float
   ============================================================ */
.wa-float {
  position: fixed; inset-inline-end: 24px; bottom: 24px; z-index: 9000;
  display: flex; align-items: center; gap: 9px;
  background: #25D366; color: #fff; border-radius: 50px;
  padding: 14px 22px; text-decoration: none;
  box-shadow: 0 4px 20px rgba(37,211,102,.38);
  font: 600 0.875rem/1 var(--sans); transition: transform .2s, box-shadow .2s; white-space: nowrap;
}
.wa-float:hover { color: #fff; transform: translateY(-3px); box-shadow: 0 8px 28px rgba(37,211,102,.5); }
.wa-float:focus-visible { outline: 3px solid #25D366; outline-offset: 3px; }
.wa-icon { width: 22px; height: 22px; flex: none; }

/* ============================================================
   Contact Page
   ============================================================ */
.contact-hero { padding-bottom: 30px; }
.contact-empathy { border-block-start: 1px solid var(--border); border-block-end: 1px solid var(--border); background: var(--bg-alt); }
.contact-empathy .inner {
  max-width: var(--wrap); margin: 0 auto; padding: 52px 40px;
  display: flex; flex-direction: row-reverse; gap: 60px; align-items: flex-start;
}
.empathy-text { flex: 1; }
.empathy-text p { font: 400 1.0625rem/1.9 var(--sans); color: var(--text); margin: 0 0 18px; }
.empathy-text p:last-child { margin: 0; }
.empathy-text strong { color: var(--ink-2); font-weight: 600; }
.empathy-promise {
  flex: 0 0 300px; display: flex; gap: 16px; align-items: flex-start;
  padding: 26px; border: 1px solid var(--border); border-radius: var(--card-r);
  background: var(--surface);
}
.empathy-promise .promise-icon { font-size: 1.375rem; flex: none; margin-top: 2px; }
.empathy-promise strong { display: block; font: 600 0.9375rem/1.3 var(--sans); color: var(--ink-2); margin-block-end: 8px; }
.empathy-promise span { font: 400 0.8125rem/1.75 var(--sans); color: var(--text); }
.contact-main { max-width: var(--wrap); margin: 0 auto; padding: 70px 40px 90px; }
.contact-main .inner { display: grid; grid-template-columns: 1fr 340px; gap: 70px; }
.contact-form-col h2 { font: 700 1.625rem/1.2 var(--serif); color: var(--ink-2); margin: 0 0 10px; }
.contact-form-col .sub { font: 400 1rem/1.75 var(--sans); color: var(--muted); margin: 0 0 34px; }
.contact-form { display: flex; flex-direction: column; gap: 22px; }
.hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-row { display: flex; flex-direction: column; gap: 8px; }
.form-row label { font: 600 0.8125rem/1 var(--mono); letter-spacing: .04em; color: var(--ink-2); }
.form-row .req { color: var(--accent); }
.form-row .opt { font-weight: 400; color: var(--muted); }
.form-row input, .form-row textarea {
  background: var(--bg-alt); border: 1px solid var(--border); border-radius: var(--radius-sm);
  color: var(--ink); font: 400 1rem/1.5 var(--sans); padding: 14px 16px;
  outline: none; transition: border-color .2s; direction: rtl; width: 100%;
}
.form-row input:focus, .form-row textarea:focus { border-color: var(--accent); background: var(--surface); }
.form-row input::placeholder, .form-row textarea::placeholder { color: var(--muted); }
.form-row textarea { resize: vertical; min-height: 120px; }
.form-note { font: 400 0.8125rem/1.65 var(--sans); color: var(--muted); margin: 0; }
.form-success {
  padding: 28px; border: 1px solid var(--accent); border-radius: var(--card-r);
  background: var(--accent-bg);
}
.form-success strong { display: block; font: 600 1rem/1.3 var(--serif); color: var(--ink-2); margin-block-end: 10px; }
.form-success p { font: 400 0.9375rem/1.65 var(--sans); color: var(--text); margin: 0; }
.form-errors {
  padding: 16px 20px; border: 1px solid rgba(239,68,68,.3);
  border-radius: var(--radius-sm); background: rgba(239,68,68,.06); margin-block-end: 20px;
}
.form-errors p { font: 400 0.875rem/1.55 var(--sans); color: var(--danger); margin: 0 0 6px; }
.form-errors p:last-child { margin: 0; }
.contact-alt-col { display: flex; flex-direction: column; gap: 28px; padding-top: 50px; }
.alt-method { display: flex; gap: 16px; align-items: flex-start; }
.alt-icon { font-size: 1.375rem; flex: none; margin-top: 2px; }
.alt-method strong { display: block; font: 600 0.9375rem/1.3 var(--sans); color: var(--ink-2); margin-block-end: 6px; }
.alt-method p { font: 400 0.875rem/1.65 var(--sans); color: var(--text); margin: 0 0 12px; }
.alt-reassure { padding: 22px; border: 1px solid var(--border); border-radius: var(--card-r); background: var(--bg-alt); }
.alt-reassure p { font: 400 0.875rem/1.75 var(--sans); color: var(--muted); margin: 0 0 8px; }
.alt-reassure p:last-child { margin: 0; }

/* ============================================================
   Generic / legal / 404
   ============================================================ */
.page-body { max-width: var(--read); margin: 0 auto; padding: 50px 40px 80px; }
.page-body h2 { font: 700 1.625rem/1.3 var(--serif); color: var(--ink-2); margin: 44px 0 16px; }
.page-body h3 { font: 600 1.25rem/1.4 var(--sans); color: var(--ink-2); margin: 28px 0 12px; }
.page-body p { font: 400 1.0625rem/1.9 var(--sans); color: var(--text); margin: 0 0 20px; }
.page-body a { color: var(--accent); }
.page-body ul { padding-inline-start: 22px; margin: 0 0 22px; }
.page-body li { font: 400 1.0625rem/1.8 var(--sans); color: var(--text); margin-bottom: 8px; }

.notfound { max-width: var(--read); margin: 0 auto; padding: 120px 40px; text-align: center; }
.notfound-code { font: 900 7.5rem/1 var(--serif); color: var(--accent); opacity: .12; letter-spacing: -.04em; margin-block-end: 16px; }
.notfound h1 { font: 700 2.375rem/1.2 var(--serif); color: var(--ink-2); margin: 0 0 16px; }
.notfound p { font: 400 1.0625rem/1.65 var(--sans); color: var(--muted); margin: 0 0 30px; }
.notfound a { color: var(--accent); }
.notfound-actions { display: flex; gap: 14px; flex-wrap: wrap; justify-content: center; margin-top: 32px; }

/* ============================================================
   Knowledge Centre
   ============================================================ */
.kc-section-header { margin-block-end: 40px; }
.kc-section-header .kicker { display: block; margin-block-end: 10px; }
.kc-section-header h2.big { margin-block-end: 10px; }
.kc-date { display: block; font: 400 0.75rem/1 var(--mono); letter-spacing: .04em; color: var(--muted); margin-top: 6px; }
.kc-empty { padding: 48px 24px; text-align: center; color: var(--muted); }
.kc-section-divider { max-width: var(--wrap); margin: 0 auto; padding: 0 40px; border-block-start: 1px solid var(--border); }

.hero--article { padding-block-end: 28px; }
.hero--article .eyebrow a { color: var(--accent); text-decoration: none; }
.hero--article .eyebrow a:hover { text-decoration: underline; }
.hero--article .meta { font: 400 0.75rem/1 var(--mono); letter-spacing: .04em; color: var(--muted); margin: 14px 0 0; }
.article-body { max-width: var(--read); margin: 0 auto; padding: 40px 24px 64px; }
.article-body h2 { font: 700 1.35rem/1.35 var(--serif); color: var(--ink); margin: 2em 0 .55em; }
.article-body p { color: var(--text); line-height: 1.85; margin-block-end: 1em; }
.article-body ul { list-style: none; padding: 0; margin: 0 0 1.2em; }
.article-body ul li { position: relative; padding-inline-start: 1.4em; color: var(--text); line-height: 1.8; margin-block-end: .5em; }
.article-body ul li::before { content: '·'; position: absolute; inset-inline-start: 0; color: var(--accent); font-weight: 700; }
.article-body strong { color: var(--ink-2); font-weight: 600; }
.article-byline { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 14px; font: 400 0.75rem/1 var(--mono); color: var(--muted); }
.byline-sep { opacity: .4; }
.byline-author { color: var(--accent); font-weight: 500; }
.article-author-box { display: flex; gap: 20px; align-items: flex-start; max-width: var(--read); margin: 0 auto 8px; padding: 28px 24px; border-block-start: 1px solid var(--border); border-block-end: 1px solid var(--border); }
.author-avatar { flex-shrink: 0; width: 52px; height: 52px; border-radius: 50%; background: var(--accent); color: #fff; font: 700 1.375rem/3.25rem var(--serif); text-align: center; }
.author-name { display: block; font: 600 0.9375rem/1.2 var(--sans); color: var(--ink); margin-block-end: 8px; }
.author-bio { font: 400 0.8125rem/1.75 var(--sans); color: var(--muted); margin: 0 0 14px; }
.post-nav { display: flex; gap: 14px; flex-wrap: wrap; margin-block-end: 18px; }
.post-nav .btn { flex: 1; text-align: center; min-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.back-to-kc a { color: var(--accent); font-size: .9rem; }
.related-articles { max-width: var(--wrap); margin: 0 auto; padding: 48px 40px 56px; border-block-start: 1px solid var(--border); }
.related-articles__title { font: 600 0.625rem/1 var(--mono); letter-spacing: .16em; color: var(--accent); margin: 0 0 28px; text-transform: uppercase; }

/* ============================================================
   Free Tools Hub
   ============================================================ */
.tools-hub-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-block-start: 2rem; }
.tool-card {
  background: var(--surface); border: 1px solid var(--border);
  border-block-start: 3px solid var(--accent); border-radius: var(--card-r);
  padding: 28px 24px; display: flex; flex-direction: column; align-items: flex-start; gap: 12px;
  transition: box-shadow .2s, transform .2s;
}
.tool-card:hover { box-shadow: 0 16px 40px rgba(0,0,0,.08); transform: translateY(-3px); }
.tool-card__icon { width: 44px; height: 44px; border-radius: 8px; background: var(--accent-bg); display: flex; align-items: center; justify-content: center; }
.tool-card__icon svg { width: 22px; height: 22px; stroke: var(--accent); }
.tool-card__name { font: 700 1rem/1.3 var(--serif); color: var(--ink); margin: 0; }
.tool-card__desc { font: 400 0.875rem/1.65 var(--sans); color: var(--text); margin: 0; flex: 1; }
.tool-card .btn { margin-block-start: 4px; }

/* ============================================================
   Calculator / Quiz
   ============================================================ */
.calc-wrap, .serp-tool-wrap, .rr-wrap { max-width: 720px; margin-inline: auto; padding-block: 2rem 3rem; }
.calc-fields { display: flex; flex-direction: column; gap: 1.5rem; margin-block-end: 2rem; }
.calc-field { display: flex; flex-direction: column; gap: 8px; }
.calc-label { font: 600 0.8125rem/1.4 var(--mono); letter-spacing: .04em; color: var(--text); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.calc-label strong { color: var(--ink); font-size: 0.875rem; }
.calc-slider { -webkit-appearance: none; appearance: none; width: 100%; height: 4px; border-radius: 2px; background: var(--border); outline: none; cursor: pointer; accent-color: var(--accent); }
.calc-slider::-webkit-slider-thumb { -webkit-appearance: none; width: 18px; height: 18px; border-radius: 50%; background: var(--accent); border: 2px solid var(--bg); box-shadow: 0 0 0 3px rgba(30,72,55,.2); cursor: pointer; }
.calc-slider::-moz-range-thumb { width: 18px; height: 18px; border-radius: 50%; background: var(--accent); border: 2px solid var(--bg); cursor: pointer; }
.calc-number { width: min(220px, 100%); padding: 10px 14px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg-alt); color: var(--ink); font: 500 1rem/1 var(--mono); outline: none; transition: border-color .2s; }
.calc-number:focus { border-color: var(--accent); }
.calc-text, .calc-textarea { width: 100%; padding: 10px 14px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg-alt); color: var(--ink); font: 400 0.9375rem/1.4 var(--sans); outline: none; transition: border-color .2s; box-sizing: border-box; }
.calc-text:focus, .calc-textarea:focus { border-color: var(--accent); }
.calc-textarea { resize: vertical; }
.calc-radio-group { display: flex; flex-wrap: wrap; gap: 10px; }
.calc-radio-label { display: flex; align-items: center; gap: 6px; font: 400 0.8125rem/1 var(--sans); color: var(--text); cursor: pointer; padding: 7px 14px; border: 1px solid var(--border); border-radius: 20px; transition: border-color .2s, color .2s; }
.calc-radio-label:has(input:checked) { border-color: var(--accent); color: var(--accent); }
.calc-radio-label input { accent-color: var(--accent); }

@keyframes quiz-fade-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.calc-result { margin-block-start: 2rem; animation: quiz-fade-in .35s ease; }
.calc-result-inner { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 1.5rem; padding: 2rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--card-r); }
.result-headline { font: 700 1.3rem/1.4 var(--serif); color: var(--ink); }
.result-headline strong { color: var(--accent); }
.result-note { font: 400 0.9375rem/1.65 var(--sans); color: var(--text); margin: 0; }

.quiz-wrap { max-width: 720px; margin: 0 auto; padding: 2.5rem 0 3rem; }
.quiz-progress { height: 2px; background: var(--border); border-radius: 1px; margin-block-end: 2.5rem; overflow: hidden; }
.quiz-progress-bar { height: 100%; background: var(--accent); border-radius: 1px; width: 0; transition: width .5s cubic-bezier(.4,0,.2,1); }
.quiz-step-label { font: 500 0.75rem/1 var(--mono); color: var(--muted); letter-spacing: .08em; margin-block-end: 1rem; }
.quiz-question { font: 700 1.5rem/1.35 var(--serif); color: var(--ink); margin: 0 0 2rem; }
.quiz-options { display: flex; flex-direction: column; gap: .75rem; padding: 0; margin: 0; }
.quiz-opt { display: flex; align-items: center; width: 100%; padding: 16px 20px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sm); font: 400 1rem/1.4 var(--sans); color: var(--ink); cursor: pointer; text-align: inherit; transition: border-color .18s, background .18s; position: relative; }
.quiz-opt:hover, .quiz-opt:focus-visible { border-color: var(--accent); background: var(--accent-bg); outline: none; }
.quiz-opt--selected { border-color: var(--accent); background: var(--accent-bg); }
.quiz-opt--selected::after { content: ''; display: block; width: 18px; height: 18px; border-radius: 50%; background-color: var(--accent); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E"); background-size: 11px; background-repeat: no-repeat; background-position: center; margin-inline-start: auto; flex-shrink: 0; }
.quiz-nav { margin-block-start: 1.5rem; }
.quiz-back { display: inline-flex; align-items: center; gap: 6px; background: none; border: none; padding: 0; font: 500 0.8125rem/1 var(--mono); letter-spacing: .04em; color: var(--muted); cursor: pointer; transition: color .18s; }
.quiz-back:hover { color: var(--accent); }
.quiz-result { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 1.5rem; padding: 1.5rem 0 2rem; animation: quiz-fade-in .4s ease both; }
.score-ring-wrap { position: relative; width: 160px; height: 160px; flex-shrink: 0; }
.score-ring-wrap svg { display: block; }
.score-ring-track { stroke: var(--border); }
.score-ring-fill { stroke: var(--quiz-risk-color, var(--accent)); transition: stroke-dashoffset 1.2s cubic-bezier(.4,0,.2,1); }
.score-num-wrap { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 2px; }
.score-num { font: 700 3rem/1 var(--mono); color: var(--ink); }
.score-denom { font: 500 1rem/1 var(--mono); color: var(--muted); align-self: flex-end; padding-block-end: 5px; }
.risk-badge { display: inline-flex; align-items: center; padding: 6px 18px; border-radius: 999px; border: 1px solid; font: 600 0.75rem/1 var(--mono); letter-spacing: .06em; }
.result-title { font: 700 1.25rem/1.3 var(--serif); color: var(--ink); margin: .5rem 0 0; }
.reco-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .6rem; text-align: start; max-width: 440px; width: 100%; }
.reco-item { display: flex; align-items: flex-start; gap: 10px; font-size: 0.9375rem; color: var(--text); line-height: 1.55; }
.reco-item::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); flex-shrink: 0; margin-block-start: 6px; }
.result-ctas { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 1rem; }
.quiz-share-btn { display: inline-flex; align-items: center; gap: 8px; padding: 10px 20px; background: rgba(37,211,102,.08); border: 1px solid rgba(37,211,102,.3); color: #16a34a; border-radius: 999px; font: 600 0.8125rem/1 var(--mono); text-decoration: none; transition: background .18s; }
.quiz-share-btn:hover { background: rgba(37,211,102,.15); }
.quiz-restart { background: none; border: none; padding: 0; font: 400 0.8125rem/1 var(--sans); color: var(--muted); cursor: pointer; text-decoration: underline; transition: color .18s; }
.quiz-restart:hover { color: var(--accent); }
.quiz-explainer { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; max-width: var(--read); margin: 0 auto; }
.qe-item { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .6rem; }
.qe-icon { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; background: var(--accent-bg); border-radius: 50%; }
.qe-icon svg { width: 22px; height: 22px; stroke: var(--accent); fill: none; stroke-width: 2; }
.qe-item strong { font: 700 0.9375rem/1.3 var(--sans); color: var(--ink); }
.qe-item p { font-size: 0.875rem; color: var(--text); line-height: 1.6; margin: 0; }

.serp-preview-label { font: 700 0.75rem/1 var(--mono); color: var(--text); text-transform: uppercase; letter-spacing: .1em; margin-block-end: 12px; }
.serp-mock { background: var(--bg); border: 1px solid var(--border); border-radius: 8px; padding: 16px 20px; font-family: Arial, sans-serif; max-width: 600px; }
.serp-mock__url { font-size: 0.75rem; color: #4d5156; line-height: 1.4; margin-block-end: 2px; }
.serp-mock__title { font-size: 1.25rem; color: #1a0dab; line-height: 1.3; font-weight: 400; cursor: pointer; }
.serp-mock__desc { font-size: 0.875rem; color: #4d5156; line-height: 1.58; margin-block-start: 4px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.char-counter { font: 500 0.75rem/1 var(--mono); color: var(--text); margin-inline-start: auto; }
.char-counter--ok { color: var(--success); }
.char-counter--warn { color: var(--warning); }
.char-counter--over { color: var(--danger); }

.rr-steps { min-height: 200px; }
.rr-step { animation: quiz-fade-in .3s ease; }
.rr-result { animation: quiz-fade-in .3s ease; display: flex; flex-direction: column; gap: 1.25rem; }
.response-template { background: var(--surface); border: 1px solid var(--border); border-radius: var(--card-r); padding: 20px; }
.response-text { font: 400 0.9375rem/1.8 var(--sans); color: var(--ink); margin: 0 0 12px; }
.response-copy-btn { display: inline-flex; align-items: center; gap: 6px; padding: 7px 16px; border: 1px solid var(--border); border-radius: 20px; background: transparent; color: var(--text); font: 600 0.75rem/1 var(--mono); cursor: pointer; transition: border-color .2s, color .2s; }
.response-copy-btn:hover { border-color: var(--accent); color: var(--accent); }

.result-stars-row { display: flex; gap: 2.5rem; justify-content: center; flex-wrap: wrap; }
.result-stars-col { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.result-stars-label { font: 600 0.6875rem/1 var(--mono); color: var(--text); text-transform: uppercase; letter-spacing: .06em; }
.result-rating-num { font: 700 1.6rem/1 var(--mono); color: var(--ink); }
.stars-display { display: flex; gap: 3px; }
.star { width: 26px; height: 26px; }
.star--full polygon { fill: var(--gold); stroke: var(--gold); }
.star--empty polygon { fill: none; stroke: var(--border); }
.star--partial .star-fill { fill: var(--gold); }
.result-damage-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; width: 100%; }
.damage-cell { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 16px; background: var(--bg-alt); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.damage-val { font: 700 1.4rem/1 var(--mono); color: var(--ink); }
.damage-label { font: 400 0.75rem/1.3 var(--sans); color: var(--text); text-align: center; }
.damage-bars { width: 100%; display: flex; flex-direction: column; gap: 14px; text-align: start; }
.damage-bar-row { display: flex; flex-direction: column; gap: 6px; }
.damage-bar-label { font: 600 0.75rem/1 var(--mono); letter-spacing: .04em; color: var(--text); }
.damage-bar-track { width: 100%; height: 8px; border-radius: 4px; background: var(--border); overflow: hidden; }
.damage-bar-fill { height: 100%; border-radius: 4px; background: var(--accent); transition: width .8s cubic-bezier(.4,0,.2,1); }
.damage-bar-fill--ideal { background: var(--success); }

/* ── Widget areas ── */
.home-widget-area { max-width: var(--wrap); margin: 0 auto; padding: 40px 40px 0; }
.home-widget-area--services { padding: 0 40px 40px; }
.widget { margin-bottom: 30px; }
.widget-title { font: 700 1.25rem/1.3 var(--serif); color: var(--ink-2); margin: 0 0 14px; }

/* ── CTA Band ── */
.cta-band { background: var(--ink); padding: 80px 40px; text-align: center; }
.cta-band-inner { max-width: 640px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: 16px; }
.cta-band-title { font: 700 clamp(1.375rem,2.8vw,1.875rem)/1.25 var(--serif); color: #fff; margin: 0; }
.cta-band-sub { color: rgba(255,255,255,.55); font-size: 1rem; font-weight: 400; line-height: 1.7; margin: 0; }

/* ============================================================
   Chart Section
   ============================================================ */
.chart-section { background: var(--bg-alt); border-block-start: 1px solid var(--border); padding: var(--section-v) 40px; }
.chart-section-inner { max-width: var(--wrap); margin: 0 auto; }
.chart-header { margin-block-end: 36px; }
.chart-eyebrow {
  font: 600 0.6875rem/1 var(--mono) !important; letter-spacing: .16em; text-transform: uppercase;
  color: var(--accent) !important; margin-block-end: 12px !important;
}
.chart-title { font: 700 clamp(1.375rem,2.8vw,2rem)/1.3 var(--serif); color: var(--ink); margin: 0 0 8px; }
.chart-sub   { font: 400 0.8125rem/1.5 var(--mono); color: var(--muted); margin: 0; }
.chart-canvas-wrap { width: 100%; }
.chart-canvas-wrap canvas { width: 100%; display: block; }

/* ============================================================
   Motto Section
   ============================================================ */
.motto-section { border-block:1px solid var(--border); }
.motto-inner {
  max-width:var(--wrap); margin:0 auto;
  padding:72px clamp(24px,4vw,40px);
  display:flex; align-items:baseline; gap:32px; flex-wrap:wrap;
}
.motto-eyebrow { font:600 0.6875rem/1 var(--mono); letter-spacing:.16em; text-transform:uppercase; color:var(--muted); flex:none; }
.motto-h { font:700 clamp(1.875rem,4vw,3.25rem)/1.1 var(--serif); color:var(--ink); margin:0; }
.motto-h .accent-word { color:var(--accent); }

/* ============================================================
   Services — Pillar cards + Niche grid
   ============================================================ */
.services-section { background:var(--bg-alt); border-block:1px solid var(--border-2); padding:var(--section-v) max(40px, calc((100% - var(--wrap)) / 2 + 40px)); }
.services-section-inner { max-width:var(--wrap); margin:0 auto; }
.services-header { margin-block-end:40px; }
.services-eyebrow { font:600 0.6875rem/1 var(--mono); letter-spacing:.16em; text-transform:uppercase; color:var(--accent); margin:0 0 14px; }
.services-title { font:700 clamp(1.625rem,3.2vw,2.375rem)/1.2 var(--serif); color:var(--ink); margin:0; }
.pillars-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.pillar-card {
  background:var(--surface); border:1px solid var(--border);
  border-block-start:3px solid var(--accent); padding:40px 36px;
  display:flex; flex-direction:column; gap:20px; text-decoration:none; color:var(--text);
  transition:box-shadow .2s, transform .2s;
}
.pillar-card:hover { box-shadow:0 16px 40px rgba(23,26,23,.08); transform:translateY(-2px); }
.pillar-card-tag { font:600 0.6875rem/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--accent); }
.pillar-card-title { font:700 1.375rem/1.3 var(--serif); color:var(--ink); margin:0; }
.pillar-card-lead { font:400 0.9375rem/1.7 var(--sans); color:var(--text); margin:0; flex:1; }
.pillar-items { list-style:none; padding:0; margin:0; border-block-start:1px solid var(--border); }
.pillar-items li {
  display:flex; gap:12px; align-items:baseline; padding-block:13px;
  border-block-end:1px solid var(--border-2); font:400 0.9063rem/1 var(--sans); color:var(--muted);
}
.pillar-items .dot { width:14px; height:5px; background:var(--accent); flex:none; border-radius:1px; }
.pillar-cta { font:600 0.8125rem/1 var(--mono); color:var(--accent); display:flex; align-items:center; gap:6px; }
.niche-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-block-start:24px; }
.niche-block { border-block-start:1px solid var(--border); padding-block-start:22px; text-decoration:none; color:var(--text); display:block; }
.niche-block:hover .niche-title { color:var(--accent); }
.niche-tag { font:600 0.6875rem/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-block-end:8px; display:block; }
.niche-title { font:600 1.0625rem/1.35 var(--serif); color:var(--ink); margin:0 0 6px; transition:color .2s; }
.niche-body { font:400 0.8438rem/1.65 var(--sans); color:var(--muted); margin:0; }

/* ============================================================
   About Section — 2-col (updated to match Figma)
   ============================================================ */
.about-section { background:var(--bg-alt); border-block:1px solid var(--border); }
.about-inner {
  max-width:var(--wrap); margin:0 auto;
  padding:var(--section-v) clamp(24px,4vw,40px);
  display:grid; grid-template-columns:1fr 1.1fr; gap:72px; align-items:start;
}
.about-eyebrow { font:600 0.6875rem/1 var(--mono); letter-spacing:.16em; text-transform:uppercase; color:var(--accent); margin:0 0 18px; }
.about-title { font:700 clamp(1.625rem,3.2vw,2.375rem)/1.2 var(--serif); color:var(--ink); margin:0 0 20px; }
.about-lead { font:500 1.0625rem/1.75 var(--sans); color:var(--ink); margin:0 0 16px; }
.about-body { font:400 0.9375rem/1.8 var(--sans); color:var(--text); margin:0; }
.about-principles { margin:0; padding:0; display:flex; flex-direction:column; border-block-start:1px solid var(--border); }
.principle-item { display:flex; gap:24px; align-items:baseline; padding-block:20px; border-block-end:1px solid var(--border); }
.principle-label { font:600 0.8125rem/1 var(--mono); color:var(--accent); letter-spacing:.04em; flex:none; width:100px; }
.principle-desc { font:400 0.9063rem/1.75 var(--sans); color:var(--text); margin:0; }

/* ============================================================
   Service page body grid + sticky sidebar
   ============================================================ */
.svc-hero-section { border-block-end:1px solid var(--border); padding:28px 0 64px; }
.svc-hero-inner { max-width:var(--wrap); margin:0 auto; padding-inline:clamp(24px,4vw,40px); }
.svc-hero-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:start; }
.svc-hero-eyebrow { font:600 0.6875rem/1 var(--mono); letter-spacing:.16em; text-transform:uppercase; color:var(--accent); margin:0 0 16px; display:flex; align-items:center; gap:10px; }
.svc-hero-eyebrow::before { content:''; display:block; width:24px; height:1px; background:var(--accent); flex:none; }
.svc-hero-h1 { font:700 clamp(2rem,4.5vw,3.25rem)/1.1 var(--serif); color:var(--ink); margin:0 0 22px; letter-spacing:-.015em; }
.svc-hero-lead { font:400 1.125rem/1.8 var(--sans); color:var(--text); margin:0 0 32px; }
.svc-hero-actions { display:flex; gap:12px; flex-wrap:wrap; }
.svc-hero-figure { width:100%; height:400px; object-fit:cover; border-radius:4px; display:block; }
.svc-body-wrap { max-width:var(--wrap); margin:0 auto; padding:72px clamp(24px,4vw,40px); }
.svc-body-grid { display:grid; grid-template-columns:1fr 300px; gap:72px; align-items:start; }
.svc-sidebar { position:sticky; top:96px; display:flex; flex-direction:column; gap:20px; }
.sidebar-dark-box { background:var(--ink); color:#EAE7DF; padding:28px 26px; border-radius:4px; }
.sidebar-dark-box-title { font:600 0.75rem/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:rgba(234,231,223,.45); margin:0 0 18px; }
.sidebar-facts { margin:0 0 22px; padding:0; display:flex; flex-direction:column; }
.sidebar-facts-row { display:flex; justify-content:space-between; gap:12px; padding-block:12px; border-block-end:1px solid rgba(234,231,223,.1); font-size:0.8438rem; }
.sidebar-facts-row:last-child { border-block-end:none; }
.sidebar-fact-key { color:rgba(234,231,223,.5); font-family:var(--mono); font-size:0.75rem; }
.sidebar-fact-val { color:#EAE7DF; font-weight:600; }
.sidebar-cta-btn { display:block; width:100%; padding:14px; background:var(--accent); color:#fff; text-align:center; font:600 0.8125rem/1 var(--sans); border-radius:2px; text-decoration:none; transition:background .2s; margin-block-end:10px; }
.sidebar-cta-btn:hover { background:var(--accent-h); color:#fff; }
.sidebar-wa-link { display:flex; align-items:center; gap:8px; color:rgba(234,231,223,.55); font:400 0.8125rem/1 var(--sans); text-decoration:none; justify-content:center; padding-block-start:2px; }
.sidebar-wa-link:hover { color:#EAE7DF; }
.sidebar-light-box { border:1px solid var(--border); background:var(--surface); padding:22px 24px; border-radius:4px; }
.sidebar-light-box-title { font:600 0.75rem/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin:0 0 16px; }
.sidebar-related-links { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:0; }
.sidebar-related-links a { display:block; padding-block:10px; border-block-end:1px solid var(--border-2); font:400 0.875rem/1.3 var(--sans); color:var(--text); text-decoration:none; }
.sidebar-related-links a:hover { color:var(--accent); }
.svc-blockquote { margin:8px 0 30px; padding:24px 30px; background:var(--surface); border:1px solid var(--border); border-inline-start:3px solid var(--accent); }
.svc-blockquote p { font:500 1.1875rem/1.6 var(--serif); color:var(--ink); margin:0; }
.svc-process-steps { margin:32px 0; display:flex; flex-direction:column; }
.svc-process-row { display:grid; grid-template-columns:60px 1fr; gap:20px; align-items:baseline; padding-block:20px; border-block-end:1px solid var(--border); }
.svc-process-row:first-child { border-block-start:1px solid var(--border); }
.svc-process-num { font:500 0.8125rem/1 var(--mono); color:var(--muted); letter-spacing:.12em; }
.svc-bottom-cta { background:var(--bg-alt); border-block:1px solid var(--border-2); padding:56px max(40px, calc((100% - var(--wrap)) / 2 + 40px)); }
.svc-bottom-cta-inner { max-width:var(--wrap); margin:0 auto; display:flex; justify-content:space-between; align-items:center; gap:32px; flex-wrap:wrap; }
.svc-bottom-cta h2 { font:700 clamp(1.25rem,2.5vw,1.75rem)/1.3 var(--serif); color:var(--ink); margin:0; }

/* ============================================================
   About Page — sticky sidebar sections layout
   ============================================================ */
.about-page-hero { max-width:1000px; margin:0 auto; padding:56px max(40px, calc((100% - 1000px) / 2 + 40px)) 40px; }
.about-page-eyebrow { font:600 0.6875rem/1 var(--mono); letter-spacing:.16em; text-transform:uppercase; color:var(--gold); margin:0 0 16px; display:flex; align-items:center; gap:10px; }
.about-page-eyebrow::before { content:''; display:block; width:24px; height:1px; background:var(--gold); flex:none; }
.about-page-h1 { font:700 clamp(1.875rem,4vw,3rem)/1.1 var(--serif); color:var(--ink); margin:0 0 18px; letter-spacing:-.015em; }
.about-page-lead { font:400 1.125rem/1.8 var(--sans); color:var(--text); margin:0; max-width:600px; }
.about-page-section { max-width:1000px; margin:0 auto; padding:0 max(40px, calc((100% - 1000px) / 2 + 40px)); }
.about-page-section + .about-page-section { margin-block-start:72px; }
.about-layout { display:grid; grid-template-columns:180px 1fr; gap:56px; align-items:start; }
.about-sticky-label { font:500 0.7813rem/1 var(--mono); letter-spacing:.14em; color:var(--muted); margin:0; position:sticky; top:100px; }
.principle-row { display:grid; grid-template-columns:200px 1fr; gap:28px; padding-block:26px; border-block-end:1px solid var(--border); align-items:start; }
.principle-row:first-child { border-block-start:1px solid var(--border); }
.principle-row-title { font:600 1rem/1.3 var(--serif); color:var(--accent); margin:0; }
.principle-row-body { font:400 0.9375rem/1.8 var(--sans); color:var(--text); margin:0; }
.team-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.team-card { background:var(--surface); border:1px solid var(--border); border-block-start:3px solid var(--accent); padding:26px 24px; }
.team-initial { width:44px; height:44px; background:var(--ink); color:var(--gold); display:grid; place-items:center; font:700 1.25rem/1 var(--serif); border-radius:2px; margin-block-end:16px; }
.team-role { font:600 0.8125rem/1 var(--mono); letter-spacing:.04em; color:var(--accent); margin:0 0 8px; }
.team-desc { font:400 0.875rem/1.7 var(--sans); color:var(--muted); margin:0; }
.about-cta-band { background:var(--ink); padding:64px max(40px, calc((100% - var(--wrap)) / 2 + 40px)); margin-block-start:88px; }
.about-cta-inner { max-width:var(--wrap); margin:0 auto; display:flex; justify-content:space-between; align-items:center; gap:32px; flex-wrap:wrap; }
.about-cta-text h2 { font:700 clamp(1.375rem,2.8vw,1.875rem)/1.2 var(--serif); color:#EAE7DF; margin:0 0 10px; }
.about-cta-text p { font:400 0.9375rem/1.7 var(--sans); color:rgba(234,231,223,.55); margin:0; }
.about-cta-actions { display:flex; gap:12px; flex-wrap:wrap; }

/* ============================================================
   Contact Page — 2-col with terminal form
   ============================================================ */
.contact-page-hero { max-width:var(--wrap); margin:0 auto; padding:56px clamp(24px,4vw,40px) 40px; }
.contact-page-grid { max-width:var(--wrap); margin:0 auto; padding:0 clamp(24px,4vw,40px) 96px; display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:start; }
.contact-page-left h1 { font:700 clamp(1.75rem,3.5vw,2.75rem)/1.2 var(--serif); color:var(--ink); margin:0 0 20px; }
.contact-page-left .lead { font:400 1.0625rem/1.8 var(--sans); color:var(--text); margin:0 0 28px; }
.contact-form-widget { background:var(--surface); border:1px solid var(--border); border-radius:4px; }
.form-widget-bar { padding:14px 20px; border-block-end:1px solid var(--border-2); display:flex; align-items:center; gap:10px; }
.form-widget-label { font:400 0.75rem/1 var(--mono); color:var(--muted); flex:1; }
.form-widget-cursor { color:var(--accent); }
.form-widget-body { padding:32px 28px; }
.contact-form-new { display:flex; flex-direction:column; gap:20px; }
.form-field { display:flex; flex-direction:column; gap:7px; }
.form-field label { font:600 0.75rem/1 var(--mono); letter-spacing:.04em; color:var(--muted); }
.form-field input, .form-field select, .form-field textarea {
  background:var(--bg-alt); border:1px solid var(--border); border-radius:2px;
  color:var(--ink); font:400 0.9375rem/1.5 var(--sans); padding:12px 14px;
  outline:none; width:100%; transition:border-color .2s;
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus { border-color:var(--accent); background:var(--bg); }
.form-field textarea { resize:vertical; min-height:110px; }
.form-submit-btn { background:var(--ink); color:#EAE7DF; border:none; border-radius:2px; padding:16px; font:600 0.8125rem/1 var(--sans); cursor:pointer; width:100%; transition:background .2s; letter-spacing:.02em; }
.form-submit-btn:hover { background:var(--accent); }
.form-success-state { display:none; padding:24px 28px; text-align:center; }
.form-success-state.visible { display:block; }
.form-success-code { font:700 1.75rem/1 var(--mono); color:var(--accent); margin-block-end:12px; }
.form-success-sub { font:400 0.9375rem/1.65 var(--sans); color:var(--muted); margin:0; }

/* ============================================================
   Category landing — Reputation / SEO hero visuals
   ============================================================ */
.category-hero { max-width:var(--wrap); margin:0 auto; padding:56px clamp(24px,4vw,40px) 72px; }
.category-hero-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; }
.category-hero-eyebrow { font:600 0.6875rem/1 var(--mono); letter-spacing:.16em; text-transform:uppercase; color:var(--accent); margin:0 0 16px; display:flex; align-items:center; gap:10px; }
.category-hero-eyebrow::before { content:''; display:block; width:24px; height:1px; background:var(--accent); flex:none; }
.category-hero-h1 { font:700 clamp(1.875rem,4vw,3.125rem)/1.1 var(--serif); color:var(--ink); margin:0 0 20px; letter-spacing:-.015em; }
.category-hero-lead { font:400 1.0625rem/1.8 var(--sans); color:var(--text); margin:0 0 32px; }
.category-hero-actions { display:flex; gap:12px; flex-wrap:wrap; }
/* SERP dossier mini — category hero right */
.serp-dossier-mini { background:var(--surface); border:1px solid var(--border); border-radius:4px; padding:20px 22px; }
.serp-dossier-label { font:600 0.625rem/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin:0 0 14px; }
.serp-dossier-row { display:flex; align-items:center; gap:12px; padding-block:10px; border-block-end:1px solid var(--border-2); font:400 0.8125rem/1.35 var(--sans); }
.serp-dossier-row:last-child { border-block-end:none; }
.serp-status-badge { font:600 0.6875rem/1 var(--mono); letter-spacing:.06em; padding:4px 10px; border-radius:2px; flex:none; }
.serp-status-badge--removed { background:rgba(30,72,55,.1); color:var(--accent); }
.serp-status-badge--suppressed { background:rgba(168,137,74,.1); color:var(--gold); }
.serp-status-badge--p1 { background:var(--accent-bg); color:var(--success); }
/* Rank climb chart */
.rank-chart { display:flex; flex-direction:column; gap:18px; padding:24px; background:var(--surface); border:1px solid var(--border); border-radius:4px; }
.rank-chart-title { font:600 0.6875rem/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin:0 0 6px; }
.rank-bar-row { display:grid; grid-template-columns:68px 1fr 36px; gap:12px; align-items:center; }
.rank-bar-label { font:500 0.75rem/1 var(--mono); color:var(--muted); }
.rank-bar-track { height:8px; background:var(--border); border-radius:2px; overflow:hidden; }
.rank-bar-fill { height:100%; background:var(--accent); border-radius:2px; transition:width 1.2s cubic-bezier(.16,1,.3,1); }
.rank-bar-pos { font:700 0.8125rem/1 var(--mono); color:var(--ink); text-align:end; }
/* Services 3-col grid */
.services-3-grid { max-width:var(--wrap); margin:0 auto; padding:0 clamp(24px,4vw,40px) 72px; display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.svc-mini-card { background:var(--surface); border:1px solid var(--border); border-block-start:3px solid var(--accent); padding:28px 24px; text-decoration:none; color:var(--text); display:block; transition:box-shadow .2s, transform .2s; }
.svc-mini-card:hover { box-shadow:0 12px 32px rgba(23,26,23,.07); transform:translateY(-2px); }
.svc-mini-num { font:500 0.75rem/1 var(--mono); color:var(--muted); letter-spacing:.12em; display:block; margin-block-end:14px; }
.svc-mini-title { font:600 1.125rem/1.3 var(--serif); color:var(--ink); margin:0 0 10px; }
.svc-mini-body { font:400 0.875rem/1.65 var(--sans); color:var(--muted); margin:0; }
/* Audiences 3-col */
.audiences-section { background:var(--bg-alt); border-block:1px solid var(--border-2); padding:72px max(40px, calc((100% - var(--wrap)) / 2 + 40px)); }
.audiences-inner { max-width:var(--wrap); margin:0 auto; }
.audiences-header { margin-block-end:36px; }
.audiences-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.audience-card { background:var(--surface); border:1px solid var(--border); padding:28px 24px; border-radius:2px; }
.audience-card-title { font:600 1.125rem/1.3 var(--serif); color:var(--ink); margin:0 0 10px; }
.audience-card-body { font:400 0.875rem/1.7 var(--sans); color:var(--muted); margin:0; }
/* Dark CTA band */
.dark-cta-band { background:var(--ink); padding:64px max(40px, calc((100% - var(--wrap)) / 2 + 40px)); }
.dark-cta-inner { max-width:var(--wrap); margin:0 auto; display:flex; justify-content:space-between; align-items:center; gap:32px; flex-wrap:wrap; }
.dark-cta-text h2 { font:700 clamp(1.375rem,2.8vw,1.875rem)/1.2 var(--serif); color:#EAE7DF; margin:0 0 10px; }
.dark-cta-text p { font:400 0.9375rem/1.7 var(--sans); color:rgba(234,231,223,.55); margin:0; }
.dark-cta-actions { display:flex; gap:12px; flex-wrap:wrap; }
.dark-cta-actions .btn-dark { background:#EAE7DF; color:var(--ink); padding:14px 28px; border-radius:2px; font:600 0.8125rem/1 var(--sans); text-decoration:none; display:inline-flex; align-items:center; transition:opacity .2s; }
.dark-cta-actions .btn-dark:hover { opacity:.88; color:var(--ink); }
.dark-cta-actions .btn-wa { background:rgba(37,211,102,.12); color:#25D366; border:1px solid rgba(37,211,102,.3); padding:14px 28px; border-radius:2px; font:600 0.8125rem/1 var(--sans); text-decoration:none; display:inline-flex; align-items:center; gap:8px; transition:background .2s; }
.dark-cta-actions .btn-wa:hover { background:rgba(37,211,102,.2); }
/* Category related card */
.category-related { max-width:var(--wrap); margin:0 auto; padding:56px clamp(24px,4vw,40px); }
.category-related-card { display:grid; grid-template-columns:1fr auto; gap:24px; align-items:center; background:var(--surface); border:1px solid var(--border); border-block-start:3px solid var(--gold); padding:28px 32px; text-decoration:none; color:var(--text); transition:border-color .2s; }
.category-related-card:hover { border-color:var(--accent); }
.category-related-card h3 { font:600 1.1875rem/1.3 var(--serif); color:var(--ink); margin:0 0 6px; }
.category-related-card p { font:400 0.875rem/1.6 var(--sans); color:var(--muted); margin:0; }

/* ============================================================
   Knowledge Centre — rewrite
   ============================================================ */
.kc-hero { max-width:var(--wrap); margin:0 auto; padding:56px clamp(24px,4vw,40px) 48px; }
.kc-tools-section { max-width:var(--wrap); margin:0 auto; padding:0 clamp(24px,4vw,40px) 64px; }
.kc-tools-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.kc-tool-card { background:var(--surface); border:1px solid var(--border); border-block-start:3px solid var(--accent); border-radius:4px; overflow:hidden; text-decoration:none; color:var(--text); display:flex; flex-direction:column; transition:box-shadow .2s; }
.kc-tool-card:hover { box-shadow:0 12px 32px rgba(23,26,23,.07); }
.kc-tool-bar { display:flex; align-items:center; gap:8px; padding:12px 16px; border-block-end:1px solid var(--border-2); font:400 0.75rem/1 var(--mono); color:var(--muted); }
.kc-tool-body { padding:22px 20px 26px; display:flex; flex-direction:column; gap:10px; flex:1; }
.kc-tool-cmd { font:500 0.875rem/1 var(--mono); color:var(--accent); }
.kc-tool-title { font:600 1.125rem/1.3 var(--serif); color:var(--ink); margin:0; }
.kc-tool-desc { font:400 0.875rem/1.65 var(--sans); color:var(--muted); margin:0; flex:1; }
.kc-guides-section { max-width:var(--wrap); margin:0 auto; padding:0 clamp(24px,4vw,40px) 64px; }
.guide-grid-2 { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
.guide-card { background:var(--surface); border:1px solid var(--border); padding:28px 24px; text-decoration:none; color:var(--text); display:flex; flex-direction:column; gap:10px; transition:border-block-start-color .2s; border-block-start:3px solid transparent; }
.guide-card:hover { border-block-start-color:var(--accent); }
.guide-tag { font:600 0.6875rem/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--accent); }
.guide-title { font:600 1.125rem/1.3 var(--serif); color:var(--ink); margin:0; }
.guide-body { font:400 0.875rem/1.65 var(--sans); color:var(--muted); margin:0; flex:1; }
.guide-count { font:500 0.75rem/1 var(--mono); color:var(--muted); }
.kc-cta-strip { max-width:var(--wrap); margin:0 auto; padding:0 clamp(24px,4vw,40px) 96px; }
.kc-cta-strip-inner { background:var(--bg-alt); border:1px solid var(--border-2); padding:40px 44px; display:flex; justify-content:space-between; align-items:center; gap:32px; flex-wrap:wrap; }
.kc-cta-text h2 { font:700 clamp(1.25rem,2.4vw,1.625rem)/1.3 var(--serif); color:var(--ink); margin:0 0 8px; }
.kc-cta-text p { font:400 0.9375rem/1.65 var(--sans); color:var(--muted); margin:0; }

/* ============================================================
   Articles listing page
   ============================================================ */
.articles-hero { max-width:var(--wrap); margin:0 auto; padding:56px clamp(24px,4vw,40px) 48px; }
.articles-featured { max-width:var(--wrap); margin:0 auto; padding:0 clamp(24px,4vw,40px) 48px; }
.featured-article-card { display:grid; grid-template-columns:1.2fr 1fr; background:var(--ink); color:#EAE7DF; border-radius:4px; overflow:hidden; text-decoration:none; min-height:300px; transition:opacity .2s; }
.featured-article-card:hover { opacity:.92; }
.featured-article-body { padding:44px 40px; display:flex; flex-direction:column; gap:16px; }
.featured-article-topic { font:600 0.6875rem/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:rgba(234,231,223,.5); }
.featured-article-title { font:700 clamp(1.375rem,2.5vw,1.875rem)/1.25 var(--serif); color:#EAE7DF; margin:0; }
.featured-article-excerpt { font:400 0.9375rem/1.7 var(--sans); color:rgba(234,231,223,.6); margin:0; flex:1; }
.featured-article-meta { font:400 0.75rem/1 var(--mono); color:rgba(234,231,223,.4); }
.featured-article-deco { background:radial-gradient(ellipse at 50% 50%, rgba(30,72,55,.3) 0%, transparent 70%); }
.articles-section { max-width:var(--wrap); margin:0 auto; padding:0 clamp(24px,4vw,40px) 64px; }
.filter-bar { display:flex; gap:10px; flex-wrap:wrap; padding-block-end:24px; border-block-end:1px solid var(--border); margin-block-end:40px; }
.filter-btn { font:500 0.7813rem/1 var(--mono); letter-spacing:.06em; padding:9px 18px; border:1px solid var(--border); border-radius:2px; cursor:pointer; background:transparent; color:var(--text); transition:background .15s, color .15s, border-color .15s; }
.filter-btn:hover { border-color:var(--accent); color:var(--accent); }
.filter-btn[aria-pressed="true"] { background:var(--ink); color:#EAE7DF; border-color:var(--ink); }
.articles-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.article-card-new { text-decoration:none; color:var(--text); display:flex; flex-direction:column; gap:12px; }
.article-card-top { height:6px; border-radius:1px; background:var(--border); margin-block-end:6px; }
.article-card-new:nth-child(3n+1) .article-card-top { background:var(--accent); }
.article-card-new:nth-child(3n+2) .article-card-top { background:var(--gold); }
.article-card-topic { font:600 0.6875rem/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--muted); }
.article-card-title { font:600 1.1875rem/1.35 var(--serif); color:var(--ink); margin:0; transition:color .2s; }
.article-card-new:hover .article-card-title { color:var(--accent); }
.article-card-excerpt { font:400 0.875rem/1.65 var(--sans); color:var(--muted); margin:0; flex:1; }
.article-card-meta { font:400 0.7188rem/1 var(--mono); color:var(--muted); opacity:.7; }
.newsletter-strip { max-width:var(--wrap); margin:0 auto; padding:0 clamp(24px,4vw,40px) 96px; }
.newsletter-strip-inner { background:var(--bg-alt); border:1px solid var(--border-2); padding:48px 44px; display:grid; grid-template-columns:1fr auto; gap:40px; align-items:center; }
.newsletter-text h2 { font:700 1.375rem/1.3 var(--serif); color:var(--ink); margin:0 0 8px; }
.newsletter-text p { font:400 0.9375rem/1.65 var(--sans); color:var(--muted); margin:0; }
.newsletter-form { display:flex; gap:10px; }
.newsletter-input { background:var(--bg); border:1px solid var(--border); border-radius:2px; padding:12px 16px; font:400 0.875rem/1 var(--sans); color:var(--ink); width:260px; outline:none; }
.newsletter-input:focus { border-color:var(--accent); }
.newsletter-submit { background:var(--ink); color:#EAE7DF; border:none; border-radius:2px; padding:12px 22px; font:600 0.8125rem/1 var(--sans); cursor:pointer; white-space:nowrap; transition:background .2s; }
.newsletter-submit:hover { background:var(--accent); }

/* ============================================================
   Article (single.php) — prose styles
   ============================================================ */
.article-header { max-width:760px; margin:0 auto; padding:44px max(24px, calc((100% - 760px) / 2 + 24px)) 32px; }
.article-standfirst { font:500 1.25rem/1.7 var(--sans); color:var(--text); margin:0 0 24px; }
.author-bar { display:flex; align-items:center; gap:14px; padding-block:18px; border-block:1px solid var(--border); }
.author-initial { width:36px; height:36px; background:var(--ink); color:var(--gold); display:grid; place-items:center; font:700 1rem/1 var(--serif); border-radius:2px; flex:none; }
.author-name-wrap { display:flex; flex-direction:column; gap:4px; }
.author-name { font:600 0.875rem/1 var(--sans); color:var(--ink); }
.author-meta { font:400 0.7188rem/1 var(--mono); color:var(--muted); }
.article-summary { max-width:760px; margin:0 auto 0; padding:0 max(24px, calc((100% - 760px) / 2 + 24px)); }
.article-summary-card { background:var(--surface); border:1px solid var(--border); border-block-start:3px solid var(--accent); padding:28px 30px; margin-block:32px; }
.article-summary-title { font:700 0.8125rem/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin:0 0 16px; }
.article-summary-list { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; }
.article-summary-list li { display:flex; gap:14px; align-items:baseline; padding-block:12px; border-block-end:1px solid var(--border-2); font:400 0.9375rem/1.6 var(--sans); color:var(--text); }
.article-summary-list li::before { content:''; width:15px; height:5px; background:var(--accent); flex:none; border-radius:1px; }
.article-body-wrap { max-width:760px; margin:0 auto; padding:0 clamp(24px,4vw,32px); }
.article-wide-figure { max-width:940px; margin:0 auto 40px; padding-inline:max(24px, calc((100% - 940px) / 2 + 24px)); }
.article-wide-figure img { width:100%; border-radius:4px; display:block; }
.prose p { font:400 1.125rem/1.95 var(--sans); color:var(--text); margin:0 0 22px; }
.prose h2 { font:700 clamp(1.3125rem,2.4vw,1.75rem)/1.3 var(--serif); color:var(--ink); margin:44px 0 16px; }
.prose ul { list-style:none; padding:0; margin:0 0 28px; border-block-start:1px solid var(--border); }
.prose li { display:flex; gap:14px; align-items:baseline; padding-block:13px; border-block-end:1px solid var(--border-2); font:400 1.0313rem/1.7 var(--sans); color:var(--text); }
.prose li::before { content:''; width:15px; height:5px; background:var(--accent); flex:none; border-radius:1px; }
.prose blockquote { margin:8px 0 30px; padding:24px 30px; background:var(--surface); border:1px solid var(--border); border-inline-start:3px solid var(--accent); }
.prose blockquote p { font:500 1.1875rem/1.6 var(--serif); color:var(--ink-2); margin:0; }
.article-tags-share { max-width:760px; margin:0 auto; padding:20px max(24px, calc((100% - 760px) / 2 + 24px)) 32px; display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; border-block-start:1px solid var(--border); }
.article-tags { display:flex; gap:8px; flex-wrap:wrap; }
.article-tag { font:400 0.75rem/1 var(--mono); padding:6px 12px; border:1px solid var(--border); border-radius:2px; color:var(--muted); text-decoration:none; }
.article-tag:hover { border-color:var(--accent); color:var(--accent); }
.article-share-btn { font:400 0.8125rem/1 var(--sans); color:var(--muted); text-decoration:none; display:flex; align-items:center; gap:6px; }
.article-inline-cta { max-width:760px; margin:0 auto 56px; padding-inline:max(24px, calc((100% - 760px) / 2 + 24px)); }
.article-inline-cta-inner { background:var(--ink); padding:36px 32px; border-radius:4px; display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap; }
.article-inline-cta h2 { font:700 clamp(1.125rem,2vw,1.5rem)/1.3 var(--serif); color:#EAE7DF; margin:0; }
.article-inline-cta-actions { display:flex; gap:10px; flex-wrap:wrap; }
.article-related { border-block-start:1px solid var(--border); }
.article-related-inner { max-width:var(--wrap); margin:0 auto; padding:56px clamp(24px,4vw,40px); }
.article-related-title { font:600 0.6875rem/1 var(--mono); letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin:0 0 32px; }
.article-related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.related-article-card { text-decoration:none; color:var(--text); padding-block-start:20px; border-block-start:1px solid var(--border); display:flex; flex-direction:column; gap:10px; }
.related-article-topic { font:600 0.6875rem/1 var(--mono); letter-spacing:.10em; text-transform:uppercase; color:var(--muted); }
.related-article-title { font:600 1.0625rem/1.35 var(--serif); color:var(--ink); margin:0; transition:color .2s; }
.related-article-card:hover .related-article-title { color:var(--accent); }

/* ============================================================
   Legal pages — narrow prose
   ============================================================ */
.legal-body { max-width:820px; margin:0 auto; padding:56px clamp(24px,5vw,60px) 88px; }
.legal-body .legal-eyebrow { font:600 0.6875rem/1 var(--mono); letter-spacing:.16em; text-transform:uppercase; color:var(--accent); margin:0 0 14px; }
.legal-body h1 { font:700 clamp(1.625rem,3vw,2.25rem)/1.2 var(--serif); color:var(--ink); margin:0 0 12px; }
.legal-date { font:400 0.75rem/1 var(--mono); color:var(--muted); margin:0 0 44px; }
.legal-body h2 { font:700 1.3125rem/1.3 var(--serif); color:var(--ink); margin:44px 0 14px; }
.legal-body p { font:400 1rem/1.85 var(--sans); color:var(--text); margin:0 0 16px; }
.legal-body a { color:var(--accent); }
.legal-body ul { padding-inline-start:22px; margin:0 0 22px; }
.legal-body li { font:400 1rem/1.8 var(--sans); color:var(--text); margin-block-end:8px; }
.legal-contact-row { margin-block-start:40px; padding-block-start:32px; border-block-start:1px solid var(--border); display:flex; gap:16px; flex-wrap:wrap; }

/* ============================================================
   Footer — 5-col dark #101310
   ============================================================ */
.site-footer { background:#101310; color:#9EA096; border-block-start:1px solid rgba(234,231,223,.14); }
.footer-grid { max-width:var(--wrap); margin:0 auto; padding:70px clamp(24px,4vw,40px) 0; display:grid; grid-template-columns:1.8fr 1fr 1fr 1fr 1.3fr; gap:40px; }
.footer-col h4 { font:500 0.75rem/1 var(--mono); letter-spacing:.14em; text-transform:uppercase; color:#EAE7DF; margin:0 0 16px; }
.footer-col a { color:#9EA096; text-decoration:none; font:400 0.875rem/1 var(--sans); display:block; padding-block:5px; transition:color .15s; }
.footer-col a:hover { color:#EAE7DF; }
.footer-col--brand .brand-mark { width:38px; height:38px; background:#EAE7DF; color:var(--gold); display:grid; place-items:center; font:700 1.375rem/1 var(--serif); border-radius:2px; margin-block-end:12px; }
.footer-brand-name { font:700 1rem/1 var(--serif); color:#EAE7DF; margin:0 0 4px; }
.footer-tagline { font:500 0.75rem/1 var(--mono); letter-spacing:.12em; color:rgba(234,231,223,.5); margin:0 0 16px; }
.footer-desc { font:400 0.8438rem/1.75 var(--sans); color:#9EA096; margin:0; max-width:240px; }
.footer-brand-mark { text-decoration:none; display:block; }
.footer-contact-note { font:400 0.8438rem/1.7 var(--sans); color:#9EA096; margin:0 0 14px; }
.footer-contact-link { display:block; background:rgba(234,231,223,.08); border:1px solid rgba(234,231,223,.14); border-radius:2px; padding:12px 16px; font:600 0.8125rem/1 var(--sans); color:#EAE7DF; text-decoration:none; margin-block-end:12px; transition:background .2s; }
.footer-contact-link:hover { background:rgba(234,231,223,.14); color:#EAE7DF; }
.footer-wa-link { display:flex; align-items:center; gap:8px; font:400 0.8125rem/1 var(--sans); color:#9EA096; text-decoration:none; transition:color .15s; }
.footer-wa-link:hover { color:#25D366; }
.footer-wa-dot { width:8px; height:8px; background:#25D366; border-radius:50%; flex:none; }
.footer-bottom { max-width:var(--wrap); margin:0 auto; padding:22px clamp(24px,4vw,40px); margin-block-start:56px; border-block-start:1px solid rgba(234,231,223,.1); display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; font:400 0.7188rem/1 var(--mono); color:rgba(234,231,223,.35); }
.footer-legal-links { display:flex; gap:20px; }
.footer-legal-links a { color:rgba(234,231,223,.35); text-decoration:none; transition:color .15s; }
.footer-legal-links a:hover { color:rgba(234,231,223,.7); }

/* ============================================================
   Contact section (homepage CTA)
   ============================================================ */
.contact-section { background:var(--bg-alt); border-block:1px solid var(--border-2); }
.contact-inner { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; max-width:var(--wrap); margin:0 auto; padding:96px clamp(24px,4vw,40px); }
.contact-eyebrow { font:600 0.6875rem/1 var(--mono); letter-spacing:.16em; text-transform:uppercase; color:var(--gold); margin:0 0 16px; }
.contact-h2 { font:700 clamp(1.5rem,3vw,2.25rem)/1.2 var(--serif); color:var(--ink); margin:0 0 16px; }
.contact-sub { font:400 1rem/1.75 var(--sans); color:var(--text); margin:0 0 22px; }
.contact-bullets { list-style:none; padding:0; margin:0; border-block-start:1px solid var(--border); }
.contact-bullets li { padding-block:12px; border-block-end:1px solid var(--border-2); font:400 0.9063rem/1 var(--mono); color:var(--muted); display:flex; align-items:center; gap:10px; }
.contact-bullets li::before { content:''; width:14px; height:5px; background:var(--gold); border-radius:1px; flex:none; }
.contact-intake-card { background:var(--surface); border:1px solid var(--border); border-radius:4px; text-decoration:none; color:var(--text); display:block; transition:border-color .2s; }
.contact-intake-card:hover { border-color:var(--accent); }
.contact-intake-card-bar { padding:14px 20px; border-block-end:1px solid var(--border-2); display:flex; align-items:center; gap:8px; }
.intake-dot { width:10px; height:10px; border-radius:50%; flex:none; }
.intake-bar-label { font:400 0.75rem/1 var(--mono); color:var(--muted); flex:1; }
.blink-cursor { animation:blink 1s step-end infinite; color:var(--accent); font-family:var(--mono); }
@keyframes blink { 50% { opacity:0; } }
.contact-intake-card-body { padding:44px 36px 40px; display:flex; flex-direction:column; gap:20px; }
.intake-hint { font:400 1rem/1.75 var(--sans); color:var(--text); margin:0; }
.intake-wa { font:400 0.8125rem/1 var(--sans); color:var(--muted); display:flex; align-items:center; gap:8px; }
.intake-wa-dot { width:8px; height:8px; background:#25D366; border-radius:50%; flex:none; }

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width: 980px) {
  .footer-grid { grid-template-columns: 1fr 1fr 1fr; gap: 32px; }
  .card-grid { grid-template-columns: 1fr 1fr; }
  .home-hero-inner { grid-template-columns: 1fr; gap: 40px; }
  .home-hero-dossier { justify-content: flex-start; }
  .serp-dossier { max-width: 100%; }
  .about-inner { grid-template-columns: 1fr; gap: 40px; }
  .contact-main .inner { grid-template-columns: 1fr; gap: 40px; }
  .tools-hub-grid { grid-template-columns: repeat(2, 1fr); }
  .quiz-explainer { grid-template-columns: repeat(2, 1fr); }
  /* new sections */
  .pillars-grid { grid-template-columns: 1fr; }
  .niche-grid { grid-template-columns: 1fr 1fr; }
  .svc-hero-grid { grid-template-columns: 1fr; }
  .svc-body-grid { grid-template-columns: 1fr; }
  .svc-sidebar { position: static; }
  .contact-inner { grid-template-columns: 1fr; gap: 44px; padding-block: 64px; }
  .contact-page-grid { grid-template-columns: 1fr; gap: 44px; }
  .category-hero-grid { grid-template-columns: 1fr; }
  .services-3-grid { grid-template-columns: 1fr 1fr; }
  .audiences-grid { grid-template-columns: 1fr 1fr; }
  .articles-grid { grid-template-columns: 1fr 1fr; }
  .kc-tools-grid { grid-template-columns: 1fr 1fr; }
  .team-grid { grid-template-columns: 1fr 1fr; }
  .about-layout { grid-template-columns: 1fr; gap: 24px; }
  .about-sticky-label { position: static; }
  .principle-row { grid-template-columns: 1fr; gap: 8px; }
  .newsletter-strip-inner { grid-template-columns: 1fr; }
  .featured-article-card { grid-template-columns: 1fr; }
  .article-related-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 720px) {
  :root { --section-v: 60px; }

  .site-nav { min-height: 60px; position: relative; }
  .nav-toggle { display: flex; }
  .nav-links {
    display: none; position: absolute; top: 100%; inset-inline: 0;
    z-index: 200; flex-direction: column; align-items: flex-start; gap: 4px;
    background: rgba(23,26,23,.97); border-block-start: 1px solid rgba(234,231,223,.14);
    border-block-end: 1px solid rgba(234,231,223,.14); padding: 18px 22px 22px;
    box-shadow: 0 12px 40px rgba(0,0,0,.4);
  }
  .nav-links.nav--open { display: flex; }
  .nav-links a { padding: 10px 0; width: 100%; color: rgba(234,231,223,.8); }
  .nav-links a::after { display: none; }
  .nav-links .nav-cta { margin-top: 8px; }
  .lang-switcher { width: 100%; }
  .lang-drop { position: relative; top: auto; inset-inline-end: auto; width: 100%; }

  /* new 2-col grids */
  .process-step { grid-template-columns: 1fr; gap: 8px; }
  .about-inner { grid-template-columns: 1fr; gap: 32px; }
  .contact-inner { grid-template-columns: 1fr; gap: 32px; padding-block: 56px; }
  .contact-page-grid { grid-template-columns: 1fr; gap: 32px; }
  .svc-hero-grid { grid-template-columns: 1fr; }
  .svc-body-grid { grid-template-columns: 1fr; }
  .svc-sidebar { position: static; }
  .category-hero-grid { grid-template-columns: 1fr; }
  .services-3-grid { grid-template-columns: 1fr; }
  .audiences-grid { grid-template-columns: 1fr; }
  .niche-grid { grid-template-columns: 1fr; }
  .pillars-grid { grid-template-columns: 1fr; }
  .articles-grid { grid-template-columns: 1fr; }
  .article-related-grid { grid-template-columns: 1fr; }
  .kc-tools-grid { grid-template-columns: 1fr; }
  .guide-grid-2 { grid-template-columns: 1fr; }
  .team-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .dark-cta-inner { flex-direction: column; gap: 24px; }
  .svc-bottom-cta-inner { flex-direction: column; gap: 24px; }
  .about-cta-inner { flex-direction: column; gap: 24px; }
  .newsletter-strip-inner { grid-template-columns: 1fr; gap: 20px; }
  .newsletter-form { flex-direction: column; }
  .newsletter-input { width: 100%; }
  .featured-article-card { grid-template-columns: 1fr; }
  .featured-article-deco { display: none; }
  .motto-inner { flex-direction: column; gap: 12px; }
  .kc-cta-strip-inner { flex-direction: column; gap: 20px; }
  .about-layout { grid-template-columns: 1fr; }
  .about-sticky-label { position: static; }

  .home-hero { padding: 72px 22px 56px; }
  .home-hero-inner { grid-template-columns: 1fr; gap: 32px; }
  .home-hero h1 { font-size: 2.375rem; }
  .home-hero .lead { font-size: 1rem; }
  .home-hero-dossier { display: none; }
  .hero-media { padding: 0 22px 44px; }
  .hero { padding: 44px 22px 36px; }
  .hero h1 { font-size: 2.25rem; }
  .hero .lead { font-size: 1.0625rem; }
  .breadcrumb { padding-inline: 22px; }
  .content { padding-inline: 22px; }
  .inline-cta { padding-inline: 22px; }
  .inline-cta .box { flex-direction: column; align-items: flex-start; }
  .section, .faq-section { padding-inline: 22px; }
  .process-section { padding: 60px 22px; }
  .process-title { margin-bottom: 40px; }
  .about-inner { grid-template-columns: 1fr; gap: 32px; padding-inline: 22px; }
  .principle-item { grid-template-columns: 90px 1fr; gap: 14px; }
  .contact-cta-section { padding: 64px 22px; }
  .chart-section { padding: 60px 22px; }
  .card-grid { grid-template-columns: 1fr; }
  .related .inner { padding-inline: 22px; }
  .trust-stats .inner { padding-inline: 22px; flex-wrap: wrap; }
  .trust-stats .stat { flex: 0 1 calc(50% - 10px); min-width: 120px; padding: 10px 16px; }
  .trust-stats .stat-div { display: none; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .site-footer .inner { padding: 52px 22px 28px; }
  .footer-bottom { gap: 10px; flex-direction: column; align-items: flex-start; }
  .contact-empathy .inner { flex-direction: column; gap: 28px; padding: 34px 22px; }
  .empathy-promise { flex: none; width: 100%; }
  .contact-main { padding: 40px 22px 60px; }
  .contact-alt-col { padding-top: 0; }
  .tools-hub-grid { grid-template-columns: 1fr; gap: 16px; }
  .quiz-explainer { grid-template-columns: 1fr; }
  .result-damage-grid { grid-template-columns: 1fr; }
  .home-widget-area, .home-widget-area--services { padding-inline: 22px; }
  .kc-section-divider { padding-inline: 22px; }
  .notfound-code { font-size: 5rem; }
  .notfound-actions { flex-direction: column; align-items: center; }
  .related-articles { padding: 36px 22px 44px; }
  .article-author-box { flex-direction: column; gap: 14px; padding-inline: 22px; }
  .cta-band { padding: 56px 22px; }
  .cookie-banner { flex-direction: column; align-items: flex-start; gap: 12px; padding: 16px 22px; }
  .wa-float { padding: 13px; border-radius: 50%; }
  .wa-float .wa-label { display: none; }
  .quiz-wrap { padding: 1.5rem 0 2rem; }
  .quiz-question { font-size: 1.25rem; }
  .quiz-opt { padding: 14px 16px; font-size: 0.9375rem; }
  .score-ring-wrap, .score-ring-wrap svg { width: 130px; height: 130px; }
  .score-num { font-size: 2.5rem; }
  .calc-wrap, .serp-tool-wrap, .rr-wrap { padding-block: 1rem 2rem; }
  .calc-result-inner { padding: 1.5rem 1rem; }
}

/* ── About page ─────────────────────────────────────────────── */
.about-hero {
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 56px clamp(24px,4vw,40px) 72px;
}
.about-hero-h1 {
  font: 700 clamp(1.75rem,3.8vw,3rem)/1.15 var(--serif);
  color: var(--ink);
  margin: 0 0 18px;
  letter-spacing: -.015em;
}
.about-hero-lead {
  font: 400 1.0625rem/1.8 var(--sans);
  color: var(--muted);
  max-width: 620px;
  margin: 0;
}
.about-section-row {
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 0 clamp(24px,4vw,40px) 80px;
}
.about-content-col { min-width: 0; }
.about-label-col { min-width: 0; }

/* aliases for page-about.php class names */
.about-lead-p { font: 500 1.0625rem/1.75 var(--sans); color: var(--ink); margin: 0 0 20px; }
.about-gap-list { margin: 16px 0 24px; padding-inline-start: 1.4em; list-style: disc; }
.about-gap-list li { font: 400 0.9375rem/1.8 var(--sans); color: var(--muted); margin-block-end: 6px; }
.principle-title { font: 600 1rem/1.3 var(--serif); color: var(--accent); margin: 0 0 8px; }
.principle-body  { font: 400 0.9375rem/1.8 var(--sans); color: var(--text); margin: 0; }
.team-bio        { font: 400 0.9063rem/1.75 var(--sans); color: var(--muted); margin: 0; }
.about-team-intro { font: 400 0.9688rem/1.8 var(--sans); color: var(--muted); margin: 0 0 32px; }

/* about CTA band */
.about-cta-h   { font: 700 clamp(1.375rem,2.6vw,2rem)/1.2 var(--serif); color: #EAE7DF; margin: 0 0 10px; }
.about-cta-sub { font: 400 1rem/1.7 var(--sans); color: #9EA096; margin: 0; }
.about-cta-btns { display: flex; gap: 12px; flex-wrap: wrap; }

/* Dark-background buttons */
.btn--on-dark {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 13px 26px; border-radius: 6px;
  background: #EAE7DF; color: #171A17;
  font: 600 0.9375rem/1 var(--sans); text-decoration: none;
  transition: opacity .15s;
}
.btn--on-dark:hover { opacity: .88; }
.btn--ghost-on-dark {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 12px 25px; border-radius: 6px;
  border: 1px solid rgba(234,231,223,.28); color: #EAE7DF;
  font: 600 0.9375rem/1 var(--sans); text-decoration: none;
  transition: border-color .15s, color .15s;
}
.btn--ghost-on-dark:hover { border-color: rgba(234,231,223,.6); color: #fff; }

/* ── Article / single post images ───────────────────────────── */
.single .post-content img,
.single-post .post-content img,
.entry-content img:not(:first-child),
.article-body img + img {
  max-height: 480px;
  width: 100%;
  object-fit: cover;
}
.article-support-img {
  max-width: 860px;
  margin-inline: auto;
  padding-inline: clamp(24px,4vw,40px);
}
.article-support-img .img-slot {
  max-height: 480px;
  overflow: hidden;
  border-radius: 8px;
}
.article-support-img .img-slot img {
  max-height: 480px;
  width: 100%;
  height: 480px;
  object-fit: cover;
}

/* ── Footer contact list (Figma design) ─────────────────────── */
.footer-contact-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-size: 0.875rem;
  color: #9EA096;
}
.footer-contact-list li { color: #9EA096; }
.footer-contact-list .footer-wa-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #9EA096;
  text-decoration: none;
}
.footer-contact-list .footer-wa-link:hover { color: #EAE7DF; }

/* ── SERP dossier (reputation page hero) ────────────────────── */
.serp-dossier {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 4px;
  box-shadow: 0 20px 44px rgba(23,26,23,.10);
  overflow: hidden;
}
.serp-dossier-header {
  padding: 14px 20px;
  border-block-end: 1px solid var(--border-2);
  display: flex;
  justify-content: space-between;
  align-items: center;
  font: 400 0.75rem/1 var(--mono);
  color: var(--muted);
}
.serp-dossier-badge { color: var(--gold); font-size: 0.6875rem; }
.serp-dossier-rows { padding: 8px 20px 18px; display: flex; flex-direction: column; }
.serp-row { padding-block: 15px; border-block-end: 1px solid var(--border-2); display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.serp-row:last-child { border-block-end: 0; }
.serp-bar { display: inline-block; height: 12px; background: var(--ink); border-radius: 1px; }
.serp-row--removed { opacity: .5; }
.serp-row--pushed { opacity: .62; }
.serp-status { font: 400 0.6875rem/1 var(--mono); flex: none; }
.serp-status--r { color: var(--danger); }
.serp-status--m { color: var(--muted); }
.serp-status--g { color: var(--accent); }
.serp-title { font: 600 1rem/1 var(--serif); color: var(--accent); }

/* ── Rank climb card (SEO page hero) ────────────────────────── */
.rank-climb-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 4px;
  box-shadow: 0 20px 44px rgba(23,26,23,.10);
  overflow: hidden;
}
.rank-climb-header {
  padding: 14px 20px;
  border-block-end: 1px solid var(--border-2);
  display: flex;
  justify-content: space-between;
  align-items: center;
  font: 400 0.75rem/1 var(--mono);
  color: var(--muted);
}
.rank-climb-badge { color: var(--accent); font-size: 0.6875rem; }
.rank-climb-rows { padding: 22px 20px; display: flex; flex-direction: column; gap: 14px; }
.rank-climb-row { display: flex; align-items: center; gap: 14px; }
.rank-label { font: 400 0.75rem/1 var(--mono); color: var(--muted); width: 64px; flex: none; }
.rank-bar-track { flex: 1; height: 10px; background: var(--bg-alt); border-radius: 1px; overflow: hidden; display: block; }
.rank-bar-fill { display: block; height: 100%; background: var(--accent); }
.rank-pos { font: 400 0.75rem/1 var(--mono); color: var(--ink-2); width: 64px; flex: none; text-align: end; }

/* ── Service number cards ────────────────────────────────────── */
.svc-num-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-block-start: 3px solid var(--accent);
  padding: 30px 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  text-decoration: none;
  color: inherit;
  transition: border-color .15s;
}
.svc-num-card:hover { border-color: var(--accent); }
.svc-num-tag { font: 400 0.7188rem/1 var(--mono); letter-spacing: .14em; color: var(--muted); }
.svc-num-title { font: 600 1.25rem/1.25 var(--serif); color: var(--ink); margin: 0; }
.svc-num-body { font: 400 0.9063rem/1.75 var(--sans); color: var(--muted); margin: 0; }

/* ── Sectioned service catalogue (category hub pages) ────────── */
.svc-sections-wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 clamp(24px,4vw,40px) 80px; }
.svc-section { padding-block: 64px 0; border-block-start: 1px solid var(--border); }
.svc-section:first-child { padding-block-start: 72px; border-block-start: 0; }
.svc-section-head { display: flex; align-items: baseline; gap: 24px; margin-block-end: 32px; flex-wrap: wrap; }
.svc-section-label { font: 400 0.6563rem/1 var(--mono); letter-spacing: .16em; color: var(--muted); flex: none; min-width: 3ch; }
.svc-section-texts {}
.svc-section-title { font: 700 clamp(1.25rem,2.2vw,1.6875rem)/1.2 var(--serif); color: var(--ink); margin: 0 0 5px; }
.svc-section-sub   { font: 400 0.8438rem/1.5 var(--sans); color: var(--muted); margin: 0; }
.svc-section-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--border);
  border: 1px solid var(--border);
}
.svc-card {
  background: var(--surface);
  padding: 28px 26px 24px;
  display: flex;
  flex-direction: column;
  gap: 9px;
  text-decoration: none;
  color: inherit;
  transition: background .15s;
}
.svc-card:hover { background: var(--bg-alt); }
.svc-card:hover .svc-card-link { color: var(--accent-h); }
.svc-card-title { font: 600 1.0313rem/1.3 var(--serif); color: var(--ink); margin: 0; }
.svc-card-body  { font: 400 0.8438rem/1.75 var(--sans); color: var(--muted); margin: 0; flex: 1; }
.svc-card-link  { font: 500 0.7188rem/1 var(--mono); color: var(--accent); letter-spacing: .08em; margin-block-start: 6px; }

@media (max-width: 980px) {
  .svc-section-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .svc-section-grid { grid-template-columns: 1fr; background: transparent; border: 0; gap: 8px; }
  .svc-card { border: 1px solid var(--border); }
}

/* ── Audience blocks ─────────────────────────────────────────── */
.audiences-grid {
  background: var(--bg-alt);
  border: 1px solid var(--border);
  padding: 40px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 36px;
}
.audience-block { padding-block-start: 20px; border-block-start: 2px solid var(--accent); }
.audience-title { font: 500 0.7813rem/1 var(--mono); letter-spacing: .14em; color: var(--ink-2); margin: 0 0 12px; }
.audience-body { font: 400 0.9063rem/1.9 var(--sans); color: var(--muted); margin: 0; }

/* ── Dark CTA band ───────────────────────────────────────────── */
.dark-cta-h   { font: 700 clamp(1.375rem,2.4vw,1.875rem)/1.3 var(--serif); color: #EAE7DF; margin: 0 0 8px; }
.dark-cta-sub { font: 400 1rem/1.5 var(--sans); color: #C9C7BE; margin: 0; }
.dark-cta-actions { display: flex; gap: 14px; flex-wrap: wrap; }
.dark-cta-inner {
  padding: 52px 48px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 40px;
  flex-wrap: wrap;
}

/* ── Related category card ───────────────────────────────────── */
.related-cat-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  border: 1px solid var(--border);
  background: var(--surface);
  padding: 32px 36px;
  text-decoration: none;
  color: var(--text);
  transition: border-color .15s;
}
.related-cat-card:hover { border-color: var(--accent); }
.related-cat-title { font: 600 1.5rem/1.2 var(--serif); color: var(--ink); margin: 0 0 6px; }
.related-cat-sub { font: 400 0.9375rem/1.6 var(--sans); color: var(--muted); margin: 0; }
.related-cat-arrow { font: 400 0.875rem/1 var(--mono); color: var(--accent); flex: none; }

/* ── Featured article card ───────────────────────────────────── */
.featured-article-text {
  padding: 44px 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 16px;
}
.featured-article-tag { font: 600 0.6875rem/1 var(--mono); letter-spacing: .14em; color: var(--gold); text-transform: uppercase; }
.featured-article-title { font: 700 clamp(1.375rem,2.6vw,1.875rem)/1.25 var(--serif); color: #EAE7DF; margin: 0; }
.featured-article-excerpt { font: 400 0.9688rem/1.75 var(--sans); color: #9EA096; margin: 0; }
.featured-article-cta { font: 600 0.875rem/1 var(--mono); color: var(--gold); margin-block-start: 8px; }

/* ── Archive (category/tag) ─────────────────────────────────── */
.kc-archive-section {
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 0 clamp(24px,4vw,40px) 88px;
}
.kc-archive-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
@media (max-width: 980px) {
  .kc-archive-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .kc-archive-grid { grid-template-columns: 1fr; }
  .about-hero { padding-block-start: 40px; }
  .about-section-row { padding-block-end: 48px; }
}

/* ── Sticky CTA bar (appears after 40% scroll) ───────────────── */
.sticky-cta-bar {
  position: fixed;
  inset-block-end: 0;
  inset-inline: 0;
  z-index: 900;
  background: #0d0f0d;
  border-block-start: 1px solid rgba(255,255,255,.10);
  padding: 14px clamp(20px,4vw,40px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  transform: translateY(100%);
  transition: transform .35s cubic-bezier(.4,0,.2,1);
  will-change: transform;
}
.sticky-cta-bar.is-visible { transform: translateY(0); }
.sticky-cta-bar__text {
  font: 400 0.9375rem/1.5 var(--sans);
  color: rgba(255,255,255,.75);
  flex: 1;
  min-width: 0;
}
.sticky-cta-bar__text strong {
  color: #fff;
  font-weight: 600;
}
.sticky-cta-bar__btn {
  flex-shrink: 0;
  white-space: nowrap;
  background: var(--accent, #1E4837);
  color: #fff;
  font: 600 0.875rem/1 var(--mono, monospace);
  letter-spacing: .04em;
  padding: 10px 20px;
  border-radius: 6px;
  text-decoration: none;
  transition: opacity .2s;
}
.sticky-cta-bar__btn:hover { opacity: .88; }
.sticky-cta-bar__dismiss {
  background: none;
  border: none;
  color: rgba(255,255,255,.38);
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
  padding: 6px 8px;
  flex-shrink: 0;
  transition: color .2s;
}
.sticky-cta-bar__dismiss:hover { color: rgba(255,255,255,.75); }
@media (max-width: 600px) {
  .sticky-cta-bar { flex-wrap: wrap; padding: 12px 16px 16px; }
  .sticky-cta-bar__text { width: 100%; }
  .sticky-cta-bar__btn { flex: 1; text-align: center; }
}