/*
Theme Name: SGP32 Authority
Theme URI: https://sgp32.co.uk
Author: sgp32.co.uk
Author URI: https://sgp32.co.uk
Description: Authority reference theme for SGP.32 IoT eSIM standard. Clean editorial design with Bebas Neue display type, Barlow body, and signal red accent.
Version: 1.0.0
License: GNU General Public License v2 or later
Text Domain: sgp32
*/

/* ===================================================
   CSS CUSTOM PROPERTIES
=================================================== */
:root {
  --paper:       #F5F4F0;
  --paper-dark:  #E8E6E0;
  --paper-mid:   #EDEAE4;
  --ink:         #0C0C0C;
  --ink-mid:     #2E2E2E;
  --ink-light:   #6B6860;
  --ink-faint:   #C0BDB8;
  --signal:      #D64A2A;
  --signal-pale: rgba(214,74,42,0.07);
  --signal-bdr:  rgba(214,74,42,0.20);
  --teal:        #0D7377;
  --teal-pale:   rgba(13,115,119,0.06);
  --white:       #FFFFFF;
  --max-w:       1100px;
  --pad:         24px;
}

/* ===================================================
   RESET & BASE
=================================================== */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }

body {
  background: var(--paper);
  color: var(--ink);
  font-family: 'Barlow', sans-serif;
  font-weight: 300;
  line-height: 1.7;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

img { max-width:100%; height:auto; display:block; }
a { color: var(--signal); text-decoration:none; }
a:hover { text-decoration: underline; }

/* ===================================================
   ANIMATIONS
=================================================== */
@keyframes fadeUp {
  from { opacity:0; transform:translateY(16px); }
  to   { opacity:1; transform:translateY(0); }
}
.fu  { opacity:0; animation: fadeUp .65s cubic-bezier(.22,1,.36,1) forwards; }
.d1  { animation-delay:.08s; }
.d2  { animation-delay:.2s;  }
.d3  { animation-delay:.32s; }
.d4  { animation-delay:.44s; }
.d5  { animation-delay:.56s; }

/* ===================================================
   TOP STRIPE
=================================================== */
.top-stripe {
  height: 4px;
  background: linear-gradient(90deg, var(--signal) 0%, #e8763a 60%, var(--ink) 100%);
  flex-shrink: 0;
}

/* ===================================================
   NAVIGATION
=================================================== */
.site-nav {
  background: var(--ink);
  height: 56px;
  display: flex;
  align-items: center;
  padding: 0 var(--pad);
  position: sticky;
  top: 0;
  z-index: 200;
  gap: 0;
}

.nav-logo {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 22px;
  letter-spacing: .06em;
  color: var(--white);
  text-decoration: none;
  flex-shrink: 0;
  line-height: 1;
}
.nav-logo:hover { text-decoration:none; color:var(--white); }
.nav-logo .dot { color: var(--signal); }

.nav-sep {
  width: 1px;
  height: 18px;
  background: rgba(255,255,255,.12);
  margin: 0 20px;
  flex-shrink: 0;
}

.nav-menu {
  display: flex;
  gap: 20px;
  list-style: none;
  flex: 1;
  overflow-x: auto;
  scrollbar-width: none;
}
.nav-menu::-webkit-scrollbar { display:none; }

.nav-menu li a {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.4);
  text-decoration: none;
  white-space: nowrap;
  transition: color .15s;
}
.nav-menu li a:hover,
.nav-menu li.current-menu-item a,
.nav-menu li.current-page-ancestor a { color: var(--white); }

.nav-badge {
  flex-shrink: 0;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .1em;
  color: var(--signal);
  background: var(--signal-pale);
  border: 1px solid var(--signal-bdr);
  padding: 4px 10px;
  border-radius: 2px;
  text-transform: uppercase;
}

.nav-hamburger {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  flex-direction: column;
  gap: 5px;
  margin-left: auto;
}
.nav-hamburger span {
  display: block;
  width: 22px;
  height: 2px;
  background: rgba(255,255,255,.6);
  transition: all .2s;
}

/* ===================================================
   HERO (front page)
=================================================== */
.site-hero {
  background: var(--ink);
  padding: 64px var(--pad) 0;
  position: relative;
  overflow: hidden;
}
.site-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(0deg,transparent,transparent 59px,rgba(255,255,255,.02) 59px,rgba(255,255,255,.02) 60px),
    repeating-linear-gradient(90deg,transparent,transparent 59px,rgba(255,255,255,.02) 59px,rgba(255,255,255,.02) 60px);
  pointer-events: none;
}
.hero-inner {
  max-width: var(--max-w);
  margin: 0 auto;
}
.hero-kicker {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--signal);
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
}
.hero-kicker::before { content:''; display:block; width:20px; height:2px; background:var(--signal); }

