:root{
  /* sampled from the logo: brand green #166339 */
  --navy:#123D25;          /* ink and dark bands (deep brand green) */
  --navy-2:#2E5540;
  --slate:#5D7166;
  --green:#166339;         /* the brand green itself */
  --green-hi:#1D7D48;
  --green-dk:#0D3F23;
  --green-lt:#E9F2EC;
  --gold:#B5822E;          /* decorative rules and slashes */
  --gold-hi:#CE9A44;       /* gold used behind dark text */
  --gold-dk:#7E5A1C;       /* gold at text sizes */
  --gold-lt:#F7F0E2;
  --gold-on-dark:#DDB165;
  /* the rates band: the brand green itself, lighter than the ink green, so
     the strip reads as a bright band rather than another dark slab */
  --band:#166339;
  --blue:#0E5230;          /* links */
  --paper:#F4F7F5;
  --white:#FFFFFF;
  --line:#DBE3DE;
  --line-2:#E9EFEB;
  --ok:#166339;
  --shadow-sm:0 1px 2px rgba(18,61,37,.07);
  --shadow:0 2px 4px rgba(18,61,37,.06), 0 12px 28px -18px rgba(18,61,37,.32);
  --maxw:1180px;
}
*{box-sizing:border-box}
/* a class that sets `display` beats the browser's own [hidden] rule, so state it
   explicitly — without this every dropdown renders open at once */
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{
  margin:0;background:var(--white);color:var(--navy);
  font-family:"Source Sans 3",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;
  -webkit-tap-highlight-color:rgba(12,36,72,.14);
}
/* safe-area gutters: respects the notch in landscape and the home indicator */
.wrap,.hdr,.alert-in,.trust-in{
  padding-left:max(28px, env(safe-area-inset-left));
  padding-right:max(28px, env(safe-area-inset-right));
}
.foot-legal{padding-bottom:calc(40px + env(safe-area-inset-bottom))}
h1,h2,h3,h4{font-family:Montserrat,"Segoe UI",Helvetica,Arial,sans-serif;margin:0;text-wrap:balance;letter-spacing:-.005em}
p{margin:0}
img{max-width:100%}
a{color:var(--blue)}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
.eyebrow{font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-dk);font-family:"Source Sans 3",sans-serif}
.skip{position:absolute;left:-9999px;top:0;background:var(--navy);color:#fff;padding:10px 16px;z-index:100}
.skip:focus{left:8px;top:8px}
:focus-visible{outline:3px solid var(--gold-dk);outline-offset:2px;border-radius:3px}


/* alert bar — replaces the blocking modal */
.alert{background:var(--gold-lt);border-bottom:1px solid #E7DBC0}
.alert-in{display:flex;gap:14px;align-items:flex-start;padding:11px 0;max-width:var(--maxw);margin:0 auto;padding-left:28px;padding-right:28px}
.alert svg{flex:0 0 auto;margin-top:2px}
.alert p{font-size:.86rem;color:var(--navy);line-height:1.5}
.alert a{color:var(--navy);font-weight:700}
.alert button{
  margin-left:auto;flex:0 0 auto;background:none;border:none;cursor:pointer;
  color:var(--navy);font-size:1.1rem;line-height:1;padding:4px 6px;border-radius:4px;font-family:inherit;
}
.alert button:hover{background:#EDE2CB}

/* header */
header.site{position:sticky;top:0;z-index:40;background:var(--white);border-bottom:1px solid var(--line)}
.hdr{display:flex;align-items:center;gap:20px;padding:10px 0;max-width:var(--maxw);margin:0 auto;padding-left:28px;padding-right:28px}
.logo{display:inline-flex;text-decoration:none;line-height:0}
.logo img{display:block;width:111px;height:60px}
nav.main{display:flex;gap:2px;margin-left:0}

/* ---- nav dropdowns ---- */
.navitem{position:relative}
.navtop{
  display:inline-flex;align-items:center;gap:6px;background:none;border:none;cursor:pointer;
  font-family:"Source Sans 3",sans-serif;font-size:.93rem;font-weight:600;color:var(--navy);
  padding:8px 10px;border-bottom:2px solid transparent;line-height:1.2;
}
.navtop:hover{border-bottom-color:var(--gold)}
.navtop[data-current="true"]{border-bottom-color:var(--gold)}
.navtop svg{transition:transform .15s ease}
.navtop[aria-expanded="true"]{border-bottom-color:var(--gold)}
.navtop[aria-expanded="true"] svg{transform:rotate(180deg)}
.dd{
  position:absolute;left:0;top:calc(100% + 10px);z-index:60;min-width:310px;
  background:var(--white);border:1px solid var(--line);border-radius:6px;
  box-shadow:var(--shadow);padding:8px;display:flex;flex-direction:column;
}
.dd a{
  display:flex;flex-direction:column;gap:1px;padding:10px 12px;border-radius:4px;
  text-decoration:none;color:var(--navy);
}
.dd a:hover{background:var(--paper)}
.dd a[aria-current="page"]{background:var(--gold-lt);box-shadow:inset 3px 0 0 var(--gold)}
.dd b{font-size:.92rem;font-weight:700}
.dd span{font-size:.79rem;color:var(--slate);line-height:1.4}

/* ---- mobile accordion ---- */
.mobgroup{display:flex;flex-direction:column}
.mobtop{
  display:flex;align-items:center;justify-content:space-between;width:100%;
  background:none;border:none;border-bottom:1px solid var(--line-2);cursor:pointer;
  font-family:"Source Sans 3",sans-serif;font-size:1.02rem;font-weight:600;color:var(--navy);
  min-height:54px;padding:0;text-align:left;
}
.mobtop svg{transition:transform .18s ease;color:var(--gold-dk);flex:0 0 auto}
.mobtop[aria-expanded="true"] svg{transform:rotate(180deg)}
.mobsub{display:flex;flex-direction:column;padding:2px 0 10px 14px;border-left:2px solid var(--gold-lt);margin:6px 0 8px}
.mobsub a{
  min-height:46px;font-size:.95rem;font-weight:400;color:var(--navy-2);
  border-bottom:none;padding-left:8px;
}
.mobsub a[aria-current="page"]{color:var(--navy);font-weight:700}
nav.main a{
  color:var(--navy);text-decoration:none;font-size:.93rem;font-weight:600;
  padding:6px 0;border-bottom:2px solid transparent;
}
nav.main a:hover{border-bottom-color:var(--gold);color:var(--navy)}
.hdr-actions{margin-left:auto;display:flex;align-items:center;gap:12px}
.burger{
  display:none;width:44px;height:44px;align-items:center;justify-content:center;
  background:transparent;border:2px solid var(--line);border-radius:3px;cursor:pointer;padding:0;
}
.burger:hover{border-color:var(--navy)}
.burger span{display:block;width:19px;height:2px;background:var(--navy);position:relative}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:19px;height:2px;background:var(--navy)}
.burger span::before{top:-6px}
.burger span::after{top:6px}
.burger[aria-expanded="true"] span{background:transparent}
.burger[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
.burger[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}

/* mobile menu panel */
.mobnav{display:none;border-top:1px solid var(--line);background:var(--white)}
.mobnav[data-open="true"]{display:block}
.mobnav ul{list-style:none;margin:0;padding:6px max(20px, env(safe-area-inset-left)) 18px}
.mobnav a{
  display:flex;align-items:center;min-height:52px;color:var(--navy);
  text-decoration:none;font-weight:600;font-size:1.02rem;border-bottom:1px solid var(--line-2);
}
.mobnav a:last-child{border-bottom:none}
.mobnav .mob-cta{padding:14px max(20px, env(safe-area-inset-left)) 6px}
.mobnav .mob-cta .btn{width:100%;justify-content:center;min-height:52px}
.btn{
  display:inline-flex;align-items:center;gap:8px;font-family:"Source Sans 3",sans-serif;
  font-weight:700;font-size:.9rem;text-decoration:none;border-radius:3px;
  padding:11px 20px;border:2px solid transparent;cursor:pointer;line-height:1.2;white-space:nowrap;
}
.btn-primary{background:var(--green);color:#fff;border-color:var(--green)}
.btn-primary:hover{background:var(--green-hi);border-color:var(--green-hi)}
.btn-ghost{background:transparent;color:var(--navy);border-color:var(--line)}
.btn-ghost:hover{border-color:var(--navy)}
.btn-lg{padding:15px 26px;font-size:1rem}
.btn-white{background:transparent;color:var(--navy);border-color:var(--navy)}
.btn-white:hover{background:var(--navy);color:#fff}

/* login chooser */
.login-wrap{position:relative}
.login-panel{
  position:absolute;right:0;top:calc(100% + 12px);width:330px;background:var(--white);
  border:1px solid var(--line);border-radius:6px;box-shadow:var(--shadow);padding:8px;z-index:50;
}
.login-panel h3{font-size:.78rem;font-family:"Source Sans 3",sans-serif;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--slate);padding:10px 12px 6px}
.login-row{display:flex;flex-direction:column;gap:1px;padding:9px 12px;border-radius:4px}
.login-row:hover{background:var(--paper)}
.login-row b{font-size:.9rem;color:var(--navy);font-weight:700}
.login-row span{font-size:.78rem;color:var(--slate)}
.login-sep{height:1px;background:var(--line-2);margin:6px 12px}

/* hero — full-bleed photograph with the copy over a brand-green scrim */
.hero{
  position:relative;isolation:isolate;overflow:hidden;background:var(--navy);
  min-height:clamp(430px,56vh,580px);display:flex;align-items:center;
}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:64% 42%;display:block}
/* the scrim is what makes the text legible over sand and sky; without it the
   headline sits on a near-white background and fails contrast outright */
.hero-scrim{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(100deg,
    rgba(17,74,44,.95) 0%,
    rgba(18,80,47,.94) 34%,
    rgba(20,87,51,.90) 49%,
    rgba(21,94,55,.34) 57%,
    rgba(22,99,57,.09) 65%,
    rgba(22,99,57,0)   73%);
}
.hero-copy{
  position:relative;z-index:2;width:100%;max-width:var(--maxw);margin:0 auto;
  padding:62px max(28px, env(safe-area-inset-right)) 62px max(28px, env(safe-area-inset-left));
}
.hero-inner{max-width:34rem}
.hero .eyebrow{color:#F8D9A8}
.hero h1{
  font-size:clamp(2rem,3.7vw,2.95rem);font-weight:800;line-height:1.1;
  letter-spacing:-.015em;color:#fff;margin-top:10px;
}
.hero .sub{margin-top:18px;font-size:1.06rem;color:#EAF3EE;max-width:34em;line-height:1.65}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px;align-items:center}
.hero-note{font-size:.8rem;color:#DAE8E0;margin-top:16px;max-width:44ch}
.hero-note a{color:#FFFFFF}
.hero .btn-primary{background:var(--gold-hi);color:var(--navy);border-color:var(--gold-hi)}
.hero .btn-primary:hover{background:var(--gold-on-dark);border-color:var(--gold-on-dark)}
.hero .btn-white{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.hero .btn-white:hover{background:#fff;color:var(--navy);border-color:#fff}

/* trust row */
.trust{border-top:1px solid var(--line);background:var(--white)}
.trust-in{display:flex;flex-wrap:wrap;gap:28px;align-items:center;padding:16px 28px;max-width:var(--maxw);margin:0 auto}
.trust-item{display:flex;align-items:center;gap:9px;font-size:.79rem;color:var(--slate);font-weight:600}

/* rates */
.rates{background:var(--band);color:#fff;padding:42px 0}
.rates-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:14px;margin-bottom:22px}
.rates-head h2{font-size:1.5rem;color:#fff;font-weight:700}
.tag{
  font-size:.64rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  padding:3px 8px;border-radius:99px;background:rgba(255,255,255,.13);color:#fff;
}
.rates-head .when{margin-left:auto;font-size:.8rem;color:#CFE0D5}
.rate-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px}
.rate{background:#1B6B41;border:1px solid #2C8A55;border-radius:6px;padding:20px;display:flex;flex-direction:column;gap:4px}
.rate .n{font-family:Montserrat,sans-serif;font-size:1.9rem;font-weight:700;line-height:1;color:#fff;font-variant-numeric:tabular-nums}
.rate .l{font-size:.86rem;color:#DCE9E1;font-weight:600}
.rate .m{font-size:.75rem;color:#CFE0D5}
.rates-foot{margin-top:18px;font-size:.78rem;color:#CFE0D5}
.rates-foot a{color:#EAF4EE}

/* sections */
section.band{padding:64px 0}
/* long legal prose: a narrow measure and generous leading, because these
   paragraphs are much longer than anything else on the site */
.legal{max-width:44rem}
.legal h2{
  font-size:1.12rem;font-weight:700;color:var(--navy);
  margin:34px 0 10px;line-height:1.35;
}
.legal h2:first-child{margin-top:0}
.legal p{margin-bottom:16px;color:var(--slate);line-height:1.75}
.legal p:last-child{margin-bottom:0}
.legal a{color:var(--blue)}
.legal .bullets{margin:0 0 16px;padding-left:20px}
.legal .bullets li{color:var(--slate);line-height:1.75;margin-bottom:12px}
.legal .bullets li::marker{color:var(--gold-dk)}
.legal .bullets li:last-child{margin-bottom:0}
.pagehead-sm{padding-bottom:34px}
section[id],footer[id]{scroll-margin-top:104px}
.band-alt{background:var(--paper)}
.sec-head{max-width:640px;display:flex;flex-direction:column;gap:10px;margin-bottom:34px}
.sec-head h2{font-size:clamp(1.55rem,2.6vw,2.1rem);font-weight:700;line-height:1.22}
.sec-head p{color:var(--navy-2);font-size:1rem}

.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.card{
  background:var(--white);border:1px solid var(--line);border-radius:6px;padding:28px 26px 26px;
  display:flex;flex-direction:column;gap:12px;box-shadow:var(--shadow-sm);
  border-top:3px solid var(--gold);
}
.card .ico{color:var(--green)}
.card h3{font-size:1.16rem;font-weight:700;line-height:1.3}
.card p{font-size:.93rem;color:var(--navy-2);flex:1}
.card ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:5px}
.card li{font-size:.9rem;color:var(--navy-2)}
.link{
  display:inline-flex;align-items:center;gap:7px;font-weight:700;font-size:.9rem;
  color:var(--navy);text-decoration:none;border-bottom:2px solid var(--gold-lt);
  padding-bottom:2px;align-self:flex-start;
}
.link:hover{border-bottom-color:var(--gold)}
.link svg{transition:transform .15s ease}
.link:hover svg{transform:translateX(3px)}

/* split feature */
.split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.split-media{border-radius:6px;overflow:hidden;background:var(--line-2);aspect-ratio:16/9;position:relative}
.split-media img{width:100%;height:100%;object-fit:cover;display:block}
.feat-list{display:flex;flex-direction:column;gap:0;margin-top:6px}
.feat{display:grid;grid-template-columns:32px 1fr;gap:14px;padding:15px 0;border-top:1px solid var(--line)}
.feat:first-child{border-top:none}
.feat .ico{color:var(--green);padding-top:2px}
.feat b{display:block;font-size:.98rem;margin-bottom:2px}
.feat span{font-size:.9rem;color:var(--navy-2)}

/* branch card */
.branch-card{
  background:var(--white);border:1px solid var(--line);border-radius:6px;
  padding:26px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:16px;
}
.branch-head{display:flex;flex-direction:column;gap:3px}
.branch-head h3{font-size:1.2rem;font-weight:700}
.branch-head span{font-size:.85rem;color:var(--slate)}
.branch-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.branch-list li{
  display:flex;gap:16px;align-items:center;justify-content:space-between;
  padding:13px 0;border-top:1px solid var(--line-2);
}
.branch-list li:first-child{border-top:none}
.branch-list b{display:block;font-size:.95rem}
.branch-list span{font-size:.83rem;color:var(--slate)}
.hrs{text-align:right;display:flex;flex-direction:column;gap:1px;flex:0 0 auto}
.hrs .open{color:var(--ok);font-weight:700;font-size:.83rem}
.hrs .shut{color:var(--gold);font-weight:700;font-size:.83rem}
.branch-note{font-size:.79rem;color:var(--slate);line-height:1.5;border-top:1px solid var(--line-2);padding-top:14px}

/* testimonials */
.quote{background:var(--gold-lt);padding:60px 0}
.tcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(272px,1fr));gap:20px}
.tcard{
  margin:0;background:var(--white);border:1px solid #E8DCC3;border-radius:6px;
  padding:24px 26px 22px;display:flex;flex-direction:column;gap:14px;box-shadow:var(--shadow-sm);
}
.tq{font-family:Montserrat,sans-serif;font-size:2.6rem;font-weight:800;line-height:.55;height:.5em;color:var(--gold)}
.tcard blockquote{margin:0;font-size:1rem;line-height:1.62;color:var(--navy);flex:1}
.tcard figcaption{display:flex;align-items:center;gap:13px;border-top:1px solid var(--line-2);padding-top:16px}
.tcard figcaption img{width:52px;height:52px;border-radius:50%;object-fit:cover;display:block;flex:0 0 auto}
.tname{font-weight:700;font-size:.95rem;color:var(--navy);line-height:1.3}
.trole{display:block;font-weight:400;font-size:.82rem;color:var(--slate)}

/* cta band */
.cta-band{background:var(--navy);color:#fff;padding:56px 0}
.cta-in{display:flex;flex-wrap:wrap;gap:28px;align-items:center;justify-content:space-between}
.cta-in h2{font-size:clamp(1.5rem,2.6vw,2rem);color:#fff;font-weight:700;max-width:16em}
.cta-in p{color:#BFD2C7;margin-top:8px;font-size:.95rem}
.btn-onNavy{background:var(--gold-hi);color:var(--navy);border-color:var(--gold-hi)}
.btn-onNavy:hover{background:#DDB165;border-color:#DDB165}
.btn-outline-w{background:transparent;color:#fff;border-color:#4A7A5E}
.btn-outline-w:hover{border-color:#fff}

/* footer */
footer.site{background:#0B2A19;color:#A9C0B2;padding:52px 0 0;font-size:.88rem}
.foot-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:34px;padding-bottom:38px}
.foot-grid h4{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#fff;font-family:"Source Sans 3",sans-serif;font-weight:700;margin-bottom:14px}
.foot-grid ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.foot-grid a{color:#A9C0B2;text-decoration:none}
.foot-grid a:hover{color:#fff;text-decoration:underline}
.foot-brand p{font-size:.86rem;line-height:1.65;max-width:30em;margin-top:14px}
.foot-legal{border-top:1px solid #1D4630;padding:20px 0 40px;display:flex;flex-wrap:wrap;gap:18px;align-items:center;font-size:.78rem}
.foot-legal .badges{display:flex;gap:16px;align-items:center;margin-left:auto}
.foot-legal .badges span{display:flex;align-items:center;gap:7px}


/* between tablet and a roomy desktop the copy column takes up more of the
   width, so the scrim holds further across before it releases the photo */
@media (min-width:901px) and (max-width:1300px){
  .hero-scrim{background:linear-gradient(100deg,
    rgba(17,74,44,.94) 0%, rgba(18,80,47,.92) 38%, rgba(20,87,51,.88) 56%,
    rgba(21,94,55,.40) 65%, rgba(22,99,57,.11) 74%, rgba(22,99,57,0) 83%)}
}
@media (max-width:900px){
  .hero{min-height:0}
  /* the deep bottom padding is deliberate: it leaves a band of open
     photograph below the copy, so the beach is still visible on a phone
     instead of the whole frame disappearing under the scrim */
  .hero-copy{padding-top:46px;padding-bottom:150px}
  /* on a narrow screen there is no room beside the subject, so the scrim
     runs top-to-bottom instead of left-to-right, holding its strength
     until the copy ends and then falling away over the photo band */
  .hero-scrim{background:linear-gradient(180deg,
    rgba(17,74,44,.90) 0%, rgba(18,78,46,.88) 50%,
    rgba(19,84,49,.85) 74%, rgba(20,90,52,.78) 82%,
    rgba(21,95,55,.38) 91%, rgba(22,99,57,.12) 100%)}
  /* on a narrow frame the photo is cropped hard; aim it at the surf line
     rather than the couple, so the band below the copy reads as sea and
     sand instead of a half-cut figure */
  .hero-bg img{object-position:18% 50%}
  .split{grid-template-columns:1fr;gap:28px}
  .foot-grid{grid-template-columns:1fr 1fr}
  .quote-in{grid-template-columns:1fr;gap:8px}
}
/* tablets in portrait are narrow enough to have dropped out of the desktop
   hero, but still wide enough to keep the subject beside the copy rather
   than cropping her out of frame — so put the diagonal scrim back */
@media (min-width:760px) and (max-width:900px){
  .hero{min-height:clamp(430px,52vh,540px)}
  .hero-copy{padding-top:54px;padding-bottom:54px}
  .hero-inner{max-width:28rem}
  .hero-scrim{background:linear-gradient(100deg,
    rgba(17,74,44,.93) 0%, rgba(18,78,46,.92) 40%, rgba(19,84,49,.87) 58%,
    rgba(20,90,52,.46) 67%, rgba(22,99,57,.12) 78%, rgba(22,99,57,0) 88%)}
  .hero-bg img{object-position:62% 40%}
}
@media (max-width:640px){
  .login-panel{
    position:fixed;left:0;right:0;top:auto;width:auto;
    margin:8px max(12px, env(safe-area-inset-left));border-radius:8px;
  }
  .login-row{min-height:52px;justify-content:center}
}
@media (max-width:560px){
  .foot-grid{grid-template-columns:1fr}
  .hdr{gap:12px;padding-top:9px;padding-bottom:9px}
  .logo img{width:96px;height:52px}
  .btn{padding:11px 14px;font-size:.86rem;min-height:44px}
  .trust-in{gap:14px 22px}
  .rates-head .when{margin-left:0;flex-basis:100%}
}
@media (max-width:520px){
  .lbl-full{display:none}
}
@media (max-width:430px){
  .hdr{gap:8px}
  .logo img{width:85px;height:46px}
  .hdr-actions{gap:8px}
  .btn{padding:10px 12px;font-size:.82rem;gap:5px}
  .wrap,.hdr,.alert-in,.trust-in{
    padding-left:max(18px, env(safe-area-inset-left));
    padding-right:max(18px, env(safe-area-inset-right));
  }
  .hero-copy{padding-top:38px;padding-bottom:120px}
  .hero h1{font-size:1.72rem}
  .card,.tcard{padding:22px 20px}
  .quote,.notes{padding-left:0;padding-right:0}
}
/* short landscape phones */
@media (max-height:520px) and (orientation:landscape){
  .login-panel{max-height:68vh;overflow-y:auto}
}
/* ...but a wide landscape phone has room for the side-by-side hero */
@media (max-height:520px) and (orientation:landscape) and (min-width:700px){
  .hero{min-height:340px}
  .hero-copy{padding-top:30px;padding-bottom:30px}
  .hero h1{font-size:1.95rem}
  .hero .sub{margin-top:12px;font-size:.98rem}
  .hero-cta{margin-top:20px}
  .hero-scrim{background:linear-gradient(100deg,
    rgba(17,74,44,.91) 0%, rgba(18,80,47,.88) 46%,
    rgba(20,87,51,.80) 68%, rgba(21,94,55,.40) 79%,
    rgba(22,99,57,.10) 88%, rgba(22,99,57,0) 96%)}
}
/* coarse pointers get bigger targets and no hover-only affordances */
@media (pointer:coarse){
  .btn{min-height:44px}
  .login-row{min-height:52px}
  .alert button{min-width:44px;min-height:44px}
  nav.main a{padding:12px 0}
  .link{padding-top:4px;padding-bottom:6px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---- interior pages ---- */
.pagehead{position:relative;background:var(--navy);color:#fff;overflow:hidden;padding:52px 0 46px}
.pagehead::after{
  content:"";position:absolute;top:0;right:0;bottom:0;width:min(38%,420px);
  background:var(--gold);clip-path:polygon(88.5% 0, 90% 0, 4% 100%, 2.5% 100%);
}
.pagehead .eyebrow{color:var(--gold-on-dark)}
.pagehead h1{font-size:clamp(1.9rem,3.4vw,2.7rem);font-weight:800;line-height:1.12;color:#fff;max-width:16em}
.pagehead p{margin-top:14px;font-size:1.04rem;color:#BFD2C7;max-width:46ch;line-height:1.62}
.pagehead .hero-cta{margin-top:24px}
.crumb{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:.8rem;color:#9BB3A5;margin-bottom:14px}
.crumb a{color:#A9CBB8;text-decoration:none}
.crumb a:hover{text-decoration:underline}
.crumb span{color:#6F8878}

nav.main a[aria-current="page"],.mobnav a[aria-current="page"]{border-bottom-color:var(--gold);color:var(--navy)}

/* comparison / data table */
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:6px;background:var(--white);box-shadow:var(--shadow-sm)}
table.cmp{border-collapse:collapse;width:100%;min-width:560px}
table.cmp th,table.cmp td{text-align:left;padding:14px 18px;border-bottom:1px solid var(--line-2);font-size:.93rem;vertical-align:top}
table.cmp thead th{
  font-size:.68rem;letter-spacing:.11em;text-transform:uppercase;color:var(--slate);
  font-weight:700;background:var(--paper);border-bottom:1px solid var(--line)
}
table.cmp tbody tr:last-child td{border-bottom:none}
table.cmp td:first-child,table.cmp th[scope="row"]{font-weight:700;color:var(--navy)}
table.cmp .num{font-variant-numeric:tabular-nums;font-family:Montserrat,sans-serif;font-weight:700;color:var(--navy)}
.tbl-note{margin-top:12px;font-size:.8rem;color:var(--slate)}

/* two-column prose + aside */
.duo{display:grid;grid-template-columns:1.25fr 1fr;gap:44px;align-items:start}
.aside{background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:24px;display:flex;flex-direction:column;gap:14px}
.aside h3{font-size:1.05rem;font-weight:700}
.aside ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:7px}
.aside li{font-size:.9rem;color:var(--navy-2)}
.prose p{font-size:1rem;color:var(--navy-2);line-height:1.7}
.prose p + p{margin-top:14px}

/* step list */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:22px}
.steps li{display:flex;flex-direction:column;gap:7px}
.steps .n{
  font-family:Montserrat,sans-serif;font-weight:800;font-size:.8rem;letter-spacing:.06em;
  color:var(--gold-dk);border-top:3px solid var(--gold);padding-top:12px
}
.steps b{font-size:1rem;color:var(--navy)}
.steps span{font-size:.92rem;color:var(--navy-2);line-height:1.6}

@media (max-width:900px){
  .duo{grid-template-columns:1fr;gap:26px}
  .pagehead{padding:40px 0 36px}
  .pagehead::after{width:44%}
}

.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---- login chooser rows are links in the PHP build ---- */
a.login-row{text-decoration:none}

/* ---- forms ---- */
.form{display:flex;flex-direction:column;gap:18px;margin-top:22px;max-width:34rem}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:.88rem;font-weight:700;color:var(--navy)}
.field input,.field textarea{
  font-family:inherit;font-size:1rem;color:var(--navy);background:var(--white);
  border:1px solid var(--line);border-radius:4px;padding:12px 14px;width:100%;
  min-height:48px;
}
.field textarea{min-height:140px;resize:vertical;line-height:1.6}
.field input:hover,.field textarea:hover{border-color:var(--slate)}
.field input:focus,.field textarea:focus{outline:3px solid var(--gold-dk);outline-offset:1px;border-color:var(--navy)}
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"]{border-color:#A83E2A;background:#FDF7F5}
.field-err{font-size:.85rem;color:#8E3222;font-weight:600}
.field-help{font-size:.83rem;color:var(--navy-2);line-height:1.55;background:var(--gold-lt);border-left:3px solid var(--gold);padding:12px 14px;border-radius:0 4px 4px 0}
.form .btn{align-self:flex-start}

/* the honeypot must be unreachable, not merely invisible */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.formnote{display:flex;flex-direction:column;gap:4px;padding:15px 18px;border-radius:4px;margin-top:20px;font-size:.92rem}
.formnote strong{font-size:.96rem}
.formnote-ok{background:#E9F3EE;border-left:3px solid var(--ok);color:#14512F}
.formnote-bad{background:#FBEDEA;border-left:3px solid #A83E2A;color:#7A2B1C}


/* the five dropdown buttons need more room than the layout breakpoint gives */
@media (max-width:1080px){
  nav.main{display:none}
  .burger{display:inline-flex}
}
@media (min-width:1081px){
  .mobnav{display:none!important}
}

/* select matches the text inputs */
.field select{
  font-family:inherit;font-size:1rem;color:var(--navy);background:var(--white);
  border:1px solid var(--line);border-radius:4px;padding:12px 14px;width:100%;min-height:48px;
  appearance:none;
  background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23123D25' stroke-width='3'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;padding-right:40px;
}
.field select:hover{border-color:var(--slate)}
.field select:focus{outline:3px solid var(--gold-dk);outline-offset:1px;border-color:var(--navy)}

/* email list in the contact aside */
.maillist{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}
.maillist li{display:flex;flex-direction:column;gap:2px}
.maillist b{font-size:.84rem;color:var(--navy)}
.maillist a{font-size:.92rem;word-break:break-all}

.foot-mail{margin-top:10px;display:flex;flex-direction:column;gap:4px}
.foot-mail a{font-size:.86rem;color:#C6D6CC;text-decoration:none}
.foot-mail a:hover{color:#fff;text-decoration:underline}

/* ---- header wordmark (placeholder until the real logo file arrives) ---- */
.wm{display:flex;align-items:center;gap:11px}
.wm-mark{
  width:36px;height:36px;border-radius:50%;background:var(--navy);
  position:relative;overflow:hidden;flex:0 0 auto;
}
.wm-mark::after{
  content:"";position:absolute;inset:0;background:var(--gold);
  clip-path:polygon(58% 0, 79% 0, 42% 100%, 21% 100%);
}
.wm-text{display:flex;flex-direction:column;line-height:1}
.wm-1{
  font-family:Montserrat,"Segoe UI",Helvetica,Arial,sans-serif;font-weight:800;
  font-size:1.04rem;color:var(--navy);letter-spacing:-.012em;white-space:nowrap;
}
.wm-2{
  font-family:"Source Sans 3",sans-serif;font-weight:700;font-size:.6rem;
  letter-spacing:.2em;text-transform:uppercase;color:var(--gold-dk);
  margin-top:4px;white-space:nowrap;
}
@media (max-width:560px){
  .wm{gap:9px}
  .wm-mark{width:31px;height:31px}
  .wm-1{font-size:.93rem}
  .wm-2{font-size:.55rem;letter-spacing:.17em}
}
@media (max-width:430px){
  .wm-mark{width:28px;height:28px}
  .wm-1{font-size:.84rem}
  .wm-2{font-size:.5rem;letter-spacing:.14em}
}

/* ---- full-width photographic strip ---- */
.strip{max-width:var(--maxw);margin:0 auto;padding:0 max(28px, env(safe-area-inset-left));display:block}
.strip img{
  display:block;width:100%;height:auto;border-radius:6px;
  border:1px solid var(--line);
}
@media (max-width:640px){
  .strip img{aspect-ratio:2.6/1;object-fit:cover;object-position:60% center}
}
