/* MAG HR Solutions v2: font loading
   Poppins for headings (confident, geometric, credible).
   Source Sans 3 for body (clean, highly readable for busy executives). */
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@500;600;700&family=Source+Sans+3:ital,wght@0,400;0,500;0,600;1,400&display=swap");

/* MAG HR Solutions v2: color tokens
   Two-blue brand system sampled from the logo, plus one deliberate CTA accent.
   Recommended accent: Gulf Coral (warm energy against an all-blue brand).
   Alternative kept in the palette: Vivid Azure (stays in the blue family). */
:root {
  /* Brand navy (logo primary) */
  --navy-900: #0C1F3D;
  --navy-800: #112A4A;   /* pressed / deep surface */
  --navy-700: #16345C;   /* PRIMARY brand navy, from logo */
  --navy-600: #21497A;   /* hover on navy surfaces */

  /* Brand blue (logo cornflower) */
  --blue-600: #4C7CB2;
  --blue-500: #6898C8;   /* SECONDARY brand blue, from logo */
  --blue-300: #AAC5E2;
  --blue-100: #DCE8F5;
  --blue-50:  #EFF4FB;

  /* Neutrals */
  --white:    #FFFFFF;
  --gray-50:  #F5F7FA;   /* cool gray, section backgrounds */
  --gray-100: #E9EDF3;
  --gray-200: #D6DEE8;   /* borders, dividers */
  --slate-600:#3E4C5E;   /* strong slate */
  --slate-500:#647184;   /* muted text */
  --ink:      #1E2A3A;   /* body text */

  /* CTA accent A (RECOMMENDED): Gulf Coral */
  --coral-600: #C64F2C;
  --coral-500: #E56A45;
  --coral-100: #FCE8E1;

  /* CTA accent B: Vivid Azure (all-blue alternative) */
  --azure-600: #2264AE;
  --azure-500: #2E7DD1;
  --azure-100: #E3EFFA;

  /* Semantic aliases */
  --accent:          var(--coral-500);
  --accent-hover:    var(--coral-600);
  --accent-soft:     var(--coral-100);
  --accent-contrast: #FFFFFF;

  --text-heading: var(--navy-700);
  --text-body:    var(--ink);
  --text-muted:   var(--slate-500);
  --text-inverse: #FFFFFF;
  --text-inverse-muted: #B7C6DA;

  --surface-page:      #FFFFFF;
  --surface-section:   var(--gray-50);
  --surface-card:      #FFFFFF;
  --surface-navy:      var(--navy-700);
  --surface-navy-deep: var(--navy-900);
  --surface-tint:      var(--blue-50);

  --border:        var(--gray-200);
  --border-subtle: var(--gray-100);
  --border-strong: var(--blue-300);

  --focus-ring: rgba(104, 152, 200, 0.5);
  --error:      #C0453C;
  --error-bg:   #FBEDEC;
  --success:    #2E7D5B;
  --success-bg: #E9F4EF;
}
/* MAG HR Solutions v2: typography tokens */
:root {
  --font-heading: "Poppins", "Segoe UI", -apple-system, sans-serif;
  --font-body:    "Source Sans 3", "Source Sans Pro", "Segoe UI", -apple-system, sans-serif;

  /* Type scale: dominant H1, clearly stepped */
  --fs-display: clamp(44px, 6vw, 66px);
  --fs-h1:      clamp(36px, 5vw, 52px);
  --fs-h2:      clamp(28px, 3.6vw, 38px);
  --fs-h3:      24px;
  --fs-h4:      19px;
  --fs-body-lg: 19px;
  --fs-body:    17px;
  --fs-small:   15px;
  --fs-overline:13px;

  --fw-body:     400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-heading:  600;
  --fw-bold:     700;

  --lh-display:    1.05;
  --lh-heading:    1.15;
  --lh-subheading: 1.3;
  --lh-body:       1.6;

  --ls-heading:  -0.02em;
  --ls-overline:  0.14em;
}
/* MAG HR Solutions v2: spacing, radii, layout tokens (4px base) */
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;

  --radius-sm:   6px;
  --radius-md:   10px;   /* controls, buttons */
  --radius-lg:   16px;   /* cards */
  --radius-xl:   22px;   /* feature panels */
  --radius-pill: 999px;  /* badges, pills */

  --container-max: 1160px;
  --container-pad: 24px;
  --section-y:     var(--space-9);
}
/* MAG HR Solutions v2: shadows, focus, transitions (all tuned to navy, never gray) */
:root {
  --shadow-xs:         0 1px 2px rgba(18, 42, 74, 0.10);
  --shadow-card:       0 1px 2px rgba(18, 42, 74, 0.05), 0 8px 24px rgba(18, 42, 74, 0.07);
  --shadow-card-hover: 0 2px 6px rgba(18, 42, 74, 0.08), 0 18px 42px rgba(18, 42, 74, 0.14);
  --shadow-lift:       0 24px 60px rgba(12, 31, 61, 0.20);
  --shadow-header:     0 1px 0 rgba(18, 42, 74, 0.08);

  --focus-shadow: 0 0 0 3px var(--focus-ring);

  --transition-fast: 130ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-base: 220ms cubic-bezier(0.4, 0, 0.2, 1);

  /* Signature: a soft navy-to-blue wash for feature surfaces */
  --wash-navy: linear-gradient(150deg, var(--navy-700) 0%, var(--navy-900) 100%);
  --wash-tint: linear-gradient(180deg, var(--white) 0%, var(--blue-50) 100%);
}
/* MAG HR Solutions v2: base reset and element defaults */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}
section[id], .legal-block[id] { scroll-margin-top: 90px; }
body.admin-bar section[id], body.admin-bar .legal-block[id] { scroll-margin-top: 122px; }
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--text-body);
  background: var(--surface-page);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
h1, h2, h3, h4 {
  font-family: var(--font-heading);
  font-weight: var(--fw-heading);
  color: var(--text-heading);
  line-height: var(--lh-heading);
  letter-spacing: var(--ls-heading);
  margin: 0 0 var(--space-4);
}
h1 { font-size: var(--fs-h1); }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); line-height: var(--lh-subheading); }
h4 { font-size: var(--fs-h4); line-height: var(--lh-subheading); }
p  { margin: 0 0 var(--space-4); }
a  { color: var(--navy-600); text-decoration: none; }
a:hover { color: var(--navy-700); }
img { max-width: 100%; display: block; }

/* ============================================================
   MAG HR Solutions: Design System v2 (Claude Code authored)
   Global component stylesheet. Imports all tokens, then defines
   every component class so specimen cards and pages share one source.
   ============================================================ */

/* ---- Layout helpers ---- */
.container { max-width: var(--container-max); margin: 0 auto; padding: 0 var(--container-pad); }
.section  { padding: var(--section-y) 0; }
.section--tint { background: var(--surface-section); }
.section--navy { background: var(--surface-navy); color: var(--text-inverse); }
.stack > * + * { margin-top: var(--space-4); }

/* ---- Overline kicker (signature label above headings) ---- */
.overline {
  font-family: var(--font-heading);
  font-size: var(--fs-overline);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--ls-overline);
  text-transform: uppercase;
  color: var(--blue-600);
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  margin: 0 0 var(--space-3);
}
.overline::before {
  content: none;
}
.section--navy .overline { color: var(--blue-300); }

/* ---- Buttons ---- */
.btn {
  font-family: var(--font-heading);
  font-weight: var(--fw-semibold);
  font-size: var(--fs-small);
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  padding: 13px 22px;
  border-radius: var(--radius-md);
  border: 1.5px solid transparent;
  cursor: pointer;
  transition: transform var(--transition-fast), background var(--transition-fast), box-shadow var(--transition-fast), color var(--transition-fast);
  text-decoration: none;
  white-space: nowrap;
}
.btn:active { transform: translateY(1px); }
.btn--lg { padding: 16px 30px; font-size: var(--fs-body); }
.btn--sm { padding: 9px 16px; font-size: var(--fs-overline); }

.btn--primary {
  background: var(--accent);
  color: var(--accent-contrast);
  box-shadow: var(--shadow-xs);
}
.btn--primary:hover { background: var(--accent-hover); color: var(--accent-contrast); box-shadow: var(--shadow-card); transform: translateY(-1px); }

.btn--secondary {
  background: var(--navy-700);
  color: #fff;
}
.btn--secondary:hover { background: var(--navy-600); transform: translateY(-1px); }

.btn--ghost {
  background: transparent;
  color: var(--navy-700);
  border-color: var(--border-strong);
}
.btn--ghost:hover { background: var(--blue-50); border-color: var(--blue-500); }

.section--navy .btn--ghost, .notfound-hero .btn--ghost, .post-cta .btn--ghost { color: #fff; border-color: rgba(255,255,255,0.35); }
.section--navy .btn--ghost:hover, .notfound-hero .btn--ghost:hover, .post-cta .btn--ghost:hover { background: rgba(255,255,255,0.08); border-color: #fff; }

.btn[disabled], .btn.is-disabled { opacity: 0.45; cursor: not-allowed; pointer-events: none; }

/* ---- Service tags (flat, 4px radius, borderless; never pill/button-looking) ---- */
.badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-family: var(--font-heading);
  font-weight: var(--fw-semibold);
  font-size: var(--fs-overline);
  letter-spacing: 0.02em;
  padding: 5px 10px;
  border-radius: 4px;
  background: var(--blue-50);
  color: var(--navy-700);
}
.badge--navy { background: var(--navy-700); color: #fff; }
.badge--accent { background: var(--accent-soft); color: var(--coral-600); }
.badge .dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: 0.7; }

/* ---- Bilingual cue (Se Habla Espanol): inline text, no pill container ---- */
.bilingual {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-family: var(--font-body);
  font-weight: var(--fw-semibold);
  font-size: var(--fs-small);
  color: var(--navy-700);
}
.bilingual .globe {
  width: 20px; height: 20px; border-radius: 50%;
  background: var(--blue-500);
  display: inline-grid; place-items: center;
  color: #fff; font-size: 9px; font-weight: 700; letter-spacing: 0; line-height: 1;
}
.section--navy .bilingual, .site-footer .bilingual { color: #fff; }
.section--navy .bilingual .globe, .site-footer .bilingual .globe { background: var(--blue-300); color: var(--navy-900); }

/* ---- Cards ---- */
.card {
  background: var(--surface-card);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-lg);
  padding: var(--space-6);
  box-shadow: var(--shadow-card);
  transition: transform var(--transition-base), box-shadow var(--transition-base);
}
.card:hover { transform: translateY(-4px); box-shadow: var(--shadow-card-hover); }

.service-card { position: relative; display: flex; flex-direction: column; }
.service-card .svc-icon {
  width: 52px; height: 52px; border-radius: var(--radius-md);
  display: inline-grid; place-items: center;
  background: var(--blue-50); color: var(--navy-700);
  transition: background var(--transition-base), color var(--transition-base);
}
.service-card .svc-icon svg { width: 26px; height: 26px; }
.service-card:hover .svc-icon { background: var(--navy-700); color: #fff; }
.service-card h3 { margin: var(--space-4) 0 var(--space-2); }
.service-card p { color: var(--text-muted); margin: 0 0 var(--space-4); }
.service-card .arrow { font-family: var(--font-heading); font-weight: 600; color: var(--navy-700); font-size: var(--fs-small); }

.stat-card { text-align: left; }
.stat-card .stat-num {
  font-family: var(--font-heading);
  font-weight: var(--fw-bold);
  font-size: 44px;
  color: var(--navy-700);
  line-height: 1;
  letter-spacing: -0.03em;
}
.stat-card .stat-num em { color: var(--accent); font-style: normal; }
.stat-card .stat-label { color: var(--text-muted); font-size: var(--fs-small); margin-top: var(--space-2); }

.testimonial-card { background: var(--wash-tint); border-color: var(--blue-100); }
.testimonial-card .qmark { color: var(--blue-300); margin-bottom: var(--space-3); }
.testimonial-card .qmark svg { width: 30px; height: 30px; }
.testimonial-card .quote { font-size: var(--fs-body-lg); color: var(--ink); line-height: 1.5; margin: 0 0 var(--space-5); }
.testimonial-card .who { padding-top: var(--space-3); border-top: 1px solid var(--blue-100); }
.testimonial-card .who b { display: block; color: var(--navy-700); font-family: var(--font-heading); }
.testimonial-card .who span { font-size: var(--fs-small); color: var(--text-muted); }

/* ---- Form fields ---- */
.field { display: block; margin-bottom: var(--space-5); }
.field > label { display: block; font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-small); color: var(--navy-700); margin-bottom: var(--space-2); }
.field .hint { font-size: var(--fs-small); color: var(--text-muted); margin-top: 6px; }
.control {
  width: 100%;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  color: var(--ink);
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-md);
  padding: 12px 14px;
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}
.control::placeholder { color: #9AA7B6; }
.control:focus { outline: none; border-color: var(--blue-500); box-shadow: var(--focus-shadow); }
textarea.control { min-height: 108px; resize: vertical; }
select.control { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--slate-500) 50%), linear-gradient(135deg, var(--slate-500) 50%, transparent 50%); background-position: calc(100% - 20px) 55%, calc(100% - 15px) 55%; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; }
.field.is-error .control { border-color: var(--error); background: var(--error-bg); }
.field.is-error .hint { color: var(--error); }