.hero-h1 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(54px, 9vw, 100px);
  line-height: .95;
  letter-spacing: .02em;
  color: var(--white);
  margin-bottom: 24px;
}
.hero-h1 em { font-style:normal; color:var(--signal); }

.hero-cols {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 48px;
  align-items: end;
  padding-bottom: 56px;
}
.hero-desc {
  font-size: 16px;
  font-weight: 300;
  color: rgba(255,255,255,.5);
  line-height: 1.8;
  margin-bottom: 32px;
  max-width: 560px;
}
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; }

/* ===================================================
   BUTTONS
=================================================== */
.btn-signal {
  background: var(--signal);
  color: var(--white);
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 13px 24px;
  text-decoration: none;
  border-radius: 2px;
  display: inline-block;
  transition: background .15s;
}
.btn-signal:hover { background:#b83d22; color:var(--white); text-decoration:none; }

.btn-ghost {
  background: transparent;
  color: rgba(255,255,255,.5);
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 13px 24px;
  text-decoration: none;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 2px;
  display: inline-block;
  transition: all .15s;
}
.btn-ghost:hover { color:var(--white); border-color:rgba(255,255,255,.4); text-decoration:none; }

/* ===================================================
   SPEC PANEL (hero sidebar)
=================================================== */
.spec-panel {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  border-bottom: none;
  border-radius: 6px 6px 0 0;
  align-self: flex-end;
}
.spec-head {
  background: var(--signal);
  padding: 13px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.spec-head span { font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.75); }
.spec-head strong { font-family:'Bebas Neue',sans-serif; font-size:18px; letter-spacing:.06em; color:var(--white); }
.spec-row { display:flex; justify-content:space-between; align-items:center; padding:13px 20px; border-bottom:1px solid rgba(255,255,255,.05); }
.spec-row:last-child { border-bottom:none; }
.sk { font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.28); }
.sv { font-family:'Barlow Condensed',sans-serif; font-size:14px; font-weight:600; color:rgba(255,255,255,.7); }
.sv.hi { color:var(--signal); }

/* ===================================================
   PAGE HERO (inner pages)
=================================================== */
.page-hero {
  background: var(--ink);
  padding: 56px var(--pad) 48px;
  position: relative;
  overflow: hidden;
}
.page-hero::before {
  content:'';
  position:absolute;
  inset:0;
  background:repeating-linear-gradient(0deg,transparent,transparent 59px,rgba(255,255,255,.02) 59px,rgba(255,255,255,.02) 60px),repeating-linear-gradient(90deg,transparent,transparent 59px,rgba(255,255,255,.02) 59px,rgba(255,255,255,.02) 60px);
  pointer-events:none;
}
.page-hero-inner { max-width:var(--max-w); margin:0 auto; }
.page-eyebrow {
  font-family:'Barlow Condensed',sans-serif;
  font-size:11px;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--signal);
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:16px;
}
.page-eyebrow::before { content:''; display:block; width:16px; height:2px; background:var(--signal); }

.page-h1 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(40px,6vw,64px);
  line-height: .98;
  letter-spacing: .02em;
  color: var(--white);
  margin-bottom: 18px;
  max-width: 800px;
}
.page-h1 em { font-style:normal; color:var(--signal); }

.page-intro {
  font-size: 16px;
  font-weight: 300;
  color: rgba(255,255,255,.45);
  line-height: 1.8;
  max-width: 620px;
  margin-bottom: 24px;
}

