/*
Theme Name: Foothill Systems
Theme URI: https://foothill.systems
Author: Foothill Systems
Description: Custom WordPress theme for Foothill Systems — managed IT for LA businesses.
Version: 1.0.0
License: Proprietary
Text Domain: foothill-systems
*/

/* ============================================================
   RESET
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { background: #f7f5f0; font-family: 'DM Sans', sans-serif; color: #111110; overflow-x: hidden; }
input, textarea, select { font-family: var(--font-body); }
::selection { background: #c9a84c; color: #111110; }
img { max-width: 100%; display: block; }
a { color: inherit; }

/* ============================================================
   CSS CUSTOM PROPERTIES
   ============================================================ */
:root {
  --color-ink:          #111110;
  --color-ink-deep:     #0d0d0c;
  --color-charcoal:     #2e2e2b;
  --color-accent:       #c9a84c;
  --color-accent-hover: #b89240;
  --color-warm:         #f7f5f0;
  --color-white:        #ffffff;
  --color-border:       #ece9e2;
  --color-border-warm:  #ddd9d0;

  --text-primary:       #111110;
  --text-body:          rgba(17,17,16,0.78);
  --text-meta:          rgba(17,17,16,0.50);
  --text-muted:         rgba(17,17,16,0.35);
  --text-label:         #c9a84c;

  --text-dark-primary:  #f7f5f0;
  --text-dark-body:     rgba(247,245,240,0.72);
  --text-dark-meta:     rgba(247,245,240,0.45);
  --text-dark-muted:    rgba(247,245,240,0.25);
  --text-dark-label:    #c9a84c;

  --surface-dark-card:  rgba(247,245,240,0.04);
  --surface-dark-border:rgba(247,245,240,0.07);

  --font-display:  'Space Grotesk', sans-serif;
  --font-body:     'DM Sans', sans-serif;

  --text-2xs:   10px;
  --text-xs:    11px;
  --text-sm:    12px;
  --text-base:  13px;
  --text-md:    14px;
  --text-lg:    15px;
  --text-xl:    16px;
  --text-2xl:   18px;
  --text-3xl:   22px;
  --text-4xl:   clamp(28px, 3vw, 44px);
  --text-5xl:   clamp(32px, 4vw, 52px);
  --text-hero:  clamp(44px, 6vw, 82px);

  --weight-light:   300;
  --weight-regular: 400;
  --weight-medium:  500;
  --weight-semibold:600;
  --weight-bold:    700;

  --leading-tight:  1.05;
  --leading-snug:   1.1;
  --leading-normal: 1.3;
  --leading-relaxed:1.6;
  --leading-loose:  1.7;
  --leading-looser: 1.8;

  --tracking-tight:  -0.02em;
  --tracking-slight: -0.01em;
  --tracking-normal:  0;
  --tracking-wide:    0.05em;
  --tracking-wider:   0.1em;
  --tracking-widest:  0.2em;
  --tracking-label:   0.3em;

  --space-1:   2px;  --space-2:   4px;  --space-3:   8px;
  --space-4:  10px;  --space-5:  12px;  --space-6:  14px;
  --space-7:  16px;  --space-8:  20px;  --space-9:  24px;
  --space-10: 28px;  --space-11: 32px;  --space-12: 36px;
  --space-13: 40px;  --space-14: 48px;  --space-15: 56px;
  --space-16: 64px;  --space-17: 72px;  --space-18: 80px;
  --space-19: 88px;  --space-20: 100px;

  --section-padding-y:    100px;
  --section-padding-y-sm:  80px;
  --section-padding-x:     48px;
  --section-max-width:     1100px;

  --grid-gap:    16px;
  --grid-gap-lg: 80px;

  --radius-none: 0;
  --radius-sm:   2px;
  --radius-md:   4px;
  --radius-full: 9999px;

  --border-light:      1px solid #ece9e2;
  --border-warm:       1px solid #ddd9d0;
  --border-dark:       1px solid rgba(255,255,255,0.05);
  --border-accent:     1px solid #c9a84c;
  --border-ghost:      1px solid rgba(17,17,16,0.25);
  --border-ghost-dark: 1px solid rgba(247,245,240,0.4);

  --transition-fast: 0.15s ease;
  --transition-base: 0.2s ease;
  --transition-slow: 0.3s ease;

  --shadow-float: 0 8px 32px rgba(0,0,0,0.12);
  --shadow-card:  0 1px 3px rgba(0,0,0,0.06);

  --nav-height: 64px;
}

/* ============================================================
   COMPONENTS
   ============================================================ */

/* ── Section Label ── */
.fs-section-label { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.fs-section-label .fs-rule { width: 24px; height: 1px; background: var(--color-accent); flex-shrink: 0; }
.fs-section-label span { font-family: var(--font-body); font-size: var(--text-2xs); letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--color-accent); font-weight: var(--weight-regular); }

/* ── Buttons ── */
.fs-btn { display: inline-block; text-decoration: none; text-align: center; border-radius: var(--radius-sm); cursor: pointer; transition: opacity var(--transition-base); font-family: var(--font-display); font-weight: var(--weight-medium); letter-spacing: var(--tracking-wider); text-transform: uppercase; border: none; }
.fs-btn-primary { background: var(--color-accent); color: var(--color-ink); padding: 16px 48px; font-size: var(--text-base); }
.fs-btn-primary:hover { opacity: 0.88; }
.fs-btn-primary-sm { background: var(--color-accent); color: var(--color-ink); padding: 13px 32px; font-size: var(--text-sm); }
.fs-btn-ghost { background: transparent; color: var(--color-ink); padding: 8px 20px; font-size: var(--text-sm); border: var(--border-ghost); }
.fs-btn-ghost:hover { border-color: var(--color-ink); }
.fs-btn-ghost-dark { background: transparent; color: var(--color-warm); padding: 8px 20px; font-size: var(--text-sm); border: var(--border-ghost-dark); }
.fs-btn-ghost-dark:hover { border-color: var(--color-warm); }
.fs-btn-ghost-dark-lg { background: transparent; color: var(--color-warm); padding: 15px 36px; font-size: var(--text-base); border: var(--border-ghost-dark); }

/* Arrow link */
.fs-arrow-link { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-body); font-size: var(--text-md); font-weight: var(--weight-regular); color: var(--text-meta); text-decoration: none; transition: color var(--transition-base); }
.fs-arrow-link:hover { color: var(--color-ink); }
.fs-arrow-link-light { color: rgba(247,245,240,0.5); }
.fs-arrow-link-light:hover { color: var(--color-warm); }

