/* =========================================================
   HoneyGo Food India — Cinematic Interstitial Layer
   PURELY ADDITIVE. Does not touch, override, or redefine a
   single existing class in style.css. Every new selector is
   prefixed `cine-` so it can never collide with the existing
   design system. Reuses the site's real tokens (--ink, --honey,
   --paper, 'Fraunces'/'Inter') so the new sections read as part
   of the same brand, not a different visual language.
   ========================================================= */

.cine-section{
  position:relative;
  height:78vh;
  min-height:460px;
  max-height:760px;
  overflow:hidden;
  background:var(--ink-2);
  display:flex;
  align-items:center;
  justify-content:center;
}
.cine-media{position:absolute;inset:0;z-index:0;}
.cine-media video,
.cine-media img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;
  transform:scale(1.08);
  transition:opacity .6s ease;
}
.cine-media video{opacity:0;}
.cine-media video.cine-playing{opacity:1;}
.cine-section.in-view .cine-media video,
.cine-section.in-view .cine-media img{
  animation:cineKenBurns 14s ease-in-out infinite alternate;
}
@keyframes cineKenBurns{
  from{transform:scale(1.08) translate3d(0,0,0);}
  to{transform:scale(1.16) translate3d(-0.6%, -1%, 0);}
}
.cine-scrim{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg, rgba(8,16,38,.45) 0%, rgba(8,16,38,.35) 40%, rgba(8,16,38,.72) 100%);
}
.cine-content{
  position:relative;z-index:2;text-align:center;color:#fff;padding:0 24px;max-width:760px;
}
.cine-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-family:'Inter',sans-serif;font-weight:700;font-size:11.5px;
  letter-spacing:.22em;text-transform:uppercase;color:var(--honey-light);
  margin-bottom:18px;opacity:0;transform:translateY(10px);
  transition:opacity .8s ease, transform .8s ease;
}
.cine-eyebrow::before{
  content:"";width:6px;height:6px;background:var(--honey);
  clip-path:polygon(25% 0%,75% 0%,100% 50%,75% 100%,25% 100%,0% 50%);
  display:inline-block;flex:none;
}
.cine-line{
  font-family:'Fraunces',serif;font-weight:600;letter-spacing:-.01em;
  font-size:clamp(22px,3.6vw,42px);line-height:1.2;color:#fff;
  filter:blur(6px);opacity:0;transform:translateY(16px);
  transition:opacity 1s cubic-bezier(.2,.7,.2,1), transform 1s cubic-bezier(.2,.7,.2,1), filter 1s cubic-bezier(.2,.7,.2,1);
}
.cine-line + .cine-line{margin-top:6px;color:var(--honey-light);}

.cine-section.in-view .cine-eyebrow{opacity:1;transform:none;}
.cine-section.in-view .cine-line{opacity:1;transform:none;filter:blur(0);}
.cine-section.in-view .cine-line:nth-of-type(1){transition-delay:.15s;}
.cine-section.in-view .cine-line:nth-of-type(2){transition-delay:.55s;}

@media (max-width:720px){
  .cine-section{height:60vh;min-height:380px;}
  .cine-line{font-size:clamp(19px,5.6vw,28px);}
}
@media (max-height:420px) and (orientation:landscape){
  .cine-section{height:100vh;min-height:0;max-height:none;}
}

/* ---- Hero atmosphere: very subtle grain + gentle parallax, layered
   on top of the EXISTING .heroslider without touching its markup or
   crossfade logic ---- */
.cine-hero-grain{
  position:absolute;inset:0;z-index:2;pointer-events:none;opacity:.035;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.heroslider .hs-slide img,
.heroslider .hs-slide video{
  will-change:transform;
  transition:transform .1s linear;
}

/* ---- Team card depth-on-hover refinement (desktop only, additive
   to the existing .team-card:hover rule — does not replace it) ---- */
@media (hover:hover) and (pointer:fine){
  .team-card{transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease;}
  .team-card img{transition:transform .5s cubic-bezier(.2,.7,.2,1);}
  .team-card:hover img{transform:scale(1.035);}
}

/* ---- Closing philosophy card, inserted just before the footer ---- */
.cine-close{
  background:linear-gradient(155deg,var(--ink) 0%,var(--ink-2) 80%);
  color:#fff;padding:110px 0;text-align:center;
}
.cine-close .cine-close-kicker{
  font-family:'Inter',sans-serif;font-weight:700;font-size:11.5px;letter-spacing:.28em;
  text-transform:uppercase;color:var(--honey-light);margin-bottom:18px;
}
.cine-close h2{
  font-family:'Fraunces',serif;font-weight:600;color:#fff;
  font-size:clamp(34px,6vw,64px);line-height:1.05;margin:0;
}
.cine-close h2 em{font-style:italic;color:var(--honey);font-weight:500;}
.cine-close p{color:rgba(255,255,255,.68);max-width:480px;margin:20px auto 0;font-size:16px;}

/* ---- "Wash → Prep → Cook → Serve" process strip (additive; new
   section only, does not touch any existing selector). Four short
   looping clips told as one sequence rather than four more full-bleed
   interstitials, so the extra footage adds proof without adding
   scroll fatigue. ---- */
.process-strip{
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
}
.process-tile{
  position:relative;border-radius:var(--radius);overflow:hidden;
  aspect-ratio:3/4;background:var(--ink-2);isolation:isolate;
}
.process-tile video,
.process-tile img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;
}
.process-tile .pt-scrim{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg, rgba(8,16,38,0) 45%, rgba(8,16,38,.86) 100%);
}
.process-tile .pt-step{
  position:absolute;top:14px;left:14px;z-index:2;
  width:34px;height:34px;border-radius:50%;
  background:rgba(255,255,255,.14);backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.35);
  color:#fff;font-family:'Inter',sans-serif;font-weight:700;font-size:13px;
  display:flex;align-items:center;justify-content:center;
}
.process-tile .pt-copy{
  position:absolute;left:16px;right:16px;bottom:16px;z-index:2;color:#fff;
}
.process-tile .pt-kicker{
  display:block;font-family:'Inter',sans-serif;font-weight:700;font-size:10.5px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--honey-light);margin-bottom:5px;
}
.process-tile .pt-line{
  font-family:'Fraunces',serif;font-weight:600;font-size:16.5px;line-height:1.28;
}
@media (max-width:980px){
  .process-strip{grid-template-columns:repeat(2,1fr);gap:16px;}
}
@media (max-width:560px){
  .process-strip{grid-template-columns:1fr;}
  .process-tile{aspect-ratio:16/10;}
}

@media (prefers-reduced-motion:reduce){
  .cine-media video,.cine-media img,.cine-section.in-view .cine-media video,.cine-section.in-view .cine-media img{
    animation:none!important;transform:scale(1.02)!important;
  }
  .cine-eyebrow,.cine-line{transition:opacity .4s ease!important;filter:none!important;transform:none!important;}
  .heroslider .hs-slide img,.heroslider .hs-slide video{transition:none!important;}
}
