:root {
    --gold: #D4AF37;
    --gold-2: #C9A227;
    --gold-light: #F0D060;
    --gold-dark: #8B6914;
    --bg: #050505;
    --card-bg: rgba(15,15,15,0.85);
    --text: #FFFFFF;
    --muted: #B8B8B8;
    --overlay: rgba(5,5,5,0.72);
  }
  *, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
  html { scroll-behavior:smooth; }
  body {
    background: var(--bg);
    color: var(--text);
    font-family: 'Montserrat', sans-serif;
    overflow-x: hidden;
    cursor: none;
  }

  /* ── CUSTOM CURSOR ── */
  #cursor {
    position: fixed; width:16px; height:16px; border-radius:50%;
    background: var(--gold); pointer-events:none; z-index:9999;
    transform:translate(-50%,-50%); transition: transform .1s, width .2s, height .2s, opacity .2s;
    mix-blend-mode: difference;
  }
  #cursor-ring {
    position: fixed; width:40px; height:40px; border-radius:50%;
    border:1px solid var(--gold); pointer-events:none; z-index:9998;
    transform:translate(-50%,-50%); transition: transform .15s ease-out, width .3s, height .3s, opacity .2s;
    opacity:0.5;
  }

  /* ── LOADING SCREEN ── */
  #loader {
    position: fixed; inset:0; z-index:9000;
    background: var(--bg);
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    transition: opacity .8s ease, visibility .8s;
  }
  #loader.hidden { opacity:0; visibility:hidden; pointer-events:none; }
  .loader-logo {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(3rem, 8vw, 7rem);
    letter-spacing: 0.3em;
    color: transparent;
    background: linear-gradient(135deg, var(--gold-dark), var(--gold), var(--gold-light), var(--gold));
    -webkit-background-clip: text; background-clip: text;
    animation: shimmer 2s infinite;
  }
  @keyframes shimmer {
    0%,100% { filter: brightness(1); }
    50% { filter: brightness(1.4); }
  }
  .loader-bar-wrap { width:220px; height:2px; background:rgba(255,255,255,0.1); margin-top:2rem; border-radius:2px; overflow:hidden; }
  .loader-bar { height:100%; background: linear-gradient(90deg, var(--gold-dark), var(--gold), var(--gold-light)); border-radius:2px; animation: loadbar 2.2s ease forwards; }
  @keyframes loadbar { from { width:0; } to { width:100%; } }
  .loader-text { font-size:11px; letter-spacing:.3em; color:var(--muted); margin-top:1rem; text-transform:uppercase; }

  /* ── NAV ── */
  nav {
    position: fixed; top:0; left:0; right:0; z-index:500;
    padding: 1.2rem 3rem;
    display: flex; align-items:center; justify-content:space-between;
    background: linear-gradient(to bottom, rgba(5,5,5,0.95), transparent);
    transition: background .4s;
  }
  nav.scrolled { background: rgba(5,5,5,0.97); border-bottom:1px solid rgba(212,175,55,0.15); }
  .nav-logo {
    font-family: 'Cinzel', serif;
    font-size: 1.1rem; font-weight:700;
    color: white;
    letter-spacing:.15em;
    text-decoration:none;
  }
  .nav-links { display:flex; gap:2rem; list-style:none; }
  .nav-links a {
    color:var(--muted); font-size:.78rem; letter-spacing:.2em; text-transform:uppercase;
    text-decoration:none; transition: color .3s;
    position:relative;
  }
  .nav-links a::after {
    content:''; position:absolute; bottom:-4px; left:0; width:0; height:1px;
    background:var(--gold); transition:width .3s;
  }
  .nav-links a:hover { color:var(--gold); }
  .nav-links a:hover::after { width:100%; }
  .nav-ctas { display:flex; gap:1rem; align-items:center; }
  .btn-ghost {
    border:1px solid rgba(212,175,55,0.4); color:var(--gold);
    padding:.45rem 1.2rem; font-size:.72rem; letter-spacing:.2em; text-transform:uppercase;
    background:transparent; cursor:none; transition: all .3s; font-family:'Montserrat',sans-serif;
    text-decoration:none; display:inline-flex; align-items:center; gap:.5rem;
  }
  .btn-ghost:hover { border-color:var(--gold); background:rgba(212,175,55,0.08); }
  .btn-gold {
    background: linear-gradient(135deg, var(--gold-dark), var(--gold), var(--gold-2));
    color:#0a0800; padding:.45rem 1.4rem; font-size:.72rem; letter-spacing:.2em;
    text-transform:uppercase; border:none; cursor:none;
    font-family:'Montserrat',sans-serif; font-weight:700;
    position:relative; overflow:hidden; text-decoration:none;
    display:inline-flex; align-items:center; gap:.5rem; transition: filter .3s;
  }
  .btn-gold::before {
    content:''; position:absolute; inset:0; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.3),transparent);
    transform:translateX(-100%); transition:transform .6s;
  }
  .btn-gold:hover { filter:brightness(1.15); }
  .btn-gold:hover::before { transform:translateX(100%); }
  .hamburger { display:none; flex-direction:column; gap:5px; cursor:none; background:none; border:none; }
  .hamburger span { width:24px; height:1.5px; background:var(--gold); display:block; transition:all .3s; }

  /* ── HERO ── */
  #hero {
    position:relative; width:100%; height:100vh; min-height:600px;
    display:flex; align-items:flex-end; justify-content:flex-start;
    overflow:hidden;
  }
