/* Make all paragraph text white */
p {
  color: #fff;
}
/* WhatsApp Floating Button and Popup */
.whatsapp-fab {
  position: fixed;
  right: 1.25rem;
  bottom: 1.25rem;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #25D366;
  box-shadow: 0 8px 24px rgba(0,0,0,0.25), inset 0 0 0 2px rgba(255,255,255,0.2);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  z-index: 1100;
}
.whatsapp-fab svg { width: 78%; height: 78%; }
.whatsapp-fab img { width: 78%; height: 78%; display:block; }
.whatsapp-fab:hover { transform: translateY(-2px) scale(1.03); box-shadow: 0 12px 28px rgba(0,0,0,0.3), inset 0 0 0 2px rgba(255,255,255,0.25);} 
.whatsapp-fab:active { transform: translateY(0) scale(0.98);} 

.whatsapp-popup {
  position: fixed;
  right: calc(1.25rem + 64px + 0.75rem); /* to the left of the FAB */
  bottom: 1.25rem; /* align baseline with FAB */
  max-width: 240px; /* a bit smaller */
  background: #111;
  color: #f6f6f6;
  border: 1px solid rgba(255,226,161,0.35);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(0,0,0,0.4);
  overflow: hidden;
  opacity: 0;
  transform: translateX(10px);
  pointer-events: none;
  transition: opacity 0.25s ease, transform 0.25s ease;
  z-index: 1100;
}
.whatsapp-popup.show { opacity: 1; transform: translateX(0); pointer-events: auto; }
.whatsapp-popup .popup-content { padding: 0.6rem 0.8rem; font-size: 0.95rem; }
.whatsapp-popup .popup-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.35rem; }
.whatsapp-popup .popup-title { font-weight: 700; color: #FFE2A1; }
.whatsapp-popup .popup-close { background: transparent; border: none; color: #aaa; font-size: 1.2rem; cursor: pointer; }
.whatsapp-popup .popup-close:hover { color: #fff; }
.whatsapp-popup p { margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* On small screens, move popup above FAB to avoid horizontal overflow */
@media (max-width: 600px) {
  .whatsapp-popup {
    right: 1rem;
    bottom: calc(1rem + 64px + 0.5rem);
    max-width: 88vw;
    transform: translateY(10px);
  }
  .whatsapp-popup.show { transform: translateY(0); }
}

/* WhatsApp label next to FAB (hidden on narrow screens) */
.whatsapp-label {
  position: fixed;
  right: calc(1.25rem + 64px + 0.75rem);
  bottom: 1.25rem;
  background: #111;
  color: #f6f6f6;
  border: 1px solid rgba(255,226,161,0.35);
  border-radius: 999px;
  padding: 0.45rem 0.75rem;
  font-size: 0.95rem;
  line-height: 1;
  box-shadow: 0 8px 24px rgba(0,0,0,0.25);
  z-index: 1100;
}
.whatsapp-label a { color: #f6f6f6; text-decoration: none; font-weight: 600; }
.whatsapp-label a:hover { color: #fff; text-decoration: underline; }
@media (max-width: 900px) {
  .whatsapp-label { display: none; }
}

/* Enlarge WhatsApp icon in contact row */
.info-row .info-icon svg,
.info-row .info-icon img {
  width: 24px;
  height: 24px;
}
.info-row .info-icon svg { aspect-ratio: 1 / 1; }
.info-row .info-icon svg,
.info-row .info-icon svg * {
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Ensure scroll-to-top sits above WhatsApp FAB */
#scrollToTopBtn {
  right: 1.25rem; /* align with FAB */
  bottom: calc(1.25rem + 64px + 0.75rem); /* FAB height + gap */
  z-index: 1099; /* just below FAB if they overlap */
}
/* Footer watermark logo sizing */
.footer-watermark img {
  max-width: 200px;
  height: auto;
}
@media (max-width: 900px) {
  .footer-watermark img { max-width: 150px; }
}

@media (max-width: 900px) {
  #scrollToTopBtn {
    right: 1rem;
    bottom: calc(1rem + 64px + 0.75rem);
  }
}
/* --- Global Typography and Section Divider --- */
h1, h2, h3, h4, h5, h6, .logo {
  font-family: 'Playfair Display', serif;
  letter-spacing: 0.5px;
}
:root {
  --accent: #FFE2A1;
  --accent-rgb: 255,226,161;
  --accent-dark: #D1A65A; /* harmonized darker gold */
}
/* Visually hidden utility (still accessible to screen readers) */
.visually-hidden { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0 0 0 0) !important; white-space:nowrap !important; border:0 !important; }
.section-divider {
  width: 100%;
  height: 4px;
  margin: 2.5rem 0 2rem 0;
  border: none;
  border-radius: 2px;
  opacity: 0.95;
  position: relative;
  overflow: hidden;
}
.gold-gradient-divider {
  background: linear-gradient(90deg, rgba(255,255,255,0.95) 0%, var(--accent) 100%);
}
.animate-divider::before {
  content: "";
  position: absolute;
  left: -40%;
  top: 0;
  width: 40%;
  height: 100%;
  background: linear-gradient(90deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.0) 100%);
  animation: divider-glow 2.5s linear infinite;
}
@keyframes divider-glow {
  0% { left: -40%; }
  60% { left: 100%; }
  100% { left: 100%; }
}
.products, .about, .gallery, .reviews, .contact {
  position: relative;
}
.products:before, .about:before, .gallery:before, .reviews:before, .contact:before {
  content: '';
  display: block;
  width: 100px;
  height: 3px;
  /* Base white→gold gradient with a moving white shimmer overlay */
  background-image:
    linear-gradient(90deg, rgba(255,255,255,0.95) 0%, var(--accent) 100%),
    linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.35) 50%, rgba(255,255,255,0) 100%);
  background-size: 100% 100%, 40% 100%;
  background-position: 0 0, -40% 0;
  background-repeat: no-repeat;
  border-radius: 2px;
  margin: 0 auto 2rem auto;
  animation: section-line-shimmer 2.6s linear infinite;
}

@keyframes section-line-shimmer {
  0%   { background-position: 0 0, -40% 0; }
  60%  { background-position: 0 0, 100% 0; }
  100% { background-position: 0 0, 100% 0; }
}
/* --- Contact Section Layout --- */
.contact-flex {
  display:grid;
  gap:2.5rem;
  grid-template-columns:repeat(auto-fit,minmax(340px,1fr));
  align-items:stretch;
  justify-content:center;
  margin:0 auto 2rem;
  max-width:1100px;
}
.contact-info-card {
  background: #2d2d2d;
  border-radius: 1rem;
  padding: 1.5rem 1.5rem 1.2rem 1.5rem;
  color: #F6E7B6;
  box-shadow: 0 2px 8px rgba(246,231,182,0.08);
  min-width: 260px;
  max-width: 480px;
  flex: 1 1 420px;
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
  align-self: stretch;
}
.contact-panel { background:#2d2d2d; border-radius:1rem; box-shadow:0 2px 8px rgba(246,231,182,0.08); display:flex; flex-direction:column; position:relative; }
.contact-panel { padding:1.5rem 1.5rem 1.25rem; }
.contact-panel > *:last-child { margin-bottom:0; }
.contact-panel::after { content:""; position:absolute; inset:0; border:1px solid rgba(255,226,161,0.08); border-radius:inherit; pointer-events:none; }
.info-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1rem;
  margin-bottom: 0.2rem;
}
.info-icon {
  color: var(--accent);
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.info-main {
  font-weight: 500;
}
.social-row .social-links {
  display: flex;
  gap: 0.7rem;
  margin-left: 0;
  justify-content: center;
  width: 100%;
}
.social-row {
  display: flex;
  align-items: center;
  justify-content: center;
}
.contact-form-wrap {
  flex: 1 1 320px;
  min-width: 270px;
  max-width: 500px;
  display: flex;
  align-items: stretch;
}
@media (max-width: 900px) {
  .contact-flex {
    flex-direction: column;
    gap: 1.5rem;
    align-items: stretch;
  }
  .contact-info-card, .contact-form-wrap {
    max-width: 100%;
    min-width: 0;
  }
}
/* --- Contact Form & Opening Hours --- */
.opening-hours {
  background: #2d2d2d;
  border-radius: 1rem;
  padding: 1.2rem 1.5rem;
  margin-bottom: 2rem;
  color: #F6E7B6;
  box-shadow: 0 2px 8px rgba(246,231,182,0.08);
}

/* Form status message */
.form-status {
  margin-top: 0.75rem;
  color: #00c853;
  font-weight: 600;
}
.opening-hours h3 {
  margin-top: 0;
  color: var(--accent);
  font-size: 1.2rem;
}
.opening-hours ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.opening-hours li {
  padding: 0.2rem 0;
  font-size: 1rem;
}
.contact-form { background:#2d2d2d; border-radius:1rem; padding:1.5rem 1.5rem 1.25rem; margin:0 0 2rem; box-shadow:0 2px 8px rgba(246,231,182,0.08); color:#F6E7B6; max-width:480px; flex:1 1 420px; display:flex; flex-direction:column; align-self:stretch; position:relative; }
.contact-form::after { content:""; position:absolute; inset:0; border:1px solid rgba(255,226,161,0.08); border-radius:inherit; pointer-events:none; }

.form-row {
  display: flex;
  flex-direction: column;
  margin-bottom: 1rem;
}
.form-row label {
  margin-bottom: 0.3rem;
  color: var(--accent);
  font-weight: 500;
}
.form-row input,
.form-row textarea,
.form-row select {
  padding: 0.7rem;
  border-radius: 0.5rem;
  border: 1px solid var(--accent);
  background: #232323;
  color: #F6E7B6;
  font-size: 1rem;
  outline: none;
  transition: border 0.2s;
}
.form-row input:focus,
.form-row textarea:focus,
.form-row select:focus {
  border: 1.5px solid #F6E7B6;
}
/* Phone row: country code selector + local number */
.phone-row {
  display: flex;
  align-items: stretch;
  gap: 0.5rem;
}
.phone-row select {
  flex: 0 0 120px;
  min-width: 110px;
}
.phone-row input[type="tel"] {
  flex: 1 1 auto;
}
@media (max-width: 420px) {
  .phone-row {
    flex-wrap: wrap;
  }
  .phone-row select {
    flex: 1 1 100%;
    min-width: 0;
  }
  .phone-row input[type="tel"] {
    flex: 1 1 100%;
  }
}

/* Searchable country code combobox */
.phone-row .phone-code-combobox {
  position: relative;
  flex: 0 0 200px;
  min-width: 180px;
}
.phone-row .phone-code-input {
  width: 100%;
}
/* Reserve space for inline flag preview positioned absolutely */
.phone-row .phone-code-combobox .phone-code-input {
  padding-left: 2rem;
}
.phone-row .phone-code-list {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  max-height: 260px;
  overflow: auto;
  background: #2b2b2b;
  border: 1px solid rgba(246,231,182,0.25);
  border-radius: 0.5rem;
  padding: 0.25rem 0;
  z-index: 30;
  box-shadow: 0 8px 20px rgba(0,0,0,0.35);
  display: none;
}
.phone-row .phone-code-list.open { display: block; }
.phone-row .phone-code-option {
  padding: 0.45rem 0.65rem;
  cursor: pointer;
  color: #F6E7B6;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.phone-row .phone-code-option[aria-selected="true"],
.phone-row .phone-code-option:hover {
  background: rgba(246,231,182,0.12);
}
.phone-row .phone-code-flag { font-size: 1.05em; line-height: 1; }
.phone-row .phone-code-flag-img { width: 1.1em; height: 0.85em; object-fit: cover; border-radius: 2px; box-shadow: 0 0 0 1px rgba(0,0,0,0.2) inset; }
.phone-row .phone-code-text { overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 420px) {
  .phone-row .phone-code-combobox { flex: 1 1 100%; min-width: 0; }
}
/* Unify button styles: apply gradient to all primary buttons */
.submit-btn,
.leave-review-btn,
.blog-readmore,
.gallery-prev, .gallery-next,
.cta-phones a,
.call-btn, .whatsapp-btn,
.button-link, .post-cta-links a, .blog-cta-links a {
  background: linear-gradient(90deg, var(--accent) 0%, var(--accent-dark) 100%);
  color: #232323;
  font-weight: bold;
  padding: 0.7rem 1.5rem;
  border-radius: 2rem;
  border: none;
  font-size: 1rem;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(246,231,182,0.10);
  transition: background 0.3s, color 0.3s, transform 0.2s, box-shadow 0.3s;
  position: relative;
  overflow: hidden;
  z-index: 1;
}
/* Ensure anchor CTAs render like buttons */
.leave-review-btn, .blog-readmore, .cta-phones a, .button-link, .post-cta-links a, .blog-cta-links a { display: inline-block; text-decoration: none; pointer-events: auto; }
.submit-btn .ripple, .leave-review-btn .ripple, .blog-readmore .ripple, .gallery-prev .ripple, .gallery-next .ripple, .cta-phones a .ripple, .call-btn .ripple, .whatsapp-btn .ripple {
  position: absolute;
  border-radius: 50%;
  transform: scale(0);
  animation: ripple-animate 0.6s linear;
  background: rgba(var(--accent-rgb),0.35);
  pointer-events: none;
  z-index: 3;
}
@keyframes ripple-animate {
  to {
    transform: scale(2.5);
    opacity: 0;
  }
}
.submit-btn:hover, .leave-review-btn:hover, .blog-readmore:hover, .gallery-prev:hover, .gallery-next:hover, .cta-phones a:hover, .call-btn:hover, .whatsapp-btn:hover, .button-link:hover, .post-cta-links a:hover, .blog-cta-links a:hover {
  background: linear-gradient(90deg, var(--accent-dark) 0%, var(--accent) 100%);
  color: #fff;
  transform: translateY(-2px) scale(1.04);
  box-shadow: 0 6px 24px rgba(var(--accent-rgb),0.18);
}
.submit-btn:hover::after, .leave-review-btn:hover::after, .blog-readmore:hover::after, .gallery-prev:hover::after, .gallery-next:hover::after {
  opacity: 1;
}
@media (max-width: 600px) {
  .contact-form, .opening-hours {
    padding: 1rem 0.5rem;
  }
}
/* Google Reviews Section */
.reviews {
  padding: 2rem 1rem;
  background: #232323;
  margin-top: 0;
}
.reviews-list {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  justify-content: center;
  margin-bottom: 1.5rem;
}
.review {
  background: #2d2d2d;
  border-radius: 1rem;
  padding: 1.2rem 1.2rem 1rem 1.2rem;
  width: 320px;
  box-shadow: 0 2px 8px rgba(246,231,182,0.08);
  color: #F6E7B6;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.review-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: bold;
  margin-bottom: 0.3rem;
}
.reviewer {
  color: #F6E7B6;
}
.stars {
  color: var(--accent);
  font-size: 1.1rem;
  letter-spacing: 1px;
}
.review-cta {
  text-align: center;
}
/* Inherit unified CTA styles for leave-review-btn (see the CTA block above) */

/* ---------------- Accessibility enhancements ---------------- */
/* Respect users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

/* Ensure strong visible focus states for interactive elements */
/* Do not globally remove outlines; rely on :focus-visible to show clear focus */
button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
.submit-btn:focus-visible,
.leave-review-btn:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

/* Provide a fallback highlight for custom buttons if outline is overridden */
.submit-btn:focus-visible,
.leave-review-btn:focus-visible {
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb), 0.35);
}
@media (max-width: 900px) {
  .reviews-list {
    flex-direction: column;
    align-items: center;
  }
  .review {
    width: 100%;
    max-width: 400px;
  }
}
html {
  scroll-behavior: smooth;
}
/* Ensure consistent sizing model */
*, *::before, *::after { box-sizing: border-box; }
/* Fallback background behind body to avoid visible right-edge sliver on some mobiles */
html { background-color: #232323; }
body {
  font-family: Arial, sans-serif;
  margin: 0;
  padding: 0;
  background: linear-gradient(135deg, #181818 0%, #232323 100%);
  color: #F6E7B6;
}
/* Avoid 1px horizontal overflow on mobile causing right-edge gaps */
html, body { overflow-x: hidden; }
body::before {
  content: "";
  position: fixed;
  z-index: 0;
  pointer-events: none;
  top: 0; left: 0; right: 0; bottom: 0;
  background: radial-gradient(ellipse at center, rgba(24,24,24,0) 60%, rgba(24,24,24,0.85) 100%);
  opacity: 0.7;
}
.confetti-bg {
  position: fixed;
  z-index: 1;
  pointer-events: none;
  inset: 0; /* cover full viewport reliably on mobile */
  background: url('data:image/svg+xml;utf8,<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="10" cy="10" r="2" fill="%23FFE2A1"/><circle cx="80" cy="30" r="1.5" fill="%23B8860B"/><circle cx="60" cy="80" r="1.2" fill="%23FFE2A1"/><circle cx="30" cy="60" r="1.7" fill="%23F6E7B6"/><circle cx="90" cy="90" r="1.1" fill="%23FFE2A1"/><circle cx="50" cy="50" r="1.3" fill="%23B8860B"/></svg>');
  opacity: 0.08;
  mix-blend-mode: normal; /* prevent background pattern from affecting photos */
  animation: confetti-move 18s linear infinite;
}
@keyframes confetti-move {
  0% { background-position: 0 0; }
  100% { background-position: 100px 100px; }
}
body { position: relative; z-index: 2; }
/* Prevent background scroll when mobile menu is open */
body.menu-open { overflow: hidden; }
header {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #232323;
  padding: 1rem 2rem;
  z-index: 120;
}
/* Hero layout refinement */
.parallax-hero.hero {
  display:block;
  padding:0; /* let image define spacing */
}
.parallax-hero .hero-media { position: relative; }
.parallax-hero .hero-text {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 1rem;
  z-index: 5;
}
.parallax-hero .hero-img { filter:brightness(.82) contrast(1.05); }
/* Subtle gradient overlay on hero image for readability */
.parallax-hero .hero-media::after { content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit;
  background: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0.12) 45%, rgba(0,0,0,0.5) 100%);
}
/* Hamburger button */
.nav-toggle {
  display: none;
  background: transparent;
  border: 1px solid rgba(var(--accent-rgb),0.35);
  color: var(--accent);
  border-radius: 10px;
  padding: 0.35rem 0.5rem;
  cursor: pointer;
}
.nav-toggle:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.nav-toggle-bar {
  display: block;
  width: 20px;
  height: 2px;
  background: currentColor;
  margin: 3px 0;
  border-radius: 2px;
  transition: transform 0.2s ease, opacity 0.2s ease;
}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1) { transform: translateY(5px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }
/* Social icon buttons (moved from inline) */
.social-links { display: flex; align-items: center; gap: 0.75rem; }
.social-links a.icon { display:inline-flex; width:44px; height:44px; border-radius:50%;
  color:var(--accent); background: rgba(var(--accent-rgb), 0.08); align-items:center; justify-content:center;
  transition: transform 0.18s ease, color 0.18s ease, background-color 0.18s ease; text-decoration: none; }
.social-links a.icon:hover { transform: translateY(-2px) scale(1.05); color:#fffbe6; background: rgba(var(--accent-rgb),0.18); }
.social-links a.icon:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.social-links a.icon svg { width:24px; height:24px; display:block; fill: currentColor; }
/* Screen-reader only text */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
/* .logo text style removed in favor of image-based logo */
nav {
  position: relative;
  display: flex;
  align-items: center;
}
.nav-toggle { display: none; }
/* Hide close button by default (desktop) */
#primary-nav .nav-close { display: none; }
.nav-toggle { display: none; }
.nav-link {
  margin: 0 1rem;
  text-decoration: none;
  color: #F6E7B6;
  font-weight: 500;
  position: relative;
  transition: color 0.2s;
  padding-bottom: 4px;
}
.nav-link:hover, .nav-link.active {
  color: #fff;
}
.nav-underline {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 2px;
  width: 0;
  background: #F6E7B6;
  transition: left 0.3s, width 0.3s;
  z-index: 1;
}
.social-links a {
  margin-left: 0;
  color: #F6E7B6;
  text-decoration: none;
  font-weight: bold;
  transition: color 0.2s;
}
.social-links a:hover {
  color: #fff;
}
.social-links .social-icon {
  color: var(--accent);
  font-size: 1.2em;
  margin-right: 0.3em;
  vertical-align: middle;
  transition: color 0.2s;
}
.social-links a:hover .social-icon {
  color: #fffbe6;
}
.nav-toggle { display:none; background:transparent; border:1px solid rgba(var(--accent-rgb),0.35); color:var(--accent); border-radius:10px; padding:0; cursor:pointer; }
.nav-toggle:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.nav-toggle-bar { display:block; width:22px; height:2px; background: currentColor; margin:3px 0; border-radius:2px; transition: transform 0.2s ease, opacity 0.2s ease; }
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
@media (max-width: 900px) {
  header { padding: 0.85rem 1rem; gap: 0.5rem; }
  header .social-links { display: none; }
  .nav-toggle { display:inline-block; }
  .nav-underline { display:none; }
  /* Make burger height match the logo and center contents */
  .logo img { height: 52px; }
  .nav-toggle {
    box-sizing: border-box;
    height: 44px; /* square tap target */
    width: 44px;  /* square tap target */
    padding: 0;   /* width controls the size */
    display: inline-flex; /* center and stack bars */
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px; /* use gap for consistent spacing so it stays centered */
    line-height: 0; /* remove inline content height influence */
    border-radius: 10px; /* rounded corners, still square */
  }
  /* Rounded focus ring that respects border-radius */
  .nav-toggle:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--accent), 0 0 0 5px rgba(var(--accent-rgb),0.25); }
  /* Standard centered three-bar icon (stacked lines) */
  .nav-toggle .nav-toggle-bar {
    width: 18px; /* a bit smaller icon */
    height: 2px;
    margin: 0; /* spacing handled by gap to keep center true */
    background: currentColor;
    border-radius: 2px;
    transition: transform 0.2s ease, opacity 0.2s ease;
  }
  /* X-state, stay centered */
  .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2) { opacity: 0; }
  .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
}
.logo {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #F6E7B6;
  text-decoration: none;
}
.logo img {
  display: block;
  height: 64px;
  width: auto;
}
/* Gallery carousel */
.gallery-carousel { margin-top: 1rem; width: 100%; }
.gallery-track {
  display: flex;
  gap: 2rem;
  align-items: stretch;
  justify-content: center;
  flex-wrap: nowrap;
  flex-direction: row;
  width: 100%;
  overflow: hidden;
}
.gallery-card {
  background:#2d2d2d;
  border-radius:1rem;
  overflow:hidden;
  box-shadow:0 2px 8px rgba(246,231,182,0.08);
  width: 320px;
  flex: 0 0 320px;
}
.gallery-card .gallery-img { width:100%; height: 180px; object-fit: cover; display:block; }
.gallery-nav {
  display:flex;
  width: 100%;
  justify-content:center;
  align-items: center;
  gap: 10px;
  margin: 0.5rem 0 1rem;
}
.gallery-prev, .gallery-next {
  padding: 0.35rem 0.9rem;
  border-radius:999px;
  line-height: 1;
  font-size: 1.25rem;
}