/* ===================================================
   BREADCRUMBS
=================================================== */
.breadcrumb-wrap {
  background: var(--ink-mid);
  padding: 12px var(--pad);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.breadcrumb-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.breadcrumb-inner a,
.breadcrumb-inner span {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.35);
  text-decoration: none;
  transition: color .15s;
}
.breadcrumb-inner a:hover { color:var(--signal); }
.breadcrumb-inner .sep { color:rgba(255,255,255,.15); }
.breadcrumb-inner .current { color:rgba(255,255,255,.55); }

/* ===================================================
   MAIN CONTENT AREA
=================================================== */
.site-main { max-width:var(--max-w); margin:0 auto; padding:64px var(--pad) 80px; }

/* ===================================================
   CONTENT PAGE TYPOGRAPHY
=================================================== */
.content-body h2 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(28px,4vw,40px);
  letter-spacing: .02em;
  color: var(--ink);
  line-height: 1.05;
  margin: 56px 0 16px;
  padding-top: 8px;
}
.content-body h2 em { font-style:normal; color:var(--signal); }

.content-body h3 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: var(--ink);
  letter-spacing: -.01em;
  margin: 32px 0 12px;
}

.content-body h4 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--ink-mid);
  letter-spacing: .04em;
  text-transform: uppercase;
  margin: 24px 0 8px;
}

.content-body p {
  font-size: 15px;
  font-weight: 300;
  color: var(--ink-light);
  line-height: 1.85;
  margin-bottom: 18px;
  max-width: 720px;
}

.content-body ul,
.content-body ol {
  margin: 16px 0 18px 24px;
  max-width: 700px;
}

.content-body li {
  font-size: 15px;
  font-weight: 300;
  color: var(--ink-light);
  line-height: 1.75;
  margin-bottom: 8px;
  padding-left: 4px;
}

.content-body strong { font-weight: 600; color: var(--ink-mid); }

.content-body a { color: var(--signal); font-weight:400; }
.content-body a:hover { text-decoration:underline; }

/* First h2 override */
.content-body > h2:first-child { margin-top:0; }

/* ===================================================
   CALLOUT BOXES
=================================================== */
.callout {
  background: var(--signal-pale);
  border-left: 3px solid var(--signal);
  padding: 20px 24px;
  margin: 28px 0;
  border-radius: 0 4px 4px 0;
}
.callout p { font-size:14px; color:var(--ink-mid); margin:0; max-width:none; font-weight:400; }
.callout strong { color:var(--ink); }

.callout-teal {
  background: var(--teal-pale);
  border-left: 3px solid var(--teal);
  padding: 20px 24px;
  margin: 28px 0;
  border-radius: 0 4px 4px 0;
}
.callout-teal p { font-size:14px; color:var(--ink-mid); margin:0 0 10px; max-width:none; font-weight:400; }
.callout-teal p:last-child { margin-bottom:0; }
.callout-teal h4 { color:var(--teal); margin:0 0 10px; font-family:'Barlow Condensed',sans-serif; font-size:15px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }

/* ===================================================
   COMPARISON TABLE
=================================================== */
.compare-table {
  width: 100%;
  border-collapse: collapse;
  margin: 28px 0;
  font-size: 13px;
  border: 1px solid var(--paper-dark);
  border-radius: 4px;
  overflow: hidden;
}
.compare-table th {
  background: var(--ink);
  color: rgba(255,255,255,.7);
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 12px 16px;
  text-align: left;
}
.compare-table th.hi { background: var(--signal); color:var(--white); }
.compare-table td {
  padding: 11px 16px;
  border-bottom: 1px solid var(--paper-dark);
  color: var(--ink-light);
  font-weight: 300;
}
.compare-table td:first-child { font-weight:500; color:var(--ink-mid); background:var(--paper-mid); }
.compare-table td.hi { font-weight:500; color:var(--ink); }
.compare-table tr:last-child td { border-bottom:none; }
.compare-table tr:hover td { background:var(--white); }
.compare-table tr:hover td:first-child { background:var(--paper-mid); }

/* ===================================================
   SECTION ELEMENTS (front page sections)
=================================================== */
.fp-section { max-width:var(--max-w); margin:0 auto; padding:72px var(--pad); }
.fp-section-dark { background:var(--ink); padding:72px 0; }
.fp-section-dark .fp-section { padding-top:0; padding-bottom:0; }

