/* ================================================================
   LAL QILA SOUTH ASIAN CUISINE - Complete Responsive CSS
   Covers ALL page variants (index, menu, about, contact, blog, posts)
   ================================================================ */

/* ---- CSS VARIABLES ---- */
:root {
  --primary: #8B1A1A;
  --primary-light: #A52A2A;
  --primary-dark: #6B0F0F;
  --gold: #D4A843;
  --gold-light: #E8C876;
  --cream: #FFF8F0;
  --text-dark: #1A1A1A;
  --text-medium: #4A4A4A;
  --text-light: #888888;
  --white: #FFFFFF;
  --off-white: #FAFAF5;
  --shadow: 0 4px 15px rgba(0,0,0,0.1);
  --shadow-md: 0 8px 30px rgba(0,0,0,0.15);
}

/* ---- RESET & BASE ---- */
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;font-size:16px;}
body{font-family:'Poppins',sans-serif;color:var(--text-medium);background:var(--off-white);line-height:1.6;overflow-x:hidden;}
h1,h2,h3,h4,h5,h6{font-family:'Playfair Display',serif;color:var(--text-dark);font-weight:600;letter-spacing:-0.5px;}
h1{font-size:3.2rem;}h2{font-size:2.5rem;}h3{font-size:1.8rem;}h4{font-size:1.4rem;}
p{margin-bottom:1rem;}
a{color:var(--primary);text-decoration:none;transition:all .3s ease;}
a:hover{color:var(--gold);}
img{max-width:100%;height:auto;display:block;}
ul{list-style:none;}

/* ---- CONTAINER ---- */
.container{max-width:1200px;margin:0 auto;padding:0 2rem;}

/* ---- BUTTONS ---- */
.btn{display:inline-block;padding:14px 32px;font-family:'Poppins',sans-serif;font-size:1rem;font-weight:600;border:2px solid transparent;border-radius:4px;cursor:pointer;transition:all .3s ease;text-align:center;text-transform:uppercase;letter-spacing:1px;}
.btn-primary{background:var(--primary);color:var(--white);border-color:var(--primary);}
.btn-primary:hover{background:var(--primary-dark);border-color:var(--primary-dark);transform:translateY(-2px);box-shadow:0 6px 20px rgba(139,26,26,0.3);color:var(--white);}
.btn-secondary{background:transparent;color:var(--primary);border-color:var(--primary);}
.btn-secondary:hover{background:var(--primary);color:var(--white);transform:translateY(-2px);}
.btn-gold{background:var(--gold);color:var(--text-dark);border-color:var(--gold);font-weight:700;}
.btn-gold:hover{background:var(--gold-light);border-color:var(--gold-light);transform:translateY(-2px);}
.btn-white{background:transparent;color:var(--white);border-color:var(--white);}
.btn-white:hover{background:var(--white);color:var(--primary);}
.btn-cta{background:var(--gold);color:var(--text-dark);border-color:var(--gold);font-weight:700;font-size:1.1rem;padding:16px 40px;}
.btn-cta:hover{background:var(--gold-light);transform:translateY(-2px);color:var(--text-dark);}

/* ---- ANIMATIONS ---- */
@keyframes hvFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-15px)}}
@keyframes hvPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}
@keyframes hvSpin{0%{transform:translate(-50%,-50%) rotate(0deg)}100%{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes hvSparkle{0%,100%{opacity:0;transform:scale(0)}50%{opacity:1;transform:scale(1)}}
@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes floatItem{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-20px) rotate(5deg)}}
@keyframes spinRing{0%{transform:translate(-50%,-50%) rotate(0deg)}100%{transform:translate(-50%,-50%) rotate(360deg)}}

/* ================================================================
   NAVBAR - Covers ALL nav variants across pages
   ================================================================ */
.navbar, nav.navbar{
  position:fixed;top:0;left:0;right:0;
  background:var(--white);z-index:1000;
  box-shadow:var(--shadow);padding:0;
}
/* index.html & menu.html: .navbar-container */
.navbar-container, .nav-container, .navbar-content{
  max-width:1200px;margin:0 auto;
  display:flex;justify-content:space-between;align-items:center;
  padding:1rem 2rem;
}
/* Logo variants */
.logo-section{display:flex;align-items:center;gap:10px;}
.logo-section .logo-icon{flex-shrink:0;}
.logo-text, .nav-logo .fort-logo + span, .logo{
  font-family:'Playfair Display',serif;font-size:1.6rem;font-weight:700;
  color:var(--primary);letter-spacing:1px;white-space:nowrap;
}
a.logo{font-family:'Playfair Display',serif;font-size:1.6rem;font-weight:700;color:var(--primary);}
/* Nav logo (about/contact variant) */
.nav-logo{display:flex;align-items:center;gap:10px;}
.fort-logo{width:40px;height:40px;}

