/* ============================================================
   HERO.CSS — home hero + stats (Rasa Indian Kitchen)
   ============================================================ */

.hero{
  position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;
  overflow:hidden;color:#fff;
  background:
    linear-gradient(180deg, rgba(23,14,10,.78) 0%, rgba(23,14,10,.86) 100%),
    radial-gradient(ellipse 70% 60% at 78% 18%, rgba(217,140,60,.28), transparent 62%),
    radial-gradient(ellipse 55% 55% at 8% 88%, rgba(163,74,36,.4), transparent 60%),
    url("../../../img/hero-biryani.jpg") no-repeat center/cover;
}
/* layered image — slow Ken Burns drift so the hero background feels alive */
.hero-biryani{
  position:absolute;inset:0;z-index:1;
  background:url("../../../img/hero-biryani.jpg") center/cover no-repeat;
  filter:brightness(.42);
  will-change:transform;
  animation:heroKenBurns 26s ease-in-out infinite alternate;
}
@keyframes heroKenBurns{
  from{transform:scale(1.02) translate3d(0,0,0);}
  to{transform:scale(1.14) translate3d(-1.6%,1.2%,0);}
}

/* ---------- FLOATING LEAVES — home/hero screen only ---------- */
.petals{
  position:absolute;inset:0;z-index:2;overflow:hidden;
  pointer-events:none;
}
.petals .leaf{
  position:absolute;top:-60px;left:0;line-height:1;
  opacity:0;will-change:transform,opacity;
  color:var(--gold-light);
  animation-name:leafFall;
  animation-timing-function:linear;
  animation-iteration-count:infinite;
  animation-duration:var(--leaf-dur,11s);
  animation-delay:var(--leaf-delay,0s);
}
.petals .leaf span{
  display:block;
  color:var(--gold-light);
  filter:drop-shadow(0 0 3px rgba(217,140,60,.85)) drop-shadow(0 0 9px rgba(217,140,60,.45));
  animation-name:leafSway;
  animation-timing-function:ease-in-out;
  animation-iteration-count:infinite;
  animation-direction:alternate;
  animation-duration:var(--leaf-sway,3s);
}
@keyframes leafFall{
  0%{transform:translate3d(0,-30px,0) rotate(0deg);opacity:0;}
  6%{opacity:var(--leaf-op,.5);}
  82%{opacity:var(--leaf-op,.5);}
  100%{transform:translate3d(var(--leaf-drift,60px),calc(100vh + 180px),0) rotate(320deg);opacity:0;}
}
@keyframes leafSway{
  from{transform:translateX(-16px) rotate(-14deg);}
  to{transform:translateX(16px) rotate(14deg);}
}
.hero-inner{position:relative;z-index:4;padding:170px 28px 140px;max-width:1200px;margin:0 auto;width:100%;text-align:center;}
.hero-tag{
  display:inline-flex;align-items:center;gap:12px;
  color:var(--gold-light);font-family:var(--font-body);
  font-size:13px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;
  margin-bottom:28px;
  animation:floaty 5s infinite var(--ease);
}
.hero h1{
  color:#fff;font-size:clamp(40px, 6.4vw, 86px);line-height:1.02;max-width:23ch;margin:0 auto;
}
.hero h1 .accent{
  font-style:italic;font-weight:500;
  background:linear-gradient(100deg, var(--gold-light) 20%, var(--saffron) 60%, var(--gold-light));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero p.sub{
  color:rgba(255,255,255,0.75);font-size:18px;max-width:52ch;margin:26px auto 0;line-height:1.7;
}
.hero-actions{display:flex;gap:16px;margin-top:42px;flex-wrap:wrap;justify-content:center;}

.hero-scroll{
  position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:4;
  color:rgba(255,255,255,.5);font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  display:flex;flex-direction:column;align-items:center;gap:10px;
}
.hero-scroll .line{width:1px;height:36px;background:linear-gradient(to bottom, rgba(217,140,60,.9), transparent);animation:scrolldrop 2s infinite var(--ease);}
@keyframes scrolldrop{0%{transform:scaleY(0);transform-origin:top;}50%{transform:scaleY(1);transform-origin:top;}50.01%{transform-origin:bottom;}100%{transform:scaleY(0);transform-origin:bottom;}}

/* ---------- HERO SMOKE (steam rising off the biryani) ---------- */
.hero-smoke{position:absolute;left:50%;bottom:52%;transform:translateX(-50%);z-index:2;pointer-events:none;width:320px;height:260px;}
.hero-smoke i{
  position:absolute;bottom:0;left:50%;width:34px;height:120px;border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(255,255,255,.5), rgba(255,255,255,0) 70%);
  filter:blur(7px);opacity:0;
  animation:smoke 4.2s ease-in-out infinite;
}
.hero-smoke i:nth-child(1){margin-left:-96px;animation-delay:0s;}
.hero-smoke i:nth-child(2){margin-left:-30px;animation-delay:1.1s;width:40px;}
.hero-smoke i:nth-child(3){margin-left:38px;animation-delay:2.3s;width:28px;}
.hero-smoke i:nth-child(4){margin-left:96px;animation-delay:3.4s;width:36px;}
@keyframes smoke{
  0%{transform:translateY(30px) scale(.7);opacity:0;}
  18%{opacity:.85;}
  55%{opacity:.5;}
  100%{transform:translateY(-190px) translateX(14px) scale(1.35);opacity:0;}
}

/* ---------- STATS ---------- */
.stats{
  position:relative;background:
    radial-gradient(circle at 15% 50%, rgba(217,140,60,.08), transparent 45%),
    var(--charcoal);
  padding:70px 0;overflow:hidden;
}
.stats::before{
  content:"";position:absolute;inset:0;opacity:.35;
  background-image:radial-gradient(circle, rgba(217,140,60,.14) 1px, transparent 1.4px);
  background-size:20px 20px;
  mask-image:linear-gradient(90deg,transparent,#000 20%,#000 80%,transparent);
}
.stats-grid{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center;}
.stat-item .stat-num{
  font-family:var(--font-serif);font-size:clamp(40px,4.6vw,62px);font-weight:700;
  color:var(--gold-light);line-height:1;
}
.stat-item .stat-num em{font-style:italic;color:var(--saffron);}
.stat-item .stat-label{color:rgba(255,255,255,.6);font-size:12px;text-transform:uppercase;letter-spacing:.14em;margin-top:10px;}

/* ---------- RESPONSIVE ---------- */
@media (max-width:980px){
  .stats-grid{grid-template-columns:repeat(2,1fr);gap:40px 20px;}
  .hero-inner{padding:150px 24px 140px;}
}
@media (max-width:560px){
  .hero{min-height:70svh;align-items:flex-start;}
  .hero-inner{padding:70px 22px 60px;}
  .hero-tag{margin-bottom:16px;font-size:12px;}
  .hero p.sub{font-size:16px;margin-top:18px;}
  .hero-actions{flex-direction:column;align-items:center;gap:12px;margin-top:26px;}
  .hero-actions .btn{width:max-content;flex:0 1 auto;font-size:13px;padding:13px 24px;}
}