:root{
  --ink:#161009;
  --ink-2:#1e150c;
  --charcoal:#241a10;
  --cream:#f3e6d0;
  --cream-2:#ecd9b9;
  --paper-text:#2b1f13;
  --gold:#e3b14d;
  --gold-2:#c8933a;
  --gold-soft:#f2cf8f;
  --ember:#c1502e;
  --text-onDark:#f3e9d8;
  --text-onDark-dim:#c9b89c;
  --shadow-soft:0 20px 50px rgba(0,0,0,0.35);
  --radius-lg:22px;
  --radius-md:14px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:'Inter',sans-serif;
  background:var(--ink);
  color:var(--text-onDark);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{
  font-family:'Oswald',sans-serif;
  text-transform:uppercase;
  letter-spacing:0.01em;
  margin:0 0 0.4em;
  line-height:1.1;
}
p{ margin:0 0 1em; line-height:1.65; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
.container{ width:min(1160px, 92%); margin:0 auto; }
.eyebrow{
  font-family:'Oswald',sans-serif;
  text-transform:uppercase;
  letter-spacing:0.18em;
  font-size:0.78rem;
  color:var(--gold);
  margin:0 0 0.6em;
}
.text-gold{ color:var(--gold); }

/* ---------- demo ribbon ---------- */
.demo-ribbon{
  background:var(--ember);
  color:#fff8ec;
  text-align:center;
  font-size:0.78rem;
  padding:8px 16px;
  letter-spacing:0.02em;
  position:relative;
  z-index:60;
}

/* ---------- noise overlay ---------- */
.noise-overlay{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:55;
  opacity:0.035;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

/* ---------- dot navigator (desktop only) ---------- */
.dot-nav{
  position:fixed;
  top:50%;
  right:28px;
  transform:translateY(-50%);
  z-index:50;
  display:flex;
  align-items:center;
}
.dot-nav-track{
  position:absolute;
  left:5px;
  top:0;
  width:1px;
  height:100%;
  background:rgba(243,233,216,0.14);
}
.dot-nav-fill{
  position:absolute;
  top:0; left:0;
  width:100%;
  height:0%;
  background:var(--gold);
  transition:height .4s cubic-bezier(.16,1,.3,1);
}
.dot-nav-list{
  display:flex;
  flex-direction:column;
  gap:22px;
}
.dot-nav-item{
  position:relative;
  width:11px;
  height:11px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.dot-nav-item span{
  width:6px;
  height:6px;
  border-radius:50%;
  background:rgba(243,233,216,0.35);
  border:1px solid rgba(243,233,216,0.5);
  transition:transform .3s ease, background .3s ease;
}
.dot-nav-item::before{
  content:attr(data-content);
  position:absolute;
  top:50%;
  right:22px;
  white-space:nowrap;
  font-family:'Oswald',sans-serif;
  font-size:0.72rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--text-onDark-dim);
  transform:translateY(-50%) translateX(-6px);
  opacity:0;
  transition:opacity .3s ease, transform .3s ease;
  pointer-events:none;
}
@media (hover:hover) and (pointer:fine){
  .dot-nav-item:hover::before{ opacity:1; transform:translateY(-50%) translateX(-14px); }
  .dot-nav-item:hover span{ transform:scale(1.3); background:var(--gold-soft); }
}
.dot-nav-item.is-active span{
  background:var(--gold);
  border-color:var(--gold);
  transform:scale(1.4);
}
.dot-nav-item.is-active::before{ opacity:1; color:var(--gold-soft); }
@media (max-width:900px){ .dot-nav{ display:none; } }

/* ---------- header ---------- */
.site-header{
  position:sticky;
  top:0;
  z-index:40;
  background:rgba(22,16,9,0.72);
  backdrop-filter:blur(14px) saturate(1.4);
  -webkit-backdrop-filter:blur(14px) saturate(1.4);
  border-bottom:1px solid rgba(227,177,77,0.14);
}
.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 0;
}
.logo{ display:flex; align-items:center; gap:10px; }
.logo-mark{ width:56px; height:56px; object-fit:contain; }
.logo-word{
  font-family:'Oswald',sans-serif;
  text-transform:uppercase;
  letter-spacing:0.04em;
  font-size:1.2rem;
  color:var(--text-onDark);
}
.logo-word em{ color:var(--gold); font-style:normal; }
.nav-links{ display:flex; align-items:center; gap:28px; }
.nav-links a:not(.btn){
  font-size:0.92rem;
  color:var(--text-onDark-dim);
  transition:color .25s ease;
}
.nav-links a:not(.btn):hover{ color:var(--gold); }
.nav-links a.btn-primary{ display:none; }
.nav-cta{ display:none; }
.nav-toggle{
  display:none;
  flex-direction:column;
  gap:5px;
  background:none;
  border:0;
  cursor:pointer;
  padding:6px;
}
.nav-toggle span{ width:24px; height:2px; background:var(--text-onDark); }

@media (max-width:900px){
  .nav-links{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:16px;
    position:absolute;
    top:100%;
    left:0;
    width:100%;
    background:var(--ink-2);
    padding:20px 6%;
    border-bottom:1px solid rgba(227,177,77,0.14);
    transform:translateY(-8px);
    opacity:0;
    pointer-events:none;
    transition:opacity .25s ease, transform .25s ease;
  }
  .nav-links.is-open{ opacity:1; transform:translateY(0); pointer-events:all; }
  .nav-links a.btn-primary{ display:inline-flex; }
  .nav-cta{ display:none !important; }
  .nav-toggle{ display:flex; }
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  position:relative;
  padding:0.85em 1.7em;
  border-radius:0;
  font-family:'Oswald',sans-serif;
  text-transform:uppercase;
  letter-spacing:0.06em;
  font-size:0.86rem;
  cursor:pointer;
  border:1.5px solid transparent;
  transition:transform .35s cubic-bezier(.16,1,.3,1), box-shadow .25s ease, background .25s ease, color .25s ease, border-color .25s ease;
  will-change:transform;
}
.btn::after{
  content:'';
  position:absolute;
  inset:0;
  margin:auto;
  border-radius:inherit;
  border:1.5px solid transparent;
  z-index:-1;
  transition:border-color .4s ease, width .4s ease, height .4s ease;
  pointer-events:none;
}
.btn:hover::after{
  border-color:var(--gold-soft);
  width:calc(100% - 10px);
  height:calc(100% + 14px);
}
.btn-primary{
  background:linear-gradient(135deg, var(--gold-soft), var(--gold-2));
  color:var(--ink);
  box-shadow:0 10px 26px rgba(227,177,77,0.28);
}
.btn-primary:hover{ box-shadow:0 14px 32px rgba(227,177,77,0.4); }
.btn-primary:hover::after{ border-color:rgba(255,255,255,0.6); }
.btn-ghost{
  z-index:0;
  border-color:rgba(243,233,216,0.4);
  color:var(--text-onDark);
}
.btn-ghost::before{
  content:'';
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:var(--gold);
  transform:scale(0);
  transition:transform .5s cubic-bezier(.16,1,.3,1);
  z-index:-1;
}
.btn-ghost:hover::before{ transform:scale(1); }
.btn-ghost:hover{ border-color:transparent; color:var(--ink); }

/* ---------- hero ---------- */
.hero{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:
    radial-gradient(60% 50% at 80% 15%, rgba(227,177,77,0.16), transparent 60%),
    radial-gradient(50% 45% at 10% 90%, rgba(193,80,46,0.14), transparent 60%),
    linear-gradient(180deg, var(--ink) 0%, var(--ink-2) 100%);
}
.hero-media{ position:absolute; inset:0; z-index:1; }
.hero-parallax-canvas{ position:absolute; inset:0; }
.hero-smoke{
  position:absolute;
  inset:0;
  overflow:hidden;
  z-index:1;
  pointer-events:none;
  mix-blend-mode:screen;
}
.smoke-puff{
  position:absolute;
  bottom:-25%;
  width:260px;
  height:260px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,255,255,0.11) 0%, rgba(255,255,255,0.05) 45%, transparent 72%);
  filter:blur(20px);
  opacity:0;
  animation:smoke-rise 24s ease-in infinite;
}
.smoke-puff:nth-child(1){ left:6%; width:220px; height:220px; animation-duration:22s; animation-delay:0s; }
.smoke-puff:nth-child(2){ left:34%; width:300px; height:300px; animation-duration:27s; animation-delay:-9s; }
.smoke-puff:nth-child(3){ left:58%; width:240px; height:240px; animation-duration:20s; animation-delay:-4s; }
.smoke-puff:nth-child(4){ left:80%; width:320px; height:320px; animation-duration:29s; animation-delay:-15s; }
@keyframes smoke-rise{
  0%{ transform:translate(0,0) scale(0.85); opacity:0; }
  15%{ opacity:0.5; }
  50%{ transform:translate(2%,-55%) scale(1.15); opacity:0.32; }
  85%{ opacity:0.1; }
  100%{ transform:translate(-3%,-110%) scale(1.4); opacity:0; }
}
@media (prefers-reduced-motion: reduce){
  .smoke-puff{ animation:none; opacity:0; }
}
.hero-content{ position:relative; z-index:2; padding:120px 0 90px; }
.hero h1{
  font-size:clamp(3.2rem, 7.5vw, 5.8rem);
  color:var(--text-onDark);
}
.hero-lede{
  max-width:560px;
  color:var(--text-onDark-dim);
  font-size:1.25rem;
}
.hero-actions{ display:flex; gap:16px; margin-top:1.6em; flex-wrap:wrap; }

