:root{
  --navy:#0A1E38;
  --navy-deep:#061426;
  --navy-mid:#15355A;
  --gold:#B0781E;        /* logo gold — rules, frames, borders (decorative) */
  --gold-ink:#8B5F18;    /* same hue+sat, darkened for AA text on light */
  --gold-lt:#C89A45;     /* lightened for text/fills on navy */
  --gold-pale:#EBDCC0;
  --paper:#FBFAF7;
  --paper-2:#F3F0E9;
  --ink:#182231;
  --muted:#5D6874;
  --rule:#DFD9CD;
  --rule-soft:#EAE5DA;

  --display:'Cormorant Garamond', 'Times New Roman', serif;
  --body:'Source Sans 3', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --wrap:1180px;
  --gut:clamp(20px, 5vw, 56px);
  --band:clamp(64px, 9vw, 118px);
}

*{box-sizing:border-box;margin:0;padding:0}
.skip{
  position:absolute;left:-9999px;top:0;z-index:200;
  background:var(--navy);color:#fff;padding:.9rem 1.4rem;
  font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;
}
.skip:focus{left:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--body);
  font-size:17px;
  line-height:1.68;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* ── type ─────────────────────────────── */
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--gut);padding-right:var(--gut)}
.narrow{max-width:820px}

h1,h2,h3,.dsp{font-family:var(--display);font-weight:400;line-height:1.1;letter-spacing:.005em}
h1{font-size:clamp(2.6rem,6.2vw,4.6rem)}
h2{font-size:clamp(2rem,4.2vw,3.2rem)}
h3{font-size:clamp(1.35rem,2.2vw,1.75rem)}

