/* ═══════════════════════════════════════════════════════════
   LAGOST-Food — styles.css
   ═══════════════════════════════════════════════════════════ */

:root {
  --bg:      #010101;
  --card:    #111111;
  --gold:    #C8963E;
  --lgold:   #F0DDB8;
  --white:   #ffffff;
  --soft:    #e2d9cc;
  --muted:   #9a9080;
  --border:  #2a2a2a;
  --font-display: 'Playfair Display', serif;
  --font-body:    'Lato', sans-serif;
  --radius:  4px;
  --transition: 0.3s ease;
  --max-w:   1200px;
  --header-h: 80px;
}

/* Reset */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; font-size:16px; }
body { font-family: var(--font-body); background: var(--bg); color: var(--white); line-height:1.7; }
img { max-width:100%; height:auto; display:block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }

/* Typography */
h1,h2,h3,h4 { font-family: var(--font-display); line-height:1.15; }
h1 { font-size: clamp(2rem, 5vw, 3.5rem); }
h2 { font-size: clamp(1.6rem, 3.5vw, 2.5rem); }
h3 { font-size: clamp(1.2rem, 2.5vw, 1.6rem); }
h4 { font-size: 1rem; font-family: var(--font-body); font-weight:700; letter-spacing:2px; text-transform:uppercase; }
p  { color: var(--soft); font-size:.95rem; }

/* Utility */
.container    { max-width: var(--max-w); margin:0 auto; padding:0 24px; }
.section      { padding: 90px 0; }
.section-label { font-family:var(--font-body); font-size:.7rem; font-weight:700; letter-spacing:4px; text-transform:uppercase; color:var(--gold); margin-bottom:8px; }
.gold-line    { width:40px; height:3px; background:var(--gold); margin:16px 0 24px; }
.text-gold    { color:var(--gold); }
.text-center  { text-align:center; }

