/* Park My Box v10 — shared site chrome (header + footer) extracted from the
   mockup style.css so every page carries the new design's header & footer.
   Scoped to chrome class-names only; inner-page content stays on Tailwind. */
:root{--green:#16a34a;--green-dark:#0f8a3d;--navy:#081a33}

.container{max-width:1180px;margin:0 auto;padding:0 28px}

/* ---------- header ---------- */
.site-header{height:86px;background:#fff;border-bottom:1px solid #edf2f7;position:sticky;top:0;z-index:30}
.header-inner{height:100%;display:flex;align-items:center;gap:34px}
.brand{display:flex;align-items:center;gap:12px;min-width:245px;text-decoration:none}
.brand-mark{width:48px;height:48px;display:block;flex:0 0 48px}
.brand-mark svg{display:block;width:100%;height:100%}
.brand-text strong{display:block;font-size:29px;line-height:1;letter-spacing:-.9px;color:var(--navy)}
.brand-text small{display:block;margin-top:4px;color:var(--green);text-transform:uppercase;font-size:13px;font-weight:900;letter-spacing:4px}
.main-nav{display:flex;gap:42px;margin-left:auto;font-size:15px;font-weight:800;color:#0d1c32}
.main-nav a{color:inherit;text-decoration:none}
.heart{font-size:27px;margin-left:22px;color:#0d1c32;text-decoration:none}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 24px;border-radius:9px;border:0;font-weight:900;cursor:pointer;white-space:nowrap;text-decoration:none}
.btn-primary{background:var(--green);color:#fff;box-shadow:0 12px 24px rgba(22,163,74,.20)}
.btn-outline{background:#fff;color:var(--green);border:2px solid var(--green);box-shadow:none}

/* ---------- footer ---------- */
.site-footer{padding:58px 0 36px;margin-top:64px;background:radial-gradient(circle at 18% 0%,#0d5f36 0,#053e26 45%,#01291c 100%);color:#fff}
.footer-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr 1fr;gap:58px}
.footer-brand{text-decoration:none}
.footer-brand .brand-text strong{color:#fff}
.footer-brand .brand-text small{display:none}
.site-footer p{max-width:280px;margin:18px 0 20px;color:#d8f2df}
.site-footer h4{margin:0 0 14px;color:#fff;font-size:16px}
.site-footer nav a{display:block;margin-bottom:10px;color:#d8f2df;text-decoration:none}
.site-footer nav a:hover{color:#fff}
.socials{display:flex;gap:11px}
.socials a{width:36px;height:36px;border-radius:999px;display:grid;place-items:center;color:#fff;background:rgba(255,255,255,.12);font-weight:900;text-decoration:none}
.copyright{text-align:center;color:#bfe1c8;margin-top:42px;font-size:14px}

@media(max-width:1000px){
  .main-nav,.heart{display:none}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:650px){
  .container{padding:0 18px}
  .site-header{height:auto;padding:16px 0}
  .header-inner .btn{display:none}
  .brand-text strong{font-size:22px}
  .footer-grid{grid-template-columns:1fr}
}