/* Smoke Hub - "Serif" design system tokens + components */
:root{--bg:#FAFAF8;--fg:#1A1A1A;--mut:#F5F3F0;--mf:#6B6B6B;--ac:#B8860B;--ac2:#D4A84B;--bd:#E8E4DF;--card:#fff;--sh1:0 1px 2px rgba(26,26,26,.04);--sh2:0 4px 12px rgba(26,26,26,.06);--sh3:0 8px 24px rgba(26,26,26,.08);--serif:"Playfair Display",Georgia,serif;--sans:"Source Sans 3",system-ui,sans-serif;--mono:"IBM Plex Mono",monospace}
html{scroll-behavior:smooth}body{font-family:var(--sans);background:var(--bg);color:var(--fg);line-height:1.75;letter-spacing:.01em;font-size:1.05rem}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.3;z-index:1;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.8' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E")}
h1,h2,h3,h4,h5{font-family:var(--serif);font-weight:400;color:var(--fg);letter-spacing:-.01em;line-height:1.2}
p{color:var(--mf)}a{color:var(--ac);transition:all .2s ease-out}a:hover{color:var(--ac2)}
:focus-visible{outline:2px solid var(--ac);outline-offset:2px}
.sec{padding:6rem 0}.sec-alt{background:var(--mut)}@media(max-width:767px){.sec{padding:3.5rem 0}}
.lbl{display:flex;align-items:center;gap:1rem;font:500 .75rem var(--mono);letter-spacing:.15em;text-transform:uppercase;color:var(--ac);margin-bottom:1.25rem}.lbl::before,.lbl::after{content:"";height:1px;flex:1;background:var(--bd)}.lbl.l::before{display:none}
.h2{font-size:clamp(1.9rem,4vw,2.5rem);margin-bottom:1rem}
.rule{width:64px;height:1px;background:var(--ac);margin:1.25rem 0}
.navbar{background:rgba(250,250,248,.94)!important;backdrop-filter:blur(8px);border-bottom:1px solid var(--bd);box-shadow:none!important}
.nav-link{font:500 .9rem var(--sans)!important;letter-spacing:.05em;color:var(--fg)!important;min-height:44px;display:flex;align-items:center}.nav-link:hover,.nav-link.active{color:var(--ac)!important}
.btn-gold,.btn-line{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:.4rem;border-radius:6px;font-weight:500;letter-spacing:.04em;padding:.65rem 1.7rem;transition:all .2s ease-out;touch-action:manipulation}
.btn-gold{background:var(--ac);color:#fff!important;border:1px solid var(--ac);box-shadow:var(--sh1)}.btn-gold:hover{background:var(--ac2);border-color:var(--ac2);transform:translateY(-2px);box-shadow:0 6px 16px rgba(184,134,11,.25)}.btn-gold:active{transform:none}
.btn-line{border:1px solid var(--fg);color:var(--fg)!important;background:transparent}.btn-line:hover{background:var(--mut);border-color:var(--ac);color:var(--ac)!important}
.hero{position:relative;overflow:hidden;padding:5.5rem 0 4rem}.hero::after{content:"";position:absolute;right:-10%;top:-20%;width:640px;height:640px;border-radius:50%;background:var(--ac);opacity:.02;filter:blur(70px);pointer-events:none}
.hero h1{font-size:clamp(2.5rem,6vw,4.5rem);line-height:1.1;letter-spacing:-.02em}.hero h1 em{color:var(--ac);font-style:italic}.hero .lead{font-size:1.2rem;max-width:34rem}
.frame{position:relative;padding:0 0 1.25rem 1.25rem}.frame::before{content:"";position:absolute;inset:1.25rem 1.25rem 0 0;border:1px solid var(--ac);border-radius:8px}.frame img{position:relative;display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain;border-radius:8px;box-shadow:var(--sh3)}
.float{position:absolute;left:0;bottom:3rem;background:var(--card);border:1px solid var(--bd);border-top:2px solid var(--ac);border-radius:8px;padding:.9rem 1.2rem;box-shadow:var(--sh3)}.float b{font:400 1.7rem var(--serif);color:var(--ac);display:block;line-height:1}.float small{font:500 .7rem var(--mono);letter-spacing:.15em;text-transform:uppercase;color:var(--mf)}
.facts{border-top:1px solid var(--bd);border-bottom:1px solid var(--bd);background:var(--card)}.facts .f{text-align:center;padding:1.6rem .5rem}.facts .f+.f{border-left:1px solid var(--bd)}@media(max-width:767px){.facts .f:nth-child(3){border-left:0}.facts .f:nth-child(n+3){border-top:1px solid var(--bd)}}
.facts b{font:400 2.2rem var(--serif);color:var(--ac);display:block;line-height:1.1}.facts small{font:500 .72rem var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mf)}
.cx{background:var(--card);border:1px solid var(--bd);border-top:2px solid var(--ac);border-radius:8px;padding:2rem;box-shadow:var(--sh1);height:100%;transition:all .2s ease-out}.cx:hover{box-shadow:var(--sh2);background:#fdfcfa}.cx i{font-size:1.6rem;color:var(--ac)}.cx h3{font-size:1.2rem;font-weight:600;margin:.6rem 0 .3rem}.cx p{font-size:.95rem;margin:0}
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.gal a{display:block;overflow:hidden;border-radius:8px;border:1px solid var(--bd);aspect-ratio:1;position:relative;box-shadow:var(--sh1)}.gal a:first-child{grid-column:span 2;grid-row:span 2}.gal img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease-out}.gal a:hover img{transform:scale(1.04)}.gal a::after{content:"\F62C";font-family:bootstrap-icons;position:absolute;right:.8rem;bottom:.8rem;width:38px;height:38px;border-radius:50%;background:var(--ac);color:#fff;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s}.gal a:hover::after{opacity:1}
@media(max-width:991px){.gal{grid-template-columns:repeat(3,1fr)}}@media(max-width:575px){.gal{grid-template-columns:repeat(2,1fr);gap:.6rem}}
.why{display:flex;gap:1.5rem;padding:1.4rem 0;border-top:1px solid var(--bd)}.why:last-child{border-bottom:1px solid var(--bd)}.why .n{font:400 2.6rem/1 var(--serif);color:var(--ac);min-width:3.2rem}.why h3{font-size:1.25rem;font-weight:600;margin-bottom:.2rem}.why p{margin:0}
.tag{display:inline-block;border:1px solid var(--bd);background:var(--card);border-radius:40px;padding:.3rem 1rem;font:500 .72rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--fg)}
.near li{display:flex;align-items:center;gap:.7rem;padding:.55rem 0;border-bottom:1px solid var(--bd);list-style:none}.near i{color:var(--ac)}.near{padding:0;margin:0}
.map-box{border-radius:8px;overflow:hidden;border:1px solid var(--bd);box-shadow:var(--sh3);height:100%;min-height:340px}.map-box iframe{width:100%;height:100%;min-height:340px;border:0;display:block}
.accordion-item{border:0;border-top:1px solid var(--bd);background:transparent}.accordion-item:last-child{border-bottom:1px solid var(--bd)}.accordion-button{background:transparent!important;font:400 1.15rem var(--serif);color:var(--fg)!important;min-height:56px;box-shadow:none!important;padding-left:0}.accordion-button:not(.collapsed){color:var(--ac)!important}.accordion-body{padding:0 0 1.4rem;color:var(--mf)}
.band{background:var(--fg);color:#fff;text-align:center;padding:5rem 0}.band h2{color:#fff;font-size:clamp(1.9rem,4vw,2.8rem)}.band p{color:#cfcfcf}.band .btn-line{border-color:#fff;color:#fff!important}.band .btn-line:hover{background:rgba(255,255,255,.08);border-color:var(--ac2);color:var(--ac2)!important}
footer{background:var(--fg)!important;color:#cfcfcf;border-top:2px solid var(--ac)}footer h5,footer h6{font-family:var(--serif);color:#fff!important}footer .text-success{color:var(--ac2)!important}footer a{color:#d9c28a}footer a:hover{color:#fff}
.lb{position:fixed;inset:0;background:rgba(26,26,26,.94);display:none;align-items:center;justify-content:center;z-index:9999;padding:20px}.lb.on{display:flex}.lb img{max-width:92%;max-height:88vh;border-radius:8px}.lb button{position:absolute;color:#fff;background:none;border:0;font-size:2.4rem;line-height:1;min-width:44px;min-height:44px}.lb .x{top:14px;right:22px}.lb .p{left:14px;top:50%}.lb .nx{right:14px;top:50%}.lb button:hover{color:var(--ac2)}
.callbar{display:none}@media(max-width:767px){.callbar{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:1000;box-shadow:0 -4px 16px rgba(26,26,26,.2)}.callbar a{flex:1;text-align:center;padding:.85rem;font-weight:600;color:#fff;text-decoration:none;min-height:48px}body{padding-bottom:48px}}
.rv{opacity:0;transform:translateY(14px);transition:opacity .6s ease-out,transform .6s ease-out}.rv.in{opacity:1;transform:none}@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}
.phead{padding:5rem 0 3.5rem;text-align:center;border-bottom:1px solid var(--bd);position:relative;overflow:hidden}.phead::after{content:"";position:absolute;right:-10%;top:-40%;width:520px;height:520px;border-radius:50%;background:var(--ac);opacity:.02;filter:blur(70px);pointer-events:none}.phead h1{font-size:clamp(2.3rem,5vw,3.6rem);line-height:1.1;letter-spacing:-.02em}.phead h1 em{color:var(--ac);font-style:italic}.phead .lead{max-width:44rem;margin:1rem auto 0;font-size:1.15rem}
.form-control{min-height:48px;border:1px solid var(--bd);border-radius:6px;background:transparent;font-family:var(--sans);font-size:1rem;color:var(--fg)}.form-control:hover{border-color:#cfc8bf}.form-control:focus{border-color:var(--ac);box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--ac);background:transparent}.form-control::placeholder{color:rgba(107,107,107,.6)}.form-label{font:500 .72rem var(--mono);letter-spacing:.15em;text-transform:uppercase;color:var(--ac)}
.cat{font:500 .7rem var(--mono);letter-spacing:.15em;text-transform:uppercase;color:var(--ac)}.info p{margin:0 0 .9rem}.info strong{color:var(--fg)}
.gal.u a:first-child{grid-column:auto;grid-row:auto}.gal.u a[hidden]{display:none}
.pg{display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap;margin-top:3rem;padding:0;list-style:none}.pg button{min-width:44px;min-height:44px;border:1px solid var(--bd);background:var(--card);color:var(--ac);border-radius:6px;font:500 .9rem var(--mono);letter-spacing:.05em;transition:all .2s ease-out;touch-action:manipulation}.pg button:hover:not(:disabled){border-color:var(--ac);background:var(--mut)}.pg button.on{background:var(--ac);border-color:var(--ac);color:#fff}.pg button:disabled{color:#b9b3aa;cursor:not-allowed}
.lb .cnt{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);color:#fff;font:500 .75rem var(--mono);letter-spacing:.15em;background:rgba(26,26,26,.7);border:1px solid rgba(255,255,255,.15);padding:.4rem 1.1rem;border-radius:40px}

.gal a { position: relative; display: block; }
.gal .prod-name {
  position: absolute; bottom: 32px; left: 0; right: 0;
  color: #fff; font-weight: 600; font-size: .9rem;
  padding: 0 12px; text-shadow: 0 2px 8px rgba(0,0,0,.7);
}
.gal .prod-price {
  position: absolute; bottom: 8px; left: 0; right: 0;
  color: #d4a017; font-weight: 700; font-size: .85rem;
  padding: 0 12px; text-shadow: 0 2px 8px rgba(0,0,0,.7);
}

/* ═══════════ PRODUCT NAME + PRICE OVERLAY ═══════════ */
.gal a {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 12px;
}
.gal a::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 100px;
  background: linear-gradient(to top, rgba(0,0,0,.85) 0%, rgba(0,0,0,.5) 50%, transparent 100%);
  pointer-events: none;
  z-index: 1;
}
.gal .prod-name {
  position: absolute;
  bottom: 34px; left: 0; right: 0;
  color: #ffffff;
  font-weight: 600;
  font-size: .9rem;
  line-height: 1.25;
  padding: 0 14px;
  text-shadow: 0 2px 6px rgba(0,0,0,.9);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  pointer-events: none;
  z-index: 2;
}
.gal .prod-price {
  position: absolute;
  bottom: 10px; left: 0; right: 0;
  color: #FFD966;
  font-weight: 800;
  font-size: 1rem;
  padding: 0 14px;
  text-shadow: 0 2px 6px rgba(0,0,0,.95);
  pointer-events: none;
  z-index: 2;
  letter-spacing: .3px;
}
/* Hover effect — full darkness */
.gal a:hover img { transform: scale(1.03); }
.gal a img { transition: transform .35s ease; }

/* Mobile */
@media (max-width: 576px) {
  .gal .prod-name { font-size: .8rem; bottom: 30px; }
  .gal .prod-price { font-size: .9rem; }
  .gal a::after { height: 80px; }
}