/* ============================================================
   The Board Secretary — company design system
   Palette: ledger navy / record green / seal brass / warm paper
   Type: fluid clamp() scale, serif display on the system stack
   Spacing: 8px grid via --s* tokens
   ============================================================ */

:root{
  /* color — ledger navy */
  --navy-950:#081826;
  --navy-900:#0C2233;
  --navy-800:#123049;
  --navy-700:#1A4162;
  --navy-600:#225478;
  /* accent — seal brass (research-validated legal accent; green retired to status only) */
  --green-800:#6B4E18;
  --green-700:#7C5A1E;
  --green-600:#9A7226;
  --green-100:#EBDFC0;
  --green-50:#F7F1E1;
  --status-green:#1E7E59;
  /* color — seal brass */
  --brass-700:#7C5A1E;
  --brass-600:#9A7226;
  --brass-500:#C29A45;
  --brass-300:#DFC98F;
  --brass-100:#F2E8CE;
  /* color — paper */
  --paper-0:#FFFFFF;
  --paper-50:#FAF8F2;
  --paper-100:#F3EFE4;
  --paper-200:#EAE4D4;
  --line:#E3DCCA;
  --line-strong:#CEC4AB;
  /* color — ink */
  --ink-900:#182530;
  --ink-700:#35485A;
  --ink-600:#3F5262;
  --ink-500:#586A79;
  /* misc */
  --focus:#B45309;
  --r-sm:6px;
  --r-md:10px;
  --r-lg:14px;
  --shadow-1:0 1px 2px rgba(8,24,38,.06),0 1px 1px rgba(8,24,38,.04);
  --shadow-2:0 1px 2px rgba(8,24,38,.05),0 8px 24px -12px rgba(8,24,38,.18);
  --shadow-3:0 2px 4px rgba(8,24,38,.06),0 18px 44px -16px rgba(8,24,38,.25);
  /* type */
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --fs-xs:clamp(.72rem,.7rem + .1vw,.78rem);
  --fs-sm:clamp(.83rem,.8rem + .15vw,.9rem);
  --fs-base:clamp(1rem,.97rem + .18vw,1.0625rem);
  --fs-md:clamp(1.09rem,1.04rem + .28vw,1.2rem);
  --fs-lg:clamp(1.22rem,1.12rem + .5vw,1.42rem);
  --fs-xl:clamp(1.45rem,1.28rem + .9vw,1.85rem);
  --fs-2xl:clamp(1.8rem,1.5rem + 1.5vw,2.5rem);
  --fs-3xl:clamp(2.2rem,1.75rem + 2.4vw,3.35rem);
  /* spacing — 8px grid */
  --s1:8px; --s2:16px; --s3:24px; --s4:32px; --s5:40px;
  --s6:48px; --s7:56px; --s8:64px; --s10:80px; --s12:96px; --s14:112px;
  /* layout */
  --wrap:1152px;
  --wrap-narrow:880px;
  --gutter:clamp(20px,4vw,32px);
  --hdr-h:76px;
  --hdr-h-min:60px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr-h-min) + 16px)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
[hidden]{display:none!important}

body{
  margin:0;
  background:var(--paper-50);
  color:var(--ink-900);
  font-family:var(--sans);
  font-size:var(--fs-base);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
/* faint paper grain */
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:1;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
  opacity:.035;mix-blend-mode:multiply;
}

img,svg{max-width:100%;height:auto}
p{margin:0 0 1.1em}
p:last-child{margin-bottom:0}
ul,ol{margin:0 0 1.1em;padding-left:1.3em}
a{color:var(--green-700);text-decoration-thickness:1px;text-underline-offset:2px}
a:hover{color:var(--navy-800)}
strong{color:var(--ink-900)}
address{font-style:normal}

h1,h2,h3,h4{margin:0 0 .5em;color:var(--navy-900);line-height:1.15;text-wrap:balance}
h1{font-family:var(--serif);font-weight:700;font-size:var(--fs-3xl);letter-spacing:-.015em}
h2{font-family:var(--serif);font-weight:700;font-size:var(--fs-2xl);letter-spacing:-.012em}
h3{font-size:var(--fs-md);font-weight:700;letter-spacing:-.008em}
h4{font-size:var(--fs-base);font-weight:700}

:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:4px}

::selection{background:var(--brass-100);color:var(--navy-950)}