/* ---------- reveal ---------- */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1); }
.reveal.is-visible{ opacity:1; transform:none; }

/* ---------- sections ---------- */
.section{ padding:110px 0; position:relative; }
.section.on-dark{
  background:
    radial-gradient(65% 55% at 85% 0%, rgba(227,177,77,0.12), transparent 60%),
    radial-gradient(55% 50% at 5% 100%, rgba(193,80,46,0.10), transparent 60%),
    var(--ink);
  color:var(--text-onDark);
}
.section.on-cream{
  background:
    radial-gradient(70% 55% at 15% 0%, rgba(227,177,77,0.16), transparent 60%),
    radial-gradient(55% 55% at 100% 100%, rgba(193,80,46,0.10), transparent 60%),
    var(--cream);
  color:var(--paper-text);
}
.section.on-cream .eyebrow{ color:var(--gold-2); }
.section-head{ max-width:620px; margin:0 0 3em; }
.section-head h2{ font-size:clamp(1.9rem, 3.6vw, 2.7rem); }
.on-dark .section-head h2{ color:var(--text-onDark); }
.on-cream .section-head h2{ color:var(--paper-text); }
.section-lede{ color:inherit; opacity:0.75; max-width:460px; }

/* ---------- glass card base ---------- */
.value-card,.menu-card,.testimonial-card,.faq-item,.case-block{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  border-radius:var(--radius-lg);
  background:linear-gradient(155deg, rgba(255,255,255,0.10), rgba(255,255,255,0.03));
  backdrop-filter:blur(18px) saturate(1.6);
  -webkit-backdrop-filter:blur(18px) saturate(1.6);
  border:1px solid rgba(255,255,255,0.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.25), var(--shadow-soft);
  transition:transform .45s cubic-bezier(.16,1,.3,1), box-shadow .45s ease;
}
.on-cream .value-card,.on-cream .menu-card,.on-cream .testimonial-card,.on-cream .faq-item,.on-cream .case-block{
  background:linear-gradient(155deg, rgba(255,255,255,0.55), rgba(255,255,255,0.22));
  border-color:rgba(255,255,255,0.55);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.6), 0 20px 45px rgba(43,32,19,0.14);
}
.value-card::before,.menu-card::before,.testimonial-card::before,.faq-item::before,.case-block::before{
  content:'';
  position:absolute;
  top:0; left:-60%;
  width:40%; height:100%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,0.35), transparent);
  transform:translateX(-20%);
  transition:transform .9s cubic-bezier(.16,1,.3,1);
  pointer-events:none;
  z-index:1;
}
.value-card:hover::before,.menu-card:hover::before,.testimonial-card:hover::before,.faq-item:hover::before,.case-block:hover::before{
  transform:translateX(340%);
}
.value-card:hover,.menu-card:hover,.testimonial-card:hover,.case-block:hover{
  transform:translateY(-6px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.3), 0 26px 55px rgba(0,0,0,0.4);
}