/* Nav links - all variants */
.nav-menu{display:flex;gap:2rem;list-style:none;align-items:center;}
.nav-menu li{list-style:none;}
.nav-menu a, .nav-link{
  color:var(--text-dark);font-weight:500;font-size:.95rem;
  transition:color .3s ease;padding:4px 0;
}
.nav-menu a:hover, .nav-link:hover, .nav-link.active{
  color:var(--primary);border-bottom:2px solid var(--gold);
}
/* CTA in nav */
.nav-cta, .cta-button{
  background:var(--primary);color:var(--white)!important;
  padding:10px 20px;border-radius:4px;font-weight:600;font-size:.9rem;
  letter-spacing:1px;display:flex;align-items:center;gap:.5rem;
  border-bottom:none!important;
}
.nav-cta:hover, .cta-button:hover{background:var(--primary-dark);color:var(--white)!important;}
.cta-icon{font-size:1rem;}

/* Hamburger / mobile-toggle */
.hamburger, .mobile-toggle{
  display:none;flex-direction:column;cursor:pointer;gap:5px;
  background:none;border:none;padding:5px;
}
.hamburger span, .mobile-toggle span{
  width:25px;height:3px;background:var(--primary);border-radius:2px;
  transition:all .3s ease;display:block;
}

/* ================================================================
   PAGE HEADER (shared by about, contact, menu, blog pages)
   ================================================================ */
.page-header{
  background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);
  color:var(--white);padding:50px 2rem;text-align:center;
  margin-top:80px;
}
.page-header h1{color:var(--white);margin-bottom:.5rem;font-size:2.8rem;}
.page-header p, .page-header .subtitle, .page-header .article-meta{color:rgba(255,255,255,0.85);font-size:1.05rem;}
.subtitle{color:rgba(255,255,255,0.85);font-size:1.05rem;}
.section-subtitle{color:var(--text-light);font-size:1.05rem;margin-bottom:1rem;}
.section-title{text-align:center;color:var(--primary);margin-bottom:2rem;}

/* ================================================================
   HERO SECTION (index.html)
   ================================================================ */
.hero{
  margin-top:80px;padding:60px 2rem;
  max-width:1200px;margin-left:auto;margin-right:auto;
  overflow:hidden;
}
.hero-content{
  animation:fadeInUp 1s ease-out;
  display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;
}
.hero-text{}
.hero-tagline{
  color:var(--gold);font-weight:700;text-transform:uppercase;
  letter-spacing:2px;font-size:.9rem;margin-bottom:.75rem;
}
.hero-title, .hero h1{
  color:var(--primary);margin-bottom:1rem;line-height:1.15;font-size:3.2rem;
}
.hero-description{color:var(--text-medium);font-size:1.05rem;margin-bottom:2rem;line-height:1.7;}
.hero-buttons{display:flex;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap;}

/* Rating badge in hero */
.rating-badge{
  display:flex;align-items:center;gap:.75rem;
  background:var(--cream);padding:10px 18px;border-radius:8px;
  display:inline-flex;border:1px solid var(--gold-light);
}
.rating-stars{color:var(--gold);font-size:1.2rem;}
.rating-value{font-weight:700;color:var(--primary);font-size:1.3rem;}
.rating-count{color:var(--text-light);font-size:.9rem;}