/* Buttons */
.btn { display:inline-block; padding:14px 32px; font-family:var(--font-body); font-weight:700; font-size:.85rem; letter-spacing:2px; text-transform:uppercase; border-radius:var(--radius); transition:var(--transition); cursor:pointer; }
.btn-gold     { background:var(--gold); color:#000; }
.btn-gold:hover { background:var(--lgold); }
.btn-outline  { border:1.5px solid var(--gold); color:var(--gold); }
.btn-outline:hover { background:var(--gold); color:#000; }

/* ── HEADER ─────────────────────────────────────────────────── */
.site-header { position:fixed; top:36px; left:0; right:0; z-index:1000; background:rgba(1,1,1,0.92); backdrop-filter:blur(12px); border-bottom:1px solid var(--border); height:var(--header-h); transition:var(--transition); }
.site-header.scrolled { height:64px; }
.header-inner { display:flex; align-items:center; gap:32px; max-width:var(--max-w); margin:0 auto; padding:0 24px; height:100%; }
.header-logo img { height:52px; width:auto; transition:var(--transition); }
.site-header.scrolled .header-logo img { height:42px; }
.header-right { display:flex; align-items:center; gap:16px; margin-left:auto; }

/* Desktop nav */
.nav-desktop > ul { display:flex; gap:8px; align-items:center; }
.nav-desktop li { position:relative; }
.nav-desktop a { padding:8px 14px; font-size:.85rem; font-weight:400; letter-spacing:.5px; color:var(--soft); transition:var(--transition); border-radius:var(--radius); }
.nav-desktop a:hover { color:var(--white); background:rgba(200,150,62,.12); }
.nav-desktop .has-dropdown > a::after { content:'▾'; margin-left:4px; font-size:.7rem; }
.dropdown { display:none; position:absolute; top:100%; left:0; background:var(--card); border:1px solid var(--border); border-radius:var(--radius); min-width:200px; padding:8px 0; }
.has-dropdown:hover .dropdown { display:block; }
.dropdown li a { display:block; padding:10px 20px; font-size:.83rem; }

/* Lang switcher */
/* lang handled in topbar */

/* CTA header btn */
.btn-header { padding:8px 20px; background:var(--gold); color:#000; font-size:.78rem; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; border-radius:var(--radius); transition:var(--transition); }
.btn-header:hover { background:var(--lgold); }

/* Burger */
.burger { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:4px; }
.burger span { display:block; width:24px; height:2px; background:var(--white); border-radius:2px; transition:var(--transition); }
.burger.open span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.burger.open span:nth-child(2) { opacity:0; }
.burger.open span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }

/* Mobile nav */
.nav-mobile { display:none; background:var(--card); border-top:1px solid var(--border); padding:24px; }
.nav-mobile.open { display:block; }
.nav-mobile ul { display:flex; flex-direction:column; gap:4px; margin-bottom:20px; }
.nav-mobile a { display:block; padding:12px 16px; font-size:.9rem; color:var(--soft); border-radius:var(--radius); transition:var(--transition); }
.nav-mobile a:hover { color:var(--white); background:rgba(255,255,255,.05); }
.lang-switcher-mobile { display:flex !important; gap:8px; padding-top:16px; border-top:1px solid var(--border); flex-wrap:wrap; }

/* ── HERO ───────────────────────────────────────────────────── */
.hero { min-height:100vh; display:flex; align-items:center; position:relative; overflow:hidden; padding-top:calc(var(--header-h) + 36px); }
.hero-bg { position:absolute; inset:0; background: radial-gradient(ellipse at 60% 50%, rgba(200,150,62,.08) 0%, transparent 70%), var(--bg); }
.hero-bg::after { content:''; position:absolute; inset:0; background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23C8963E' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); }
.hero-content { position:relative; z-index:2; max-width:var(--max-w); margin:0 auto; padding:80px 24px; display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.hero-eyebrow { font-family:var(--font-body); font-weight:300; font-size:.8rem; letter-spacing:5px; text-transform:uppercase; color:var(--gold); margin-bottom:16px; }
.hero-title { color:var(--white); margin-bottom:24px; }
.hero-sub { color:var(--soft); font-size:1rem; max-width:480px; margin-bottom:40px; }
.hero-btns { display:flex; gap:16px; flex-wrap:wrap; }
.hero-visual { position:relative; }
.hero-logo-wrap { background:var(--bg); border:1px solid var(--border); border-radius:8px; padding:40px; display:flex; align-items:center; justify-content:center; }
.hero-logo-wrap img { width:100%; max-width:360px; }

/* ── STATS ──────────────────────────────────────────────────── */
.stats { background:var(--card); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.stat-item { padding:48px 24px; text-align:center; border-right:1px solid var(--border); }
.stat-item:last-child { border-right:none; }
.stat-num { font-family:var(--font-display); font-size:2.8rem; font-weight:700; color:var(--gold); line-height:1; margin-bottom:8px; }
.stat-lbl { font-size:.72rem; letter-spacing:2px; text-transform:uppercase; color:var(--muted); }

/* ── ABOUT ──────────────────────────────────────────────────── */
.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.about-image { position:relative; }
.about-image img { width:100%; border-radius:4px; }
.about-image::before { content:''; position:absolute; top:-16px; left:-16px; right:16px; bottom:16px; border:1px solid var(--gold); border-radius:4px; z-index:-1; opacity:.4; }

/* ── PRODUCTS ───────────────────────────────────────────────── */
.products-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:48px; }
.product-card { background:var(--card); border:1px solid var(--border); border-radius:4px; overflow:hidden; transition:var(--transition); }
.product-card:hover { border-color:var(--gold); transform:translateY(-4px); }
.product-card-img { height:220px; overflow:hidden; }
.product-card-img img { width:100%; height:100%; object-fit:cover; transition:var(--transition); }
.product-card:hover .product-card-img img { transform:scale(1.04); }
.product-card-body { padding:28px 24px; }
.product-card-body h3 { color:var(--white); margin-bottom:10px; font-size:1.1rem; }
.product-card-body p { font-size:.88rem; margin-bottom:20px; }
.product-card-link { font-size:.75rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--gold); transition:var(--transition); }
.product-card-link:hover { color:var(--lgold); }

/* ── CERT BAND ──────────────────────────────────────────────── */
.cert-band { background:var(--card); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.cert-band-inner { display:grid; grid-template-columns:auto 1fr; gap:60px; align-items:center; padding:80px 24px; max-width:var(--max-w); margin:0 auto; }
.cert-logo-box { border:1px solid var(--border); padding:32px; background:var(--bg); text-align:center; }
.cert-logo-box img { width:80px; height:auto; }

/* ── CTA BAND ───────────────────────────────────────────────── */
.cta-band { background:linear-gradient(135deg, rgba(200,150,62,.12) 0%, transparent 60%), var(--card); border-top:1px solid var(--border); text-align:center; padding:90px 24px; }
.cta-band h2 { margin-bottom:16px; }
.cta-band p { max-width:520px; margin:0 auto 36px; }

/* ── PAGE HERO ──────────────────────────────────────────────── */
.page-hero { padding:calc(140px + 36px) 24px 80px; text-align:center; background:linear-gradient(to bottom, rgba(200,150,62,.06), transparent); }
.page-hero h1 { margin-bottom:16px; }
.page-hero p { max-width:600px; margin:0 auto; font-size:1rem; }

/* ── VALUES ─────────────────────────────────────────────────── */
.values-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin-top:40px; }
.value-card { background:var(--card); border-left:3px solid var(--gold); padding:28px 24px; }
.value-card h3 { font-family:var(--font-body); font-weight:700; font-size:.78rem; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-bottom:10px; }
.value-card p { font-size:.88rem; }

/* ── PRODUCT LIST PAGE ──────────────────────────────────────── */
.prod-layout { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start; }
.prod-photos { display:flex; flex-direction:column; gap:16px; }
.prod-photos img { border-radius:4px; }
.prod-photos .photos-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.prod-list-box { background:var(--card); border-left:3px solid var(--gold); padding:24px 28px; margin-bottom:20px; }
.prod-list-box h3 { font-family:var(--font-body); font-weight:700; font-size:.75rem; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-bottom:14px; }
.prod-list-box ul { display:flex; flex-direction:column; gap:8px; }
.prod-list-box li { font-size:.92rem; color:var(--soft); padding-left:16px; position:relative; }
.prod-list-box li::before { content:'—'; color:var(--gold); position:absolute; left:0; }

/* ── TAKEAWAY BAND ──────────────────────────────────────────── */
.takeaway-band { background:var(--card); border:1px solid var(--border); border-radius:4px; padding:40px; margin-top:40px; display:flex; gap:32px; align-items:center; }
.takeaway-band .icon { font-size:2.5rem; flex-shrink:0; }
.easy-green { display:inline-block; background:rgba(200,150,62,.15); border:1px solid var(--gold); padding:4px 12px; font-size:.72rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--gold); border-radius:20px; margin-top:8px; }

/* ── CERT PAGE ──────────────────────────────────────────────── */
.cert-layout { display:grid; grid-template-columns:auto 1fr; gap:60px; align-items:start; }
.cert-page-logo { border:1px solid var(--border); padding:40px; background:var(--card); text-align:center; }
.cert-page-logo img { width:100px; }
.cert-page-box { background:var(--card); border:1px solid var(--border); padding:32px; margin-top:32px; }
.cert-page-box h3 { font-family:var(--font-body); font-weight:700; font-size:.75rem; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-bottom:12px; }

/* ── COMING SOON ────────────────────────────────────────────── */
.coming-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:32px; }
.coming-card { border:1px solid var(--gold); padding:28px; border-radius:4px; }
.coming-card h3 { font-family:var(--font-display); font-size:1.1rem; font-style:italic; color:var(--lgold); margin-bottom:10px; }
.coming-card p { font-size:.88rem; }

/* ── CONTACT PAGE ───────────────────────────────────────────── */
.contact-layout { display:grid; grid-template-columns:1fr 1.3fr; gap:60px; align-items:start; }
.contact-info-item { display:flex; gap:16px; padding:20px 0; border-bottom:1px solid var(--border); }
.contact-info-item:last-child { border-bottom:none; }
.cinfo-label { font-size:.7rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--gold); min-width:80px; padding-top:2px; }
.cinfo-val { font-size:1rem; color:var(--white); font-weight:300; }
.cinfo-val a:hover { color:var(--gold); }

