/* Verity Technology Corporation — shared stylesheet
   Tokens and component rules consolidated from the Overview Voyage and Service Offerings pages,
   reconciled to Verity_Website_Design_Reference.md. */

:root {
  --navy:#122838;
  --navy-deep:#0b1d2a;
  --navy-soft:#294559;
  --gold:#d4aa5a;
  --gold-light:#f0d79f;
  --gold-ink:#8f6726;       /* gold for text on light backgrounds */
  --ivory:#faf7ef;
  --paper:#f3f0e8;
  --ink:#1b2831;
  --muted:#62727d;
  --line:#ddd6c8;
  --teal:#4b8e8d;
  --teal-ink:#2f6f6e;       /* teal for small text on light backgrounds (AA contrast) */
  --serif: Georgia, "Times New Roman", serif;
  --sans: "Segoe UI", Aptos, Arial, sans-serif;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0;
  color:var(--ink);
  background:var(--ivory);
  font-family:var(--sans);
  line-height:1.58;
}
img { max-width:100%; height:auto; }
a { color:var(--navy-soft); }
a:hover { color:var(--navy); }
:focus-visible { outline:3px solid var(--gold); outline-offset:3px; }
.skip-link {
  position:absolute; left:-999px; top:8px; z-index:100;
  background:var(--gold); color:var(--navy-deep); padding:10px 16px; font-weight:700;
}
.skip-link:focus { left:8px; }

/* ---------- Buttons ---------- */
.btn {
  display:inline-block;
  padding:13px 26px;
  border:1px solid var(--gold);
  background:transparent;
  color:#fff;
  font:700 12px/1 var(--sans);
  letter-spacing:.18em;
  text-transform:uppercase;
  text-decoration:none;
  cursor:pointer;
  transition:background .15s, color .15s;
}
.btn:hover { background:var(--gold); color:var(--navy-deep); }
.btn.solid { background:var(--gold); color:var(--navy-deep); }
.btn.solid:hover { background:var(--gold-light); }
.btn.on-light { color:var(--navy); border-color:var(--navy); }
.btn.on-light:hover { background:var(--navy); color:#fff; }
.btn.sm { padding:10px 18px; font-size:11px; }
.btn-row { display:flex; flex-wrap:wrap; gap:14px; margin-top:30px; }

/* ---------- Site header ---------- */
.site-header {
  position:sticky; top:0; z-index:50;
  background:var(--navy-deep);
  color:#fff;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.hdr-inner {
  width:min(1320px, 94vw);
  margin:0 auto;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  min-height:84px;
}
.brand { display:flex; align-items:center; gap:14px; text-decoration:none; color:#fff; }
.brand img { width:54px; height:54px; display:block; }
.brand-text { display:flex; flex-direction:column; line-height:1; }
.brand-name {
  font-family:var(--serif); font-weight:400;
  font-size:32px; letter-spacing:.22em; color:#fff;
}
.brand-sub {
  margin-top:7px;
  font-size:9.5px; font-weight:600; letter-spacing:.3em; text-transform:uppercase; color:var(--gold);
  white-space:nowrap;
}
.nav-toggle {
  display:none;
  background:none; border:1px solid rgba(255,255,255,.4); color:#fff;
  font:700 12px/1 var(--sans); letter-spacing:.16em; text-transform:uppercase;
  padding:11px 16px; cursor:pointer;
}
#site-nav > ul { list-style:none; margin:0; padding:0; display:flex; align-items:center; gap:6px; }
#site-nav a, #site-nav .sub-toggle {
  display:block;
  color:#e8eff1; background:none; border:0; cursor:pointer;
  font:600 14px/1 var(--sans); letter-spacing:.04em;
  padding:12px 12px;
  text-decoration:none;
}
#site-nav a:hover, #site-nav .sub-toggle:hover { color:var(--gold-light); }
#site-nav a[aria-current="page"], #site-nav .sub-toggle.current {
  color:var(--gold-light);
  box-shadow:inset 0 -2px 0 var(--gold);
}
#site-nav .nav-cta { margin-left:10px; }
#site-nav .nav-cta a { color:#fff; border:1px solid var(--gold); padding:11px 18px; font-size:12px; letter-spacing:.16em; text-transform:uppercase; font-weight:700; box-shadow:none; }
#site-nav .nav-cta a:hover { background:var(--gold); color:var(--navy-deep); }
.has-sub { position:relative; }
.sub-toggle::after { content:""; display:inline-block; margin-left:8px; width:6px; height:6px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:translateY(-3px) rotate(45deg); }
.sub {
  display:none;
  position:absolute; left:0; top:100%;
  min-width:290px;
  margin:0; padding:8px 0; list-style:none;
  background:var(--navy-deep);
  border:1px solid rgba(255,255,255,.16);
  border-top:2px solid var(--gold);
}
.has-sub.open > .sub { display:block; }
@media (hover:hover) and (min-width:981px) {
  .has-sub:hover > .sub { display:block; }
}
.sub a { padding:11px 20px; font-weight:500; box-shadow:none !important; }
.sub a[aria-current="page"] { color:var(--gold-light); }
.sub .sub-label { padding:10px 20px 4px; font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); font-weight:700; }

/* Home: header floats over the hero photograph */
body.home .site-header {
  position:absolute; left:0; right:0; top:0;
  background:linear-gradient(180deg, rgba(6,19,29,.62), rgba(6,19,29,0));
  border-bottom:0;
}