/* ---------- value cards ---------- */
.value-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.value-card{ padding:32px 26px; }
.value-card .num{
  display:block;
  font-family:'Oswald',sans-serif;
  font-size:1.6rem;
  color:var(--gold);
  margin-bottom:0.5em;
  transition:transform .3s ease;
}
.value-card:hover .num{ transform:scale(1.15); }
.value-card h3{ font-size:1.05rem; }
.on-dark .value-card h3{ color:var(--text-onDark); }
.value-card p{ font-size:0.92rem; opacity:0.75; margin:0; }

/* ---------- menu cards ---------- */
.menu-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.menu-card{ padding:0; }
.menu-card-media{ aspect-ratio:1/1; overflow:hidden; position:relative; z-index:0; }
.menu-card-media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.16,1,.3,1); }
.menu-card:hover .menu-card-media img{ transform:scale(1.08); }
.menu-card-body{ padding:20px 22px 24px; position:relative; z-index:1; }
.menu-card-top{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.menu-card-top h3{ font-size:1.05rem; margin:0; }
.on-cream .menu-card-top h3{ color:var(--paper-text); }
.price{ font-family:'Oswald',sans-serif; color:var(--gold-2); font-size:1rem; white-space:nowrap; }
.menu-card p{ font-size:0.88rem; opacity:0.75; margin:0.5em 0 0; }

/* ---------- gallery ---------- */
.gallery-grid{ display:grid; grid-template-columns:2fr 1fr; gap:22px; }
.gallery-item{
  position:relative;
  border-radius:var(--radius-lg);
  overflow:hidden;
  border:1px solid rgba(255,255,255,0.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.2), var(--shadow-soft);
  isolation:isolate;
  aspect-ratio:4/3;
}
.gallery-item img{ width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.16,1,.3,1); }
.gallery-item:hover img{ transform:scale(1.06); }
.gallery-item::before{
  content:'';
  position:absolute;
  top:0; left:-60%;
  width:40%; height:100%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,0.3), transparent);
  transform:translateX(-20%);
  transition:transform .9s cubic-bezier(.16,1,.3,1);
  z-index:2;
  pointer-events:none;
}
.gallery-item:hover::before{ transform:translateX(340%); }
.gallery-caption{
  position:absolute;
  left:16px; bottom:14px;
  z-index:2;
  font-family:'Oswald',sans-serif;
  text-transform:uppercase;
  letter-spacing:0.08em;
  font-size:0.78rem;
  color:#fff;
  background:rgba(0,0,0,0.45);
  padding:6px 12px;
  border-radius:999px;
}