.sec-label { display:flex; align-items:center; gap:14px; margin-bottom:40px; }
.sec-num { font-family:'Bebas Neue',sans-serif; font-size:44px; line-height:1; color:var(--ink-faint); letter-spacing:.04em; flex-shrink:0; }
.sec-label-text h2 { font-family:'Barlow Condensed',sans-serif; font-size:12px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-light); }
.sec-label-text p { font-size:13px; font-weight:300; color:var(--ink-faint); }
.fp-section-dark .sec-num { color:rgba(255,255,255,.08); }
.fp-section-dark .sec-label-text h2 { color:rgba(255,255,255,.25); }
.fp-section-dark .sec-label-text p { color:rgba(255,255,255,.12); }

.sec-h {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(36px,5vw,52px);
  line-height: 1.0;
  letter-spacing: .02em;
  color: var(--ink);
  margin-bottom: 16px;
}
.sec-h em { font-style:normal; color:var(--signal); }
.fp-section-dark .sec-h { color:var(--white); }

.sec-intro {
  font-size: 16px;
  font-weight: 300;
  color: var(--ink-light);
  line-height: 1.8;
  max-width: 680px;
  margin-bottom: 48px;
}
.fp-section-dark .sec-intro { color:rgba(255,255,255,.4); }

/* ===================================================
   TWO / THREE COL GRIDS
=================================================== */
.two-col { display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start; }
.three-col { display:grid; grid-template-columns:1fr 1fr 1fr; gap:32px; }

.body-text h3 { font-family:'Barlow Condensed',sans-serif; font-size:22px; font-weight:700; color:var(--ink); margin-bottom:12px; letter-spacing:-.01em; }
.body-text p { font-size:15px; font-weight:300; color:var(--ink-light); line-height:1.8; margin-bottom:16px; }
.body-text p:last-child { margin-bottom:0; }

/* ===================================================
   TIMELINE
=================================================== */
.timeline { position:relative; padding-left:32px; }
.timeline::before { content:''; position:absolute; left:7px; top:8px; bottom:8px; width:2px; background:var(--paper-dark); }
.tl-item { position:relative; padding-bottom:40px; }
.tl-item:last-child { padding-bottom:0; }
.tl-dot { position:absolute; left:-28px; top:6px; width:16px; height:16px; border-radius:50%; border:2px solid var(--paper-dark); background:var(--paper); transition:border-color .2s; }
.tl-item:hover .tl-dot { border-color:var(--signal); }
.tl-item.active .tl-dot { border-color:var(--signal); background:var(--signal); }
.tl-year { font-family:'Barlow Condensed',sans-serif; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--signal); margin-bottom:6px; }
.tl-title { font-family:'Barlow Condensed',sans-serif; font-size:20px; font-weight:700; color:var(--ink); letter-spacing:-.01em; margin-bottom:8px; }
.tl-body { font-size:14px; font-weight:300; color:var(--ink-light); line-height:1.7; }

/* ===================================================
   INDUSTRY / PROTOCOL CARDS
=================================================== */
.industry-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }

.ind-card {
  background: var(--white);
  border: 1px solid var(--paper-dark);
  padding: 28px;
  border-radius: 4px;
  position: relative;
  overflow: hidden;
  transition: box-shadow .2s, transform .2s;
}
.ind-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--paper-dark); transition:background .2s; }
.ind-card:hover { transform:translateY(-2px); box-shadow:0 8px 28px rgba(0,0,0,.08); }
.ind-card:hover::before { background:var(--signal); }

.ind-card h4 { font-family:'Barlow Condensed',sans-serif; font-size:18px; font-weight:700; color:var(--ink); letter-spacing:-.01em; margin-bottom:8px; }
.ind-card p { font-size:13px; font-weight:300; color:var(--ink-light); line-height:1.6; margin-bottom:12px; }
.ind-why { font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--signal); }

