:root{
  --black:#101010;
  --white:#ffffff;
  --off:#f6f6f4;
  --orange:#f47b20;
  --orange-dark:#d85f09;
  --gray:#777;
  --line:#e9e9e7;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Arial,Helvetica,sans-serif;background:var(--white);color:#171717;line-height:1.65}
img{display:block;width:100%;object-fit:cover}
a{text-decoration:none;color:inherit}
ul{list-style:none}
.container{width:min(1180px,92%);margin:auto}

/* HEADER */
.header{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,.97);backdrop-filter:blur(12px);border-bottom:1px solid rgba(0,0,0,.06)}
.nav{height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{font-size:29px;font-weight:900;letter-spacing:5px;color:var(--black)}
.logo span{color:var(--orange)}
.nav-links{display:flex;align-items:center;gap:26px}
.nav-links a{font-size:14px;font-weight:800;position:relative}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-8px;width:0;height:2px;background:var(--orange);transition:.25s}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
.contact-link{padding:11px 18px;border-radius:999px;background:var(--black);color:#fff!important}
.contact-link::after{display:none}
.menu-toggle{display:none;border:0;background:none;font-size:28px;cursor:pointer}

/* HERO */
.hero{min-height:82vh;display:flex;align-items:center;color:#fff;background:
linear-gradient(90deg,rgba(0,0,0,.75),rgba(0,0,0,.25)),
url("images/hero.jpg") center/cover no-repeat}
.hero-content{max-width:720px;padding:90px 0}
.eyebrow{display:inline-block;color:var(--orange);font-size:12px;letter-spacing:3px;text-transform:uppercase;font-weight:900;margin-bottom:14px}
.hero h1{font-size:clamp(48px,7vw,82px);line-height:1.02;margin-bottom:20px;letter-spacing:-2px}
.hero p{font-size:18px;color:#e6e6e6;max-width:640px}
.actions{display:flex;gap:13px;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:49px;padding:0 24px;border-radius:999px;font-weight:900;border:0;cursor:pointer;transition:.25s}
.btn-orange{background:var(--orange);color:#fff}
.btn-orange:hover{background:var(--orange-dark);transform:translateY(-2px)}
.btn-outline{border:1px solid rgba(255,255,255,.65);color:#fff}
.btn-outline:hover{background:#fff;color:#111}

/* GENERAL */
.section{padding:88px 0}
.section-soft{background:var(--off)}
.section-dark{background:var(--black);color:#fff}
.section-head{max-width:690px;margin-bottom:38px}
.section-head.center{text-align:center;margin-left:auto;margin-right:auto}
.section-head span{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--orange);font-weight:900}
.section-head h2{font-size:clamp(32px,4vw,50px);line-height:1.1;margin:8px 0 13px}
.section-head p{color:var(--gray)}
.section-dark .section-head p{color:#bbb}

.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.split-media{height:420px;border-radius:18px;overflow:hidden}
.split-media img{height:100%;width:100%;object-fit:cover}
.split-copy h2{font-size:44px;line-height:1.12;margin:10px 0 18px}
.split-copy p{color:var(--gray);margin-bottom:14px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:24px}
.stat{padding-top:15px;border-top:2px solid var(--orange)}
.stat strong{display:block;font-size:24px}
.stat span{font-size:12px;color:var(--gray)}

/* FOOD CARDS */
.cards,.menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.food-card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;transition:.3s}
.food-card:hover{transform:translateY(-5px);box-shadow:0 15px 38px rgba(0,0,0,.08)}
.food-card img{width:100%;aspect-ratio:4/3;height:auto;object-fit:cover}
.food-body{padding:20px}
.food-row{display:flex;justify-content:space-between;gap:15px;align-items:flex-start}
.food-row h3{font-size:21px}
.price{color:var(--orange);font-weight:900;white-space:nowrap}
.food-body p{font-size:14px;color:var(--gray);margin-top:6px}

/* REVIEWS */
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.review{background:#fff;border:1px solid var(--line);padding:26px;border-radius:16px}
.stars{color:var(--orange);letter-spacing:2px;margin-bottom:12px}
.review p{color:var(--gray);margin-bottom:15px}
.review small{display:block;color:#999}

/* GALLERY */
.gallery{display:grid;grid-template-columns:1.25fr .75fr .75fr;grid-template-rows:210px 210px;gap:12px}
.gallery img{height:100%;border-radius:14px;object-fit:cover}
.gallery .g1{grid-row:1/3}
.gallery .g4{grid-row:1/3;grid-column:3}

/* PAGE HERO */
.page-hero{min-height:330px;display:flex;align-items:flex-end;color:#fff;background:
linear-gradient(rgba(0,0,0,.55),rgba(0,0,0,.55)),
url("images/gallery-2.jpg") center/cover no-repeat}
.page-hero .container{padding-bottom:48px}
.page-hero h1{font-size:clamp(42px,6vw,66px);line-height:1}
.page-hero p{max-width:620px;color:#e5e5e5;margin-top:12px}

/* MENU TABS */
.menu-tabs{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:35px}
.menu-tab{border:1px solid #ddd;background:#fff;padding:11px 22px;border-radius:999px;font-weight:900;cursor:pointer}
.menu-tab.active,.menu-tab:hover{background:var(--orange);color:#fff;border-color:var(--orange)}
.menu-panel{display:none}
.menu-panel.active{display:block}

/* ABOUT */
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.team-card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.team-card img{width:100%;aspect-ratio:4/3;height:auto;object-fit:cover}
.team-card div{padding:20px}
.team-card h3{font-size:21px}
.team-card span{color:var(--orange);font-size:13px;font-weight:900}

/* CHAT */
.chat-shell{max-width:820px;margin:auto;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.08)}
.chat-head{background:var(--black);color:#fff;padding:22px 26px}
.chat-head p{font-size:13px;color:#bbb}
.chat-body{height:430px;overflow-y:auto;padding:22px;display:flex;flex-direction:column;gap:12px}
.message{max-width:80%;padding:12px 15px;border-radius:15px;font-size:14px}
.bot{background:#f0f0ee;align-self:flex-start}
.user{background:var(--orange);color:#fff;align-self:flex-end}
.chat-form{display:flex;gap:10px;padding:15px;border-top:1px solid var(--line)}
.chat-form input{flex:1;border:1px solid #ddd;border-radius:999px;padding:13px 16px;outline:none}
.chat-form button{border:0;background:var(--black);color:#fff;border-radius:999px;padding:0 21px;font-weight:900;cursor:pointer}

/* CONTACT */
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:52px}
.contact-info h2{font-size:44px;line-height:1.12;margin:9px 0 16px}
.contact-info p{color:var(--gray)}
.info-list{margin-top:25px}
.info-item{padding:15px 0;border-bottom:1px solid var(--line)}
.info-item strong{display:block;color:var(--orange)}
.form-card{background:var(--off);padding:30px;border-radius:18px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field.full{grid-column:1/-1}
.field label{display:block;font-size:12px;font-weight:900;margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;border:1px solid #ddd;border-radius:10px;padding:13px;background:#fff;outline:none}
.field textarea{min-height:125px;resize:vertical}

/* FOOTER */
.footer{background:#0a0a0a;color:#fff;padding:58px 0 22px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.4fr;gap:34px;padding-bottom:38px}
.footer-logo{font-size:30px;font-weight:900;letter-spacing:5px;margin-bottom:10px}
.footer h4{color:var(--orange);margin-bottom:10px}
.footer p,.footer a{font-size:14px;color:#aaa}
.footer-links{display:flex;flex-direction:column;gap:7px}
.footer-bottom{padding-top:18px;border-top:1px solid rgba(255,255,255,.1);font-size:12px;color:#777;display:flex;justify-content:space-between;gap:20px}

@media(max-width:900px){
  .menu-toggle{display:block}
  .nav-links{display:none;position:absolute;top:78px;left:0;right:0;background:#fff;padding:24px;flex-direction:column;box-shadow:0 15px 30px rgba(0,0,0,.08)}
  .nav-links.open{display:flex}
  .split,.contact-grid{grid-template-columns:1fr}
  .cards,.menu-grid,.reviews,.team{grid-template-columns:1fr 1fr}
  .gallery{grid-template-columns:1fr 1fr;grid-template-rows:280px 210px 210px}
  .gallery .g1{grid-column:1/3;grid-row:auto}
  .gallery .g4{grid-column:auto;grid-row:auto}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:650px){
  .section{padding:68px 0}
  .hero{min-height:76vh}
  .hero h1{font-size:48px}
  .split-media{height:300px}
  .cards,.menu-grid,.reviews,.team,.stats,.form-grid,.footer-grid{grid-template-columns:1fr}
  .gallery{grid-template-columns:1fr;grid-template-rows:auto}
  .gallery .g1,.gallery .g4{grid-column:auto;grid-row:auto}
  .gallery img{height:220px}
  .food-card img,.team-card img{aspect-ratio:4/3}
  .page-hero{min-height:280px}
  .contact-info h2,.split-copy h2{font-size:36px}
  .footer-bottom{flex-direction:column}
}


/* =========================================================
   DESKTOP-ONLY FIXES
   These rules apply only to screens wider than 900px.
   Mobile/tablet rules above remain unchanged.
   ========================================================= */
@media (min-width:901px){

  /* HOME / ABOUT / CONTACT: smaller image on the left, text on the right */
  .split{
    grid-template-columns:minmax(0,420px) minmax(0,1fr);
    gap:52px;
    align-items:center;
  }

  .split-media{
    width:100%;
    max-width:420px;
    height:300px;
    border-radius:18px;
    overflow:hidden;
  }

  .split-media img{
    width:100%;
    height:100%;
    object-fit:cover;
  }

  .split-copy{
    min-width:0;
  }

  .split-copy h2{
    font-size:40px;
    line-height:1.14;
    margin:8px 0 16px;
  }

  /* Keep text inside food cards away from the edges */
  .food-body{
    padding:16px 18px 18px;
  }

  .food-row{
    display:block;
    margin-bottom:6px;
  }

  .food-row h3{
    margin:0;
    font-size:19px;
    line-height:1.25;
  }

  .price{
    display:block;
    margin-top:4px;
    font-size:14px;
    line-height:1.25;
  }

  .food-body p{
    margin-top:7px;
    font-size:13px;
    line-height:1.5;
  }

  /* MENU: smaller, consistent cards in a clean 3-column grid */
  .menu-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:24px;
    max-width:1040px;
    margin-left:auto;
    margin-right:auto;
    align-items:start;
  }

  .menu-grid .food-card{
    width:100%;
    max-width:330px;
    margin:0 auto;
  }

  .menu-grid .food-card img{
    width:100%;
    height:165px;
    aspect-ratio:auto;
    object-fit:cover;
  }

  .menu-grid .food-body{
    min-height:118px;
  }

  /* TEAM: three smaller, balanced cards on one row */
  .team{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:24px;
    max-width:980px;
    margin-left:auto;
    margin-right:auto;
    align-items:start;
  }

  .team-card{
    width:100%;
    max-width:310px;
    margin:0 auto;
  }

  .team-card img{
    width:100%;
    height:190px;
    aspect-ratio:auto;
    object-fit:cover;
  }

  .team-card div{
    padding:16px 18px 18px;
  }

  .team-card h3{
    font-size:19px;
    line-height:1.25;
  }

  .team-card p{
    font-size:13px;
    line-height:1.5;
    margin-top:5px;
  }

  /* HOME GALLERY: desktop slider / post-style presentation */
  .gallery.desktop-slider-ready{
    display:block;
    position:relative;
    width:min(720px,100%);
    height:420px;
    margin:0 auto;
    border-radius:18px;
    overflow:hidden;
    background:#111;
    box-shadow:0 18px 45px rgba(0,0,0,.10);
  }

  .gallery.desktop-slider-ready img{
    display:none;
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:0;
  }

  .gallery.desktop-slider-ready img.slider-active{
    display:block;
  }

  .gallery-arrow{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    z-index:5;
    width:44px;
    height:44px;
    border:0;
    border-radius:50%;
    background:rgba(255,255,255,.92);
    color:#111;
    font-size:28px;
    line-height:1;
    cursor:pointer;
    box-shadow:0 6px 18px rgba(0,0,0,.16);
    transition:.2s;
  }

  .gallery-arrow:hover{
    background:var(--orange);
    color:#fff;
  }

  .gallery-arrow.prev{left:16px}
  .gallery-arrow.next{right:16px}

  .gallery-dots{
    position:absolute;
    left:50%;
    bottom:15px;
    transform:translateX(-50%);
    z-index:5;
    display:flex;
    gap:8px;
    padding:7px 10px;
    border-radius:999px;
    background:rgba(0,0,0,.34);
  }

  .gallery-dot{
    width:9px;
    height:9px;
    border:0;
    border-radius:50%;
    background:rgba(255,255,255,.58);
    cursor:pointer;
    padding:0;
  }

  .gallery-dot.active{
    background:var(--orange);
  }

  /* Contact location section uses the same compact split layout */
  .section-soft .split{
    align-items:center;
  }
}