/* Contact Page */

#contact-page    { background: var(--cream); }
#contact-faq     { background: var(--creamD); }
#contact-map-sec { background: var(--cream); padding: 0; }

/* ── Map wrapper ── */
.map-wrapper {
  border-radius: 18px; overflow: hidden;
  box-shadow: var(--sh-md); height: 420px;
}
.map-wrapper iframe { width: 100%; height: 100%; border: 0; display: block; }

/* ── Full contact grid with map ── */
.contact-full-grid {
  display: grid; grid-template-columns: 1fr 1.5fr; gap: 60px; align-items: start;
}

/* ── Opening hours table ── */
.hours-table { width: 100%; margin-top: 24px; }
.hours-table tr { border-bottom: 1px solid var(--creamD); }
.hours-table td { padding: 9px 0; font-size: 13.5px; color: var(--brown); }
.hours-table td:last-child { text-align: right; color: var(--g7); font-weight: 500; }
.hours-today td { color: var(--g7); font-weight: 600; }
.hours-closed td:last-child { color: var(--gray); font-weight: 400; }

/* ── Social contact cards ── */
.social-cards { display: grid; grid-template-columns: repeat(2,1fr); gap: 14px; margin-top: 28px; }
.soc-card {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 18px; background: var(--white); border-radius: 12px;
  box-shadow: var(--sh-sm); transition: var(--ease); text-decoration: none;
}
.soc-card:hover { transform: translateY(-3px); box-shadow: var(--sh-md); }
.soc-card-ico {
  width: 38px; height: 38px; border-radius: 10px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; color: var(--white);
}
.soc-ig   { background: linear-gradient(135deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888); }
.soc-fb   { background: #1877F2; }
.soc-wa   { background: #25D366; }
.soc-yt   { background: #FF0000; }
.soc-card-label { font-size: 11px; color: var(--gray); }
.soc-card-handle { font-size: 13px; font-weight: 600; color: var(--brown); }

@media (max-width: 1024px) {
  .contact-full-grid { grid-template-columns: 1fr; }
  .map-wrapper { height: 320px; }
}
@media (max-width: 768px) {
  .social-cards { grid-template-columns: 1fr 1fr; }
  .map-wrapper { height: 260px; }
}
@media (max-width: 480px) {
  .social-cards { grid-template-columns: 1fr; }
}