/* ============================================================
   MapDog — "Local Trust" skin · shared stylesheet
   Audience: local SMB owners. Plain-spoken, warm, zero jargon.
   Design system: Skin 02 (see _design-system/index.html)
   ============================================================ */
:root {
  --cream:#FBF7EF; --cream-2:#F4EEE0; --white:#FFFFFF;
  --navy:#16466E; --navy-deep:#0E2F4D; --ink:#16263B; --ink-2:#41566B;
  --amber:#F5A623; --amber-deep:#C8881F; --green:#1F9D5B; --green-deep:#16834A;
  --line:#ECE3D2; --line-2:#DED2BB;
  --shadow-sm:0 4px 14px rgba(22,38,59,0.06);
  --shadow-md:0 10px 30px rgba(22,38,59,0.09);
  --shadow-btn:0 4px 0 var(--amber-deep);
  --r:14px; --r-lg:20px; --r-sm:10px;
  --font-display:"Bricolage Grotesque",system-ui,sans-serif;
  --font-body:"Inter",system-ui,sans-serif;
  --pad:clamp(20px,5vw,72px); --max:1180px;
}
*, *::before, *::after { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--cream); color:var(--ink); font-family:var(--font-body); font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased; }
::selection { background:var(--amber); color:var(--ink); }
h1,h2,h3,h4 { font-family:var(--font-display); font-weight:800; letter-spacing:-0.02em; line-height:1.08; margin:0; color:var(--ink); }
p { margin:0; }
a { color:var(--navy); text-decoration:none; }
img { max-width:100%; display:block; }

/* layout */
.container { max-width:var(--max); margin:0 auto; padding-left:var(--pad); padding-right:var(--pad); }
.eyebrow { font-family:var(--font-body); font-size:14px; font-weight:700; letter-spacing:0.04em; text-transform:uppercase; color:var(--amber-deep); display:inline-flex; align-items:center; gap:8px; }

/* top trust banner */
.trust-banner { background:var(--navy); color:#fff; text-align:center; font-size:14.5px; padding:11px var(--pad); font-weight:500; }
.trust-banner strong { color:var(--amber); }
.trust-banner a { color:#fff; text-decoration:underline; text-underline-offset:2px; }

/* header */
.site-header { position:sticky; top:0; z-index:60; background:rgba(251,247,239,0.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
.site-header .inner { max-width:var(--max); margin:0 auto; padding:14px var(--pad); display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:flex; align-items:center; gap:10px; font-family:var(--font-display); font-weight:800; font-size:21px; color:var(--ink); letter-spacing:-0.02em; }
.brand .pin { width:32px; height:32px; flex-shrink:0; }
.brand .pin svg { width:100%; height:100%; display:block; }
.nav { display:flex; align-items:center; gap:28px; }
.nav a { color:var(--ink-2); font-weight:600; font-size:15.5px; }
.nav a:hover { color:var(--navy); }
@media (max-width:860px){ .nav .nav-link { display:none; } }

/* buttons */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; font-family:var(--font-body); font-weight:700; font-size:16px; padding:14px 24px; border-radius:var(--r); border:none; cursor:pointer; transition:transform 120ms ease, box-shadow 120ms ease; text-align:center; }
.btn-primary { background:var(--amber); color:var(--ink); box-shadow:var(--shadow-btn); }
.btn-primary:hover { transform:translateY(-1px); box-shadow:0 6px 0 var(--amber-deep); }
.btn-primary:active { transform:translateY(3px); box-shadow:0 1px 0 var(--amber-deep); }
.btn-navy { background:var(--navy); color:#fff; box-shadow:0 4px 0 var(--navy-deep); }
.btn-navy:hover { transform:translateY(-1px); box-shadow:0 6px 0 var(--navy-deep); }
.btn-ghost { background:transparent; color:var(--navy); box-shadow:inset 0 0 0 2px var(--navy); }
.btn-ghost:hover { background:var(--navy); color:#fff; }
.btn-lg { padding:17px 30px; font-size:17.5px; }
.btn-sm { padding:10px 18px; font-size:15px; }

/* pills / badges */
.pill { display:inline-flex; align-items:center; gap:6px; font-size:13.5px; font-weight:700; padding:6px 14px; border-radius:20px; }
.pill-green { background:var(--green); color:#fff; }
.pill-amber { background:rgba(245,166,35,0.18); color:var(--amber-deep); }
.pill-navy { background:rgba(22,70,110,0.1); color:var(--navy); }

/* cards */
.card { background:var(--white); border:1px solid var(--line); border-radius:var(--r); padding:28px; box-shadow:var(--shadow-sm); }

/* sections */
.section { padding:clamp(56px,8vw,104px) 0; }
.section-head { max-width:62ch; }
.section-head .eyebrow { margin-bottom:16px; }
.section-head h2 { font-size:clamp(30px,4.4vw,46px); }
.section-head p { color:var(--ink-2); font-size:clamp(17px,1.8vw,20px); margin-top:18px; line-height:1.6; }

/* footer */
.site-footer { background:var(--navy-deep); color:rgba(255,255,255,0.75); padding:clamp(48px,7vw,80px) 0 36px; }
.site-footer .cols { display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:40px; }
@media (max-width:760px){ .site-footer .cols { grid-template-columns:1fr 1fr; gap:32px; } }
.site-footer .brand { color:#fff; margin-bottom:14px; }
.site-footer p { font-size:15px; line-height:1.6; max-width:40ch; }
.site-footer h5 { color:#fff; font-family:var(--font-body); font-size:13px; letter-spacing:0.1em; text-transform:uppercase; margin:0 0 14px; }
.site-footer ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.site-footer a { color:rgba(255,255,255,0.75); font-size:15px; }
.site-footer a:hover { color:var(--amber); }
.site-footer .bar { margin-top:40px; padding-top:24px; border-top:1px solid rgba(255,255,255,0.12); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:13.5px; color:rgba(255,255,255,0.55); }