#hero-video{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    object-fit:cover;
    z-index:0;

    filter:brightness(0.55);

    transform:translateZ(0);
    backface-visibility:hidden;
    will-change:transform;

    animation:none;
}

.hero-overlay{
    position:absolute;
    inset:0;
    z-index:1;
    background:linear-gradient(
        to bottom,
        rgba(0,0,0,0.15),
        rgba(0,0,0,0.35),
        rgba(0,0,0,0.85)
    );
}


  @keyframes slowZoom { from { transform:scale(1); } to { transform:scale(1.06); } }
  .hero-overlay {
    position:absolute; inset:0; z-index:1;
    background: linear-gradient(180deg,
      rgba(5,5,5,0.3) 0%,
      rgba(5,5,5,0.2) 30%,
      rgba(5,5,5,0.6) 65%,
      rgba(5,5,5,0.96) 100%
    );
  }
  
.grain{
    display:none;
}
  @keyframes grainAnim {
    0%,100%{transform:translate(0,0)} 10%{transform:translate(-2%,-3%)} 20%{transform:translate(1%,2%)}
    30%{transform:translate(-1%,1%)} 40%{transform:translate(2%,-2%)} 50%{transform:translate(-2%,2%)}
    60%{transform:translate(1%,-1%)} 70%{transform:translate(-1%,3%)} 80%{transform:translate(2%,1%)} 90%{transform:translate(-3%,-1%)}
  }

  /* Particles */
  #particles { position:absolute; inset:0; z-index:3; pointer-events:none; }
  .particle {
    position:absolute; border-radius:50%;
    background: radial-gradient(circle, rgba(212,175,55,0.8), transparent);
    animation: floatP linear infinite;
  }
  @keyframes floatP {
    0% { transform:translateY(100vh) translateX(0) scale(0); opacity:0; }
    10% { opacity:1; }
    90% { opacity:.6; }
    100% { transform:translateY(-10vh) translateX(30px) scale(1); opacity:0; }
  }

  /* Spotlight */
  .spotlight {
    position:absolute; inset:0; z-index:2; pointer-events:none;
    background: radial-gradient(ellipse 40% 60% at 50% 40%, rgba(212,175,55,0.06) 0%, transparent 70%);
    transition: background .1s;
  }

  .hero-content {
    position:relative; z-index:10;
    padding: 0 5vw 8vh;
    max-width:900px;
  }
  .hero-eyebrow {
    font-size:.72rem; letter-spacing:.4em; color:var(--gold);
    text-transform:uppercase; margin-bottom:1rem;
    opacity:0; animation: revealUp .8s .5s ease forwards;
  }
  .hero-title {
    font-family:'Bebas Neue', sans-serif;
    font-size: clamp(4.5rem, 12vw, 10rem);
    line-height:.9;
    letter-spacing:.05em;
    color: var(--text);
    opacity:0; animation: revealUp .8s .7s ease forwards;
  }
  .hero-title .subtitle-word {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1.8rem, 4vw, 3.5rem);
    font-weight:300; letter-spacing:.3em;
    color: var(--gold); display:block;
    line-height:1.5;
  }
  .gold-divider {
    width:0; height:2px;
    background: linear-gradient(90deg, var(--gold), var(--gold-light), transparent);
    margin: 1.5rem 0;
    animation: expandW 1s 1.2s ease forwards;
  }
  @keyframes expandW { to { width: 280px; } }
  .hero-tagline {
    font-family:'Cormorant Garamond', serif;
    font-size: clamp(1.1rem, 2.5vw, 1.6rem);
    font-style:italic; font-weight:300;
    color:var(--muted); letter-spacing:.05em;
    opacity:0; animation: revealUp .8s 1.3s ease forwards;
  }
  .hero-meta {
    display:flex; gap:2rem; margin-top:1.5rem; flex-wrap:wrap;
    opacity:0; animation: revealUp .8s 1.5s ease forwards;
  }
  .hero-meta-item {
    display:flex; flex-direction:column; gap:.2rem;
  }
  .hero-meta-label { font-size:.65rem; letter-spacing:.25em; color:var(--gold); text-transform:uppercase; }
  .hero-meta-value { font-size:.85rem; color:var(--muted); font-weight:300; }
  .hero-ctas {
    display:flex; gap:1rem; margin-top:2.5rem; flex-wrap:wrap;
    opacity:0; animation: revealUp .8s 1.7s ease forwards;
  }
  .hero-ctas .btn-gold, .hero-ctas .btn-ghost { padding:.75rem 2rem; font-size:.8rem; }

  /* Info button */
  .info-btn {
    position:absolute; bottom:3vh; right:3vw; z-index:20;
    width:52px; height:52px; border-radius:50%;
    border:1px solid var(--gold);
    background:rgba(5,5,5,0.6);
    display:flex; align-items:center; justify-content:center;
    cursor:none; transition:all .3s;
    color:var(--gold); font-size:.7rem; letter-spacing:.1em;
    flex-direction:column; gap:2px;
    backdrop-filter:blur(6px);
  }
  .info-btn:hover { background:rgba(212,175,55,0.15); transform:scale(1.08); }
  .info-btn svg { width:18px; height:18px; }
  .info-btn span { font-size:.5rem; letter-spacing:.1em; text-transform:uppercase; }

  /* Scroll indicator */
  .scroll-ind {
    position:absolute; bottom:4vh; left:50%; transform:translateX(-50%);
    z-index:20; display:flex; flex-direction:column; align-items:center; gap:.6rem;
    opacity:0; animation: fadeIn 1s 2.2s ease forwards;
  }
  .scroll-ind span { font-size:.6rem; letter-spacing:.3em; color:var(--muted); text-transform:uppercase; }
  .scroll-line { width:1px; height:48px; background:linear-gradient(to bottom, var(--gold), transparent); animation:scrollPulse 2s infinite; }
  @keyframes scrollPulse { 0%,100%{opacity:.3;transform:scaleY(1)} 50%{opacity:1;transform:scaleY(1.1)} }

  /* ── OVERLAY PANEL ── */
  #overlay-panel {
    position:fixed; inset:0; z-index:800;
    pointer-events:none; opacity:0;
    transition: opacity .4s;
    display:flex; align-items:flex-end; justify-content:center;
  }
  #overlay-panel.active { opacity:1; pointer-events:all; }
  .overlay-backdrop {
    position:absolute; inset:0;
    background: rgba(5,5,5,0.75);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
  }
  .overlay-glass {
    position:relative; z-index:2;
      width:95vw !important;
    max-width:1100px !important;
    max-height:90vh !important;
    overflow-y:auto !important;
    margin-bottom: clamp(1rem, 3vh, 2rem);
    background: rgba(12,10,5,0.92);
    border:1px solid rgba(212,175,55,0.3);
    box-shadow: 0 0 60px rgba(212,175,55,0.12), 0 40px 80px rgba(0,0,0,0.8);
    border-radius:2px;
    overflow:hidden;
    transform: translateY(80px);
    transition: transform .6s cubic-bezier(.22,1,.36,1);
  }
  #overlay-panel.active .overlay-glass { transform: translateY(0); }
  .overlay-inner { padding: clamp(1.5rem, 4vw, 3rem); }
  .overlay-close {
    position:absolute; top:1.2rem; right:1.2rem; z-index:10;
    background:none; border:1px solid rgba(212,175,55,0.3);
    color:var(--muted); width:36px; height:36px;
    display:flex; align-items:center; justify-content:center;
    cursor:none; transition:all .3s; font-size:1.1rem;
  }
  .overlay-close:hover { border-color:var(--gold); color:var(--gold); background:rgba(212,175,55,0.08); }
  .overlay-grid {
      display:grid;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:2rem;
  }
  .overlay-col-title {
    font-size:.6rem; letter-spacing:.35em; color:var(--gold);
    text-transform:uppercase; margin-bottom:1rem;
    padding-bottom:.5rem; border-bottom:1px solid rgba(212,175,55,0.2);
  }

  /* Left col */
  .about-desc {
    font-family:'Cormorant Garamond', serif;
    font-size:1.05rem; line-height:1.75; color:var(--muted);
    font-style:italic; margin-bottom:1.5rem;
  }
  .info-list { list-style:none; display:flex; flex-direction:column; gap:.75rem; }
  .info-list li {
    display:flex; align-items:center; gap:.75rem;
    font-size:.8rem; color:var(--muted);
  }
  .info-list li .lbl { color:var(--gold); font-size:.65rem; letter-spacing:.2em; text-transform:uppercase; min-width:80px; }
  .info-icon { color:var(--gold); opacity:.7; font-size:.9rem; }

  /* Center col - director */
  .director-card {
    background: rgba(20,17,5,0.9);
    border:1px solid rgba(212,175,55,0.2);
    padding:2rem 1.5rem; text-align:center;
    transition: transform .3s, box-shadow .3s;
    cursor:none;
  }
  .director-card:hover {
    transform: perspective(800px) rotateY(-5deg) rotateX(3deg) translateY(-6px);
    box-shadow: 12px 20px 50px rgba(0,0,0,0.6), 0 0 30px rgba(212,175,55,0.15);
  }
  .director-avatar {
    width:100px; height:100px; border-radius:50%;
    background: linear-gradient(135deg, #1a1400, #3d2e00);
    border:2px solid var(--gold); margin:0 auto 1rem;
    display:flex; align-items:center; justify-content:center;
    font-family:'Cinzel',serif; font-size:2rem; color:var(--gold);
    font-weight:600;
  }
  .director-name { font-family:'Cinzel',serif; font-size:1.1rem; color:var(--text); letter-spacing:.1em; }
  .director-role { font-size:.65rem; letter-spacing:.3em; color:var(--gold); text-transform:uppercase; margin-top:.4rem; }

/* Right Column - Technical Crew Carousel */

.cast-carousel{
    width:100%;
    overflow:hidden;
    position:relative;
}

.cast-track{
    display:flex;
    flex-wrap:nowrap;
    overflow:hidden;
    width:100%;
    gap:0;
    transition:transform .5s ease;
}

.cast-card{
    flex:0 0 100%;
    min-width:100%;
    width:100%;

    min-height:420px;

    background:rgba(20,17,5,0.9);
    border:1px solid rgba(212,175,55,0.15);

    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;

    text-align:center;
    padding:3rem 2rem;

    transition:all .3s;
}

.cast-card:hover{
    border-color:var(--gold);
    box-shadow:0 0 30px rgba(212,175,55,0.15);
}

.cast-avatar{
    width:160px;
    height:160px;

    border-radius:50%;
    margin:0 auto 2rem;

    background:linear-gradient(135deg,#1a1400,#3d2e00);
    border:2px solid rgba(212,175,55,0.5);

    display:flex;
    align-items:center;
    justify-content:center;

    font-family:'Cinzel',serif;
    font-size:4.5rem;
    color:var(--gold);
}

.cast-name{
    font-size:1.6rem;
    font-weight:600;
    color:var(--text);

    line-height:1.3;
    margin-bottom:.5rem;
}

.cast-role{
    font-size:1rem;
    color:var(--gold);

    letter-spacing:.15em;
    font-style:italic;
    text-transform:uppercase;
}
  /* Overlay footer */
  .overlay-footer {
    display:flex; justify-content:center; gap:1.5rem; flex-wrap:wrap;
    padding-top:2rem; margin-top:2rem; border-top:1px solid rgba(212,175,55,0.15);
  }
  .btn-lg-gold {
    background: linear-gradient(135deg, var(--gold-dark), var(--gold), var(--gold-2));
    color:#0a0800; padding:1rem 2.5rem; font-size:.78rem; letter-spacing:.25em;
    text-transform:uppercase; border:none; cursor:none;
    font-family:'Montserrat',sans-serif; font-weight:700;
    position:relative; overflow:hidden; transition: filter .3s, transform .3s;
  }
  .btn-lg-gold::before {
    content:''; position:absolute; inset:0; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.25),transparent);
    transform:translateX(-100%); transition:transform .6s;
  }
  .btn-lg-gold:hover { filter:brightness(1.15); transform:translateY(-2px); }
  .btn-lg-gold:hover::before { transform:translateX(100%); }
  .btn-lg-ghost {
    border:1px solid rgba(212,175,55,0.5); color:var(--gold);
    padding:1rem 2.5rem; font-size:.78rem; letter-spacing:.25em;
    text-transform:uppercase; background:transparent; cursor:none;
    font-family:'Montserrat',sans-serif; font-weight:600; transition:all .3s;
  }
  .btn-lg-ghost:hover { border-color:var(--gold); background:rgba(212,175,55,0.08); transform:translateY(-2px); }

  /* Gold border glow pulse on overlay */
  .overlay-glass::before {
    content:''; position:absolute; inset:-1px;
    background:linear-gradient(135deg,transparent 20%,rgba(212,175,55,0.4) 50%,transparent 80%);
    animation:borderPulse 4s linear infinite; z-index:-1; pointer-events:none;
    border-radius:2px;
  }
  @keyframes borderPulse {
    0% { opacity:0.4; transform:rotate(0deg); }
    50% { opacity:1; }
    100% { opacity:0.4; transform:rotate(360deg); }
  }

  /* ── ABOUT / SCROLL SECTIONS ── */
  section.content-section {
    padding: 7rem 5vw;
    position:relative;
  }
  .section-label {
    font-size:.65rem; letter-spacing:.4em; color:var(--gold);
    text-transform:uppercase; margin-bottom:1.5rem; display:block;
  }
  .section-title {
    font-family:'Bebas Neue', sans-serif;
    font-size: clamp(2.5rem, 6vw, 4.5rem);
    letter-spacing:.05em; color:var(--text);
    margin-bottom:2rem; line-height:1;
  }
  .section-title span { color:var(--gold); }

  /* About section */
  #about { background: linear-gradient(180deg, var(--bg), #0a0800, var(--bg)); }
  .about-grid {
    display:grid; grid-template-columns:1fr 1fr; gap:6rem; align-items:center;
  }
  .about-text-block p {
    font-family:'Cormorant Garamond', serif;
    font-size:1.25rem; line-height:1.85; color:var(--muted);
    font-style:italic; margin-bottom:2rem;
    text-align: justify;
  }
  .movie-stats { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
  .stat-item {
    border-left:1px solid rgba(212,175,55,0.3);
    padding-left:1rem;
  }
  .stat-label { font-size:.6rem; letter-spacing:.25em; color:var(--gold); text-transform:uppercase; }
  .stat-val { font-size:1.1rem; color:var(--text); margin-top:.2rem; font-weight:500; }
  .about-visual {
    position:relative; aspect-ratio:.75;
    background: linear-gradient(180deg, #1a1200, #0a0800);
    border:1px solid rgba(212,175,55,0.2);
    overflow:hidden;
    display:flex; align-items:center; justify-content:center;
  }
  .about-visual::before {
    content:''; position:absolute; inset:0;
    background: radial-gradient(ellipse at 50% 30%, rgba(212,175,55,0.1), transparent 60%);
  }
  .about-visual-text {
    font-family:'Bebas Neue', sans-serif;
    font-size:8rem; color:rgba(212,175,55,0.08); line-height:1;
    text-align:center; letter-spacing:.05em;
    position:absolute; bottom:-10px;
  }
  .visual-badge {
    position:absolute; top:1.5rem; right:1.5rem;
    background:rgba(212,175,55,0.12); border:1px solid rgba(212,175,55,0.3);
    padding:.5rem 1rem; font-size:.65rem; letter-spacing:.25em;
    color:var(--gold); text-transform:uppercase;
  }
 /* About Poster Image */
.about-poster{
    position:absolute;
    inset:0;

    width:100%;
    height:100%;

    object-fit:cover;
    object-position:center;

    display:block;
}

/* Dark cinematic overlay */
.about-visual::after{
    content:'';
    position:absolute;
    inset:0;

    background:linear-gradient(
        to top,
        rgba(0,0,0,0.75),
        rgba(0,0,0,0.15),
        transparent
    );

    z-index:1;
}

/* Keep text above image */
.about-visual-text,
.visual-badge{
    position:absolute;
    z-index:2;
}

  /* Cast section */
  #cast {
    background: #060400;
    overflow:hidden;
  }
  .cast-full-grid {
    display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:1.5rem; margin-top:3rem;
  }
  .cast-full-card {
    background: rgba(15,12,3,0.9); border:1px solid rgba(212,175,55,0.15);
    padding:2rem 1.5rem; text-align:center; transition:all .4s; cursor:none;
    position:relative; overflow:hidden;
  }
  .cast-full-card::before {
    content:''; position:absolute; inset:0;
    background: radial-gradient(ellipse at 50% 0%, rgba(212,175,55,0.08), transparent 70%);
    opacity:0; transition:opacity .4s;
  }
  .cast-full-card:hover { border-color:rgba(212,175,55,0.5); transform:translateY(-8px); box-shadow:0 20px 50px rgba(0,0,0,0.5),0 0 30px rgba(212,175,55,0.1); }
  .cast-full-card:hover::before { opacity:1; }
  .cast-full-avatar {
    width:90px; height:90px; border-radius:50%; margin:0 auto 1.2rem;
    background: linear-gradient(135deg, #1a1400, #3d2e00);
    border:2px solid rgba(212,175,55,0.3);
    display:flex; align-items:center; justify-content:center;
    font-family:'Cinzel',serif; font-size:1.6rem; color:var(--gold);
    transition:border-color .3s;
  }
  .cast-full-card:hover .cast-full-avatar { border-color:var(--gold); box-shadow:0 0 20px rgba(212,175,55,0.2); }
  .cast-full-name { font-family:'Cinzel',serif; font-size:.95rem; color:var(--text); letter-spacing:.05em; margin-bottom:.3rem; }
  .cast-full-char { font-size:.68rem; letter-spacing:.2em; color:var(--gold); text-transform:uppercase; }
  .cast-divider { width:30px; height:1px; background:rgba(212,175,55,0.4); margin:.7rem auto; }

  /* Gallery placeholder */
  #gallery { background:var(--bg); }
  .gallery-grid {
    display:grid; grid-template-columns:repeat(3,1fr) 1fr; grid-template-rows:auto auto;
    gap:1rem; margin-top:3rem;
  }
  .gallery-item {
    background: linear-gradient(135deg, #0d0a02, #1a1500);
    border:1px solid rgba(212,175,55,0.1);
    aspect-ratio:1.5; display:flex; align-items:center; justify-content:center;
    transition:all .4s; cursor:none; overflow:hidden; position:relative;
  }
  .gallery-item:hover { border-color:rgba(212,175,55,0.4); }
  .gallery-item:hover .gallery-overlay-icon { opacity:1; }
  .gallery-item:first-child { grid-column:span 2; grid-row:span 2; aspect-ratio:auto; }
  .gallery-overlay-icon { position:absolute; color:var(--gold); opacity:0; transition:opacity .3s; font-size:2rem; }
  .gallery-item-inner {
    font-family:'Bebas Neue', sans-serif;
    color:rgba(212,175,55,0.06); font-size:4rem; text-align:center; line-height:1;
  }

  /* Trailer */
  #trailer { background: #060400; text-align:center; }
  .trailer-wrap {
    max-width:800px; margin:3rem auto 0; position:relative;
    aspect-ratio:16/9; background:#0a0800;
    border:1px solid rgba(212,175,55,0.2); overflow:hidden;
    cursor:none;
  }
  .trailer-thumb {
    width:100%; height:100%; object-fit:cover; opacity:.6;
  }
  .play-btn {
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    background:transparent; border:none; cursor:none; z-index:2;
  }
  .play-circle {
    width:80px; height:80px; border-radius:50%;
    border:2px solid var(--gold);
    background:rgba(5,5,5,0.6); backdrop-filter:blur(6px);
    display:flex; align-items:center; justify-content:center;
    transition:all .3s; color:var(--gold);
  }
  .play-circle svg { width:28px; height:28px; margin-left:4px; }
  .trailer-wrap:hover .play-circle { transform:scale(1.1); background:rgba(212,175,55,0.15); box-shadow:0 0 40px rgba(212,175,55,0.3); }
  .trailer-reflection {
    position:absolute; bottom:0; left:0; right:0; height:40%; pointer-events:none;
    background: linear-gradient(to bottom, transparent, rgba(212,175,55,0.04), rgba(212,175,55,0.02));
  }

  /* Footer */
  footer {
    border-top:1px solid rgba(212,175,55,0.12);
    padding:3rem 5vw;
    display:flex; flex-direction:column; align-items:center; gap:1.5rem;
    background: var(--bg); text-align:center;
  }
  .footer-logo { font-family:'Cinzel',serif; font-size:1.5rem; color:var(--gold); letter-spacing:.2em; }
  .footer-tagline { font-family:'Cormorant Garamond',serif; font-style:italic; color:var(--muted); font-size:.9rem; }
  .footer-bottom { font-size:.65rem; letter-spacing:.2em; color:rgba(255,255,255,0.2); text-transform:uppercase; }

  /* Animations */
  @keyframes revealUp {
    from { opacity:0; transform:translateY(30px); }
    to { opacity:1; transform:translateY(0); }
  }
  @keyframes fadeIn { from{opacity:0}to{opacity:1} }

  .reveal { opacity:0; transform:translateY(40px); transition:opacity .8s ease, transform .8s ease; }
  .reveal.visible { opacity:1; transform:translateY(0); }

  /* Responsive */
  @media(max-width:900px) {
    nav { padding:1rem 1.5rem; }
    .nav-links { display:none; }
    .hamburger { display:flex; }
    .hero-content { padding:0 5vw 12vh; }
    .overlay-grid { grid-template-columns:1fr; gap:2rem; }
    .about-grid { grid-template-columns:1fr; gap:3rem; }
    .gallery-grid { grid-template-columns:1fr 1fr; }
    .gallery-item:first-child { grid-column:span 2; grid-row:span 1; }
  }
  @media(max-width:600px) {
    .hero-meta { gap:1rem; }
    .cast-full-grid { grid-template-columns:repeat(2,1fr); }
    .gallery-grid { grid-template-columns:1fr; }
    .gallery-item:first-child { grid-column:span 1; }
    .overlay-footer { flex-direction:column; align-items:center; }
  }















#hero-video{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    object-fit:cover;
    z-index:0;
    filter:brightness(0.55);
}

.hero-overlay{
    position:absolute;
    inset:0;
    z-index:1;
    background:linear-gradient(
        to bottom,
        rgba(0,0,0,0.15),
        rgba(0,0,0,0.35),
        rgba(0,0,0,0.85)
    );
}

/* ==========================================
   CAST PROFILE IMAGE CONTAINER
   ========================================== */
.cast-full-avatar{
    /* Size of profile image */
    width: 120px;
    height: 120px;

    /* Make image circular */
    border-radius: 50%;

    /* Center align */
    margin: 0 auto 1.2rem;

    /* Hide image overflow */
    overflow: hidden;

    /* Premium gold border */
    border: 2px solid rgba(212, 175, 55, 0.4);

    /* Soft gold glow */
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.15);

    /* Smooth hover animation */
    transition: all 0.4s ease;
}

/* ==========================================
   CAST PROFILE IMAGE
   ========================================== */
.cast-full-avatar img{
    width: 100%;
    height: 100%;

    /* Fill container without distortion */
    object-fit: cover;

    display: block;

    /* Smooth image transition */
    transition: transform 0.5s ease;
}

/* ==========================================
   CARD HOVER EFFECT
   ========================================== */
.cast-full-card:hover .cast-full-avatar{

    /* Slight zoom effect */
    transform: scale(1.05);

    /* Brighter gold border */
    border-color: var(--gold);

    /* Stronger glow */
    box-shadow: 0 0 35px rgba(212, 175, 55, 0.35);
}

/* ==========================================
   IMAGE ZOOM ON HOVER
   ========================================== */
.cast-full-card:hover .cast-full-avatar img{
    transform: scale(1.1);
}

/* ==========================================
   OPTIONAL PREMIUM GLASS EFFECT
   ========================================== */
.cast-full-card{
    background: rgba(15, 12, 3, 0.9);
    border: 1px solid rgba(212, 175, 55, 0.15);

    padding: 2rem 1.5rem;
    text-align: center;

    position: relative;
    overflow: hidden;

    transition: all 0.4s ease;
}

/* ==========================================
   CARD HOVER ANIMATION
   ========================================== */
.cast-full-card:hover{
    transform: translateY(-10px);

    border-color: rgba(212, 175, 55, 0.5);

    box-shadow:
        0 20px 50px rgba(0,0,0,0.5),
        0 0 30px rgba(212,175,55,0.15);
}

/* ==========================================
   ACTOR NAME
   ========================================== */
.cast-full-name{
    font-family: 'Cinzel', serif;
    font-size: 1rem;
    color: #fff;
    letter-spacing: 0.05em;

    margin-bottom: 0.4rem;
}

/* ==========================================
   CHARACTER NAME
   ========================================== */
.cast-full-char{
    font-size: 0.72rem;
    letter-spacing: 0.2em;
    color: var(--gold);
    text-transform: uppercase;
}

/* ==========================================
   GOLD DIVIDER
   ========================================== */
.cast-divider{
    width: 40px;
    height: 1px;

    background: rgba(212,175,55,0.5);

    margin: 0.8rem auto;
}

/* ==========================================
   MOBILE VIEW
   ========================================== */
@media (max-width: 768px){

    /* Cast grid */
    .cast-full-grid{
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }

    /* Profile image */
    .cast-full-avatar{
        width: 80px;
        height: 80px;
    }

    /* Actor name */
    .cast-full-name{
        font-size: 0.85rem;
    }

    /* Character name */
    .cast-full-char{
        font-size: 0.6rem;
        letter-spacing: 0.15em;
    }

    /* Card padding */
    .cast-full-card{
        padding: 1.2rem 0.8rem;
    }
}

/* Extra Small Mobile */
@media (max-width: 480px){

    .cast-full-avatar{
        width: 70px;
        height: 70px;
    }

    .cast-full-name{
        font-size: 0.75rem;
    }

    .cast-full-char{
        font-size: 0.55rem;
    }
}
/* ==========================================
   PRODUCTION JOURNEY SECTION
========================================== */

#journey{
    background: #050505;
    position: relative;
}

