/* ═══════════════════════════════════════════════════════
   ZH Motions — zh-shared.css
   Shared chrome: tokens, dark mode, nav, footer, buttons,
   animations, Bengali lang, utility classes.
═══════════════════════════════════════════════════════ */

/* ── GOOGLE FONTS ── */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,600;0,9..144,700;0,9..144,800;1,9..144,500&family=Hind+Siliguri:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

/* ── LIGHT MODE (default) ── */
:root {
  --bg:        #fdf6ec;
  --bg-2:      #f7ecd9;
  --bg-3:      #f0e2c8;
  --ink:       #2a1810;
  --ink-soft:  #5c4033;
  --ink-dim:   #9a7a5a;
  --primary:   #6b1d2b;
  --primary-2: #8b2635;
  --accent:    #d4a017;
  --accent-2:  #b8860b;
  --sage:      #4a6741;
  --terra:     #7a3e2e;
  --navy:      #1a4d6e;
  --plum:      #5a3a6b;
  --paper:     #fffaf0;
  --line:      #e8d5b7;
  --line-soft: #f0e2c8;
  --danger:    #c53030;
  --success:   #4a6741;
  --shadow-sm: 0 2px 8px rgba(107,29,43,0.06);
  --shadow:    0 4px 20px rgba(107,29,43,0.08);
  --shadow-lg: 0 12px 40px rgba(107,29,43,0.15);
  --r:   14px;
  --r-lg: 20px;
  --r-xl: 28px;
  --nav-bg: rgba(253,246,236,0.95);
  --trans: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
  /* Design tokens — easing + z-index hierarchy */
  --ease: cubic-bezier(.2,.7,.2,1);
  --ease-pop: cubic-bezier(.25,1,.5,1);
  --z-base: 1;
  --z-sticky: 10;
  --z-nav: 100;
  --z-dropdown: 200;
  --z-overlay: 500;
  --z-modal: 1000;
  --z-fab: 1100;
  --z-toast: 2000;
  --hover-lift: -8px;
}

/* ── DARK MODE ── */
[data-theme="dark"] {
  --bg:        #150c07;
  --bg-2:      #1e110a;
  --bg-3:      #281710;
  --ink:       #fdf6ec;
  --ink-soft:  #c8a87a;
  --ink-dim:   #8b6340;
  --primary:   #d4a017;
  --primary-2: #e8b420;
  --accent:    #d4a017;
  --accent-2:  #f5c842;
  --sage:      #6aaa5a;
  --terra:     #c47a5e;
  --paper:     #1e110a;
  --line:      rgba(212,160,23,0.18);
  --line-soft: rgba(212,160,23,0.09);
  --danger:    #f87171;
  --success:   #6aaa5a;
  --shadow-sm: 0 2px 8px rgba(0,0,0,0.35);
  --shadow:    0 4px 20px rgba(0,0,0,0.45);
  --shadow-lg: 0 12px 40px rgba(0,0,0,0.55);
  --nav-bg:    rgba(21,12,7,0.97);
}

/* ── BASE RESET ── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family: 'Plus Jakarta Sans','Hind Siliguri',sans-serif;
  background: var(--bg);
  color: var(--ink);
  line-height: 1.6;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  transition: var(--trans);
}
body::before {
  content: '';
  position: fixed; inset: 0;
  pointer-events: none; z-index: 0;
  background:
    radial-gradient(circle at 18% 10%, rgba(212,160,23,0.09) 0%, transparent 42%),
    radial-gradient(circle at 82% 88%, rgba(107,29,43,0.07) 0%, transparent 42%);
  transition: opacity 0.4s;
}
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; }
img { display: block; max-width: 100%; }

/* ── BENGALI LANGUAGE SWITCH ── */
[data-lang="bn"] body,
[data-lang="bn"] h1,
[data-lang="bn"] h2,
[data-lang="bn"] h3,
[data-lang="bn"] h4,
[data-lang="bn"] p,
[data-lang="bn"] span,
[data-lang="bn"] a,
[data-lang="bn"] button,
[data-lang="bn"] li,
[data-lang="bn"] label,
[data-lang="bn"] input,
[data-lang="bn"] textarea,
[data-lang="bn"] select {
  font-family: 'Hind Siliguri', 'Plus Jakarta Sans', sans-serif;
}
[data-lang="bn"] h1,
[data-lang="bn"] h2,
[data-lang="bn"] h3 {
  letter-spacing: 0 !important;
}

