/* =========================================================
   AKSHAY KUMAR MC — Actor Portfolio
   Design tokens
   Colors:  --ink #0B0B0C (near-black stage), --paper #EDE8DE (marquee card),
            --gold #C9A227 (marquee light), --maroon #6B1420 (curtain red),
            --stone #8A8580 (caption grey), --cream #F3EFE6
   Type: display "Bebas Neue" (poster titles), serif accent "Cormorant Garamond"
         (italic sub-lines), body "Work Sans", Kannada "Noto Sans Kannada"
   ========================================================= */

:root{
  --ink:#0b0b0c;
  --ink-2:#141416;
  --paper:#efe9dd;
  --gold:#c9a227;
  --gold-soft:#e3c25f;
  --maroon:#6b1420;
  --maroon-2:#3f0c14;
  --stone:#948f88;
  --cream:#f4f0e6;
  --line: rgba(237,232,222,0.14);
  --shadow: 0 20px 60px rgba(0,0,0,.45);
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--ink);
  color:var(--cream);
  font-family:'Work Sans', sans-serif;
  font-weight:400;
  overflow-x:hidden;
  line-height:1.5;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
h1,h2,h3,h4{font-family:'Bebas Neue', sans-serif; letter-spacing:.03em; font-weight:400;}
.kannada{font-family:'Noto Sans Kannada','Work Sans',sans-serif;}

/* ---------- texture overlays ---------- */
.grain{
  position:fixed; inset:0; z-index:9998; pointer-events:none; opacity:.05; 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");
}
.vignette{
  position:fixed; inset:0; z-index:9997; pointer-events:none;
  background:radial-gradient(ellipse at center, transparent 40%, rgba(0,0,0,.55) 100%);
}

/* ---------- reel progress bar ---------- */
.reel-progress{position:fixed; top:0; left:0; width:100%; height:3px; background:rgba(255,255,255,.08); z-index:10000;}
.reel-progress-bar{height:100%; width:0%; background:linear-gradient(90deg,var(--maroon),var(--gold)); transition:width .1s linear;}

/* ---------- nav ---------- */
.site-nav{
  position:fixed; top:3px; left:0; right:0; z-index:500;
  display:flex; align-items:center; justify-content:space-between;
  padding:22px 5vw; transition:padding .3s ease, background .3s ease, backdrop-filter .3s ease;
}
.site-nav.scrolled{
  padding:14px 5vw; background:rgba(11,11,12,.82); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-mark{font-family:'Bebas Neue',sans-serif; font-size:22px; letter-spacing:.08em;}
.nav-mark span{color:var(--gold);}
.nav-links{display:flex; gap:clamp(14px,2vw,32px);}
.nav-links a{
  font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--stone);
  position:relative; padding-bottom:4px; transition:color .25s ease;
}
.nav-links a::after{
  content:""; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--gold);
  transition:width .3s ease;
}
.nav-links a:hover{color:var(--cream);}
.nav-links a:hover::after{width:100%;}
@media (max-width:760px){ .nav-links{display:none;} }