/* ---- Global header ---- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 900;
  background: rgba(255,255,255,0.92);
  backdrop-filter: saturate(1.4) blur(8px);
  box-shadow: var(--shadow-header);
  border-bottom: 1px solid var(--border-subtle);
}
body.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) {
  body.admin-bar .site-header { top: 46px; }
}
@media (max-width: 600px) {
  /* WP core switches #wpadminbar to position:absolute below 600px, so it
     scrolls away with the page instead of staying fixed; the sticky header
     must not keep reserving space for it here or a gap opens once scrolled
     past where the admin bar used to be. */
  body.admin-bar .site-header { top: 0; }
}
.site-header .bar { display: flex; align-items: center; gap: var(--space-6); height: 90px; }
.site-header .brand { display: flex; align-items: center; gap: var(--space-3); }
.site-header .brand img { height: 40px; width: auto; }
.site-header nav { display: flex; align-items: center; gap: var(--space-5); margin-left: var(--space-4); }
.site-header nav a { font-family: var(--font-heading); font-weight: var(--fw-medium); font-size: var(--fs-small); color: var(--slate-600); }
.site-header nav a:hover { color: var(--navy-700); }
.site-header .spacer { flex: 1; }
.site-header .header-actions { display: flex; align-items: center; gap: var(--space-4); }
.site-header .nav-item { position: relative; }
.site-header .nav-item > a { display: inline-flex; align-items: center; gap: 4px; }
.nav-caret { width: 14px; height: 14px; transition: transform var(--transition-fast); }
.nav-item:hover .nav-caret, .nav-item:focus-within .nav-caret { transform: rotate(180deg); }
.nav-dropdown { position: absolute; top: 100%; left: 0; margin-top: var(--space-3); min-width: 200px; background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-md); box-shadow: var(--shadow-card-hover); padding: var(--space-2); opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity var(--transition-fast), transform var(--transition-fast), visibility var(--transition-fast); }
.nav-item:hover .nav-dropdown, .nav-item:focus-within .nav-dropdown { opacity: 1; visibility: visible; transform: translateY(0); }
.nav-dropdown a { display: block; padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); font-size: var(--fs-small); color: var(--slate-600); }
.nav-dropdown a:hover { background: var(--wash-tint); color: var(--navy-700); }
.nav-toggle { display: none; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; background: none; border: none; color: var(--navy-700); cursor: pointer; flex: none; }
.nav-toggle svg { width: 24px; height: 24px; }
.mobile-nav-overlay { position: fixed; inset: 0; background: rgba(12,31,61,0.4); opacity: 0; visibility: hidden; transition: opacity var(--transition-base); z-index: 1000; }
.mobile-nav-overlay.is-open { opacity: 1; visibility: visible; }
.mobile-nav { position: fixed; top: 0; right: 0; bottom: 0; width: 300px; max-width: 84vw; background: #fff; box-shadow: -8px 0 32px rgba(12,31,61,0.16); z-index: 1001; display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-7) var(--space-6); transform: translateX(100%); transition: transform var(--transition-base); }
.mobile-nav.is-open { transform: translateX(0); }
.mobile-nav a { font-family: var(--font-heading); font-weight: var(--fw-medium); font-size: var(--fs-body-lg); color: var(--navy-700); padding: var(--space-3) 0; border-bottom: 1px solid var(--border-subtle); }
.mobile-nav a:hover { color: var(--accent); }
.mobile-nav-close { align-self: flex-end; display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 0; margin-bottom: var(--space-4); background: none; border: none; color: var(--navy-700); cursor: pointer; }
.mobile-nav-close svg { width: 22px; height: 22px; }
.mobile-nav-item { display: flex; align-items: center; border-bottom: 1px solid var(--border-subtle); }
.mobile-nav-item a { flex: 1; border-bottom: none; }
.mobile-nav-caret { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 0; background: none; border: none; color: var(--navy-700); cursor: pointer; flex: none; }
.mobile-nav-caret svg { width: 18px; height: 18px; transition: transform var(--transition-fast); }
.mobile-nav-caret[aria-expanded="true"] svg { transform: rotate(180deg); }
.mobile-nav-submenu { display: flex; flex-direction: column; overflow: hidden; max-height: 0; transition: max-height var(--transition-base); background: var(--wash-tint); margin: 0 calc(var(--space-6) * -1); padding: 0 var(--space-6); }
.mobile-nav-submenu.is-open { max-height: 300px; }
.mobile-nav-submenu a { font-size: var(--fs-small); padding: var(--space-3) 0 var(--space-3) var(--space-3); }
.mobile-nav-submenu a:last-child { border-bottom: none; }

/* ---- Global footer ---- */
.site-footer { background: var(--surface-navy-deep); color: var(--text-inverse-muted); }
.site-footer .grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: var(--space-7); padding: var(--space-9) 0 var(--space-7); }
.site-footer h4 { color: #fff; font-size: var(--fs-small); letter-spacing: 0.04em; text-transform: uppercase; margin-bottom: var(--space-4); }
.site-footer a { color: var(--text-inverse-muted); display: block; margin-bottom: var(--space-2); font-size: var(--fs-small); }
.site-footer a:hover { color: #fff; }
.site-footer .nap { font-style: normal; line-height: 1.7; font-size: var(--fs-small); }
.site-footer .footer-brand img { height: 120px; width: auto; margin-bottom: var(--space-4); background: #fff; padding: 16px 22px; border-radius: 16px; box-shadow: var(--shadow-xs); }
.site-footer .legal { border-top: 1px solid rgba(255,255,255,0.12); padding: var(--space-4) 0; display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); font-size: var(--fs-small); color: var(--text-inverse-muted); }
.site-footer .legal .legal-copy { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); }
.site-footer .legal-links { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); }
.site-footer .legal-links a { display: inline; margin: 0; }

/* ---- Utility ---- */
.eyebrow-row { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
.muted { color: var(--text-muted); }
.lead { font-size: var(--fs-body-lg); color: var(--slate-600); line-height: 1.55; }

/* ============================================================
   MAG HR Solutions Homepage: section layouts + review overlay
   Composes from the design system (styles.css + tokens). Adds only
   page-specific layout. No new colors or fonts; tokens only.
   ============================================================ */

/* token aliases so the review overlay uses brand values */
:root {
  --primary: var(--navy-700);
  --radius-full: var(--radius-pill);
  --font-display: var(--font-heading);
}

/* generic section intro */
.section .intro { max-width: 760px; margin-bottom: var(--space-7); }
.section .intro.center { margin-left: auto; margin-right: auto; text-align: center; }
.section .intro.center .overline { justify-content: center; }
.section .intro.center .lead { margin-left: auto; margin-right: auto; }

/* ---- Hero ---- */
.hero { background: var(--wash-tint); overflow: hidden; }
.hero .container { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 56px; align-items: center; padding-top: 80px; padding-bottom: 80px; }
.hero h1 { font-size: var(--fs-display); line-height: var(--lh-display); margin: 14px 0 20px; }
.hero h1 .accent { color: var(--accent); }
.hero .cta-row { display: flex; gap: 14px; align-items: center; margin-top: 28px; flex-wrap: wrap; }
.hero .trust { margin-top: 24px; display: flex; align-items: center; gap: 14px; color: var(--slate-500); font-size: var(--fs-small); }
.hero .trust b { color: var(--navy-700); font-family: var(--font-heading); }
.hero-visual { position: relative; }
.hero-visual::before { content: ""; position: absolute; left: -20px; top: -20px; width: 140px; height: 140px; border-radius: var(--radius-lg); background: var(--blue-100); z-index: 0; }
.hero-visual .frame { position: relative; z-index: 1; border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-lift); }
.hero-visual img { width: 100%; height: 480px; object-fit: cover; object-position: center 26%; display: block; }
.hero-visual .cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 22px 22px 18px; background: linear-gradient(to top, rgba(12,31,61,.94), rgba(12,31,61,0)); }
.hero-visual .cap b { font-family: var(--font-heading); color: #fff; font-size: 18px; display: block; }
.hero-visual .cap span { color: var(--text-inverse-muted); font-size: var(--fs-small); }

/* ---- Trust bar (icon boxes) ---- */
.trust-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 28px; margin-top: var(--space-6); }
.trust-item .ti-icon { width: 46px; height: 46px; border-radius: var(--radius-md); background: #fff; color: var(--navy-700); display: inline-grid; place-items: center; box-shadow: var(--shadow-xs); margin-bottom: var(--space-3); }
.trust-item .ti-icon svg { width: 24px; height: 24px; }
.trust-item h3 { font-size: var(--fs-h4); margin: 0 0 var(--space-2); }
.trust-item p { color: var(--text-muted); font-size: var(--fs-small); margin: 0; }

/* ---- Problem (three concerns) ---- */
.problem-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.problem-card { background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); padding: var(--space-6); }
.problem-card .p-icon { color: var(--accent); margin-bottom: var(--space-3); }
.problem-card .p-icon svg { width: 26px; height: 26px; }
.problem-card h3 { font-size: var(--fs-h3); margin: 0 0 var(--space-3); }
.problem-card p { color: var(--text-muted); margin: 0; }

/* ---- Services (uses .service-card from styles.css) ---- */
.services-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.service-card .txt-link { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-small); color: var(--navy-700); }
.service-card .txt-link svg { width: 16px; height: 16px; }
.service-card:hover .txt-link { color: var(--accent); }

/* ---- A la carte projects ---- */
.projects-split { display: grid; grid-template-columns: 1fr 1.05fr; gap: 48px; align-items: start; }
.project-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); }
.project-list li { display: flex; gap: 12px; align-items: flex-start; color: var(--text-body); }
.project-list li svg { width: 20px; height: 20px; color: var(--blue-500); flex: none; margin-top: 3px; }
.ondemand { margin-top: var(--space-6); padding: var(--space-5); background: var(--surface-tint); border-radius: var(--radius-lg); }
.ondemand h3 { font-size: var(--fs-h4); margin: 0 0 var(--space-2); }
.ondemand p { margin: 0; color: var(--text-muted); }