/* Show/hide lang elements */
.en-text { display: inline; }
.bn-text { display: none; }
[data-lang="bn"] .en-text { display: none; }
[data-lang="bn"] .bn-text { display: inline; }

/* ── NAV ── */
nav {
  position: sticky; top: 0; z-index: 500;
  background: var(--nav-bg);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--line);
  padding: 14px 0;
  transition: var(--trans);
}
.nav-wrap {
  max-width: 1280px; margin: 0 auto;
  padding: 0 36px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.brand {
  display: flex; align-items: center; gap: 10px;
  font-family: 'Fraunces', serif; font-weight: 800;
  font-size: 1.35rem; letter-spacing: -0.02em;
  color: var(--primary); flex-shrink: 0;
}
.brand-mark {
  width: 36px; height: 36px;
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  border-radius: 9px; display: grid; place-items: center;
  color: var(--accent); font-style: italic; font-size: 0.95rem;
  font-weight: 800; letter-spacing: -0.03em;
  box-shadow: var(--shadow-sm); flex-shrink: 0;
}
[data-theme="dark"] .brand-mark {
  background: linear-gradient(135deg, #3a2010, #1e0e05);
  border: 1px solid rgba(212,160,23,0.25);
}
.brand em { font-style: italic; font-weight: 500; color: var(--accent-2); }
.nav-links {
  display: flex; gap: 22px;
  align-items: center; list-style: none; flex-wrap: wrap;
}
.nav-links a {
  color: var(--ink-soft); font-size: 0.88rem; font-weight: 500;
  transition: color 0.2s; position: relative; padding-bottom: 2px;
}
.nav-links a::after {
  content: ''; position: absolute; bottom: -4px; left: 0;
  height: 2px; width: 0; background: var(--accent);
  transition: width 0.3s cubic-bezier(0.22,1,0.36,1); border-radius: 2px;
}
.nav-links a:hover, .nav-links a.active { color: var(--primary); }
.nav-links a:hover::after, .nav-links a.active::after { width: 100%; }
[data-theme="dark"] .nav-links a:hover,
[data-theme="dark"] .nav-links a.active { color: var(--accent); }
.nav-links a.btn-cta::after { display: none; }

/* Nav controls (theme + lang + CTA) */
.nav-controls { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.ctrl-btn {
  display: flex; align-items: center; gap: 5px;
  background: transparent; border: 1px solid var(--line);
  border-radius: 999px; padding: 6px 13px;
  font-size: 0.78rem; font-weight: 600; color: var(--ink-soft);
  transition: all 0.2s;
}
.ctrl-btn:hover { border-color: var(--primary); color: var(--primary); }
[data-theme="dark"] .ctrl-btn:hover { border-color: var(--accent); color: var(--accent); }

.btn-cta, a.btn-cta {
  background: var(--primary); color: var(--paper) !important;
  padding: 9px 22px; border-radius: 999px;
  font-weight: 700; font-size: 0.85rem;
  box-shadow: var(--shadow-sm); transition: all 0.25s;
  border: none; display: inline-block; text-align: center;
}
.btn-cta:hover { background: var(--primary-2); transform: translateY(-2px); box-shadow: var(--shadow); }
[data-theme="dark"] .btn-cta { background: var(--accent); color: var(--bg) !important; }
[data-theme="dark"] .btn-cta:hover { background: var(--accent-2); }

.menu-toggle {
  display: none; background: none; border: none;
  padding: 6px; flex-direction: column; gap: 5px;
  cursor: pointer; flex-shrink: 0;
  position: relative; z-index: 600;
}
.menu-toggle span {
  display: block; width: 22px; height: 2px;
  background: var(--ink); border-radius: 2px; transition: 0.3s;
}
.menu-toggle.open span:nth-child(1) { transform: rotate(45deg) translate(5px,5px); }
.menu-toggle.open span:nth-child(2) { opacity: 0; }
.menu-toggle.open span:nth-child(3) { transform: rotate(-45deg) translate(5px,-5px); }

/* ── PAGE HEAD ── */
.page-head {
  padding: 80px 36px 48px; text-align: center;
  position: relative; z-index: 2;
}
.page-head .tag {
  color: var(--accent-2); font-size: 0.75rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.2em; margin-bottom: 12px;
}
[data-theme="dark"] .page-head .tag { color: var(--accent); }
.page-head h1 {
  font-family: 'Fraunces', serif; font-weight: 800;
  font-size: clamp(2.2rem, 5vw, 3.6rem);
  letter-spacing: -0.025em; line-height: 1.05; margin-bottom: 14px;
}
.page-head h1 em { font-style: italic; color: var(--primary); }
[data-theme="dark"] .page-head h1 em { color: var(--accent); }
.page-head .lead {
  color: var(--ink-soft); max-width: 620px;
  margin: 0 auto; font-size: 1.05rem; line-height: 1.7;
}

/* ── LAYOUT ── */
.container { max-width: 1280px; margin: 0 auto; }
section { padding: 0 36px 80px; position: relative; z-index: 2; }
.section-pad { padding: 70px 36px 80px; }

/* ── SECTION HEAD ── */
.section-head { text-align: center; margin-bottom: 50px; }
.section-head .tag {
  color: var(--accent-2); font-size: 0.75rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.2em; margin-bottom: 12px;
}
[data-theme="dark"] .section-head .tag { color: var(--accent); }
.section-head h2 {
  font-family: 'Fraunces', serif; font-weight: 800;
  font-size: clamp(1.9rem, 4vw, 3rem);
  letter-spacing: -0.025em; line-height: 1.05; margin-bottom: 14px;
}
.section-head h2 em { font-style: italic; color: var(--primary); }
[data-theme="dark"] .section-head h2 em { color: var(--accent); }
.section-head p { color: var(--ink-soft); max-width: 560px; margin: 0 auto; font-size: 1rem; }

/* ── BUTTONS ── */
.btn {
  display: inline-block; padding: 13px 32px; border-radius: 999px;
  font-family: 'Fraunces', serif; font-weight: 700; font-size: 0.95rem;
  transition: all 0.25s; cursor: pointer; border: none;
}
.btn-primary {
  background: var(--primary); color: var(--paper);
  box-shadow: var(--shadow);
}
.btn-primary:hover { background: var(--primary-2); transform: translateY(-3px); box-shadow: var(--shadow-lg); }
[data-theme="dark"] .btn-primary { background: var(--accent); color: var(--bg); }
[data-theme="dark"] .btn-primary:hover { background: var(--accent-2); }

.btn-ghost {
  background: transparent; color: var(--ink);
  border: 1px solid var(--line); padding: 13px 30px;
  border-radius: 999px; font-weight: 600; font-size: 0.95rem; transition: all 0.25s;
}
.btn-ghost:hover { background: var(--paper); border-color: var(--primary); color: var(--primary); transform: translateY(-2px); }
[data-theme="dark"] .btn-ghost { color: var(--ink-soft); }
[data-theme="dark"] .btn-ghost:hover { border-color: var(--accent); color: var(--accent); background: rgba(212,160,23,0.06); }

/* ── CARD BASE ── */
.card {
  background: var(--paper); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 24px; transition: all 0.3s;
}
.card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); border-color: var(--primary); }
[data-theme="dark"] .card:hover { border-color: var(--accent); }

/* ── HIGHLIGHT STRIP (dark) ── */
.dark-strip {
  background: var(--ink); color: var(--paper);
  position: relative; overflow: hidden;
}
[data-theme="dark"] .dark-strip { background: var(--bg-2); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.dark-strip::before {
  content: ''; position: absolute; inset: 0;
  background: repeating-linear-gradient(45deg, transparent 0, transparent 22px, rgba(212,160,23,0.04) 22px, rgba(212,160,23,0.04) 44px);
}
.dark-strip > * { position: relative; z-index: 1; }
.dark-strip .section-head .tag { color: var(--accent); }
.dark-strip .section-head h2 { color: var(--paper); }
.dark-strip .section-head h2 em { color: var(--accent); }
.dark-strip .section-head p { color: rgba(253,246,236,0.7); }

/* ── ALT BG SECTION ── */
.alt-bg { background: var(--bg-2); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }

/* ── EMPTY / LOADING ── */
.empty-soft { color: var(--ink-soft); text-align: center; padding: 40px; font-style: italic; grid-column: 1/-1; }
.loading { color: var(--ink-soft); text-align: center; padding: 60px; grid-column: 1/-1; }
.empty-state {
  text-align: center; padding: 60px 30px; grid-column: 1/-1;
  background: var(--paper); border: 1px dashed var(--line); border-radius: var(--r-lg);
}
.empty-state h3 { font-family: 'Fraunces', serif; font-weight: 700; color: var(--ink); margin-bottom: 8px; }

/* ── FOOTER ── */
footer {
  background: var(--bg-2); padding: 60px 36px 32px;
  border-top: 1px solid var(--line); position: relative; z-index: 2;
}
.footer-wrap {
  max-width: 1280px; margin: 0 auto;
  display: grid; grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 40px; margin-bottom: 40px;
}
.footer-brand {
  font-family: 'Fraunces', serif; font-weight: 800; font-size: 1.45rem;
  color: var(--primary); margin-bottom: 12px;
  display: flex; align-items: center; gap: 10px;
}
.footer-brand em { font-style: italic; color: var(--accent-2); }
[data-theme="dark"] .footer-brand { color: var(--accent); }
.footer-col h4 {
  font-family: 'Fraunces', serif; font-weight: 700; font-size: 0.95rem;
  color: var(--primary); margin-bottom: 14px;
}
[data-theme="dark"] .footer-col h4 { color: var(--accent); }
.footer-col a, .footer-col p { display: block; color: var(--ink-soft); font-size: 0.87rem; margin-bottom: 8px; transition: color 0.2s; }
.footer-col a:hover { color: var(--primary); }
[data-theme="dark"] .footer-col a:hover { color: var(--accent); }
.footer-bottom {
  max-width: 1280px; margin: 0 auto; padding-top: 24px;
  border-top: 1px solid var(--line);
  color: var(--ink-dim); font-size: 0.78rem; text-align: center;
}
.footer-bottom em { font-family: 'Fraunces', serif; font-style: italic; color: var(--primary); }
[data-theme="dark"] .footer-bottom em { color: var(--accent); }

/* ── SCROLL REVEAL ANIMATIONS ── */
[data-reveal] {
  opacity: 0; transform: translateY(28px);
  transition: opacity 0.7s cubic-bezier(0.22,1,0.36,1), transform 0.7s cubic-bezier(0.22,1,0.36,1);
  will-change: opacity, transform;
}
[data-reveal].in { opacity: 1; transform: translateY(0); }
[data-reveal="left"] { transform: translateX(-36px); }
[data-reveal="left"].in { transform: translateX(0); }
[data-reveal="right"] { transform: translateX(36px); }
[data-reveal="right"].in { transform: translateX(0); }
[data-reveal="scale"] { transform: scale(0.93); }
[data-reveal="scale"].in { transform: scale(1); }
[data-reveal="fade"] { transform: none; }

[data-reveal-stagger] > * {
  opacity: 0; transform: translateY(20px);
  transition: opacity 0.55s ease, transform 0.55s ease;
}
[data-reveal-stagger].in > *:nth-child(1) { transition-delay:0.04s; opacity:1; transform:translateY(0); }
[data-reveal-stagger].in > *:nth-child(2) { transition-delay:0.11s; opacity:1; transform:translateY(0); }
[data-reveal-stagger].in > *:nth-child(3) { transition-delay:0.18s; opacity:1; transform:translateY(0); }
[data-reveal-stagger].in > *:nth-child(4) { transition-delay:0.25s; opacity:1; transform:translateY(0); }
[data-reveal-stagger].in > *:nth-child(5) { transition-delay:0.32s; opacity:1; transform:translateY(0); }
[data-reveal-stagger].in > *:nth-child(6) { transition-delay:0.38s; opacity:1; transform:translateY(0); }
[data-reveal-stagger].in > *:nth-child(n+7) { transition-delay:0.42s; opacity:1; transform:translateY(0); }

/* Hero entry */
@keyframes heroIn { from { opacity:0; transform:translateY(22px); } to { opacity:1; transform:translateY(0); } }
.hero-anim   { animation: heroIn 0.85s cubic-bezier(0.22,1,0.36,1) both; }
.hero-anim-1 { animation-delay:0.05s; }
.hero-anim-2 { animation-delay:0.18s; }
.hero-anim-3 { animation-delay:0.31s; }
.hero-anim-4 { animation-delay:0.44s; }
.hero-anim-5 { animation-delay:0.57s; }

/* Dot pulse */
@keyframes dotPulse { 0%,100%{opacity:1;transform:scale(1);} 50%{opacity:.35;transform:scale(.8);} }
.dot-pulse { animation: dotPulse 1.6s infinite; }

/* Float */
@keyframes floatY { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-8px);} }
.float-soft { animation: floatY 5s ease-in-out infinite; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  [data-reveal],[data-reveal-stagger]>*,.hero-anim,.float-soft {
    opacity:1 !important; transform:none !important;
    animation:none !important; transition:none !important;
  }
}