/* Underline link */
.fs-underline-link { font-family: var(--font-display); font-size: var(--text-sm); font-weight: var(--weight-medium); letter-spacing: 0.12em; text-transform: uppercase; text-decoration: none; color: var(--color-ink); border-bottom: 1px solid var(--color-accent); padding-bottom: 3px; transition: opacity var(--transition-base); }
.fs-underline-link:hover { opacity: 0.7; }
.fs-underline-link-light { color: var(--color-warm); }

/* ── Cards ── */
.fs-card { background: var(--color-white); padding: 40px 32px; border-top: 2px solid transparent; transition: border-color var(--transition-base); }
.fs-card:hover { border-top-color: var(--color-accent); }
.fs-card-icon { margin-bottom: 24px; opacity: 0.5; transition: opacity var(--transition-base); }
.fs-card:hover .fs-card-icon { opacity: 0.85; }
.fs-card-title { font-family: var(--font-display); font-weight: var(--weight-semibold); font-size: 18px; color: var(--color-ink); margin-bottom: 12px; letter-spacing: var(--tracking-slight); line-height: var(--leading-normal); }
.fs-card-body { font-family: var(--font-body); font-weight: var(--weight-light); font-size: var(--text-md); color: var(--text-body); line-height: var(--leading-loose); text-wrap: pretty; }

/* Stat tile */
.fs-stat-tile { background: var(--surface-dark-card); border: 1px solid var(--surface-dark-border); padding: 36px 28px; }
.fs-stat-value { font-family: var(--font-display); font-weight: var(--weight-semibold); font-size: 32px; color: var(--color-accent); letter-spacing: var(--tracking-tight); margin-bottom: 8px; line-height: 1; }
.fs-stat-label { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 13px; color: rgba(247,245,240,0.45); line-height: 1.5; }

/* Checklist */
.fs-checklist-item { display: flex; gap: 20px; padding-bottom: 24px; margin-bottom: 24px; border-bottom: 1px solid var(--border-light); }
.fs-checklist-item:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.fs-checklist-dot { width: 20px; height: 20px; border-radius: 50%; background: var(--color-accent); flex-shrink: 0; margin-top: 2px; display: flex; align-items: center; justify-content: center; }
.fs-checklist-title { font-family: var(--font-display); font-weight: var(--weight-medium); font-size: 15px; color: var(--color-ink); margin-bottom: 4px; }
.fs-checklist-desc  { font-family: var(--font-body); font-size: 13px; color: var(--text-body); line-height: var(--leading-relaxed); }

/* Gold-rule item */
.fs-rule-item { display: flex; gap: 14px; margin-bottom: 12px; align-items: flex-start; }
.fs-rule-item .fs-rule-bar { width: 1px; background: var(--color-accent); flex-shrink: 0; margin-top: 4px; align-self: stretch; opacity: 0.5; }
.fs-rule-item p { font-family: var(--font-body); font-size: 15px; color: var(--text-body); line-height: var(--leading-relaxed); }

/* Circle-check item */
.fs-check-item { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 10px; }
.fs-check-item span { font-family: var(--font-body); font-size: 14px; color: var(--text-body); line-height: var(--leading-relaxed); }

/* Testimonial */
.fs-testimonial { max-width: 800px; margin: 0 auto; text-align: center; }
.fs-testimonial-rule { width: 40px; height: 1px; background: var(--color-accent); margin: 0 auto 48px; }
.fs-testimonial blockquote { font-family: var(--font-display); font-weight: var(--weight-regular); font-size: clamp(20px, 2.5vw, 28px); letter-spacing: var(--tracking-slight); line-height: 1.5; color: var(--color-ink); margin-bottom: 40px; font-style: normal; }
.fs-testimonial-name { font-family: var(--font-display); font-weight: var(--weight-medium); font-size: 14px; color: var(--color-ink); letter-spacing: 0.05em; }
.fs-testimonial-role { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 13px; color: var(--text-meta); letter-spacing: 0.05em; margin-top: 4px; }

/* ── Forms ── */
.fs-label { display: block; font-family: var(--font-body); font-size: var(--text-2xs); letter-spacing: 0.15em; text-transform: uppercase; color: var(--text-meta); margin-bottom: 8px; font-weight: var(--weight-regular); }
.fs-input { width: 100%; font-family: var(--font-body); font-size: 15px; padding: 13px 16px; border: var(--border-warm); border-radius: var(--radius-sm); background: var(--color-white); color: var(--color-ink); transition: border-color var(--transition-fast); outline: none; }
.fs-input:focus { border-color: var(--color-accent); }
.fs-input::placeholder { color: var(--text-muted); }
.fs-textarea { resize: vertical; min-height: 100px; }
.fs-select { appearance: none; cursor: pointer; }
.fs-input-group { margin-bottom: 16px; }
.fs-form-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }

/* Option tile */
.fs-option-tile { flex: 1; padding: 12px 14px; cursor: pointer; border: 1px solid var(--border-warm); background: var(--color-warm); border-radius: var(--radius-sm); transition: all var(--transition-fast); }
.fs-option-tile:hover, .fs-option-tile.selected { border-color: var(--color-accent); background: rgba(201,168,76,0.08); }
.fs-option-tile .tile-label { font-family: var(--font-display); font-size: 12px; font-weight: var(--weight-semibold); color: var(--text-meta); margin-bottom: 4px; text-transform: uppercase; letter-spacing: 0.08em; }
.fs-option-tile.selected .tile-label { color: var(--color-accent-hover); }
.fs-option-tile .tile-desc { font-family: var(--font-body); font-size: 12px; color: var(--text-body); line-height: 1.4; }

