/* =============================================================
   CONTACT + FOOTER
   ============================================================= */
.contact-section { position: relative; z-index: 10; padding: 40px 0; scroll-margin-top: 96px; background: linear-gradient(180deg, #0b0b0b, #060606); border-top: 1px solid rgba(255,255,255,.08); }
.contact-grid { display: grid; grid-template-columns: .9fr .8fr 1.2fr; gap: 28px; align-items: stretch; }
.contact-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.contact-list li { display: grid; grid-template-columns: 30px 1fr; gap: 14px; align-items: start; color: #fff; font-size: 1.02rem; }
.contact-list span { color: var(--yellow); font-size: 1.5rem; line-height: 1; }
.contact-list a:hover { color: var(--yellow); }
.hours-list { margin: 0 0 22px; display: grid; gap: 14px; }
.hours-list div { display: grid; grid-template-columns: 1fr auto; gap: 20px; }
.hours-list dt { color: #fff; font-weight: 800; }
.hours-list dd { margin: 0; color: var(--muted); }
.map-card { position: relative; min-height: 210px; overflow: hidden; border: 1px solid rgba(255,255,255,.18); border-radius: 4px; background: #141414; }
.map-card img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.2) brightness(.5); opacity: .9; }
/* map-preview.png is a Google Maps screenshot with its own place-card
   baked in; without this scrim it shows through behind .map-label and
   reads as duplicated, ghosted address text. */
.map-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, rgba(5,5,5,.58) 10%, rgba(5,5,5,.94) 62%);
  pointer-events: none;
}
.map-pin { position: absolute; left: 48%; top: 41%; width: 20px; height: 20px; background: var(--yellow); border: 3px solid #060606; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); box-shadow: 0 0 22px rgba(255,212,0,.55); animation: pin 2.8s ease-in-out infinite; }
@keyframes pin { 0%,100% { box-shadow: 0 0 0 0 rgba(255,212,0,.4), 0 0 22px rgba(255,212,0,.5); } 50% { box-shadow: 0 0 0 12px rgba(255,212,0,0), 0 0 28px rgba(255,212,0,.6); } }
.map-label { position: absolute; right: 22px; top: 50%; transform: translateY(-50%); width: min(220px, 46%); padding: 16px; border-radius: 6px; background: rgba(8,8,8,.88); box-shadow: 0 14px 30px rgba(0,0,0,.4); color: #fff; }
.map-label strong { display: block; margin-bottom: 8px; font-family: var(--font-head); text-transform: uppercase; letter-spacing: .04em; }

.site-footer { position: relative; z-index: 10; background: #060606; padding: 22px 0; border-top: 1px solid rgba(255,255,255,.06); }
.footer-grid { display: grid; grid-template-columns: 1fr auto auto; gap: 24px; align-items: center; color: #d8d8d8; }
.footer-tag { display: flex; align-items: center; gap: 12px; color: #fff; font-weight: 700; margin: 0; }
.footer-tag img { width: 34px; height: 34px; object-fit: contain; }
.footer-grid p { margin: 0; }
.socials { display: flex; gap: 12px; }
.socials a { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--yellow); color: #000; font-weight: 900; transition: transform .2s ease, box-shadow .2s ease; }
.socials a svg { display: block; }
.socials a:hover { transform: translateY(-3px) scale(1.05); box-shadow: 0 10px 18px rgba(255,212,0,.2); }
