:root{
      --brand:#ba1b1d;      /* fire-engine red */
      --brand-dark:#8f1416;
      --ink:#1a1a1a;
      --muted:#6b7280;
      --bg:#ffffff;
      --bg-alt:#f6f7f9;
      --ring: rgba(186,27,29,.35);
    }
    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    [id] { scroll-margin-top: 15rem; }
    html,body { margin:0; padding:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"; color:var(--ink); background:var(--bg); }
    a { color: var(--brand); text-decoration: none; }
    a:focus { outline: 3px solid var(--ring); outline-offset: 2px; }
    img { max-width:100%; height:auto; }
    .container { max-width:1100px; margin-inline:auto; padding: clamp(16px, 2.5vw, 28px); }

    .skip-link{ position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }
    .skip-link:focus{ position:static; width:auto; height:auto; padding:.5rem .75rem; background:#fff; border:2px solid var(--brand); z-index:999; }

    header { background:var(--bg); border-bottom:1px solid #ececec; position:sticky; top:0; z-index:50; }
    .brand { display:flex; gap:.75rem; align-items:center; }
    #brand-logo { width:20vw; height:15.75vw; transition: width .18s ease, height .18s ease, transform .18s ease, filter .18s ease; }
    #brand-logo.is-scrolled { width:7vw; height:5.75vw; transform: translateY(0); filter: saturate(1.1); }
    .brand h1{ font-size:1.15rem; margin:0; line-height:1.1; }
    nav ul { list-style:none; display:flex; flex-direction: column; gap:1rem; margin:0; padding:0; }
    nav a{ padding:.5rem .6rem; border-radius:.5rem; }
    nav a[aria-current="page"]{ background:var(--bg-alt); }

    .topline { background: var(--brand); color:#fff; font-weight:600; }
    .topline .container { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
    .topline a{ color:#fff; text-decoration: underline; }

    .hero { background: linear-gradient(180deg, #fff, var(--bg-alt)); }
    .hero-image {
        filter: drop-shadow(0 3px 10px #000);
    }
    .hero .wrap{ display:grid; grid-template-columns: 1.2fr 1fr; gap: clamp(16px, 3vw, 40px); align-items:center; }
    .hero h2{ font-size: clamp(1.6rem, 3.8vw, 2.6rem); margin:.2rem 0 .6rem; }
    .hero p{ color:var(--muted); font-size:1.05rem; max-width:60ch; }
    .cta { display:flex; gap:.75rem; flex-wrap: wrap; margin-top:1rem; }
    .btn { display:inline-block; padding:.7rem 1rem; border-radius:.65rem; border:2px solid var(--brand); font-weight:700; }
    .btn.primary { background:var(--brand); color:#fff; }
    .btn.primary:hover{ background:var(--brand-dark); border-color:var(--brand-dark); }
    .btn.ghost { color:var(--brand); background:#fff; }
    .card-grid{ display:grid; gap: clamp(12px, 2vw, 20px); grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
    .card{ background:#fff; border:1px solid #ececec; border-radius:12px; padding:1rem 1.1rem; }
    .card h3{ margin:.1rem 0 .4rem; font-size:1.05rem; }
    .muted{ color:var(--muted); }
    .section-title{ font-size:1.4rem; margin: 1.5rem 0 .75rem; }
    .map{ aspect-ratio: 16/9; width:100%; border:0; border-radius:12px; }

    footer{ background:#0f1113; color:#d1d5db; margin-top: 2rem; }
    footer a{ color:#e5e7eb; }
    footer .cols{ display:grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap:1rem; }
    .small{ font-size:.9rem; }
    .copyright{ border-top:1px solid #2b2f35; margin-top:1rem; padding-top:.75rem; color:#9ca3af; }
    @media (max-width: 880px){
      .hero .wrap{ grid-template-columns: 1fr; }
      nav ul { flex-wrap:wrap; }
    }
    @media (min-width: 768px){
      nav ul { flex-direction: row; }
    }
    @media (prefers-reduced-motion: reduce){
        #brand-logo{ transition: none; }
    }