/* ---------- stats bar ---------- */
.stats-bar{
  display:flex;
  gap:40px;
  flex-wrap:wrap;
  margin-bottom:3em;
  padding-bottom:2em;
  border-bottom:1px solid rgba(43,32,19,0.14);
}
.stats-bar div{ display:flex; flex-direction:column; }
.stats-bar strong{ font-family:'Oswald',sans-serif; font-size:2.2rem; color:var(--gold-2); }
.stats-bar span{ font-size:0.82rem; opacity:0.65; }

/* ---------- testimonials ---------- */
.testimonial-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.testimonial-card{ padding:28px 26px; margin:0; }
.testimonial-card p{ font-style:italic; opacity:0.9; }
.testimonial-card footer{ display:flex; align-items:center; gap:12px; margin-top:1.2em; }
.avatar{
  width:40px; height:40px;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, var(--gold-soft), var(--gold-2));
  color:var(--ink);
  font-family:'Oswald',sans-serif;
  font-weight:600;
  transition:transform .3s ease;
}
.testimonial-card:hover .avatar{ transform:scale(1.12); }
.testimonial-card footer div{ display:flex; flex-direction:column; font-size:0.85rem; }
.testimonial-card footer strong{ font-size:0.92rem; }
.fake-disclaimer{ font-size:0.76rem; opacity:0.55; margin-top:1.5em; }

/* ---------- case block ---------- */
.case-block{ display:grid; grid-template-columns:1fr 1fr; align-items:stretch; padding:0; }
.case-media{ aspect-ratio:4/5; align-self:stretch; position:relative; z-index:0; overflow:hidden; }
.case-media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.16,1,.3,1); }
.case-block:hover .case-media img{ transform:scale(1.05); }
.case-content{ padding:44px 42px; display:flex; flex-direction:column; justify-content:center; position:relative; z-index:1; }
.case-content h2{ font-size:clamp(1.7rem,3vw,2.3rem); color:var(--text-onDark); }
.case-content p{ opacity:0.8; }

