:root{--bg:#141110;--panel:#1c1815;--ink:#f3ece2;--muted:#a89d8f;--gold:#c9a24d;--line:rgba(201,162,77,.25);}
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:'Tajawal',sans-serif;background:var(--bg);color:var(--ink);line-height:1.8;overflow-x:hidden;}
h1,h2,h3{font-family:'Amiri',serif;}
.eyebrow{color:var(--gold);letter-spacing:2px;font-weight:700;font-size:13px;text-transform:uppercase;margin-bottom:14px;}
.center{text-align:center;}
#mainNav{position:fixed;top:0;left:0;right:0;z-index:200;padding:24px 0;transition:.4s;}
#mainNav.scrolled{background:rgba(20,17,16,.92);backdrop-filter:blur(8px);padding:14px 0;border-bottom:1px solid var(--line);}
.nav-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:0 32px;}
.brand{font-family:'Amiri',serif;font-size:26px;font-weight:700;color:var(--gold);}
.nav-links{list-style:none;display:flex;gap:36px;}
.nav-links a{color:var(--ink);text-decoration:none;font-weight:500;font-size:15px;position:relative;padding-bottom:4px;}
.nav-links a::after{content:"";position:absolute;bottom:0;right:0;width:0;height:1px;background:var(--gold);transition:.3s;}
.nav-links a:hover::after{width:100%;}
.hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;}
.hamburger span{width:24px;height:2px;background:var(--ink);}
.hero{position:relative;min-height:100vh;display:flex;align-items:center;padding-top:100px;overflow:hidden;}
.hero-watermark{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:'Amiri',serif;font-size:260px;color:rgba(201,162,77,.05);white-space:nowrap;z-index:0;font-weight:700;}
.hero-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center;padding:0 32px;position:relative;z-index:1;}
.hero-copy h1{font-size:50px;line-height:1.5;margin:18px 0 22px;font-weight:700;}
.hero-copy h1 em{color:var(--gold);font-style:normal;}
.lead{color:var(--muted);font-size:17px;max-width:480px;margin-bottom:30px;}
.link-cta{color:var(--ink);font-weight:700;text-decoration:none;border-bottom:2px solid var(--gold);padding-bottom:6px;}
.link-cta span{display:inline-block;transition:.3s;}
.link-cta:hover span{transform:translateX(-6px);}
.hero-visual{position:relative;}
.visual-block{background:linear-gradient(150deg,#2a1e12,#3a2413);height:440px;border-radius:2px;position:relative;}
.visual-block::before{content:"";position:absolute;inset:16px;border:1px solid var(--line);}
.visual-tag{position:absolute;bottom:-18px;right:-18px;background:var(--gold);color:#1c1815;padding:14px 22px;font-weight:700;font-size:14px;}
.stats-strip{display:flex;align-items:center;justify-content:center;gap:40px;padding:60px 32px;background:var(--panel);flex-wrap:wrap;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.stat{text-align:center;}
.stat h3{font-size:32px;color:var(--gold);}
.stat p{font-size:13px;color:var(--muted);margin-top:4px;}
.divider{width:1px;height:40px;background:var(--line);}
.about{padding:120px 32px;max-width:1200px;margin:0 auto;}
.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:center;}
.about-copy h2{font-size:32px;margin-bottom:20px;}
.about-copy p{color:var(--muted);margin-bottom:16px;}
.menu-section{padding:120px 32px;max-width:1000px;margin:0 auto;}
.menu-section h2{font-size:32px;margin:14px 0 60px;}
.menu-cat{margin-bottom:50px;}
.menu-cat h3{color:var(--gold);font-size:22px;margin-bottom:22px;letter-spacing:1px;}
.menu-line{display:flex;align-items:baseline;gap:10px;padding:12px 0;border-bottom:1px dashed rgba(255,255,255,.08);}
.menu-line .name{font-size:17px;white-space:nowrap;}
.menu-line .desc{color:var(--muted);font-size:13px;white-space:nowrap;}
.menu-line .dots{flex:1;border-bottom:1px dotted rgba(255,255,255,.25);transform:translateY(-4px);}
.menu-line .price{color:var(--gold);font-weight:700;font-size:16px;white-space:nowrap;}
.gallery{padding:0 32px 120px;max-width:1200px;margin:0 auto;}
.gallery h2{font-size:32px;margin:14px 0 50px;}
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:160px;gap:14px;}
.g-item{background:linear-gradient(150deg,#3a2413,#c9a24d);border-radius:2px;opacity:.85;}
.g-item.tall{grid-row:span 2;}
.testimonials{max-width:760px;margin:0 auto;padding:20px 32px 120px;text-align:center;}
.quote-mark{font-family:'Amiri',serif;font-size:70px;color:var(--gold);line-height:1;}
.quote{font-size:20px;font-family:'Amiri',serif;margin-bottom:18px;}
.quote-name{color:var(--muted);font-size:14px;}
.contact{background:var(--panel);padding:120px 32px;border-top:1px solid var(--line);}
.contact-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:70px;}
.contact-info h2{font-size:30px;margin:14px 0 30px;}
.contact-info ul{list-style:none;}
.contact-info li{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--line);color:var(--muted);}
.contact-info li span{color:var(--gold);font-weight:700;min-width:70px;}
.contact-form{display:flex;flex-direction:column;gap:30px;}
.field{position:relative;}
.field input,.field select{width:100%;background:transparent;border:none;border-bottom:1px solid var(--line);padding:10px 0;color:var(--ink);font-size:16px;outline:none;}
.field label{position:absolute;right:0;top:10px;color:var(--muted);transition:.25s;pointer-events:none;font-size:15px;}
.field input:focus + label,.field input:not(:placeholder-shown) + label{top:-16px;font-size:12px;color:var(--gold);}
.contact-form button{background:var(--gold);color:#1c1815;border:none;padding:16px;font-weight:700;font-size:15px;cursor:pointer;margin-top:10px;transition:.3s;}
.contact-form button:hover{background:#e0b95e;}
footer{text-align:center;padding:26px;color:var(--muted);font-size:13px;background:var(--bg);border-top:1px solid var(--line);}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s ease;}
.reveal.visible{opacity:1;transform:translateY(0);}
@media(max-width:900px){
  .hero-grid,.about-grid,.contact-grid{grid-template-columns:1fr;}
  .hero-watermark{font-size:150px;}
  .hero-copy h1{font-size:34px;}
  .gallery-grid{grid-template-columns:1fr 1fr;}
  .menu-line .desc{display:none;}
}
@media(max-width:640px){
  .nav-links{position:fixed;top:0;bottom:0;left:0;width:240px;background:var(--panel);flex-direction:column;padding:100px 30px;gap:26px;transform:translateX(-100%);transition:.35s;box-shadow:4px 0 20px rgba(0,0,0,.3);}
  .nav-links.active{transform:translateX(0);}
  .hamburger{display:flex;}
  .stats-strip{gap:20px;}
  .stat h3{font-size:24px;}
}


/* ===== Professional header/footer redesign additions ===== */
.topbar{max-height:40px;overflow:hidden;opacity:1;transition:.4s;background:var(--panel);border-bottom:1px solid var(--line);}
#mainNav.scrolled .topbar{max-height:0;opacity:0;border-bottom:none;}
.topbar-inner{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;padding:8px 32px;font-size:13px;color:var(--muted);flex-wrap:wrap;gap:8px;}
.topbar-inner a{color:var(--muted);text-decoration:none;transition:.3s;}
.topbar-inner a:hover{color:var(--gold);}
.topbar-phone i{margin-left:6px;color:var(--gold);}
.topbar-social{display:flex;gap:12px;}
.topbar-social a{width:24px;height:24px;border:1px solid var(--line);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;transition:.3s;}
.topbar-social a:hover{background:var(--gold);color:var(--bg);border-color:var(--gold);}

.nav-inner{gap:10px;flex-wrap:wrap;}
.brand-wrap{display:flex;align-items:center;gap:12px;}
.logo-circle{width:44px;height:44px;border-radius:50%;background:linear-gradient(150deg,var(--gold),#e0b95e);display:flex;align-items:center;justify-content:center;color:var(--bg);font-size:18px;box-shadow:0 4px 14px rgba(201,162,77,.4);flex-shrink:0;}

.nav-cta{position:relative;background:var(--gold);color:var(--bg);padding:10px 24px;border-radius:30px;font-weight:700;font-size:14px;text-decoration:none;transition:.3s;margin-left:20px;display:inline-block;}
.nav-cta::before{content:"";position:absolute;inset:0;border-radius:30px;box-shadow:0 0 0 0 rgba(201,162,77,.6);animation:navpulse 2.2s infinite;}
@keyframes navpulse{0%{box-shadow:0 0 0 0 rgba(201,162,77,.55);}70%{box-shadow:0 0 0 12px rgba(201,162,77,0);}100%{box-shadow:0 0 0 0 rgba(201,162,77,0);}}
.nav-cta:hover{background:#e0b95e;transform:translateY(-2px);}

/* Circular animated gallery */
.gallery-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:26px;}
.g-item{width:180px;height:180px;border-radius:50%;cursor:pointer;transition:transform .5s cubic-bezier(.22,1,.36,1), box-shadow .5s ease, opacity .5s ease;box-shadow:0 8px 20px rgba(0,0,0,.4);}
.g-item:hover{transform:scale(1.12);box-shadow:0 14px 34px rgba(201,162,77,.45);}
.g-item.enlarged{transform:scale(1.45);z-index:6;box-shadow:0 28px 55px rgba(201,162,77,.65);}
.g-item.shrink{transform:scale(0.8);opacity:.55;}

/* Featured menu (4 dishes) */
.featured-menu-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:40px;margin:20px 0 50px;}
.fm-card{text-align:center;width:200px;transition:transform .4s ease;}
.fm-card:hover{transform:translateY(-8px);}
.fm-circle{width:150px;height:150px;border-radius:50%;margin:0 auto 18px;background-size:cover;background-position:center;box-shadow:0 10px 26px rgba(0,0,0,.4);border:3px solid var(--line);transition:transform .4s ease, box-shadow .4s ease, border-color .4s ease;}
.fm-card:hover .fm-circle{transform:scale(1.08);box-shadow:0 16px 36px rgba(201,162,77,.5);border-color:var(--gold);}
.fm-card h4{font-size:18px;margin-bottom:6px;}
.fm-card .fm-price{color:var(--gold);font-weight:700;font-size:15px;}
.menu-cta-wrap{text-align:center;}
.menu-cta-btn{display:inline-flex;align-items:center;gap:10px;background:transparent;border:2px solid var(--gold);color:var(--gold);padding:14px 34px;border-radius:40px;font-weight:700;font-size:15px;text-decoration:none;transition:.35s;}
.menu-cta-btn:hover{background:var(--gold);color:var(--bg);transform:translateY(-3px);box-shadow:0 12px 28px rgba(201,162,77,.4);}

/* Professional footer */
.site-footer{background:var(--panel);border-top:1px solid var(--line);padding:80px 32px 0;position:relative;}
.footer-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:50px;padding-bottom:60px;}
.footer-brand h3{font-family:'Amiri',serif;color:var(--gold);font-size:26px;margin-bottom:14px;}
.footer-brand p{color:var(--muted);font-size:14px;max-width:280px;margin-bottom:22px;}
.footer-social{display:flex;gap:12px;}
.footer-social a{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--ink);text-decoration:none;transition:.3s;}
.footer-social a:hover{background:var(--gold);border-color:var(--gold);color:var(--bg);transform:translateY(-4px);}
.footer-col h4{color:var(--ink);font-size:16px;margin-bottom:20px;}
.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:12px;}
.footer-col li{color:var(--muted);font-size:14px;display:flex;gap:8px;align-items:flex-start;}
.footer-col li i{color:var(--gold);margin-top:3px;}
.footer-col a{color:var(--muted);text-decoration:none;font-size:14px;transition:.3s;}
.footer-col a:hover{color:var(--gold);}
.footer-bottom{max-width:1200px;margin:0 auto;padding:24px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;font-size:13px;color:var(--muted);}
.footer-bottom a{color:var(--gold);text-decoration:none;}

.back-to-top{position:fixed;bottom:30px;left:30px;width:46px;height:46px;border-radius:50%;background:var(--gold);color:var(--bg);display:flex;align-items:center;justify-content:center;text-decoration:none;opacity:0;pointer-events:none;transition:.3s;z-index:300;font-size:16px;box-shadow:0 6px 20px rgba(0,0,0,.3);}
.back-to-top.show{opacity:1;pointer-events:auto;}
.back-to-top:hover{transform:translateY(-4px);}

@media(max-width:900px){
.footer-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:640px){
.footer-grid{grid-template-columns:1fr;}
.topbar-inner{padding:8px 16px;justify-content:center;}
.nav-cta{padding:7px 14px;font-size:12px;margin-left:6px;}
.logo-circle{width:34px;height:34px;font-size:14px;}
.g-item{width:110px;height:110px;}
.gallery-grid{gap:16px;}
.footer-brand p{max-width:100%;}
.fm-circle{width:110px;height:110px;}
.fm-card{width:130px;}
}
@media(max-width:400px){
.g-item{width:90px;height:90px;}
}