/* Hero visual / orbit animation */
.hero-visual{
  position:relative;height:400px;display:flex;
  align-items:center;justify-content:center;overflow:hidden;
}
.orbit-container{position:relative;width:300px;height:300px;max-width:90%;margin:0 auto;}
.orbit-center{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  text-align:center;z-index:2;
}
.center-text-large{display:block;font-family:'Playfair Display',serif;font-size:2.5rem;font-weight:700;color:var(--primary);}
.center-text-small{display:block;font-size:.9rem;color:var(--text-medium);font-weight:500;}
.orbit-ring{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:250px;height:250px;border:2px dashed var(--gold-light);
  border-radius:50%;animation:hvSpin 20s linear infinite;
}
.food-emoji{
  position:absolute;font-size:2rem;z-index:3;
  animation:hvFloat 3s ease-in-out infinite;
}
.emoji-1{top:-5px;left:50%;transform:translateX(-50%);animation-delay:0s;}
.emoji-2{top:12%;right:0;animation-delay:.5s;}
.emoji-3{bottom:12%;right:0;animation-delay:1s;}
.emoji-4{bottom:-5px;left:50%;transform:translateX(-50%);animation-delay:1.5s;}
.emoji-5{bottom:12%;left:0;animation-delay:2s;}
.emoji-6{top:12%;left:0;animation-delay:2.5s;}
.sparkle{
  position:absolute;width:8px;height:8px;background:var(--gold);
  border-radius:50%;animation:hvSparkle 2s ease-in-out infinite;
}
.sparkle:nth-child(1){top:10%;left:20%;animation-delay:0s;}
.sparkle:nth-child(2){top:30%;right:10%;animation-delay:.4s;}
.sparkle:nth-child(3){bottom:20%;left:10%;animation-delay:.8s;}
.sparkle:nth-child(4){top:60%;right:25%;animation-delay:1.2s;}
.sparkle:nth-child(5){bottom:10%;right:15%;animation-delay:1.6s;}

/* ================================================================
   STATS SECTION (index.html)
   ================================================================ */
.stats-section{background:var(--primary);padding:50px 2rem;color:var(--white);}
.stats-section .stats-container, .stats .stats-container{
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2rem;
}
.stat-card{text-align:center;padding:1rem;}
.stat-icon{font-size:2rem;margin-bottom:.5rem;}
.stat-value{font-family:'Playfair Display',serif;font-size:2.5rem;font-weight:700;color:var(--gold);margin-bottom:.25rem;}
.stat-card h3{font-size:2.5rem;color:var(--gold);margin-bottom:.5rem;}
.stat-label{color:rgba(255,255,255,0.85);font-size:1rem;}
.stat-card p{color:rgba(255,255,255,0.9);font-size:1.05rem;}

/* ================================================================
   MENU PREVIEW SECTION (index.html)
   ================================================================ */
.menu-preview-section, .menu-preview{padding:80px 2rem;max-width:1200px;margin:0 auto;}
.menu-preview-section .container h2, .menu-preview .section-header h2{color:var(--primary);text-align:center;margin-bottom:.5rem;}
.menu-preview-section .section-subtitle{text-align:center;margin-bottom:3rem;}

.menu-categories{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;
}
.menu-card, .category-card{
  background:var(--white);border-radius:12px;padding:2rem;text-align:center;
  box-shadow:var(--shadow);transition:all .3s ease;cursor:pointer;
}
.menu-card:hover, .category-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-md);}
.menu-icon{font-size:3rem;margin-bottom:1rem;}
.menu-card h3, .category-info h3{color:var(--primary);margin-bottom:.5rem;}
.menu-card p, .category-info p{color:var(--text-light);font-size:.95rem;line-height:1.6;}
.menu-link{
  display:inline-block;margin-top:1rem;color:var(--primary);
  font-weight:600;font-size:.95rem;
}
.menu-link:hover{color:var(--gold);}
.menu-cta{text-align:center;margin-top:3rem;}

/* ================================================================
   WHY CHOOSE SECTION (index.html)
   ================================================================ */
.why-choose-section{background:var(--cream);padding:80px 2rem;}
.why-choose-section h2{color:var(--primary);text-align:center;margin-bottom:.5rem;}
.why-choose-section .section-subtitle{text-align:center;margin-bottom:3rem;}
.features-grid{
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:2rem;
}
.feature-card{
  background:var(--white);padding:2rem;border-radius:12px;
  box-shadow:var(--shadow);transition:all .3s ease;text-align:center;
}
.feature-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);}
.feature-card .feature-icon{font-size:2.5rem;margin-bottom:1rem;}
.feature-card h3{color:var(--primary);margin-bottom:.5rem;}
.feature-card p{color:var(--text-light);font-size:.95rem;line-height:1.6;}

/* ================================================================
   FAQ SECTION (index.html)
   ================================================================ */
