/* ==========================================================================
   BASTION STABILITY — site stylesheet
   Palette and type are locked to the Bastion brand system.
   Bastion Blue #305E6B (accent) · Link #1A4C8F · Roboto family
   ========================================================================== */

:root {
  color-scheme: light;

  /* Brand */
  --bastion-blue: #305E6B;
  --bastion-blue-dark: #244A55;
  --bastion-blue-pale: #AFC8D2;
  --bastion-blue-wash: #EDF3F5;
  --link: #1A4C8F;
  --link-hover: #123561;

  /* Ink */
  --ink: #2A2A2A;
  --body: #2D2D2D;
  --muted: #697882;
  --faint: #93A1A9;

  /* Paper */
  --paper: #FCFBF9;
  --paper-alt: #F5F7F8;
  --row-alt: #F7F9FA;
  --rule: #DCE3E6;
  --rule-strong: #C2CDD2;

  /* Signals */
  --up: #006600;
  --down: #CC0000;
  --callout-text: #281606;

  /* Metrics */
  --measure: 68ch;
  --gutter: clamp(1rem, 4vw, 2.75rem);
  --shell: 1120px;

  /* Type */
  --serif: "Roboto Serif", Georgia, "Times New Roman", serif;
  --sans: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, sans-serif;
  --mono: "Roboto Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--body);
  font-family: var(--sans);
  font-size: 18px;
  line-height: 1.65;
  font-synthesis-weight: none;
  -webkit-font-smoothing: antialiased;
}

img, svg { max-width: 100%; height: auto; display: block; }

a { color: var(--link); text-underline-offset: 2px; text-decoration-thickness: 1px; }
a:hover { color: var(--link-hover); }

:focus-visible {
  outline: 2px solid var(--bastion-blue);
  outline-offset: 3px;
}

h1, h2, h3, h4 {
  font-family: var(--serif);
  color: var(--ink);
  font-weight: 600;
  letter-spacing: -0.012em;
  margin: 0 0 .6em;
  line-height: 1.2;
}

p { margin: 0 0 1.15em; max-width: var(--measure); }
p:last-child { margin-bottom: 0; }

.shell {
  width: 100%;
  max-width: var(--shell);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.skip {
  position: absolute; left: -9999px; top: 0;
  background: var(--bastion-blue); color: #fff;
  padding: .6rem 1rem; z-index: 100;
}
.skip:focus { left: 0; }

/* ---------- Shared small elements ------------------------------------- */

.eyebrow {
  font-family: var(--mono);
  font-size: .68rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--bastion-blue);
  font-weight: 500;
  margin: 0 0 1rem;
}

.meta {
  font-family: var(--mono);
  font-size: .7rem;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--muted);
}

.rule-hair { border: 0; border-top: 1px solid var(--rule); margin: 0; }