/* Timeline Container */
.timeline{
    max-width: 900px;
    margin: 4rem auto 0;
    position: relative;
}

/* Vertical Gold Line */
.timeline::before{
    content: '';
    position: absolute;
    left: 24px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: linear-gradient(
        to bottom,
        rgba(212,175,55,0.8),
        rgba(212,175,55,0.2)
    );
}

/* Timeline Item */
.timeline-item{
    position: relative;
    padding-left: 80px;
    margin-bottom: 4rem;
}

/* Timeline Dot */
.timeline-dot{
    position: absolute;
    left: 14px;
    top: 10px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #050505;
    border: 2px solid var(--gold);
    z-index: 2;
}

/* Active Dot */
.timeline-dot.active{
    background: var(--gold);
    box-shadow: 0 0 20px rgba(212,175,55,0.6);
}

/* Year */
.timeline-year{
    display: inline-block;
    color: var(--gold);
    font-size: 0.7rem;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    margin-bottom: 0.5rem;
}

/* Heading */
.timeline-content h3{
    font-family: 'Cinzel', serif;
    font-size: 1.4rem;
    color: #fff;
    margin-bottom: 0.75rem;
}

/* Description */
.timeline-content p{
    color: var(--muted);
    line-height: 1.8;
    font-size: 0.95rem;
    max-width: 650px;
}

