/*
Theme Name: Bawarchi Khana Premium
Description: Hand-coded premium theme for Bawarchi Khana — Nawabi black & gold, arch motif drawn from Husainabad's Imambara architecture. Menu, team and catering packages are dashboard-editable via custom post types.
Author: Admagnate Technologies
Version: 1.0.0
*/

/* ===================== DESIGN TOKENS ===================== */
:root{
  /* Color — warm near-black + antique gold + a deep maroon accent, cream text on dark */
  --bk-black:       #100C09;
  --bk-black-2:     #19140F;
  --bk-black-3:     #221B14;
  --bk-gold:        #D4AD5C;
  --bk-gold-bright: #F2D48C;
  --bk-maroon:      #5E1E1E;
  --bk-ivory:       #F5ECDA;
  --bk-ivory-dim:   #D6CCB4;
  --bk-hairline:    rgba(201,162,75,0.28);

  --font-display: "Cormorant Garamond", "Georgia", serif;
  --font-body:    "Jost", "Segoe UI", sans-serif;

  --arch-radius: 220px;
  --container: 1180px;
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 28px;
  --space-4: 48px;
  --space-5: 88px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:
    radial-gradient(ellipse 1200px 600px at 50% -10%, rgba(94,30,30,0.35), transparent 60%),
    radial-gradient(ellipse 900px 500px at 100% 20%, rgba(201,162,75,0.06), transparent 55%),
    var(--bk-black);
  color:var(--bk-ivory);
  font-family:var(--font-body);
  font-weight:300;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
.container{max-width:var(--container);margin:0 auto;padding:0 var(--space-3);}

h1,h2,h3,h4{
  font-family:var(--font-display);
  color:var(--bk-gold-bright);
  font-weight:600;
  margin:0 0 var(--space-2);
  line-height:1.15;
}
h1{font-size:clamp(2.6rem,5vw,4.4rem);}
h2{font-size:clamp(1.9rem,3.4vw,2.8rem);}
h3{font-size:1.5rem;}
p{max-width:68ch;color:var(--bk-ivory-dim);}
.center{text-align:center;margin-left:auto;margin-right:auto;}

/* Section rhythm */
.section{padding:var(--space-5) 0;}
.section--tight{padding:var(--space-4) 0;}
.section--alt{background:var(--bk-black-2);}
.hairline{border:none;border-top:1px solid var(--bk-hairline);margin:0;}

.eyebrow{
  color:var(--bk-gold);
  font-family:var(--font-display);
  font-style:italic;
  font-size:1.05rem;
  letter-spacing:.02em;
  margin-bottom:var(--space-1);
  display:block;
}

/* ===================== ARCH MOTIF (Husainabad Imambara reference) ===================== */
/* Every photo on the site sits in a fixed-ratio frame with an arched top,
   so mismatched source photos still line up edge-to-edge and read as one system. */
.arch-frame{
  position:relative;
  overflow:hidden;
  border-radius:var(--arch-radius) var(--arch-radius) 4px 4px;
  border:1px solid var(--bk-hairline);
  background:var(--bk-black-3);
  aspect-ratio:3/4;
}
.arch-frame img{
  width:100%;height:100%;object-fit:cover;object-position:center;
  filter:saturate(1.05) contrast(1.04);
}
.arch-frame--wide{aspect-ratio:4/3;border-radius:120px 120px 4px 4px;}
.arch-frame--square{aspect-ratio:1/1;border-radius:90px 90px 4px 4px;}
.arch-frame::after{
  content:"";position:absolute;inset:0;
  box-shadow:inset 0 0 0 1px var(--bk-hairline), inset 0 -60px 60px -40px rgba(0,0,0,.55);
  border-radius:inherit;pointer-events:none;
}

/* ===================== HEADER ===================== */
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(16,12,9,0.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--bk-hairline);
}
.site-header .container{
  display:flex;align-items:center;justify-content:space-between;
  padding-top:var(--space-2);padding-bottom:var(--space-2);
  gap:var(--space-2);
}
.site-logo{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.site-logo img{
  width:52px;height:52px;min-width:52px;
  object-fit:contain;border-radius:50%;
  background:var(--bk-black-2);
}
.site-logo{font-family:var(--font-display);font-size:1.5rem;color:var(--bk-gold-bright);}
.primary-nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:var(--space-3);margin:0;padding:0;}
.primary-nav a{
  font-size:.92rem;letter-spacing:.02em;color:var(--bk-ivory-dim);
  transition:color .2s ease;position:relative;padding:4px 0;
  white-space:nowrap;
}
.primary-nav a:hover,.primary-nav a.is-active{color:var(--bk-gold-bright);}
.header-cta{
  border:1px solid var(--bk-gold);color:var(--bk-gold-bright);
  padding:10px 22px;border-radius:2px;font-size:.88rem;letter-spacing:.03em;
  transition:background .2s ease,color .2s ease;
  white-space:nowrap;flex-shrink:0;
}
.header-cta:hover{background:var(--bk-gold);color:var(--bk-black);}
.nav-toggle{display:none;background:none;border:1px solid var(--bk-hairline);color:var(--bk-gold-bright);padding:8px 12px;border-radius:2px;flex-shrink:0;}

