/* Theme tokens for Two Peaks Fleet Services. This file is the only thing that
   changes the look. The layout lives in site.css and is identical on every template. */
:root{
    --bg:#ffffff;
    --bg-alt:#f3f6f6;
    --ink:#1c2224;
    --body:#454c4f;
    --muted:#6a7275;
    --line:#e1e5e6;
    --line-soft:#ebeeef;
    --line-hover:#cdd3d5;

    --brand:#146c74;
    --brand-dark:#0e5058;
    --brand-light:#6cc4c9;
    --brand-soft:#e4f1f2;
    --brand-shadow:rgba(20,108,116,.25);

    --hero-scrim:rgba(22,28,30,.94);
    --hero-scrim-2:rgba(20,108,116,.55);

    --display:'Montserrat', system-ui, sans-serif;
    --sans:'Source Sans 3', system-ui, sans-serif;

    --radius:6px;
    --radius-lg:10px;
    --btn-radius:4px;

    --shadow-sm:0 1px 2px rgba(16,32,46,.06), 0 1px 3px rgba(16,32,46,.05);
    --shadow:0 10px 30px rgba(16,32,46,.09);

    --gutter:20px;
    --maxw:1160px;
}

/* Site-specific touches */
.topbar{border-bottom:3px solid #146c74;}
body .nav-logo img{height:46px;}
body .footer-brand .nav-logo img{height:50px;}
body a.card:hover{border-color:var(--brand);}
body a.card p{color:var(--body);}
body a.card h3{color:var(--ink);}
@media (min-width:981px){body .grid-3:has(> .svc:nth-child(4):last-child){grid-template-columns:repeat(4,1fr);gap:18px;}}
body .svc p{color:var(--body);}
body .svc h3{color:var(--ink);}
body .footer-brand a[href^="mailto"]{color:#9fd6da;}