/* Thumbnails strip */
.gallery-thumbs {
  display: flex;
  gap: 0.5rem;
  justify-content: center;
  align-items: center;
  margin: 0.25rem auto 0.75rem;
  width: 100%;
  overflow-x: auto;
  padding: 0 0.5rem;
}
.gallery-thumb {
  border: 2px solid transparent;
  border-radius: 8px;
  padding: 0;
  background: transparent;
  cursor: pointer;
}
.gallery-thumb[aria-selected="true"] {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px rgba(var(--accent-rgb),0.2);
}
.gallery-thumb img {
  width: 56px;
  height: 44px;
  object-fit: cover;
  display: block;
  border-radius: 6px;
}
.hero-overlay {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: linear-gradient(180deg,rgba(0,0,0,0.38) 58%,rgba(0,0,0,0.75) 100%); /* slightly lighter to avoid heavy dark bleed */
  border-radius: 1rem;
}
.products {
  padding: 2rem 1rem;
  background: #232323;
}
.product-list {
  display: flex;
  flex-wrap: wrap;
  gap: 1.2rem;
  justify-content: center;
  max-width: 1100px;
  margin: 0 auto;
}
.product {
  background: #232323;
  border-radius: 1.2rem;
  box-shadow: 0 2px 8px rgba(246,231,182,0.08);
  padding: 1.2rem 1.2rem 1rem 1.2rem;
  margin: 0.7rem;
  transition: transform 0.25s cubic-bezier(.4,2,.6,1), box-shadow 0.25s, border 0.25s;
  border: 2px solid transparent;
  position: relative;
  z-index: 1;
  width: clamp(230px, 28vw, 300px);
  max-width: 100%;
}
.product:hover, .product:focus-within {
  transform: scale(1.045) translateY(-4px);
  box-shadow: 0 8px 32px 0 rgba(var(--accent-rgb),0.18), 0 2px 8px rgba(246,231,182,0.12);
  border: 2px solid var(--accent);
}
.product img {
  width: 100%;
  height: clamp(140px, 18vw, 200px);
  object-fit: cover;
  display: block;
  border-radius: 1rem;
  box-shadow: 0 2px 8px rgba(246,231,182,0.10);
  transition: transform 0.3s cubic-bezier(.4,2,.6,1), box-shadow 0.3s;
  opacity: 1; /* ensure solid image */
  mix-blend-mode: normal;
  isolation: isolate;
}
.product:hover img, .product:focus-within img {
  transform: scale(1.06) rotate(-1deg);
  box-shadow: 0 6px 24px rgba(var(--accent-rgb),0.13);
}
.about, .contact {
  padding: 2rem 1rem;
  background: #232323;
}
.contact-flex { align-items:stretch; }
.contact-flex > .contact-info-card, .contact-flex > .contact-form { display:flex; flex-direction:column; }
.contact-form { display:flex; flex-direction:column; justify-content:flex-start; }
.contact-form .form-row input, .contact-form .form-row textarea { width:100%; box-sizing:border-box; }
.map-embed-home { width:100%; max-width:480px; aspect-ratio:4/3; background:#111; border:1px solid rgba(var(--accent-rgb),0.35); border-radius:12px; overflow:hidden; margin:1rem auto 0; }
.map-embed-home iframe { width:100%; height:100%; border:0; }
.gallery {
  padding: 2rem 1rem;
  background: #232323;
}
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1.2rem;
  margin-top: 1.5rem;
  align-items: stretch;
}
.gallery-img {
  width: 100%;
  height: 180px;
  object-fit: cover;
}
/* Gallery interactions */
.gallery-img:hover, .gallery-img:focus {
  transform: scale(1.07) rotate(-2deg);
  box-shadow: 0 8px 32px 0 rgba(var(--accent-rgb),0.18), 0 2px 8px rgba(246,231,182,0.12);
  filter: grayscale(0) brightness(1.04) contrast(1.13);
  opacity: 1;
  outline: 2px solid var(--accent);
  z-index: 2;
}
@media (min-width: 700px) {
  .gallery-grid {
    gap: 1.75rem;
    align-items: stretch;
  }
  .gallery-img:nth-child(2n) {
    grid-row: span 2;
    height: 380px;
  }
}
.lightbox-modal {
  display: grid;
  place-items: center; /* center content both ways */
  position: fixed;
  inset: 0; /* rely on edges to avoid vw/dvh quirks */
  background: rgba(0,0,0,0.7);
  backdrop-filter: blur(2px);
  z-index: 2000;
  transition: opacity 0.3s;
  padding: max(2vh, 20px) max(env(safe-area-inset-left, 16px), 16px) max(2vh, 20px) max(env(safe-area-inset-right, 16px), 16px);
  box-sizing: border-box;
  overflow: auto; /* allow scroll if needed on very small screens */
}
.lightbox-img {
  display: block;
  width: auto;
  height: auto;
  max-width: min(96vw, 1400px);
  max-height: calc(100dvh - 12vh); /* leave some vertical padding */
  object-fit: contain; /* ensure full image visible */
  border-radius: 1rem;
  box-shadow: 0 8px 32px rgba(0,0,0,0.35);
}
.lightbox-close {
  position: fixed; /* keep it visible and out of layout flow */
  top: max(12px, env(safe-area-inset-top, 12px));
  right: max(12px, env(safe-area-inset-right, 12px));
  color: #fff;
  font-size: 2.5rem;
  cursor: pointer;
  z-index: 2001;
  background: rgba(0,0,0,0.35);
  border-radius: 50%;
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}
.lightbox-close:hover, .lightbox-close:focus {
  background: rgba(0,0,0,0.5);
}
footer {
  text-align: center;
  padding: 1rem;
  background: #232323;
  color: #F6E7B6;
  font-size: 0.9rem;
}
.footer-social {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin: 0.25rem 0 0.6rem;
}
.footer-social a.icon {
  display: inline-flex;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.08);
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: transform 0.15s ease, color 0.15s ease, background-color 0.15s ease;
}
.footer-social a.icon:hover {
  transform: translateY(-1px);
  color: #fffbe6;
  background: rgba(var(--accent-rgb), 0.18);
}
.footer-social a.icon:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}
.footer-social a.icon svg {
  width: 18px;
  height: 18px;
  display: block;
  fill: currentColor;
}
.footer-divider {
  width: 100%;
  height: 5px;
  margin: 0 0 1.2rem 0;
  border: none;
  border-radius: 2px;
  background: linear-gradient(90deg, rgba(255,255,255,0.95) 0%, var(--accent) 100%);
  opacity: 0.95;
  position: relative;
  overflow: hidden;
}
.footer-watermark {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.5em;
  opacity: 0.85;
  user-select: none;
}
.footer-watermark svg {
  filter: drop-shadow(0 2px 8px #FFE2A133);
}
.footer-tripadvisor { margin: 0.3rem 0 0.2rem; font-size: 0.85rem; }
.footer-tripadvisor a { display:inline-flex; align-items:center; gap: 0.4rem; color: #F6E7B6; text-decoration: underline; text-underline-offset: 2px; }
.footer-tripadvisor a:hover { color: #fff; }
.footer-tripadvisor .ta-icon { display:inline-flex; width:18px; height:18px; line-height:0; }
.footer-tripadvisor .ta-icon svg { width:18px; height:18px; display:block; fill: none; stroke: currentColor; }
@media (max-width: 900px) {
  .product-list {
    flex-direction: column;
    align-items: center;
  }
  .gallery-grid {
    grid-template-columns: 1fr 1fr;
  }
  header {
    flex-direction: row; /* keep logo and burger on the same line */
    align-items: center; /* vertically center both */
  }
  .logo { margin-bottom: 0; }
}

/* --- Blog Page Styles --- */
.blog { background:#232323; }
.blog-list { padding: 1rem 1rem 2rem; }
.blog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.5rem;
  align-items: stretch;
}
.blog-card {
  background: #2d2d2d;
  border-radius: 1rem;
  box-shadow: 0 2px 8px rgba(246,231,182,0.08);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.25s cubic-bezier(.4,2,.6,1), box-shadow 0.25s;
  border: 2px solid transparent;
}
.blog-card:hover { transform: translateY(-4px) scale(1.02); box-shadow: 0 8px 32px rgba(var(--accent-rgb),0.15); border-color:var(--accent); }
.blog-thumb img { width: 100%; height: 180px; object-fit: cover; display:block; }
.blog-thumb img { opacity: 1; mix-blend-mode: normal; isolation: isolate; }
.blog-content { padding: 1rem; color: #F6E7B6; display:flex; flex-direction:column; gap:0.5rem; }
.blog-title { margin: 0; font-size: 1.2rem; }
.blog-title a { color:#fff; text-decoration:none; }
.blog-title a:hover { text-decoration:underline; }
.blog-meta { color:#BFB27E; font-size:0.9rem; margin:0; }
.blog-excerpt { margin:0; opacity:0.95; }
.blog-readmore { align-self:flex-start; margin-top:0.2rem; padding:0.4rem 0.9rem; border-radius:999px; text-decoration:none; font-weight:600; }
.blog-readmore:hover { color:#fff; }

/* Single post styles */
.post-body { max-width: 900px; margin: 0 auto; padding: 0 1rem 3rem; }
.post-hero { margin: 1rem 0 1.5rem; border-radius: 14px; overflow: hidden; box-shadow: 0 8px 24px rgba(0,0,0,0.35); }
.post-hero img { width: 100%; height: auto; display: block; }
.post-hero img { opacity: 1; mix-blend-mode: normal; isolation: isolate; }
.post-content { font-size: 1.05rem; line-height: 1.85; color: #eee; }
.post-content p { margin: 1rem 0; }
.post-content h2, .post-content h3 { font-family: 'Playfair Display', serif; color: var(--accent); margin-top: 2rem; }
.post-content a { color: var(--accent); text-decoration: underline; }

@media (max-width: 680px) {
  /* Blog index: single column on small screens */
  .blog-grid { grid-template-columns: 1fr; gap: 1rem; }
  .blog-thumb img { height: 160px; }
  .post-body { padding-bottom: 2.5rem; }
  .post-content { font-size: 1rem; }
}
@media (max-width: 900px) {
  /* Hide inline nav entirely on mobile */
  header #primary-nav { display: none !important; }
  /* Let hero grow with content on small screens to avoid clipping */
  .parallax-hero { height: auto; }
  .gallery-grid {
    grid-template-columns: 1fr;
  }
  .about, .contact, .gallery, .products, .hero {
    padding: 1rem 0.5rem;
  }
  /* Collapse nav and show hamburger */
  nav { width: 100%; }
  .nav-toggle {
    display: inline-flex; /* keep flex for centered stacked bars */
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-left: auto; /* push to right */
    align-self: center; /* align with logo vertically */
  }
  /* Fullscreen overlay menu when open */
  body.menu-open #primary-nav {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    position: fixed;
    inset: 0;
    background: rgba(35,35,35,0.98);
    backdrop-filter: blur(2px);
    z-index: 1000;
    padding: 4rem 1rem 2rem;
    gap: 0;
    overflow-y: auto;
    animation: menu-slide-in 220ms ease-out;
  }
  @keyframes menu-slide-in {
    from { opacity: 0; transform: translateY(-6px); }
    to { opacity: 1; transform: translateY(0); }
  }
  /* Close button inside overlay */
  #primary-nav .nav-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid rgba(var(--accent-rgb),0.35);
    background: rgba(0,0,0,0.2);
    color: #fff;
    font-size: 1.6rem;
    line-height: 1;
    display: grid;
    place-items: center;
    cursor: pointer;
  }
  /* Ensure it only shows during overlay */
  body.menu-open #primary-nav .nav-close { display: grid; }
  #primary-nav .nav-close:hover { background: rgba(0,0,0,0.35); }
  #primary-nav .nav-close:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
  body.menu-open #primary-nav .nav-link {
    display: block;
    padding: 0.9rem 0.75rem;
    margin: 0;
    border-top: 1px solid rgba(255,255,255,0.06);
    font-size: 1.05rem;
  }
  body.menu-open #primary-nav .nav-link:first-child { border-top: none; }
  .nav-underline { display: none; }
  /* Header social icons: compact, centered row with clearer hit targets */
  header .social-links {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.35rem;
    order: 3; /* ensure they sit after nav when header stacks */
  }
  header .social-links a.icon {
    width: 40px;
    height: 40px;
    border-radius: 999px;
  background: rgba(var(--accent-rgb), 0.10);
  border: 1px solid rgba(var(--accent-rgb), 0.35);
    margin-left: 0; /* override generic anchor margin */
  }
  header .social-links a.icon svg {
    width: 20px;
    height: 20px;
  }
}
@media (min-width: 901px) {
  /* Desktop: show inline nav, hide burger */
  header #primary-nav { display: flex !important; }
  .nav-toggle { display: none !important; }
}
/* --- Hero Section Animated Overlay and Heading Glow --- */
.hero-shimmer {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  pointer-events: none;
  z-index: 2;
  background: linear-gradient(120deg, rgba(var(--accent-rgb),0.12) 0%, rgba(255,255,255,0.08) 40%, rgba(var(--accent-rgb),0.18) 60%, rgba(255,255,255,0.0) 100%);
  mix-blend-mode: lighten;
  opacity: 0.85;
  animation: shimmer-move 3.5s linear infinite;
}
@keyframes shimmer-move {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
.hero-heading-glow {
  text-shadow: 0 2px 16px var(--accent), 0 0 8px #fff, 0 0 2px var(--accent);
  color: #fff;
  position: relative;
  z-index: 3;
}
.parallax-hero {
  position: relative;
  width: 100%;
  height: auto; /* let image control height to avoid cropping */
  overflow: hidden;
  margin-bottom: 1rem;
  background: #232323;
  border-radius: 1rem;
}
@media (max-width: 380px) {
  /* Ensure no clipping on very small devices */
  .parallax-hero { height: auto; }
}
/* Better mobile layout: place hero text under the image to avoid cramped overlay */
@media (max-width: 700px) {
  .parallax-hero .hero-text {
    position: static;
    display: block;
    padding: 0.75rem 1rem 1rem;
    inset: auto;
    z-index: auto;
  }
  .hero { text-align: left; }
  .hero h1 { font-size: clamp(1.35rem, 6vw, 2rem); margin: 0.25rem 0 0.35rem; }
  .hero p { font-size: clamp(0.95rem, 3.4vw, 1.05rem); }
}
/* Center hero text and improve readability */
.hero { text-align: center; }
.hero h1 { margin: 0.75rem auto 0.25rem; max-width: 900px; font-size: clamp(1.6rem, 4vw, 2.6rem); line-height: 1.15; font-weight: 700; }
.hero p { margin: 0.25rem auto 0; max-width: 720px; opacity: 0.96; font-size: clamp(1rem, 2.3vw, 1.15rem); line-height: 1.45; }
/* Add a soft backdrop capsule behind hero text for readability */
.hero .hero-text { display: block; margin: 0 auto; }
/* Strong outline for hero text to improve readability over image */
.hero .hero-text h1, .hero .hero-text p { color: var(--accent); text-shadow: none; }
/* Ensure hero image fills container proportionally */
.hero-img {
  width: 100%;
  height: auto; /* keep full image visible */
  display: block;
  will-change: transform;
  transition: transform 0.3s;
}
/* --- End Hero Section Overlay Styles --- */
/* --- Animation Styles --- */
.fade-in-section {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s cubic-bezier(.4,2,.6,1), transform 0.8s cubic-bezier(.4,2,.6,1);
  will-change: opacity, transform;
}
.fade-in-section.visible {
  opacity: 1;
  transform: none;
}
.accent-script {
  font-family: 'Dancing Script', cursive;
  font-size: 1.5em;
  color: var(--accent);
  font-weight: 700;
  margin-right: 0.3em;
  vertical-align: middle;
  letter-spacing: 0.02em;
}
.heading-underline {
  display: inline-block;
  position: relative;
  padding-bottom: 0.18em;
}
.heading-underline::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 0.18em;
  background: linear-gradient(90deg, var(--accent) 0%, var(--accent-dark) 100%);
  border-radius: 1em;
  opacity: 0.7;
  transition: width 0.3s cubic-bezier(.4,2,.6,1);
}
.heading-underline:hover::after, .heading-underline:focus::after {
  width: 120%;
  left: -10%;
  opacity: 1;
}
#scrollToTopBtn {
  position: fixed;
  right: 1.25rem; /* align with WhatsApp FAB */
  bottom: calc(1.25rem + 56px + 0.75rem); /* sit above FAB with gap */
  z-index: 1099; /* just below FAB if overlapping */
  background: linear-gradient(120deg, var(--accent) 0%, var(--accent-dark) 100%);
  color: var(--accent);
  border: none;
  border-radius: 50%;
  width: 52px;
  height: 52px;
  box-shadow: 0 4px 24px rgba(var(--accent-rgb),0.18);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.4s, transform 0.3s;
  cursor: pointer;
  outline: none;
  font-size: 1.5em;
}
#scrollToTopBtn svg {
  display: block;
}
#scrollToTopBtn.show {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}
#scrollToTopBtn:active {
  transform: scale(0.95);
}

/* Mobile adjustment to keep spacing consistent */
@media (max-width: 480px) {
  #scrollToTopBtn {
    right: 1rem;
    bottom: calc(1rem + 56px + 0.75rem);
  }
}
  
/* --- Contact Section Enhancements (appended overrides) --- */
.contact { padding: 4.5rem 1rem 5rem; }
.contact-info-card .info-row { display:flex; gap:.75rem; align-items:flex-start; line-height:1.35; font-size:.95rem; }
.contact-info-card .info-icon { font-size:1.15rem; line-height:1; display:inline-flex; width:1.5rem; justify-content:center; color:#b8860b; filter: drop-shadow(0 0 2px rgba(255,226,161,0.35)); }
.cta-phones { display:flex; gap:.75rem; margin-top:1.2rem; flex-wrap:wrap; }
.cta-phones a { flex:1 1 140px; text-align:center; padding:.85rem 1.1rem; font-weight:600; border-radius:40px; text-decoration:none; font-size:.9rem; letter-spacing:.5px; transition:background .25s, transform .25s, box-shadow .25s; box-shadow:0 2px 4px rgba(0,0,0,.15); }
.call-btn { color:#232323; }
.call-btn:hover { transform:translateY(-2px); }
.whatsapp-btn { color:#232323; }
.whatsapp-btn:hover { transform:translateY(-2px); }
@media (max-width: 860px) { .contact { padding:3.5rem 1rem 4rem; } .cta-phones { margin-top:1rem; } }
/* Hours list styling unified (homepage & contact page) */
.hours-block { margin-top:.9rem; background:#1c1c1c; padding:.9rem 1rem .8rem; border:1px solid rgba(var(--accent-rgb),0.22); border-radius:.75rem; }
.hours-heading { display:flex; align-items:center; gap:.6rem; font-weight:600; margin-bottom:.45rem; color:var(--accent); }
.hours-block .info-icon svg { color:var(--accent); }
.hours-summary { font-size:.82rem; margin:0 0 .55rem; color:#FFE2A1; font-weight:600; letter-spacing:.3px; display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.hours-summary::before { content:'⏱'; font-size:.9rem; }
.hours-list { list-style:none; padding:0; margin:0; font-size:.82rem; border:1px solid rgba(255,226,161,0.15); border-radius:.75rem; overflow:hidden; }
.hours-list li { display:grid; grid-template-columns:70px 1fr 62px; align-items:center; gap:.5rem; padding:.38rem .75rem; background:#232323; line-height:1.15; position:relative; }
.hours-list li:nth-child(odd){ background:#1f1f1f; }
.hours-list li span:first-child { font-weight:600; letter-spacing:.4px; color:#FFE2A1; }
.hours-list li span:nth-child(2) { font-variant-numeric:tabular-nums; }
.hours-list li span.badge { justify-self:end; font-size:.6rem; padding:.25rem .45rem; border-radius:10px; text-transform:uppercase; font-weight:700; letter-spacing:.5px; background:#2d2d2d; color:#c7c7c7; }
.hours-list li.closed span:nth-child(2){ color:#ffb4b4; font-weight:600; }
.hours-list li.closed span.badge { background:#561d1d; color:#ffb4b4; }
.hours-list li.today { outline:1.5px solid var(--accent); z-index:1; }
.hours-list li.today span:first-child { color:var(--accent); }
.hours-list li.today span.badge { background:var(--accent); color:#232323; }
@media (max-width:520px){ .hours-list li { grid-template-columns:65px 1fr 58px; padding:.42rem .65rem; font-size:.8rem; } }
@media (min-width:900px){ .hours-list li { grid-template-columns:72px 1fr 70px; } }

/* Special hours */
.special-hours { margin-top:.9rem; padding:.75rem .8rem .7rem; background:#1d1d1d; border:1px dashed rgba(255,226,161,0.4); border-radius:.75rem; }
.special-hours-title { font-size:.65rem; text-transform:uppercase; letter-spacing:1.2px; color:#e1cc8c; font-weight:700; margin:0 0 .45rem; display:flex; align-items:center; gap:.4rem; }
.special-hours-title::before { content:'★'; color:var(--accent); font-size:.75rem; }
.special-hours-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.3rem; font-size:.7rem; }
.special-hours-list li { display:grid; grid-template-columns:100px 1fr; gap:.75rem; background:#232323; padding:.4rem .6rem; border-radius:.5rem; }
.special-hours-list li.closed { background:#3a1a1a; color:#ffb4b4; }