/* Hover Effect */
.timeline-item:hover .timeline-dot{
    background: var(--gold);
    box-shadow: 0 0 25px rgba(212,175,55,0.5);
}

.timeline-item:hover h3{
    color: var(--gold);
    transition: 0.3s ease;
}

/* ==========================================
   MOBILE RESPONSIVE
========================================== */

@media(max-width:768px){

    .timeline{
        margin-top: 3rem;
    }

    .timeline-item{
        padding-left: 60px;
        margin-bottom: 3rem;
    }

    .timeline::before{
        left: 18px;
    }

    .timeline-dot{
        left: 8px;
        width: 18px;
        height: 18px;
    }

    .timeline-content h3{
        font-size: 1.1rem;
    }

    .timeline-content p{
        font-size: 0.85rem;
        line-height: 1.6;
    }
}

/* ==========================================
   FOOTER
========================================== */

footer{
    background:#050505;
    border-top:1px solid rgba(212,175,55,0.15);

    padding:4rem 5vw 3rem;

    text-align:center;

    display:flex;
    flex-direction:column;
    align-items:center;
    gap:1.5rem;
}

/* Movie Title */

.footer-logo{
    font-family:'Cinzel',serif;
    font-size:1.8rem;
    color:var(--gold);

    letter-spacing:.2em;
    text-transform:uppercase;
}

