:root {
  --bg:#0c0a0b;
  --bg-soft:#161112;
  --card:rgba(255,255,255,0.06);
  --border:rgba(255,255,255,0.09);
  --text:#f7f1eb;
  --muted:#d3c4b7;
  --accent:#7d102c;
  --accent-2:#d7a45f;
  --success:#25D366;
  --shadow:0 18px 45px rgba(0,0,0,.32);
  --radius:24px;
  --max:1220px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Poppins',sans-serif;
  background:
    radial-gradient(circle at top right, rgba(125,16,44,.18), transparent 25%),
    radial-gradient(circle at bottom left, rgba(215,164,95,.08), transparent 22%),
    var(--bg);
  color:var(--text);
  line-height:1.7;
}
a{text-decoration:none;color:inherit}
img{width:100%;display:block}
.container{width:min(100% - 28px, var(--max));margin:0 auto}

.topbar{
  position:sticky;top:0;z-index:1000;
  background:rgba(8,8,10,.84);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.07);
}
.nav{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding:14px 0;
}
.brand{display:flex;align-items:center;gap:14px;min-width:0}
.logo-full{
  width:220px;height:auto;display:block;object-fit:contain;flex-shrink:0;
  filter:drop-shadow(0 10px 25px rgba(0,0,0,.2));
}
.brand-text{display:none}