/* ---------- faq ---------- */
.faq-list{ display:flex; flex-direction:column; gap:14px; }
.faq-item{ padding:0; }
.faq-item[open]{
  background:linear-gradient(155deg, rgba(255,255,255,0.7), rgba(255,255,255,0.3));
}
.faq-item summary{
  cursor:pointer;
  list-style:none;
  padding:20px 26px;
  font-family:'Oswald',sans-serif;
  font-size:1rem;
  position:relative;
  z-index:1;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{
  content:'+';
  position:absolute;
  right:26px;
  top:50%;
  transform:translateY(-50%);
  color:var(--gold-2);
  font-size:1.3rem;
}
.faq-item[open] summary::after{ content:'–'; }
.faq-item p{ padding:0 26px 22px; margin:0; opacity:0.75; position:relative; z-index:1; }

/* ---------- contact ---------- */
.contact-wrap{
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:36px;
  align-items:stretch;
}
.contact-info{ padding:6px 0; }
.contact-info h2{ font-size:clamp(1.8rem,3.4vw,2.5rem); color:var(--text-onDark); }
.contact-list{ list-style:none; padding:0; margin:1.4em 0 1.8em; display:flex; flex-direction:column; gap:0.6em; color:var(--text-onDark-dim); }
.map-card{ border-radius:var(--radius-lg); overflow:hidden; border:1px solid rgba(227,177,77,0.2); min-height:260px; }
.map-illustration{
  position:relative;
  height:100%;
  min-height:260px;
}
.map-illustration svg{ width:100%; height:100%; display:block; }
.map-pulse{ transform-origin:330px 190px; animation:map-pulse 2.6s ease-out infinite; }
@keyframes map-pulse{
  0%{ transform:scale(0.6); opacity:0.5; }
  70%{ transform:scale(1.8); opacity:0; }
  100%{ transform:scale(1.8); opacity:0; }
}
.map-caption{
  position:absolute;
  left:16px; bottom:14px;
  color:var(--text-onDark-dim);
  font-family:'Oswald',sans-serif;
  text-transform:uppercase;
  letter-spacing:0.08em;
  font-size:0.72rem;
  background:rgba(22,16,9,0.6);
  padding:6px 12px;
  border-radius:999px;
}

/* ---------- footer ---------- */
.site-footer{ background:var(--ink-2); padding:44px 0; border-top:1px solid rgba(227,177,77,0.12); }
.footer-inner{ text-align:center; }
.footer-inner p{ color:var(--text-onDark-dim); font-size:0.82rem; max-width:560px; margin:0.8em auto 0; }
.footer-credit{ opacity:0.6; }
.footer-credit a{ text-decoration:underline; text-underline-offset:2px; }
.footer-credit a:hover{ opacity:1; }

/* ---------- back to top ---------- */
.back-to-top{
  position:fixed;
  right:28px;
  bottom:28px;
  width:46px; height:46px;
  border-radius:0;
  background:linear-gradient(135deg, var(--gold-soft), var(--gold-2));
  color:var(--ink);
  border:0;
  font-size:1.2rem;
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 24px rgba(0,0,0,0.35);
  opacity:0;
  transform:translateY(12px) scale(0.9);
  pointer-events:none;
  transition:opacity .3s ease, transform .3s cubic-bezier(.16,1,.3,1);
  z-index:45;
}
.back-to-top.is-visible{ opacity:1; transform:translateY(0) scale(1); pointer-events:all; }
.back-to-top:hover{ box-shadow:0 14px 30px rgba(227,177,77,0.4); }

/* ---------- responsive ---------- */
@media (max-width:900px){
  .value-grid{ grid-template-columns:repeat(2,1fr); }
  .menu-grid{ grid-template-columns:repeat(2,1fr); }
  .testimonial-grid{ grid-template-columns:1fr; }
  .gallery-grid{ grid-template-columns:1fr; }
  .case-block{ grid-template-columns:1fr; }
  .case-media{ aspect-ratio:16/10; }
  .contact-wrap{ grid-template-columns:1fr; }
}
@media (max-width:560px){
  .value-grid{ grid-template-columns:1fr; }
  .menu-grid{ grid-template-columns:1fr; }
  .hero-actions{ flex-direction:column; align-items:flex-start; }
}