/* ── Navigation ── */
.fs-nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; height: var(--nav-height); padding: 0 var(--section-padding-x); display: flex; align-items: center; justify-content: space-between; transition: background var(--transition-slow), border-color var(--transition-slow); }
.fs-nav.scrolled { background: rgba(247,245,240,0.95); border-bottom: 1px solid rgba(0,0,0,0.07); backdrop-filter: blur(12px); }
.fs-nav.nav-dark { background: transparent; border-bottom: 1px solid transparent; }
.fs-nav.nav-dark.scrolled { background: rgba(247,245,240,0.95); border-bottom-color: rgba(0,0,0,0.07); }
.fs-nav-link { font-family: var(--font-body); font-size: var(--text-base); letter-spacing: var(--tracking-wide); color: var(--text-body); text-decoration: none; font-weight: var(--weight-regular); transition: color var(--transition-base); }
.fs-nav-link:hover { color: var(--color-ink); }
.fs-nav-link.active { color: var(--color-ink); font-weight: var(--weight-medium); border-bottom: 1px solid var(--color-accent); padding-bottom: 2px; }
.fs-nav.nav-dark .fs-nav-link { color: rgba(247,245,240,0.65); }
.fs-nav.nav-dark .fs-btn-ghost-dark { color: #f7f5f0; border-color: rgba(247,245,240,0.4); }

/* Nav links wrapper */
.fs-nav-links { display: flex; align-items: center; gap: 32px; }

/* Hamburger */
.fs-hamburger { display: none; flex-direction: column; gap: 5px; cursor: pointer; padding: 4px; background: none; border: none; }
.fs-hamburger span { display: block; width: 22px; height: 1.5px; background: currentColor; transition: all var(--transition-base); }

/* Mobile nav overlay */
.fs-nav-mobile { display: none; position: fixed; top: var(--nav-height); left: 0; right: 0; bottom: 0; z-index: 99; background: rgba(247,245,240,0.98); backdrop-filter: blur(12px); flex-direction: column; align-items: center; justify-content: center; gap: 32px; }
.fs-nav-mobile.open { display: flex; }
.fs-nav-mobile .fs-nav-link { font-size: 20px; color: var(--color-ink); }
.fs-nav-mobile .fs-btn { font-size: var(--text-base); }

/* ── Logo ── */
.fs-logo { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.fs-logo-divider { width: 1px; background: currentColor; opacity: 0.25; flex-shrink: 0; }
.fs-logo-wordmark { font-family: var(--font-display); font-weight: var(--weight-medium); letter-spacing: var(--tracking-widest); text-transform: uppercase; line-height: 1; font-size: 13px; }

/* ── Section layouts ── */
.fs-section { padding: var(--section-padding-y) var(--section-padding-x); }
.fs-section-sm { padding: var(--section-padding-y-sm) var(--section-padding-x); }
.fs-section-wrap { max-width: var(--section-max-width); margin: 0 auto; }

.fs-section-head { margin-bottom: 56px; }
.fs-section-head h2 { font-family: var(--font-display); font-weight: var(--weight-semibold); font-size: var(--text-5xl); letter-spacing: var(--tracking-tight); line-height: var(--leading-snug); color: var(--color-ink); }
.fs-section-head-dark h2 { color: var(--color-warm); }

/* Grid utilities */
.fs-grid-4    { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--grid-gap); }
.fs-grid-3    { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--grid-gap); }
.fs-grid-2    { display: grid; grid-template-columns: 1fr 1fr; gap: var(--grid-gap); }
.fs-grid-2-lg { display: grid; grid-template-columns: 1fr 1fr; gap: var(--grid-gap-lg); }
.fs-editorial { display: grid; grid-template-columns: 1fr 1.2fr; gap: 80px; align-items: start; }
.fs-editorial-centered { align-items: center; }

/* Backgrounds */
.fs-bg-warm    { background: var(--color-warm); }
.fs-bg-white   { background: var(--color-white); }
.fs-bg-dark    { background: var(--color-ink); }
.fs-bg-darkest { background: var(--color-ink-deep); }

/* Hero watermark */
.fs-hero-watermark { position: absolute; right: -40px; top: 50%; transform: translateY(-50%); opacity: 0.04; pointer-events: none; }

/* ── Footer ── */
.fs-footer { background: var(--color-ink-deep); padding: 56px var(--section-padding-x) 40px; border-top: var(--border-dark); }
.fs-footer-inner { max-width: var(--section-max-width); margin: 0 auto; }
.fs-footer-top { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 48px; }
.fs-footer-tagline { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 13px; color: rgba(247,245,240,0.3); margin-top: 16px; max-width: 260px; line-height: var(--leading-loose); }
.fs-footer-cols { display: flex; gap: 64px; }
.fs-footer-col-head { font-family: var(--font-display); font-size: 11px; font-weight: var(--weight-medium); letter-spacing: 0.15em; text-transform: uppercase; color: rgba(247,245,240,0.3); margin-bottom: 16px; }
.fs-footer-link { display: block; font-family: var(--font-body); font-size: 13px; font-weight: var(--weight-light); line-height: 2.2; color: var(--text-dark-body); text-decoration: none; transition: color var(--transition-fast); }
.fs-footer-link:hover { color: var(--color-warm); }
.fs-footer-bottom { border-top: var(--border-dark); padding-top: 24px; display: flex; justify-content: space-between; align-items: center; }
.fs-footer-legal { font-family: var(--font-body); font-size: 12px; color: var(--text-dark-muted); }
.fs-footer-legal a { text-decoration: none; transition: color var(--transition-fast); }
.fs-footer-legal a:hover { color: var(--color-warm); }

/* Minimal footer */
.fs-footer-minimal { background: var(--color-ink-deep); padding: 32px var(--section-padding-x); border-top: var(--border-dark); display: flex; justify-content: space-between; align-items: center; }
.fs-footer-minimal-legal { font-family: var(--font-body); font-size: 12px; color: rgba(247,245,240,0.2); }

/* ============================================================
   HOMEPAGE
   ============================================================ */
.hero { min-height: 100vh; background: var(--color-ink); display: flex; flex-direction: column; justify-content: center; padding: 120px 48px 80px; position: relative; overflow: hidden; }
.hero-label { display: flex; align-items: center; gap: 12px; margin-bottom: 40px; }
.hero-label .rule { width: 32px; height: 1px; background: var(--color-accent); flex-shrink: 0; }
.hero-label span { font-family: var(--font-body); font-size: 11px; letter-spacing: 0.3em; color: var(--color-accent); text-transform: uppercase; }
.hero h1 { font-family: var(--font-display); font-weight: 700; font-size: var(--text-hero); line-height: var(--leading-tight); letter-spacing: var(--tracking-tight); color: var(--color-warm); margin-bottom: 32px; text-wrap: pretty; }
.hero h1 .accent { color: var(--color-accent); }
.hero-sub { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 18px; color: rgba(247,245,240,0.45); max-width: 480px; line-height: 1.7; margin-bottom: 48px; text-wrap: pretty; }
.hero-ctas { display: flex; gap: 16px; align-items: center; }
.hero-location { position: absolute; bottom: 36px; left: 48px; display: flex; align-items: center; gap: 10px; }
.hero-location .vline { width: 1px; height: 40px; background: rgba(247,245,240,0.2); }
.hero-location span { font-family: var(--font-body); font-size: 10px; color: rgba(247,245,240,0.3); letter-spacing: 0.25em; text-transform: uppercase; }

.section-services { background: var(--color-warm); padding: 100px 48px; }
.section-header { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 64px; }
.section-header h2 { font-family: var(--font-display); font-weight: 600; font-size: var(--text-5xl); letter-spacing: var(--tracking-tight); line-height: var(--leading-snug); color: var(--color-ink); }
.services-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--grid-gap); list-style: none; padding: 0; margin: 0; }
.services-grid--3 { grid-template-columns: repeat(3, 1fr); }