/* Tagline */

.footer-tagline{
    font-family:'Cormorant Garamond',serif;
    font-size:1.4rem;
    font-style:italic;

    color:rgba(255,255,255,.8);
}

/* Navigation */

.footer-links{
    display:flex;
    gap:2.5rem;

    flex-wrap:wrap;
    justify-content:center;
}

.footer-links a{
    color:var(--muted);

    text-decoration:none;

    text-transform:uppercase;

    letter-spacing:.25em;

    font-size:.72rem;

    transition:.3s ease;
}

.footer-links a:hover{
    color:var(--gold);
}

/* Divider */

.footer-divider{
    width:120px;
    height:1px;

    background:linear-gradient(
        to right,
        transparent,
        var(--gold),
        transparent
    );
}

/* Copyright */

.footer-bottom{
    color:rgba(255,255,255,.35);

    font-size:.72rem;

    letter-spacing:.15em;

    text-transform:uppercase;

    line-height:1.8;
}

/* Mobile */

@media(max-width:768px){

    .footer-logo{
        font-size:1.2rem;
        line-height:1.5;
    }

    .footer-tagline{
        font-size:1rem;
    }

    .footer-links{
        gap:1.2rem;
    }

    .footer-bottom{
        font-size:.6rem;
        letter-spacing:.1em;
    }
}