/* ---------- hero ---------- */
.hero{
  position:relative; min-height:100svh; display:flex; align-items:flex-end;
  overflow:hidden; padding:0 5vw 9vh;
}
.hero-bg{
  position:absolute; inset:0; background-size:cover; background-position:center 18%;
  filter:grayscale(.25) contrast(1.05); transform:scale(1.08);
  animation:heroDrift 18s ease-in-out infinite alternate;
}
@keyframes heroDrift{ from{transform:scale(1.08) translateY(0);} to{transform:scale(1.14) translateY(-2%);} }
.hero-shade{
  position:absolute; inset:0;
  background:
    linear-gradient(0deg, var(--ink) 4%, rgba(11,11,12,.55) 42%, rgba(11,11,12,.35) 65%, rgba(11,11,12,.75) 100%),
    linear-gradient(90deg, rgba(11,11,12,.75) 0%, rgba(11,11,12,.1) 45%, rgba(11,11,12,.55) 100%);
}
.hero-content{position:relative; z-index:2; max-width:820px;}
.eyebrow{
  color:var(--gold-soft); font-size:13px; letter-spacing:.22em; text-transform:uppercase; margin-bottom:18px;
}
.hero-title{font-size:clamp(64px,13vw,150px); line-height:.86; color:var(--cream);}
.hero-title .line{display:block; overflow:hidden;}
.hero-title .line span, .hero-title .mc{display:inline-block;}
.mc{color:var(--gold);}
.hero-sub{
  font-family:'Cormorant Garamond', serif; font-style:italic; font-size:clamp(18px,2vw,23px);
  color:var(--paper); max-width:560px; margin:22px 0 34px; opacity:.9;
}
.hero-cta{display:flex; gap:18px; flex-wrap:wrap;}
.btn{
  padding:14px 30px; font-size:13px; letter-spacing:.12em; text-transform:uppercase;
  border-radius:2px; border:1px solid transparent; transition:all .3s ease; display:inline-block;
}
.btn-gold{background:var(--gold); color:var(--ink); font-weight:600;}
.btn-gold:hover{background:var(--gold-soft); transform:translateY(-2px);}
.btn-ghost{border-color:rgba(244,240,230,.4); color:var(--cream);}
.btn-ghost:hover{border-color:var(--cream); background:rgba(244,240,230,.06);}
.hero-scroll{
  position:absolute; right:5vw; bottom:6vh; z-index:2; writing-mode:vertical-rl;
  font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--stone);
  display:flex; align-items:center; gap:10px;
}
.hero-scroll span{width:1px; height:46px; background:var(--stone); display:block; animation:scrollLine 2.4s ease-in-out infinite;}
@keyframes scrollLine{ 0%,100%{transform:scaleY(1); opacity:.4;} 50%{transform:scaleY(.5); opacity:1;} }
.clapper{position:absolute; top:0; left:0; right:0; height:0; z-index:5;}

/* ---------- section shell ---------- */
section{position:relative; padding:min(14vh,120px) 5vw;}
.section-head{margin-bottom:56px;}
.section-head.center{text-align:center; max-width:640px; margin-left:auto; margin-right:auto;}
.tag{
  display:inline-block; font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--gold); border:1px solid rgba(201,162,39,.4); padding:6px 14px; border-radius:20px; margin-bottom:16px;
}
.section-head h2{font-size:clamp(38px,6vw,64px); color:var(--cream);}
.section-head.light h2{color:var(--cream);}

/* ---------- reveal animation ---------- */
.reveal{opacity:0; transform:translateY(26px); transition:opacity .8s ease, transform .8s ease;}
.reveal.in{opacity:1; transform:translateY(0);}

/* ---------- about ---------- */
.about{background:var(--ink);}
.about-grid{display:grid; grid-template-columns:.8fr 1.2fr; gap:min(8vw,90px); align-items:center;}
.about-photo{position:relative;}
.about-photo img{border-radius:2px; filter:grayscale(.15) contrast(1.05); box-shadow:var(--shadow);}
.sprocket-strip{
  position:absolute; left:-16px; top:0; bottom:0; width:12px;
  background-image:radial-gradient(circle, var(--ink) 3px, transparent 3.2px);
  background-size:12px 22px; background-repeat:repeat-y; opacity:.5;
}
.bio-list{list-style:none; display:grid; grid-template-columns:1fr 1fr; gap:18px 30px; margin-bottom:30px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:24px 0;}
.bio-list li{display:flex; flex-direction:column; gap:4px;}
.bio-list span{font-size:11px; text-transform:uppercase; letter-spacing:.14em; color:var(--stone);}
.bio-list strong{font-size:17px; font-weight:500; color:var(--cream);}
.about-text{font-family:'Cormorant Garamond', serif; font-size:20px; line-height:1.6; color:var(--paper); max-width:56ch;}
.about-text em{color:var(--gold-soft); font-style:italic;}
.visitor-features{margin-top:18px; padding:16px 18px; border:1px solid rgba(201,162,39,.22); border-radius:10px; background:rgba(255,255,255,.03); max-width:560px;}
.visitor-features h3{font-size:20px; color:var(--cream); margin-bottom:10px;}
.visitor-features ul{list-style:none; display:grid; gap:8px;}
.visitor-features li{font-size:14px; color:var(--paper); position:relative; padding-left:16px;}
.visitor-features li::before{content:"•"; color:var(--gold-soft); position:absolute; left:0; top:0;}
.social-row{margin-top:22px;}
.social-row a{font-size:13px; letter-spacing:.08em; text-transform:uppercase; border-bottom:1px solid var(--gold); padding-bottom:3px; color:var(--gold-soft);}
@media (max-width:820px){ .about-grid{grid-template-columns:1fr;} .about-photo{max-width:340px; margin:0 auto 20px;} }

