:root {
  --bg: #100d0d;
  --surface: rgba(28, 21, 21, 0.85);
  --surface-2: rgba(35, 27, 27, 0.95);
  --text: #f7f0e6;
  --muted: #cfbfaa;
  --primary: #b51f28;
  --primary-bright: #e2464f;
  --gold: #dfb76b;
  --jade: #3e7f63;
  --border: rgba(255, 225, 170, 0.15);
  --shadow: 0 30px 60px rgba(0,0,0,0.35);
  --radius: 28px;
  --content: min(1180px, calc(100vw - 2rem));
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:'Inter',system-ui,sans-serif;
  color:var(--text);
  background:radial-gradient(circle at top, #2a1717 0%, #100d0d 40%, #0b0909 100%);
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.page-bg{
  position:fixed; inset:0; pointer-events:none; z-index:-2;
  background:
    radial-gradient(circle at 20% 20%, rgba(229,70,79,.10), transparent 28%),
    radial-gradient(circle at 80% 10%, rgba(223,183,107,.09), transparent 22%),
    radial-gradient(circle at 50% 60%, rgba(62,127,99,.06), transparent 28%);
}
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:20;
  width:var(--content); margin:1rem auto 0; padding:0.85rem 1rem;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  background:rgba(15,12,12,.60); backdrop-filter: blur(16px);
  border:1px solid var(--border); border-radius:999px;
  box-shadow:0 10px 30px rgba(0,0,0,.18);
}
.brand{display:flex; align-items:center; gap:.85rem}
.brand strong{display:block; font-family:'Playfair Display', serif; font-size:1.2rem; letter-spacing:.02em}
.brand small{display:block; font-size:.82rem; color:var(--muted)}
.brand-mark{width:48px; height:48px; border-radius:50%; display:grid; place-items:center; background:radial-gradient(circle at 30% 30%, rgba(226,70,79,.3), rgba(181,31,40,.08)); border:1px solid rgba(226,70,79,.2)}
.brand-mark svg{width:26px; height:26px; stroke:var(--gold); fill:none; stroke-width:5; stroke-linecap:round; stroke-linejoin:round}
.site-nav{display:flex; gap:1rem; align-items:center}
.site-nav a{padding:.5rem .75rem; color:#f0e6d8; border-radius:999px; transition:.25s ease}
.site-nav a:hover{background:rgba(255,255,255,.06)}
.menu-toggle{display:none; background:none; border:none; color:var(--text); font-size:1.5rem}
.hero{position:relative; min-height:100svh; display:grid; place-items:end center; padding:8.5rem 1rem 4rem; isolation:isolate}
.hero-image{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-3; filter:saturate(1.05) contrast(1.05)}
.hero-overlay{position:absolute; inset:0; z-index:-2; background:linear-gradient(180deg, rgba(5,5,6,.25), rgba(10,8,8,.55) 35%, rgba(10,8,8,.82) 100%), linear-gradient(120deg, rgba(181,31,40,.18), transparent 35%)}
.hero-content{width:var(--content); position:relative; padding:2.2rem; border:1px solid var(--border); border-radius:var(--radius); background:linear-gradient(135deg, rgba(16,13,13,.88), rgba(22,17,17,.58)); backdrop-filter: blur(8px); box-shadow:var(--shadow)}
.eyebrow{letter-spacing:.18em; text-transform:uppercase; color:var(--gold); font-weight:700; font-size:.78rem; margin-bottom:.75rem}
.hero h1,.section-heading h2,.section-about h2,.section-visit h2{font-family:'Playfair Display', serif; line-height:1.02; margin:0; letter-spacing:-.02em}
.hero h1{font-size:clamp(2.4rem, 5vw, 5.5rem); max-width:11ch}
.hero-copy{max-width:62ch; color:#f5e8d6; font-size:1.06rem; line-height:1.75; margin:1rem 0 1.5rem}
.hero-actions{display:flex; gap:.75rem; flex-wrap:wrap}
.hero-facts{display:flex; gap:1rem; flex-wrap:wrap; list-style:none; padding:0; margin:1.5rem 0 0; color:var(--muted); font-size:.95rem}
.hero-facts li{padding:.7rem 1rem; border-radius:999px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.06)}
.btn{display:inline-flex; align-items:center; justify-content:center; padding:.95rem 1.35rem; border-radius:999px; font-weight:700; transition:transform .25s ease, box-shadow .25s ease, background .25s ease; border:1px solid transparent; cursor:pointer}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(135deg, var(--primary), var(--primary-bright)); color:white; box-shadow:0 18px 40px rgba(181,31,40,.28)}
.btn-secondary{background:rgba(255,255,255,.04); border-color:rgba(255,255,255,.1); color:var(--text)}
.info-strip{width:var(--content); margin:1.75rem auto 0; padding:1rem 1.25rem; border-radius:22px; display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; background:rgba(255,255,255,.03); border:1px solid var(--border)}
.info-strip span{display:block; color:var(--gold); font-weight:700; font-size:.9rem; margin-bottom:.3rem}
.info-strip strong{font-size:1rem}
.section{width:var(--content); margin:0 auto; padding:6rem 0}
.section-about{display:grid; grid-template-columns:1.1fr .9fr; gap:2rem; align-items:center}
.section-copy p{color:#e5d9ca; line-height:1.8}
.pill-row{display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.5rem}
.pill{padding:.7rem 1rem; border-radius:999px; background:rgba(223,183,107,.08); border:1px solid rgba(223,183,107,.18); color:#f1ddba}
.about-card{border-radius:var(--radius); overflow:hidden; background:var(--surface); border:1px solid var(--border); box-shadow:var(--shadow)}
.about-card img{width:100%; aspect-ratio:4/4.8; object-fit:cover}
.about-card-content{padding:1.25rem 1.25rem 1.45rem}
.about-card-content h3{margin:0 0 .5rem; font-family:'Playfair Display', serif; font-size:1.6rem}
.about-card-content p{margin:0; color:var(--muted); line-height:1.7}
.section-heading{max-width:760px; margin-bottom:2.2rem}
.section-heading h2{font-size:clamp(2rem, 4vw, 3.6rem)}
.section-heading p{color:var(--muted); line-height:1.75}
.signature-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem}
.signature-card{background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015)); border:1px solid var(--border); border-radius:24px; overflow:hidden; box-shadow:var(--shadow); min-height:100%}
.signature-card img{width:100%; aspect-ratio:4/3; object-fit:cover}
.signature-card div{padding:1.1rem 1.1rem 1.3rem}
.signature-card h3{margin:.1rem 0 .5rem; font-family:'Playfair Display', serif; font-size:1.45rem}
.signature-card p,.signature-card li{color:var(--muted); line-height:1.7}
.signature-card ul{margin:.3rem 0 0 1.2rem; padding:0}
.text-card{display:grid; align-items:center}
.gallery-grid{display:grid; grid-template-columns:1.1fr .9fr .9fr; gap:1rem}
.gallery-item{border-radius:26px; overflow:hidden; background:var(--surface); min-height:240px; border:1px solid var(--border); box-shadow:var(--shadow)}
.gallery-item img{width:100%; height:100%; object-fit:cover}
.gallery-large{grid-row:span 2; min-height:500px}
.section-visit{display:grid; grid-template-columns:1.05fr .95fr; gap:1.5rem; align-items:start}
.visit-card,.hours-card{padding:1.5rem; border-radius:28px; background:var(--surface-2); border:1px solid var(--border); box-shadow:var(--shadow)}
.contact-list{list-style:none; padding:0; margin:1rem 0 1.25rem}
.contact-list li{padding:.8rem 0; border-bottom:1px solid rgba(255,255,255,.07); color:#efe3d2}
.contact-list li:last-child{border-bottom:none}
.visit-actions{display:flex; gap:.75rem; flex-wrap:wrap}
.hours-card h3{font-family:'Playfair Display', serif; font-size:1.8rem; margin:.2rem 0 1rem}
.hours-card table{width:100%; border-collapse:collapse}
.hours-card td{padding:.9rem 0; border-bottom:1px solid rgba(255,255,255,.08); color:#efe3d2}
.hours-card td:last-child{text-align:right; color:var(--gold); font-weight:700}
.hours-note{margin-top:1rem; color:var(--muted); line-height:1.7}
.site-footer{width:var(--content); margin:0 auto; padding:1.5rem 0 3rem; display:flex; justify-content:space-between; gap:1rem; color:#bfae97; border-top:1px solid rgba(255,255,255,.08)}
.reveal{opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s ease}
.reveal.is-visible{opacity:1; transform:none}
.floating-lantern{
  position:absolute; width:54px; height:78px; border-radius:35px; border:1px solid rgba(223,183,107,.25);
  background:radial-gradient(circle at 50% 40%, rgba(255,216,155,.85), rgba(235,80,70,.65) 60%, rgba(116,16,25,.15));
  box-shadow:0 0 30px rgba(226,70,79,.35), inset 0 0 20px rgba(255,225,180,.18);
  filter:blur(.1px); opacity:.8;
}
.floating-lantern::before{content:""; position:absolute; left:50%; top:-8px; width:16px; height:8px; transform:translateX(-50%); border-radius:20px; background:#724d2a}
.floating-lantern::after{content:""; position:absolute; left:50%; bottom:-11px; width:2px; height:12px; transform:translateX(-50%); background:rgba(247,240,230,.55)}
.lantern-1{right:9%; top:18%; animation:float 5.8s ease-in-out infinite}
.lantern-2{right:16%; top:29%; width:42px; height:62px; animation:float 6.8s ease-in-out infinite .6s}
.lantern-3{left:8%; top:23%; width:46px; height:68px; animation:float 6.2s ease-in-out infinite 1.2s}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@media (max-width: 980px){
  .site-header{padding:.75rem 1rem; width:calc(100vw - 1rem); margin-top:.5rem}
  .menu-toggle{display:block}
  .site-nav{position:absolute; top:calc(100% + .6rem); left:0; right:0; display:none; flex-direction:column; align-items:stretch; padding:1rem; background:rgba(15,12,12,.94); border-radius:24px; border:1px solid var(--border)}
  .site-nav.open{display:flex}
  .site-nav a{padding:.9rem 1rem}
  .section-about,.section-visit,.signature-grid,.gallery-grid{grid-template-columns:1fr}
  .info-strip{grid-template-columns:1fr}
  .gallery-large{grid-row:auto; min-height:350px}
}
@media (max-width: 640px){
  .hero{padding-top:6.7rem}
  .hero-content{padding:1.4rem}
  .hero-facts{gap:.6rem}
  .hero-facts li{font-size:.88rem; padding:.6rem .85rem}
  .site-footer{flex-direction:column}
  .floating-lantern{display:none}
}