/* ---- USPs (2x2) ---- */
.usp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.usp-item { display: grid; grid-template-columns: 46px 1fr; gap: 18px; align-items: start; }
.usp-item .u-icon { width: 46px; height: 46px; border-radius: var(--radius-md); background: var(--blue-50); color: var(--navy-700); display: inline-grid; place-items: center; }
.usp-item .u-icon svg { width: 24px; height: 24px; }
.usp-item h3 { font-size: var(--fs-h4); margin: 0 0 var(--space-2); }
.usp-item p { color: var(--text-muted); margin: 0; }

/* ---- Comparison ---- */
.compare { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: var(--space-6); }
.compare .col { border-radius: var(--radius-lg); padding: var(--space-6); }
.compare .col--usual { background: #fff; border: 1px solid var(--border); }
.compare .col--mag { background: var(--wash-navy); color: #fff; }
.compare .col h3 { font-size: var(--fs-h4); margin: 0 0 var(--space-4); }
.compare .col--mag h3 { color: #fff; }
.compare .col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); }
.compare .col li { display: flex; gap: 10px; align-items: flex-start; font-size: var(--fs-small); }
.compare .col li svg { width: 18px; height: 18px; flex: none; margin-top: 2px; }
.compare .col--usual li svg { color: var(--slate-500); }
.compare .col--mag li { color: var(--text-inverse-muted); }
.compare .col--mag li svg { color: var(--blue-300); }
.compare-narrative { background: var(--surface-section); border-radius: var(--radius-lg); padding: var(--space-6); }
.compare-narrative h3 { margin: 0 0 var(--space-3); }
.compare-narrative p { margin: 0; color: var(--text-body); }

/* ---- Steps (named, connected; no numbers) ---- */
.steps { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; position: relative; }
.step { position: relative; text-align: left; }
.step .s-icon { width: 54px; height: 54px; border-radius: 50%; background: var(--navy-700); color: #fff; display: inline-grid; place-items: center; margin-bottom: var(--space-4); position: relative; z-index: 1; }
.step .s-icon svg { width: 24px; height: 24px; }
.step h3 { font-size: var(--fs-h3); margin: 0 0 var(--space-2); }
.step p { color: var(--text-muted); margin: 0; }
.steps .connector { position: absolute; top: 27px; left: 12%; right: 12%; height: 2px; background: repeating-linear-gradient(90deg, var(--blue-300) 0 8px, transparent 8px 16px); z-index: 0; }
.steps-cta { text-align: center; margin-top: var(--space-7); }

/* ---- Founders ---- */
.founder { display: grid; grid-template-columns: 300px 1fr; gap: 40px; align-items: center; margin-bottom: var(--space-7); }
.founder:nth-child(even) { grid-template-columns: 1fr 300px; }
.founder:nth-child(even) .f-photo { order: 2; }
.f-photo { position: relative; border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-card); }
.f-photo img { width: 100%; height: 340px; object-fit: cover; object-position: center 20%; display: block; }
.founder h3 { font-size: var(--fs-h3); margin: 0 0 var(--space-3); }
.founder .role { color: var(--accent); font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-small); display: block; margin-bottom: var(--space-3); }
.founder p { color: var(--text-muted); margin: 0; }
.founders-why { background: var(--surface-tint); border-radius: var(--radius-lg); padding: var(--space-6); text-align: center; max-width: 820px; margin: var(--space-6) auto 0; }
.founders-why h3 { margin: 0 0 var(--space-3); }
.founders-why p { margin: 0 0 var(--space-4); color: var(--text-body); }

/* ---- Testimonials (2x2, no avatars, no stars) ---- */
.testi-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }

/* ---- Service area ---- */
.area-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.area-card { background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); padding: var(--space-6); }
.area-card .a-icon { color: var(--navy-700); margin-bottom: var(--space-3); }
.area-card .a-icon svg { width: 26px; height: 26px; }
.area-card h3 { font-size: var(--fs-h4); margin: 0 0 var(--space-2); }
.area-card p { color: var(--text-muted); margin: 0; }