.mono { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.up { color: var(--up); font-weight: 500; }
.down { color: var(--down); font-weight: 500; }

/* ---------- Top bar & masthead ---------------------------------------- */

.topbar {
  background: var(--bastion-blue);
  color: #DDE9ED;
  font-family: var(--mono);
  font-size: .68rem;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.topbar .shell {
  display: flex; flex-wrap: wrap; gap: .5rem 1.5rem;
  align-items: center; justify-content: space-between;
  padding-block: .55rem;
}
.topbar span { white-space: nowrap; }
@media (max-width: 720px) {
  .topbar .shell { justify-content: center; text-align: center; }
  .topbar span { white-space: normal; }
  .topbar span + span { display: none; }
}

.masthead {
  border-bottom: 1px solid var(--rule);
  background: var(--paper);
  text-align: center;
  padding-block: clamp(1.5rem, 4vw, 2.5rem) 0;
}
.wordmark {
  display: inline-block;
  font-family: var(--serif);
  font-weight: 600;
  font-size: clamp(1.6rem, 5.5vw, 2.6rem);
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink);
  text-decoration: none;
  line-height: 1.1;
}
.wordmark:hover { color: var(--bastion-blue); }
.wordmark .mark-sub { display: block; }

.masthead-rule {
  display: flex; align-items: center; gap: 1rem;
  margin: 1rem auto 0; max-width: 760px;
}
.masthead-rule::before, .masthead-rule::after {
  content: ""; flex: 1; height: 1px; background: var(--rule-strong);
}
.masthead-rule .meta { white-space: nowrap; }

/* ---------- Navigation ------------------------------------------------ */

.nav {
  position: sticky; top: 0; z-index: 40;
  background: rgba(252, 251, 249, .96);
  backdrop-filter: saturate(180%) blur(8px);
  border-bottom: 1px solid var(--rule);
}
.nav .shell {
  display: flex; align-items: center; justify-content: center;
  gap: clamp(.75rem, 2.5vw, 2rem);
  padding-block: .7rem;
  flex-wrap: wrap;
}
.nav a {
  font-family: var(--mono);
  font-size: .72rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted);
  text-decoration: none;
  padding: .2rem 0;
  border-bottom: 2px solid transparent;
}
.nav a:hover { color: var(--bastion-blue); border-bottom-color: var(--bastion-blue-pale); }
.nav a.nav-cta {
  color: #fff; background: var(--bastion-blue);
  padding: .45rem .9rem; border: 0;
}
.nav a.nav-cta:hover { background: var(--bastion-blue-dark); color: #fff; }

/* ---------- Coverage strip -------------------------------------------- */

.coverage {
  background: var(--paper-alt);
  border-bottom: 1px solid var(--rule);
  overflow: hidden;
}
.coverage .shell {
  display: flex; align-items: center; gap: 1rem;
  padding-block: .7rem;
  overflow-x: auto;
  scrollbar-width: none;
}
.coverage .shell::-webkit-scrollbar { display: none; }
.coverage-label {
  font-family: var(--mono); font-size: .62rem; letter-spacing: .16em;
  text-transform: uppercase; color: var(--bastion-blue); font-weight: 700;
  white-space: nowrap; padding-right: .75rem; border-right: 1px solid var(--rule-strong);
}
.coverage-items {
  display: flex; gap: 1.4rem; white-space: nowrap;
  font-family: var(--mono); font-size: .72rem; letter-spacing: .06em;
  color: var(--muted);
}

/* ---------- Hero ------------------------------------------------------- */

.hero { padding-block: clamp(2.5rem, 7vw, 4.5rem); }
.hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
  gap: clamp(2rem, 5vw, 3.75rem);
  align-items: start;
}
@media (max-width: 900px) { .hero-grid { grid-template-columns: 1fr; } }

.hero h1 {
  font-size: clamp(2rem, 5.4vw, 3.35rem);
  line-height: 1.08;
  letter-spacing: -0.022em;
  margin-bottom: .5em;
  max-width: 18ch;
}
.hero .deck {
  font-size: clamp(1.05rem, 2.1vw, 1.2rem);
  color: #3C4247;
  max-width: 46ch;
}
.hero-promise {
  border-left: 3px solid var(--bastion-blue);
  padding: .1rem 0 .1rem 1.1rem;
  margin: 1.75rem 0;
  font-family: var(--serif);
  font-size: 1.05rem;
  font-style: italic;
  color: #39434A;
  max-width: 46ch;
}

/* ---------- Specimen card --------------------------------------------- */

.specimen {
  border: 1px solid var(--rule-strong);
  background: #fff;
  box-shadow: 0 1px 0 var(--rule), 0 18px 40px -28px rgba(48, 94, 107, .55);
}
.specimen-head {
  background: var(--bastion-blue); color: #fff;
  padding: .55rem .9rem;
  font-family: var(--mono); font-size: .6rem;
  letter-spacing: .16em; text-transform: uppercase;
  display: flex; justify-content: space-between; gap: 1rem;
}
.specimen-body { padding: 1.15rem 1.15rem 1.35rem; font-size: .86rem; line-height: 1.55; }
.specimen-body p { max-width: none; }