.section-why { background: var(--color-ink); padding: 100px 48px; }
.why-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; max-width: var(--section-max-width); margin: 0 auto; }
.why-h2 { font-family: var(--font-display); font-weight: 600; font-size: var(--text-4xl); letter-spacing: var(--tracking-tight); line-height: 1.15; color: var(--color-warm); margin-bottom: 24px; }
.why-p { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 16px; line-height: 1.8; color: rgba(247,245,240,0.72); max-width: 420px; text-wrap: pretty; }
.stats-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--grid-gap); }
.stat-tile { background: rgba(247,245,240,0.04); border: 1px solid rgba(247,245,240,0.07); padding: 36px 28px; }
.stat-value { font-family: var(--font-display); font-weight: 600; font-size: 32px; color: var(--color-accent); letter-spacing: var(--tracking-tight); margin-bottom: 8px; }
.stat-label { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 13px; color: rgba(247,245,240,0.4); line-height: 1.5; }

.section-testimonial { background: var(--color-warm); padding: 100px 48px; }

.section-cta { background: var(--color-ink); padding: 100px 48px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.cta-eyebrow { display: flex; align-items: center; gap: 10px; margin-bottom: 24px; }
.cta-eyebrow .rule { width: 24px; height: 1px; background: var(--color-accent); }
.cta-eyebrow span { font-family: var(--font-body); font-size: 10px; letter-spacing: 0.3em; color: var(--color-accent); text-transform: uppercase; }
.cta-h2 { font-family: var(--font-display); font-weight: 600; font-size: clamp(32px, 4vw, 56px); letter-spacing: var(--tracking-tight); line-height: var(--leading-snug); color: var(--color-warm); margin-bottom: 16px; max-width: 640px; }
.cta-sub { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 16px; color: rgba(247,245,240,0.4); margin-bottom: 48px; max-width: 400px; line-height: 1.7; }
.cta-email { margin-top: 24px; font-family: var(--font-body); font-size: 12px; color: rgba(247,245,240,0.25); }

/* ============================================================
   SERVICES PAGE
   ============================================================ */
.dark-hero { background: var(--color-ink); min-height: 55vh; display: flex; flex-direction: column; justify-content: flex-end; padding: 120px 48px 80px; position: relative; overflow: hidden; }
.dark-hero h1 { font-family: var(--font-display); font-weight: 700; font-size: clamp(40px, 5.5vw, 72px); line-height: var(--leading-tight); letter-spacing: var(--tracking-tight); color: var(--color-warm); margin-bottom: 28px; text-wrap: pretty; }
.dark-hero h1 .accent { color: var(--color-accent); }
.dark-hero .hero-sub { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 18px; color: rgba(247,245,240,0.72); max-width: 520px; line-height: 1.7; margin-bottom: 44px; text-wrap: pretty; }
.hero-loc { position: absolute; bottom: 36px; left: 48px; display: flex; align-items: center; gap: 10px; }
.hero-loc .vl { width: 1px; height: 40px; background: rgba(247,245,240,0.2); }
.hero-loc span { font-family: var(--font-body); font-size: 10px; color: rgba(247,245,240,0.3); letter-spacing: 0.25em; text-transform: uppercase; }

.approach { background: var(--color-white); padding: 88px 48px; border-bottom: 1px solid var(--color-border); }
.approach-grid { max-width: var(--section-max-width); margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.approach h2 { font-family: var(--font-display); font-weight: 600; font-size: clamp(28px, 3.5vw, 44px); letter-spacing: var(--tracking-tight); line-height: var(--leading-snug); color: var(--color-ink); margin-bottom: 20px; }
.approach p { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 15px; line-height: 1.75; color: var(--text-body); }
.approach p + p { margin-top: 12px; }
.check-dot { width: 20px; height: 20px; border-radius: 50%; background: var(--color-accent); flex-shrink: 0; margin-top: 2px; display: flex; align-items: center; justify-content: center; }
.check-item { display: flex; gap: 20px; padding-bottom: 24px; margin-bottom: 24px; border-bottom: 1px solid var(--color-border); }
.check-item:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.check-item-title { font-family: var(--font-display); font-weight: var(--weight-medium); font-size: 15px; color: var(--color-ink); margin-bottom: 4px; }
.check-item-desc { font-family: var(--font-body); font-size: 13px; color: var(--text-body); line-height: var(--leading-relaxed); }

.overview { background: var(--color-warm); padding: 88px 48px; }
.overview-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--grid-gap); }
.overview-card { background: var(--color-white); padding: 32px 24px; border-top: 2px solid transparent; transition: border-color var(--transition-base); text-decoration: none; display: block; }
.overview-card:hover { border-top-color: var(--color-accent); }
.overview-card-icon { margin-bottom: 20px; opacity: 0.45; transition: opacity var(--transition-base); }
.overview-card:hover .overview-card-icon { opacity: 0.9; }
.overview-card-title { font-family: var(--font-display); font-weight: 600; font-size: 15px; color: var(--color-ink); margin-bottom: 10px; letter-spacing: var(--tracking-slight); line-height: var(--leading-normal); }
.overview-card-body { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 13px; color: var(--text-body); line-height: var(--leading-relaxed); text-wrap: pretty; }

.svc-section { padding: 100px 48px; border-bottom: 1px solid; }
.svc-section.light { background: var(--color-white); border-color: var(--color-border); }
.svc-section.dark  { background: var(--color-ink); border-color: rgba(247,245,240,0.08); }
.svc-inner { max-width: var(--section-max-width); margin: 0 auto; display: grid; grid-template-columns: 1fr 1.2fr; gap: 80px; align-items: start; }
.svc-h2 { font-family: var(--font-display); font-weight: 600; font-size: clamp(26px, 3vw, 40px); letter-spacing: var(--tracking-tight); line-height: var(--leading-snug); margin-bottom: 20px; }
.svc-section.light .svc-h2 { color: var(--color-ink); }
.svc-section.dark  .svc-h2 { color: var(--color-warm); }
.svc-p { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 16px; line-height: 1.75; margin-bottom: 28px; text-wrap: pretty; }
.svc-section.light .svc-p { color: var(--text-body); }
.svc-section.dark  .svc-p { color: rgba(247,245,240,0.72); }
.svc-mini-label { font-family: var(--font-body); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(201,168,76,0.7); margin-bottom: 16px; }
.svc-rule-item { display: flex; gap: 14px; margin-bottom: 12px; align-items: flex-start; }
.svc-rule-bar { width: 1px; background: var(--color-accent); flex-shrink: 0; margin-top: 4px; align-self: stretch; opacity: 0.4; }
.svc-rule-item p { font-family: var(--font-body); font-size: 14px; line-height: var(--leading-relaxed); text-wrap: pretty; }
.svc-section.light .svc-rule-item p { color: var(--text-body); }
.svc-section.dark  .svc-rule-item p { color: rgba(247,245,240,0.72); }
.svc-expect-divider { margin-top: 24px; padding-top: 28px; }
.svc-section.light .svc-expect-divider { border-top: 1px solid var(--color-border); }
.svc-section.dark  .svc-expect-divider { border-top: 1px solid rgba(247,245,240,0.08); }
.svc-check-item { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 10px; }
.svc-check-item span { font-family: var(--font-body); font-size: 14px; line-height: var(--leading-relaxed); }
.svc-section.light .svc-check-item span { color: var(--text-body); }
.svc-section.dark  .svc-check-item span { color: rgba(247,245,240,0.72); }

