:root{
  --gold:#C8A34A;
  --gold-2:#E1C36A;
  --ink:#0b0b0b;
  --paper:#ffffff;
  --muted:rgba(255,255,255,.72);
  --muted2:rgba(255,255,255,.55);
  --panel:rgba(255,255,255,.04);
  --panel2:rgba(255,255,255,.06);
  --line:rgba(255,255,255,.10);
}

html{scroll-behavior:smooth;}

/* Subtle grain overlay */
.grain{
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="220" height="220"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="3" stitchTiles="stitch"/></filter><rect width="220" height="220" filter="url(%23n)" opacity="0.35"/></svg>');
  mix-blend-mode:overlay;
}

/* Global primitives */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  border-radius:1rem;
  padding:.75rem 1rem;
  font-weight:600;
  letter-spacing:.01em;
  transition:transform .15s ease, background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);
  color:#fff;
  user-select:none;
}
.btn:hover{transform:translateY(-1px);background:rgba(255,255,255,.08);}
.btn:active{transform:translateY(0);}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none;}

.btn-primary{
  border-color:rgba(200,163,74,.65);
  background:linear-gradient(135deg, rgba(200,163,74,.18), rgba(255,255,255,.06));
  box-shadow:0 10px 30px rgba(200,163,74,.10), 0 12px 50px rgba(0,0,0,.35);
}
.btn-primary:hover{
  border-color:rgba(200,163,74,.9);
  background:linear-gradient(135deg, rgba(200,163,74,.26), rgba(255,255,255,.08));
}

.btn-ghost{background:transparent;border-color:rgba(255,255,255,.12);}
.btn-ghost:hover{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.20);}

.nav-link{
  display:inline-flex;
  align-items:center;
  padding:.6rem .85rem;
  border-radius:1rem;
  color:rgba(255,255,255,.82);
  border:1px solid transparent;
  transition:background-color .15s ease, border-color .15s ease, transform .15s ease;
  white-space:nowrap;
}
.nav-link:hover{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.10);transform:translateY(-1px);}
.nav-active{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.10);}

.footer-title{font-weight:700;letter-spacing:.02em;}
.footer-link{color:rgba(255,255,255,.78);}
.footer-link:hover{color:#fff;text-decoration:underline;}

.chip{
  display:inline-flex;
  align-items:center;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  border-radius:999px;
  padding:.35rem .6rem;
  font-size:.75rem;
  color:rgba(255,255,255,.85);
}

.section-kicker{
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:rgba(255,255,255,.70);
}
.section-kicker:before{
  content:"";
  width:34px;
  height:1px;
  background:linear-gradient(90deg, rgba(200,163,74,.0), rgba(200,163,74,.85));
}
.section-title{margin-top:.65rem;font-size:1.85rem;line-height:1.15;font-weight:700;}
.section-sub{margin-top:.75rem;color:rgba(255,255,255,.72);font-size:.95rem;line-height:1.7;max-width:48rem;}

/* Cards */
.lux-card{border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);border-radius:1.5rem;box-shadow:0 18px 55px rgba(0,0,0,.45);transition:transform .18s ease,border-color .18s ease,background-color .18s ease;}
.lux-card:hover{transform:translateY(-3px);border-color:rgba(200,163,74,.35);background:rgba(255,255,255,.06);}

.glass-card{border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.42);backdrop-filter:blur(14px);border-radius:1.5rem;box-shadow:0 18px 55px rgba(0,0,0,.55);}

.lux-media{position:relative;height:220px;overflow:hidden;border-top-left-radius:1.5rem;border-top-right-radius:1.5rem;border-bottom:1px solid rgba(255,255,255,.10);}
@media (min-width:1024px){.lux-media{height:240px;}}
.lux-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.02);transition:transform .5s ease;}
.lux-card:hover .lux-media img{transform:scale(1.07);}
.lux-grad{position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.65));}
.lux-badge{position:absolute;top:14px;left:14px;height:42px;width:42px;border-radius:1.15rem;border:1px solid rgba(200,163,74,.35);background:rgba(0,0,0,.40);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;color:var(--gold);}

.link-gold{color:rgba(225,195,106,.95);font-weight:600;}
.link-gold:hover{text-decoration:underline;color:#fff;}

.mini-cta{display:inline-flex;align-items:center;gap:.45rem;padding:.55rem .75rem;border-radius:1rem;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);font-size:.85rem;}
.mini-cta:hover{border-color:rgba(200,163,74,.35);background:rgba(255,255,255,.07);}

/* Hero */
/* FIX: use min-height (not fixed height) so hero NEVER clips/overlaps content */
.hero{
  position:relative;
  width:100%;
  min-height:100svh;
  overflow:hidden;
  display:block;
}
/* Fallback for browsers supporting dvh */
@supports (height: 100dvh){
  .hero{min-height:100dvh;}
}

.hero-slide{
  position:absolute;
  inset:0;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  opacity:0;
  transition:opacity 1s ease;
  filter:saturate(1.05) contrast(1.05);
  transform:translateZ(0);
}
.hero-slide.is-active{opacity:1;}

