:root{ --primary:#c0392b; --secondary:#f39c12; --dark:#1f2937; --muted:#6b7280; --bg:#fffaf5; --card:#ffffff; --ring:rgba(192,57,43,.25); --radius:18px; }
*{box-sizing:border-box} html,body{margin:0}
body{font-family:Poppins,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,'Noto Sans',sans-serif; color:var(--dark); background:var(--bg)}
a{color:inherit; text-decoration:none} img{max-width:100%; display:block}
.container{width:min(1200px,92%); margin:auto}

/* Nav */
.nav{position:sticky; top:0; z-index:50; backdrop-filter:saturate(1.4) blur(8px); background:rgba(255,250,245,.8); border-bottom:1px solid #eee}
.nav .row{display:flex; align-items:center; justify-content:space-between; padding:.75rem 0}
.brand{display:flex; gap:.6rem; align-items:center; font-weight:700}
.brand .logo{width:40px; height:40px; border-radius:12px; background:linear-gradient(135deg,var(--primary),var(--secondary)); display:grid; place-items:center; color:#fff}
.nav-links{display:flex; gap:.4rem; flex-wrap:wrap; align-items:center}
.nav-links a{padding:.5rem .75rem; border-radius:999px; transition:.2s}
.nav-links a:hover{background:#fff; box-shadow:0 2px 10px rgba(0,0,0,.06)}
.nav-links a.active{background:var(--primary); color:#fff}
.lang-toggle button{background:#1f2937; border:1px solid #2b3443; color:#e5e7eb}
.lang-toggle .active{background:#fff; color:#111827}

/* Hamburger (added) */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.nav .container{position:relative} /* anchor dropdown */
.nav-toggle{
  display:none; /* visible on <=980px */
  align-items:center; justify-content:center;
  width:42px; height:42px; border:1px solid #e5e7eb; border-radius:10px;
  background:#fff; cursor:pointer;
  transition:transform .2s ease, box-shadow .2s ease;
}
.nav-toggle:hover{transform:translateY(-1px); box-shadow:0 8px 18px rgba(0,0,0,.06)}
.nav-toggle .line{display:block; width:22px; height:2px; background:#0f172a; margin:3px 0; transition:transform .25s ease, opacity .25s ease}
.nav.open .nav-toggle .line:nth-child(2){opacity:0}
.nav.open .nav-toggle .line:nth-child(1){transform:translateY(5px) rotate(45deg)}
.nav.open .nav-toggle .line:nth-child(3){transform:translateY(-5px) rotate(-45deg)}

/* Buttons & Chips */
.btn{display:inline-flex; align-items:center; gap:.5rem; padding:.8rem 1.1rem; border-radius:999px; border:1px solid transparent; font-weight:600; cursor:pointer; transition:.2s}
.btn-primary{background:var(--primary); color:#fff}
.btn-primary:hover{transform:translateY(-1px); box-shadow:0 10px 20px var(--ring)}
.btn-ghost{background:#fff; border-color:#eee}
.btn-outline{background:#fff; border-color:var(--primary); color:var(--primary)}
.chips{display:flex; gap:.6rem; flex-wrap:wrap}
.chip{padding:.35rem .7rem; border-radius:999px; background:#fff; border:1px solid #eee; font-size:.85rem}
.badge-green{background:#ecfdf5; color:#065f46; border-color:#a7f3d0}
.badge-blue{background:#eff6ff; color:#1e40af; border-color:#bfdbfe}

/* Hero */
.hero{position:relative; overflow:hidden}
.hero .wrap{display:grid; grid-template-columns:1.1fr .9fr; gap:2rem; align-items:center; padding:3.5rem 0}
.hero h1{font-size:clamp(1.8rem,4.5vw,3rem); line-height:1.1; margin:0 0 1rem}
.hero p{color:var(--muted); margin:0 0 1.25rem}
.hero .badges{display:flex; gap:.75rem; flex-wrap:wrap; margin:1rem 0 1.25rem}
.badge{background:#fff; border:1px solid #eee; padding:.45rem .7rem; border-radius:999px; font-size:.9rem}
.hero .art{position:relative}
.plate{border-radius:var(--radius); overflow:hidden; box-shadow:0 25px 60px rgba(0,0,0,.12)}
.spark{position:absolute; width:100px; height:100px; right:-18px; top:-18px; border-radius:50%; background:radial-gradient(circle at 30% 30%, rgba(243,156,18,.6), rgba(192,57,43,.3) 60%, transparent 70%); filter:blur(8px)}

/* Sections / Cards */
section{padding:3rem 0}
.sec-head{display:flex; align-items:center; justify-content:space-between; gap:1rem; margin:0 0 1.25rem}
.sec-head h2{margin:0; font-size:clamp(1.4rem,3vw,2rem)}
.grid{display:grid; gap:1rem}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--card); border:1px solid #eee; border-radius:var(--radius); padding:1rem; box-shadow:0 6px 24px rgba(0,0,0,.04)}
.card .title{font-weight:600}
.kicker{font-size:.9rem; color:var(--secondary); font-weight:700; letter-spacing:.06em}

/* Specials / Menu */
.special{display:flex; gap:1rem; align-items:center}
.special img{width:84px; height:84px; object-fit:cover; border-radius:14px}
.price{margin-left:auto; font-weight:700; color:var(--primary)}
.qa{display:flex; gap:.8rem; flex-wrap:wrap}
.qa .btn{flex:1 1 160px; justify-content:center}
.tabs{display:flex; gap:.6rem; flex-wrap:wrap; margin:.75rem 0 1.25rem}
.tab{padding:.55rem .9rem; border-radius:999px; border:1px solid #eee; background:#fff; cursor:pointer; font-weight:600}
.tab.active{background:var(--primary); color:#fff; border-color:transparent}
.menu-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:1rem}
.menu-item{display:flex; gap:1rem; align-items:center; background:#fff; border:1px solid #eee; padding:.9rem; border-radius:16px; box-shadow:0 6px 20px rgba(0,0,0,.04)}
.menu-item img{width:88px; height:88px; object-fit:cover; border-radius:12px}
.meta{font-size:.9rem; color:var(--muted)}
.menu-cat{margin:1.5rem 0 .5rem; font-weight:700; font-size:1.2rem}

/* Gallery */
.gallery{display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem}
.gallery img{height:180px; object-fit:cover; border-radius:14px; transition:transform .3s}
.gallery img:hover{transform:scale(1.03)}

/* Forms */
.form{display:grid; grid-template-columns:repeat(2,1fr); gap:1rem}
.input{display:flex; flex-direction:column; gap:.4rem}
.input input, .input select, .input textarea{padding:.8rem 1rem; border:1px solid #e5e7eb; border-radius:12px; font-family:inherit}
.input input:focus, .input select:focus, .input textarea:focus{outline:none; border-color:var(--primary); box-shadow:0 0 0 6px var(--ring)}
.notice{background:#fff; border:1px dashed #f59e0b; padding:1rem; border-radius:14px}

/* Lists & Tables */
.list{display:grid; gap:.6rem}
.list li{display:flex; gap:.6rem; align-items:flex-start}
.tick{width:20px; height:20px; border-radius:6px; background:linear-gradient(135deg,var(--secondary),var(--primary)); display:grid; place-items:center; color:#fff; font-size:.8rem; flex:none}
.table{width:100%; border-collapse:separate; border-spacing:0; border-radius:14px; overflow:hidden; border:1px solid #eee}
.table th, .table td{padding:.75rem 1rem; border-bottom:1px solid #eee; text-align:left}
.table tr:last-child td{border-bottom:0}
.table th{background:#fafafa; font-weight:600}

/* Stepper / Timeline */
.stepper{display:grid; gap:.75rem}
.step{display:grid; grid-template-columns:24px 1fr; gap:.8rem; align-items:start}
.step .dot{width:24px; height:24px; border-radius:999px; background:linear-gradient(135deg,var(--secondary),var(--primary)); color:#fff; display:grid; place-items:center; font-weight:700}

/* FAQ */
details{background:#fff; border:1px solid #eee; border-radius:12px; padding:.8rem 1rem}
details+details{margin-top:.6rem}
summary{cursor:pointer; font-weight:600}

/* Contact */
.contact-grid{display:grid; grid-template-columns:1.2fr .8fr; gap:1rem}
.hours{display:grid; grid-template-columns:1fr 1fr; gap:.5rem}
.hours div{background:#fff; border:1px solid #eee; padding:.6rem .8rem; border-radius:12px}
iframe{width:100%; height:320px; border:0; border-radius:14px}
.transport{display:grid; gap:.5rem}
.transport .row{display:flex; gap:.5rem; align-items:center}

/* Footer */
footer{padding:2rem 0; background:#111827; color:#e5e7eb; margin-top:2rem}
.foot{display:grid; grid-template-columns:1fr auto auto; gap:1rem; align-items:center}

/* Animations */
.reveal{opacity:0; transform:translateY(12px); transition:opacity .6s ease, transform .6s ease}
.reveal.show{opacity:1; transform:none}

/* Responsive */
@media (max-width: 980px){
  /* show hamburger */
  .nav-toggle{display:inline-flex}
  /* collapse nav-links into dropdown */
  .nav .nav-links{
    position:absolute; right:0; top:100%;
    width:min(92vw, 420px);
    background:#fff; border:1px solid #eee; border-radius:14px;
    box-shadow:0 20px 40px rgba(0,0,0,.12);
    padding:.5rem; display:grid; gap:.25rem;

    max-height:0; overflow:hidden;
    opacity:0; visibility:hidden; transform:translateY(-6px);
    transition:max-height .35s ease, opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
  }
  .nav.open .nav-links{
    max-height:85vh; opacity:1; visibility:visible; transform:none;
    transition:max-height .4s ease, opacity .2s ease, transform .2s ease, visibility 0s;
  }
  .nav .nav-links a{display:block; padding:.65rem .7rem; border-radius:10px; font-weight:600}
  .nav .nav-links a:hover{background:#f9fafb}
  .nav .nav-links .lang-toggle{display:flex; gap:.4rem; padding:.5rem .25rem}

  .hero .wrap{grid-template-columns:1fr; padding:2.2rem 0}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .menu-grid{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr 1fr}
  .grid-4{grid-template-columns:1fr 1fr}
  .contact-grid{grid-template-columns:1fr}
  .form{grid-template-columns:1fr}
  .foot{grid-template-columns:1fr}
}
@media (max-width: 640px){
  .hero .wrap{padding:1.6rem 0}
  .gallery img{height:140px}
  .brand .logo{width:36px;height:36px}
}
@media (max-width: 400px){
  .btn{padding:.7rem .9rem}
  .nav .nav-links{width:96vw}
  .brand div:last-child{max-width:58vw; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
}
/* ==== Expanded Footer ==== */
.site-footer{background:#0b0b0b;color:#f5f5f5;margin-top:3rem;padding-top:2.5rem;}
.site-footer a{color:#e9e9e9;text-decoration:none}
.site-footer a:hover{color:#ffb2a6;text-decoration:underline}
.footer-grid{display:grid;gap:2rem;padding:0 0 2rem 0;
  grid-template-columns:repeat(12,minmax(0,1fr))}
.f-title{font-weight:600;margin:0 0 .75rem}
.f-brand{grid-column:span 12}
.f-links{grid-column:span 6}
.f-contact{grid-column:span 6}
.f-hours{grid-column:span 6}
.f-subscribe{grid-column:span 6}

/* md+ */
@media (min-width: 768px){
  .f-brand{grid-column:span 4}
  .f-links{grid-column:span 2}
  .f-contact{grid-column:span 3}
  .f-hours{grid-column:span 2}
  .f-subscribe{grid-column:span 3}
}

.brand{display:flex;gap:.75rem;align-items:center}
.brand .logo{height:40px;width:40px;display:grid;place-items:center;
  border-radius:12px;background:#8B1E1E}
.brand .brand-text{display:flex;flex-direction:column}
.brand .tagline{color:#bbb;font-size:.9rem;margin-top:.25rem}

.usp-list{list-style:none;padding:0;margin:1rem 0 0 0;color:#d7d7d7}
.usp-list li{display:flex;gap:.5rem;align-items:center;margin:.3rem 0}

.f-links ul,.f-hours .hours{list-style:none;padding:0;margin:0}
.f-links li{margin:.35rem 0}

.f-contact .rowy{margin:.35rem 0}
.f-contact .socials{display:flex;gap:.5rem;margin-top:.5rem}
.f-contact .socials a{display:grid;place-items:center;height:28px;width:28px;
  border:1px solid #2a2a2a;border-radius:8px;font-size:.8rem}

.f-hours .hours li{margin:.25rem 0}
.muted{opacity:.75}

.f-subscribe .subscribe{display:flex;gap:.5rem;margin:.5rem 0 1rem}
.f-subscribe input[type="email"]{flex:1;min-width:0;border:1px solid #2a2a2a;
  background:#111;color:#fff;border-radius:10px;padding:.6rem .8rem}
.f-subscribe .btn{border-radius:10px}
.mini-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem}
.mini-grid img{width:100%;height:60px;object-fit:cover;border-radius:8px}

.foot-bottom{border-top:1px solid #1d1d1d;padding:1rem 0;display:flex;
  gap:1rem;justify-content:space-between;flex-wrap:wrap;color:#bdbdbd}
.foot-bottom .credit a{color:#ffddd7}