.faq-section{padding:80px 2rem;}
.faq-section h2{color:var(--primary);text-align:center;margin-bottom:.5rem;}
.faq-section .section-subtitle{text-align:center;margin-bottom:3rem;}
.faq-container{max-width:800px;margin:0 auto;}
.faq-item{
  background:var(--white);border-radius:8px;margin-bottom:1rem;
  box-shadow:var(--shadow);overflow:hidden;
}
.faq-question{
  width:100%;padding:1.25rem 1.5rem;background:var(--white);
  border:none;cursor:pointer;display:flex;justify-content:space-between;
  align-items:center;font-family:'Poppins',sans-serif;font-weight:600;
  color:var(--primary);font-size:1rem;text-align:left;
  transition:background .3s ease;
}
.faq-question:hover{background:var(--cream);}
.faq-icon, .faq-toggle{font-size:1.5rem;color:var(--gold);transition:transform .3s ease;font-weight:700;}
.faq-item.open .faq-icon, .faq-item.open .faq-toggle{transform:rotate(45deg);}
.faq-answer{
  padding:1.25rem 1.5rem;color:var(--text-medium);line-height:1.7;
  border-top:1px solid var(--gold-light);
}
.faq-answer[hidden]{display:none;}
.faq-answer p{margin:0;}
.faq-answer p{color:var(--text-medium);line-height:1.7;margin:0;}

/* ================================================================
   CTA BANNER (shared across all pages)
   ================================================================ */
.cta-banner{
  background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);
  color:var(--white);padding:60px 2rem;text-align:center;
  margin:0;
}
.cta-banner h2{color:var(--white);margin-bottom:1rem;}
.cta-banner p{font-size:1.1rem;margin-bottom:2rem;color:rgba(255,255,255,0.9);}
.cta-banner .btn-primary{background:var(--gold);color:var(--text-dark);border-color:var(--gold);}
.cta-banner .btn-primary:hover{background:var(--gold-light);border-color:var(--gold-light);color:var(--text-dark);}
.cta-content{max-width:700px;margin:0 auto;}
.cta-buttons{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;}

/* ================================================================
   FOOTER (all variants)
   ================================================================ */
footer, .footer{
  background:var(--text-dark);color:var(--white);padding:60px 2rem 20px;
}
.footer-container, .footer-grid, .footer-content{
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:3rem;margin-bottom:2rem;
}
.footer-column, .footer-section{color:rgba(255,255,255,0.85);}
.footer-column h3, .footer-column h4, .footer-section h3, .footer-section h4{
  color:var(--gold);margin-bottom:1rem;font-size:1.2rem;
}
.footer-column p, .footer-section p{color:rgba(255,255,255,0.8);font-size:.95rem;margin-bottom:.5rem;}
.footer-column ul, .footer-section ul{list-style:none;padding:0;}
.footer-column ul li, .footer-section ul li{margin-bottom:.6rem;}
.footer-column a, .footer-section a{color:rgba(255,255,255,0.8);transition:color .3s ease;}
.footer-column a:hover, .footer-section a:hover{color:var(--gold);}
.social-links{display:flex;gap:1rem;margin-top:1rem;}
.social-links a{color:rgba(255,255,255,0.8);font-size:.9rem;}
.footer-bottom{
  border-top:1px solid rgba(212,168,67,0.3);padding-top:1.5rem;
  text-align:center;color:rgba(255,255,255,0.6);font-size:.9rem;
  max-width:1200px;margin:0 auto;
}

/* ================================================================
   FULL MENU PAGE (menu.html)
   ================================================================ */
.menu-page{padding:60px 2rem;max-width:1200px;margin:0 auto;}
.filter-tabs{
  display:flex;justify-content:center;gap:.75rem;margin-bottom:3rem;flex-wrap:wrap;
}
.filter-tab, .menu-tab{
  padding:10px 22px;background:var(--white);border:2px solid var(--gold);
  color:var(--text-dark);font-weight:600;cursor:pointer;border-radius:4px;
  transition:all .3s ease;font-family:'Poppins',sans-serif;font-size:.9rem;
}
.filter-tab.active, .filter-tab:hover, .menu-tab.active{
  background:var(--gold);color:var(--white);
}
.menu-category{margin-bottom:3rem;}
.menu-category h2{color:var(--primary);margin-bottom:1.5rem;border-bottom:2px solid var(--gold-light);padding-bottom:.5rem;}
.menu-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem;}
.menu-item{
  background:var(--white);padding:1.5rem;border-radius:8px;
  border-left:4px solid var(--primary);box-shadow:var(--shadow);
  transition:all .3s ease;display:flex;justify-content:space-between;align-items:flex-start;
}
.menu-item:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);}
.menu-item h4{color:var(--primary);margin-bottom:.25rem;}
.menu-price{color:var(--gold);font-weight:700;font-size:1.1rem;white-space:nowrap;margin-left:1rem;}
.menu-item p{color:var(--text-light);font-size:.9rem;margin:0;}