@media (max-width: 768px) {
    .nav-ctas {
        display: none !important;
    }
}

@media (max-width: 768px) {

    .hero-content{
        max-width:100% !important;
        width:100% !important;

        display:flex !important;
        flex-direction:column !important;
        align-items:center !important;
        justify-content:center !important;

        text-align:center !important;

        padding:0 20px 12vh !important;
    }

    .gold-divider{
        margin:1rem auto !important;
    }

    .hero-meta{
        justify-content:center !important;
    }

    .hero-ctas{
        justify-content:center !important;
    }
}

@media (max-width: 768px){

    .overlay-glass{
        width:95vw !important;
        max-height:90vh !important;
        overflow-y:auto !important;
        margin:20px auto !important;
    }

    .overlay-grid{
        grid-template-columns:1fr !important;
        gap:1.5rem !important;
    }

    .overlay-inner{
        padding:1.2rem !important;
    }

    .overlay-footer{
        flex-direction:column !important;
        gap:1rem !important;
    }

    .btn-lg-gold,
    .btn-lg-ghost{
        width:100% !important;
    }

    .director-card,
    .cast-card{
        width:100% !important;
    }
}



@media (max-width:768px){

    .cast-track{
        display:grid !important;
        grid-template-columns:1fr 1fr !important;
        gap:10px !important;
        overflow:visible !important;
    }

    .cast-card{
        width:100% !important;
        min-width:unset !important;
    }
}