.skip{
  position:absolute;left:-9999px;top:0;z-index:400;
  background:var(--navy-900);color:#fff;padding:12px 20px;
  font-weight:600;text-decoration:none;border-radius:0 0 var(--r-sm) 0;
}
.skip:focus{left:0;top:0}

/* ============================ header ============================ */
.hdr{
  position:sticky;top:0;z-index:200;
  background:rgba(250,248,242,.92);
  -webkit-backdrop-filter:saturate(1.4) blur(10px);
  backdrop-filter:saturate(1.4) blur(10px);
  border-bottom:1px solid var(--line);
  transition:box-shadow .25s ease;
}
.hdr.is-stuck{box-shadow:0 6px 24px -14px rgba(8,24,38,.28)}
.hdr-in{
  max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);
  display:flex;align-items:center;justify-content:space-between;gap:var(--s3);
  height:var(--hdr-h);
  transition:height .25s ease;
}
.hdr.is-stuck .hdr-in{height:var(--hdr-h-min)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;min-width:0}
.brand-mark{flex:none;width:44px;height:44px;transition:width .25s ease,height .25s ease}
.hdr.is-stuck .brand-mark{width:36px;height:36px}
.brand-name{
  font-family:var(--serif);font-weight:700;color:var(--navy-900);
  font-size:clamp(1rem,.9rem + .5vw,1.17rem);line-height:1.12;letter-spacing:-.01em;display:block;
  white-space:nowrap;
}
.brand-sub{
  display:block;font-size:10.5px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--green-700);margin-top:3px;
  transition:opacity .2s ease;white-space:nowrap;
}
.hdr.is-stuck .brand-sub{opacity:0;height:0;overflow:hidden;margin:0}
.nav{display:flex;align-items:center}
.nav ul{list-style:none;display:flex;margin:0;padding:0;gap:2px}
.nav a{
  position:relative;display:block;padding:10px 12px;border-radius:8px;
  text-decoration:none;color:var(--ink-700);font-weight:600;font-size:var(--fs-sm);
  transition:color .15s ease,background .15s ease;white-space:nowrap;
}
.nav a:hover{color:var(--navy-900);background:var(--paper-100)}
.nav a::after{
  content:"";position:absolute;left:12px;right:12px;bottom:4px;height:2.5px;
  border-radius:2px;background:var(--green-600);transform:scaleX(0);
  transform-origin:left;transition:transform .2s ease;
}
.nav a:hover::after{transform:scaleX(.4)}
.nav a[aria-current="page"]{color:var(--navy-900)}
.nav a[aria-current="page"]::after{transform:scaleX(1)}
.nav .nav-cta a{
  background:var(--navy-800);color:#fff;margin-left:8px;padding:10px 16px;
}
.nav .nav-cta a::after{display:none}
.nav .nav-cta a:hover{background:var(--navy-900);color:#fff}
.nav-toggle{
  display:none;appearance:none;background:none;border:1px solid var(--line-strong);
  border-radius:8px;padding:9px 11px;cursor:pointer;color:var(--navy-900);
}
.nav-toggle svg{display:block}
.nav-toggle .ic-x{display:none}
.nav-toggle[aria-expanded="true"] .ic-x{display:block}
.nav-toggle[aria-expanded="true"] .ic-bars{display:none}

@media (max-width:1023px){
  .nav-toggle{display:block}
  .nav{
    display:none;position:absolute;left:0;right:0;top:100%;
    background:var(--paper-50);border-bottom:1px solid var(--line);
    box-shadow:0 24px 40px -20px rgba(8,24,38,.3);
  }
  .nav.open{display:block}
  .nav ul{flex-direction:column;gap:0;padding:8px var(--gutter) 16px}
  .nav a{padding:14px 12px;font-size:1rem;border-radius:8px;border-bottom:1px solid var(--paper-100)}
  .nav a::after{display:none}
  .nav a[aria-current="page"]{background:var(--green-50);color:var(--navy-900);
    box-shadow:inset 3px 0 0 var(--green-600)}
  .nav .nav-cta a{margin:10px 0 0;text-align:center;border-bottom:0}
}

/* ------------------------------------------------------------------
   The primary nav carries seven items plus the call to action, which no
   longer clears the brand between 1024px and the 1152px content width.
   Collapse to the menu button one breakpoint earlier; declarations are
   the same as the block above.
   ------------------------------------------------------------------ */
@media (max-width:1151px){
  .nav-toggle{display:block}
  .nav{
    display:none;position:absolute;left:0;right:0;top:100%;
    background:var(--paper-50);border-bottom:1px solid var(--line);
    box-shadow:0 24px 40px -20px rgba(8,24,38,.3);
  }
  .nav.open{display:block}
  .nav ul{flex-direction:column;gap:0;padding:8px var(--gutter) 16px}
  .nav a{padding:14px 12px;font-size:1rem;border-radius:8px;border-bottom:1px solid var(--paper-100)}
  .nav a::after{display:none}
  .nav a[aria-current="page"]{background:var(--green-50);color:var(--navy-900);
    box-shadow:inset 3px 0 0 var(--green-600)}
  .nav .nav-cta a{margin:10px 0 0;text-align:center;border-bottom:0}
}

/* ============================ layout primitives ============================ */
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.wrap-n{max-width:var(--wrap-narrow);margin:0 auto;padding:0 var(--gutter)}
.sec{padding:var(--s10) 0}
.sec-tight{padding:var(--s7) 0}
.band{background:var(--paper-100);border-block:1px solid var(--line)}
.band-navy{
  background:linear-gradient(160deg,var(--navy-900) 0%,var(--navy-800) 60%,#153A57 100%);
  color:#D5E2EC;border:0;position:relative;overflow:hidden;
}
.band-navy h2,.band-navy h3{color:#fff}
.band-navy a:not(.btn){color:var(--brass-300)}
.band-navy a:not(.btn):hover{color:#fff}

.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-size:var(--fs-xs);font-weight:800;letter-spacing:.18em;text-transform:uppercase;
  color:var(--green-700);margin:0 0 var(--s2);
}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--brass-500);border-radius:1px}
.band-navy .eyebrow{color:var(--brass-300)}
.band-navy .eyebrow::before{background:var(--brass-500)}
.lede{font-size:var(--fs-md);color:var(--ink-600);max-width:64ch}
.band-navy .lede{color:#C0D2E0}
.measure{max-width:66ch}

/* ============================ buttons ============================ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:13px 22px;border-radius:10px;border:1.5px solid transparent;
  font-family:inherit;font-size:var(--fs-sm);font-weight:700;text-decoration:none;
  cursor:pointer;line-height:1.2;
  transition:background .15s ease,border-color .15s ease,color .15s ease,transform .15s ease,box-shadow .15s ease;
}
.btn:active{transform:translateY(1px)}
.btn svg{flex:none}
.btn-primary{background:var(--navy-800);color:#fff;border-color:var(--navy-800);box-shadow:var(--shadow-1)}
.btn-primary:hover{background:var(--navy-900);border-color:var(--navy-900);color:#fff;box-shadow:var(--shadow-2)}
.btn-green{background:var(--green-700);color:#fff;border-color:var(--green-700);box-shadow:var(--shadow-1)}
.btn-green:hover{background:var(--green-800);border-color:var(--green-800);color:#fff}
.btn-light{background:#fff;color:var(--navy-900);border-color:#fff;box-shadow:var(--shadow-1)}
.btn-light:hover{background:var(--brass-100);border-color:var(--brass-100);color:var(--navy-950)}
.btn-ghost-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn-ghost-light:hover{background:rgba(255,255,255,.12);border-color:#fff;color:#fff}
.btn-outline{background:var(--paper-0);color:var(--navy-800);border-color:var(--line-strong)}
.btn-outline:hover{border-color:var(--navy-700);color:var(--navy-900)}
.btnrow{display:flex;flex-wrap:wrap;gap:12px;margin-top:var(--s3)}

/* ============================ cards & grids ============================ */
.grid{display:grid;gap:var(--s3)}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
@media (max-width:1023px){
  .g4{grid-template-columns:repeat(2,1fr)}
  .g3{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:679px){
  .g2,.g3,.g4{grid-template-columns:1fr}
}

.card{
  background:var(--paper-0);border:1px solid var(--line);border-radius:var(--r-md);
  padding:var(--s3);box-shadow:var(--shadow-1);
  transition:box-shadow .2s ease,transform .2s ease,border-color .2s ease;
}
.card-hover:hover{box-shadow:var(--shadow-2);transform:translateY(-2px);border-color:var(--line-strong)}
.card h3{margin-bottom:6px}
.card p{font-size:var(--fs-sm);color:var(--ink-600)}
.card-accent{border-top:3px solid var(--green-600)}

.icon-chip{
  width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:var(--green-50);border:1px solid var(--green-100);margin-bottom:var(--s2);color:var(--green-700);
}

/* ============================ boundaries band ============================ */
.bound{
  display:flex;gap:14px;align-items:flex-start;
  background:rgba(255,255,255,.05);border:1px solid rgba(223,201,143,.28);
  border-radius:var(--r-md);padding:18px 20px;
}
.bound .no{
  flex:none;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  border:1.5px solid var(--brass-500);color:var(--brass-300);
}
.bound strong{color:#fff;display:block;margin-bottom:2px}
.bound p{font-size:var(--fs-sm);color:#B7C9D8;margin:0}

.disclaimer{
  font-size:var(--fs-sm);color:#A9BDCD;border-left:3px solid var(--brass-500);
  padding:6px 0 6px 18px;max-width:72ch;
}

/* ============================ steps strip ============================ */
.steps3{
  list-style:none;margin:0;padding:0;display:grid;gap:var(--s2);
  grid-template-columns:repeat(3,1fr);counter-reset:s;
}
.steps3 li{
  position:relative;counter-increment:s;
  background:var(--paper-0);border:1px solid var(--line);border-radius:var(--r-md);
  padding:var(--s3);box-shadow:var(--shadow-1);
}
.steps3 li::before{
  content:"0" counter(s);
  font-family:var(--mono);font-size:.78rem;font-weight:700;letter-spacing:.1em;
  display:inline-flex;align-items:center;justify-content:center;
  padding:5px 10px;border-radius:999px;
  background:var(--navy-900);color:var(--brass-300);margin-bottom:var(--s2);
}
.steps3 li:not(:last-child)::after{
  content:"";position:absolute;top:34px;right:-14px;width:12px;height:2px;
  background:var(--line-strong);
}
.steps3 h3{font-size:var(--fs-base);margin-bottom:6px}
.steps3 p{font-size:var(--fs-sm);color:var(--ink-600);margin:0}
@media (max-width:679px){
  .steps3{grid-template-columns:1fr}
  .steps3 li::after{display:none!important}
}

/* numbered cycle (how-it-works) */
.cycle{list-style:none;margin:0;padding:0;display:grid;gap:var(--s2);grid-template-columns:repeat(2,1fr);counter-reset:c}
.cycle li{
  counter-increment:c;position:relative;
  background:var(--paper-0);border:1px solid var(--line);border-radius:var(--r-md);
  padding:var(--s3) var(--s3) var(--s3) 76px;box-shadow:var(--shadow-1);
}
.cycle li::before{
  content:counter(c);position:absolute;left:22px;top:22px;
  width:38px;height:38px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--serif);font-weight:700;font-size:1.15rem;
  background:var(--navy-900);color:var(--brass-300);
  border:2px solid var(--brass-500);
}
.cycle h3{font-size:var(--fs-base);margin-bottom:4px}
.cycle p{font-size:var(--fs-sm);color:var(--ink-600);margin:0}
@media (max-width:759px){.cycle{grid-template-columns:1fr}}

/* ============================ document figures ============================ */
.docfig{
  margin:0;background:var(--paper-0);border:1px solid var(--line);border-radius:var(--r-md);
  box-shadow:var(--shadow-2);overflow:hidden;
  transition:box-shadow .2s ease,transform .2s ease;
}
.docfig:hover{box-shadow:var(--shadow-3);transform:translateY(-3px)}
.docfig img{display:block;width:100%;border-bottom:1px solid var(--line)}
.docfig figcaption{
  padding:14px 18px;font-size:var(--fs-sm);color:var(--ink-600);background:var(--paper-50);
}
.docfig figcaption b{color:var(--navy-900)}
.shotfig{
  margin:0;border-radius:var(--r-md);overflow:hidden;border:1px solid var(--line);
  box-shadow:var(--shadow-2);background:var(--paper-0);
}
.shotfig img{display:block;width:100%}
.shotfig figcaption{padding:12px 18px;font-size:var(--fs-sm);color:var(--ink-600);border-top:1px solid var(--line);background:var(--paper-50)}

/* ============================ tier cards ============================ */
.tier{
  display:flex;flex-direction:column;
  background:var(--paper-0);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:var(--s4);box-shadow:var(--shadow-1);position:relative;
  transition:box-shadow .2s ease,transform .2s ease;
}
.tier:hover{box-shadow:var(--shadow-2);transform:translateY(-2px)}
.tier-name{
  font-family:var(--serif);font-size:var(--fs-xl);font-weight:700;color:var(--navy-900);
  margin:0 0 4px;letter-spacing:-.01em;
}
.tier-for{font-size:var(--fs-sm);color:var(--ink-500);margin:0 0 var(--s3);min-height:2.6em}
.tier ul{list-style:none;margin:0 0 var(--s3);padding:0;flex:1}
.tier li{
  position:relative;padding:8px 0 8px 30px;font-size:var(--fs-sm);color:var(--ink-700);
  border-bottom:1px solid var(--paper-100);
}
.tier li:last-child{border-bottom:0}
.tier li::before{
  content:"";position:absolute;left:2px;top:13px;width:16px;height:16px;border-radius:50%;
  background:var(--green-50);border:1.5px solid var(--green-600);
}
.tier li::after{
  content:"";position:absolute;left:6.5px;top:17px;width:7px;height:4px;
  border-left:1.8px solid var(--green-700);border-bottom:1.8px solid var(--green-700);
  transform:rotate(-45deg);
}
.tier .prev{font-size:var(--fs-xs);font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  color:var(--brass-600);margin:0 0 10px}
.tier-flag{
  position:absolute;top:-13px;left:var(--s4);
  font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  background:var(--navy-900);color:var(--brass-300);border:1px solid var(--brass-500);
  padding:5px 12px;border-radius:999px;
}
.tier-featured{border-color:var(--brass-500);box-shadow:var(--shadow-2)}
.tier-quote{font-size:var(--fs-sm);color:var(--ink-500);margin:0 0 var(--s2)}
.tier-quote b{color:var(--navy-900)}

/* ============================ rhythm table ============================ */
.tablewrap{
  background:var(--paper-0);border:1px solid var(--line);border-radius:var(--r-md);
  box-shadow:var(--shadow-1);overflow:hidden;
}
table{width:100%;border-collapse:collapse;font-size:var(--fs-sm)}
caption{
  text-align:left;padding:14px 20px;font-size:var(--fs-xs);color:var(--ink-500);
  border-bottom:1px solid var(--line);letter-spacing:.02em;
}
thead th{
  background:var(--navy-900);color:#E9F0F6;text-align:left;
  font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  padding:12px 20px;white-space:nowrap;
}
tbody td,tbody th{padding:14px 20px;border-bottom:1px solid var(--paper-100);vertical-align:top;text-align:left}
tbody tr:last-child td,tbody tr:last-child th{border-bottom:0}
tbody th{font-weight:700;color:var(--navy-900);white-space:nowrap}
tbody td small{color:var(--ink-500)}
@media (max-width:679px){
  thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;border:0;
    overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
  table,tbody,tr,td,tbody th{display:block;width:100%}
  caption{display:block;width:100%;padding:14px 18px}
  tbody tr{border-bottom:1px solid var(--line);padding:10px 0}
  tbody tr:last-child{border-bottom:0}
  tbody td,tbody th{border-bottom:0;padding:6px 18px}
  tbody td::before{
    content:attr(data-label);display:block;font-size:10px;font-weight:800;
    letter-spacing:.12em;text-transform:uppercase;color:var(--ink-500);margin-bottom:2px;
  }
}

/* ============================ accordion ============================ */
.acc{border:1px solid var(--line);border-radius:var(--r-md);background:var(--paper-0);
  box-shadow:var(--shadow-1);overflow:hidden}
.acc-item+.acc-item{border-top:1px solid var(--line)}
.acc-btn{
  display:flex;width:100%;align-items:center;justify-content:space-between;gap:var(--s2);
  background:none;border:0;padding:18px 20px;cursor:pointer;text-align:left;
  font-family:inherit;font-size:var(--fs-base);font-weight:700;color:var(--navy-900);
}
.acc-btn:hover{background:var(--paper-100)}
.acc-btn .chev{flex:none;transition:transform .2s ease;color:var(--green-700)}
.acc-btn[aria-expanded="true"] .chev{transform:rotate(180deg)}
.acc-panel{padding:0 20px 18px;font-size:var(--fs-sm);color:var(--ink-600)}
.acc-panel p{margin-bottom:.8em}
.acc-panel p:last-child{margin-bottom:0}

/* ============================ people ============================ */
.person{
  background:var(--paper-0);border:1px solid var(--line);border-radius:var(--r-md);
  padding:var(--s4);box-shadow:var(--shadow-1);
}
.person .avatar{
  width:64px;height:64px;border-radius:50%;margin-bottom:var(--s2);
  display:flex;align-items:center;justify-content:center;
  background:var(--navy-900);border:2px solid var(--brass-500);color:var(--brass-300);
  font-family:var(--serif);font-weight:700;font-size:1.35rem;letter-spacing:.02em;
}
.person h3{font-size:var(--fs-md);margin-bottom:2px}
.person .role{font-size:var(--fs-xs);font-weight:800;letter-spacing:.13em;
  text-transform:uppercase;color:var(--green-700);margin:0 0 10px}
.person p{font-size:var(--fs-sm);color:var(--ink-600)}

/* ============================ forms ============================ */
.form{background:var(--paper-0);border:1px solid var(--line);border-radius:var(--r-md);
  padding:var(--s4);box-shadow:var(--shadow-1)}
.field{display:flex;flex-direction:column;gap:6px;min-width:0;margin-bottom:var(--s2)}
.field>label{font-size:var(--fs-sm);font-weight:700;color:var(--ink-700)}
.hint{font-size:var(--fs-xs);color:var(--ink-500);font-weight:500}
select,input[type=text],input[type=email],input[type=tel],textarea{
  font-family:inherit;font-size:var(--fs-sm);color:var(--ink-900);
  background:var(--paper-0);border:1.5px solid var(--line-strong);border-radius:8px;
  padding:11px 12px;width:100%;transition:border-color .15s ease,box-shadow .15s ease;
}
select:hover,input:hover,textarea:hover{border-color:var(--green-600)}
select:focus,input:focus,textarea:focus{border-color:var(--green-700);outline:none;
  box-shadow:0 0 0 3px rgba(23,99,69,.16)}
.formnote{
  font-size:var(--fs-sm);color:var(--ink-600);background:var(--brass-100);
  border:1.5px dashed var(--brass-500);border-radius:var(--r-md);padding:14px 18px;
}
.formnote strong{color:var(--brass-700)}

/* ============================ notice ============================ */
.notice{
  background:var(--green-50);border:1px solid var(--green-100);
  border-radius:var(--r-md);padding:var(--s3);
}
.notice h3{margin-bottom:8px}
.notice p,.notice li{font-size:var(--fs-sm);color:var(--ink-600)}
.notice-paper{background:var(--paper-0);border-color:var(--line)}

/* ============================ pull quote ============================ */
.pull{
  margin:0;background:var(--paper-0);border:1px solid var(--line);
  border-left:4px solid var(--brass-500);border-radius:var(--r-md);
  padding:var(--s3) var(--s4);box-shadow:var(--shadow-1);max-width:56ch;
}
.pull blockquote{margin:0}
.pull blockquote p{
  font-family:var(--serif);font-size:var(--fs-lg);line-height:1.38;
  color:var(--navy-900);letter-spacing:-.008em;
}
.pull figcaption{
  margin-top:var(--s2);font-size:var(--fs-xs);font-weight:800;
  letter-spacing:.13em;text-transform:uppercase;color:var(--green-700);
}

/* ============================ footer ============================ */
.ftr{background:var(--navy-950);color:#B4C6D5;position:relative;font-size:var(--fs-sm)}
.wave-ftr{display:block;width:100%;height:clamp(36px,5vw,68px);margin-top:var(--s12);margin-bottom:-1px}
.ftr a{color:#A7C2D6;text-decoration:none}
.ftr a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.ftr h2,.ftr h3{color:#fff;font-family:var(--sans);font-size:var(--fs-xs);font-weight:800;
  letter-spacing:.16em;text-transform:uppercase;margin-bottom:var(--s2)}
.ftr-grid{
  display:grid;grid-template-columns:1.6fr 1fr 1fr 1.3fr;gap:var(--s4);
  padding:var(--s6) 0 var(--s5);
}
.ftr-grid ul{list-style:none;margin:0;padding:0}
.ftr-grid li{margin-bottom:10px}
.ftr-brand{display:flex;gap:12px;align-items:flex-start;margin-bottom:var(--s2)}
.ftr-brand strong{display:block;color:#fff;font-family:var(--serif);font-size:var(--fs-md);line-height:1.25}
.ftr-brand span{display:block;font-size:10.5px;color:#7E9FB6;letter-spacing:.14em;text-transform:uppercase;margin-top:4px}
.ftr-tag{font-family:var(--serif);font-style:italic;color:var(--brass-300);font-size:var(--fs-base)}
.ftr-fine{font-size:var(--fs-xs);color:#8FA9BC;line-height:1.7}
.ftr-bar{
  border-top:1px solid rgba(223,201,143,.16);padding:var(--s3) 0;
  display:flex;flex-wrap:wrap;gap:10px var(--s4);justify-content:space-between;
  font-size:var(--fs-xs);color:#7E9FB6;
}
@media (max-width:1023px){
  .ftr-grid{grid-template-columns:1fr 1fr}
  .ftr-grid>div:first-child{grid-column:1/-1}
}
@media (max-width:519px){ .ftr-grid{grid-template-columns:1fr} }

/* ============================ hero (homepage) ============================ */
.hero{
  position:relative;overflow:hidden;color:#E7EFF5;
  background:linear-gradient(180deg,#081826 0%,#0C2233 55%,#123049 100%);
}
.hero-svg{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
.hero-in{
  position:relative;z-index:2;max-width:var(--wrap);margin:0 auto;
  padding:clamp(64px,9vw,120px) var(--gutter) clamp(96px,12vw,160px);
}
.hero-badge{
  display:inline-flex;align-items:center;gap:9px;
  font-size:var(--fs-xs);font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  color:var(--brass-300);background:rgba(223,201,143,.1);
  border:1px solid rgba(223,201,143,.4);border-radius:999px;
  padding:7px 15px;margin:0 0 var(--s3);
}
.hero h1{color:#fff;font-size:clamp(2.3rem,1.7rem + 3vw,3.9rem);max-width:16ch;margin-bottom:var(--s2)}
.hero-tag{
  font-family:var(--serif);font-style:italic;font-size:var(--fs-lg);
  color:var(--brass-300);margin:0 0 var(--s3);
}
.hero-body{font-size:var(--fs-md);color:#C6D6E2;max-width:54ch}
.hero .btnrow{margin-top:var(--s4)}
.hero-wavebtm{position:absolute;left:0;right:0;bottom:-1px;height:clamp(48px,7vw,96px);width:100%;z-index:1;pointer-events:none}

/* page hero (interior) */
.pagehero{
  position:relative;overflow:hidden;color:#E7EFF5;
  background:linear-gradient(170deg,#081826 0%,#0C2233 70%,#123049 100%);
  padding:clamp(48px,7vw,88px) 0 clamp(56px,8vw,96px);
}
.pagehero .wrap{position:relative;z-index:2}
.pagehero h1{color:#fff;margin-bottom:var(--s2)}
.pagehero .lede{color:#C0D2E0}
.pagehero .eyebrow{color:var(--brass-300)}
.pagehero .eyebrow::before{background:var(--brass-500)}
.pagehero-svg{position:absolute;inset:0;width:100%;height:100%;opacity:.85;pointer-events:none}

/* ============================ scroll reveal (CSS only) ============================ */
@media (prefers-reduced-motion:no-preference){
  @supports (animation-timeline: view()){
    .reveal{
      animation:rise both;
      animation-timeline:view();
      animation-range:entry 0% entry 46%;
    }
    @keyframes rise{
      from{transform:translateY(12px)}
      to{transform:none}
    }
  }
}

/* ============================ utilities ============================ */
.mt-1{margin-top:var(--s1)}.mt-2{margin-top:var(--s2)}.mt-3{margin-top:var(--s3)}
.mt-4{margin-top:var(--s4)}.mt-5{margin-top:var(--s5)}
.mb-0{margin-bottom:0}.mb-2{margin-bottom:var(--s2)}.mb-3{margin-bottom:var(--s3)}.mb-4{margin-bottom:var(--s4)}
.center{text-align:center}

@media print{
  .hdr,.wave-ftr{display:none}
  body{background:#fff}
}