/* ---------- filmstrip gallery (signature element) ---------- */
.filmstrip-section{background:var(--ink-2); padding-left:0; padding-right:0;}
.filmstrip-section .section-head{padding:0 5vw;}
.filmstrip-wrap{
  position:relative; padding:18px 0; background:#000; overflow:hidden;
  border-top:3px solid #000; border-bottom:3px solid #000;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);
}
.filmstrip-wrap::before, .filmstrip-wrap::after{
  content:""; position:absolute; left:0; right:0; height:16px;
  background-image:radial-gradient(circle, #000 5px, var(--ink-2) 5.3px);
  background-size:30px 16px; background-repeat:repeat-x; z-index:2;
}
.filmstrip-wrap::before{top:-8px;}
.filmstrip-wrap::after{bottom:-8px;}
.filmstrip-track{
  display:flex; gap:14px; width:max-content; padding:0 14px;
  animation:filmScroll 46s linear infinite;
}
.filmstrip-track.paused{animation-play-state:paused;}
@keyframes filmScroll{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
.frame{
  position:relative; height:min(62vh,460px); width:auto; flex:0 0 auto; overflow:hidden;
  border:1px solid rgba(255,255,255,.08); background:#000; cursor:zoom-in;
}
.frame img{
  height:100%; width:auto; max-width:none; object-fit:contain; display:block;
  filter:grayscale(.25) contrast(1.04); transition:filter .4s ease, transform .5s ease;
}
.frame:hover img{filter:grayscale(0) contrast(1.06); transform:scale(1.015);}
.frame-num{position:absolute; bottom:8px; left:10px; font-family:'Bebas Neue',sans-serif; font-size:12px; color:var(--gold-soft); letter-spacing:.1em; opacity:.85; z-index:2;}
.frame-zoom-hint{
  position:absolute; top:8px; right:10px; font-size:10px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--cream); background:rgba(0,0,0,.4); padding:4px 8px; border-radius:20px; opacity:0; transition:opacity .3s ease; z-index:2;
}
.frame:hover .frame-zoom-hint{opacity:.9;}
.filmstrip-hint{text-align:center; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--stone); margin-top:18px;}

/* ---------- lightbox (full, uncropped photo view) ---------- */
.lightbox{
  position:fixed; inset:0; z-index:10001; background:rgba(6,6,7,.95);
  display:flex; align-items:center; justify-content:center; padding:5vh 5vw;
  opacity:0; pointer-events:none; transition:opacity .3s ease;
}
.lightbox.open{opacity:1; pointer-events:auto;}
.lightbox img{max-width:100%; max-height:88vh; width:auto; height:auto; object-fit:contain; box-shadow:0 30px 80px rgba(0,0,0,.6); border:1px solid rgba(255,255,255,.08);}
.lightbox-close{
  position:absolute; top:22px; right:28px; width:44px; height:44px; border-radius:50%;
  border:1px solid rgba(244,240,230,.4); color:var(--cream); background:rgba(0,0,0,.3);
  display:flex; align-items:center; justify-content:center; font-size:20px; cursor:pointer; transition:all .25s ease;
}
.lightbox-close:hover{background:var(--gold); color:var(--ink); border-color:var(--gold);}
.lightbox-nav{
  position:absolute; top:50%; transform:translateY(-50%); width:48px; height:48px; border-radius:50%;
  border:1px solid rgba(244,240,230,.35); color:var(--cream); background:rgba(0,0,0,.3);
  display:flex; align-items:center; justify-content:center; font-size:20px; cursor:pointer; transition:all .25s ease;
}
.lightbox-nav:hover{background:var(--gold); color:var(--ink); border-color:var(--gold);}
.lightbox-nav.prev{left:18px;}
.lightbox-nav.next{right:18px;}
@media (max-width:600px){ .lightbox-nav{width:38px; height:38px; font-size:16px;} .lightbox-close{width:38px; height:38px; top:14px; right:14px;} }