.hero-overlay{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 15% 20%, rgba(200,163,74,.20), transparent 40%),
    linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.80));
}

.hero:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(120deg, rgba(200,163,74,.00), rgba(200,163,74,.14), rgba(255,255,255,.06), rgba(200,163,74,.00));
  filter:blur(18px);
  opacity:.35;
  animation:sheen 10s ease-in-out infinite;
  pointer-events:none;
}
@keyframes sheen{
  0%{transform:translateX(-35%) translateY(-10%);}
  50%{transform:translateX(25%) translateY(10%);}
  100%{transform:translateX(-35%) translateY(-10%);}
}

/* Stats + features */
.stat-card{display:flex;gap:1rem;align-items:center;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);border-radius:1.25rem;padding:1rem;}
.stat-icon{height:42px;width:42px;border-radius:1.15rem;background:rgba(200,163,74,.10);border:1px solid rgba(200,163,74,.25);display:flex;align-items:center;justify-content:center;color:var(--gold);}
.stat-label{font-size:.75rem;color:rgba(255,255,255,.58);letter-spacing:.04em;text-transform:uppercase;}
.stat-value{font-weight:700;}

.contact-row{display:flex;gap:.9rem;align-items:center;padding:1rem;border-radius:1.25rem;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.03);transition:.15s;}
.contact-row:hover{border-color:rgba(200,163,74,.28);background:rgba(255,255,255,.06);}
.contact-ico{height:42px;width:42px;border-radius:1.15rem;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.10);display:flex;align-items:center;justify-content:center;color:var(--gold);}

.feature-row{display:flex;gap:1rem;align-items:flex-start;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.03);border-radius:1.25rem;padding:1rem;}
.feature-ico{height:44px;width:44px;border-radius:1.25rem;background:rgba(200,163,74,.10);border:1px solid rgba(200,163,74,.25);display:flex;align-items:center;justify-content:center;color:var(--gold);margin-top:.1rem;}
.feature-title{font-weight:700;}
.feature-text{margin-top:.2rem;font-size:.9rem;color:rgba(255,255,255,.70);line-height:1.6;}

/* Offers */
.offer-card{border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);border-radius:1.5rem;padding:1.5rem;box-shadow:0 18px 55px rgba(0,0,0,.45);position:relative;overflow:hidden;}
.offer-card:before{content:"";position:absolute;inset:-1px;background:linear-gradient(135deg, rgba(200,163,74,.35), rgba(255,255,255,.10), rgba(200,163,74,.18));opacity:.0;transition:opacity .25s ease;pointer-events:none;}
.offer-card:hover:before{opacity:.35;}
.offer-card.is-featured{border-color:rgba(200,163,74,.35);}
.offer-top{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;}
.price-pill{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:.35rem .75rem;font-weight:700;border:1px solid rgba(200,163,74,.45);background:rgba(200,163,74,.12);color:#fff;white-space:nowrap;}

/* Reviews */
.review-card{border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);border-radius:1.5rem;padding:1.5rem;box-shadow:0 18px 55px rgba(0,0,0,.45);}

/* Gallery */
.gallery-tile{position:relative;border-radius:1.25rem;overflow:hidden;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.03);box-shadow:0 14px 45px rgba(0,0,0,.45);cursor:pointer;text-align:left;}
.gallery-tile img{transition:transform .6s ease;}
.gallery-tile:hover img{transform:scale(1.06);}
.gallery-tile-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:1rem;background:linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.75));}

.pill{display:inline-flex;align-items:center;gap:.45rem;border-radius:999px;padding:.45rem .8rem;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);font-size:.85rem;color:rgba(255,255,255,.82);transition:.15s;}
.pill:hover{background:rgba(255,255,255,.07);border-color:rgba(200,163,74,.25);}
.pill.is-active{border-color:rgba(200,163,74,.55);background:rgba(200,163,74,.14);}

/* CTA panel */
.cta-panel{display:grid;grid-template-columns:1fr;gap:0;border-radius:1.75rem;overflow:hidden;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);box-shadow:0 22px 70px rgba(0,0,0,.55);}
@media(min-width:1024px){.cta-panel{grid-template-columns:1.15fr .85fr;}}
.cta-content{padding:1.75rem;}
@media(min-width:640px){.cta-content{padding:2.25rem;}}
.cta-media{min-height:280px;}
@media(min-width:1024px){.cta-media{min-height:unset;}}