.engagement { background: var(--color-warm); padding: 100px 48px; }
.engagement-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--grid-gap); }
.engagement-card { background: var(--color-white); padding: 48px 40px; }
.engagement-card h3 { font-family: var(--font-display); font-weight: 600; font-size: 20px; color: var(--color-ink); margin-bottom: 16px; letter-spacing: var(--tracking-slight); }
.engagement-card-body { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 15px; color: var(--text-body); line-height: 1.75; margin-bottom: 28px; text-wrap: pretty; }
.engagement-card-list { border-top: 1px solid var(--color-border); padding-top: 24px; }

.cta-band { background: var(--color-ink); padding: 100px 48px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.cta-band-eyebrow { display: flex; align-items: center; gap: 10px; margin-bottom: 24px; }
.cta-band-eyebrow .rule { width: 24px; height: 1px; background: var(--color-accent); }
.cta-band-eyebrow span { font-family: var(--font-body); font-size: 10px; letter-spacing: 0.3em; color: var(--color-accent); text-transform: uppercase; }
.cta-band h2 { font-family: var(--font-display); font-weight: 600; font-size: var(--text-5xl); letter-spacing: var(--tracking-tight); line-height: var(--leading-snug); color: var(--color-warm); margin-bottom: 16px; max-width: 600px; }
.cta-band-sub { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 16px; color: rgba(247,245,240,0.4); margin-bottom: 48px; max-width: 420px; line-height: 1.7; }
.cta-band-note { margin-top: 24px; font-family: var(--font-body); font-size: 12px; color: rgba(247,245,240,0.25); }

/* ============================================================
   WHO WE HELP
   ============================================================ */
.industry-section { background: var(--color-white); padding: 100px 48px; border-bottom: 1px solid var(--color-border); }
.industry-layout { display: grid; grid-template-columns: 280px 1fr; gap: var(--grid-gap); align-items: start; }
.ind-tab { padding: 18px 24px; cursor: pointer; border-left: 2px solid var(--color-border); margin-bottom: var(--grid-gap); transition: all var(--transition-fast); }
.ind-tab.active, .ind-tab:hover { background: var(--color-accent); border-left-color: var(--color-accent); }
.ind-tab-title { font-family: var(--font-display); font-weight: 600; font-size: 14px; color: var(--color-ink); margin-bottom: 3px; }
.ind-tab-sub { font-family: var(--font-body); font-size: 12px; color: var(--text-meta); line-height: 1.4; }
.ind-panel { background: var(--color-warm); padding: 48px; }
.ind-panel[hidden] { display: none; }
.ind-panel h3 { font-family: var(--font-display); font-weight: 600; font-size: 22px; color: var(--color-ink); margin-bottom: 8px; }
.ind-panel-sub { font-family: var(--font-body); font-size: 13px; color: var(--text-meta); letter-spacing: 0.05em; margin-bottom: 32px; }
.ind-panel-label { font-family: var(--font-body); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(201,168,76,0.8); margin-bottom: 16px; }
.ind-panel-rule-item { display: flex; gap: 14px; margin-bottom: 12px; align-items: flex-start; }
.ind-panel-rule-bar { width: 1px; background: var(--color-accent); flex-shrink: 0; margin-top: 4px; align-self: stretch; opacity: 0.5; }
.ind-panel-rule-item p { font-family: var(--font-body); font-weight: var(--weight-regular); font-size: 15px; color: var(--text-body); line-height: var(--leading-relaxed); }
.ind-feel-divider { border-top: 1px solid var(--color-border-warm); margin-top: 28px; padding-top: 24px; }
.ind-feel-label { font-family: var(--font-body); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(201,168,76,0.8); margin-bottom: 12px; }
.ind-feel-text { font-family: var(--font-body); font-weight: var(--weight-regular); font-size: 15px; color: var(--text-body); line-height: 1.7; font-style: italic; }

.situations-section { background: var(--color-warm); padding: 100px 48px; }
.situations-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--grid-gap); list-style: none; padding: 0; margin: 0; }
.situation-card { background: var(--color-white); padding: 36px 32px; }
.situation-card .rule { width: 32px; height: 1px; background: var(--color-accent); margin-bottom: 20px; }
.situation-card h3 { font-family: var(--font-display); font-weight: 600; font-size: 16px; color: var(--color-ink); margin-bottom: 12px; letter-spacing: var(--tracking-slight); }
.situation-card p { font-family: var(--font-body); font-weight: var(--weight-regular); font-size: 14px; color: var(--text-body); line-height: 1.65; }

.size-band { background: var(--color-ink); padding: 80px 48px; }
.size-grid { max-width: var(--section-max-width); margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: var(--grid-gap); }
.size-tile { padding: 48px 40px; background: rgba(247,245,240,0.04); border: 1px solid rgba(247,245,240,0.07); }
.size-tile-label { font-family: var(--font-body); font-size: 11px; letter-spacing: 0.25em; text-transform: uppercase; color: var(--color-accent); margin-bottom: 12px; opacity: 0.8; }
.size-tile h3 { font-family: var(--font-display); font-weight: 600; font-size: 22px; color: var(--color-warm); margin-bottom: 16px; letter-spacing: var(--tracking-slight); }
.size-tile p { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 15px; color: rgba(247,245,240,0.78); line-height: 1.7; }