.protocol-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; }
.proto-card { background:var(--white); border:1px solid var(--paper-dark); padding:24px; border-radius:4px; transition:border-color .2s; }
.proto-card:hover { border-color:var(--signal); }
.proto-name { font-family:'Bebas Neue',sans-serif; font-size:28px; letter-spacing:.04em; color:var(--ink); line-height:1; margin-bottom:4px; }
.proto-full { font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--signal); margin-bottom:12px; }
.proto-card p { font-size:13px; font-weight:300; color:var(--ink-light); line-height:1.6; }

/* ===================================================
   CORNERSTONE ROW LIST
=================================================== */
.cornerstone-list { display:flex; flex-direction:column; border:1px solid var(--paper-dark); border-radius:4px; overflow:hidden; }

.cs-row {
  display: grid;
  grid-template-columns: 56px 1fr auto;
  background: var(--white);
  border-bottom: 1px solid var(--paper-dark);
  text-decoration: none;
  transition: background .15s;
  position: relative;
  overflow: hidden;
}
.cs-row:last-child { border-bottom:none; }
.cs-row::after { content:''; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--signal); transform:scaleY(0); transition:transform .2s cubic-bezier(.22,1,.36,1); }
.cs-row:hover { background:#FDFCF9; text-decoration:none; }
.cs-row:hover::after { transform:scaleY(1); }

.cs-num { background:var(--paper); border-right:1px solid var(--paper-dark); display:flex; align-items:center; justify-content:center; }
.cs-num span { font-family:'Bebas Neue',sans-serif; font-size:26px; color:var(--ink-faint); letter-spacing:.04em; line-height:1; }
.cs-row:hover .cs-num span { color:var(--signal); }

.cs-body { padding:22px 28px; }
.cs-type { font-family:'Barlow Condensed',sans-serif; font-size:10px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--signal); margin-bottom:6px; }
.cs-body h3 { font-family:'Barlow Condensed',sans-serif; font-size:20px; font-weight:700; color:var(--ink); letter-spacing:-.01em; line-height:1.2; margin-bottom:6px; }
.cs-body p { font-size:13px; font-weight:300; color:var(--ink-light); line-height:1.6; }

.cs-arr { display:flex; align-items:center; padding:0 24px; }
.cs-arr span { font-family:'Bebas Neue',sans-serif; font-size:20px; color:var(--ink-faint); transition:color .15s, transform .15s; }
.cs-row:hover .cs-arr span { color:var(--signal); transform:translateX(4px); }