/* ================================================================
   ABOUT PAGE (about.html)
   ================================================================ */
.about-section{padding:60px 0;}
.about-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;
}
.about-grid-reversed{direction:rtl;}
.about-grid-reversed > *{direction:ltr;}
.about-text h2{color:var(--primary);margin-bottom:1rem;}
.about-text p{color:var(--text-medium);line-height:1.8;margin-bottom:1.25rem;}

/* Highlights */
.highlights{
  display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.5rem;
}
.highlight-item{
  background:var(--cream);padding:1rem;border-radius:8px;border-left:3px solid var(--gold);
}
.highlight-item strong{display:block;color:var(--primary);font-size:.95rem;margin-bottom:.25rem;}
.highlight-item span{color:var(--text-light);font-size:.85rem;}

/* About visual / animated area */
.about-visual{display:flex;align-items:center;justify-content:center;min-height:350px;}
.about-anim{
  position:relative;width:320px;height:320px;
  display:flex;align-items:center;justify-content:center;
}
.floating-item{
  position:absolute;font-size:3rem;z-index:2;
  animation:floatItem 3s ease-in-out infinite;
  animation-delay:var(--delay,0s);
}
.floating-item:nth-child(1){top:10%;left:10%;}
.floating-item:nth-child(2){top:5%;right:15%;}
.floating-item:nth-child(3){bottom:15%;left:50%;transform:translateX(-50%);}
.rotating-ring{
  position:absolute;top:50%;left:50%;
  border:2px dashed var(--gold-light);border-radius:50%;
  animation:spinRing 15s linear infinite;
}
.ring-1{width:280px;height:280px;transform:translate(-50%,-50%);}
.ring-2{width:220px;height:220px;transform:translate(-50%,-50%);animation-direction:reverse;border-color:rgba(139,26,26,0.2);}
.center-content{
  position:relative;z-index:3;text-align:center;
  background:var(--white);padding:1.5rem;border-radius:50%;
  width:120px;height:120px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;box-shadow:var(--shadow);
}
.center-icon{font-size:2rem;display:block;}
.center-number{font-family:'Playfair Display',serif;font-size:2rem;font-weight:700;color:var(--primary);}
.center-content p{font-size:.8rem;color:var(--text-light);margin:0;}

/* Values section */
.values-section{padding:60px 0;}
.values-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;
}
.value-card{
  background:var(--white);padding:2rem;border-radius:12px;text-align:center;
  box-shadow:var(--shadow);transition:all .3s ease;
}
.value-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);}
.value-icon{font-size:2.5rem;margin-bottom:1rem;}
.value-card h3{color:var(--primary);margin-bottom:.5rem;}
.value-card p{color:var(--text-light);font-size:.95rem;}

/* ================================================================
   CONTACT PAGE (contact.html)
   ================================================================ */
.contact-section{padding:60px 0;}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start;}
.contact-info{display:flex;flex-direction:column;gap:1.5rem;}
.contact-intro h2{color:var(--primary);margin-bottom:.5rem;}
.contact-intro p{color:var(--text-medium);}
.contact-cards{display:grid;grid-template-columns:1fr;gap:1.5rem;}
.contact-card{
  background:var(--white);padding:2rem;border-radius:12px;
  text-align:center;box-shadow:var(--shadow);transition:all .3s ease;
}
.contact-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);}
.card-icon{width:60px;height:60px;margin:0 auto 1rem;color:var(--primary);}
.card-icon svg{width:60px;height:60px;display:block;}
.contact-card h3{color:var(--primary);margin-bottom:.75rem;font-size:1.4rem;}
.contact-card p{color:var(--text-medium);margin-bottom:.5rem;}
.contact-card a{color:var(--primary);font-weight:600;}
.contact-card a:hover{color:var(--gold);}
.contact-visual{display:flex;align-items:center;justify-content:center;min-height:350px;}

/* Maps section */
.maps-section{padding:40px 0;}
.maps-container{border-radius:12px;overflow:hidden;box-shadow:var(--shadow);}
.maps-container iframe{width:100%;height:400px;border:none;}