.cta-light { background: var(--color-warm); padding: 100px 48px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.cta-light-eyebrow { display: flex; align-items: center; gap: 10px; margin-bottom: 24px; }
.cta-light-eyebrow .rule { width: 24px; height: 1px; background: var(--color-accent); }
.cta-light-eyebrow span { font-family: var(--font-body); font-size: 10px; letter-spacing: 0.3em; color: var(--color-accent); text-transform: uppercase; }
.cta-light h2 { font-family: var(--font-display); font-weight: 600; font-size: clamp(28px, 4vw, 48px); letter-spacing: var(--tracking-tight); line-height: var(--leading-snug); color: var(--color-ink); margin-bottom: 16px; max-width: 560px; }
.cta-light-sub { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 16px; color: var(--text-body); margin-bottom: 48px; max-width: 420px; line-height: 1.7; }
.cta-light-note { margin-top: 20px; font-family: var(--font-body); font-size: 12px; color: var(--text-muted); }
.cta-light .fs-btn-primary-dark { background: var(--color-ink); color: var(--color-warm); }
.cta-light .fs-btn-primary-dark:hover { opacity: 0.88; }

/* ============================================================
   SUPPORT PAGE
   ============================================================ */
.support-hero { background: var(--color-ink); padding-top: 112px; padding-bottom: 72px; padding-left: 48px; padding-right: 48px; position: relative; overflow: hidden; }
.contact-tiles { display: flex; gap: var(--grid-gap); margin-top: 40px; }
.contact-tile { background: rgba(247,245,240,0.06); border: 1px solid rgba(247,245,240,0.1); padding: 24px 32px; flex: 1; }
.contact-tile-label { font-family: var(--font-body); font-size: 10px; letter-spacing: 0.25em; text-transform: uppercase; color: rgba(201,168,76,0.7); margin-bottom: 8px; }
.contact-tile-value { font-family: var(--font-display); font-weight: 600; font-size: 18px; color: var(--color-warm); margin-bottom: 4px; }
.contact-tile-sub { font-family: var(--font-body); font-size: 13px; color: rgba(247,245,240,0.45); }

.support-body { background: var(--color-warm); padding: 80px 48px; }
.support-grid { max-width: var(--section-max-width); margin: 0 auto; display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--grid-gap); align-items: start; }
.support-form-label { font-family: var(--font-body); font-size: 11px; letter-spacing: 0.25em; text-transform: uppercase; color: var(--color-accent); margin-bottom: 16px; }
.support-form-h2 { font-family: var(--font-display); font-weight: 600; font-size: 26px; letter-spacing: var(--tracking-tight); color: var(--color-ink); margin-bottom: 8px; }
.support-form-intro { font-family: var(--font-body); font-size: 15px; color: var(--text-body); margin-bottom: 24px; line-height: var(--leading-relaxed); }
.ticket-form { background: var(--color-white); padding: 40px; }
.severity-row { display: flex; gap: 8px; margin-bottom: 24px; }
.sev-tile { flex: 1; padding: 12px 14px; cursor: pointer; border: 1px solid var(--color-border-warm); background: var(--color-warm); border-radius: var(--radius-sm); transition: all var(--transition-fast); }
.sev-tile:hover, .sev-tile.selected { border-color: var(--color-accent); background: rgba(201,168,76,0.08); }
.sev-label { font-family: var(--font-display); font-size: 12px; font-weight: 600; color: var(--text-meta); margin-bottom: 4px; text-transform: uppercase; letter-spacing: 0.08em; }
.sev-tile.selected .sev-label { color: var(--color-accent-hover); }
.sev-desc { font-family: var(--font-body); font-size: 12px; color: var(--text-body); line-height: 1.4; }
.ticket-submit { background: var(--color-ink); color: var(--color-warm); width: 100%; padding: 14px 36px; font-size: 13px; }
.success-state { background: var(--color-white); padding: 48px 40px; text-align: center; display: none; }
.success-icon { width: 40px; height: 40px; border-radius: 50%; background: var(--color-accent); margin: 0 auto 20px; display: flex; align-items: center; justify-content: center; }
.success-title { font-family: var(--font-display); font-weight: 600; font-size: 20px; color: var(--color-ink); margin-bottom: 10px; }
.success-body { font-family: var(--font-body); font-size: 14px; color: var(--text-body); line-height: var(--leading-relaxed); }