/* ---------- showreel (autoplaying clips) ---------- */
.showreel{background:var(--ink);}
.showreel-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:22px; max-width:1000px; margin:0 auto;}
.showreel-card{position:relative; background:#000; border:1px solid rgba(255,255,255,.08); overflow:hidden; aspect-ratio:9/16;}
.showreel-card video{width:100%; height:100%; object-fit:cover; display:block;}
.showreel-tag{
  position:absolute; top:10px; left:10px; z-index:2; font-size:10px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--cream); background:rgba(0,0,0,.45); padding:5px 10px; border-radius:20px; border:1px solid rgba(244,240,230,.2);
}
.showreel-tag.live::before{content:""; display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--gold); margin-right:6px; vertical-align:middle;}
.showreel-mute{
  position:absolute; bottom:10px; right:10px; z-index:2; width:34px; height:34px; border-radius:50%;
  background:rgba(0,0,0,.5); border:1px solid rgba(244,240,230,.3); color:var(--cream);
  display:flex; align-items:center; justify-content:center; font-size:14px; cursor:pointer; transition:all .25s ease;
}
.showreel-mute:hover{background:var(--gold); color:var(--ink); border-color:var(--gold);}

/* ---------- experience timeline ---------- */
.experience{background:var(--ink);}
.timeline{max-width:760px; border-left:1px solid var(--line); margin-left:6px;}
.timeline-item{position:relative; padding:0 0 44px 40px;}
.timeline-item:last-child{padding-bottom:0;}
.t-dot{position:absolute; left:-6px; top:4px; width:11px; height:11px; border-radius:50%; background:var(--ink); border:2px solid var(--stone);}
.timeline-item.current .t-dot{border-color:var(--gold); background:var(--gold); box-shadow:0 0 0 5px rgba(201,162,39,.15);}
.t-status{font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-soft);}
.timeline-item h3{font-size:clamp(26px,3.4vw,36px); color:var(--cream); margin-top:6px;}
.t-body p{font-family:'Cormorant Garamond',serif; font-size:18px; color:var(--paper); margin-top:8px;}
.timeline-item.current .t-status{color:var(--gold);}