/* ---------- Hero (home) ---------- */
.hero {
  min-height:94vh;
  position:relative;
  display:flex;
  align-items:flex-end;
  padding:140px 5vw 72px;
  color:white;
  background:
    linear-gradient(90deg, rgba(6,19,29,.60) 0%, rgba(6,19,29,.42) 26%, rgba(6,19,29,.08) 66%, rgba(6,19,29,.04) 100%),
    linear-gradient(180deg, rgba(7,21,33,.12) 0%, rgba(7,21,33,.02) 42%, rgba(7,21,33,.44) 100%),
    url("/assets/img/hero.webp") center top / cover no-repeat;
  background-color:var(--navy);
}
.hero:after {
  content:""; position:absolute; inset:auto 0 0; height:150px;
  background:linear-gradient(180deg, transparent, rgba(11,29,42,.62));
  pointer-events:none;
}
.hero-content { position:relative; z-index:1; width:min(820px, 88vw); }
.hero .brand-kicker {
  font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.24em;
  color:var(--gold-light); margin:0 0 16px;
}
.hero .truth {
  margin:0 0 8px; font-family:var(--sans); font-weight:400; line-height:1.2;
  font-size:clamp(16px, 1.9vw, 24px); letter-spacing:.10em; text-transform:uppercase;
}
.hero .stewardship {
  max-width:680px; margin:0;
  font-family:var(--serif);
  font-size:clamp(24px, 2.8vw, 40px); line-height:1.14; color:#fff8e8;
}
.scroll-mark {
  position:absolute; z-index:2; right:5vw; bottom:34px;
  display:flex; align-items:center; gap:10px;
  color:#f5e5c0; font-size:12px; letter-spacing:.16em; text-transform:uppercase;
  text-decoration:none;
}
.scroll-mark span { display:inline-block; width:48px; height:1px; background:var(--gold); }

/* ---------- Page hero (inner pages) ---------- */
.page-hero {
  position:relative;
  color:#fff;
  background:
    linear-gradient(90deg, rgba(8,25,38,.92) 0%, rgba(8,25,38,.78) 45%, rgba(8,25,38,.45) 100%),
    url("/assets/img/hero.webp") center 24% / cover no-repeat;
  background-color:var(--navy-deep);
}
.page-hero .section { padding:78px 0 84px; }
.page-hero .eyebrow { color:var(--gold-light); }
.page-hero h1 {
  margin:0 0 18px; max-width:18em;
  font-family:var(--serif); font-weight:500;
  font-size:clamp(34px, 4.6vw, 62px); line-height:1.06; letter-spacing:.01em;
}
.page-hero .hero-lede {
  max-width:760px; margin:0;
  font-family:var(--serif); font-size:clamp(18px, 1.7vw, 25px); line-height:1.42; color:#edf2f2;
}

/* ---------- Shared type and layout ---------- */
.section { width:min(1160px, 90vw); margin:0 auto; padding:82px 0; }
.section.narrow { width:min(860px, 84vw); }
.eyebrow {
  font-size:11px; text-transform:uppercase; letter-spacing:.22em;
  color:var(--teal-ink); font-weight:800; margin-bottom:14px;
}
h2 {
  font-family:var(--serif); color:var(--navy); font-weight:500;
  font-size:clamp(30px, 3.7vw, 48px); line-height:1.10; margin:0 0 22px;
}
h3 { font-family:var(--serif); color:var(--navy); font-size:24px; line-height:1.2; margin:0 0 10px; }
.lede {
  color:var(--navy-soft); font-family:var(--serif);
  font-size:clamp(18px, 1.65vw, 25px); line-height:1.42; margin:0;
}
.prose { font-size:17px; max-width:78ch; }
.prose p { margin:0 0 18px; }
.prose ul { padding-left:20px; }
.big-line {
  font-family:var(--serif); color:var(--navy);
  font-size:clamp(24px, 2.8vw, 38px); line-height:1.24;
  margin:34px 0 0; padding-left:22px; border-left:4px solid var(--gold);
}
.center-line {
  text-align:center; margin:34px auto 0; max-width:900px;
  color:var(--navy); font-family:var(--serif); font-size:26px;
}
.bg-paper { background:var(--paper); }
.bg-ivory { background:var(--ivory); }
.rule-top { border-top:1px solid var(--line); }