.support-right { padding-left: 16px; }
.remote-label { font-family: var(--font-body); font-size: 11px; letter-spacing: 0.25em; text-transform: uppercase; color: var(--color-accent); margin-bottom: 16px; }
.remote-h3 { font-family: var(--font-display); font-weight: 600; font-size: 20px; color: var(--color-ink); margin-bottom: 10px; }
.remote-intro { font-family: var(--font-body); font-size: 14px; color: var(--text-body); line-height: 1.65; margin-bottom: 24px; }
.download-row { display: flex; align-items: center; gap: 14px; background: var(--color-white); padding: 14px 20px; border: 1px solid #e5e2db; border-radius: var(--radius-sm); text-decoration: none; color: var(--color-ink); transition: border-color var(--transition-fast); margin-bottom: 8px; }
.download-row:hover { border-color: var(--color-accent); }
.download-name { font-family: var(--font-display); font-weight: 500; font-size: 14px; flex: 1; }
.download-ext { font-family: var(--font-body); font-size: 12px; color: rgba(17,17,16,0.4); }
.response-panel { background: var(--color-ink); padding: 28px; margin-top: 32px; }
.response-panel-label { font-family: var(--font-body); font-size: 10px; letter-spacing: 0.25em; text-transform: uppercase; color: var(--color-accent); margin-bottom: 14px; opacity: 0.8; }
.resp-row { display: flex; justify-content: space-between; align-items: flex-start; padding: 10px 0; border-bottom: 1px solid rgba(247,245,240,0.07); }
.resp-row:last-child { border-bottom: none; }
.resp-type { font-family: var(--font-display); font-size: 13px; font-weight: 500; color: var(--color-warm); margin-bottom: 2px; }
.resp-desc { font-family: var(--font-body); font-size: 12px; color: rgba(247,245,240,0.45); }
.resp-time { font-family: var(--font-body); font-size: 12px; color: var(--color-accent); text-align: right; flex-shrink: 0; margin-left: 16px; }

/* ============================================================
   CONTACT PAGE
   ============================================================ */
.contact-layout { display: grid; grid-template-columns: 1fr 1.4fr; min-height: 100vh; }
.contact-left { background: var(--color-ink); padding: 112px 56px 64px; display: flex; flex-direction: column; justify-content: space-between; position: sticky; top: 0; height: 100vh; overflow: auto; }
.contact-right { background: var(--color-warm); padding-top: 64px; }
.contact-form-wrap { background: var(--color-white); min-height: calc(100vh - 64px); }
.contact-left .fs-section-label { margin-bottom: 24px; }
.contact-left h1 { font-family: var(--font-display); font-weight: 700; font-size: clamp(32px, 4vw, 52px); line-height: var(--leading-tight); letter-spacing: var(--tracking-tight); color: var(--color-warm); margin-bottom: 24px; }
.contact-left-intro { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 16px; color: rgba(247,245,240,0.65); line-height: 1.75; margin-bottom: 48px; max-width: 380px; }
.meta-rows { display: flex; flex-direction: column; gap: 20px; margin-bottom: 56px; }
.meta-row { display: flex; align-items: flex-start; gap: 16px; }
.meta-bar { width: 1px; height: auto; align-self: stretch; background: var(--color-accent); opacity: 0.4; flex-shrink: 0; }
.meta-label { font-family: var(--font-body); font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(201,168,76,0.65); margin-bottom: 3px; }
.meta-value { font-family: var(--font-display); font-size: 15px; font-weight: 400; color: var(--color-warm); }
.contact-form-inner { padding: 48px; }
.svc-checkboxes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.svc-checkbox { padding: 11px 14px; cursor: pointer; border: 1px solid var(--color-border-warm); background: var(--color-white); border-radius: var(--radius-sm); transition: all var(--transition-fast); display: flex; align-items: center; gap: 10px; }
.svc-checkbox:hover, .svc-checkbox.checked { border-color: var(--color-accent); background: rgba(201,168,76,0.07); }
.checkbox-box { width: 14px; height: 14px; border: 1px solid #ccc; border-radius: 2px; background: transparent; flex-shrink: 0; display: flex; align-items: center; justify-content: center; transition: all var(--transition-fast); }
.svc-checkbox.checked .checkbox-box { background: var(--color-accent); border-color: var(--color-accent); }
.svc-checkbox span { font-family: var(--font-body); font-size: 13px; color: var(--text-body); }
.contact-submit { background: var(--color-ink); color: var(--color-warm); width: 100%; padding: 16px; font-size: 13px; }
.contact-submit-note { font-family: var(--font-body); font-size: 12px; color: var(--text-muted); margin-top: 12px; text-align: center; }
.success-pane { padding: 80px 48px; text-align: center; display: none; }
.success-pane-icon { width: 56px; height: 56px; border-radius: 50%; background: var(--color-accent); margin: 0 auto 24px; display: flex; align-items: center; justify-content: center; }
.success-pane h2 { font-family: var(--font-display); font-weight: 600; font-size: 28px; color: var(--color-ink); margin-bottom: 12px; }
.success-pane p { font-family: var(--font-body); font-size: 16px; color: var(--text-body); max-width: 380px; margin: 0 auto; line-height: 1.7; }

/* ============================================================
   BLOG / ARCHIVE
   ============================================================ */
.blog-header { background: var(--color-warm); padding-top: 112px; padding-bottom: 56px; padding-left: 48px; padding-right: 48px; border-bottom: 1px solid var(--color-border); }
.blog-header-inner { max-width: var(--section-max-width); margin: 0 auto; }
.blog-h1 { font-family: var(--font-display); font-weight: 700; font-size: clamp(32px, 4.5vw, 56px); letter-spacing: var(--tracking-tight); line-height: var(--leading-tight); color: var(--color-ink); margin-bottom: 16px; }
.blog-intro { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 17px; color: var(--text-body); max-width: 480px; line-height: 1.7; }
.filter-bar { background: var(--color-white); border-bottom: 1px solid var(--color-border); padding: 0 48px; position: sticky; top: var(--nav-height); z-index: 10; }
.filter-bar-inner { max-width: var(--section-max-width); margin: 0 auto; display: flex; gap: 0; overflow-x: auto; }
.filter-btn { font-family: var(--font-body); font-size: 13px; background: none; border: none; cursor: pointer; padding: 18px 20px; border-bottom: 2px solid transparent; white-space: nowrap; transition: all var(--transition-fast); color: rgba(17,17,16,0.45); }
.filter-btn.active, .filter-btn:hover { color: var(--color-ink); }
.filter-btn.active { border-bottom-color: var(--color-accent); font-weight: 500; }
.posts-grid { background: var(--color-warm); padding: 64px 48px 100px; }
.posts-inner { max-width: var(--section-max-width); margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--grid-gap); }
.post-card { background: var(--color-white); padding: 36px 32px; border-top: 2px solid transparent; transition: border-color var(--transition-base); display: block; text-decoration: none; }
.post-card:hover { border-top-color: var(--color-accent); }
.post-cat-badge { display: inline-block; font-family: var(--font-body); font-size: 11px; font-weight: 500; padding: 3px 10px; border-radius: var(--radius-sm); margin-bottom: 20px; }
.post-title { font-family: var(--font-display); font-weight: 600; font-size: 17px; color: var(--color-ink); margin-bottom: 12px; letter-spacing: var(--tracking-slight); line-height: var(--leading-normal); }
.post-excerpt { font-family: var(--font-body); font-weight: var(--weight-regular); font-size: 14px; color: var(--text-body); line-height: 1.65; margin-bottom: 24px; flex: 1; }
.post-footer { display: flex; align-items: center; justify-content: space-between; margin-top: auto; }
.post-meta { display: flex; align-items: center; gap: 12px; font-family: var(--font-body); font-size: 12px; color: rgba(17,17,16,0.4); }
.post-dot { width: 3px; height: 3px; border-radius: 50%; background: rgba(17,17,16,0.2); flex-shrink: 0; }
.post-read-more { display: flex; align-items: center; gap: 6px; font-family: var(--font-body); font-size: 12px; color: rgba(17,17,16,0.3); transition: color var(--transition-base); }
.post-card:hover .post-read-more { color: var(--color-accent-hover); }
.post-card { background: var(--color-white); padding: 36px 32px; border-top: 2px solid transparent; transition: border-color var(--transition-base); display: flex; flex-direction: column; text-decoration: none; }
.blog-cta { background: var(--color-ink); padding: 80px 48px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.blog-cta h2 { font-family: var(--font-display); font-weight: 600; font-size: clamp(24px, 3vw, 40px); letter-spacing: var(--tracking-tight); color: var(--color-warm); margin-bottom: 14px; }
.blog-cta-sub { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 16px; color: rgba(247,245,240,0.65); margin-bottom: 36px; max-width: 400px; line-height: 1.7; }

/* ============================================================
   SINGLE POST
   ============================================================ */
.single-hero { background: var(--color-ink); padding: 120px 48px 72px; position: relative; overflow: hidden; }
.single-hero-inner { max-width: 740px; margin: 0 auto; position: relative; z-index: 1; }
.single-cat-badge { display: inline-block; font-family: var(--font-body); font-size: 11px; font-weight: 500; padding: 3px 10px; border-radius: var(--radius-sm); margin-bottom: 24px; }
.single-h1 { font-family: var(--font-display); font-weight: 700; font-size: clamp(28px, 4vw, 48px); letter-spacing: var(--tracking-tight); line-height: var(--leading-snug); color: var(--color-warm); margin-bottom: 24px; }
.single-meta { display: flex; align-items: center; gap: 12px; font-family: var(--font-body); font-size: 13px; color: rgba(247,245,240,0.4); }
.single-meta-dot { width: 3px; height: 3px; border-radius: 50%; background: rgba(247,245,240,0.2); }
.single-body { background: var(--color-warm); padding: 80px 48px 100px; }
.single-body-inner { max-width: 740px; margin: 0 auto; }
.single-content { font-family: var(--font-body); font-size: 17px; color: var(--text-body); line-height: 1.8; }
.single-content h2 { font-family: var(--font-display); font-weight: 600; font-size: 24px; color: var(--color-ink); margin: 48px 0 16px; letter-spacing: var(--tracking-slight); }
.single-content h3 { font-family: var(--font-display); font-weight: 600; font-size: 19px; color: var(--color-ink); margin: 36px 0 12px; }
.single-content p { margin-bottom: 20px; }
.single-content ul, .single-content ol { padding-left: 24px; margin-bottom: 20px; }
.single-content li { margin-bottom: 8px; line-height: 1.7; }
.single-content a { color: var(--color-accent-hover); text-decoration: underline; text-underline-offset: 3px; }
.single-content blockquote { border-left: 2px solid var(--color-accent); padding-left: 24px; margin: 32px 0; font-style: italic; color: var(--text-meta); }
.single-back { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-body); font-size: 13px; color: var(--text-meta); text-decoration: none; margin-bottom: 48px; transition: color var(--transition-base); }
.single-back:hover { color: var(--color-ink); }
.single-cta { background: var(--color-warm); border-top: 1px solid var(--color-border); padding: 72px 48px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.single-cta h3 { font-family: var(--font-display); font-weight: 600; font-size: clamp(22px, 3vw, 32px); color: var(--color-ink); margin-bottom: 12px; letter-spacing: var(--tracking-tight); max-width: 520px; }
.single-cta > p { font-family: var(--font-body); font-weight: var(--weight-light); font-size: 16px; color: var(--text-body); margin-bottom: 36px; max-width: 380px; line-height: 1.7; }
.single-cta-note { margin-top: 20px; font-family: var(--font-body); font-size: 12px; color: var(--text-muted); }
.single-cta-note a { text-decoration: none; color: inherit; }
.single-cta-note a:hover { color: var(--color-ink); }

/* ============================================================
   GENERIC PAGE
   ============================================================ */
.page-hero { background: var(--color-warm); padding: 120px 48px 72px; border-bottom: 1px solid var(--color-border); }
.page-hero-inner { max-width: var(--section-max-width); margin: 0 auto; }
.page-h1 { font-family: var(--font-display); font-weight: 700; font-size: clamp(32px, 5vw, 60px); letter-spacing: var(--tracking-tight); line-height: var(--leading-snug); color: var(--color-ink); }
.page-body-section { padding: 80px 48px 100px; }
.page-body-inner { max-width: 740px; margin: 0 auto; }
.page-content { font-family: var(--font-body); font-size: 17px; color: var(--text-body); line-height: 1.8; }
.page-content h2 { font-family: var(--font-display); font-weight: 600; font-size: 24px; color: var(--color-ink); margin: 48px 0 16px; letter-spacing: var(--tracking-slight); }
.page-content h3 { font-family: var(--font-display); font-weight: 600; font-size: 19px; color: var(--color-ink); margin: 36px 0 12px; }
.page-content p { margin-bottom: 20px; }
.page-content ul, .page-content ol { padding-left: 24px; margin-bottom: 20px; }
.page-content li { margin-bottom: 8px; line-height: 1.7; }
.page-content a { color: var(--color-accent-hover); text-decoration: underline; text-underline-offset: 3px; }

/* ============================================================
   MOBILE RESPONSIVE
   ============================================================ */
@media (max-width: 1024px) {
  .overview-grid { grid-template-columns: repeat(2, 1fr); }
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .services-grid--3 { grid-template-columns: repeat(2, 1fr); }
  .svc-inner { grid-template-columns: 1fr; gap: 40px; }
  .approach-grid { grid-template-columns: 1fr; gap: 48px; }
  .engagement-grid { grid-template-columns: 1fr; }
  .industry-layout { grid-template-columns: 1fr; }
  .ind-tab { margin-bottom: 0; }
  .contact-layout { grid-template-columns: 1fr; }
  .contact-left { position: relative; height: auto; }
  .contact-form-wrap { min-height: auto; }
}

@media (max-width: 768px) {
  :root {
    --section-padding-x: 24px;
    --section-padding-y: 64px;
    --section-padding-y-sm: 48px;
  }

  /* Nav */
  .fs-nav { padding: 0 24px; }
  .fs-nav-links { display: none; }
  .fs-hamburger { display: flex; }
  body.nav-open { overflow: hidden; }

  /* Hero */
  .hero { padding: 100px 24px 60px; }
  .hero-location { display: none; }
  .hero-ctas { flex-direction: column; align-items: flex-start; }
  .dark-hero { padding: 100px 24px 60px; min-height: auto; }
  .hero-loc { display: none; }

  /* Grids → 1 column */
  .services-grid,
  .services-grid--3,
  .stats-grid,
  .why-grid,
  .situations-grid,
  .size-grid,
  .overview-grid,
  .posts-inner,
  .fs-grid-4,
  .fs-grid-3,
  .fs-grid-2,
  .fs-grid-2-lg,
  .fs-editorial { grid-template-columns: 1fr; gap: 2px; }

  .why-grid { gap: 40px; }
  .fs-editorial { gap: 40px; }

  /* Section paddings */
  .section-services, .section-why, .section-testimonial, .section-cta,
  .approach, .overview, .svc-section, .engagement, .cta-band,
  .industry-section, .situations-section, .size-band, .cta-light,
  .support-body, .posts-grid, .blog-cta, .single-body, .single-cta,
  .page-body-section { padding-left: 24px; padding-right: 24px; }

  .hero, .dark-hero, .support-hero, .single-hero, .page-hero, .blog-header {
    padding-left: 24px; padding-right: 24px;
  }

  .fs-footer, .fs-footer-minimal { padding-left: 24px; padding-right: 24px; }

  /* Footer */
  .fs-footer-top { flex-direction: column; gap: 40px; }
  .fs-footer-cols { flex-direction: column; gap: 32px; }
  .fs-footer-bottom { flex-direction: column; gap: 12px; text-align: center; }

  /* Forms */
  .fs-form-grid-2 { grid-template-columns: 1fr; }
  .severity-row { flex-direction: column; }
  .svc-checkboxes { grid-template-columns: 1fr; }

  /* Support grid */
  .support-grid { grid-template-columns: 1fr; }
  .support-right { padding-left: 0; margin-top: 48px; }

  /* Contact layout */
  .contact-layout { grid-template-columns: 1fr; }
  .contact-left { position: relative; height: auto; padding: 88px 24px 48px; }
  .contact-right { padding-top: 0; }
  .contact-form-inner { padding: 32px 24px; }

  /* Blog filter */
  .filter-bar { padding: 0 24px; }
  .filter-bar-inner { gap: 0; }

  /* Section header */
  .section-header { flex-direction: column; align-items: flex-start; gap: 24px; }

  /* Overview grid */
  .overview-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 480px) {
  .overview-grid { grid-template-columns: 1fr; }
  .contact-tiles { flex-direction: column; }
}