/* 8 nav links + CTA get crowded well before the mobile breakpoint — shrink first */
@media(max-width:1240px){
  .primary-nav ul{gap:var(--space-2);}
  .primary-nav a{font-size:.82rem;}
}

@media(max-width:880px){
  .primary-nav{
    position:fixed;inset:64px 0 0 0;background:var(--bk-black);z-index:45;
    transform:translateY(-110%);
    opacity:0;visibility:hidden;
    transition:transform .3s ease,opacity .3s ease,visibility 0s linear .3s;
    padding:var(--space-4) var(--space-3);
  }
  .primary-nav.is-open{
    transform:translateY(0);
    opacity:1;visibility:visible;
    transition:transform .3s ease,opacity .3s ease,visibility 0s;
  }
  .primary-nav ul{flex-direction:column;gap:var(--space-3);}
  .primary-nav a{font-size:1rem;}
  .header-cta{display:none;}
  .nav-toggle{display:block;}
  .site-header .container{flex-wrap:nowrap;}
}

/* ===================== HERO ===================== */
.hero{
  position:relative;padding:var(--space-5) 0;
}
.hero__eyebrow{color:var(--bk-gold);font-family:var(--font-display);font-style:italic;font-size:1.15rem;}
.hero__lede{font-size:1.05rem;}
.hero__cta-row{display:flex;gap:var(--space-2);margin-top:var(--space-3);flex-wrap:wrap;}
.btn{
  display:inline-block;padding:14px 30px;border-radius:2px;font-size:.92rem;letter-spacing:.03em;
  transition:all .2s ease;
}
.btn--gold{background:var(--bk-gold);color:var(--bk-black);}
.btn--gold:hover{background:var(--bk-gold-bright);}
.btn--outline{border:1px solid var(--bk-hairline);color:var(--bk-ivory);}
.btn--outline:hover{border-color:var(--bk-gold);color:var(--bk-gold-bright);}

/* ===================== RESPONSIVE TWO-COLUMN UTILITY ===================== */
/* Used by page templates instead of inline grid-template-columns so every
   split layout (hero, about, catering, contact) collapses to one column on mobile. */
.two-col{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--space-5);align-items:center;}
.two-col--even{grid-template-columns:1fr 1fr;}
.two-col--reverse{grid-template-columns:.9fr 1.1fr;}
@media(max-width:880px){
  .two-col,.two-col--even,.two-col--reverse{grid-template-columns:1fr;gap:var(--space-4);}
}

/* ===================== DISH / MENU GRID ===================== */
.dish-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:var(--space-3);margin-top:var(--space-4);
}
.dish-card{text-align:center;}
.dish-card figure{margin:0 0 var(--space-2);}
.dish-card__name{font-family:var(--font-display);color:var(--bk-gold-bright);font-size:1.25rem;margin-bottom:2px;}
.dish-card__meta{color:var(--bk-ivory-dim);font-size:.88rem;}
.dish-card__price{color:var(--bk-gold);font-family:var(--font-display);font-size:1.05rem;margin-top:4px;}
.menu-category-label{
  font-family:var(--font-display);font-style:italic;color:var(--bk-gold);
  font-size:1.4rem;margin:var(--space-5) 0 0;text-align:center;
}