/* ================================================================
   BLOG LISTING PAGE (blog.html)
   ================================================================ */
.blog-section{padding:60px 0;}
.blog-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:2rem;
}
.blog-card{
  background:var(--white);border-radius:12px;overflow:hidden;
  box-shadow:var(--shadow);transition:all .3s ease;
}
.blog-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);}
.blog-card-content{padding:2rem;}
.blog-date{
  color:var(--gold);font-weight:600;font-size:.85rem;
  text-transform:uppercase;letter-spacing:1px;display:block;margin-bottom:.5rem;
}
.blog-card h3{margin-bottom:.75rem;}
.blog-card h3 a{color:var(--primary);}
.blog-card h3 a:hover{color:var(--gold);}
.blog-excerpt{color:var(--text-light);font-size:.95rem;line-height:1.6;margin-bottom:1rem;}
.read-more{color:var(--primary);font-weight:600;font-size:.95rem;}
.read-more:hover{color:var(--gold);}

/* ================================================================
   BLOG POST PAGE (individual posts)
   ================================================================ */
.blog-container{padding:40px 0;}
.blog-layout{
  display:grid;grid-template-columns:1fr 320px;gap:3rem;align-items:start;
}
.blog-post{
  background:var(--white);padding:2.5rem;border-radius:12px;box-shadow:var(--shadow);
}
.blog-post h2{color:var(--primary);margin:2rem 0 1rem;}
.blog-post p{color:var(--text-medium);line-height:1.8;margin-bottom:1.25rem;}
.article-meta{color:var(--text-light);font-size:.9rem;margin-bottom:1.5rem;}

/* Blog sidebar */
.blog-sidebar{display:flex;flex-direction:column;gap:1.5rem;}
.sidebar-widget{
  background:var(--white);padding:1.5rem;border-radius:12px;box-shadow:var(--shadow);
}
.sidebar-widget h3, .sidebar-widget h4{color:var(--primary);margin-bottom:1rem;font-size:1.2rem;}
.sidebar-widget ul{list-style:none;padding:0;}
.sidebar-widget li{margin-bottom:.6rem;}
.sidebar-widget a{color:var(--primary);font-size:.9rem;}
.sidebar-widget a:hover{color:var(--gold);}
.recent-posts li{border-bottom:1px solid var(--cream);padding-bottom:.5rem;}
.recent-posts li:last-child{border-bottom:none;}

/* CTA card in sidebar */
.cta-card{
  background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);
  color:var(--white);padding:2rem;border-radius:12px;text-align:center;
}
.cta-card h3{color:var(--gold);margin-bottom:1rem;}
.cta-card p{color:rgba(255,255,255,0.9);font-size:.9rem;margin-bottom:.5rem;}
.cta-card .contact-info{margin:.75rem 0;}
.cta-phone{color:var(--gold)!important;font-weight:700;font-size:1.1rem;}
.halal-badge{
  display:inline-block;margin-top:.5rem;padding:4px 12px;
  background:rgba(212,168,67,0.2);border-radius:4px;
  color:var(--gold);font-weight:600;font-size:.85rem;
}
.cta-card .btn-primary{
  margin-top:1rem;background:var(--gold);color:var(--text-dark);
  border-color:var(--gold);width:100%;
}

/* ================================================================
   REVIEW CARDS
   ================================================================ */
.reviews-section{padding:80px 2rem;max-width:1200px;margin:0 auto;}
.reviews-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;}
.review-card{
  background:var(--white);padding:2rem;border-radius:8px;
  box-shadow:var(--shadow);border-top:4px solid var(--gold);
}
.review-stars{color:var(--gold);font-size:1.1rem;margin-bottom:1rem;}
.review-text{color:var(--text-medium);font-style:italic;margin-bottom:1.5rem;line-height:1.7;}
.review-author{font-weight:600;color:var(--primary);}

/* ================================================================
   REVIEWS / TESTIMONIALS WIDGETS
   ================================================================ */
.reviews-widget-section{
  padding:60px 2rem;max-width:1200px;margin:0 auto;overflow:hidden;
}
.reviews-widget-section h2{color:var(--primary);text-align:center;margin-bottom:.5rem;}
.reviews-widget-section .section-subtitle{text-align:center;margin-bottom:2rem;}
.reviews-widget-section .feedspace-embed{width:100%;min-height:200px;}