@media (max-width: 768px){

    #overlay-panel{
        align-items:center !important;
        padding:15px !important;
    }

    .overlay-glass{
        width:100% !important;
        max-width:100% !important;
        max-height:85vh !important;

        margin:0 !important;

        overflow-y:auto !important;
        overflow-x:hidden !important;
    }

    .overlay-inner{
        padding:20px !important;
    }

    .overlay-grid{
        display:flex !important;
        flex-direction:column !important;
        gap:20px !important;
    }

    .cast-carousel{
        width:100% !important;
        overflow:hidden !important;
    }

    .cast-track{
        display:flex !important;
        overflow-x:auto !important;
        gap:10px !important;
        padding-bottom:10px !important;
    }

    .cast-card{
        min-width:140px !important;
        width:140px !important;
    }

    .overlay-footer{
        flex-direction:column !important;
        width:100% !important;
    }

    .btn-lg-gold,
    .btn-lg-ghost{
        width:100% !important;
    }
}

#overlay-panel{
    overflow:hidden !important;
}

.overlay-glass{
    height:90vh !important;
    overflow:hidden !important;
}

.overlay-inner{
    height:100% !important;
    overflow:hidden !important;
}

.director-card{
    min-height: 420px !important;
    padding: 3rem 2rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
}
.director-card:hover{
    border-color:var(--gold) !important;
    box-shadow:0 0 30px rgba(212,175,55,0.15) !important;
    transform:translateY(-4px) !important;
}
.director-avatar{
    width: 160px !important;
    height: 160px !important;
    font-size: 5rem !important;
    margin-bottom: 2rem !important;
}

