:root{--navy:#0f2233;--navy-2:#16324b;--gold:#c9962a;--gold-d:#a87c1c;--ink:#1b2733;--mut:#5f7183;
--line:#e4e9ef;--bg:#f7f9fb;--card:#fff;--ok:#1d6b45;--r:12px;
--sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,"Helvetica Neue",Arial,sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:17px/1.72 var(--sans);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}
img{max-width:100%}
h1,h2,h3{line-height:1.22;letter-spacing:-.018em;color:var(--navy);font-weight:700;margin:0}
h1{font-size:clamp(28px,4.6vw,44px)}
h2{font-size:clamp(23px,3vw,31px);margin:56px 0 14px}
h3{font-size:20px;margin:32px 0 8px}
p{margin:14px 0;max-width:70ch}
ul,ol{max-width:70ch}
a{color:#0a5ca6;text-underline-offset:3px}
.wrap{max-width:1120px;margin:0 auto;padding:0 22px}
.measure{max-width:72ch}

/* ---------- header ---------- */
header.site{position:sticky;top:0;z-index:60;background:rgba(15,34,51,.97);backdrop-filter:saturate(140%) blur(8px);
 border-bottom:1px solid rgba(255,255,255,.09)}
header.site .wrap{display:flex;align-items:center;gap:18px;min-height:68px}
.logo{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-weight:700;font-size:20px;letter-spacing:-.02em;flex:none}
.logo .mk{width:30px;height:30px;display:block;flex:none}
.logo b{font-weight:700}.logo span{color:var(--gold);font-weight:700}
nav.top{margin-left:auto;display:flex;gap:26px}
nav.top a{color:#c3d0dd;text-decoration:none;font-size:15px;font-weight:500;white-space:nowrap}
nav.top a:hover{color:#fff}
.callbtn{background:var(--gold);color:#241a00!important;padding:11px 20px;border-radius:99px;font-weight:700;
 text-decoration:none;white-space:nowrap;font-size:16px;box-shadow:0 2px 10px rgba(201,150,42,.32);transition:.15s}
.callbtn:hover{background:var(--gold-d);transform:translateY(-1px)}
header .callbtn{margin-left:auto}
header nav.top+.callbtn{margin-left:8px}

/* ---------- hero ---------- */
.hero{background:linear-gradient(180deg,#fff 0%,var(--bg) 100%);padding:34px 0 8px;border-bottom:1px solid var(--line)}
.crumb{font-size:13.5px;color:var(--mut);margin:0 0 14px}
.crumb a{color:var(--mut);text-decoration:none}.crumb a:hover{text-decoration:underline}
.herogrid{display:grid;grid-template-columns:1fr;gap:26px;align-items:start}
@media(min-width:900px){.herogrid.has-img{grid-template-columns:1.05fr .95fr;gap:40px;align-items:center}}
.herolede{font-size:19px;color:var(--mut);margin-top:14px;max-width:60ch}
.herocta{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:22px 0 4px}
.herocta .callbtn{font-size:18px;padding:14px 26px}
.herocta small{color:var(--mut);font-size:14px}

/* ---------- the disclosure: designed, not shouted ---------- */
.disc{display:flex;gap:12px;align-items:flex-start;background:#fff;border:1px solid var(--line);
 border-left:3px solid var(--gold);border-radius:var(--r);padding:14px 18px;margin:22px 0 26px;
 font-size:14.5px;line-height:1.62;color:var(--mut);max-width:74ch;box-shadow:0 1px 2px rgba(15,34,51,.04)}
.disc svg{flex:none;margin-top:2px}
.disc strong{color:var(--ink)}

/* ---------- content blocks ---------- */
main{padding-bottom:20px}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:14px;margin:26px 0}
.tile{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;box-shadow:0 1px 2px rgba(15,34,51,.04)}
.tile .v{font-size:26px;font-weight:700;color:var(--navy);letter-spacing:-.02em;line-height:1.15}
.tile .l{font-size:12.5px;color:var(--mut);margin-top:5px;font-weight:500}
table{width:100%;border-collapse:separate;border-spacing:0;margin:18px 0;font-size:15.5px;background:var(--card);
 border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:0 1px 2px rgba(15,34,51,.04)}
th{background:#f2f5f8;color:var(--navy);text-align:left;padding:12px 15px;font-size:13px;font-weight:700;
 letter-spacing:.02em;border-bottom:1px solid var(--line)}
td{padding:12px 15px;border-bottom:1px solid var(--line);vertical-align:top}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover{background:#fafcfe}
details{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:0;margin:10px 0;overflow:hidden}
details summary{cursor:pointer;font-weight:600;color:var(--navy);padding:15px 18px;list-style:none;
 display:flex;justify-content:space-between;gap:14px;align-items:center;font-size:16.5px}
details summary::-webkit-details-marker{display:none}
details summary:after{content:"+";color:var(--gold);font-size:22px;font-weight:400;line-height:1;flex:none}
details[open] summary:after{content:"‘2"}
details summary:hover{background:#fafcfe}
details p{margin:0;padding:0 18px 17px;color:var(--mut);max-width:74ch}
.steps{counter-reset:s;list-style:none;margin:20px 0;padding:0;max-width:74ch}
.steps li{counter-increment:s;position:relative;padding:0 0 0 52px;margin:20px 0}
.steps li:before{content:counter(s);position:absolute;left:0;top:-2px;width:34px;height:34px;border-radius:50%;
 background:var(--navy);color:var(--gold);display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700}
.cta{background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 100%);color:#fff;padding:30px 32px;
 margin:40px 0;border-radius:16px;box-shadow:0 6px 24px rgba(15,34,51,.16)}
.cta h2,.cta .ctah{color:#fff;margin:0 0 8px;font-size:23px;border:0;padding:0}
.cta p{color:#c3d0dd;margin:0 0 18px;max-width:56ch}
.cta .callbtn{font-size:18px;padding:14px 26px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(258px,1fr));gap:16px;margin:22px 0}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px 22px;position:relative;
 transition:.16s;box-shadow:0 1px 2px rgba(15,34,51,.04)}
.card:hover{box-shadow:0 8px 24px rgba(15,34,51,.11);transform:translateY(-2px);border-color:#d5dde6}
.card h3{margin:0 0 7px;font-size:17.5px}
.card h3 a{color:var(--navy);text-decoration:none}
.card p{margin:0;font-size:14.5px;color:var(--mut)}
.card a.str:after{content:"";position:absolute;inset:0}
.chips{margin:16px 0;max-width:none}
.chips a{display:inline-block;background:#fff;border:1px solid var(--line);color:var(--navy);text-decoration:none;
 padding:7px 15px;border-radius:99px;font-size:14.5px;margin:0 7px 9px 0;transition:.14s}
.chips a:hover{background:var(--navy);border-color:var(--navy);color:#fff}
figure{margin:26px 0}
figure img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;display:block;background:#e8edf2;border-radius:14px}
figure figcaption{font-size:13.5px;color:var(--mut);margin-top:9px}
.hero-img{margin:0}
.hero-img img{aspect-ratio:16/10;border-radius:16px;box-shadow:0 10px 34px rgba(15,34,51,.14)}
@media(min-width:900px){.hero-img img{aspect-ratio:4/3}}
.src{font-size:14px;color:var(--mut)}
blockquote{border-left:3px solid var(--gold);margin:18px 0;padding:2px 0 2px 18px;color:var(--mut)}

/* ---------- footer ---------- */
footer.site{background:var(--navy);color:#a7b7c7;margin-top:56px;padding:40px 0 104px;font-size:15px}
footer.site .wrap>div{margin-bottom:14px;max-width:78ch}
footer.site a{color:#d3dde7}
footer .fbrand{color:#fff;font-weight:700;font-size:18px}
footer .fnav a{margin-right:18px;display:inline-block;margin-bottom:6px}
footer .fine{font-size:13px;color:#7e91a4;line-height:1.6}

/* ---------- mobile call bar ---------- */
.callbar{position:fixed;left:0;right:0;bottom:0;z-index:99;background:var(--gold);text-align:center;
 padding:0;font-weight:700;font-size:17.5px;box-shadow:0 -3px 16px rgba(15,34,51,.2)}
.callbar a{color:#241a00;text-decoration:none;display:flex;align-items:center;justify-content:center;
 gap:9px;min-height:58px;padding:8px 12px}
@media(min-width:900px){.callbar{display:none}footer.site{padding-bottom:40px}}
@media(max-width:899px){
 nav.top{display:none}
 header.site .wrap{min-height:60px}
 header .callbtn{font-size:15px;padding:10px 16px}
 body{font-size:16.5px}
 p,ul,ol{max-width:none}
 .cta{padding:24px 22px;border-radius:14px}
 .tiles{grid-template-columns:repeat(2,1fr);gap:11px}
 .tile{padding:14px}.tile .v{font-size:22px}
 table{font-size:14.5px}
 th,td{padding:10px 12px}
 details summary{padding:14px 15px;font-size:16px}
 details p{padding:0 15px 15px}
 .herocta .callbtn{width:100%;text-align:center;font-size:18px;padding:15px 20px}
 .steps li{padding-left:46px}
}

/* WCAG 2.5.8 target size: pad inline links vertically on touch. Padding on an inline element
   grows the hit box without altering line height, so layout is untouched. */
@media(max-width:899px){
 main p a,main li a,footer.site a,.crumb a,td a,th a,details p a{padding-block:6px}
 td a,th a{display:inline-block;padding-block:5px}
 .crumb a{padding-block:5px}
 .chips a{padding:9px 15px}
}
@media(pointer:coarse){
 main p a,main li a,.crumb a,td a,details p a{padding-block:6px}
}

/* <=430px: the header cannot fit logo + full phone number. Collapse the number in the header
   button (the sticky bottom bar carries it in full) and tighten the logo. Prevents the
   layout viewport expanding and zooming the entire page out on 320px devices. */
@media(max-width:430px){
 .logo{font-size:17px;gap:8px}
 .logo .mk{width:26px;height:26px}
 header.site .wrap{gap:10px;padding-left:14px;padding-right:14px}
 header .callbtn{padding:10px 14px;font-size:15px}
 header .callbtn .cn{display:none}
 header .callbtn .cw:after{content:"now"}
}
@media(max-width:340px){
 .logo span{display:none}
 .wrap{padding-left:12px;padding-right:12px}
}

/* --- overflow fixes found by strict-viewport testing --- */
/* 1. flex items default to min-width:auto and refuse to shrink below their content.
      The disclosure text is a flex child, so long words forced the page wider. */
.disc>div{min-width:0;overflow-wrap:anywhere}
.disc{flex-wrap:nowrap}
/* 2. tables: wrap in a scroll container that cannot itself exceed the viewport */
.tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
table{max-width:100%}
/* 3. the desktop nav appeared at 900px but needs ~1100px to fit alongside logo + call button */
nav.top{display:none}
@media(min-width:1100px){nav.top{display:flex}}
/* 4. nothing may force the page wider than the viewport */
html,body{overflow-x:clip;max-width:100%}
.wrap{min-width:0}
header.site .wrap{flex-wrap:nowrap;min-width:0}
.logo{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}