.eyebrow{
  font-family:var(--body);
  font-size:.7rem;
  font-weight:600;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:var(--gold-ink);
  display:block;
  margin-bottom:1.1rem;
}
.eyebrow.on-navy{color:var(--gold-lt)}
.lede{
  font-family:var(--body);
  font-size:clamp(1.05rem,1.35vw,1.16rem);
  color:var(--muted);line-height:1.74;font-weight:400;
}
.on-dark .lede,.lede.on-navy{color:#B9C6D6}

/* One prose voice. Inside a copy block EVERY paragraph — lead included —
   is identical in family, size, weight, colour and line-height. Any one of
   those changing mid-block reads to the eye as a different typeface.
   The larger .lede treatment is reserved for standalone intros in
   .sec-head, where there is no adjacent paragraph to compare against. */
.body-copy p,.body-copy li,.body-copy .lede{
  font-family:var(--body);
  font-size:1rem;
  font-weight:400;
  color:var(--muted);
  line-height:1.68;
  letter-spacing:0;
}
.body-copy em{font-style:italic;color:var(--navy)}
.band-navy .body-copy p,.band-navy .body-copy li{color:#B9C6D6}
p+p{margin-top:1.05em}
.body-copy p{max-width:66ch;font-size:1rem}

/* gold period motif from the tagline */
.dot{color:var(--gold-ink)}
.hero .dot,.band-navy .dot,.cta-band .dot,.tagline-strip .dot{color:var(--gold-lt)}

/* ── buttons ──────────────────────────── */
.btn{
  display:inline-flex;align-items:center;gap:.6em;
  font-size:.74rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  padding:1.02em 1.9em;
  border:1px solid var(--navy);
  background:var(--navy);color:#fff;
  transition:background .25s ease,color .25s ease,border-color .25s ease;
}
.btn:hover{background:var(--gold-ink);border-color:var(--gold-ink);color:#fff}
.btn-ghost{background:transparent;color:var(--navy);border-color:var(--rule)}
.btn-ghost:hover{background:var(--navy);border-color:var(--navy);color:#fff}
.btn-gold{background:var(--gold-lt);border-color:var(--gold-lt);color:var(--navy)}
.btn-gold:hover{background:#fff;border-color:#fff;color:var(--navy)}
.btn-onnavy{background:transparent;border-color:rgba(200,154,69,.55);color:#fff}
.btn-onnavy:hover{background:var(--gold-lt);border-color:var(--gold-lt);color:var(--navy)}

/* ── header ───────────────────────────── */
.hdr{
  position:sticky;top:0;z-index:60;
  background:rgba(251,250,247,.94);
  backdrop-filter:saturate(180%) blur(10px);
  border-bottom:1px solid var(--rule-soft);
}
/* The header needs more room than the 1180px reading column: logo + nav +
   phone + CTA simply does not fit in it. Give it its own wider container. */
.hdr .hdr-in{max-width:1440px}
.hdr-in{
  display:flex;align-items:center;justify-content:space-between;
  gap:clamp(1rem,2vw,2rem);height:92px;flex-wrap:nowrap;
}
/* The brand must never be squeezed by a crowded nav — a flex item
   shrinking a fixed-ratio <img> distorts it and reads as blur. */
.brand{flex:0 0 auto;display:flex;align-items:center;min-width:0}
.brand img{height:44px;width:auto;max-width:none;flex:0 0 auto}
.nav{
  display:flex;align-items:center;
  gap:clamp(.95rem,1.4vw,1.5rem);
  flex:0 1 auto;justify-content:flex-end;
  min-width:auto;      /* never shrink below the labels */
  margin-left:auto;
}
.nav a,.nav button.navlink{
  font-size:.72rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink);position:relative;padding:.5rem 0;transition:color .2s;
  white-space:nowrap;
}
.nav a:hover,.nav button.navlink:hover{color:var(--gold-ink)}
.nav a.active{color:var(--gold-ink)}
.nav a.active::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold);
}
.has-menu{position:relative}
.menu{
  position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%) translateY(-6px);
  background:#fff;border:1px solid var(--rule-soft);min-width:268px;padding:.5rem 0;
  box-shadow:0 24px 48px -24px rgba(10,30,56,.30);
  opacity:0;visibility:hidden;transition:opacity .2s ease,transform .2s ease,visibility .2s;
}
.has-menu:hover .menu,.has-menu:focus-within .menu,.has-menu.open .menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.menu a{display:block;padding:.72rem 1.4rem;letter-spacing:.1em;font-size:.7rem}
.menu a:hover{background:var(--paper-2);color:var(--gold-ink)}
.hdr-cta{display:flex;align-items:center;gap:clamp(.8rem,1.4vw,1.2rem);flex:0 0 auto}
.hdr-phone{
  display:flex;align-items:center;gap:.5em;
  font-size:.82rem;font-weight:600;letter-spacing:.03em;color:var(--navy);
  white-space:nowrap;transition:color .2s;
}
.hdr-phone:hover{color:var(--gold-ink)}
.hdr-phone svg{width:15px;height:15px;fill:currentColor}

.burger{display:none;width:30px;height:20px;position:relative}
.burger span{position:absolute;left:0;right:0;height:1.5px;background:var(--navy);transition:transform .3s,opacity .25s}
.burger span:nth-child(1){top:0}
.burger span:nth-child(2){top:9px}
.burger span:nth-child(3){top:18px}
body.menu-open .burger span:nth-child(1){transform:translateY(9px) rotate(45deg)}
body.menu-open .burger span:nth-child(2){opacity:0}
body.menu-open .burger span:nth-child(3){transform:translateY(-9px) rotate(-45deg)}

.drawer{
  position:fixed;inset:92px 0 0;z-index:55;background:var(--paper);
  padding:2rem var(--gut) 4rem;overflow-y:auto;
  transform:translateY(-12px);opacity:0;visibility:hidden;transition:.28s ease;
}
body.menu-open .drawer{opacity:1;visibility:visible;transform:none}
body.menu-open{overflow:hidden}
.drawer a{
  display:block;padding:1.05rem 0;border-bottom:1px solid var(--rule-soft);
  font-family:var(--display);font-size:1.5rem;
}
.drawer .sub{font-family:var(--body);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;padding-left:1.2rem}
.drawer .grouplabel{
  font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-ink);
  margin:1.8rem 0 .4rem;font-weight:600;
}

/* ── page routing ─────────────────────── */
.page{display:none}
.page.on{display:block;animation:fadeup .5s ease both}
@keyframes fadeup{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ── the signature: gold hairline frame ── */
.frame{position:relative}
.frame::before{
  content:"";position:absolute;inset:0;border:1px solid var(--gold);
  pointer-events:none;
}

/* ── hero ─────────────────────────────── */
.hero{
  background:var(--navy);color:#fff;position:relative;overflow:hidden;
  padding:clamp(84px,13vw,168px) 0 clamp(76px,11vw,140px);
}

/* ── photographic hero ──────────────────────────────
   Drop a photo at the img[data-hero] src below. Until one
   loads, .no-photo keeps the original navy + geometry.     */
.hero-photo{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-photo img{
  width:100%;height:100%;object-fit:cover;object-position:center 42%;
  filter:saturate(.55) contrast(1.06);
}
/* navy duotone scrim — makes ANY photo sit in the brand palette
   and guarantees AA contrast for the headline over it */
.hero-photo::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(100deg, rgba(6,20,38,.96) 0%, rgba(10,30,56,.90) 42%, rgba(10,30,56,.62) 72%, rgba(10,30,56,.48) 100%),
    linear-gradient(180deg, rgba(6,20,38,.55) 0%, rgba(6,20,38,0) 32%, rgba(6,20,38,.72) 100%);
}
.hero.has-photo::before,.hero.has-photo::after{opacity:.5}
.hero.has-photo{padding-top:clamp(96px,14vw,180px);padding-bottom:clamp(88px,12vw,150px)}
.hero.no-photo .hero-photo{display:none}
@media (max-width:820px){
  .hero-photo img{object-position:center 38%}
  .hero-photo::after{
    background:linear-gradient(180deg, rgba(6,20,38,.86) 0%, rgba(10,30,56,.80) 55%, rgba(6,20,38,.92) 100%);
  }
}
.hero::after{
  content:"";position:absolute;right:-14%;top:-28%;width:min(760px,78vw);aspect-ratio:1;
  border:1px solid rgba(200,154,69,.24);
}
.hero::before{
  content:"";position:absolute;right:2%;bottom:-38%;width:min(480px,52vw);aspect-ratio:1;
  border:1px solid rgba(200,154,69,.14);
}
.hero-in{position:relative;z-index:2;max-width:900px}
}
.hero h1{color:#fff;font-weight:300}
.hero h1 em{font-style:italic;color:var(--gold-lt)}
.hero .rule{width:70px;height:1px;background:var(--gold);margin:2.2rem 0}
.hero p{color:#BDCADA;font-size:clamp(1.06rem,1.7vw,1.24rem);max-width:60ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2.8rem}
.tagline-strip{
  border-top:1px solid rgba(255,255,255,.12);
  margin-top:clamp(48px,7vw,84px);padding-top:1.6rem;
  display:flex;flex-wrap:wrap;gap:.5rem 2.6rem;
  font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:#93A5BA;font-weight:600;
}

/* ── sections ─────────────────────────── */
.band{padding:var(--band) 0}
.band-paper2{background:var(--paper-2)}
.band-navy{background:var(--navy);color:#fff}
.band-navy h2,.band-navy h3{color:#fff}
.band-navy p{color:#B9C6D6}
.band-tight{padding:clamp(44px,6vw,72px) 0}
.sec-head{max-width:760px;margin-bottom:clamp(38px,5vw,58px)}
.sec-head h2{margin-bottom:1.1rem}

/* service cards with closing frame */
.grid{display:grid;gap:1px;background:var(--rule-soft);border:1px solid var(--rule-soft)}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
.card{
  background:var(--paper);padding:clamp(28px,3.4vw,44px);position:relative;
  transition:background .3s ease;display:flex;flex-direction:column;
}
.band-paper2 .card{background:var(--paper-2)}
.card::before,.card::after{
  content:"";position:absolute;background:var(--gold);transition:transform .45s cubic-bezier(.22,.61,.36,1);
}
.card::before{left:0;top:0;width:100%;height:2px;transform:scaleX(0);transform-origin:left}
.card::after{left:0;top:0;width:2px;height:100%;transform:scaleY(0);transform-origin:top}
.card:hover::before{transform:scaleX(1)}
.card:hover::after{transform:scaleY(1)}
a.card:hover{background:#fff}
.card .num{
  font-family:var(--display);font-size:.95rem;color:var(--gold-ink);letter-spacing:.1em;
  display:block;margin-bottom:1.1rem;
}
.card h3{margin-bottom:.7rem}
.card p{color:var(--muted);font-size:.98rem}
.card .more{
  margin-top:auto;padding-top:1.6rem;
  font-size:.68rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--navy);
}
a.card:hover .more{color:var(--gold-ink)}

/* value list */
.vlist{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(30px,3.6vw,52px)}
.vitem{border-top:1px solid var(--rule);padding-top:1.5rem}
.band-navy .vitem{border-top-color:rgba(255,255,255,.18)}
.vitem h3{font-size:1.32rem;margin-bottom:.55rem}
.vitem p{color:var(--muted);font-size:.97rem}
.band-navy .vitem p{color:#AEBDCE}

/* coverage chips */
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{
  border:1px solid var(--rule);padding:.62rem 1.05rem;
  font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--navy);
  background:var(--paper);transition:.25s ease;
}
.band-paper2 .chip{background:#fff}
a.chip{cursor:pointer}
a.chip:hover,a.chip:focus-visible{border-color:var(--gold);color:var(--gold-ink);background:#fff}
a.chip::after{content:" \2192";opacity:0;margin-left:-.7em;transition:opacity .25s ease,margin .25s ease}
a.chip:hover::after{opacity:.75;margin-left:.15em}
.band-navy .chip{background:transparent;border-color:rgba(255,255,255,.2);color:#DCE5EF}
.band-navy a.chip:hover,.band-navy a.chip:focus-visible{border-color:var(--gold-lt);color:var(--gold-lt)}

/* quote */
.quote{
  border-left:2px solid var(--gold);padding-left:clamp(24px,3.4vw,44px);
  max-width:820px;
}
.quote blockquote{font-family:var(--display);font-size:clamp(1.5rem,3vw,2.3rem);line-height:1.34;font-weight:300}
.quote cite{
  display:block;margin-top:1.5rem;font-family:var(--body);font-style:normal;
  font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-ink);font-weight:600;
}

/* split */
.split{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:clamp(36px,6vw,88px);align-items:start}
.split-even{grid-template-columns:1fr 1fr}
.stat-frame{
  border:1px solid var(--gold);padding:clamp(28px,3.4vw,44px);
}
.band-navy .stat-frame{border-color:rgba(200,154,69,.5)}
.stat-frame .big{font-family:var(--display);font-size:clamp(3.4rem,7vw,5.4rem);line-height:.95;color:var(--navy)}
.band-navy .stat-frame .big{color:#fff}
.stat-frame .lbl{
  margin-top:1rem;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);font-weight:600;
}
.band-navy .stat-frame .lbl{color:#AEBDCE}

/* Data request form — producer-shared, unlisted */
.drnote{
  border:1px solid var(--gold);border-left:3px solid var(--gold);
  background:#fff;padding:1.15rem 1.3rem;margin-bottom:2rem;
  font-size:.95rem;color:var(--muted);line-height:1.7;
}
.uploads{display:grid;gap:1px;background:var(--rule-soft);border:1px solid var(--rule-soft);margin-bottom:1.6rem}
.upl{background:#fff;padding:1.05rem 1.2rem;display:grid;grid-template-columns:minmax(0,1fr);gap:.55rem}
.upl label{
  font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;
  font-weight:600;color:var(--navy);margin:0;
}
.upl .hintline{font-size:.82rem;color:var(--muted);margin:-.2rem 0 .1rem}
.upl input[type=file]{
  width:100%;padding:.7rem;border:1px dashed var(--rule);background:var(--paper);
  font-size:.88rem;color:var(--muted);cursor:pointer;
}
.upl input[type=file]:hover{border-color:var(--gold)}
@media (min-width:760px){
  .upl{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);align-items:center;gap:1.4rem}
  .upl .stack{display:grid;gap:.2rem}
}

/* Careers — role accordions.
   Mobile-first: the job TITLE is the loudest thing on the row, with
   department and employment type as separate pills underneath, and an
   explicit "View details" affordance so the row reads as tappable. */
.roles{display:grid;gap:1px;background:var(--rule-soft);border:1px solid var(--rule-soft)}
.role{background:var(--paper)}
.band-paper2 .role{background:var(--paper-2)}

.role summary{
  list-style:none;cursor:pointer;
  padding:clamp(22px,2.8vw,30px);
  transition:background .25s ease;
  position:relative;
}
.role summary::-webkit-details-marker{display:none}
.role summary::marker{content:""}
.role summary:hover{background:#fff}
.role[open] summary{background:#fff}

.role-n{
  display:block;
  font-family:var(--body);font-size:.62rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--gold-ink);font-weight:600;
  margin-bottom:.7rem;
}
.role-title{
  display:block;font-family:var(--display);
  font-size:clamp(1.35rem,4.6vw,1.6rem);line-height:1.2;
  color:var(--navy);margin-bottom:.9rem;
  padding-right:2rem;
}
.role-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:1rem}
.role-tag{
  display:inline-block;border:1px solid var(--rule);
  padding:.4rem .75rem;font-size:.64rem;letter-spacing:.14em;
  text-transform:uppercase;font-weight:600;color:var(--muted);background:#fff;
}
.role-tag.dept{border-color:var(--gold);color:var(--gold-ink)}
.role-open{
  display:inline-flex;align-items:center;gap:.5em;
  font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;
  font-weight:600;color:var(--navy);
}
.role-open::after{
  content:"";width:8px;height:8px;flex:0 0 auto;
  border-right:1.5px solid var(--gold);border-bottom:1.5px solid var(--gold);
  transform:rotate(45deg) translate(-1px,-1px);transition:transform .3s ease;
}
.role[open] .role-open::after{transform:rotate(-135deg) translate(-2px,-2px)}
.role[open] .role-open .lbl-closed{display:none}
.role-open .lbl-open{display:none}
.role[open] .role-open .lbl-open{display:inline}

.role-body{
  padding:0 clamp(22px,2.8vw,30px) clamp(26px,3vw,34px);
  background:#fff;border-top:1px solid var(--rule-soft);
}
.role-body p{color:var(--muted);font-size:1rem;line-height:1.7;margin-bottom:1rem;max-width:70ch}
.role-body p:first-child{margin-top:1.4rem}
.role-body h4{
  font-family:var(--body);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--navy);font-weight:600;margin:1.8rem 0 .9rem;
  padding-bottom:.6rem;border-bottom:1px solid var(--rule-soft);
}
.role-body .checks li{font-size:.98rem}

@media (min-width:760px){
  .role-title{font-size:1.55rem;margin-bottom:.8rem}
  .role summary{padding-right:clamp(22px,2.8vw,30px)}
}

/* Careers — beliefs */
.beliefs{display:grid;gap:1.6rem 3rem;grid-template-columns:repeat(2,1fr)}
.belief{border-top:1px solid rgba(255,255,255,.18);padding-top:1.3rem}
.belief strong{display:block;font-family:var(--display);font-size:1.3rem;font-weight:400;color:#fff;margin-bottom:.4rem}
.belief span{color:#AEBDCE;font-size:.97rem;line-height:1.65}
@media (max-width:820px){.beliefs{grid-template-columns:1fr}}


/* SMS opt-in consent block */
.smsopt{
  border:1px solid var(--rule);border-left:2px solid var(--gold);
  background:#fff;padding:1.1rem 1.2rem;margin-bottom:1.4rem;
}
.smsopt .opt{align-items:flex-start;font-size:.88rem;line-height:1.62;color:var(--muted)}
.smsopt .opt input{margin-top:.2rem}
.smsopt a{color:var(--gold-ink);border-bottom:1px solid var(--rule)}
.smsopt a:hover{border-color:var(--gold)}
.smsopt .optional{
  display:block;font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold-ink);font-weight:600;margin-bottom:.7rem;
}

/* Legal pages */
.legal h2{font-size:clamp(1.3rem,2.2vw,1.7rem);margin:2.6rem 0 .9rem}
.legal h2:first-of-type{margin-top:0}
.legal h3{font-size:1.05rem;font-family:var(--body);font-weight:600;color:var(--navy);margin:1.5rem 0 .5rem}
.legal p,.legal li{color:var(--muted);font-size:1rem;line-height:1.7}
.legal p{margin-bottom:1rem;max-width:72ch}
.legal ul{margin:0 0 1.2rem 1.1rem;display:grid;gap:.5rem}
.legal li{padding-left:.3rem}
.legal a{color:var(--gold-ink);border-bottom:1px solid var(--rule)}
.legal a:hover{border-color:var(--gold)}
.legal .updated{
  font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold-ink);font-weight:600;margin-bottom:2.4rem;
  padding-bottom:1.2rem;border-bottom:1px solid var(--rule);
}
.legal .contact-block{
  background:var(--paper-2);border-top:2px solid var(--gold);
  padding:clamp(22px,3vw,32px);margin-top:2.4rem;
}
.legal .contact-block p{margin-bottom:.4rem}


/* Employment application form */
.appform fieldset{border:none;padding:0;margin:0 0 clamp(34px,4.5vw,56px)}
.appform legend{
  display:block;width:100%;padding:0 0 .9rem;margin-bottom:1.8rem;
  border-bottom:1px solid var(--rule);
  font-family:var(--display);font-size:clamp(1.35rem,2.4vw,1.8rem);color:var(--navy);
}
.appform legend .step{
  display:block;font-family:var(--body);font-size:.64rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--gold-ink);font-weight:600;margin-bottom:.5rem;
}
.appform .hint{font-size:.9rem;color:var(--muted);margin:-.9rem 0 1.6rem}
.subhead{
  font-family:var(--body);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--navy);font-weight:600;margin:2rem 0 1.1rem;
}
.f3{display:grid;grid-template-columns:2fr 1fr 1fr;gap:0 1.4rem}
.opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem 1.4rem;margin-top:.2rem}
.opts.one{grid-template-columns:1fr}
.opt{display:flex;align-items:flex-start;gap:.65rem;font-size:.97rem;color:var(--ink);cursor:pointer}
.opt input{
  width:17px;height:17px;margin-top:.25rem;flex:0 0 auto;
  accent-color:var(--gold-ink);cursor:pointer;
}
.yn{display:flex;gap:1.6rem;flex-wrap:wrap}
.notice{
  border-left:2px solid var(--gold);padding:1.1rem 0 1.1rem 1.3rem;
  margin:1.6rem 0;font-size:.94rem;color:var(--muted);line-height:1.7;
}
.certify{background:var(--paper-2);padding:clamp(22px,3vw,32px);border-top:2px solid var(--gold);margin-bottom:2rem}
.certify p{font-size:.9rem;color:var(--muted);margin-bottom:.9rem;line-height:1.7}
.filefield input[type=file]{
  width:100%;padding:.85rem;border:1px dashed var(--rule);background:#fff;
  font-size:.92rem;color:var(--muted);cursor:pointer;
}
.filefield input[type=file]:hover{border-color:var(--gold)}
@media (max-width:620px){
  .f3,.opts{grid-template-columns:1fr}
}

/* Social icons */
.social{display:flex;gap:.75rem;margin-top:1.6rem}
.social a{
  width:42px;height:42px;display:flex;align-items:center;justify-content:center;
  border:1px solid var(--rule);color:var(--navy);
  transition:background .25s ease,border-color .25s ease,color .25s ease;
}
.social a:hover{background:var(--navy);border-color:var(--navy);color:#fff}
.social svg{width:18px;height:18px;fill:currentColor;display:block}

/* Sticky mobile action bar — on a phone the CTA is otherwise a long scroll away */
.actionbar{display:none}
@media (max-width:820px){
  .actionbar{
    display:grid;grid-template-columns:repeat(3,1fr);
    position:fixed;left:0;right:0;bottom:0;z-index:70;
    background:rgba(6,20,38,.97);backdrop-filter:saturate(180%) blur(8px);
    border-top:1px solid rgba(200,154,69,.45);
    padding-bottom:env(safe-area-inset-bottom);
  }
  .actionbar a{
    display:flex;align-items:center;justify-content:center;gap:.5em;
    padding:1.05rem .5rem;color:#fff;
    font-size:.7rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  }
  .actionbar a+a{border-left:1px solid rgba(255,255,255,.16)}
  .actionbar a.primary{background:var(--gold-lt);color:var(--navy)}
  body{padding-bottom:64px}
  body.menu-open .actionbar{display:none}
}

/* Calendly booking panel */
.book{
  border:1px solid var(--gold);border-top:3px solid var(--gold);
  padding:clamp(26px,3.2vw,40px);background:#fff;
}
.book .k{font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-ink);font-weight:600;margin-bottom:.9rem}
.book h3{margin-bottom:.7rem}
.book p{color:var(--muted);font-size:.98rem;margin-bottom:1.7rem}
.btn-cal{background:var(--gold-ink);border-color:var(--gold-ink);color:#fff}
.btn-cal:hover{background:var(--navy);border-color:var(--navy);color:#fff}
.book-note{display:block;margin-top:.9rem;font-size:.8rem;color:var(--muted)}
.cta-actions{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}
@media (max-width:620px){
  .cta-actions{flex-direction:column}
  .cta-actions .btn,.btn-cal{width:100%;justify-content:center}
}

/* "Why clients hire us" — numbered reason blocks */
.reasons{counter-reset:r;display:grid;gap:1px;background:var(--rule-soft);border:1px solid var(--rule-soft)}
.reason{
  background:var(--paper);padding:clamp(28px,3.6vw,48px);
  display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(20px,3vw,44px);align-items:start;
  position:relative;transition:background .3s ease;
}
.band-paper2 .reason{background:var(--paper-2)}
.reason:hover{background:#fff}
.reason::before{
  counter-increment:r;content:counter(r,decimal-leading-zero);
  font-family:var(--display);font-size:clamp(1.6rem,2.6vw,2.2rem);
  color:var(--gold-ink);line-height:1;padding-top:.15em;
  min-width:2.2ch;
}
.reason::after{
  content:"";position:absolute;left:0;top:0;width:2px;height:100%;
  background:var(--gold);transform:scaleY(0);transform-origin:top;
  transition:transform .45s cubic-bezier(.22,.61,.36,1);
}
.reason:hover::after{transform:scaleY(1)}
.reason h3{margin-bottom:.85rem}
.reason .kicker{
  display:block;font-family:var(--body);font-size:1.02rem;
  color:var(--navy);font-weight:600;margin-bottom:.75rem;line-height:1.6;
}
.reason p{color:var(--muted);font-size:1rem;max-width:64ch}
@media (max-width:620px){
  .reason{grid-template-columns:1fr;gap:.6rem}
  .reason::before{padding-top:0}
}

/* portrait — image sits inside the offset gold square from the mark */
.portrait{
  --off:clamp(12px,1.8vw,26px);
  position:relative;margin:0 0 var(--off) 0;
}
.portrait::before{
  content:"";position:absolute;z-index:1;
  top:var(--off);right:var(--off);bottom:calc(-1 * var(--off));left:calc(-1 * var(--off));
  border:1px solid var(--gold);
}
.portrait img{
  position:relative;z-index:2;width:100%;height:auto;
  background:var(--navy);
}
.portrait figcaption{
  position:relative;z-index:2;
  margin-top:calc(var(--off) + 1.3rem);
  padding-top:1.1rem;border-top:1px solid var(--rule);
}
.portrait .p-name{font-family:var(--display);font-size:1.5rem;line-height:1.2}
.portrait .p-role{
  margin-top:.35rem;font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gold-ink);font-weight:600;
}
@media (max-width:980px){
  .portrait{max-width:420px}
}

/* timeline for career */
.tl{border-left:1px solid var(--rule);padding-left:clamp(24px,3vw,40px);display:grid;gap:2.4rem}
.tl-item{position:relative}
.tl-item::before{
  content:"";position:absolute;left:calc(-1 * clamp(24px,3vw,40px) - 4px);top:.55rem;
  width:7px;height:7px;background:var(--gold);
}
.tl-item .yr{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-ink);font-weight:600;margin-bottom:.35rem}
.tl-item h3{font-size:1.3rem;margin-bottom:.45rem}
.tl-item p{color:var(--muted);font-size:.98rem}

/* checklist */
.checks{display:grid;grid-template-columns:repeat(2,1fr);gap:.9rem 2.2rem;list-style:none}
.checks li{position:relative;padding-left:1.5rem;font-size:1rem;color:var(--muted)}
.checks li::before{content:"";position:absolute;left:0;top:.72em;width:8px;height:1px;background:var(--gold)}
.band-navy .checks li{color:#C4D0DE}

/* CTA band */
.cta-band{background:var(--navy-deep);color:#fff;text-align:center;position:relative;overflow:hidden}
.cta-band .inner{position:relative;z-index:2;max-width:720px;margin:0 auto}
.cta-band h2{color:#fff;font-weight:300;margin-bottom:1.2rem}
.cta-band p{color:#B9C6D6;margin-bottom:2.4rem}

/* contact */
.field{margin-bottom:1.4rem}
.field label{
  display:block;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;
  font-weight:600;color:var(--muted);margin-bottom:.5rem;
}
.field input,.field select,.field textarea{
  width:100%;padding:.9rem 1rem;font:inherit;font-size:.98rem;
  border:1px solid var(--rule);background:#fff;color:var(--ink);border-radius:0;
  transition:border-color .2s;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--gold);outline:none}
.field textarea{min-height:150px;resize:vertical}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:0 1.4rem}
.form-note{font-size:.86rem;color:var(--muted);margin-top:1rem}
.contact-panel{background:var(--paper-2);padding:clamp(28px,3.6vw,44px);border-top:2px solid var(--gold)}
.contact-panel .row{padding:1.1rem 0;border-bottom:1px solid var(--rule)}
.contact-panel .row:last-child{border-bottom:none}
.contact-panel .k{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-ink);font-weight:600;margin-bottom:.3rem}
.contact-panel .v{font-size:1.02rem}
.contact-panel a.v:hover{color:var(--gold)}

/* resources */
.res{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--rule-soft);border:1px solid var(--rule-soft)}
.res-item{background:var(--paper);padding:clamp(24px,3vw,36px);transition:background .25s}
.res-item:hover{background:#fff}
.res-item h3{font-size:1.25rem;margin-bottom:.4rem}
.res-item p{color:var(--muted);font-size:.95rem}

/* footer */
.ftr{background:var(--paper-2);border-top:1px solid var(--rule);padding:clamp(56px,7vw,86px) 0 2.4rem}
.ftr-grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:clamp(30px,4vw,56px)}
.ftr img{height:52px;width:auto;margin-bottom:1.4rem}
.ftr p{color:var(--muted);font-size:.94rem;max-width:44ch}
.ftr h4{
  font-family:var(--body);font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gold-ink);font-weight:600;margin-bottom:1.1rem;
}
.ftr ul{list-style:none;display:grid;gap:.6rem}
.ftr ul a{font-size:.95rem;color:var(--muted);transition:color .2s}
.ftr ul a:hover{color:var(--navy)}
.ftr-btm a{transition:color .2s}
.ftr-btm a:hover{color:var(--gold-ink)}
.ftr-btm{
  margin-top:clamp(40px,5vw,64px);padding-top:1.6rem;border-top:1px solid var(--rule);
  display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;
  font-size:.8rem;color:var(--muted);
}

/* reveal on scroll */
.rv{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s cubic-bezier(.22,.61,.36,1)}
.rv.in{opacity:1;transform:none}

/* ── responsive ───────────────────────── */
@media (max-width:980px){
  .g3{grid-template-columns:repeat(2,1fr)}
  .vlist{grid-template-columns:repeat(2,1fr)}
  .split,.split-even{grid-template-columns:1fr;gap:2.6rem}
  .ftr-grid{grid-template-columns:1fr 1fr}
}
/* Header width budget, shed in order of least value:
   1. the CTA button (the phone is the stronger call to action)
   2. the phone (still in the drawer, footer and mobile bar)
   3. the whole nav -> drawer                                    */
@media (max-width:1400px){ .hdr-cta .btn{display:none} }
@media (max-width:1180px){ .hdr-phone{display:none} }
@media (max-width:1020px){
  .nav{display:none}
  .hdr-phone{display:flex}
  .burger{display:block}
}
@media (max-width:820px){
  .hdr-phone{display:none}
  .hdr-in{height:78px}
  .drawer{top:78px}
  .brand img{height:36px}
}
@media (max-width:620px){
  body{font-size:16px}
  .g3,.g2,.vlist,.res,.checks,.field-row{grid-template-columns:1fr}
  .ftr-grid{grid-template-columns:1fr}
  .hero-actions .btn{width:100%;justify-content:center}
}
@media print{
  .hdr,.drawer,.skip,.cta-band,.btn{display:none!important}
  .page{display:block!important}
  body{background:#fff;color:#000;font-size:11pt}
  .hero,.band-navy{background:#fff!important;color:#000!important}
  .hero h1,.band-navy h2,.band-navy h3,.hero p,.band-navy p{color:#000!important}
  .band{padding:18pt 0}
  a[href^="#"]::after{content:""}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
  .rv{opacity:1;transform:none}
}