/* Local Hero SEO — layout: wrap, header, grids, footer, sticky bar.
   Ported verbatim from the approved mockup. Mobile nav panel is an addition
   (the mockup shipped only the burger button). */

.wrap{max-width:var(--container);margin-inline:auto;padding-inline:var(--pad)}
section{padding-block:var(--section-y)}

/* ---------- Header ---------- */
.site-header{
  position:sticky;top:0;z-index:60;background:rgba(247,249,253,.88);
  backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--line);
}
.header-inner{display:flex;align-items:center;gap:var(--s4);min-height:78px}
.brand{flex:none;width:clamp(148px,19vw,200px)}
.brand img{width:100%;height:auto}
.nav{margin-left:auto;display:none;gap:1.75rem;align-items:center}
@media(min-width:1024px){.nav{display:flex}}
.nav a{
  font-family:var(--font-data);font-weight:600;text-transform:uppercase;
  letter-spacing:.13em;font-size:.9375rem;text-decoration:none;color:var(--navy-ink);
  padding-block:.35rem;position:relative;
}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform var(--ease)}
.nav a:hover::after{transform:scaleX(1)}
.header-cta{margin-left:var(--s3);display:none}
@media(min-width:1024px){.header-cta{display:inline-flex}}
.burger{margin-left:auto;display:inline-flex;background:transparent;color:var(--navy);border:1px solid var(--line-strong);border-radius:var(--r-sm);padding:.7rem 1rem;font-family:var(--font-data);font-weight:600;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;font-size:.9375rem}
@media(min-width:1024px){.burger{display:none}}

/* Mobile nav panel — addition. Toggled by the burger button. */
.mobile-nav{
  display:none;background:var(--navy-ink);border-bottom:1px solid rgba(255,255,255,.09);
}
.mobile-nav.is-open{display:block}
@media(min-width:1024px){.mobile-nav{display:none!important}}
.mobile-nav-inner{display:grid;gap:.25rem;padding-block:var(--s3)}
.mobile-nav a{
  font-family:var(--font-data);font-weight:600;text-transform:uppercase;letter-spacing:.13em;
  font-size:1.0625rem;color:var(--white);text-decoration:none;padding:.85rem .25rem;
  border-bottom:1px solid rgba(255,255,255,.08);min-height:44px;display:flex;align-items:center;
}
.mobile-nav a:last-child{border-bottom:0}
.mobile-nav .btn{margin-top:var(--s3);width:100%}

/* ---------- Grids: explicit, never auto-fit ---------- */
.grid-2{display:grid;gap:var(--s3);grid-template-columns:1fr}
.grid-3{display:grid;gap:var(--s3);grid-template-columns:1fr}
.grid-4{display:grid;gap:var(--s3);grid-template-columns:1fr}
@media(min-width:620px){.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(min-width:680px){.grid-2{grid-template-columns:repeat(2,1fr)}}
@media(min-width:900px){.grid-3{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1024px){.grid-4{grid-template-columns:repeat(4,1fr)}}

/* ---------- Footer ---------- */
.site-footer{background:var(--navy-ink);color:var(--caption);padding-block:var(--s8) var(--s4);font-size:var(--t-sm);border-top:1px solid rgba(255,255,255,.09)}
.footer-grid{display:grid;gap:var(--s5);grid-template-columns:1fr}
@media(min-width:620px){.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:980px){.footer-grid{grid-template-columns:1.4fr 1fr 1fr 1fr}}
.footer-brand img{width:190px;margin-bottom:var(--s3)}
.footer-brand p{max-width:34ch;line-height:1.65}
.site-footer h4{font-family:var(--font-data);font-weight:600;text-transform:uppercase;letter-spacing:.2em;font-size:.75rem;color:var(--white);margin:0 0 var(--s3)}
.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:.65rem}
.site-footer a{text-decoration:none;transition:color var(--ease)}
.site-footer a:hover{color:var(--white)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.09);margin-top:var(--s8);padding-top:var(--s4);display:flex;flex-wrap:wrap;gap:var(--s2);justify-content:space-between;font-size:var(--t-xs);color:var(--dim)}

/* ---------- Sticky mobile CTA ---------- */
.mobile-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:70;display:flex;gap:.5rem;
  padding:.65rem .75rem calc(.65rem + env(safe-area-inset-bottom));
  background:rgba(11,23,48,.97);backdrop-filter:blur(10px);
  border-top:1px solid rgba(255,255,255,.1);
}
.mobile-bar .btn{flex:1;padding:.85rem .5rem;font-size:.9375rem}
body{padding-bottom:78px}
@media(min-width:1024px){.mobile-bar{display:none}body{padding-bottom:0}}
