
:root {
  --primary: #2A4A6B;
  --accent: #B87333;
  --background: #F2F4F7;
  --text: #222222;
  --white: #ffffff;
  --border: #d8dee8;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  background: var(--background);
  color: var(--text);
  line-height: 1.6;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
iframe { width: 100%; height: 100%; border: 0; }
.container { width: min(1220px, calc(100% - 2rem)); margin: 0 auto; }
.topbar { background: var(--primary); color: rgba(255,255,255,0.88); font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase; }
.topbar .container, .mainnav .container { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.topbar .container { padding: 0.85rem 0; }
.mainnav { background: rgba(255,255,255,0.96); border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 10; backdrop-filter: blur(10px); }
.mainnav .container { padding: 1rem 0; flex-wrap: wrap; }
.brand { display: flex; align-items: center; gap: 1rem; }
.brand img { width: 164px; }
.brand-copy { max-width: 220px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--primary); font-size: 13px; }
.nav-links { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; }
.nav-links a { font-size: 13px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: #30475e; }
.nav-links a:hover, .nav-links a.is-active { color: var(--primary); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.95rem 1.25rem; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.14em; }
.button-primary { background: linear-gradient(135deg, var(--accent), #a66124); color: white; }
.button-secondary { border: 1px solid rgba(42,74,107,0.18); background: white; color: var(--primary); }
.hero { position: relative; min-height: 560px; background: #162a3d; color: white; overflow: hidden; }
.hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(18,35,54,0.9), rgba(18,35,54,0.68) 42%, rgba(18,35,54,0.12)); }
.hero-media, .hero-overlay-content { position: relative; z-index: 1; }
.hero-media { position: absolute; inset: 0; }
.hero-media img { width: 100%; height: 100%; object-fit: cover; }
.hero-content { position: relative; z-index: 2; display: grid; gap: 2rem; padding: 5rem 0; }
.hero-copy { max-width: 780px; }
.eyebrow, .hero-copy .eyebrow-light { color: var(--accent); text-transform: uppercase; font-size: 12px; font-weight: 700; letter-spacing: 0.28em; }
.hero-copy .eyebrow-light { color: rgba(255,255,255,0.76); }
.hero h1, .hero h2, .hero h3, h2, h3 { margin: 0.35rem 0 0; font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; text-transform: uppercase; letter-spacing: 0.03em; line-height: 0.98; }
.hero h1 { font-size: clamp(3rem, 7vw, 5.6rem); max-width: 12ch; }
.hero p { max-width: 56rem; font-size: 18px; color: rgba(255,255,255,0.84); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 0.9rem; margin-top: 1.5rem; }
.hero-panel { max-width: 430px; margin-left: auto; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.16); padding: 2rem; backdrop-filter: blur(12px); clip-path: polygon(0 8%, 100% 0, 100% 100%, 0 100%); }
.hero-panel p { color: rgba(255,255,255,0.78); font-size: 16px; }
.stat-grid { display: grid; gap: 0.85rem; }
.stat-card { background: rgba(12,16,20,0.16); border: 1px solid rgba(255,255,255,0.12); padding: 1rem; }
.stat-card span { display: block; text-transform: uppercase; letter-spacing: 0.18em; font-size: 11px; color: rgba(255,255,255,0.68); }
.stat-card strong { display: block; margin-top: 0.45rem; font-size: 2rem; font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; }
.section { padding: 5rem 0; }
.section-light { background: var(--background); }
.section-white { background: white; }
.section-dark { background: var(--primary); color: white; }
.section h2 { font-size: clamp(2.2rem, 5vw, 4rem); color: var(--primary); max-width: 14ch; }
.light-title { color: white !important; }
.light-copy { color: rgba(255,255,255,0.8); }
.split-layout { display: grid; gap: 2rem; align-items: start; }
.card-grid { display: grid; gap: 1rem; }
.card-grid.four-up { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.card-grid.three-up { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.card-grid.two-up { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.top-gap { margin-top: 2rem; }
.trust-row { padding-top: 0; }
.trust-row .container { margin-top: -2rem; }
.trust-card, .offset-card, .service-card, .timeline-card, .quote-card, .feature-card, .side-callout, .map-frame, .content-panel, .contact-form, .faq-item, .download-panel {
  background: white; border: 1px solid var(--border); box-shadow: 0 18px 40px rgba(24,38,54,0.08);
}
.trust-card { padding: 1.25rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.12em; color: var(--primary); }
.offset-stack, .card-stack, .faq-list { display: grid; gap: 1rem; }
.offset-card, .quote-card, .feature-card, .side-callout, .content-panel, .contact-form { padding: 1.6rem; }
.offset-card h3, .feature-card h3, .quote-card h3, .service-card h3 { font-size: 1.7rem; color: var(--primary); }
.offset-card.is-offset { margin-left: 0; background: linear-gradient(135deg, rgba(42,74,107,0.06), rgba(184,115,51,0.08)); }
.service-card { overflow: hidden; display: block; }
.service-card img, .media-panel img { width: 100%; height: 250px; object-fit: cover; }
.service-card div { padding: 1.35rem; }
.timeline-card { padding: 1.35rem; background: rgba(255,255,255,0.07); border-color: rgba(255,255,255,0.16); color: white; }
.timeline-card span { color: var(--accent); font-size: 12px; font-weight: 700; letter-spacing: 0.24em; }
.timeline-card p { margin: 0.7rem 0 0; color: rgba(255,255,255,0.84); }
.quote-card footer { margin-top: 1rem; font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--primary); font-weight: 700; }
.media-layout { grid-template-columns: 1fr; }
.media-panel, .map-frame { min-height: 380px; overflow: hidden; }
.content-panel { display: flex; flex-direction: column; justify-content: center; }
.text-link { color: var(--accent); font-weight: 700; text-transform: uppercase; letter-spacing: 0.12em; font-size: 13px; }
.bullet-list { margin: 1.2rem 0 0; padding-left: 1.2rem; }
.bullet-list li { margin-bottom: 0.65rem; }
.side-callout { display: grid; gap: 1rem; align-items: start; }
.small-photo { width: 100%; height: 100%; object-fit: cover; }
.contact-form { display: grid; gap: 1rem; }
.contact-form label { display: grid; gap: 0.4rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--primary); font-size: 13px; }
.contact-form input, .contact-form textarea { border: 1px solid var(--border); padding: 0.9rem 1rem; font: inherit; }
.form-note { margin: 0; font-size: 14px; color: #5a6672; }
.faq-item { padding: 1.15rem 1.25rem; }
.faq-item summary { cursor: pointer; font-weight: 700; color: var(--primary); text-transform: uppercase; letter-spacing: 0.05em; }
.faq-item p { margin: 0.9rem 0 0; }
.chip-wrap { display: flex; flex-wrap: wrap; gap: 0.65rem; margin-top: 1rem; }
.keyword-chip { display: inline-flex; padding: 0.75rem 1rem; background: rgba(42,74,107,0.06); border: 1px solid rgba(42,74,107,0.1); color: var(--primary); text-transform: uppercase; font-size: 12px; letter-spacing: 0.14em; font-weight: 700; }
.cta-band { background: var(--primary); color: white; }
.cta-band h2 { color: white; }
.footer { background: #22364d; color: rgba(255,255,255,0.84); }
.footer-top { display: grid; gap: 2rem; padding: 4rem 0; }
.footer-logo { width: 210px; }
.footer h3 { color: white; font-size: 1.6rem; }
.footer-links { display: grid; gap: 0.65rem; }
.footer-links a { text-transform: uppercase; letter-spacing: 0.12em; font-size: 13px; color: rgba(255,255,255,0.82); }
.footer-bottom { border-top: 1px solid rgba(255,255,255,0.12); padding: 1.2rem 0; font-size: 14px; }
@media (min-width: 760px) {
  .hero-content { grid-template-columns: 1.08fr 0.72fr; align-items: end; }
  .split-layout { grid-template-columns: 0.92fr 1.08fr; }
  .media-layout { grid-template-columns: 1.08fr 0.92fr; }
  .card-grid.two-up { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .card-grid.three-up { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .card-grid.four-up { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .offset-card.is-offset { margin-left: 4rem; }
  .footer-top { grid-template-columns: 1.15fr 0.85fr 0.85fr; }
}
@media (max-width: 759px) {
  .brand-copy { display: none; }
  .nav-links { gap: 0.65rem; }
  .nav-links a, .button { font-size: 12px; }
}