.spec-block {
  border-top: 2px solid var(--bastion-blue);
  border-bottom: 2px solid var(--bastion-blue);
  padding: .7rem 0;
  margin-bottom: 1.1rem;
}
.spec-block h4 {
  font-family: var(--mono); font-size: .58rem; letter-spacing: .16em;
  text-transform: uppercase; color: var(--bastion-blue); font-weight: 700;
  margin: 0 0 .5rem;
}
.spec-delta { list-style: none; margin: 0; padding: 0; font-family: var(--mono); font-size: .74rem; }
.spec-delta li { display: flex; justify-content: space-between; gap: 1rem; padding: .16rem 0; }
.spec-delta li span:first-child { color: var(--muted); }

.spec-theme {
  font-family: var(--sans); font-weight: 700; font-size: .78rem;
  letter-spacing: .04em; text-transform: uppercase; color: var(--ink);
  margin: 0 0 .45rem;
}
.spec-setup {
  background: var(--row-alt);
  border-left: 3px solid var(--bastion-blue);
  padding: .7rem .85rem; margin: .9rem 0 1.1rem;
  font-size: .8rem;
}
.spec-setup ul { margin: .35rem 0 0; padding-left: 1.05rem; }
.spec-setup li { margin-bottom: .22rem; }
.spec-setup strong { color: var(--ink); }

.specimen-foot {
  border-top: 1px solid var(--rule);
  padding: .6rem .9rem;
  font-family: var(--mono); font-size: .58rem; line-height: 1.5;
  color: var(--faint); letter-spacing: .04em;
  background: var(--paper-alt);
}

/* ---------- Buttons & forms ------------------------------------------- */