.reviews-strip{background:var(--cream);padding:50px 2rem;overflow:hidden;}
.reviews-strip h2{color:var(--primary);text-align:center;margin-bottom:.5rem;}
.reviews-strip .section-subtitle{text-align:center;margin-bottom:2rem;color:var(--text-light);}
.reviews-strip .feedspace-embed{max-width:1200px;margin:0 auto;}

.reviews-photos{padding:60px 2rem;background:var(--white);overflow:hidden;}
.reviews-photos h2{color:var(--primary);text-align:center;margin-bottom:.5rem;}
.reviews-photos .section-subtitle{text-align:center;margin-bottom:2rem;color:var(--text-light);}
.reviews-photos .feedspace-embed{max-width:1200px;margin:0 auto;}

/* ================================================================
   UTILITY CLASSES
   ================================================================ */
.text-center{text-align:center;}
.text-gold{color:var(--gold);}
.text-primary{color:var(--primary);}
.divider-gold{width:80px;height:3px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:1rem auto;}
.section-header{text-align:center;margin-bottom:4rem;}
.section-header h2{color:var(--primary);margin-bottom:1rem;}
.section-header .divider{width:80px;height:3px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:1rem auto;}

/* ================================================================
   RESPONSIVE DESIGN
   ================================================================ */
@media(max-width:1024px){
  h1{font-size:2.5rem;}
  h2{font-size:2rem;}
  .hero{padding:40px 2rem;margin-top:80px;}
  .hero-content{grid-template-columns:1fr;}
  .hero-visual{height:280px;order:-1;}
  .orbit-container{width:250px;height:250px;}
  .orbit-ring{width:210px;height:210px;}
  .food-emoji{font-size:1.8rem;}
  .center-text-large{font-size:2.2rem;}
  .about-grid, .about-grid-reversed{grid-template-columns:1fr;}
  .about-grid-reversed{direction:ltr;}
  .contact-grid{grid-template-columns:1fr;}
  .blog-layout{grid-template-columns:1fr;}
  .nav-menu{gap:1.5rem;}
}

@media(max-width:768px){
  .page-header{margin-top:60px;padding:35px 1.5rem;}
  .page-header h1{font-size:2rem;}
  .features-grid{grid-template-columns:1fr;}
  .highlights{grid-template-columns:1fr;}
  .stats-section .stats-container{grid-template-columns:repeat(2,1fr);}
}

@media(max-width:640px){
  h1{font-size:1.8rem;}
  h2{font-size:1.4rem;}
  h3{font-size:1.2rem;}

  /* Hide desktop nav, show hamburger */
  .nav-menu{
    display:none;position:absolute;top:100%;left:0;right:0;
    background:var(--white);flex-direction:column;padding:1.5rem 2rem;
    box-shadow:var(--shadow-md);gap:0;
  }
  .nav-menu.active{display:flex;}
  .nav-menu li{padding:.75rem 0;border-bottom:1px solid var(--cream);}
  .nav-menu li:last-child{border-bottom:none;}
  .hamburger, .mobile-toggle{display:flex;}
  .cta-button{display:none;}

  .hero{margin-top:60px;padding:20px 1rem;}
  .hero-content{grid-template-columns:1fr;gap:1.5rem;}
  .hero-visual{height:220px;}
  .orbit-container{width:200px;height:200px;}
  .orbit-ring{width:170px;height:170px;}
  .food-emoji{font-size:1.5rem;}
  .center-text-large{font-size:1.8rem;}
  .hero-title, .hero h1{font-size:1.8rem!important;}
  .hero-buttons{flex-direction:column;}

  .menu-preview-section{padding:40px 1rem;}
  .menu-categories{grid-template-columns:1fr;}
  .stats-section .stats-container{grid-template-columns:repeat(2,1fr);gap:1.5rem;}
  .stat-value{font-size:1.8rem;}

  .filter-tabs{flex-direction:column;align-items:stretch;}
  .menu-items{grid-template-columns:1fr;}
  .menu-page{padding:40px 1rem;}

  .about-section{padding:40px 0;}
  .about-anim{width:250px;height:250px;}
  .contact-cards{grid-template-columns:1fr;}
  .blog-grid{grid-template-columns:1fr;}

  .cta-banner{padding:40px 1rem;}
  .footer-container, .footer-grid, .footer-content{grid-template-columns:1fr;gap:2rem;}
  .container{padding:0 1rem;}
}