.nav-links{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.nav-links a{color:#f1e7dd;font-size:.95rem;transition:.25s ease}
.nav-links a:hover,.nav-links a.active{color:var(--accent-2)}

.btn,.nav-btn{
  display:inline-flex;align-items:center;justify-content:center;
  gap:10px;padding:13px 22px;border-radius:999px;
  font-weight:600;border:none;cursor:pointer;
  transition:transform .25s ease, opacity .25s ease;
}
.btn:hover,.nav-btn:hover{transform:translateY(-2px)}
.btn-primary,.nav-btn{
  background:linear-gradient(135deg,var(--accent),#b11d40);
  color:#fff;box-shadow:var(--shadow);
}
.btn-secondary{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.11);
  color:#f8ede3;
}
.btn-whatsapp{background:var(--success);color:#062913;font-weight:700}

.poster-top{padding:22px 0 0}
.poster-wrap{
  position:relative;overflow:hidden;border-radius:32px;min-height:520px;
  border:1px solid rgba(255,255,255,.1);box-shadow:var(--shadow);
  background:
    linear-gradient(90deg, rgba(11,9,10,.92), rgba(11,9,10,.58), rgba(11,9,10,.18)),
    url('images/home-hero-main.png') center/cover;
}
.poster-content{max-width:720px;padding:60px 46px}
.poster-content h1{
  font-size:clamp(2.5rem,4vw,4.8rem);line-height:1.05;margin-bottom:16px;
}
.poster-content h1 span{color:var(--accent-2)}
.poster-content p{color:#eadccf;max-width:580px;margin-bottom:22px;font-size:1.04rem}
.eyebrow{
  display:inline-flex;padding:8px 14px;border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  color:#f1ddd1;font-size:.85rem;margin-bottom:18px;
}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:18px}
.hero-points{display:flex;flex-wrap:wrap;gap:12px}
.point{
  padding:10px 14px;border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
  font-size:.88rem;
}

.hero{
  min-height:auto;position:relative;display:flex;align-items:center;overflow:hidden;
}
.hero-grid{
  display:grid;grid-template-columns:1.05fr .95fr;gap:30px;align-items:center;
  padding:70px 0 56px;
}
.hero-card,.card,.panel{
  background:var(--card);border:1px solid var(--border);
  border-radius:28px;box-shadow:var(--shadow);
}
.hero-card{padding:26px}
.hero-card h3{font-size:1.5rem;margin-bottom:8px}
.hero-card p,.muted,.panel p{color:var(--muted)}
.mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
.mini-card{
  padding:16px;border-radius:18px;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
}
.mini-card h4{margin-bottom:6px}
.mini-card p{font-size:.92rem;color:var(--muted)}

section{padding:78px 0}
.page-hero{
  padding:90px 0 36px;
  background:linear-gradient(180deg, rgba(125,16,44,.14), rgba(125,16,44,.02));
}
.page-hero h1,.page-hero h2,.section-head h2,.section-head h3{
  font-size:clamp(1.8rem,2.8vw,3rem);line-height:1.12;margin-bottom:12px
}
.page-hero p,.section-head p{max-width:760px;color:var(--muted)}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:18px;margin-bottom:28px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}

.feature-box,.offer-card,.contact-card,.form-card,.about-box,.info-box,.faq-card,.news-card,.testimonial-card,.service-card{
  background:var(--card);border:1px solid var(--border);
  border-radius:24px;padding:24px;box-shadow:var(--shadow);
}
.feature-box h4,.offer-card h4,.contact-card h4,.form-card h4,.about-box h4,.info-box h4,.faq-card h4,.news-card h4,.testimonial-card h4,.service-card h4{
  font-size:1.28rem;margin-bottom:10px;
}
.feature-box p,.offer-card p,.contact-card p,.form-card p,.about-box p,.info-box p,.faq-card p,.news-card p,.testimonial-card p,.service-card p{color:var(--muted)}

.tag{
  display:inline-flex;padding:7px 12px;border-radius:999px;
  background:rgba(215,164,95,.12);color:#f3c98f;font-size:.8rem;margin-bottom:14px;
}

.product-card,.gallery-card,.order-card{
  background:var(--card);border:1px solid var(--border);
  border-radius:24px;overflow:hidden;box-shadow:var(--shadow);
  transition:transform .28s ease;
}
.product-card:hover,.gallery-card:hover,.order-card:hover{transform:translateY(-8px)}
.product-image,.gallery-image,.order-image{height:300px;overflow:hidden;background:#1c1718}
.product-image img,.gallery-image img,.order-image img{height:100%;object-fit:cover;transition:transform .5s ease}
.product-card:hover img,.gallery-card:hover img,.order-card:hover img{transform:scale(1.04)}
.product-content,.gallery-content,.order-content{padding:22px}
.product-content h4,.gallery-content h4,.order-content h4{font-size:1.22rem;margin-bottom:8px}
.product-content p,.gallery-content p,.order-content p{color:var(--muted);margin-bottom:14px}
.price-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}
.price{font-size:1.12rem;font-weight:700}
.order-actions{display:flex;gap:10px;flex-wrap:wrap}

.banner{
  padding:30px;border-radius:28px;
  background:
    linear-gradient(135deg, rgba(125,16,44,.94), rgba(62,8,21,.96)),
    url('images/offer-beer-banner.png') center/cover;
  border:1px solid rgba(255,255,255,.11);box-shadow:var(--shadow);
}
.banner h3{font-size:clamp(1.9rem,3vw,3rem);margin-bottom:12px}
.banner p{color:#f3e3d8;max-width:760px;margin-bottom:18px}

.about-layout{display:grid;grid-template-columns:.95fr 1.05fr;gap:24px;align-items:center}
.about-image{border-radius:28px;overflow:hidden;min-height:460px;box-shadow:var(--shadow)}
.about-image img{height:100%;object-fit:cover}
.about-box p{margin-bottom:14px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}
.stat{padding:16px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);text-align:center}
.stat strong{display:block;font-size:1.34rem;margin-bottom:4px}

.premium-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.strip-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:18px;text-align:center}
.strip-card strong{display:block;font-size:1.1rem;margin-bottom:6px}

.booking-help{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.help-card{background:var(--card);border:1px solid var(--border);border-radius:24px;overflow:hidden;box-shadow:var(--shadow)}
.help-card img{height:280px;object-fit:cover}
.help-card .inner{padding:22px}
.help-card .inner h4{font-size:1.24rem;margin-bottom:8px}
.help-card .inner p{color:var(--muted)}
.quick-book-box{margin-top:18px;padding:18px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}
.quick-book-box strong{display:block;margin-bottom:8px}

.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:24px}
.contact-list{display:grid;gap:14px;margin:18px 0}
.contact-item{padding:16px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}
form{display:grid;gap:14px;margin-top:14px}
.input-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
input,select,textarea{
  width:100%;background:rgba(255,255,255,.05);color:#fff;
  border:1px solid rgba(255,255,255,.12);border-radius:16px;
  padding:14px 16px;font:inherit;outline:none;
}
input::placeholder,textarea::placeholder{color:#c9bbb0}
textarea{resize:vertical;min-height:130px}
.success{display:none;padding:14px 16px;border-radius:16px;background:rgba(37,211,102,.12);border:1px solid rgba(37,211,102,.25);color:#bef2d0}
.form-note{font-size:.84rem;color:var(--muted)}
.social-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.social-chip{padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:#f5e9de;font-size:.9rem}

.faq-list{display:grid;gap:16px}
.faq-card h4{font-size:1.05rem}
.news-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:start}
.news-card img{border-radius:18px;margin-bottom:16px}
.blog-articles{display:grid;gap:22px}

.map-box{background:var(--card);border:1px solid var(--border);border-radius:24px;overflow:hidden;box-shadow:var(--shadow)}
.map-frame{width:100%;height:380px;border:0}

.footer{padding:30px 0 36px;border-top:1px solid rgba(255,255,255,.08);margin-top:12px}
.footer-wrap{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:.92rem}
.floating-wa{position:fixed;right:18px;bottom:18px;width:58px;height:58px;border-radius:50%;background:var(--success);color:#062913;display:grid;place-items:center;font-size:28px;box-shadow:var(--shadow);z-index:1200}

@media (max-width: 1100px){
  .premium-strip{grid-template-columns:1fr 1fr}
  .brand{width:100%;justify-content:center}
  .nav{flex-wrap:wrap;justify-content:center}
}
@media (max-width: 1024px){
  .hero-grid,.about-layout,.contact-grid,.grid-3,.grid-2,.stats,.booking-help,.news-grid{grid-template-columns:1fr}
}
@media (max-width: 720px){
  section{padding:60px 0}
  .poster-wrap{min-height:400px}
  .poster-content{padding:34px 22px}
  .input-row,.mini-grid,.premium-strip{grid-template-columns:1fr}
  .nav-btn{width:100%}
  .nav-links{gap:14px;justify-content:center}
  .logo-full{width:180px}
}

.logo-full{width:170px !important;max-width:100%}
.topbar{box-shadow:0 10px 30px rgba(0,0,0,.18)}
.poster-wrap{min-height:560px !important;border-radius:34px !important}
.news-card img{height:280px;object-fit:cover;border-radius:18px;margin-bottom:16px}
.section-head p,.product-content p,.gallery-content p,.order-content p,.about-box p,.feature-box p,.offer-card p,.contact-card p,.form-card p,.faq-card p,.news-card p{font-size:.98rem}
.product-image,.gallery-image,.order-image{height:320px !important}
@media (max-width:720px){
 .logo-full{width:135px !important}
 .poster-wrap{min-height:400px !important}
 .product-image,.gallery-image,.order-image{height:250px !important}
}