/* Dark variant cornerstone */
.cornerstone-list.dark { border-color:rgba(255,255,255,.07); }
.cornerstone-list.dark .cs-row { background:#161616; border-color:rgba(255,255,255,.07); }
.cornerstone-list.dark .cs-row:hover { background:#1c1c1c; }
.cornerstone-list.dark .cs-num { background:#111; border-color:rgba(255,255,255,.07); }
.cornerstone-list.dark .cs-num span { color:rgba(255,255,255,.15); }
.cornerstone-list.dark .cs-row:hover .cs-num span { color:var(--signal); }
.cornerstone-list.dark .cs-body h3 { color:rgba(255,255,255,.85); }
.cornerstone-list.dark .cs-body p { color:rgba(255,255,255,.35); }
.cornerstone-list.dark .cs-arr span { color:rgba(255,255,255,.15); }

/* ===================================================
   COMPANION / RELATED STRIP
=================================================== */
.companion { background:var(--ink-mid); padding:40px var(--pad); }
.companion-inner { max-width:var(--max-w); margin:0 auto; display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap; }
.companion h3 { font-family:'Bebas Neue',sans-serif; font-size:28px; letter-spacing:.04em; color:var(--white); line-height:1; }
.companion p { font-size:14px; color:rgba(255,255,255,.4); font-weight:300; }
.companion-links { display:flex; gap:12px; flex-wrap:wrap; flex-shrink:0; }
.clink { font-family:'Barlow Condensed',sans-serif; font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:12px 20px; text-decoration:none; border-radius:2px; transition:all .15s; }
.clink:hover { text-decoration:none; }
.clink.ghost { color:rgba(255,255,255,.45); border:1px solid rgba(255,255,255,.15); }
.clink.ghost:hover { color:var(--white); border-color:rgba(255,255,255,.4); }
.clink.primary { background:var(--signal); color:var(--white); }
.clink.primary:hover { background:#b83d22; }

/* ===================================================
   FOOTER
=================================================== */
.site-footer {
  background: var(--ink);
  padding: 40px var(--pad);
}
.footer-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 180px 1fr 1fr 1fr;
  gap: 40px;
  padding-bottom: 32px;
  border-bottom: 1px solid rgba(255,255,255,.07);
}
.footer-logo { font-family:'Bebas Neue',sans-serif; font-size:22px; color:var(--white); letter-spacing:.06em; text-decoration:none; display:block; margin-bottom:12px; }
.footer-logo .dot { color:var(--signal); }
.footer-logo:hover { text-decoration:none; }
.footer-tagline { font-size:13px; color:rgba(255,255,255,.3); font-weight:300; line-height:1.6; }

.footer-col h4 { font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.3); margin-bottom:14px; }
.footer-col ul { list-style:none; }
.footer-col ul li { margin-bottom:8px; }
.footer-col ul li a { font-size:13px; color:rgba(255,255,255,.45); font-weight:300; text-decoration:none; transition:color .15s; }
.footer-col ul li a:hover { color:var(--signal); }

.footer-bottom {
  max-width: var(--max-w);
  margin: 0 auto;
  padding-top: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}
.footer-bottom p { font-size:12px; color:rgba(255,255,255,.2); font-weight:300; }
.footer-bottom .schema-links { display:flex; gap:20px; }
.footer-bottom .schema-links a { font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.2); text-decoration:none; transition:color .15s; }
.footer-bottom .schema-links a:hover { color:var(--signal); }

/* ===================================================
   DIVIDER
=================================================== */
.section-divider { height:1px; background:var(--paper-dark); margin:0 var(--pad); }

/* ===================================================
   TEAL CALLOUT BLOCK
=================================================== */
.teal-block { background:var(--teal-pale); border:1px solid rgba(13,115,119,.15); border-left:3px solid var(--teal); padding:28px 32px; border-radius:0 6px 6px 0; margin:32px 0; }
.teal-block h4 { font-family:'Barlow Condensed',sans-serif; font-size:17px; font-weight:700; color:var(--teal); letter-spacing:-.01em; margin-bottom:10px; }
.teal-block p { font-size:14px; font-weight:300; color:var(--ink-mid); line-height:1.75; margin-bottom:10px; max-width:none; }
.teal-block p:last-child { margin-bottom:0; }

/* ===================================================
   INTERNAL LINKS / RELATED POSTS
=================================================== */
.related-pages { margin-top:56px; padding-top:40px; border-top:1px solid var(--paper-dark); }
.related-pages h3 { font-family:'Barlow Condensed',sans-serif; font-size:13px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-light); margin-bottom:20px; }

/* ===================================================
   RESPONSIVE
=================================================== */
@media(max-width:900px){
  .footer-inner { grid-template-columns:1fr 1fr; }
}
@media(max-width:768px){
  .hero-cols,.two-col,.three-col,.industry-grid { grid-template-columns:1fr; gap:32px; }
  .spec-panel { display:none; }
  .protocol-grid { grid-template-columns:1fr; }
  .cs-row { grid-template-columns:44px 1fr auto; }
  .cs-arr { padding:0 14px; }
  .companion-inner { flex-direction:column; align-items:flex-start; }
  .nav-menu { display:none; }
  .nav-hamburger { display:flex; }
  .nav-menu.open { display:flex; flex-direction:column; position:absolute; top:56px; left:0; right:0; background:var(--ink); padding:16px var(--pad); border-top:1px solid rgba(255,255,255,.07); gap:4px; }
  .nav-menu.open li a { padding:10px 0; display:block; border-bottom:1px solid rgba(255,255,255,.05); }
  .footer-inner { grid-template-columns:1fr; gap:28px; }
  .footer-bottom { flex-direction:column; align-items:flex-start; }
}
@media(max-width:480px){
  .site-hero,.page-hero { padding-left:16px; padding-right:16px; }
  .site-main,.fp-section { padding-left:16px; padding-right:16px; }
}