@font-face{
    font-family: "Outfit";
    font-style: normal;
    font-weight: 900;
    font-display: swap;
    src: url(/assets/fonts/outfit-black.woff2) format("woff2") format("woff2");
  }
  :root{
    --bg: #e3e5e6;
    --bg-elevated: #eef0f0;
    --bg-sunken: #cbd0d1;
    --ink: #1c1f21;
    --ink-soft: #4d5457;
    --ink-faint: #767d80;
    --line: #bcc2c3;
    --accent: #a8790f;
    --accent-ink: #18140a;
    --amber: #85610f;
    --steel: #5c1220;
    --shadow: 0 1px 0 rgba(20,22,23,0.08);
    color-scheme: light;
  }
  @media (prefers-color-scheme: dark){
    :root{
      --bg: #18191b;
      --bg-elevated: #232629;
      --bg-sunken: #101112;
      --ink: #ece9e0;
      --ink-soft: #b6bcbe;
      --ink-faint: #82898c;
      --line: #34393c;
      --accent: #e6b53c;
      --accent-ink: #18140a;
      --amber: #dcac3a;
      --steel: #4a0f1a;
      color-scheme: dark;
    }
  }
  :root[data-theme="dark"]{
    --bg: #18191b; --bg-elevated: #232629; --bg-sunken: #101112;
    --ink: #ece9e0; --ink-soft: #b6bcbe; --ink-faint: #82898c;
    --line: #34393c; --accent: #e6b53c; --accent-ink: #18140a;
    --amber: #dcac3a; --steel: #4a0f1a; color-scheme: dark;
  }
  :root[data-theme="light"]{
    --bg: #e3e5e6; --bg-elevated: #eef0f0; --bg-sunken: #cbd0d1;
    --ink: #1c1f21; --ink-soft: #4d5457; --ink-faint: #767d80;
    --line: #bcc2c3; --accent: #a8790f; --accent-ink: #18140a;
    --amber: #85610f; --steel: #5c1220; color-scheme: light;
  }

  *,*::before,*::after{ box-sizing: border-box; }
  html{ -webkit-text-size-adjust:100%; }
  html{ overflow-x:hidden; }
  body{
    margin:0; background: var(--bg); color: var(--ink);
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 19px; line-height: 1.55; -webkit-font-smoothing: antialiased;
    overflow-x:hidden; max-width:100vw;
  }
  img,canvas{ display:block; max-width:100%; }
  a{ color: inherit; }
  .wrap{ max-width: 74rem; margin-inline:auto; padding-inline: clamp(1.25rem, 4vw, 2.5rem); }
  h1,h2,h3{
    font-family: "Outfit", "Arial Black", Arial, sans-serif;
    font-weight: 900; text-transform: uppercase;
    letter-spacing: -0.01em; text-wrap: balance; margin: 0; color: var(--ink);
  }
  .eyebrow{
    font-family: ui-monospace, "SF Mono", "Cascadia Mono", "Roboto Mono", Menlo, Consolas, monospace;
    font-size: 0.95rem; font-weight: 700; letter-spacing: 0.14em;
    text-transform: uppercase; color: var(--amber);
  }
  p{ color: var(--ink-soft); max-width: 42rem; font-weight: 700; }
  .num{ font-variant-numeric: tabular-nums; font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; }
  :focus-visible{ outline: 2px solid var(--accent); outline-offset: 3px; }

  .permit-bar{
    background: var(--bg-sunken); border-bottom: 1px solid var(--line);
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 0.72rem; letter-spacing: 0.04em; color: var(--ink-faint);
  }
  .permit-bar .wrap{ display:flex; justify-content:space-between; align-items:center; padding-block: 0.5rem; gap: 1rem; flex-wrap: wrap; }
  .permit-bar strong{ color: var(--ink-soft); font-weight: 600; }

  .site-header{ position: sticky; top:0; z-index: 40; background: var(--steel); border-bottom: 3px solid var(--accent); }
  .site-header .wrap{ max-width:none; display:flex; align-items:center; justify-content:space-between; padding-block: 1.1rem; gap: 2rem; flex-wrap:wrap; }
  .brand{ display:flex; align-items:center; text-decoration:none; }
  .brand-logo{ height: 80px; width:auto; display:block; }
  .footer-logo{ width: 320px; height:auto; max-width:100%; display:block; margin-bottom: 1rem; }
  nav.primary{ display:flex; align-items:center; gap: 2.25rem; flex-wrap:wrap; }
  nav.primary a{ text-decoration:none; color: #cfd3d4; font-size: 1.25rem; font-weight: 800; letter-spacing: 0.02em; position:relative; padding-bottom: 3px; }
  nav.primary a:hover{ color: var(--accent); }
  nav.primary a.call{
    background: var(--accent); color: var(--accent-ink); padding: 0.8rem 1.4rem;
    font-weight:800; letter-spacing:0.03em; font-size:1.3rem;
    clip-path: polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
  }
  nav.primary a.call:hover{ filter: brightness(1.12); }
  .nav-links{ display:flex; gap:1.75rem; }
  .nav-toggle{
    display:none; align-items:center; justify-content:center; width:44px; height:44px;
    background:none; border:1.5px solid rgba(207,211,212,0.5); border-radius:6px;
    cursor:pointer; flex:none; padding:0;
  }
  .nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
    content:""; display:block; width:20px; height:2px; background:#cfd3d4; position:relative;
    transition: transform 0.15s ease, opacity 0.15s ease;
  }
  .nav-toggle span::before{ position:absolute; top:-6px; }
  .nav-toggle span::after{ position:absolute; top:6px; }

  @media (max-width: 860px){
    .brand-logo{ height:52px; }
    nav.primary{ gap:1rem; }
    .nav-toggle{ display:flex; }
    .nav-links{
      display:none; flex-direction:column; align-items:flex-start; gap:0;
      width:100%; order:3; border-top:1px solid rgba(207,211,212,0.2); margin-top:1rem; padding-top:0.5rem;
    }
    .nav-links.open{ display:flex; }
    .nav-links a{ width:100%; padding:0.85rem 0; }
  }

  .hero{
    --hero-ink: #f3f2ef; --hero-ink-soft: #c7cbcc; --hero-gold: #e6b53c;
    position:relative; overflow:hidden; min-height: min(88vh, 720px);
    display:flex; align-items:center; border-bottom: 1px solid var(--line);
  }
  .hero-photo{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position: center 55%; }
  .hero-scrim{
    position:absolute; inset:0;
    background:
      linear-gradient(100deg, rgba(24,8,11,0.72) 0%, rgba(24,8,11,0.58) 30%, rgba(24,8,11,0.3) 60%, rgba(24,8,11,0.1) 100%),
      linear-gradient(to top, rgba(24,8,11,0.4), rgba(24,8,11,0) 42%);
  }
  .hero-canvas{ display:none; }
  .hero-ruler{ position:absolute; left:0; top:0; bottom:0; width: 34px; display:flex; flex-direction:column; justify-content:space-between; padding-block: 1.5rem; pointer-events:none; }
  .hero-ruler span{ display:block; font-family: ui-monospace, monospace; font-size: 0.62rem; color: var(--hero-ink-soft); border-top: 1px solid rgba(247,240,226,0.35); padding-top: 3px; width: 26px; }
  .hero-inner{ position:relative; z-index:2; width:100%; padding-block: clamp(3rem, 9vw, 5rem); max-width: 88rem; padding-inline: clamp(1rem, 3vw, 2rem); }
  .hero-copy{ max-width: 34rem; }
  .hero-copy .eyebrow{ color: var(--hero-gold); }
  .hero h1{ color: #9aa0a3; font-size: clamp(3rem, 8vw, 6.25rem); font-weight: 900; line-height: 0.94; margin-top: 0.9rem; max-width: 16ch; }
  .hero h1 em{ font-style:normal; color: inherit; }
  @media (max-width: 480px){
    .hero h1{ font-size: 2.5rem; }
    .hero-copy .eyebrow{ font-size:1.05rem !important; }
  }
  .hero .sub{ margin-top: 1.1rem; font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 0.95rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--hero-ink-soft); }
  .hero .sub b{ color: var(--hero-ink); }
  .hero-ctas{ display:flex; gap: 0.9rem; margin-top: 2.2rem; flex-wrap: wrap; }
  .hero-ctas .btn{ padding: 1.15rem 2rem; font-size: 1.2rem; }
  .hero-ctas .btn-line{ color: var(--hero-ink); box-shadow: inset 0 0 0 1.5px rgba(247,240,226,0.5); }
  .hero-ctas .btn-line:hover{ box-shadow: inset 0 0 0 1.5px rgba(247,240,226,0.85); background: rgba(247,240,226,0.08); }
  .btn{
    display:inline-flex; align-items:center; gap:0.5rem; text-decoration:none; font-weight:700;
    letter-spacing:0.02em; padding: 0.9rem 1.6rem; font-size: 1.05rem; cursor:pointer; border:none;
    clip-path: polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
    transition: filter 0.15s ease, transform 0.15s ease;
  }
  .btn:hover{ transform: translateY(-1px); }
  .btn-solid{ background: var(--accent); color: var(--accent-ink); }
  .btn-solid:hover{ filter: brightness(1.12); }
  .btn-line{ background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--line); }
  .btn-line:hover{ box-shadow: inset 0 0 0 1.5px var(--ink-soft); }

  section{ padding-block: clamp(3.5rem, 8vw, 6rem); }
  .section-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:2rem; margin-bottom: 2.5rem; flex-wrap:wrap; }
  .section-head h2{ font-size: clamp(1.8rem, 3.2vw, 2.6rem); margin-top:0.5rem; }
  .section-head p{ font-size: 1.2rem; }

  .reveal{ opacity:0; transform: translateY(12px); transition: opacity 0.35s ease-out, transform 0.35s ease-out; }
  .reveal.in{ opacity:1; transform:none; }
  @media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

  .dataplate{ background: var(--steel); border-block: 3px solid var(--accent); padding-block: 0; }
  .dataplate .wrap{ padding-block: 2.25rem; }
  .dataplate .eyebrow{ color: var(--accent); }
  .plate-grid{ display:grid; grid-template-columns: repeat(5,1fr); gap: 1.5rem; }
  .plate-item{ display:flex; flex-direction:column; align-items:flex-start; gap:0.75rem; }
  .plate-badge{ width: 42px; height:42px; border-radius:50%; background: var(--accent); display:flex; align-items:center; justify-content:center; flex:none; }
  .plate-item svg{ width:22px; height:22px; stroke: var(--accent-ink); flex:none; }
  .plate-item .label{ font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 0.72rem; letter-spacing:0.05em; text-transform:uppercase; color: #eceff0; font-weight: 700; }
  @media (max-width: 860px){ .plate-grid{ grid-template-columns: repeat(2,1fr); } }

  .services-grid{ display:grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); }
  @media (max-width: 900px){ .services-grid{ grid-template-columns: repeat(2,1fr); } }
  @media (max-width: 520px){ .services-grid{ grid-template-columns: 1fr; } }
  .service-card{
    background: var(--bg-elevated); padding: 1.75rem 1.5rem; display:flex; flex-direction:column; gap:0.85rem;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 14px 100%, 0 calc(100% - 14px));
    transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease; position: relative;
    text-decoration:none; cursor:pointer;
  }
  .service-card:hover{ background: var(--bg-sunken); transform: translateY(-4px); box-shadow: 0 12px 22px -10px rgba(0,0,0,0.4); z-index: 2; }
  @media (prefers-reduced-motion: reduce){ .service-card:hover{ transform:none; } }
  .service-card svg{ width:28px; height:28px; stroke: var(--accent); }
  .service-card h3{ font-size: 1.35rem; letter-spacing:0.01em; }
  .service-card p{ font-size: 1.1rem; margin:0; }
  .service-card .learn-more{
    margin-top:auto; padding-top:0.4rem; font-family: ui-monospace, monospace; font-size: 0.88rem;
    font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color: var(--accent);
  }
  .service-card:hover .learn-more{ text-decoration:underline; }

  /* ---------- service detail pages ---------- */
  .service-page-panel{ padding-block: 0; }
  .service-page-head{ padding-block: clamp(2.5rem, 6vw, 4rem) 2rem; }
  .back-link{
    display:inline-flex; align-items:center; gap:0.5rem; text-decoration:none; color: var(--amber);
    font-family: ui-monospace, monospace; font-size: 0.85rem; font-weight:700; letter-spacing:0.05em;
    text-transform:uppercase; margin-bottom:1.5rem;
  }
  .back-link:hover{ text-decoration:underline; }
  .service-lede{ font-size:1.15rem; margin-top:1rem; max-width:44rem; }
  .service-page-body{ display:grid; grid-template-columns: 1.4fr 1fr; gap:3rem; padding-block: 1rem clamp(3rem,6vw,5rem); align-items:start; }
  @media (max-width: 860px){ .service-page-body{ grid-template-columns: 1fr; } }
  .service-page-text p{ font-size:1.05rem; max-width:46rem; }
  .service-page-text h3{ font-size:1.3rem; margin-top:1.5rem; }
  .check-list{ list-style:none; margin:1rem 0 0; padding:0; display:flex; flex-direction:column; gap:0.7rem; }
  .check-list li{ display:flex; align-items:baseline; gap:0.7rem; font-size:1rem; color:var(--ink); font-weight:600; }
  .check-list li::before{
    content:""; width:10px; height:10px; flex:none;
    background: linear-gradient(var(--accent),var(--accent)) center/100% 2px no-repeat, linear-gradient(90deg,var(--accent),var(--accent)) center/2px 100% no-repeat;
    transform: translateY(1px);
  }
  .service-page-cta{
    background: var(--bg-elevated); border:1px solid var(--line); padding:1.75rem;
    display:flex; flex-direction:column; gap:1rem; align-items:flex-start;
  }
  .service-page-cta .phone{ font-family: ui-monospace, monospace; font-size:1.3rem; font-weight:700; }
  .service-nav{ background: var(--steel); border-block:3px solid var(--accent); }
  .service-nav .wrap{ display:flex; gap:0.6rem; flex-wrap:wrap; padding-block:1rem; }
  .service-nav a{
    text-decoration:none; color:#cfd3d4; font-size:0.82rem; font-weight:700; letter-spacing:0.02em;
    padding:0.5rem 0.9rem; border:1px solid rgba(255,255,255,0.15);
  }
  .service-nav a:hover, .service-nav a.active{ color: var(--accent-ink); background: var(--accent); border-color: var(--accent); }

  /* ---------- FAQ ---------- */
  .faq{ background: var(--bg); }
  .faq-list{ display:flex; flex-direction:column; gap:1px; background: var(--line); border:1px solid var(--line); max-width:56rem; }
  .faq-item{ background: var(--bg-elevated); }
  .faq-item summary{
    cursor:pointer; list-style:none; padding:1.25rem 1.5rem; font-weight:800; font-size:1.2rem;
    display:flex; justify-content:space-between; align-items:center; gap:1rem; color:var(--ink);
  }
  .faq-item summary::-webkit-details-marker{ display:none; }
  .faq-item summary::after{ content:"+"; font-size:1.4rem; color:var(--accent); flex:none; line-height:1; }
  .faq-item[open] summary::after{ content:"\2212"; }
  .faq-item p{ padding: 0 1.5rem 1.5rem; margin:0; font-size:1.1rem; max-width:none; }

  .why{ background: var(--bg-sunken); border-block: 1px solid var(--line); }
  .why .wrap{ display:grid; grid-template-columns: 1.1fr 1fr; gap: 3rem; align-items:center; }
  @media (max-width: 860px){ .why .wrap{ grid-template-columns: 1fr; } }
  .why .wrap p{ font-size: 1.15rem; }
  .why-list{ list-style:none; margin: 1.5rem 0 0; padding:0; display:flex; flex-direction:column; gap: 0.9rem; }
  .why-list li{ display:flex; align-items:baseline; gap: 0.8rem; font-size: 1.2rem; color: var(--ink); font-weight:600; }
  .why-list li::before{
    content:""; width: 11px; height: 11px; flex:none;
    background: linear-gradient(var(--accent),var(--accent)) center/100% 2px no-repeat, linear-gradient(90deg,var(--accent),var(--accent)) center/2px 100% no-repeat;
    transform: translateY(1px);
  }
  .why-visual{ position:relative; aspect-ratio: 4/3; border:1px solid var(--line); overflow:hidden; }
  .why-visual canvas{ width:100%; height:100%; }
  .why-visual img{ width:100%; height:100%; object-fit:cover; display:block; }

  .fleet{ --bay-bg: #1a0a0d; --bay-panel: #271217; --bay-line: #40202a; --bay-accent: #e6b53c; --bay-text: #eceae4; --bay-text-soft: #a6acae; background: var(--bay-bg); color: var(--bay-text); }
  .fleet .section-head p{ color: var(--bay-text-soft); }
  .fleet .section-head h2{ color: var(--bay-text); }
  .fleet .eyebrow{ color: var(--bay-accent); }
  .fleet-grid{ display:grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--bay-line); border: 1px solid var(--bay-line); }
  @media (max-width: 720px){ .fleet-grid{ grid-template-columns: 1fr; } }
  .fleet-card{ background: var(--bay-panel); padding: 1.75rem 1.75rem 2rem; display:flex; flex-direction:column; gap: 1rem; }
  .fleet-photo{ aspect-ratio: 4 / 3; overflow:hidden; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 16px), calc(100% - 16px) 100%, 0 100%); }
  .fleet-photo img{ width:100%; height:100%; object-fit:cover; display:block; transition: transform 0.5s ease; }
  .fleet-card:hover .fleet-photo img{ transform: scale(1.06); }
  .fleet-card h3{ color: var(--bay-text); font-size: 1.6rem; }
  .fleet-card p{ color: #c3c8ca; font-size: 1.2rem; margin:0; }
  .fleet-card .tag{ font-family: ui-monospace, monospace; font-size: 0.88rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--bay-accent); }

  .cta-banner{ background: var(--accent); color: var(--accent-ink); text-align:left; }
  .cta-banner .wrap{ display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap; }
  .cta-banner h2{ color: var(--accent-ink); font-size: clamp(1.9rem,4vw,3rem); }
  .cta-banner .phone{ font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: clamp(1.6rem, 3.4vw, 2.4rem); font-weight:700; letter-spacing:0.02em; }
  .cta-banner .btn-line{ box-shadow: inset 0 0 0 1.5px var(--accent-ink); color: var(--accent-ink); }
  .cta-banner .btn-line:hover{ box-shadow: inset 0 0 0 1.5px var(--accent-ink); background: color-mix(in srgb, var(--accent-ink) 14%, transparent); }

  /* ---------- quote form ---------- */
  .quote{ background: var(--bg-elevated); border-block: 1px solid var(--line); }
  .quote .wrap{ display:grid; grid-template-columns: 1fr 1.2fr; gap: 3.5rem; align-items:start; }
  @media (max-width: 860px){ .quote .wrap{ grid-template-columns: 1fr; } }
  .quote-list{ list-style:none; margin: 1.5rem 0 0; padding:0; display:flex; flex-direction:column; gap: 0.9rem; }
  .quote-list li{ display:flex; align-items:baseline; gap: 0.8rem; font-size: 1.15rem; color: var(--ink); font-weight:600; }
  .quote-list li::before{ content:""; width: 11px; height: 11px; flex:none; background: linear-gradient(var(--accent),var(--accent)) center/100% 2px no-repeat, linear-gradient(90deg,var(--accent),var(--accent)) center/2px 100% no-repeat; transform: translateY(1px); }
  .quote-form{ background: var(--bg); border: 1px solid var(--line); padding: 2rem; display:flex; flex-direction:column; gap: 1.1rem; }
  .quote-form .row{ display:grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; }
  @media (max-width: 520px){ .quote-form .row{ grid-template-columns: 1fr; } }
  .field{ display:flex; flex-direction:column; gap: 0.4rem; }
  .field label{ font-family: ui-monospace, monospace; font-size: 0.78rem; letter-spacing:0.1em; text-transform:uppercase; color: var(--ink-faint); font-weight:700; }
  .field input, .field select, .field textarea{
    background: var(--bg-elevated); border: 1px solid var(--line); color: var(--ink);
    padding: 0.75rem 0.85rem; font-family: inherit; font-size: 1.05rem; font-weight:600;
  }
  .field textarea{ resize: vertical; min-height: 5.5rem; }
  .field input:focus, .field select:focus, .field textarea:focus{ outline: 2px solid var(--accent); outline-offset: 1px; }
  .quote-form .btn{ align-self:flex-start; margin-top:0.3rem; }
  .quote-note{ font-size: 0.88rem; color: var(--ink-faint); max-width:none; margin-top:-0.3rem; }
  .form-status{ font-size: 0.95rem; font-weight:700; display:none; }
  .form-status.show{ display:block; }

  footer{ background: var(--steel); border-top: 3px solid var(--accent); padding-block: 3rem 2rem; color:#cfd3d4; }
  footer p{ color:#cfd3d4; }
  .footer-grid{ display:grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 2.5rem; }
  @media (max-width: 720px){ .footer-grid{ grid-template-columns: 1fr; } }
  footer h4{ font-family: ui-monospace, monospace; font-size: 0.8rem; letter-spacing:0.14em; text-transform:uppercase; color: var(--accent); margin: 0 0 0.8rem; }
  footer ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:0.5rem; }
  footer ul li{ font-size:1.05rem; color: #cfd3d4; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }
  footer ul a{ text-decoration:none; color: inherit; font-size:inherit; font-family:inherit; }
  footer ul a:hover{ color: var(--accent); }
  .license-stamp{ display:inline-flex; align-items:center; gap:0.6rem; border: 1.5px solid var(--accent); color: var(--accent); padding: 0.5rem 0.85rem; font-family: ui-monospace, monospace; font-size: 0.88rem; letter-spacing: 0.05em; margin-top: 0.9rem; }
  .veteran-badge{ display:inline-flex; align-items:center; gap:0.75rem; margin-top: 1rem; color:#cfd3d4; font-size:1.15rem; font-weight:700; letter-spacing:0.02em; }
  .veteran-badge img{ width:72px; height:auto; border-radius:3px; flex:none; }
  .footer-bottom{ margin-top: 2.75rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,0.18); display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-size: 0.9rem; color: #a49da3; }
  img{ max-width:100%; }
  .service-page-panel{ display:block; }