/* ── RESPONSIVE ── */
@media (max-width:900px) {
  .footer-wrap { grid-template-columns: 1fr 1fr; }
  .nav-links {
    display: none; position: absolute; top: 100%; left: 0; right: 0;
    background: var(--nav-bg); backdrop-filter: blur(16px);
    flex-direction: column; padding: 20px 30px;
    border-bottom: 1px solid var(--line); gap: 14px; align-items: flex-start;
  }
  .nav-links.open { display: flex; }
  .menu-toggle { display: flex; }
}
@media (max-width:600px) {
  .page-head { padding: 52px 20px 32px; }
  section { padding: 0 20px 60px; }
  .section-pad { padding: 50px 20px 60px; }
  footer { padding: 40px 18px 24px; }
  .footer-wrap {
    grid-template-columns: 1fr 1fr 1fr !important;
    gap: 20px 14px !important;
    margin-bottom: 28px;
  }
  .footer-wrap > *:first-child,
  .footer-brand-col { grid-column: 1 / -1 !important; margin-bottom: 4px; }
  .footer-brand { font-size: 1.2rem; margin-bottom: 8px; }
  .footer-wrap > *:first-child p,
  .footer-brand-col p { font-size: 0.82rem; line-height: 1.5; }
  .footer-col h4 { font-size: 0.82rem; margin-bottom: 10px; }
  .footer-col a, .footer-col p { font-size: 0.8rem; margin-bottom: 6px; }
  .footer-bottom { font-size: 0.72rem; padding-top: 18px; }
  .nav-wrap { padding: 0 20px; }
  .btn { padding: 12px 24px; font-size: 0.9rem; }
  /* Move floating theme+lang to bottom-right on mobile so they don't cover hamburger */
  #zh-float-controls {
    top: auto !important; bottom: 14px !important; right: 14px !important;
    flex-direction: row; gap: 6px !important;
  }
  #zh-float-controls .ctrl-btn { padding: 6px 10px !important; font-size: 0.72rem !important; }
}