/* Form */
.contact-form { display:flex; flex-direction:column; gap:16px; }
.form-group { display:flex; flex-direction:column; gap:6px; }
.form-group label { font-size:.75rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--muted); }
.form-group input, .form-group textarea, .form-group select { background:var(--card); border:1px solid var(--border); color:var(--white); padding:14px 16px; font-family:var(--font-body); font-size:.92rem; border-radius:var(--radius); outline:none; transition:var(--transition); }
.form-group input:focus, .form-group textarea:focus { border-color:var(--gold); }
.form-group textarea { min-height:140px; resize:vertical; }
.form-notice { font-size:.8rem; padding:12px 16px; border-radius:var(--radius); }
.form-notice.success { background:rgba(100,200,100,.1); border:1px solid rgba(100,200,100,.3); color:#7cf5a0; }
.form-notice.error   { background:rgba(200,80,80,.1); border:1px solid rgba(200,80,80,.3); color:#f5a0a0; }

/* ── PRIVACY / COOKIE PAGE ──────────────────────────────────── */
.legal-content { max-width:800px; margin:0 auto; }
.legal-content h2 { font-size:1.3rem; margin:40px 0 12px; }
.legal-content p, .legal-content li { font-size:.92rem; margin-bottom:12px; }
.legal-content ul { padding-left:20px; list-style:disc; }

/* ── FOOTER ─────────────────────────────────────────────────── */
.site-footer { background:var(--card); border-top:1px solid var(--border); margin-top:80px; }
.footer-inner { max-width:var(--max-w); margin:0 auto; padding:60px 24px 40px; display:grid; grid-template-columns:2fr 1fr 1fr 1.5fr; gap:48px; }
.footer-brand .footer-tagline { font-size:.82rem; color:var(--muted); margin-top:12px; }
.footer-brand img { margin-bottom:8px; }
.footer-nav h4, .footer-contact h4 { color:var(--white); margin-bottom:16px; font-size:.72rem; }
.footer-nav li, .footer-contact p { margin-bottom:8px; }
.footer-nav a, .footer-contact a { font-size:.85rem; color:var(--muted); transition:var(--transition); }
.footer-nav a:hover, .footer-contact a:hover { color:var(--gold); }
.footer-contact p { font-size:.85rem; color:var(--muted); }
.footer-bottom { border-top:1px solid var(--border); max-width:var(--max-w); margin:0 auto; padding:20px 24px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; font-size:.78rem; color:var(--muted); }
.footer-legal { display:flex; gap:20px; }
.footer-legal a:hover { color:var(--gold); }

/* ── BREADCRUMB ─────────────────────────────────────────────── */
.breadcrumb { max-width:var(--max-w); margin:0 auto; padding:calc(16px + 36px) 24px 0; display:flex; gap:8px; font-size:.78rem; color:var(--muted); }
.breadcrumb a { color:var(--muted); }
.breadcrumb a:hover { color:var(--gold); }
.breadcrumb span { color:var(--gold); }

/* ── REVEAL ANIMATION ───────────────────────────────────────── */
.reveal { opacity:0; transform:translateY(24px); transition:opacity .6s ease, transform .6s ease; }
.reveal.visible { opacity:1; transform:none; }

/* ── RESPONSIVE ─────────────────────────────────────────────── */
@media (max-width:1024px) {
  .hero-content       { grid-template-columns:1fr; gap:40px; }
  .hero-visual        { display:none; }
  .about-grid         { grid-template-columns:1fr; }
  .about-image        { display:none; }
  .footer-inner       { grid-template-columns:1fr 1fr; }
  .stats-grid         { grid-template-columns:repeat(2,1fr); }
  .stat-item          { border-right:none; border-bottom:1px solid var(--border); }
  .stat-item:nth-child(odd) { border-right:1px solid var(--border); }
}

@media (max-width:768px) {
  .nav-desktop        { display:none; }
  .btn-header         { display:none; }
  .burger             { display:flex; }
  .products-grid      { grid-template-columns:1fr; }
  .values-grid        { grid-template-columns:1fr; }
  .coming-grid        { grid-template-columns:1fr; }
  .prod-layout        { grid-template-columns:1fr; }
  .cert-layout        { grid-template-columns:1fr; }
  .cert-band-inner    { grid-template-columns:1fr; gap:32px; }
  .contact-layout     { grid-template-columns:1fr; }
  .footer-inner       { grid-template-columns:1fr; }
  .footer-bottom      { flex-direction:column; text-align:center; }
  .stats-grid         { grid-template-columns:repeat(2,1fr); }
  .hero-btns          { flex-direction:column; }
  .hero-btns .btn     { text-align:center; }
  /* Mobile: hide topbar, reset header to top:0 */
  .header-topbar      { display:none; }
  .site-header        { top:0; }
  .mobile-header-icons{ display:flex; }
  .hero               { padding-top:var(--header-h); }
  .page-hero          { padding:100px 24px 60px; }
  .breadcrumb         { padding:16px 24px 0; }
}

@media (max-width:480px) {
  .stats-grid         { grid-template-columns:1fr; }
  .stat-item          { border-right:none; }
}

/* ── HEADER TOPBAR (desktop only) ───────────────────────────── */
.header-topbar { position:fixed; top:0; left:0; right:0; z-index:1001; background:#000; border-bottom:1px solid var(--border); height:36px; display:flex; align-items:center; }
.header-topbar-inner { width:100%; max-width:var(--max-w); margin:0 auto; padding:0 24px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.topbar-contacts { display:flex; align-items:center; gap:20px; }
.topbar-link { display:flex; align-items:center; gap:5px; font-size:.72rem; color:var(--muted); transition:var(--transition); white-space:nowrap; line-height:1; }
.topbar-link:hover { color:var(--gold); }
.topbar-wa { color:var(--muted); }
.topbar-wa:hover { color:var(--gold); }

/* Lang dropdown */
.topbar-lang { position:relative; }
.lang-current { background:none; border:1px solid var(--border); color:var(--muted); font-size:.72rem; font-weight:700; letter-spacing:1px; padding:3px 10px; border-radius:var(--radius); cursor:pointer; display:flex; align-items:center; gap:4px; transition:var(--transition); font-family:var(--font-body); }
.lang-current:hover, .lang-current.open { color:var(--gold); border-color:var(--gold); }
.lang-arrow { font-size:.6rem; transition:transform .2s; }
.lang-current.open .lang-arrow { transform:rotate(180deg); }
.lang-dropdown { display:none; position:fixed; top:36px; right:24px; background:var(--card); border:1px solid var(--border); border-radius:var(--radius); min-width:80px; padding:6px 0; z-index:1002; }
.lang-dropdown.open { display:block; }
.lang-dropdown li a { display:block; padding:7px 16px; font-size:.75rem; font-weight:700; letter-spacing:1px; color:var(--muted); transition:var(--transition); }
.lang-dropdown li a:hover, .lang-dropdown li a.active { color:var(--gold); background:rgba(200,150,62,.1); }



/* ── MOBILE HEADER ICONS (solo mobile, nell'header) ─────────── */
.mobile-header-icons { display:none; align-items:center; gap:6px; }
.mhi-btn { display:flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:var(--radius); border:1px solid var(--border); color:var(--muted); transition:var(--transition); }
.mhi-btn:hover { color:var(--gold); border-color:var(--gold); }
.mhi-wa { color:var(--gold) !important; border-color:var(--gold) !important; }
.mhi-wa:hover { background:rgba(200,150,62,.1); }

/* ── MOBILE LANG SWITCHER (in menu hamburger) ────────────────── */
.lang-switcher-mobile { display:flex !important; gap:6px; padding-top:16px; border-top:1px solid var(--border); flex-wrap:wrap; }
.lang-switcher-mobile .lang-btn { flex:1; text-align:center; padding:8px 4px; border:1px solid var(--border); border-radius:var(--radius); font-size:.75rem; font-weight:700; color:var(--muted); transition:var(--transition); }
.lang-switcher-mobile .lang-btn.active { color:var(--gold); border-color:var(--gold); background:rgba(200,150,62,.1); }
.lang-switcher-mobile .lang-btn:hover { color:var(--white); border-color:var(--gold); }

/* ── GLACOM BAR ──────────────────────────────────────────────── */
.glacom-bar { background:#000; border-top:1px solid #1a1a1a; text-align:center; padding:10px 24px; font-size:.72rem; color:#555; display:flex; justify-content:center; align-items:center; gap:8px; }
.glacom-bar strong { color:#888; letter-spacing:1px; }
.glacom-bar sup { font-size:.6em; vertical-align:super; }
.glacom-bar a { color:#888; }
.glacom-bar a:hover { color:var(--gold); }