/* Page header */
.page-hero{border-bottom:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));}
.breadcrumbs{display:flex;align-items:center;gap:.6rem;font-size:.8rem;color:rgba(255,255,255,.55);}
.breadcrumbs a{color:rgba(255,255,255,.78);}
.breadcrumbs a:hover{color:#fff;text-decoration:underline;}

/* Forms */
.form-label{display:block;font-size:.85rem;color:rgba(255,255,255,.72);margin-bottom:.35rem;}
.form-input,
.form-textarea{
  width:100%;
  border-radius:1.1rem;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.35);
  color:#fff;
  padding:.85rem 1rem;
  outline:none;
  transition:border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.form-textarea{min-height:140px;resize:vertical;}
.form-input:focus,
.form-textarea:focus{border-color:rgba(200,163,74,.55);box-shadow:0 0 0 4px rgba(200,163,74,.15);background:rgba(0,0,0,.45);}
.form-help{margin-top:.35rem;font-size:.75rem;color:rgba(255,255,255,.50);}
.form-error{margin-top:.35rem;font-size:.8rem;color:#ffd1d1;}

/* Tables */
.table-wrap{border-radius:1.5rem;overflow:hidden;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.03);}
.table{width:100%;border-collapse:collapse;}
.table th{background:rgba(255,255,255,.05);text-align:left;font-size:.8rem;color:rgba(255,255,255,.72);padding:1rem;border-bottom:1px solid rgba(255,255,255,.10);}
.table td{padding:1rem;border-bottom:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.82);vertical-align:top;}
.table tr:hover td{background:rgba(255,255,255,.03);}

/* Lightbox component used on home + gallery */
.lightbox{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:1rem;}
.lightbox.hidden{display:none;}
.lightbox-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(10px);}
.lightbox-panel{position:relative;max-width:min(1100px,96vw);max-height:86vh;border-radius:1.5rem;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:rgba(10,10,10,.72);box-shadow:0 30px 90px rgba(0,0,0,.75);}
.lightbox-panel img{width:100%;height:100%;max-height:76vh;object-fit:contain;background:#000;}
.lightbox-caption{padding:.85rem 1rem;border-top:1px solid rgba(255,255,255,.10);font-size:.9rem;color:rgba(255,255,255,.85);}
.lightbox-close{position:absolute;top:.8rem;right:.8rem;height:44px;width:44px;border-radius:1.1rem;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);color:#fff;display:flex;align-items:center;justify-content:center;}
.lightbox-close:hover{background:rgba(255,255,255,.10);border-color:rgba(200,163,74,.25);}

/* Scroll reveal */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease, transform .6s ease;}
.reveal.is-visible{opacity:1;transform:translateY(0);}

/* Focus ring */
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;}

/* =========================================================
   FIX ONLY: Mobile + Tablet hero panels less opaque so the
   background image stays visible. Desktop remains unchanged.
   + Remove blur specifically for Opening Hours + Quick Contact
   (keep clean, readable).
   ========================================================= */
@media (max-width:1024px){
  /* Make panel surfaces more transparent */
  #hero [data-hero-panel] .glass-card,
  #hero [data-hero-panel] .stat-card,
  #hero [data-hero-panel] .contact-row,
  #hero [data-hero-panel] .rounded-3xl.border.border-white\/10{
    background:rgba(0,0,0,.18) !important;
    border-color:rgba(255,255,255,.10) !important;
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
  }

  /* Make the inner "day rows" in Opening Hours lighter */
  #hero [data-hero-panel="1"] .rounded-2xl.border.border-white\/10{
    background:rgba(255,255,255,.05) !important;
    border-color:rgba(255,255,255,.10) !important;
  }

  /* Keep text readable without heavy blocks */
  #hero [data-hero-panel] .text-zinc-200{color:rgba(255,255,255,.90) !important;}
  #hero [data-hero-panel] .text-zinc-300{color:rgba(255,255,255,.82) !important;}
  #hero [data-hero-panel] .text-zinc-400{color:rgba(255,255,255,.60) !important;}

  /* Slightly soften the overlay on mobile/tablet so image shows through more */
  #hero .hero-overlay{
    background:
      radial-gradient(circle at 15% 20%, rgba(200,163,74,.14), transparent 44%),
      linear-gradient(180deg, rgba(0,0,0,.06), rgba(0,0,0,.58));
  }

  /* FIX: remove blur on Opening Hours (panel 1) and Quick Contact (panel 2) */
  #hero [data-hero-panel="1"] .rounded-3xl.border.border-white\/10,
  #hero [data-hero-panel="2"] .glass-card{
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    /* keep clean surface while still letting background show */
    background:rgba(0,0,0,.28) !important;
    border-color:rgba(255,255,255,.12) !important;
  }

  /* Remove blur from elements inside quick contact too (keeps it crisp) */
  #hero [data-hero-panel="2"] .contact-row{
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    background:rgba(255,255,255,.06) !important;
    border-color:rgba(255,255,255,.12) !important;
  }
}

/* =========================================================
   FIX ONLY (DESKTOP): remove blur on desktop Opening Hours
   + Quick Contact surfaces (no other changes).
   ========================================================= */
@media (min-width:1024px){
  /* Opening hours wrapper uses backdrop-blur-xl in template */
  #hero .backdrop-blur-xl{
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }

  /* Quick Contact card uses .glass-card which has blur by default */
  #hero .glass-card{
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }
}