.director-name{
    font-size: 1.1rem !important;
    letter-spacing: .15em !important;
}








.cast-carousel{
    width:100% !important;
}







.cast-avatar{
    width:150px !important;
    height:150px !important;
    font-size:4.5rem !important;
    margin-bottom:2rem !important;
}
.cast-name{
    font-size:1rem !important;
    text-align:center !important;
}

.cast-role{
    font-size:1rem !important;
    letter-spacing:.15em !important;
    text-align:center !important;
}
.cast-card{
    flex:0 0 100% !important;
}
.cast-carousel{
    width:100% !important;
    overflow:hidden !important;
}

.cast-track{
    display:flex !important;
    flex-wrap:nowrap !important;
    overflow:hidden !important;
}

.cast-card{
    min-width:100% !important;
    width:100% !important;
    flex:0 0 100% !important;
}

.crew-carousel{
    position:relative;
    overflow:hidden;
}

.crew-track{
    display:flex;
    transition:transform .5s ease;
}

.crew-card{
    flex:0 0 100%;
}

.overlay-glass::before,
.overlay-glass::after{
    display:none !important;
}

.director-avatar{
    width:160px;
    height:160px;
    border-radius:50%;
    overflow:hidden;
    border:2px solid rgba(212,175,55,0.5);
    margin:0 auto 2rem;
}

.director-avatar img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.cast-avatar{
    width:160px;
    height:160px;
    border-radius:50%;
    overflow:hidden;
    border:2px solid rgba(212,175,55,0.5);
}

.cast-avatar img{
    width:100%;
    height:100%;
    object-fit:cover;
}
.cast-avatar{
    width:160px;
    height:160px;
    border-radius:50%;
    overflow:hidden;
    border:2px solid rgba(212,175,55,0.5);
    margin:0 auto 2rem;
}

.cast-avatar img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

/* Mobile Popup Scroll Fix */
@media (max-width: 768px){

    #overlay-panel{
        overflow-y: auto !important;
        overflow-x: hidden !important;
    }

    .overlay-glass{
        max-height: 90vh !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
    }

    .overlay-inner{
        overflow-y: visible !important;
    }

    body.overlay-open{
        overflow: hidden;
    }
}

@media (max-width:768px){

    .cast-card{
        min-width:100% !important;
        width:100% !important;
        padding:2rem 1rem !important;
    }

    .cast-avatar{
        width:100px !important;
        height:100px !important;
    }

    .cast-name{
        font-size:1.2rem !important;
    }

    .cast-role{
        font-size:.85rem !important;
    }
}

@media (max-width:768px){

    #hero-video{
        display:none;
    }

    #hero{
        background:url('assets/images/mobile-bg.png') center center/cover no-repeat;
    }
}

@media (max-width: 768px){

    .section-title{
        text-align: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

}

@media (max-width: 768px){

    .about-text-block{
        text-align: center !important;
    }

    .section-title{
        text-align: center !important;
    }
}
@media (max-width:768px){

    #cast .section-label{
        display:block;
        text-align:center !important;
        margin-left:auto !important;
        margin-right:auto !important;
    }

}

@media (max-width:768px){

    .section-label,
    .section-title{
        text-align:center !important;
        display:block;
        margin-left:auto !important;
        margin-right:auto !important;
    }

}

@media (max-width: 768px){

    .nav-links{
        display:none;
    }

    #navbar.active .nav-links{
        display:flex;
        flex-direction:column;
        position:absolute;
        top:100%;
        left:0;
        width:100%;
        background:#000;
        padding:20px;
        gap:20px;
        z-index:999;
    }

}

#hamburger.active span:nth-child(1){
    transform:translateY(6px) rotate(45deg);
}

#hamburger.active span:nth-child(2){
    opacity:0;
}

#hamburger.active span:nth-child(3){
    transform:translateY(-6px) rotate(-45deg);
}

@media (max-width:768px){

    #navbar.active .nav-links{
        display:flex;
        flex-direction:column;
        position:absolute;
        top:100%;
        left:0;
        width:100%;
        background:#000;
        padding:25px 0;
        gap:20px;
        z-index:999;

        align-items:center;   /* center links */
        text-align:center;    /* center text */
    }

    .nav-links li{
        width:100%;
        text-align:center;
    }

    .nav-links a{
        display:block;
        width:100%;
        text-align:center;
    }
}