/* ---- FAQ (accordion) ---- */
.faq-list { max-width: 820px; margin: 0 auto; }
.faq-item { border-bottom: 1px solid var(--border); }
.faq-item summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: var(--space-5) 0; font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-h4); color: var(--navy-700); }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary .chev { color: var(--blue-500); transition: transform var(--transition-base); flex: none; }
.faq-item.is-open summary .chev { transform: rotate(180deg); }
.faq-item .faq-a { display: block; overflow: hidden; max-height: 0; color: var(--text-muted); max-width: 68ch; transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
.faq-item .faq-a-inner { padding: 0 0 var(--space-5); }

/* ---- Final CTA + form ---- */
.final { background: var(--wash-navy); }
.final .container { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.final h2 { color: #fff; }
.final h3 { color: #fff; margin: var(--space-2) 0 var(--space-3); }
.final .lead { color: var(--text-inverse-muted); }
.final .cta-stack { display: flex; flex-direction: column; gap: 14px; align-items: flex-start; margin-top: var(--space-5); }
.final .cta-note { color: var(--text-inverse-muted); font-size: var(--fs-small); margin: var(--space-2) 0 0; }
.lead-form { background: #fff; border-radius: var(--radius-xl); padding: var(--space-6); box-shadow: var(--shadow-lift); }
.lead-form h3 { margin: 0 0 var(--space-4); }
.lead-form .row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.lead-form .btn { width: 100%; margin-top: var(--space-2); }

/* ---- Responsive ---- */
@media (max-width: 960px) {
  .hero .container, .final .container, .projects-split { grid-template-columns: 1fr; }
  .trust-grid, .problem-grid, .services-grid, .usp-grid, .compare, .steps, .testi-grid, .area-grid { grid-template-columns: 1fr; }
  .steps .connector { display: none; }
  .founder, .founder:nth-child(even) { grid-template-columns: 1fr; }
  .founder:nth-child(even) .f-photo { order: 0; }
  .lead-form .row2 { grid-template-columns: 1fr; }
  .site-header nav { display: none; }
  .nav-toggle { display: flex; }
  body.nav-open { overflow: hidden; }
}

/* ============================================================
   REVIEW OVERLAY (client approval sidebar)
   ============================================================ */
.review-trigger { position: fixed; bottom: 24px; right: 24px; z-index: 1000; display: flex; align-items: center; gap: 8px; padding: 12px 20px; background: var(--navy-700); color: #fff; border: none; border-radius: var(--radius-pill); font-family: var(--font-heading); font-size: 13px; font-weight: 600; cursor: pointer; box-shadow: 0 6px 20px rgba(12,31,61,0.28); transition: transform var(--transition-fast), box-shadow var(--transition-fast); }
.review-trigger:hover { transform: translateY(-2px); box-shadow: 0 6px 24px rgba(12,31,61,0.32); }
.review-trigger svg { flex-shrink: 0; }
.review-overlay { position: fixed; inset: 0; z-index: 2000; pointer-events: none; visibility: hidden; }
.review-overlay.active { pointer-events: auto; visibility: visible; }
.review-overlay__backdrop { position: absolute; inset: 0; background: rgba(12,31,61,0); transition: background 0.3s ease; }
.review-overlay.active .review-overlay__backdrop { background: rgba(12,31,61,0.34); }
.review-overlay__sidebar { position: absolute; top: 0; right: 0; bottom: 0; width: 390px; max-width: 92vw; background: #fff; box-shadow: -8px 0 32px rgba(12,31,61,0.16); display: flex; flex-direction: column; transform: translateX(100%); transition: transform 0.35s cubic-bezier(0.4,0,0.2,1); }
.review-overlay.active .review-overlay__sidebar { transform: translateX(0); }
.review-overlay__header { display: flex; justify-content: space-between; align-items: flex-start; padding: 24px; border-bottom: 1px solid var(--border-subtle); }
.review-overlay__title { font-family: var(--font-heading); font-size: 18px; font-weight: 600; color: var(--navy-700); margin: 0; }
.review-overlay__subtitle { font-size: 13px; color: var(--text-muted); margin-top: 4px; }
.review-overlay__close { background: none; border: none; font-size: 24px; color: var(--text-muted); cursor: pointer; padding: 4px 8px; line-height: 1; border-radius: 8px; }
.review-overlay__close:hover { background: var(--gray-100); color: var(--navy-700); }
.review-overlay__body { flex: 1; overflow-y: auto; padding: 16px 24px; }
.review-card { background: var(--gray-50); border: 1px solid var(--border-subtle); border-radius: 12px; padding: 16px; margin-bottom: 12px; }
.review-card[data-approved="true"] { border-color: var(--success); background: var(--success-bg); }
.review-card[data-approved="false"] { border-color: #E08A2B; background: #FCF3E7; }
.review-card__header { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.review-card__number { width: 24px; height: 24px; border-radius: 50%; background: var(--navy-700); color: #fff; font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.review-card__name { font-size: 14px; font-weight: 600; color: var(--navy-700); flex: 1; margin: 0; font-family: var(--font-heading); }
.review-card__status { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; padding: 3px 8px; border-radius: 6px; flex-shrink: 0; }
.review-card__status[data-status="pending"] { background: var(--gray-100); color: var(--text-muted); }
.review-card__status[data-status="approved"] { background: var(--success-bg); color: var(--success); }
.review-card__status[data-status="needs-changes"] { background: #FCF3E7; color: #B4690E; }
.review-card__rationale p { font-size: 13px; line-height: 1.6; color: var(--text-muted); margin: 0 0 12px; }
.review-card__controls { display: flex; gap: 8px; margin-bottom: 8px; }
.review-toggle { flex: 1; cursor: pointer; }
.review-toggle input { display: none; }
.review-toggle__label { display: block; text-align: center; padding: 8px 12px; border-radius: 8px; font-size: 12px; font-weight: 600; border: 1.5px solid var(--border); transition: all 0.2s; }
.review-toggle__label--approve { color: var(--success); }
.review-toggle input:checked + .review-toggle__label--approve { background: var(--success); color: #fff; border-color: var(--success); }
.review-toggle__label--changes { color: #B4690E; }
.review-toggle input:checked + .review-toggle__label--changes { background: #E08A2B; color: #fff; border-color: #E08A2B; }
.review-card__feedback { width: 100%; padding: 10px 12px; border: 1.5px solid var(--border); border-radius: 8px; font-family: var(--font-body); font-size: 13px; line-height: 1.5; color: var(--ink); resize: vertical; background: #fff; }
.review-card__feedback:focus { outline: none; border-color: var(--blue-500); box-shadow: var(--focus-shadow); }
.review-overlay__footer { padding: 16px 24px; border-top: 1px solid var(--border-subtle); }
.review-overlay__summary { font-size: 13px; color: var(--text-muted); margin-bottom: 12px; text-align: center; }
.review-overlay__submit { width: 100%; }
.review-overlay__submit.submitted { background: var(--success); }
@media (max-width: 480px) { .review-trigger { top: auto; bottom: 20px; } .review-overlay__sidebar { width: 100%; max-width: 100%; } }
@media print { .review-trigger, .review-overlay { display: none !important; } }

/* Send-my-feedback panel (slides over the sidebar) */
.review-send-panel { position: absolute; inset: 0; background: #fff; z-index: 5; display: none; flex-direction: column; padding: 24px; }
.review-send-panel.active { display: flex; }
.rsp-head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.rsp-back { background: none; border: none; color: var(--navy-700); font-family: var(--font-heading); font-weight: 600; font-size: 13px; cursor: pointer; padding: 4px 0; }
.rsp-title { margin: 0; font-size: 18px; color: var(--navy-700); font-family: var(--font-heading); }
.rsp-note { font-size: 13px; color: var(--text-muted); margin: 0 0 14px; line-height: 1.6; }
.rsp-actions { display: flex; gap: 10px; margin-bottom: 14px; }
.rsp-btn { flex: 1; text-align: center; }
.rsp-text { flex: 1; width: 100%; min-height: 200px; border: 1.5px solid var(--border); border-radius: 10px; padding: 12px; font-family: var(--font-body); font-size: 13px; line-height: 1.5; color: var(--ink); resize: none; background: var(--gray-50); box-sizing: border-box; }
.rsp-hint { font-size: 12px; color: var(--text-muted); margin: 12px 0 0; line-height: 1.6; }

/* Client-revision overrides (2026-07-06) */
.site-header .brand img { height: 68px; }
.testi-grid .quote { font-size: var(--fs-body); line-height: 1.55; }

/* ============================================================
   Interior page component styles (rescued from the approved
   page-design HTML inline <style> blocks: About, Talent Acquisition,
   Fractional HR, HR Projects, Interim HR, Resources, Contact,
   Schedule, Thank You, legal pages, 404, blog single-post template.
   Consolidated into the single shared stylesheet per this theme's
   established one-CSS-file convention. wesley wp-page-deploy, 2026-07-17.
   ============================================================ */
.notfound-hero { background: var(--wash-navy); color: #fff; text-align: center; }
.notfound-hero .container { padding-top: 104px; padding-bottom: 104px; max-width: 760px; }
.notfound-code { font-family: var(--font-heading); font-weight: var(--fw-bold); font-size: clamp(64px, 12vw, 116px); line-height: 1; letter-spacing: -0.04em; color: var(--blue-300); margin: 0 0 var(--space-4); }
.notfound-hero h1 { color: #fff; margin: 0 0 var(--space-4); }
.notfound-hero p { color: var(--text-inverse-muted); font-size: var(--fs-body-lg); max-width: 56ch; margin: 0 auto var(--space-6); }
.notfound-cta { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.notfound-help { background: var(--surface-page); }
.notfound-help .intro { text-align: center; max-width: 640px; margin: 0 auto var(--space-7); }
.help-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.help-card { display: flex; flex-direction: column; align-items: flex-start; background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); padding: var(--space-6); box-shadow: var(--shadow-card); transition: transform var(--transition-base), box-shadow var(--transition-base); }
.help-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-card-hover); }
.help-card .h-icon { width: 52px; height: 52px; border-radius: var(--radius-md); display: inline-grid; place-items: center; background: var(--blue-50); color: var(--navy-700); transition: background var(--transition-base), color var(--transition-base); }
.help-card .h-icon svg { width: 26px; height: 26px; }
.help-card:hover .h-icon { background: var(--navy-700); color: #fff; }
.help-card h3 { font-size: var(--fs-h4); margin: var(--space-4) 0 var(--space-2); }
.help-card p { color: var(--text-muted); font-size: var(--fs-small); margin: 0 0 var(--space-4); }
.help-card .txt-link { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-small); color: var(--navy-700); margin-top: auto; }
.help-card .txt-link svg { width: 16px; height: 16px; }
.help-card:hover .txt-link { color: var(--accent); }
.notfound-phone { text-align: center; margin-top: var(--space-7); color: var(--text-muted); font-size: var(--fs-body); }
.notfound-phone a { font-family: var(--font-heading); font-weight: var(--fw-semibold); color: var(--navy-700); }
.txt-link { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-small); color: var(--navy-700); }
.txt-link svg { width: 16px; height: 16px; }
.txt-link:hover { color: var(--accent); }
.section--navy .txt-link { color: #fff; }
.section--navy .txt-link:hover { color: var(--blue-300); }
.section .intro.wide { max-width: 860px; }
.hero-deck { font-size: var(--fs-body-lg); color: var(--slate-600); font-family: var(--font-heading); font-weight: var(--fw-medium); line-height: 1.4; margin: 0 0 20px; }
.about-hero-photo { position: relative; z-index: 1; border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-lift); }
.about-hero-photo img { width: 100%; height: auto; display: block; }
.why-grid { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 48px; align-items: start; }
.why-grid .why-intro h2 { margin: 0; }
.why-item { margin-bottom: var(--space-6); }
.why-item:last-child { margin-bottom: 0; }
.why-item h3 { font-size: var(--fs-h4); margin: 0 0 var(--space-3); }
.why-item p { color: var(--slate-600); margin: 0; line-height: 1.66; }
.founder:last-child { margin-bottom: 0; }
.f-photo .f-cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 20px 20px 16px; background: linear-gradient(to top, rgba(12,31,61,.92), rgba(12,31,61,0)); }
.f-photo .f-cap b { font-family: var(--font-heading); color: #fff; font-size: 16px; display: block; }
.f-photo .f-cap span { color: var(--text-inverse-muted); font-size: 13px; }
.founder h3 .role-inline { display: block; color: var(--accent); font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-small); letter-spacing: 0; margin-top: 6px; }
.cred-intro { max-width: 820px; margin-bottom: var(--space-7); }
.cred-block { margin-bottom: var(--space-7); }
.cred-block:last-child { margin-bottom: 0; }
.cred-block > h3 { font-size: var(--fs-h4); margin: 0 0 var(--space-4); }
.cred-block > p { color: var(--slate-600); line-height: 1.66; max-width: 82ch; margin: 0 0 var(--space-4); }
.cred-block a { color: var(--navy-700); font-weight: var(--fw-semibold); border-bottom: 1px solid var(--blue-300); }
.cred-block a:hover { color: var(--accent); border-color: var(--accent); }
.cred-row { display: flex; flex-wrap: wrap; gap: 14px; margin-top: var(--space-5); }
.cred-chip { display: inline-flex; flex-direction: column; gap: 3px; padding: 12px 18px; background: var(--blue-50); border-radius: var(--radius-md); min-width: 132px; }
.cred-chip b { font-family: var(--font-heading); font-weight: var(--fw-bold); color: var(--navy-700); font-size: var(--fs-h4); letter-spacing: 0; }
.cred-chip span { font-size: 12px; color: var(--text-muted); }
.proof-band { display: grid; grid-template-columns: auto 1fr; gap: 24px; align-items: start; background: var(--wash-navy); color: #fff; border-radius: var(--radius-xl); padding: var(--space-7); box-shadow: var(--shadow-lift); }
.proof-band .pb-icon { width: 56px; height: 56px; border-radius: var(--radius-md); background: rgba(255,255,255,0.10); border: 1px solid rgba(255,255,255,0.14); color: var(--blue-300); display: inline-grid; place-items: center; }
.proof-band .pb-icon svg { width: 26px; height: 26px; }
.proof-band h3 { color: #fff; font-size: var(--fs-h4); margin: 0 0 var(--space-2); }
.proof-band p { color: var(--text-inverse-muted); margin: 0; line-height: 1.62; }
.bilingual-feature { display: grid; grid-template-columns: auto 1fr; gap: 40px; align-items: start; background: var(--surface-tint); border-radius: var(--radius-xl); padding: var(--space-7); }
.bilingual-feature .bf-icon { width: 64px; height: 64px; border-radius: var(--radius-lg); background: #fff; color: var(--navy-700); display: inline-grid; place-items: center; box-shadow: var(--shadow-xs); }
.bilingual-feature .bf-icon svg { width: 32px; height: 32px; }
.bf-item { margin-bottom: var(--space-5); }
.bf-item:last-child { margin-bottom: 0; }
.bf-item h3 { font-size: var(--fs-h4); margin: 0 0 var(--space-2); }
.bf-item p { color: var(--slate-600); margin: 0; line-height: 1.64; }
.values-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: var(--space-6); }
.value-item { background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); padding: var(--space-6); box-shadow: var(--shadow-card); }
.value-item .v-icon { width: 48px; height: 48px; border-radius: var(--radius-md); background: var(--blue-50); color: var(--navy-700); display: inline-grid; place-items: center; margin-bottom: var(--space-4); }
.value-item .v-icon svg { width: 24px; height: 24px; }
.value-item h3 { font-size: var(--fs-h4); margin: 0 0 var(--space-2); }
.value-item p { color: var(--text-muted); margin: 0; line-height: 1.6; }
.value-item a { color: var(--navy-700); font-weight: var(--fw-semibold); border-bottom: 1px solid var(--blue-300); }
.value-item a:hover { color: var(--accent); border-color: var(--accent); }
.testimonial-card h3 { font-size: var(--fs-h4); color: var(--navy-700); margin: 0 0 var(--space-3); }
.about-cta .intro { max-width: 780px; }
.about-cta .ac-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; margin-top: var(--space-6); }
.about-cta h3 { color: #fff; font-size: var(--fs-h3); margin: 0 0 var(--space-3); }
.about-cta p { color: var(--text-inverse-muted); margin: 0 0 var(--space-5); line-height: 1.6; }
.about-cta .ac-es { margin-top: var(--space-6); }
.services-strip { margin-top: var(--space-7); padding-top: var(--space-6); border-top: 1px solid rgba(255,255,255,0.14); }
.services-strip h3 { color: #fff; font-size: var(--fs-small); text-transform: uppercase; letter-spacing: 0.06em; margin: 0 0 var(--space-3); }
.services-strip .ss-links { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); }
.services-strip .ss-links a { color: var(--blue-300); font-weight: var(--fw-semibold); font-size: var(--fs-small); }
.services-strip .ss-links a:hover { color: #fff; }
.media-block { position: relative; z-index: 1; border-radius: var(--radius-xl); background: var(--wash-navy); box-shadow: var(--shadow-lift); padding: var(--space-8) var(--space-7); min-height: 430px; display: flex; flex-direction: column; justify-content: center; gap: var(--space-6); overflow: hidden; }
.media-block .mb-icons { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; max-width: 240px; }
.media-block .mb-icons span { width: 72px; height: 72px; border-radius: var(--radius-lg); background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.12); display: inline-grid; place-items: center; color: var(--blue-300); }
.media-block .mb-icons svg { width: 32px; height: 32px; }
.media-block .mb-label { margin: 0; color: var(--text-inverse-muted); font-size: var(--fs-small); max-width: 44ch; line-height: 1.55; }
.media-block .mb-tag { position: absolute; top: 16px; right: 16px; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--blue-300); background: rgba(255,255,255,0.08); padding: 4px 10px; border-radius: 4px; }
.problem-grid--2 { grid-template-columns: repeat(2,1fr); }
.hero .cta-row .btn { margin: 0; }
.hero .lead { max-width: 56ch; }
.mid-cta { text-align: center; margin-top: var(--space-7); }
.section--navy h2, .section--navy h3, .section--navy h4 { color: #fff; }
.section--navy p a, .section--navy .inline-link { color: var(--blue-300); text-decoration: underline; text-underline-offset: 2px; }
.section--navy p a:hover, .section--navy .inline-link:hover { color: #fff; }
.prose-link { color: var(--navy-600); text-decoration: underline; text-underline-offset: 2px; }
.prose-link:hover { color: var(--navy-700); }
.def-block { margin-bottom: var(--space-6); }
.def-block:last-child { margin-bottom: 0; }
.def-block h3 { font-size: var(--fs-h3); margin: 0 0 var(--space-3); }
.def-block p { color: var(--text-muted); margin: 0; max-width: 70ch; }
.feature-panel { background: var(--wash-tint); border: 1px solid var(--blue-100); border-radius: var(--radius-xl); padding: var(--space-7); display: grid; grid-template-columns: 64px 1fr; gap: var(--space-5); align-items: start; margin-bottom: var(--space-6); }
.feature-panel .fp-icon { width: 64px; height: 64px; border-radius: var(--radius-md); background: var(--navy-700); color: #fff; display: inline-grid; place-items: center; }
.feature-panel .fp-icon svg { width: 30px; height: 30px; }
.feature-panel h3 { font-size: var(--fs-h3); margin: 0 0 var(--space-3); }
.feature-panel p { margin: 0; color: var(--text-body); max-width: 72ch; }
.navy-split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-7); margin-top: var(--space-6); }
.np-item .np-icon { width: 52px; height: 52px; border-radius: var(--radius-md); background: rgba(255,255,255,0.10); color: #fff; display: inline-grid; place-items: center; margin-bottom: var(--space-4); }
.np-item .np-icon svg { width: 26px; height: 26px; }
.np-item h3 { font-size: var(--fs-h4); margin: 0 0 var(--space-2); }
.np-item p { color: var(--text-inverse-muted); margin: 0; }
.role-list { list-style: none; margin: 0 0 var(--space-7); padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3) var(--space-6); }
.role-list li { display: flex; gap: 12px; align-items: flex-start; color: var(--text-body); }
.role-list li svg { width: 20px; height: 20px; color: var(--blue-500); flex: none; margin-top: 3px; }
.tier-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.tier-grid .service-card p { margin-bottom: 0; }
.proc-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-5); margin-top: var(--space-5); }
.proc-step { display: flex; flex-direction: column; align-items: flex-start; background: var(--gray-50); border-radius: var(--radius-lg); padding: var(--space-5); }
.proc-step .ps-icon { width: 52px; height: 52px; border-radius: var(--radius-md); background: var(--blue-50); color: var(--navy-700); display: inline-grid; place-items: center; margin-bottom: var(--space-4); }
.proc-step .ps-icon svg { width: 24px; height: 24px; }
.proc-step h4 { font-size: var(--fs-h4); margin: 0 0 6px; }
.proc-step p { margin: 0; color: var(--text-muted); }
.proc-follow { max-width: 72ch; margin-top: var(--space-6); color: var(--text-muted); }
.bi-split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-7); align-items: start; }
.bi-col .bi-icon { width: 46px; height: 46px; border-radius: var(--radius-md); background: var(--blue-50); color: var(--navy-700); display: inline-grid; place-items: center; margin-bottom: var(--space-3); }
.bi-col .bi-icon svg { width: 24px; height: 24px; }
.bi-col h3 { font-size: var(--fs-h4); margin: 0 0 var(--space-2); }
.bi-col p { color: var(--text-muted); margin: 0 0 var(--space-4); }
.industry-tags { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.final-cta { text-align: center; }
.final-cta .fc-inner { max-width: 760px; margin: 0 auto; }
.final-cta .paths { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-5); margin-top: var(--space-7); text-align: left; }
.final-cta .path { display: flex; flex-direction: column; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); border-radius: var(--radius-lg); padding: var(--space-6); }
.final-cta .path h3 { margin: 0 0 var(--space-2); font-size: var(--fs-h4); }
.final-cta .path p { color: var(--text-inverse-muted); margin: 0 0 var(--space-5); font-size: var(--fs-small); }
.final-cta .path .btn { width: 100%; margin-top: auto; }
.related { margin-top: var(--space-7); padding-top: var(--space-6); border-top: 1px solid rgba(255,255,255,0.12); display: flex; gap: var(--space-3) var(--space-5); flex-wrap: wrap; align-items: center; justify-content: center; }
.related .rel-label { font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-small); color: #fff; }
.related a { color: var(--blue-300); font-size: var(--fs-small); text-decoration: underline; text-underline-offset: 2px; }
.related a:hover { color: #fff; }
.def-columns { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 48px; align-items: start; }
.def-lead { background: var(--wash-tint); border: 1px solid var(--blue-100); border-radius: var(--radius-lg); padding: var(--space-6); }
.def-lead .def-h3 { display: flex; align-items: center; gap: var(--space-2); font-size: var(--fs-h4); margin: 0 0 var(--space-3); }
.def-lead .def-h3 svg { width: 20px; height: 20px; color: var(--accent); flex: none; }
.def-lead p { margin: 0; font-size: var(--fs-body-lg); line-height: 1.55; color: var(--ink); }
.signs { list-style: none; margin: var(--space-4) 0 0; padding: 0; display: grid; gap: var(--space-3); }
.signs li { display: flex; gap: 12px; align-items: flex-start; color: var(--text-body); }
.signs li svg { width: 20px; height: 20px; color: var(--blue-500); flex: none; margin-top: 3px; }
.cmp-wrap { overflow-x: auto; border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); box-shadow: var(--shadow-card); -webkit-overflow-scrolling: touch; }
.cmp-table { width: 100%; min-width: 760px; border-collapse: collapse; background: var(--surface-card); }
.cmp-table thead th { background: var(--navy-700); color: #fff; font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-small); text-align: left; padding: 16px 18px; vertical-align: bottom; letter-spacing: 0.01em; }
.cmp-table thead th:first-child { background: var(--navy-800); }
.cmp-table thead th.cmp-rec { position: relative; background: var(--navy-900); }
.cmp-table thead th.cmp-rec::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--accent); }
.cmp-table tbody th { text-align: left; font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-small); color: var(--navy-700); background: var(--blue-50); padding: 14px 18px; width: 20%; vertical-align: top; }
.cmp-table tbody td { padding: 14px 18px; font-size: var(--fs-small); line-height: 1.5; color: var(--text-body); vertical-align: top; border-top: 1px solid var(--border-subtle); }
.cmp-table tbody tr:nth-child(even) td { background: var(--gray-50); }
.cmp-table tbody tr:nth-child(even) th { background: var(--blue-100); }
.cmp-table td.cmp-rec { background: var(--blue-50); font-weight: var(--fw-medium); color: var(--ink); }
.cmp-table tbody tr:nth-child(even) td.cmp-rec { background: var(--blue-100); }
.cmp-hint { font-size: var(--fs-small); color: var(--text-muted); margin: var(--space-3) 0 0; }
.cmp-notes { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-6); margin-top: var(--space-7); }
.cmp-note h3 { font-size: var(--fs-h4); margin: 0 0 var(--space-2); }
.cmp-note p { color: var(--text-muted); margin: 0; }
.section--navy :is(h1,h2,h3,h4) { color: #fff; }
.section--navy p { color: var(--text-inverse-muted); }
.section--navy .lead { color: var(--text-inverse-muted); }
.section--navy .muted { color: var(--text-inverse-muted); }
.section--navy a:not(.btn) { color: var(--blue-300); text-decoration: underline; text-underline-offset: 2px; }
.section--navy a:not(.btn):hover { color: #fff; }
.prose a, .svc-menu-card p a, .story-copy p a, .narrative-card p a, .qa-card p a { color: var(--navy-600); text-decoration: underline; text-underline-offset: 2px; }
.prose a:hover, .svc-menu-card p a:hover, .story-copy p a:hover, .narrative-card p a:hover, .qa-card p a:hover { color: var(--accent); }
.duo { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-6); align-items: stretch; }
.narrative-card { background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); padding: var(--space-6); box-shadow: var(--shadow-card); }
.narrative-card .n-icon { width: 46px; height: 46px; border-radius: var(--radius-md); background: var(--blue-50); color: var(--navy-700); display: inline-grid; place-items: center; margin-bottom: var(--space-4); }
.narrative-card .n-icon svg { width: 24px; height: 24px; }
.narrative-card h3 { font-size: var(--fs-h3); margin: 0 0 var(--space-3); }
.narrative-card p { color: var(--text-muted); margin: 0; }
.svc-grid { display: grid; gap: var(--space-5); }
.svc-grid--3 { grid-template-columns: repeat(3, 1fr); }
.svc-grid--2 { grid-template-columns: repeat(2, 1fr); }
.svc-menu-card { display: flex; flex-direction: column; }
.svc-menu-card .svc-icon { width: 52px; height: 52px; border-radius: var(--radius-md); display: inline-grid; place-items: center; background: var(--blue-50); color: var(--navy-700); transition: background var(--transition-base), color var(--transition-base); }
.svc-menu-card .svc-icon svg { width: 26px; height: 26px; }
.svc-menu-card:hover .svc-icon { background: var(--navy-700); color: #fff; }
.svc-menu-card h3 { font-size: var(--fs-h4); margin: var(--space-4) 0 var(--space-3); }
.svc-menu-card p { color: var(--text-muted); margin: 0 0 var(--space-3); }
.svc-menu-card p + p { margin-top: 0; }
.svc-cta { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; padding-top: var(--space-2); font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-small); color: var(--accent); transition: gap var(--transition-fast), color var(--transition-fast); }
.svc-cta svg { width: 16px; height: 16px; }
.svc-cta:hover { color: var(--accent-hover); gap: 10px; }
.compliance-split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-6); align-items: start; }
.compliance-visual { position: sticky; top: 98px; border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-card); }
body.admin-bar .compliance-visual { top: 130px; }
.compliance-visual img { width: 100%; height: auto; display: block; }
.compliance-cards { display: grid; gap: var(--space-5); }
.hero--navy .hero-visual::before { background: var(--navy-600); opacity: 0.55; }
.hero .lead strong { color: var(--text-heading); font-weight: var(--fw-semibold); }
.hero--navy .lead strong { color: #fff; }
.hero--navy .trust { color: var(--text-inverse-muted); }
.hero--navy .trust b { color: #fff; }
.final-simple .container { display: block; }
.final-simple .intro { margin-left: auto; margin-right: auto; text-align: center; }
.final-paths { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-6); max-width: 820px; margin: 0 auto; }
.final-paths .path { display: flex; flex-direction: column; }
.final-paths .path .btn { margin-top: auto; }
.final-paths .path h3 { color: #fff; margin: 0 0 var(--space-3); }
.final-paths .path p { color: var(--text-inverse-muted); margin: 0 0 var(--space-4); }
.final-foot { text-align: center; color: var(--text-inverse-muted); font-size: var(--fs-small); max-width: 640px; margin: var(--space-7) auto 0; }
.final-foot a { color: var(--blue-300); text-decoration: underline; text-underline-offset: 2px; }
.final-foot a:hover { color: #fff; }
.hero--navy .media-block { background: linear-gradient(150deg, var(--navy-600) 0%, var(--navy-700) 100%); border: 1px solid rgba(255,255,255,0.12); }
.hero--navy { background: var(--wash-navy); }
.timeline { display: grid; gap: var(--space-6); max-width: 880px; }
.timeline-step { display: grid; grid-template-columns: 54px 1fr; gap: var(--space-5); position: relative; }
.timeline-step .t-icon { width: 54px; height: 54px; border-radius: 50%; background: var(--navy-700); color: #fff; display: inline-grid; place-items: center; position: relative; z-index: 1; }
.timeline-step .t-icon svg { width: 24px; height: 24px; }
.timeline-step:not(:last-child)::before { content: ""; position: absolute; left: 26px; top: 54px; bottom: calc(-1 * var(--space-6)); width: 2px; background: repeating-linear-gradient(180deg, var(--blue-300) 0 8px, transparent 8px 16px); }
.timeline-step h3 { font-size: var(--fs-h3); margin: 4px 0 var(--space-2); }
.timeline-step p { color: var(--text-muted); margin: 0; }
.cmp-table th, .cmp-table td { padding: 15px 18px; text-align: left; vertical-align: top; font-size: var(--fs-small); border-bottom: 1px solid var(--border-subtle); }
.cmp-table thead th.col-interim { background: var(--accent-hover); }
.cmp-table td.col-interim { background: var(--accent-soft); color: var(--coral-600); font-weight: var(--fw-medium); }
.cmp-table tbody tr:last-child th, .cmp-table tbody tr:last-child td { border-bottom: none; }
.story { display: grid; grid-template-columns: 350px 1fr; gap: var(--space-7); align-items: start; }
.story-photo { border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-lift); position: relative; }
.story-photo img { width: 100%; height: 470px; object-fit: cover; object-position: center 22%; display: block; }
.story-photo .cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 20px 20px 16px; background: linear-gradient(to top, rgba(12,31,61,.94), rgba(12,31,61,0)); }
.story-photo .cap b { font-family: var(--font-heading); color: #fff; font-size: 17px; display: block; }
.story-photo .cap span { color: var(--text-inverse-muted); font-size: var(--fs-small); }
.story-copy > * + * { margin-top: var(--space-6); }
.story-copy h3 { font-size: var(--fs-h3); margin: 0 0 var(--space-3); }
.story-copy p { color: var(--text-muted); margin: 0; }
.qa-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-5); }
.qa-card { background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); padding: var(--space-6); box-shadow: var(--shadow-card); transition: transform var(--transition-base), box-shadow var(--transition-base); }
.qa-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-card-hover); }
.qa-card .qa-icon { width: 46px; height: 46px; border-radius: var(--radius-md); background: var(--accent-soft); color: var(--coral-600); display: inline-grid; place-items: center; margin-bottom: var(--space-3); }
.qa-card .qa-icon svg { width: 24px; height: 24px; }
.qa-card h3 { font-size: var(--fs-h4); margin: 0 0 var(--space-3); }
.qa-card p { color: var(--text-muted); margin: 0; }
.cta-center { text-align: center; margin-top: var(--space-7); }
.hero .trust .es-line { color: var(--slate-500); font-style: italic; }
.definition .definition-lead { font-size: var(--fs-body-lg); color: var(--ink); line-height: 1.62; max-width: 66ch; margin: 0 0 var(--space-4); }
.definition .definition-lead .accent-word { color: var(--navy-700); font-weight: var(--fw-semibold); }
.def-item p { max-width: 88ch; }
.def-item { padding: var(--space-6) 0; border-top: 1px solid var(--border-subtle); }
.def-item:first-child { border-top: none; padding-top: var(--space-3); }
.def-item h3 { font-size: var(--fs-h3); margin: 0 0 var(--space-3); }
.def-item p { color: var(--slate-600); margin: 0; line-height: 1.68; }
.rc-group { margin-top: var(--space-7); }
.rc-group + .rc-group { margin-top: var(--space-8); }
.rc-group > h3 { font-size: var(--fs-h3); margin: 0 0 var(--space-5); }
.resource-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
.resource-card { display: flex; flex-direction: column; background: var(--surface-card); border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); padding: var(--space-6); box-shadow: var(--shadow-card); }
.resource-card .rc-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--space-4); }
.resource-card .rc-icon { width: 48px; height: 48px; border-radius: var(--radius-md); background: var(--blue-50); color: var(--navy-700); display: inline-grid; place-items: center; }
.resource-card .rc-icon svg { width: 24px; height: 24px; }
.resource-card .rc-soon { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--slate-500); background: var(--gray-100); padding: 4px 10px; border-radius: 4px; }
.resource-card .rc-soon svg { width: 13px; height: 13px; }
.resource-card h4 { font-size: var(--fs-h4); margin: 0 0 var(--space-2); }
.resource-card .rc-teaser { color: var(--text-muted); font-size: var(--fs-small); margin: 0 0 var(--space-5); line-height: 1.6; }
.resource-card .rc-cta { margin-top: auto; }
.resource-card .rc-cta:hover { color: var(--accent); }
.resource-card .rc-cta svg { transition: transform var(--transition-fast); }
.resource-card .rc-cta:hover svg { transform: translateX(3px); }
.pathway-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: var(--space-6); }
.pathway-card { background: var(--surface-tint); border-radius: var(--radius-lg); padding: var(--space-6); }
.pathway-card .pw-icon { width: 46px; height: 46px; border-radius: var(--radius-md); background: #fff; color: var(--navy-700); display: inline-grid; place-items: center; box-shadow: var(--shadow-xs); margin-bottom: var(--space-4); }
.pathway-card .pw-icon svg { width: 24px; height: 24px; }
.pathway-card h3 { font-size: var(--fs-h4); margin: 0 0 var(--space-3); }
.pathway-card p { color: var(--slate-600); margin: 0; line-height: 1.62; }
.pathway-card a { color: var(--navy-700); font-weight: var(--fw-semibold); border-bottom: 1px solid var(--blue-300); }
.pathway-card a:hover { color: var(--accent); border-color: var(--accent); }
.schedule-band .intro { max-width: 820px; }
.schedule-band .sb-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; margin-top: var(--space-6); }
.schedule-band h3 { color: #fff; font-size: var(--fs-h3); margin: 0 0 var(--space-3); }
.schedule-band p { color: var(--text-inverse-muted); margin: 0 0 var(--space-5); line-height: 1.6; }
.schedule-band .sb-es { margin-top: var(--space-6); }
.faq-item .faq-a a { color: var(--navy-700); font-weight: var(--fw-semibold); }
.btn svg { width: 18px; height: 18px; }
.section .intro .lead { margin-bottom: 0; }
.reach-grid { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 40px; align-items: start; }
.reach-block { margin-bottom: var(--space-6); }
.reach-block:last-child { margin-bottom: 0; }
.reach-block h3 { font-size: var(--fs-h4); margin: 0 0 var(--space-2); display: flex; align-items: center; gap: 10px; }
.reach-block h3 svg { width: 20px; height: 20px; color: var(--blue-500); flex: none; }
.reach-block p { color: var(--text-muted); margin: 0 0 var(--space-3); }
.reach-block .btn { margin-top: 2px; }
.nap-card { background: var(--wash-navy); color: #fff; border-radius: var(--radius-xl); padding: var(--space-6); box-shadow: var(--shadow-card); }
.nap-card h3 { color: #fff; font-size: var(--fs-h4); margin: 0 0 var(--space-5); }
.nap-row { display: flex; gap: 12px; align-items: flex-start; margin-bottom: var(--space-4); }
.nap-row:last-child { margin-bottom: 0; }
.nap-row svg { width: 20px; height: 20px; color: var(--blue-300); flex: none; margin-top: 2px; }
.nap-row .lbl { display: block; font-size: var(--fs-overline); text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-inverse-muted); margin-bottom: 2px; }
.nap-row a { color: #fff; }
.nap-row a:hover { color: var(--blue-100); }
.area-split { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 44px; align-items: start; }
.area-copy h3 { font-size: var(--fs-h4); margin: 0 0 var(--space-2); }
.area-copy h3:not(:first-child) { margin-top: var(--space-5); }
.area-copy p { color: var(--text-muted); margin: 0; }
.county-panel { background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-xl); padding: var(--space-6); box-shadow: var(--shadow-card); }
.county-panel .cp-title { font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-overline); text-transform: uppercase; letter-spacing: 0.1em; color: var(--slate-500); margin-bottom: var(--space-5); }
.county-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-4); }
.county-list li { display: flex; gap: 12px; align-items: center; font-family: var(--font-heading); font-weight: var(--fw-medium); font-size: var(--fs-body-lg); color: var(--navy-700); }
.county-list li svg { width: 22px; height: 22px; color: var(--accent); flex: none; }
.inquiry-form { max-width: 660px; margin: 0 auto; background: #fff; border-radius: var(--radius-xl); padding: var(--space-7); box-shadow: var(--shadow-lift); border: 1px solid var(--border-subtle); }
.inquiry-form .row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.inquiry-form .opt { color: var(--text-muted); font-weight: var(--fw-body); }
.inquiry-form .btn { width: 100%; margin-top: var(--space-2); }
.pathway { text-align: center; }
.pathway .inner { max-width: 760px; margin: 0 auto; }
.pathway h2 { color: #fff; }
.pathway p { color: var(--text-inverse-muted); max-width: 66ch; margin: 0 auto; }
.pathway .btn { margin-top: var(--space-6); }
.section .intro .overline { justify-content: center; }
.sched-hero { background: var(--wash-tint); }
.sched-hero .container { max-width: 840px; text-align: center; padding-top: 72px; padding-bottom: 60px; }
.sched-hero h1 { font-size: var(--fs-h1); margin: 12px 0 20px; }
.sched-hero .lead { color: var(--slate-600); max-width: 64ch; margin: 0 auto; }
.call-split { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 48px; align-items: center; max-width: 1000px; margin: 0 auto; }
.call-photo { position: relative; border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-lift); }
.call-photo img { width: 100%; height: 380px; object-fit: cover; object-position: center 18%; display: block; }
.call-photo .cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 20px 20px 16px; background: linear-gradient(to top, rgba(12,31,61,.94), rgba(12,31,61,0)); }
.call-photo .cap b { font-family: var(--font-heading); color: #fff; font-size: 17px; display: block; }
.call-photo .cap span { color: var(--text-inverse-muted); font-size: var(--fs-small); }
.call-copy p { color: var(--text-body); margin: 0; }
.reassure { max-width: 760px; margin: 0 auto; text-align: center; }
.reassure .r-icon { width: 60px; height: 60px; border-radius: 50%; background: var(--surface-tint); color: var(--navy-700); display: grid; place-items: center; margin: 0 auto var(--space-4); }
.reassure .r-icon svg { width: 28px; height: 28px; }
.reassure p { color: var(--text-muted); margin: 0; }
.calendly-panel { max-width: 860px; margin: 0 auto; border-radius: var(--radius-xl); border: 1.5px dashed var(--border-strong); background: var(--surface-tint); padding: var(--space-8) var(--space-6); text-align: center; }
.calendly-panel .cal-icon { width: 64px; height: 64px; border-radius: 50%; background: var(--navy-700); color: #fff; display: inline-grid; place-items: center; margin-bottom: var(--space-4); }
.calendly-panel .cal-icon svg { width: 30px; height: 30px; }
.calendly-panel .cal-label { font-family: var(--font-heading); font-weight: var(--fw-semibold); color: var(--navy-700); font-size: var(--fs-h4); margin: 0 0 var(--space-2); }
.calendly-panel .cal-note { color: var(--text-muted); font-size: var(--fs-small); max-width: 54ch; margin: 0 auto; }
.calendly-caption { max-width: 860px; margin: var(--space-4) auto 0; display: flex; gap: 10px; align-items: flex-start; justify-content: center; color: var(--slate-500); font-size: var(--fs-small); }
.calendly-caption svg { width: 16px; height: 16px; flex: none; margin-top: 2px; color: var(--blue-500); }
.qual-form { max-width: 720px; margin: 0 auto; background: #fff; border-radius: var(--radius-xl); padding: var(--space-7); box-shadow: var(--shadow-lift); border: 1px solid var(--border-subtle); }
.qual-form .row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.check-legend { display: block; font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-small); color: var(--navy-700); margin-bottom: var(--space-3); border: 0; padding: 0; }
.check-group { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0; padding: 0; border: 0; }
.check-item { display: flex; gap: 10px; align-items: center; padding: 11px 13px; border: 1.5px solid var(--border); border-radius: var(--radius-md); cursor: pointer; transition: border-color var(--transition-fast), background var(--transition-fast); font-size: var(--fs-small); color: var(--ink); }
.check-item:hover { border-color: var(--blue-500); background: var(--blue-50); }
.check-item input { width: 18px; height: 18px; accent-color: var(--accent); flex: none; }
.ty-hero { background: var(--wash-tint); }
.ty-hero .container { max-width: 760px; text-align: center; padding-top: 76px; padding-bottom: 60px; }
.ty-confirm { display: flex; align-items: center; justify-content: center; gap: 12px; margin-bottom: var(--space-4); }
.ty-confirm .overline { margin: 0; }
.ty-check { width: 40px; height: 40px; border-radius: 50%; background: var(--accent-soft); color: var(--coral-600); display: inline-grid; place-items: center; flex: none; }
.ty-check svg { width: 22px; height: 22px; }
.ty-hero h1 { font-size: var(--fs-h1); margin: 0 0 18px; }
.ty-hero .lead { color: var(--slate-600); max-width: 60ch; margin: 0 auto var(--space-5); }
.ty-hero .call-link { font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-body); color: var(--navy-700); display: inline-flex; align-items: center; gap: 8px; }
.ty-hero .call-link svg { width: 18px; height: 18px; color: var(--blue-500); }
.ty-hero .call-link:hover { color: var(--accent); }
.ty-steps { max-width: 860px; margin: 0 auto; display: grid; gap: var(--space-4); }
.ty-step { display: grid; grid-template-columns: 52px 1fr; gap: 20px; align-items: flex-start; background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); padding: var(--space-5) var(--space-6); box-shadow: var(--shadow-card); }
.ty-step .st-icon { width: 52px; height: 52px; border-radius: var(--radius-md); background: var(--navy-700); color: #fff; display: inline-grid; place-items: center; }
.ty-step .st-icon svg { width: 24px; height: 24px; }
.ty-step p { margin: 0; color: var(--text-muted); align-self: center; }
.ty-step p strong { color: var(--navy-700); font-family: var(--font-heading); font-weight: var(--fw-semibold); }
.ty-wait { max-width: 680px; margin: 0 auto; text-align: center; }
.ty-wait p { color: var(--text-muted); }
.ty-wait .txt-link { margin-top: var(--space-2); }
.ty-es { color: var(--text-muted); font-size: var(--fs-small); margin-top: var(--space-6); }
.legal-hero { background: var(--wash-tint); border-bottom: 1px solid var(--border-subtle); }
.legal-hero .container { padding-top: 72px; padding-bottom: 56px; }
.legal-hero h1 { font-size: var(--fs-h1); margin: var(--space-3) 0 var(--space-4); max-width: 20ch; }
.legal-disclaimer { display: flex; gap: var(--space-3); align-items: flex-start; background: var(--blue-50); border: 1px solid var(--blue-100); border-radius: var(--radius-md); padding: var(--space-4) var(--space-5); margin: 0 0 var(--space-4); max-width: 62ch; }
.legal-disclaimer svg { width: 22px; height: 22px; color: var(--navy-700); flex: none; margin-top: 1px; }
.legal-disclaimer p { margin: 0; font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-small); color: var(--navy-700); }
.legal-date { color: var(--text-muted); font-size: var(--fs-small); margin: 0 0 var(--space-4); }
.legal-intro { max-width: 68ch; color: var(--slate-600); font-size: var(--fs-body-lg); line-height: 1.6; margin: 0; }
.legal-main { background: var(--surface-page); }
.legal-layout { display: grid; grid-template-columns: 236px 1fr; gap: var(--space-8); align-items: start; }
.legal-toc { position: sticky; top: 98px; }
body.admin-bar .legal-toc { top: 130px; }
.legal-toc .toc-title { font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-overline); letter-spacing: var(--ls-overline); text-transform: uppercase; color: var(--blue-600); margin: 0 0 var(--space-3); }
.legal-toc nav { display: flex; flex-direction: column; gap: 2px; border-top: 2px solid var(--blue-100); padding-top: var(--space-3); }
.legal-toc a { color: var(--slate-500); font-size: var(--fs-small); line-height: 1.35; padding: 6px 0; text-decoration: none; }
.legal-toc a:hover { color: var(--navy-700); }
.legal-body { max-width: 72ch; }
.legal-block { padding-bottom: var(--space-7); margin-bottom: var(--space-7); border-bottom: 1px solid var(--border-subtle); scroll-margin-top: 96px; }
.legal-block:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.legal-body h2 { font-size: clamp(22px, 2.4vw, 26px); line-height: var(--lh-subheading); margin: 0 0 var(--space-4); }
.legal-body h3 { font-size: var(--fs-h4); color: var(--navy-600); margin: var(--space-5) 0 var(--space-2); }
.legal-body p { color: var(--ink); margin: 0 0 var(--space-4); line-height: 1.75; }
.legal-body p:last-child { margin-bottom: 0; }
.legal-body a { color: var(--navy-600); text-decoration: underline; text-underline-offset: 2px; }
.legal-body a:hover { color: var(--navy-700); }
.legal-body a.link-cta { text-decoration: none; }
.legal-list { list-style: none; margin: 0 0 var(--space-4); padding: 0; display: grid; gap: var(--space-3); }
.legal-list li { display: flex; gap: var(--space-3); align-items: flex-start; color: var(--ink); line-height: 1.65; }
.legal-list li svg { width: 18px; height: 18px; color: var(--blue-500); flex: none; margin-top: 5px; }
.legal-list li strong { color: var(--navy-700); font-family: var(--font-heading); font-weight: var(--fw-semibold); }
.link-cta { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-small); color: var(--navy-700); }
.link-cta svg { width: 16px; height: 16px; }
.link-cta:hover { color: var(--accent); }
.legal-contact { background: var(--blue-50); border: 1px solid var(--blue-100); border-radius: var(--radius-lg); padding: var(--space-6); margin-top: var(--space-4); }
.legal-contact .nap { font-style: normal; line-height: 1.85; font-size: var(--fs-body); color: var(--ink); margin: 0 0 var(--space-4); }
.legal-contact .nap strong { color: var(--navy-700); font-family: var(--font-heading); font-weight: var(--fw-semibold); display: block; margin-bottom: 2px; }
.legal-contact .contact-ctas { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-6); }
.legal-table-wrap { overflow-x: auto; margin: var(--space-2) 0 var(--space-4); border: 1px solid var(--border); border-radius: var(--radius-md); }
.legal-table { width: 100%; border-collapse: collapse; font-size: var(--fs-small); min-width: 560px; }
.legal-table th, .legal-table td { text-align: left; padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--border); vertical-align: top; }
.legal-table thead th { background: var(--navy-700); color: #fff; font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-overline); letter-spacing: 0.03em; text-transform: uppercase; }
.legal-table tbody tr:nth-child(even) { background: var(--gray-50); }
.legal-table tbody tr:last-child td { border-bottom: none; }
.legal-table td strong { color: var(--navy-700); font-family: var(--font-heading); font-weight: var(--fw-semibold); }
.status-active { color: var(--success); font-weight: var(--fw-semibold); }
.status-planned { color: var(--blue-600); font-weight: var(--fw-semibold); }
.status-none { color: var(--text-muted); font-weight: var(--fw-semibold); }
.post-hero { background: var(--wash-tint); border-bottom: 1px solid var(--border-subtle); }
.post-hero .container { max-width: 820px; padding-top: 64px; padding-bottom: 40px; }
.post-hero h1 { font-size: var(--fs-h1); margin: var(--space-3) 0 var(--space-5); }
.post-byline { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; color: var(--text-muted); font-size: var(--fs-small); }
.post-byline .avatar { width: 40px; height: 40px; border-radius: 50%; overflow: hidden; box-shadow: var(--shadow-xs); flex: none; }
.post-byline .avatar img { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; }
.post-byline b { color: var(--navy-700); font-family: var(--font-heading); font-weight: var(--fw-semibold); }
.post-byline .sep { color: var(--blue-300); }
.post-featured { max-width: 900px; margin: 0 auto; padding: 0 var(--container-pad); margin-top: calc(-1 * var(--space-8)); position: relative; z-index: 2; }
.featured-panel { position: relative; border-radius: var(--radius-xl); overflow: hidden; background: var(--wash-navy); box-shadow: var(--shadow-lift); aspect-ratio: 1200 / 630; display: grid; place-items: center; }
.featured-panel .fp-mark { display: grid; place-items: center; gap: var(--space-3); color: var(--blue-300); text-align: center; }
.featured-panel .fp-mark svg { width: 52px; height: 52px; }
.featured-panel .fp-mark span { font-family: var(--font-heading); font-size: var(--fs-small); font-weight: var(--fw-semibold); letter-spacing: 0.03em; color: var(--text-inverse-muted); }
.featured-cap { position: absolute; left: 16px; bottom: 16px; background: rgba(255,255,255,0.94); color: var(--navy-700); font-family: var(--font-heading); font-size: 12px; font-weight: var(--fw-semibold); padding: 6px 12px; border-radius: var(--radius-sm); box-shadow: var(--shadow-xs); }
.post-body { max-width: 720px; margin: 0 auto; padding: var(--space-9) var(--container-pad); }
.post-body .post-lead { font-size: var(--fs-body-lg); color: var(--slate-600); line-height: 1.6; margin: 0 0 var(--space-6); }
.post-body h2 { font-size: clamp(24px, 2.8vw, 30px); margin: var(--space-8) 0 var(--space-4); }
.post-body h3 { font-size: var(--fs-h3); color: var(--navy-600); margin: var(--space-6) 0 var(--space-3); }
.post-body p { color: var(--ink); margin: 0 0 var(--space-5); line-height: 1.75; }
.post-body a { color: var(--navy-600); text-decoration: underline; text-underline-offset: 2px; }
.post-body a:hover { color: var(--navy-700); }
.inline-cta .btn { flex: none; }
.author-box { max-width: 720px; margin: 0 auto; padding: 0 var(--container-pad) var(--space-9); }
.author-card { display: grid; grid-template-columns: 96px 1fr; gap: var(--space-5); align-items: center; background: var(--gray-50); border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); padding: var(--space-6); }
.author-card .a-photo { width: 96px; height: 96px; border-radius: 50%; overflow: hidden; box-shadow: var(--shadow-card); }
.author-card .a-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 18%; }
.author-card .a-name { font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-h4); color: var(--navy-700); margin: 0 0 2px; }
.author-card .a-creds { color: var(--accent); font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-small); margin: 0 0 var(--space-2); }
.author-card .a-bio { color: var(--text-muted); font-size: var(--fs-small); margin: 0; line-height: 1.6; }
.related .intro { margin-bottom: var(--space-6); }
.related-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.related-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-card); transition: transform var(--transition-base), box-shadow var(--transition-base); }
.related-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-card-hover); }
.related-card .rc-thumb { aspect-ratio: 16 / 9; background: var(--wash-navy); display: grid; place-items: center; color: var(--blue-300); }
.related-card .rc-thumb svg { width: 30px; height: 30px; }
.related-card .rc-body { padding: var(--space-5); display: flex; flex-direction: column; flex: 1; }
.related-card .rc-kicker { font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-overline); letter-spacing: var(--ls-overline); text-transform: uppercase; color: var(--blue-600); margin: 0 0 var(--space-2); }
.related-card h3 { font-size: var(--fs-h4); margin: 0 0 var(--space-3); }
.related-card .txt-link { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--fs-small); color: var(--navy-700); margin-top: auto; }
.related-card .txt-link svg { width: 16px; height: 16px; }
.related-card:hover .txt-link { color: var(--accent); }
.post-cta { background: var(--wash-navy); text-align: center; }
.post-cta .container { max-width: 720px; }
.post-cta h2 { color: #fff; margin: 0 0 var(--space-3); }
.post-cta p { color: var(--text-inverse-muted); font-size: var(--fs-body-lg); margin: 0 auto var(--space-6); max-width: 52ch; }
.post-cta .cta-row { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

@media (max-width: 960px) {
.help-grid { grid-template-columns: 1fr; }
.hero .container { grid-template-columns: 1fr; }
.why-grid, .proof-band, .bilingual-feature, .values-grid, .testi-grid, .about-cta .ac-cols { grid-template-columns: 1fr; }
.trust-grid, .problem-grid, .problem-grid--2, .services-grid, .usp-grid, .compare, .steps, .testi-grid, .area-grid { grid-template-columns: 1fr; }
.cmp-notes, .navy-split, .tier-grid, .role-list, .bi-split, .final-cta .paths, .def-columns { grid-template-columns: 1fr; }
.feature-panel { grid-template-columns: 1fr; }
.final-cta .paths { text-align: center; }
.hero .container, .final .container { grid-template-columns: 1fr; }
.duo, .qa-grid, .final-paths { grid-template-columns: 1fr; }
.compliance-split { grid-template-columns: 1fr; }
.compliance-visual { position: static; }
.story { grid-template-columns: 1fr; }
.story-photo img { height: 400px; }
.resource-grid, .pathway-grid, .schedule-band .sb-cols { grid-template-columns: 1fr; }
.reach-grid, .area-split { grid-template-columns: 1fr; }
.inquiry-form .row2 { grid-template-columns: 1fr; }
.legal-layout { grid-template-columns: 1fr; gap: var(--space-6); }
.legal-toc { position: static; }
.legal-toc nav { flex-flow: row wrap; gap: var(--space-2) var(--space-4); }
.related-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
.btn { white-space: normal; }
.cta-row > .btn { width: 100%; justify-content: center; text-align: center; }
.header-actions .btn { padding: 9px 14px; font-size: var(--fs-small); text-align: center; }
.hero .container { padding-top: 48px; padding-bottom: 56px; }
.cta-row { flex-direction: column; align-items: stretch; }
.header-actions .bilingual { display: none; }
.trust { row-gap: 8px; }
.problem-grid, .problem-grid--2 { grid-template-columns: 1fr; }
.site-header .header-actions .bilingual { display: none; }
.ty-confirm { flex-direction: column; gap: var(--space-4); }
.ty-check { width: 78px; height: 78px; }
.ty-check svg { width: 40px; height: 40px; }
.legal-layout > * { min-width: 0; }
.legal-body { min-width: 0; overflow-wrap: break-word; }
.legal-table-wrap { max-width: 100%; overflow-x: auto; }
.author-card { grid-template-columns: 1fr; }
}

@media (max-width: 1040px) {
.svc-grid--3, .proc-steps { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 680px) {
.svc-grid--3, .svc-grid--2, .area-grid, .proc-steps { grid-template-columns: 1fr; }
.timeline-step { grid-template-columns: 44px 1fr; gap: var(--space-4); }
.timeline-step .t-icon { width: 44px; height: 44px; }
.timeline-step .t-icon svg { width: 20px; height: 20px; }
.timeline-step:not(:last-child)::before { left: 21px; top: 44px; }
}

@media (max-width: 860px) {
.call-split { grid-template-columns: 1fr; }
.call-photo { order: -1; }
.qual-form .row2, .check-group { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
.ty-step { grid-template-columns: 44px 1fr; gap: 16px; padding: var(--space-5); }
}

/* Schedule page: paired two-column splits. Calendar leads on Pick a Time, form leads on Send Details,
   so the two interactive elements sit on opposite sides and the page reads as a mirrored pair. */
.sched-split { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 48px; align-items: start; max-width: 1120px; margin: 0 auto; }
.sched-split--form { grid-template-columns: 0.85fr 1.15fr; }
.sched-split .sched-copy { max-width: none; margin-bottom: 0; }
.sched-split .sched-copy .overline { justify-content: flex-start; }
.sched-split .sched-copy h2 { margin-top: 0; }
.sched-split .sched-copy .lead { margin-bottom: 0; }
.sched-split .qual-form { max-width: none; margin: 0; }
.sched-embed .calendly-inline-widget { border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-lift); background: #fff; }
@media (max-width: 960px) {
  .sched-split, .sched-split--form { grid-template-columns: 1fr; gap: 32px; align-items: start; }
  /* On a narrow screen the explanation should arrive before the calendar, not after it. */
  .sched-split .sched-copy { order: -1; }
  .sched-split--form .sched-copy { order: 0; }
}

/* Eyebrow subtitles carry a 2px accent underline site-wide. .overline is inline-flex, so the
   rule hugs the text width automatically and needs no per-section handling. Replaces the
   orange leading dash that was retired on 2026-07-23. */
.overline { padding-bottom: 1px; line-height: 1; border-bottom: 2px solid var(--accent); }
.section--navy .overline { border-bottom-color: var(--accent); }

/* Mobile fixes, 2026-07-23.
   1. The header logo is a flex item beside the menu toggle and the CTA. Without an explicit
      no-shrink it compresses horizontally on narrow screens, which reads as a squashed logo.
   2. The hero trust row was display:flex with no wrap, so on a phone the two claims were
      crushed onto one line instead of stacking. Stack them and drop the middot separator,
      which only makes sense when the items sit side by side.
   3. "Prefer to Talk Now" follows the schedule button directly. Once the final CTA columns
      stack on mobile it crowds the button above it, so give it real separation. */
.site-header .brand { flex-shrink: 0; }
.site-header .brand img { flex-shrink: 0; max-width: none; }
.final .cta-stack + h3 { margin-top: var(--space-6); }

@media (max-width: 640px) {
  .site-header .bar { height: 74px; gap: var(--space-3); }
  .site-header .brand img { height: 52px; }
  .hero .trust, .trust { flex-direction: column; align-items: flex-start; gap: 8px; }
  .hero .trust > span:nth-of-type(2), .trust > span:nth-of-type(2) { display: none; }
  .final .cta-stack + h3 { margin-top: var(--space-7); }
}

/* Long-token overflow guard, 2026-07-23.
   An email address is a single unbreakable token: no spaces, no hyphens. A browser will not
   break it, so in a narrow column it pushes its container wider than the viewport and the
   whole page picks up a horizontal scroll on a phone. Allow the break at the source rather
   than masking it with overflow-x:hidden, which would hide any future overflow bug too.
   Applied to every mailto and tel link plus the footer NAP block. */
a[href^="mailto:"], a[href^="tel:"] { overflow-wrap: anywhere; word-break: break-word; }
.site-footer .nap, .site-footer .nap a { overflow-wrap: anywhere; word-break: break-word; }

/* Footer layout, 2026-07-23.
   The footer grid was 1.4fr 1fr 1fr at every width with no responsive rule, so on a phone
   all three columns were crushed side by side. The brand column carries the logo, the
   tagline and the bilingual badge, so it needs the full width. Give it its own row at the
   top by spanning every column, which leaves Services and Contact a clean half each. */
@media (max-width: 760px) {
  .site-footer .grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-6) var(--space-5);
    padding-top: var(--space-7);
  }
  .site-footer .grid > .footer-brand { grid-column: 1 / -1; }
}

/* Footer padding and trust centring, 2026-07-23.
   1. The footer rows are <div class="container grid"> and <div class="container legal">.
      .container gives them padding: 0 var(--container-pad), but .site-footer .grid and
      .site-footer .legal are more specific and use the padding SHORTHAND (padding: X 0),
      which resets the horizontal padding to zero. On desktop the max-width hides it; on a
      phone the footer content runs into the screen edge. Restore it with longhand so it
      cannot be clobbered by the vertical values again.
   2. Centre the stacked hero trust claims on mobile, matching the hero CTA buttons, which
      already go full width and centre at this breakpoint. */
.site-footer .grid,
.site-footer .legal { padding-left: var(--container-pad); padding-right: var(--container-pad); }

@media (max-width: 640px) {
  .hero .trust, .trust { align-items: center; text-align: center; }
}

/* Sub-footer bar, 2026-07-23.
   The Sozo attribution now sits on its own full-width bar below the legal row rather than
   crowding the copyright line. A translucent black wash is used instead of a fixed hex so
   the bar is guaranteed to read as a shade darker than whatever the footer background is,
   and it keeps working if the navy palette is ever retuned. */
.site-footer .sub-footer { background: rgba(0,0,0,0.18); border-top: 1px solid rgba(255,255,255,0.10); }
.site-footer .sub-footer .container { padding-top: var(--space-3); padding-bottom: var(--space-3); }
.site-footer .sub-footer p { margin: 0; text-align: center; font-size: var(--fs-small); color: var(--text-inverse-muted); }
.site-footer .sub-footer a { display: inline; margin: 0; color: #ffffff; text-decoration: none; }
.site-footer .sub-footer a:hover { text-decoration: underline; }

@media (max-width: 640px) {
  /* Centre the legal row on a phone so it reads as a deliberate block rather than a
     ragged left-aligned column. */
  .site-footer .legal { align-items: center; text-align: center; }
  .site-footer .legal .legal-copy,
  .site-footer .legal-links { justify-content: center; }
}

/* Footer centring and credit fit, 2026-07-23.
   1. Centre the legal row at every width, not just on mobile. The base rule sets
      align-items: flex-start, so both the flex alignment and the text alignment have to be
      overridden, and the two inner flex rows need their own justify-content.
   2. The credit reads "SEO, AEO, and GEO by Sozo Marketing.", 36 characters. At the footer's
      15px that is roughly 270px, while a 320px phone leaves only about 272px inside the
      24px container padding. It was breaking onto two lines because it sits right on that
      boundary. Drop it to 13px on mobile, which lands near 234px, and add nowrap so it can
      never split across lines. */
.site-footer .legal { align-items: center; text-align: center; }
.site-footer .legal .legal-copy,
.site-footer .legal-links { justify-content: center; }
.site-footer .sub-footer p { white-space: nowrap; }

@media (max-width: 640px) {
  .site-footer .sub-footer p { font-size: 13px; }
}

/* Header CTA label swap, 2026-07-23.
   "Schedule a 15-Minute Call" is too long for the header bar on a phone, where it competes
   with the logo and the menu toggle. Swap in a compact label at the same breakpoint the
   bilingual link already drops out. Both labels live in the markup and the hidden one uses
   display:none, so assistive tech reads only the visible label rather than both. */
.site-header .header-actions .cta-compact { display: none; }

@media (max-width: 640px) {
  .site-header .header-actions .cta-full { display: none; }
  .site-header .header-actions .cta-compact { display: inline; }
}

/* ---------------------------------------------------------------------------
   LinkedIn credibility links (added 2026-07-30)
   Labeled, followed links from the site to the founders' and firm's LinkedIn
   profiles. Entity/E-E-A-T signal for a new domain, plus a one-click vetting
   path for buyers who would otherwise leave the site to search.
   .li-link          light surfaces (About founder blocks)
   .li-link--inverse dark photo-caption overlays (hero .cap, .f-cap)
--------------------------------------------------------------------------- */
.li-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin-top: 8px; padding: 4px 0; font-family: var(--font-heading); font-size: var(--fs-small); font-weight: var(--fw-semibold); color: var(--navy-700); text-decoration: none; border: 0; transition: color .18s ease; }
.li-link:hover { color: #0A66C2; }
.li-link:focus-visible { color: #0A66C2; outline: 2px solid var(--blue-300); outline-offset: 3px; border-radius: var(--radius-sm, 4px); }
.li-link i, .li-link svg { width: 20px; height: 20px; flex: 0 0 auto; }
.li-link .li-label { line-height: 1.2; }

.li-link--inverse { color: #fff; margin-top: 10px; }
.li-link--inverse:hover { color: var(--blue-300); }
.li-link--inverse:focus-visible { color: var(--blue-300); outline-color: #fff; }

/* Hero caption: keep name on its own line, then push the LinkedIn link to the
   right edge of the caption so it stops sitting flush against the role text
   with a wide dead gap after it (Renan, 2026-07-30). */
.hero-visual .cap { display: flex; flex-wrap: wrap; align-items: center; column-gap: 10px; }
.hero-visual .cap b { flex: 0 0 100%; }
.hero-visual .cap .li-link { margin-left: auto; margin-top: 6px; }
@media (max-width: 640px) {
  .hero-visual .cap .li-link { margin-left: 0; flex: 0 0 100%; }
}
/* Footer company link sits on its own line under the bilingual badge. */
.site-footer .footer-brand .li-link { display: flex; width: fit-content; margin-top: 12px; }
/* Pin the footer link colour explicitly. It already matched its sibling footer
   links, but only because `.site-footer a` out-specified `.li-link--inverse`.
   Stated here so a future footer change cannot silently alter it. */
.site-footer .footer-brand .li-link { color: var(--text-inverse-muted); }
.site-footer .footer-brand .li-link:hover,
.site-footer .footer-brand .li-link:focus-visible { color: #fff; }