/* ===================== TEAM ===================== */
.team-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:var(--space-3);margin-top:var(--space-4);
}
.team-card{text-align:center;}
.team-card figure{margin:0 0 var(--space-2);}
.team-card__name{font-family:var(--font-display);color:var(--bk-gold-bright);font-size:1.2rem;}
.team-card__role{color:var(--bk-ivory-dim);font-size:.85rem;}

/* ===================== POLICY / STEPS (legitimately sequential) ===================== */
.policy-list{counter-reset:policy;list-style:none;padding:0;margin:var(--space-3) 0 0;max-width:640px;}
.policy-list li{
  counter-increment:policy;position:relative;padding-left:44px;margin-bottom:var(--space-2);
  color:var(--bk-ivory-dim);
}
.policy-list li::before{
  content:counter(policy);position:absolute;left:0;top:-2px;
  width:30px;height:30px;border:1px solid var(--bk-gold);border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);color:var(--bk-gold-bright);font-size:.95rem;
}

/* ===================== CARDS (catering packages etc) ===================== */
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-3);margin-top:var(--space-4);}
.pkg-card{border:1px solid var(--bk-hairline);padding:var(--space-3);background:var(--bk-black-2);}
.pkg-card h3{margin-bottom:4px;}
.pkg-card .pkg-price{color:var(--bk-gold);font-family:var(--font-display);font-size:1.2rem;margin-bottom:var(--space-2);}
.pkg-card ul{padding-left:18px;color:var(--bk-ivory-dim);}

/* ===================== FORM (catering inquiry, contact) ===================== */
.premium-form{max-width:560px;margin-top:var(--space-3);}
.premium-form label{display:block;font-size:.85rem;color:var(--bk-ivory-dim);margin-bottom:6px;}
.premium-form input,.premium-form select,.premium-form textarea{
  width:100%;background:var(--bk-black-2);border:1px solid var(--bk-hairline);
  color:var(--bk-ivory);padding:12px 14px;margin-bottom:var(--space-2);font-family:var(--font-body);
  border-radius:2px;
}
.premium-form input:focus,.premium-form select:focus,.premium-form textarea:focus{
  outline:2px solid var(--bk-gold);outline-offset:1px;border-color:var(--bk-gold);
}
.premium-form button{cursor:pointer;border:none;font-family:var(--font-body);}

/* ===================== FOOTER ===================== */
.site-footer{background:var(--bk-black-2);border-top:1px solid var(--bk-hairline);padding:var(--space-4) 0 var(--space-2);}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:var(--space-4);}
.footer-grid h4{font-size:1.1rem;}
.social-row{display:flex;gap:var(--space-2);margin-top:var(--space-2);}
.social-row a{border:1px solid var(--bk-hairline);border-radius:50%;width:38px;height:38px;display:flex;align-items:center;justify-content:center;font-size:.85rem;}
.social-row a:hover{border-color:var(--bk-gold);color:var(--bk-gold-bright);}
.footer-bottom{margin-top:var(--space-4);padding-top:var(--space-2);border-top:1px solid var(--bk-hairline);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--space-1);
  font-size:.82rem;color:var(--bk-ivory-dim);}
@media(max-width:880px){.footer-grid{grid-template-columns:1fr;}}

/* ===================== FLOATING CALL / WHATSAPP ===================== */
.float-actions{position:fixed;right:20px;bottom:20px;z-index:60;display:flex;flex-direction:column;gap:10px;}
.float-actions a{
  width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--bk-gold);color:var(--bk-black);font-size:1.3rem;box-shadow:0 6px 18px rgba(0,0,0,.4);
}
.float-actions a.wa{background:#25D366;color:#fff;}

/* ===================== RESPONSIVE UTIL ===================== */
@media(max-width:880px){
  .section{padding:var(--space-4) 0;}
  h1{font-size:2.4rem;}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *{transition:none!important;}
}