/* Navy conviction band */
.mission { background:var(--navy-deep); color:white; }
.mission .section { padding:70px 0 76px; }
.mission h2 { color:white; }
.mission .eyebrow { color:var(--gold-light); }
.mission .lede { color:#edf2f2; }
.mission strong { color:var(--gold-light); }

/* Bulleted list in cards */
.dot-list { margin:15px 0 0; padding:0; list-style:none; }
.dot-list li { position:relative; padding-left:21px; margin:0 0 9px; font-size:16px; }
.dot-list li:before {
  content:""; position:absolute; left:0; top:.68em; width:8px; height:8px; border-radius:50%; background:var(--teal);
}
.dot-list.gold li:before { background:var(--gold); }

/* ---------- Benefit bars (home) ---------- */
.bars { background:var(--paper); border-bottom:1px solid var(--line); }
.bars .section { padding:44px 0; }
.bar-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:0; border:1px solid var(--line); background:#fff; }
.bar-item { padding:24px 22px; border-right:1px solid var(--line); text-decoration:none; color:inherit; display:block; }
.bar-item:last-child { border-right:0; }
.bar-item:hover { background:var(--ivory); }
.bar-item strong { display:block; font-family:var(--serif); font-weight:500; font-size:19px; color:var(--navy); margin-bottom:6px; line-height:1.2; }
.bar-item span { font-size:14px; color:#42515b; line-height:1.45; display:block; }
.bar-item:before { content:""; display:block; width:28px; height:3px; background:var(--gold); margin-bottom:14px; }

/* ---------- Support promise ---------- */
.promise-band { background:var(--paper); }
.pledge { display:grid; grid-template-columns:.95fr 1.05fr; gap:40px; align-items:center; }
.beat-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.beat {
  padding:22px 20px; background:var(--navy); color:white; text-align:center;
  font-family:var(--serif); font-size:19px; line-height:1.25;
}
.beat small {
  display:block; margin-top:8px; font-family:var(--sans); font-size:12px;
  letter-spacing:.14em; text-transform:uppercase; color:var(--gold-light);
}

/* ---------- Foundation cards ---------- */
.found-grid { display:grid; grid-template-columns:1fr 1fr; gap:28px; margin-top:26px; }
.found-card { padding:28px 28px 24px; border:1px solid var(--line); background:rgba(255,255,255,.72); }
.found-card.second .dot-list li:before { background:var(--gold); }

/* ---------- Horizontal progression (voyage / stack) ---------- */
.voyage-wrap, .stack-wrap {
  background:
    radial-gradient(circle at 50% 8%, rgba(212,169,88,.11), transparent 31%),
    linear-gradient(180deg, #fffefa, #f1eee7);
  border-top:1px solid #ece5d8; border-bottom:1px solid #e5dece;
}
.voyage, .stack { position:relative; padding-top:20px; }
.voyage-line, .stack-line {
  height:3px; margin:50px 8% 0;
  background:linear-gradient(90deg, var(--navy), var(--teal), var(--gold)); position:relative;
}
.stack-line { margin:50px 10% 0; }
.voyage-grid { display:grid; grid-template-columns:1.45fr repeat(6, 1fr) 1.55fr; gap:12px; margin-top:-11px; align-items:start; }
.stack-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:14px; margin-top:-11px; align-items:start; }
.voyage-node, .stack-node { text-align:center; min-width:0; }
.voyage-node .dot, .stack-node .dot {
  width:19px; height:19px; border-radius:50%; margin:0 auto 22px;
  background:var(--ivory); border:4px solid var(--teal);
}
.voyage-node.start .dot, .stack-node.start .dot { border-color:var(--navy); }
.voyage-node.end .dot, .stack-node.end .dot { border-color:var(--gold); }
.voyage-node .label, .stack-node .label {
  font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--navy);
}
.voyage-node.start .label, .voyage-node.end .label {
  font-family:var(--serif); font-size:16px; line-height:1.2; letter-spacing:.06em; text-transform:uppercase;
}
.voyage-node.end .label, .stack-node.end .label { color:var(--gold-ink); }
.voyage-node .desc, .stack-node .desc { font-size:12px; line-height:1.4; color:var(--muted); margin-top:7px; }
.voyage-note, .stack-note {
  margin:42px auto 0; max-width:860px; text-align:center;
  font-family:var(--serif); font-size:22px; color:var(--navy);
}

/* ---------- Practice cards ---------- */
.practice-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:26px; }
.practice-card {
  border:1px solid var(--line); background:white; padding:30px 28px 26px;
  border-top:5px solid var(--teal); display:flex; flex-direction:column;
}
.practice-card:nth-child(even) { border-top-color:var(--gold); }
.practice-card .stage {
  font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:#7a6234; font-weight:800; margin-bottom:12px;
}
.practice-card h3 { font-size:25px; }
.practice-card p { margin:0; color:#42515b; font-size:16px; }
.practice-card ul { margin:15px 0 0; padding:0; list-style:none; }
.practice-card li { position:relative; padding-left:21px; margin:0 0 8px; font-size:15px; color:#42515b; }
.practice-card li:before { content:""; position:absolute; left:0; top:.66em; width:7px; height:7px; border-radius:50%; background:var(--teal); }
.practice-card:nth-child(even) li:before { background:var(--gold); }
.practice-card .more {
  margin-top:auto; padding-top:20px; font-size:12px; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
}
.practice-card .more a { color:var(--navy); text-decoration:none; border-bottom:2px solid var(--gold); padding-bottom:2px; }
.practice-card .more a:hover { color:var(--gold-ink); }

/* ---------- Geography (navy) ---------- */
.geo, .guild { background:var(--navy); color:#e8eff1; }
.geo h2, .guild h2, .guild h3 { color:white; }
.geo .eyebrow, .guild .eyebrow { color:var(--gold-light); }
.geo-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:8px; }
.geo-card { border:1px solid rgba(255,255,255,.19); padding:26px 24px; }
.geo-card h3 { color:white; font-size:21px; }
.geo-card p { margin:0; color:#d5e0e4; font-size:15px; }
.geo-maxim, .guild-maxim { text-align:center; margin:34px auto 0; font-family:var(--serif); font-size:24px; color:white; max-width:900px; }

/* ---------- Numbered items (commitments, investment) ---------- */
.commit-grid, .invest-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:26px; }
.invest-grid { margin-top:10px; }
.commit-column, .invest-col { display:flex; flex-direction:column; }
.commit-item, .invest-item { display:grid; grid-template-columns:50px 1fr; gap:15px; padding:20px 0; border-top:1px solid var(--line); }
.commit-item .num, .invest-item .num {
  width:40px; height:40px; border:1px solid var(--gold); border-radius:50%;
  display:grid; place-items:center; color:#936c29; font-family:var(--serif); font-size:17px;
}
.commit-item p, .invest-item p { margin:0; color:#42515b; font-size:15px; }
.invest-item h3 { font-size:21px; }
.commitments .eyebrow { margin-bottom:28px; }

/* Pricing block */
.price-box {
  display:grid; grid-template-columns:auto 1fr; gap:34px; align-items:center;
  border:1px solid var(--line); border-top:5px solid var(--gold); background:#fff; padding:30px 34px; margin-top:26px;
}
.price-figure { font-family:var(--serif); color:var(--navy); line-height:1; }
.price-figure b { display:block; font-weight:500; font-size:clamp(40px, 5vw, 62px); }
.price-figure small { display:block; margin-top:10px; font-family:var(--sans); font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); font-weight:700; }
.price-box p { margin:0 0 10px; color:#42515b; font-size:16px; }
.price-box p:last-child { margin-bottom:0; }
.price-box .fine { font-size:13px; color:var(--muted); }

/* ---------- Voyage-page components ---------- */
.ai-turn { background:var(--paper); }
.ai-grid, .role-grid { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.role-grid { gap:24px; }
.ai-card { padding:28px 28px 24px; border:1px solid var(--line); background:rgba(255,255,255,.72); }
.ai-card h3 { font-size:25px; }
.ai-card.engineering .dot-list li:before { background:var(--gold); }
.ai-close { margin-top:26px; text-align:center; font-family:var(--serif); font-size:24px; color:var(--navy); }
.role-card { padding:28px; border:1px solid var(--line); background:white; }
.role-card.client { border-top:5px solid var(--teal); }
.role-card.verity { border-top:5px solid var(--gold); }
.role-card ul { columns:2; column-gap:24px; padding-left:18px; margin:12px 0 0; }
.role-card li { margin:0 0 7px; break-inside:avoid; font-size:15px; }
.guild-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.guild-card { border:1px solid rgba(255,255,255,.19); padding:28px 25px; min-height:280px; }
.guild-card .stage { color:var(--gold-light); font-size:11px; letter-spacing:.2em; text-transform:uppercase; margin-bottom:10px; }
.guild-card p { margin:0; color:#d5e0e4; font-size:16px; }
.method-section {
  background:linear-gradient(180deg, #fffefa 0%, #f4f0e7 100%);
  border-top:1px solid #e8e0d2; border-bottom:1px solid #e3dccf;
}
.method-section .section { padding-top:88px; padding-bottom:88px; }
.method-lede { max-width:900px; margin:0 0 38px; color:var(--navy-soft); font-family:var(--serif); font-size:clamp(18px, 1.55vw, 23px); line-height:1.45; }
.method-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.method-card {
  position:relative; min-height:360px; padding:30px 27px 28px;
  background:rgba(255,255,255,.84); border:1px solid var(--line); border-top:5px solid var(--teal);
}
.method-card.architect { border-top-color:var(--navy); }
.method-card.engineer { border-top-color:var(--gold); }
.method-number { position:absolute; top:22px; right:24px; font-family:var(--serif); font-size:36px; line-height:1; color:#d8d1c4; }
.method-card .stage { margin-bottom:12px; padding-right:48px; color:var(--teal-ink); font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
.method-card.architect .stage { color:var(--navy-soft); }
.method-card.engineer .stage { color:#8a6523; }
.method-card h3 { font-size:25px; max-width:90%; }
.method-card p { margin:0; color:#45545d; font-size:15px; line-height:1.58; }
.pull, .method-maxim {
  max-width:1000px; margin:38px auto 0; padding:24px 28px;
  border-left:4px solid var(--gold); background:rgba(255,255,255,.58);
  color:var(--navy); font-family:var(--serif); font-size:clamp(19px, 1.8vw, 25px); line-height:1.42;
}
.thi-architecture { margin-top:48px; padding-top:30px; border-top:1px solid var(--line); }
.thi-architecture .eyebrow { text-align:center; margin-bottom:20px; }
.thi-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.thi-item { text-align:center; padding:13px 14px; }
.thi-item strong { display:block; margin-bottom:5px; color:var(--navy); font-family:var(--serif); font-size:24px; font-weight:500; }
.thi-item span { color:var(--muted); font-size:14px; }
.promise {
  color:white;
  background:
    linear-gradient(90deg, rgba(8,25,38,.88), rgba(8,25,38,.56)),
    url("/assets/img/hero.webp") center 62% / cover no-repeat;
  background-color:var(--navy-deep);
}
.promise .section { padding:90px 0 100px; }
.promise h2 { color:white; }
.promise .eyebrow { color:var(--gold-light); }
.promise-copy {
  max-width:790px; font-family:var(--serif);
  font-size:clamp(20px, 2.0vw, 28px); line-height:1.37; color:#fffaf0;
}
.signature { margin-top:34px; font-size:13px; text-transform:uppercase; letter-spacing:.18em; color:var(--gold-light); }
.counsel-proof { max-width:860px; margin:34px auto 0; text-align:center; font-family:var(--serif); font-size:clamp(19px, 1.8vw, 25px); line-height:1.42; color:var(--navy); }

/* ---------- Closing call to action ---------- */
.closing {
  color:white;
  background:
    linear-gradient(90deg, rgba(8,25,38,.90), rgba(8,25,38,.58)),
    url("/assets/img/hero.webp") center 62% / cover no-repeat;
  background-color:var(--navy-deep);
}
.closing .section { padding:90px 0 100px; }
.closing h2 { color:white; }
.closing .eyebrow { color:var(--gold-light); }
.closing-copy { max-width:800px; font-family:var(--serif); font-size:clamp(20px, 2.0vw, 28px); line-height:1.37; color:#fffaf0; }

/* ---------- How We Work (FAQ) ---------- */
.hww-intro-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:0; border:1px solid var(--line); background:#fff; margin:34px 0 0; }
.hww-intro-grid div {
  padding:18px 12px; text-align:center; border-right:1px solid var(--line);
  font-size:11px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--navy); line-height:1.5;
}
.hww-intro-grid div:last-child { border-right:0; }
.disclaimer { font-size:14px; color:var(--muted); margin:26px 0 0; }
.faq-layout { display:grid; grid-template-columns:230px 1fr; gap:56px; align-items:start; }
.faq-toc { position:sticky; top:110px; font-size:14px; }
.faq-toc p { margin:0 0 10px; font-size:11px; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:var(--teal-ink); }
.faq-toc ol { list-style:none; margin:0; padding:0; border-left:2px solid var(--line); }
.faq-toc li a { display:block; padding:8px 0 8px 16px; margin-left:-2px; border-left:2px solid transparent; text-decoration:none; color:var(--navy-soft); }
.faq-toc li a:hover { color:var(--navy); border-left-color:var(--gold); }
.faq-section { padding-top:6px; margin-bottom:34px; scroll-margin-top:110px; }
.faq-section > h2 { font-size:clamp(26px, 3vw, 36px); padding-bottom:14px; border-bottom:1px solid var(--line); margin-bottom:6px; }
.faq-section > h2 .roman { color:var(--gold-ink); margin-right:10px; }
.faq-section > .section-intro { font-size:17px; color:#42515b; max-width:72ch; }
.qa { padding:34px 0; border-bottom:1px solid var(--line); scroll-margin-top:110px; }
.qa:last-child { border-bottom:0; }
.qa h3 { font-size:clamp(21px, 2vw, 26px); display:flex; gap:16px; align-items:baseline; margin-bottom:16px; }
.qa h3 .qn { flex:none; font-size:15px; color:var(--gold-ink); font-family:var(--sans); font-weight:800; letter-spacing:.08em; min-width:26px; }
.qa .answer {
  border-left:4px solid var(--gold); padding:2px 0 2px 22px; margin:0 0 18px;
  font-family:var(--serif); font-size:19px; line-height:1.5; color:var(--navy);
}
.qa .answer p { margin:0 0 12px; }
.qa .answer p:first-child { font-size:21px; }
.qa .answer p:last-child { margin-bottom:0; }
.qa ul { margin:0 0 18px; padding:0; list-style:none; max-width:74ch; }
.qa li { position:relative; padding-left:22px; margin:0 0 9px; font-size:16.5px; }
.qa li:before { content:""; position:absolute; left:0; top:.7em; width:8px; height:8px; border-radius:50%; background:var(--teal); }
.qa .callout, .callout {
  margin:22px 0 0; padding:18px 24px; background:var(--navy); color:#fff;
  font-family:var(--serif); font-size:clamp(18px, 1.6vw, 22px); line-height:1.4;
}
.faq-close { background:var(--navy-deep); color:#fff; padding:34px 36px; margin-top:20px; }
.faq-close p { margin:0 0 12px; font-family:var(--serif); font-size:clamp(19px, 1.8vw, 24px); line-height:1.4; }
.faq-close p:last-child { margin-bottom:0; color:var(--gold-light); }
.faq-note { margin-top:26px; font-size:13px; color:var(--muted); }

/* ---------- Contact ---------- */
.contact-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:48px; align-items:start; }
.contact-card { border:1px solid var(--line); background:#fff; padding:32px 30px; border-top:5px solid var(--gold); }
.contact-card h3 { font-size:22px; }
.contact-card .big-link { display:block; font-family:var(--serif); font-size:clamp(24px, 2.6vw, 34px); color:var(--navy); text-decoration:none; margin:4px 0 18px; word-break:break-word; }
.contact-card .big-link:hover { color:var(--gold-ink); }
.contact-card small { display:block; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); font-weight:700; }
.step-list { counter-reset:step; list-style:none; margin:20px 0 0; padding:0; }
.step-list li { counter-increment:step; display:grid; grid-template-columns:50px 1fr; gap:15px; padding:18px 0; border-top:1px solid var(--line); font-size:16px; }
.step-list li:before {
  content:counter(step); width:40px; height:40px; border:1px solid var(--gold); border-radius:50%;
  display:grid; place-items:center; color:#936c29; font-family:var(--serif); font-size:17px;
}
.step-list li strong { display:block; font-family:var(--serif); font-weight:500; font-size:20px; color:var(--navy); }

/* ---------- Resource / tool cards ---------- */
.res-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.res-card { background:#fff; border:1px solid var(--line); border-top:5px solid var(--teal); padding:28px 26px 24px; display:flex; flex-direction:column; }
.res-card:nth-child(2) { border-top-color:var(--navy); }
.res-card:nth-child(3) { border-top-color:var(--gold); }
.res-card .tag { font-size:11px; letter-spacing:.2em; text-transform:uppercase; font-weight:800; color:var(--teal-ink); margin-bottom:12px; }
.res-card h3 { font-size:23px; }
.res-card p { margin:0 0 16px; color:#42515b; font-size:15.5px; }
.res-card .actions { margin-top:auto; display:flex; flex-wrap:wrap; gap:10px; padding-top:10px; }
.future-box { border:1px dashed #b8ad97; padding:22px 26px; background:rgba(255,255,255,.5); color:#42515b; font-size:15.5px; margin-top:34px; }
.future-box strong { font-family:var(--serif); font-weight:500; font-size:19px; color:var(--navy); display:block; margin-bottom:4px; }

/* ---------- Interactive tools (checklists) ---------- */
.tool-bar {
  position:sticky; top:84px; z-index:20;
  background:rgba(250,247,239,.96); backdrop-filter:blur(4px);
  border-bottom:1px solid var(--line);
}
.tool-bar .inner { width:min(1160px, 90vw); margin:0 auto; padding:12px 0; display:flex; align-items:center; gap:20px; flex-wrap:wrap; }
.progress-wrap { flex:1 1 260px; min-width:200px; }
.progress-label { font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--navy-soft); margin-bottom:6px; }
.progress { height:6px; background:var(--line); }
.progress > i { display:block; height:100%; width:0; background:var(--gold); transition:width .2s; }
.legend-inline { font-size:13px; color:var(--muted); }

.band { margin:0 0 26px; border:1px solid var(--line); background:#fff; display:grid; grid-template-columns:230px 1fr; }
.band .rail { padding:24px 22px; background:var(--navy); color:#fff; border-top:5px solid var(--teal); }
.band.b2 .rail { border-top-color:var(--gold); }
.band.b3 .rail { border-top-color:var(--teal); }
.band.b4 .rail { border-top-color:var(--gold); }
.band .rail .step { font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-light); font-weight:800; margin-bottom:6px; }
.band .rail .name { font-family:var(--serif); font-size:26px; line-height:1.1; margin-bottom:10px; }
.band .rail .sub { font-size:14px; color:#d5e0e4; line-height:1.45; }
.band .items { padding:6px 0; }
.q-row { display:grid; grid-template-columns:34px 1fr auto; gap:16px; align-items:start; padding:16px 24px; border-top:1px solid var(--line); border-left:0; border-right:0; border-bottom:0; margin:0; min-width:0; }
.q-row:first-child { border-top:0; }
.q-row legend, .q-row .qtext-wrap { padding:0; }
.q-num { font-family:var(--serif); color:var(--gold-ink); font-size:18px; padding-top:1px; }
.q-text { font-size:16px; }
.q-text b { color:var(--navy); font-weight:600; }
.q-text i { display:block; color:var(--muted); font-style:normal; font-size:14px; margin-top:3px; }
.choices { display:flex; gap:0; flex:none; }
.choices label { position:relative; cursor:pointer; }
.choices input { position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.choices span {
  display:block; min-width:68px; padding:10px 12px; text-align:center;
  border:1px solid #bfb6a3; margin-left:-1px; background:#fff;
  font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#42515b;
}
.choices label:first-child span { margin-left:0; }
.choices input:checked + span.y { background:var(--teal-ink); border-color:var(--teal-ink); color:#fff; }
.choices input:checked + span.n { background:var(--navy); border-color:var(--navy); color:#fff; }
.choices input:checked + span.u { background:var(--gold); border-color:var(--gold); color:var(--navy-deep); }
.choices input:focus-visible + span { outline:3px solid var(--gold); outline-offset:2px; z-index:1; position:relative; }
.choices label:hover span { border-color:var(--navy); }

.tool-actions { display:flex; flex-wrap:wrap; gap:14px; align-items:center; margin:34px 0 0; }
.tool-actions .hint { font-size:14px; color:var(--muted); }

.results { margin-top:46px; scroll-margin-top:170px; }
.results[hidden] { display:none; }
.result-top { display:grid; grid-template-columns:auto 1fr; gap:34px; align-items:center; background:var(--navy-deep); color:#fff; padding:34px 36px; }
.score { font-family:var(--serif); line-height:1; }
.score b { font-weight:500; font-size:clamp(54px, 7vw, 88px); color:var(--gold-light); }
.score span { font-size:clamp(22px, 2.4vw, 32px); color:#d5e0e4; }
.result-top p { margin:0 0 10px; font-family:var(--serif); font-size:clamp(18px, 1.8vw, 23px); line-height:1.4; color:#edf2f2; }
.result-top p:last-child { margin:0; }
.line-bars { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin:20px 0 0; }
.line-bar { border:1px solid var(--line); background:#fff; padding:18px 18px 16px; }
.line-bar h4 { margin:0 0 4px; font-family:var(--serif); font-weight:500; font-size:19px; color:var(--navy); }
.line-bar .of { font-size:13px; color:var(--muted); margin-bottom:10px; }
.stack-bar { display:flex; height:10px; background:var(--line); }
.stack-bar i { display:block; height:100%; }
.stack-bar .y { background:var(--teal-ink); }
.stack-bar .u { background:var(--gold); }
.stack-bar .n { background:var(--navy); }
.line-bar .counts { margin-top:8px; font-size:12.5px; color:#42515b; }
.gap-list { margin:30px 0 0; }
.gap-list h3 { font-size:26px; }
.gap-group { margin:20px 0 0; }
.gap-group h4 { margin:0 0 8px; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--teal-ink); font-weight:800; }
.gap-item { display:grid; grid-template-columns:34px 1fr auto; gap:14px; padding:14px 0; border-top:1px solid var(--line); align-items:start; }
.gap-item .gstatus { font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; padding:5px 9px; white-space:nowrap; }
.gstatus.n { background:var(--navy); color:#fff; }
.gstatus.u { background:var(--gold); color:var(--navy-deep); }
.gap-item .gtext b { color:var(--navy); font-weight:600; }
.gap-item .gtext i { display:block; font-style:normal; color:var(--muted); font-size:14px; }
.gap-item .gown { font-size:13px; color:#42515b; margin-top:4px; }
.all-good { padding:20px 24px; border:1px solid var(--line); background:#fff; font-family:var(--serif); font-size:20px; color:var(--navy); }

.tag-own { display:inline-block; font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; padding:5px 10px; color:#fff; white-space:nowrap; }
.own-v { background:var(--teal-ink); }
.own-j { background:var(--navy); }
.own-y { background:var(--gold); color:var(--navy-deep); }
.tbc { display:inline-block; margin-left:6px; padding:2px 7px; border:1px dashed #a98b3e; color:#7a6234; background:#fbf1d6; font-size:10.5px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; vertical-align:2px; }

/* Send-to-Verity panel */
.send-panel { margin-top:34px; border:1px solid var(--line); border-top:5px solid var(--gold); background:#fff; padding:32px 34px; }
.send-panel[hidden] { display:none; }
.send-panel h3 { font-size:26px; }
.send-panel > p { margin:0 0 20px; color:#42515b; max-width:68ch; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px 22px; }
.field { display:flex; flex-direction:column; gap:6px; }
.field.full { grid-column:1 / -1; }
.field label { font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--navy-soft); }
.field label .opt { font-weight:500; letter-spacing:.04em; text-transform:none; color:var(--muted); }
.field input, .field textarea {
  font:16px/1.4 var(--sans); color:var(--ink);
  padding:12px 14px; border:1px solid #bfb6a3; background:#fff; border-radius:0; width:100%;
}
.field textarea { min-height:120px; resize:vertical; }
.field input:focus, .field textarea:focus { outline:3px solid var(--gold); outline-offset:0; border-color:var(--navy); }
.field .err { color:#9b2c2c; font-size:13px; min-height:1em; }
.include-box { font-size:14px; color:#42515b; padding:14px 16px; background:var(--paper); border:1px solid var(--line); margin:0 0 18px; }
.include-box b { color:var(--navy); }
.demo-note { margin-top:16px; font-size:13px; color:var(--muted); }
.confirm { padding:26px 28px; background:var(--navy-deep); color:#fff; margin-top:20px; }
.confirm[hidden] { display:none; }
.confirm h4 { margin:0 0 8px; font-family:var(--serif); font-weight:500; font-size:24px; color:var(--gold-light); }
.confirm p { margin:0 0 8px; color:#edf2f2; }
.confirm .demo-flag { display:inline-block; margin-bottom:12px; padding:4px 10px; background:var(--gold); color:var(--navy-deep); font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }

/* Who Delivers explorer */
.filters { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.chip-btn {
  font:700 12px/1 var(--sans); letter-spacing:.12em; text-transform:uppercase;
  padding:10px 16px; border:1px solid #bfb6a3; background:#fff; color:#42515b; cursor:pointer;
}
.chip-btn[aria-pressed="true"] { background:var(--navy); border-color:var(--navy); color:#fff; }
.chip-btn:hover { border-color:var(--navy); }
.who-row { display:grid; grid-template-columns:34px 1fr auto; gap:16px; align-items:start; padding:16px 24px; border-top:1px solid var(--line); }
.who-row:first-child { border-top:0; }
.who-row.hidden { display:none; }
.who-row .wtext b { color:var(--navy); font-weight:600; }
.who-row .wtext p { margin:3px 0 0; font-size:15px; color:#42515b; }
.who-row .wside { display:flex; flex-direction:column; align-items:flex-end; gap:10px; }
.ask-btn { font:700 11px/1 var(--sans); letter-spacing:.12em; text-transform:uppercase; padding:8px 12px; border:1px solid var(--navy); background:#fff; color:var(--navy); cursor:pointer; }
.ask-btn[aria-pressed="true"] { background:var(--gold); border-color:var(--gold); color:var(--navy-deep); }
.who-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:0 0 26px; }
.who-sum { border:1px solid var(--line); background:#fff; padding:18px 20px; }
.who-sum b { display:block; font-family:var(--serif); font-weight:500; font-size:40px; line-height:1; color:var(--navy); }
.who-sum span { display:block; margin-top:6px; font-size:13px; color:#42515b; }
.asked-count { font-size:14px; color:#42515b; }

/* Protection layers (printable resource) */
.layer { display:grid; grid-template-columns:230px 1fr; border:1px solid var(--line); background:#fff; margin-bottom:0; }
.layer .rail { padding:24px 22px; background:var(--navy); color:#fff; border-top:5px solid var(--teal); }
.layer.l2 .rail { border-top-color:var(--gold); }
.layer.l3 .rail { border-top-color:var(--teal); }
.layer .rail .step { font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-light); font-weight:800; margin-bottom:6px; }
.layer .rail .name { font-family:var(--serif); font-size:26px; line-height:1.1; margin-bottom:10px; }
.layer .rail .sub { font-size:14px; color:#d5e0e4; line-height:1.45; }
.layer .chips { display:grid; grid-template-columns:repeat(3,1fr); gap:0; }
.layer .chips.two { grid-template-columns:repeat(2,1fr); }
.chip { padding:20px 22px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.chip .v { display:block; font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--teal-ink); margin-bottom:6px; }
.chip h3 { font-size:19px; margin-bottom:6px; }
.chip p { margin:0; font-size:14.5px; color:#42515b; }
.arrow-between { text-align:center; padding:14px 0; font-size:12px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--navy-soft); }

/* ---------- Footer ---------- */
.foot { background:var(--navy-deep); color:#c3d1d7; }
.foot .section { padding:56px 0 48px; }
.foot-top { display:grid; grid-template-columns:1.2fr 3fr; gap:48px; margin-bottom:38px; }
.foot-brand .brand-name { font-size:28px; }
.foot-brand p { margin:18px 0 0; font-size:14px; color:#aebfc7; max-width:34ch; }
.foot-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:30px; }
.foot h4 { margin:0 0 12px; font-family:var(--serif); font-weight:500; font-size:16px; color:var(--gold-light); letter-spacing:.04em; }
.foot ul { margin:0; padding:0; list-style:none; }
.foot li { font-size:14px; margin:0 0 7px; }
.foot a { color:#c3d1d7; text-decoration:none; }
.foot a:hover { color:var(--gold-light); text-decoration:underline; }
.foot-rule {
  padding-top:22px; border-top:1px solid rgba(255,255,255,.15);
  font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:#8fa3ac;
}

/* ---------- Responsive ---------- */
@media (max-width: 1180px) {
  .brand-name { font-size:27px; }
  #site-nav a, #site-nav .sub-toggle { padding:12px 9px; font-size:13.5px; }
}
@media (max-width: 980px) {
  .nav-toggle { display:block; }
  .hdr-inner { min-height:72px; flex-wrap:wrap; }
  #site-nav { display:none; width:100%; padding:6px 0 18px; }
  #site-nav.open { display:block; }
  #site-nav > ul { flex-direction:column; align-items:stretch; gap:0; }
  #site-nav a, #site-nav .sub-toggle { width:100%; text-align:left; padding:14px 4px; border-top:1px solid rgba(255,255,255,.1); }
  #site-nav a[aria-current="page"], #site-nav .sub-toggle.current { box-shadow:none; }
  .sub { position:static; border:0; border-top:0; min-width:0; padding:0 0 0 16px; background:transparent; }
  #site-nav .nav-cta { margin:14px 0 0; }
  #site-nav .nav-cta a { text-align:center; }
  body.home .site-header { background:rgba(8,25,38,.78); }
  body.home .site-header:has(#site-nav.open) { background:var(--navy-deep); }

  .voyage-line, .stack-line { display:none; }
  .voyage-grid, .stack-grid { grid-template-columns:repeat(2,1fr); margin-top:20px; }
  .voyage-node, .stack-node { padding:18px 12px; border-top:2px solid var(--teal); }
  .voyage-node .dot, .stack-node .dot { display:none; }
  .pledge, .beat-grid, .found-grid, .practice-grid, .geo-grid, .invest-grid, .ai-grid, .role-grid, .guild-grid,
  .commit-grid, .method-grid, .thi-grid, .contact-grid, .res-grid, .foot-top, .form-grid, .line-bars, .who-summary {
    grid-template-columns:1fr;
  }
  .role-card ul { columns:1; }
  .bar-grid { grid-template-columns:1fr 1fr; }
  .bar-item { border-bottom:1px solid var(--line); }
  .faq-layout { grid-template-columns:1fr; gap:10px; }
  .faq-toc { position:static; margin-bottom:10px; }
  .faq-toc ol { display:flex; flex-wrap:wrap; border-left:0; gap:6px 18px; }
  .faq-toc li a { border-left:0; padding:6px 0; margin:0; }
  .hww-intro-grid { grid-template-columns:repeat(2,1fr); }
  .hww-intro-grid div { border-bottom:1px solid var(--line); }
  .band, .layer { grid-template-columns:1fr; }
  .layer .chips, .layer .chips.two { grid-template-columns:1fr; }
  .foot-grid { grid-template-columns:1fr 1fr; }
  .result-top, .price-box { grid-template-columns:1fr; gap:14px; }
  .tool-bar { top:72px; }
}
@media (max-width: 680px) {
  .hero { min-height:82vh; padding:120px 7vw 58px; background-position:center top; }
  .scroll-mark { display:none; }
  .section { width:min(88vw, 1160px); padding:64px 0; }
  .section.narrow { width:min(88vw, 860px); }
  .page-hero .section { padding:56px 0 60px; }
  .voyage-grid, .stack-grid { grid-template-columns:1fr; }
  .ai-card, .role-card, .guild-card, .practice-card, .found-card, .geo-card { padding:22px 20px; }
  .hero .truth { letter-spacing:.07em; }
  .bar-grid { grid-template-columns:1fr; }
  .brand img { width:44px; height:44px; }
  .brand-name { font-size:22px; letter-spacing:.18em; }
  .brand-sub { font-size:8px; letter-spacing:.22em; }
  .q-row, .who-row { grid-template-columns:28px 1fr; padding:16px 16px; }
  .q-row .choices, .who-row .wside { grid-column:2; }
  .who-row .wside { align-items:flex-start; flex-direction:row; flex-wrap:wrap; }
  .choices span { min-width:0; padding:10px 14px; }
  .gap-item { grid-template-columns:28px 1fr; }
  .gap-item .gstatus { grid-column:2; justify-self:start; }
  .send-panel, .result-top { padding:24px 20px; }
  .foot-grid { grid-template-columns:1fr; }
  .qa h3 { flex-direction:column; gap:4px; }
}

/* ---------- Print ---------- */
@media print {
  @page { size:letter; margin:.55in; }
  body { background:white; }
  .site-header, .foot, .tool-bar, .tool-actions, .send-panel, .btn-row, .scroll-mark, .nav-toggle, .skip-link, .no-print { display:none !important; }
  .hero, .page-hero, .mission, .promise, .closing, .guild, .geo, .result-top, .band .rail, .layer .rail, .beat, .callout {
    -webkit-print-color-adjust:exact; print-color-adjust:exact;
  }
  .hero { min-height:5in; padding-top:40px; }
  .page-hero { background:var(--navy-deep) !important; }
  .page-hero .section { padding:30px 0 34px; }
  .section { width:auto; padding:26px 0; }
  .practice-card, .found-card, .geo-card, .invest-item, .qa, .band, .layer, .line-bar, .gap-item, .result-top { break-inside:avoid; page-break-inside:avoid; }
  .results { margin-top:0; }
  .q-row .choices span { border-color:#777; }
}

/* ---------- Utilities ---------- */
.sr, .visually-hidden {
  position:absolute !important; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* List inside a navy band (Services overview opening) */
.mission-list { list-style:none; margin:24px 0 22px; padding:0; max-width:760px; }
.mission-list li {
  position:relative; padding:0 0 0 26px; margin:0 0 12px;
  font-family:var(--serif); font-size:clamp(18px, 1.6vw, 23px); line-height:1.4; color:#edf2f2;
}
.mission-list li:before { content:""; position:absolute; left:0; top:.6em; width:9px; height:9px; border-radius:50%; background:var(--gold); }
.mission em { font-style:italic; }

/* ---------- Two names, one team (home) ---------- */
.dual-band { background:var(--paper); border-bottom:1px solid var(--line); }
.dual-grid { display:grid; grid-template-columns:1fr auto 1fr; gap:0; align-items:stretch; margin-top:30px; }
.dual-card { background:#fff; border:1px solid var(--line); border-top:5px solid var(--navy); padding:30px 30px 26px; }
.dual-card:last-of-type { border-top-color:var(--gold); }
.dual-name { font-family:var(--serif); font-size:clamp(24px, 2.6vw, 34px); letter-spacing:.2em; color:var(--navy); line-height:1.1; }
.dual-name small { display:block; margin-top:8px; font-family:var(--sans); font-size:11px; font-weight:700; letter-spacing:.24em; text-transform:uppercase; color:var(--gold-ink); }
.dual-card .dual-role { margin:20px 0 10px; font-family:var(--serif); font-size:20px; color:var(--navy-soft); }
.dual-card p { color:#42515b; font-size:15.5px; margin:0 0 8px; }
.dual-join { display:grid; place-items:center; width:56px; font-family:var(--serif); font-size:34px; color:var(--gold-ink); }
@media (max-width: 980px) {
  .dual-grid { grid-template-columns:1fr; }
  .dual-join { width:auto; height:44px; }
}
