:root{
 --brand:#0b6efd; 
 --ink:#1c2330; 
 --muted:#5b667a; 
 --bg:#ffffff; 
 --alt:#f6f8fb; 
 --card:#ffffff; 
 --border:#e5e9f0; 
 --success:#15803d; 
 --error:#b91c1c; 
 --radius:14px; 
 --shadow:0 8px 24px rgba(16,24,40,.08); 
 --header-height:120px; 
} 
/* Dark mode */
@media (prefers-color-scheme: dark) { 
 :root{ 
 --bg:#0f141b; 
 --ink:#e6e9ee; 
 --muted:#a7b0bf; 
 --alt:#121925; 
 --card:#161d2a; 
 --border:#253044; 
 } 
} 
html,body{ margin:0;padding:0;background:var(--bg);color:var(--ink); 
 font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial,sans-serif;line-height:1.5 } 
img{max-width:100%;display:block} 
a{color:var(--brand);text-decoration:none} 
a:hover{text-decoration:underline} 
.container{max-width:1100px;margin:0 auto;padding:0 20px} 
.muted{color:var(--muted)} 
.mtop{margin-top:14px} 
:focus-visible{ outline:3px solid #94b9ff; outline-offset:2px } 
/* Skip link */
.skip-link{ position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden; 
 background:var(--brand);color:#fff;padding:8px 12px;border-radius:8px; } 
.skip-link:focus{ left:12px;top:12px;width:auto;height:auto;z-index:1000 } 
/* Header and nav */
.topbar{ position:sticky;top:0;background:var(--card);border-bottom:1px solid var(--border);z-index:50 } 
.nav{ display:flex;align-items:center;justify-content:space-between;min-height:var(--header-height) } 
.brand{ display:flex;align-items:center;gap:12px } 
.brand img{ height:108px;width:auto;border-radius:4px } 
.brand span{ font-weight:700;letter-spacing:.2px } 
/* Menu and submenu */
.menu{ display:flex;gap:20px;align-items:center; position:relative } 
.menu a{ font-weight:700 } 
.menu a.menu-link{ color:var(--ink);font-weight:800 } 
.menu a.menu-link:focus, .menu a.menu-link:hover{ color:#0a2458;text-decoration:none } 
.has-submenu{ position:relative } 
.submenu{ 
 position:absolute;top:100%;left:0;background:var(--card);border:1px solid var(--border);border-radius:10px; 
 box-shadow:var(--shadow);padding:8px 0;min-width:220px;display:none; 
} 
.submenu a{ display:block;padding:8px 14px;color:var(--ink);font-weight:700;white-space:nowrap } 
.submenu a:hover, .submenu a:focus{ background:var(--alt);text-decoration:none } 
.has-submenu:focus-within .submenu, .has-submenu:hover .submenu{ display:block } 
/* Buttons */
.btn{ display:inline-block;padding:10px 16px;border-radius:10px;border:1px solid var(--brand); 
 background:transparent;color:var(--brand);font-weight:700 } 
.btn-primary{ background:var(--brand);color:#fff;box-shadow:var(--shadow) } 
.btn:hover{ text-decoration:none;filter:brightness(.97) } 
.btn-ghost{ background:transparent;border-color:#bcd2ff;color:#1c3d92 } 
.btn[disabled]{ opacity:.6;cursor:not-allowed } 
/* Hero */
.hero{ position:relative;overflow:hidden;background:var(--alt) } 
.hero-media img{ width:100%;height:360px;object-fit:cover } 
.hero-inner{ position:relative;margin-top:-120px } 
.hero-card{ background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow); 
 border-radius:var(--radius);padding:28px;max-width:760px } 
.lead{ color:var(--muted);font-size:1.1rem;margin:8px 0 6px } 
.trust{ display:flex;gap:18px;flex-wrap:wrap;margin-top:10px } 
.trust img{ width:18px;height:18px } 
.hero-cta{ margin-top:14px;display:flex;gap:10px } 
/* Sections */
.section{ padding:56px 0 } 
.section-alt{ background:var(--alt) } 
h1,h2{ line-height:1.2;margin:0 0 12px } 
h3{ margin:0 0 8px } 
.intro{ color:var(--muted);max-width:760px } 
section[id]{ scroll-margin-top:calc(var(--header-height) + 12px) } 
/* Grid and cards */
.grid{ display:grid;gap:22px } 
.cols-2{ grid-template-columns:1fr } 
.cols-3{ grid-template-columns:1fr } 
.cols-4{ grid-template-columns:1fr 1fr } 
@media(min-width:720px){ .cols-2{ grid-template-columns:1fr 1fr } .cols-3{ grid-template-columns:repeat(3,1fr) } } 
@media(min-width:900px){ .cols-4{ grid-template-columns:repeat(4,1fr) } } 
.card{ background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px } 
.card-img{ border-radius:10px;height:120px;object-fit:cover;margin-bottom:12px;background:#e6f2ff } 
/* Panels */
.two-col{ display:grid;gap:24px } 
@media(min-width:900px){ .two-col{ grid-template-columns:1.2fr .8fr } } 
.panel{ background:#0b6efd10;border:1px solid #cfe2ff;border-radius:var(--radius);padding:20px } 
/* Lists and forms */
.ticklist{ padding-left:18px } 
.ticklist li{ margin:6px 0 } 
form{ display:grid;gap:14px } 
.row{ display:grid;gap:14px } 
@media(min-width:680px){ .row{ grid-template-columns:1fr 1fr } } 
input,select,textarea{ width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:10px;font:inherit;background:var(--card);color:var(--ink) } 
input:focus,select:focus,textarea:focus{ border-color:#94b9ff;outline:none;box-shadow:0 0 0 3px rgba(148,185,255,.35) } 
.alert{ margin-top:8px;padding:10px 12px;border-radius:10px } 
.success{ background:#ecfdf5;color:var(--success);border:1px solid #bbf7d0 } 
.error{ background:#fef2f2;color:var(--error);border:1px solid #fecaca } 
.hp{ position:absolute;left:-5000px } 
/* Masked email reveal */
.email-container{ margin-top:10px }
.contact-card{ margin-top:14px }
/* Footer and staff links */
.footer{ border-top:1px solid var(--border);padding:22px 0;color:var(--muted) } 
.foot{ display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap } 
.foot-nav{ display:flex;gap:12px } 
.employee-reveal.bl{ 
 position:fixed;left:12px;bottom:10px;z-index:60;font-size:12px;color:var(--muted); 
 background:transparent;padding:4px 6px;border-radius:6px;opacity:.85; 
} 
.employee-reveal.bl:hover, .employee-reveal.bl:focus-within{ opacity:1 } 
.employee-reveal.bl > summary{ list-style:none;cursor:pointer;color:var(--muted);font-weight:700 } 
.employee-reveal.bl > summary::-webkit-details-marker{ display:none } 
.employee-reveal.bl > summary:focus{ outline:3px solid #94b9ff; outline-offset:2px } 
.employee-link{ color:var(--muted);font-weight:600 } 
.employee-link:hover, .employee-link:focus{ color:var(--ink);text-decoration:underline } 
.sep{ margin:0 6px;color:var(--muted) } 
/* Mobile tweaks */
@media (max-width:360px){ 
 .brand img{ height:92px } .menu{ gap:14px } .btn.btn-primary{ padding:8px 12px } 
} 
@media (max-width:420px){ 
 .hero-media img{ height:300px } .hero-inner{ margin-top:-100px } #formMsg{ margin-top:12px } 
} 
@media (hover:none){ .menu a.menu-link{ padding:10px 0 } }