/* ---------- spotlight / marigowda ---------- */
.spotlight{background:radial-gradient(ellipse at top, #17130d 0%, var(--ink) 60%); text-align:center;}
.spotlight-cone{
  position:absolute; top:-10%; left:50%; transform:translateX(-50%); width:70vw; height:60%;
  background:conic-gradient(from 200deg at 50% 0%, transparent 0deg, rgba(201,162,39,.08) 35deg, transparent 70deg);
  pointer-events:none;
}
.spotlight-sub{font-family:'Cormorant Garamond',serif; font-style:italic; color:var(--gold-soft); font-size:20px; margin-top:6px;}
.video-frame{max-width:900px; margin:0 auto; position:relative; padding:14px; background:#000; border:1px solid rgba(201,162,39,.25); box-shadow:var(--shadow);}
.video-frame-inner{position:relative; width:100%; padding-top:56.25%; background:#000;}
.video-frame-inner iframe{position:absolute; inset:0; width:100%; height:100%;}
.spotlight-note{margin-top:22px; font-size:13px; color:var(--stone); max-width:520px; margin-left:auto; margin-right:auto;}
.spotlight-note code{background:rgba(255,255,255,.06); padding:2px 7px; border-radius:3px; color:var(--gold-soft); font-size:12px;}

/* ---------- watch / screening room ---------- */
.watch{background:var(--ink-2);}
.watch-feature{
  display:grid; grid-template-columns:minmax(220px, .85fr) minmax(320px, 1.15fr);
  gap:24px; align-items:center; max-width:1100px; margin:0 auto 32px; padding:24px;
  border:1px solid rgba(201,162,39,.24); border-radius:14px;
  background:linear-gradient(135deg, rgba(201,162,39,.14), rgba(255,255,255,.035));
}
.watch-feature-copy h3{font-size:clamp(28px,3.4vw,38px); color:var(--cream); margin:10px 0 8px;}
.watch-feature-tag{
  display:inline-block; font-size:10px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold-soft); border:1px solid rgba(201,162,39,.3); padding:6px 12px; border-radius:999px;
}
.watch-feature-copy p{font-family:'Cormorant Garamond',serif; font-size:18px; color:var(--paper); max-width:44ch;}
.watch-feature-card{display:block; border:1px solid rgba(255,255,255,.08); border-radius:12px; overflow:hidden; box-shadow:var(--shadow);}
.watch-feature-thumb{
  position:relative; aspect-ratio:16/9; background-size:cover; background-position:center; display:flex; align-items:center; justify-content:center;
  filter:grayscale(.2) contrast(1.04); transition:transform .35s ease, filter .35s ease;
}
.watch-feature-card:hover .watch-feature-thumb{transform:scale(1.02); filter:grayscale(0) contrast(1.06);}
.watch-feature-thumb::after{content:""; position:absolute; inset:0; background:rgba(0,0,0,.2); transition:background .3s ease;}
.watch-feature-card:hover .watch-feature-thumb::after{background:rgba(0,0,0,.05);}
.watch-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:22px;}
.watch-card{display:block;}
.watch-thumb{
  position:relative; aspect-ratio:16/10; background-size:cover; background-position:center;
  filter:grayscale(.3); transition:filter .35s ease;
  display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.08); border-radius:10px; overflow:hidden;
}
.watch-card:hover .watch-thumb{filter:grayscale(0);}
.watch-thumb::after{content:""; position:absolute; inset:0; background:rgba(0,0,0,.28); transition:background .3s ease;}
.watch-card:hover .watch-thumb::after{background:rgba(0,0,0,.05);}
.play{
  position:relative; z-index:2; width:52px; height:52px; border-radius:50%; background:rgba(244,240,230,.14);
  border:1px solid rgba(244,240,230,.5); color:var(--cream); display:flex; align-items:center; justify-content:center;
  font-size:16px; backdrop-filter:blur(3px); transition:transform .3s ease, background .3s ease;
}
.watch-card:hover .play{transform:scale(1.12); background:var(--gold); color:var(--ink); border-color:var(--gold);}
.watch-meta{padding:14px 2px;}
.watch-meta h4{font-family:'Work Sans',sans-serif; font-weight:600; font-size:15px; color:var(--cream); letter-spacing:.01em;}
.watch-meta span{font-size:12px; color:var(--stone); text-transform:uppercase; letter-spacing:.08em;}

/* ---------- credits / footer ---------- */
.credits{background:var(--ink); border-top:1px solid var(--line); text-align:center; padding-top:90px; padding-bottom:60px;}
.credits-tag{font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold);}
.credits h2{font-size:clamp(40px,7vw,80px); margin:14px 0 46px; color:var(--cream);}
.credits-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:26px; max-width:820px; margin:0 auto 60px;}
.credits-grid div{display:flex; flex-direction:column; gap:8px;}
.credits-grid span{font-size:11px; text-transform:uppercase; letter-spacing:.14em; color:var(--stone);}
.credits-grid a, .credits-grid .plain{font-size:16px; color:var(--cream);}
.credits-grid a:hover{color:var(--gold-soft);}
.credits-fine{font-size:12px; color:var(--stone);}

@media (max-width:840px){
  .watch-feature{grid-template-columns:1fr;}
}

@media (max-width:600px){
  section{padding:80px 6vw;}
  .credits{padding-top:70px;}
}