.btn {
  display: inline-block;
  font-family: var(--mono);
  font-size: .78rem; letter-spacing: .12em; text-transform: uppercase;
  font-weight: 500;
  background: var(--bastion-blue); color: #fff;
  border: 1px solid var(--bastion-blue);
  padding: .85rem 1.6rem;
  text-decoration: none; cursor: pointer;
  transition: background .15s ease;
}
.btn:hover { background: var(--bastion-blue-dark); color: #fff; }
.btn-ghost {
  background: transparent; color: var(--bastion-blue);
  border: 1px solid var(--rule-strong);
}
.btn-ghost:hover { background: var(--bastion-blue-wash); color: var(--bastion-blue-dark); }
.btn-lg { padding: 1.05rem 2rem; font-size: .84rem; }
.hero-cta { margin: 0 0 .35rem; }

/* ---------- Hero offer block ------------------------------------------ */
.offer {
  border-top: 2px solid var(--bastion-blue);
  border-bottom: 1px solid var(--rule);
  padding: 1.05rem 0 1.2rem;
  margin: 1.6rem 0 1.5rem;
  max-width: 48ch;
}
.offer-line { font-size: 1rem; margin: 0 0 .7rem; color: var(--ink); max-width: none; }
.offer-list { list-style: none; margin: 0; padding: 0; }
.offer-list li {
  position: relative; padding: .55rem 0 .55rem 1.7rem;
  font-size: .96rem; border-top: 1px solid var(--rule);
}
.offer-list li:first-child { border-top: 0; }
.offer-list li::before {
  content: "\2713"; position: absolute; left: 0; top: .56rem;
  color: var(--bastion-blue); font-weight: 700; font-size: .9rem; line-height: 1.4;
}
.offer-list strong { color: var(--ink); }

/* ---------- Label above the signup box -------------------------------- */
.start-label {
  font-family: var(--mono); font-size: .68rem; letter-spacing: .16em;
  text-transform: uppercase; margin: 0 0 .7rem; color: var(--bastion-blue);
}
.subscribe-band .start-label { color: var(--bastion-blue-pale); }

.form-note {
  font-family: var(--mono); font-size: .66rem; letter-spacing: .06em;
  color: var(--muted); margin-top: .85rem; line-height: 1.7;
}

/* Native form + EmailOctopus embed share these rules */
.eo-slot { margin-top: 1.5rem; }

.bs-form {
  display: flex; flex-wrap: wrap; gap: .6rem;
  max-width: 34rem;
}
.bs-form .field { flex: 1 1 15rem; min-width: 0; }
.bs-form label {
  display: block;
  font-family: var(--mono); font-size: .62rem; letter-spacing: .14em;
  text-transform: uppercase; color: var(--muted); margin-bottom: .35rem;
}
.bs-form input[type="email"],
.bs-form input[type="text"],
.eo-slot input[type="email"],
.eo-slot input[type="text"] {
  width: 100%;
  font-family: var(--sans); font-size: 1rem;
  padding: .8rem .9rem;
  border: 1px solid var(--rule-strong);
  background: #fff; color: var(--ink);
  border-radius: 0;
}
.bs-form input:focus { border-color: var(--bastion-blue); }
.bs-form .submit { flex: 0 0 auto; display: flex; align-items: flex-end; }
.bs-form button { width: 100%; }

.eo-slot form { max-width: 34rem; }
.eo-slot button,
.eo-slot input[type="submit"] {
  font-family: var(--mono); font-size: .78rem; letter-spacing: .12em;
  text-transform: uppercase; background: var(--bastion-blue); color: #fff;
  border: 1px solid var(--bastion-blue); padding: .85rem 1.6rem; cursor: pointer;
  border-radius: 0;
}
.eo-slot button:hover { background: var(--bastion-blue-dark); }
.hp-field { position: absolute; left: -5000px; }

.form-status {
  margin-top: .9rem; padding: .75rem .9rem;
  border-left: 3px solid var(--bastion-blue);
  background: var(--bastion-blue-wash);
  font-size: .88rem; color: #33434A;
}
.form-status[hidden] { display: none !important; }

/* ---------- Section scaffolding --------------------------------------- */

.section { padding-block: clamp(2.75rem, 7vw, 4.75rem); border-top: 1px solid var(--rule); }
.section-alt { background: var(--paper-alt); }

.section-head {
  display: grid;
  grid-template-columns: 5.5rem minmax(0, 1fr);
  gap: 0 1.5rem;
  align-items: baseline;
  padding-bottom: 1rem;
  border-bottom: 2px solid var(--ink);
  margin-bottom: clamp(1.75rem, 4vw, 2.75rem);
}
@media (max-width: 620px) {
  .section-head { grid-template-columns: 1fr; gap: .35rem; }
}
.section-num {
  font-family: var(--mono); font-size: .82rem; font-weight: 700;
  letter-spacing: .1em; color: var(--bastion-blue);
}
.section-head h2 {
  font-size: clamp(1.5rem, 3.4vw, 2.1rem);
  margin: 0;
}
.section-head .sub {
  grid-column: 2; color: var(--muted); font-size: .95rem; margin: .45rem 0 0;
  max-width: 60ch;
}
@media (max-width: 620px) { .section-head .sub { grid-column: 1; } }

.lede { font-size: 1.1rem; color: #3C4247; max-width: 62ch; }

/* ---------- Anatomy list ---------------------------------------------- */

.anatomy { display: grid; gap: 0; border-top: 1px solid var(--rule); }
.anatomy-row {
  display: grid;
  grid-template-columns: 8.5rem minmax(0, 1fr);
  gap: 1.5rem;
  padding: 1.35rem 0;
  border-bottom: 1px solid var(--rule);
}
@media (max-width: 700px) {
  .anatomy-row { grid-template-columns: 1fr; gap: .4rem; }
}
.anatomy-row .slot {
  font-family: var(--mono); font-size: .68rem; letter-spacing: .12em;
  text-transform: uppercase; color: var(--bastion-blue); font-weight: 500;
  padding-top: .3rem;
}
.anatomy-row h3 { font-size: 1.12rem; margin: 0 0 .3rem; }
.anatomy-row p { margin: 0; font-size: .96rem; color: #414A50; }

/* ---------- Tax Map feature ------------------------------------------- */

.magnet {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(2rem, 5vw, 3.5rem);
  align-items: start;
}
@media (max-width: 900px) { .magnet { grid-template-columns: 1fr; } }

.magnet h2 { font-size: clamp(1.75rem, 4vw, 2.5rem); line-height: 1.12; }

.inside-list { list-style: none; margin: 1.5rem 0 0; padding: 0; }
.inside-list li {
  display: grid; grid-template-columns: 1.6rem 1fr; gap: .75rem;
  padding: .7rem 0; border-top: 1px solid var(--rule);
  font-size: .97rem;
}
.inside-list li:last-child { border-bottom: 1px solid var(--rule); }
.inside-list .n {
  font-family: var(--mono); font-size: .72rem; color: var(--bastion-blue);
  font-weight: 700; padding-top: .22rem;
}
.inside-list strong { color: var(--ink); }

/* Document cover mock */
.doc-cover {
  background: #fff;
  border: 1px solid var(--rule-strong);
  box-shadow: 0 20px 45px -30px rgba(48, 94, 107, .7);
  padding: 0;
  position: relative;
}
.doc-cover-top { height: 10px; background: var(--bastion-blue); }
.doc-cover-inner { padding: clamp(1.5rem, 4vw, 2.5rem); }
.doc-cover .doc-kicker {
  font-family: var(--mono); font-size: .6rem; letter-spacing: .2em;
  text-transform: uppercase; color: var(--bastion-blue); font-weight: 700;
  margin-bottom: 1.4rem;
}
.doc-cover h3 {
  font-size: clamp(1.4rem, 3.4vw, 1.95rem); line-height: 1.15;
  margin-bottom: .6rem;
}
.doc-cover .doc-sub { font-size: .95rem; color: var(--muted); margin-bottom: 1.5rem; }
.doc-spec {
  border-top: 1px solid var(--rule); margin-top: 1.5rem; padding-top: 1rem;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem 1.25rem;
}
.doc-spec div { font-size: .82rem; }
.doc-spec dt {
  font-family: var(--mono); font-size: .58rem; letter-spacing: .14em;
  text-transform: uppercase; color: var(--faint); margin-bottom: .15rem;
}
.doc-spec dd { margin: 0; font-family: var(--mono); font-size: .8rem; color: var(--ink); }

/* ---------- Charter --------------------------------------------------- */

.charter { counter-reset: charter; display: grid; gap: 0; }
.charter-item {
  counter-increment: charter;
  display: grid; grid-template-columns: 4rem minmax(0, 1fr); gap: 1.25rem;
  padding: 1.5rem 0; border-top: 1px solid var(--rule);
}
.charter-item:last-child { border-bottom: 1px solid var(--rule); }
@media (max-width: 620px) { .charter-item { grid-template-columns: 2.5rem 1fr; gap: .9rem; } }
.charter-item::before {
  content: counter(charter, decimal-leading-zero);
  font-family: var(--mono); font-size: 1.4rem; font-weight: 700;
  color: var(--bastion-blue-pale); line-height: 1;
}
.charter-item h3 { font-size: 1.08rem; margin: 0 0 .35rem; }
.charter-item p { margin: 0; font-size: .96rem; color: #414A50; }

/* ---------- Scope columns --------------------------------------------- */

.scope { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.5rem, 4vw, 3rem); }
@media (max-width: 760px) { .scope { grid-template-columns: 1fr; } }
.scope-col h3 {
  font-family: var(--mono); font-size: .72rem; letter-spacing: .16em;
  text-transform: uppercase; padding-bottom: .6rem; margin-bottom: 1rem;
  border-bottom: 2px solid currentColor;
}
.scope-is h3 { color: var(--bastion-blue); }
.scope-isnot h3 { color: #8A5A4A; }
.scope-col ul { list-style: none; margin: 0; padding: 0; }
.scope-col li {
  padding: .65rem 0 .65rem 1.6rem; border-bottom: 1px solid var(--rule);
  position: relative; font-size: .97rem;
}
.scope-is li::before {
  content: "✓"; position: absolute; left: 0; top: .62rem;
  color: var(--bastion-blue); font-weight: 700; font-size: .9rem;
}
.scope-isnot li::before {
  content: "×"; position: absolute; left: .15rem; top: .5rem;
  color: #8A5A4A; font-weight: 700; font-size: 1.1rem;
}

/* ---------- Editor ---------------------------------------------------- */

.editor { display: grid; grid-template-columns: minmax(0, 268px) minmax(0, 1fr); gap: clamp(1.75rem, 4vw, 3rem); align-items: start; }
@media (max-width: 760px) {
  .editor { grid-template-columns: 1fr; }
  .editor-plate { max-width: 320px; margin-inline: auto; }
}
.editor-plate {
  border: 1px solid var(--rule-strong); background: #fff; padding: 0; margin: 0;
  text-align: center; overflow: hidden;
  box-shadow: 0 14px 34px -28px rgba(48, 94, 107, .75);
}
.editor-portrait {
  display: block; width: 100%; max-width: 100%;
  aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 28%;
}
.editor-plate-caption {
  padding: .85rem 1rem 1rem; border-top: 1px solid var(--rule);
}
.editor-plate .name {
  display: block;
  font-family: var(--serif); font-size: 1.05rem; font-weight: 600; color: var(--ink);
}
.editor-plate .role {
  display: block;
  font-family: var(--mono); font-size: .6rem; letter-spacing: .15em;
  text-transform: uppercase; color: var(--muted); margin-top: .3rem;
}
.pull {
  font-family: var(--serif); font-size: clamp(1.2rem, 2.6vw, 1.5rem);
  line-height: 1.35; color: var(--bastion-blue-dark);
  border-top: 2px solid var(--bastion-blue); border-bottom: 2px solid var(--bastion-blue);
  padding: 1.1rem 0; margin: 1.75rem 0 0; max-width: 34ch;
}

/* ---------- Subscribe band -------------------------------------------- */

.subscribe-band {
  background: var(--bastion-blue);
  color: #EAF2F4;
  border-top: 1px solid var(--bastion-blue);
}
.subscribe-band h2 { color: #fff; font-size: clamp(1.7rem, 4vw, 2.4rem); max-width: 20ch; }
.subscribe-band p { color: #CFE0E5; }
.subscribe-band .eyebrow { color: var(--bastion-blue-pale); }
.subscribe-band .form-note { color: #A8C3CB; }
.subscribe-band .btn { background: #fff; color: var(--bastion-blue-dark); border-color: #fff; font-weight: 700; }
.subscribe-band .btn:hover { background: var(--bastion-blue-pale); color: var(--bastion-blue-dark); }
.subscribe-band .bs-form label { color: var(--bastion-blue-pale); }
.subscribe-band .form-status { background: rgba(255,255,255,.12); border-left-color: #fff; color: #fff; }
.subscribe-grid {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(2rem, 5vw, 3.5rem); align-items: center;
}
@media (max-width: 860px) { .subscribe-grid { grid-template-columns: 1fr; } }

.steps { list-style: none; margin: 0; padding: 0; counter-reset: step; }
.steps li {
  counter-increment: step;
  display: grid; grid-template-columns: 2rem 1fr; gap: .9rem;
  padding: .75rem 0; border-top: 1px solid rgba(255,255,255,.2);
  font-size: .95rem;
}
.steps li:last-child { border-bottom: 1px solid rgba(255,255,255,.2); }
.steps li::before {
  content: counter(step); font-family: var(--mono); font-weight: 700;
  color: var(--bastion-blue-pale); font-size: .95rem;
}

/* ---------- FAQ -------------------------------------------------------- */

.faq { border-top: 1px solid var(--rule); }
.faq details { border-bottom: 1px solid var(--rule); }
.faq summary {
  list-style: none; cursor: pointer; padding: 1.15rem 2.5rem 1.15rem 0;
  font-family: var(--serif); font-size: 1.08rem; font-weight: 600; color: var(--ink);
  position: relative;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: "+"; position: absolute; right: .35rem; top: 1rem;
  font-family: var(--mono); font-size: 1.3rem; color: var(--bastion-blue); line-height: 1;
}
.faq details[open] summary::after { content: "–"; }
.faq .answer { padding: 0 0 1.3rem; font-size: .97rem; color: #414A50; }

/* ---------- Footer ----------------------------------------------------- */

.site-footer {
  border-top: 3px solid var(--bastion-blue);
  background: var(--paper-alt);
  padding-block: clamp(2rem, 5vw, 3rem) 1.5rem;
  font-size: .9rem;
}
.footer-grid {
  display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 1fr));
  gap: 2rem; padding-bottom: 1.75rem; border-bottom: 1px solid var(--rule);
}
@media (max-width: 760px) { .footer-grid { grid-template-columns: 1fr; gap: 1.5rem; } }
.footer-grid h4 {
  font-family: var(--mono); font-size: .62rem; letter-spacing: .16em;
  text-transform: uppercase; color: var(--muted); margin-bottom: .8rem;
}
.footer-grid ul { list-style: none; margin: 0; padding: 0; }
.footer-grid li { margin-bottom: .45rem; }
.footer-grid a { color: var(--body); text-decoration: none; }
.footer-grid a:hover { color: var(--link); text-decoration: underline; }
.footer-word {
  font-family: var(--serif); font-size: 1.15rem; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase; color: var(--ink);
  margin-bottom: .6rem;
}
.disclaimer {
  margin-top: 1.5rem; font-size: .72rem; line-height: 1.7; color: var(--faint);
  max-width: none;
}
.colophon {
  margin-top: 1.1rem; font-family: var(--mono); font-size: .62rem;
  letter-spacing: .1em; text-transform: uppercase; color: var(--faint);
  display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; justify-content: space-between;
}

/* ---------- Simple interior pages -------------------------------------- */

.page { padding-block: clamp(2.5rem, 6vw, 4rem); }
.page h1 { font-size: clamp(1.9rem, 4.5vw, 2.8rem); }
.page h2 { font-size: 1.35rem; margin-top: 2.25rem; }
.page h3 { font-size: 1.1rem; margin-top: 1.75rem; }
.page ul, .page ol { max-width: var(--measure); padding-left: 1.25rem; }
.page li { margin-bottom: .5rem; }
.page-narrow { max-width: 760px; margin-inline: auto; }

.status-card {
  border: 1px solid var(--rule-strong); background: #fff;
  border-top: 6px solid var(--bastion-blue);
  padding: clamp(1.75rem, 5vw, 3rem);
  max-width: 760px; margin-inline: auto; text-align: center;
}
.status-card h1 { margin-bottom: .5rem; }
.status-card p { margin-inline: auto; }
.status-card .btn { margin-top: 1.5rem; }

/* ---------- EmailOctopus embed ------------------------------------------
   The EmailOctopus script injects its own markup into .eo-embed. It ships
   light-background styling, so the embed sits on a white card even inside
   the blue band — its defaults then read correctly. These rules live last
   in the file so they win over .subscribe-band on equal specificity.
   ------------------------------------------------------------------------ */

.eo-embed {
  background: #fff;
  border: 1px solid var(--rule-strong);
  padding: clamp(1.1rem, 3vw, 1.6rem);
  color: var(--body);
  font-family: var(--sans);
  min-height: 9rem;
}
.eo-embed [hidden] { display: none !important; }
.eo-embed * { max-width: 100%; }
.eo-embed form { max-width: none; margin: 0; }
.eo-embed a { color: var(--link); }

/* EmailOctopus writes its form-designer settings as INLINE styles on the
   injected markup, and an inline style beats any class selector. So every
   visual property we care about is forced here. Without !important the form
   arrives in whatever colour and typeface the EmailOctopus designer happens
   to be set to, and it reads as a third-party widget dropped on the page. */

.eo-embed p,
.eo-embed span,
.eo-embed div,
.eo-embed li {
  font-family: var(--sans) !important;
  color: var(--body) !important;
}
.eo-embed h1, .eo-embed h2, .eo-embed h3, .eo-embed h4 {
  font-family: var(--serif) !important;
  color: var(--ink) !important;
  font-size: 1.2rem !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  margin: 0 0 .5rem !important;
  text-transform: none !important;
  letter-spacing: -.01em !important;
}
/* EmailOctopus renders no field labels of its own — the only <label> in the
   form is the consent sentence beside the checkbox. So labels get readable
   body type, not the tiny mono treatment used for field labels elsewhere. */
.eo-embed label {
  font-family: var(--sans) !important;
  font-size: .88rem !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--body) !important;
  line-height: 1.5 !important;
  text-align: left !important;
}

/* The consent checkbox: EmailOctopus positions it so it lands on top of the
   first word of its own label. Lay the row out as flex instead. */
.eo-embed input[type="checkbox"] {
  position: static !important;
  float: none !important;
  width: 1.05rem !important;
  height: 1.05rem !important;
  min-width: 1.05rem !important;
  margin: .16rem 0 0 !important;
  flex: 0 0 auto !important;
  accent-color: var(--bastion-blue);
}
.eo-embed label:has(input[type="checkbox"]),
.eo-embed div:has(> input[type="checkbox"]),
.eo-embed p:has(> input[type="checkbox"]) {
  display: flex !important;
  align-items: flex-start !important;
  gap: .6rem !important;
  padding-left: 0 !important;
  text-indent: 0 !important;
  text-align: left !important;
}
.eo-embed input[type="checkbox"] + label,
.eo-embed input[type="checkbox"] ~ label {
  padding-left: 0 !important;
  text-indent: 0 !important;
  margin: 0 !important;
}

.eo-embed input[type="email"],
.eo-embed input[type="text"] {
  width: 100% !important;
  font-family: var(--sans) !important;
  font-size: 1rem !important;
  padding: .8rem .9rem !important;
  border: 1px solid var(--rule-strong) !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: var(--ink) !important;
  box-shadow: none !important;
}
.eo-embed input[type="email"]:focus,
.eo-embed input[type="text"]:focus {
  border-color: var(--bastion-blue) !important;
  outline: none !important;
}

.eo-embed button,
.eo-embed input[type="submit"],
.eo-embed .btn,
.eo-embed .btn-primary,
.eo-embed [type="submit"] {
  font-family: var(--mono) !important;
  font-size: .78rem !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  background: var(--bastion-blue) !important;
  background-image: none !important;
  color: #fff !important;
  border: 1px solid var(--bastion-blue) !important;
  border-radius: 0 !important;
  padding: .85rem 1.4rem !important;
  width: 100% !important;
  cursor: pointer !important;
  box-shadow: none !important;
  text-shadow: none !important;
  opacity: 1 !important;
}
.eo-embed button:hover,
.eo-embed input[type="submit"]:hover,
.eo-embed .btn:hover,
.eo-embed .btn-primary:hover,
.eo-embed [type="submit"]:hover {
  background: var(--bastion-blue-dark) !important;
  border-color: var(--bastion-blue-dark) !important;
  color: #fff !important;
}


.eo-fallback { font-size: .92rem; color: var(--body); margin: 0; }

/* ---------- Print ------------------------------------------------------ */

@media print {
  .nav, .topbar, .coverage, .subscribe-band, .site-footer { display: none !important; }
  body { background: #fff; font-size: 11pt; }
}