/* ── EN/BN text spans toggle ── */
.bn-text{display:none;}
[data-lang="bn"] .en-text{display:none;}
[data-lang="bn"] .bn-text{display:inline;}

/* ── MOBILE RESPONSIVE FIXES (audit 2026-05-18) ── */
@media (max-width: 480px) {
  /* Hero CTAs stack vertically on small phones */
  .hero-ctas { flex-direction: column; align-items: stretch; }
  .hero-ctas .btn { width: 100%; padding: 12px 18px; font-size: 0.86rem; white-space: normal; }
  /* Filter chips tighter padding */
  .proj-filters { padding: 0 12px; gap: 8px; }
  .proj-chip { padding: 7px 16px; font-size: 0.78rem; }
  /* Section padding smaller */
  section .container { padding-left: 16px; padding-right: 16px; }
}
/* iOS safe-area on sticky headers + footers */
@supports (padding: max(0px)) {
  nav { padding-top: max(0px, env(safe-area-inset-top)); }
  footer { padding-bottom: max(40px, calc(40px + env(safe-area-inset-bottom))); }
}

/* ═══════════════════════════════════════════════════════
   CINEMATIC NAV (canonical) — extracted 2026-06-07
   Existing pages still ship inline copies; safe override identical.
   New pages: just load zh-shared.css and use <div class="cine-nav-wrap">.
═══════════════════════════════════════════════════════ */
.cine-nav-wrap{background:rgba(10,6,6,0.96);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#fdf6ec;position:sticky;top:0;z-index:500;border-bottom:1px solid rgba(212,160,23,0.15);}
.cine-nav-wrap nav{position:static;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:none;padding:0;}
.cine-nav{max-width:1400px;margin:0 auto;padding:18px 32px;display:flex;justify-content:space-between;align-items:center;gap:32px;}
.cine-nav .brand{color:#fdf6ec;font-size:1.15rem;}
.cine-nav .brand-mark{width:34px;height:34px;border-radius:7px;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#0a0606;font-style:normal;font-size:0.78rem;letter-spacing:0.04em;font-weight:900;}
[data-theme="dark"] .cine-nav .brand-mark{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#0a0606;border:none;}
.cine-nav .brand em{font-style:italic;color:var(--accent);font-weight:500;}
.cine-nav .nav-links{display:flex;gap:28px;font-size:0.88rem;letter-spacing:0.02em;list-style:none;align-items:center;flex-wrap:wrap;}
.cine-nav .nav-links a{position:relative;padding:8px 0;color:rgba(253,246,236,0.78);transition:0.2s;font-weight:500;}
.cine-nav .nav-links a:hover,.cine-nav .nav-links a.active{color:var(--accent);}
.cine-nav .nav-links a::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform 0.25s;width:auto;border-radius:0;}
.cine-nav .nav-links a:hover::after,.cine-nav .nav-links a.active::after{transform:scaleX(1);width:auto;}
.cine-nav-right{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.cine-nav .ctrl-btn{background:rgba(253,246,236,0.06);border:1px solid rgba(253,246,236,0.15);color:rgba(253,246,236,0.85);padding:7px 13px;border-radius:999px;font-size:0.78rem;font-weight:600;cursor:pointer;transition:0.2s;}
.cine-nav .ctrl-btn:hover{color:var(--accent);border-color:var(--accent);background:rgba(253,246,236,0.1);}
.cine-nav .nav-cta{background:var(--accent);color:#0a0606 !important;padding:9px 20px;border-radius:999px;font-family:'Fraunces',serif;font-weight:700;font-size:0.85rem;transition:0.25s;display:inline-flex;align-items:center;gap:6px;border:none;box-shadow:none;}
.cine-nav .nav-cta:hover{background:#fdf6ec;transform:translateY(-1px);}
.cine-nav .menu-toggle{display:none;background:none;border:none;padding:6px;flex-direction:column;gap:5px;cursor:pointer;}
.cine-nav .menu-toggle span{display:block;width:22px;height:2px;background:#fdf6ec;border-radius:2px;transition:0.3s;}
.cine-nav .menu-toggle.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px);}
.cine-nav .menu-toggle.open span:nth-child(2){opacity:0;}
.cine-nav .menu-toggle.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px);}
/* Mobile responsive */
@media (max-width: 860px) {
  .cine-nav{padding:14px 18px;gap:14px;}
  .cine-nav .nav-links{display:none;}
  .cine-nav.mobile-open .nav-links{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:rgba(10,6,6,0.98);padding:14px 18px;gap:12px;border-bottom:1px solid rgba(212,160,23,0.15);z-index:10;}
  .cine-nav .menu-toggle{display:flex;}
}