:root {
--bg-dark:#07080b;
--bg-surface:#0e1117;
--bg-card:rgba(18,22,31,0.82);
--border-card:rgba(212,175,55,0.18);
--border-glow:rgba(245,158,11,0.45);
--accent-gold:#e5b85c;
--accent-gold-bright:#ffd479;
--accent-gold-gradient:linear-gradient(135deg,#fce09b 0%,#d4af37 50%,#997819 100%);
--accent-ruby:#e11d48;
--text-main:#f8fafc;
--text-muted:#94a3b8;
--max-width:1240px
}

* {
box-sizing:border-box;
margin:0;
padding:0
}

html {
scroll-behavior:smooth
}

body {
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
background-color:var(--bg-dark);
color:var(--text-main);
line-height:1.65;
overflow-x:hidden;
background-image:radial-gradient(circle at 10% 20%,rgba(212,175,55,0.05) 0%,transparent 40%),radial-gradient(circle at 90% 70%,rgba(225,29,72,0.04) 0%,transparent 50%)
}

h1,h2,h3,.brand-text {
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
letter-spacing:.5px
}

a {
color:var(--accent-gold);
text-decoration:none;
transition:all .25s ease
}

a:hover {
color:var(--accent-gold-bright)
}

/* --- Announcement Strip --- */
.top-strip {
background:linear-gradient(90deg,#050608 0%,#1a140a 50%,#050608 100%);
color:var(--accent-gold-bright);
text-align:center;
padding:8px 14px;
font-size:.8rem;
letter-spacing:1.2px;
text-transform:uppercase;
border-bottom:1px solid rgba(212,175,55,0.15)
}

/* --- Sticky Header & Navigation --- */
header {
position:sticky;
top:0;
border-bottom:1px solid rgba(255,255,255,0.07);
z-index:1000
}

header::before {
content:"";
position:absolute;
inset:0;
background:rgba(7,8,11,0.94);
backdrop-filter:blur(14px);
-webkit-backdrop-filter:blur(14px);
z-index:-1
}

.nav-bar {
max-width:var(--max-width);
margin:0 auto;
display:flex;
justify-content:space-between;
align-items:center;
padding:12px 20px;
position:relative
}

.brand-wrapper {
display:flex;
align-items:center;
gap:12px;
text-decoration:none
}

.brand-logo {
height:40px;
width:auto;
max-width:140px;
object-fit:contain;
display:block
}

.brand-logo:not([src]),.brand-logo[src=""],.brand-logo[src*="undefined"] {
display:none
}

.brand-text {
font-size:1.25rem;
font-weight:700;
background:var(--accent-gold-gradient);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
white-space:nowrap
}

.nav-toggle {
display:none;
background:transparent;
border:none;
cursor:pointer;
padding:6px;
z-index:1001
}

.nav-toggle span {
display:block;
width:25px;
height:2px;
background:var(--accent-gold);
margin:5px 0;
border-radius:2px;
transition:all .3s ease
}

.nav-links {
display:flex;
gap:16px;
list-style:none;
align-items:center;
margin:0;
padding:0
}

.nav-links a {
color:#e2e8f0;
font-size:.88rem;
font-weight:500;
white-space:nowrap;
padding:6px 4px
}

.nav-links a.active,.nav-links a:hover {
color:var(--accent-gold);
text-shadow:0 0 10px rgba(229,184,92,0.5)
}

/* Dropdown Menu & Arrow Styling */
.nav-item-dropdown {
position:relative
}

.dropdown-trigger {
cursor:pointer;
display:inline-flex;
align-items:center;
gap:6px;
color:#e2e8f0;
font-size:.88rem;
font-weight:500;
white-space:nowrap;
padding:6px 4px;
transition:color .25s ease
}

.dropdown-trigger:hover {
color:var(--accent-gold)
}

.dropdown-arrow {
font-size:.65rem;
transition:transform .3s ease
}

.dropdown-menu {
display:none;
position:absolute;
top:100%;
left:0;
background:#0d1017;
border:1px solid var(--border-card);
border-radius:10px;
box-shadow:0 12px 30px rgba(0,0,0,0.8);
list-style:none;
padding:8px 0;
min-width:220px;
z-index:1050
}

.dropdown-menu li a {
display:block;
padding:10px 18px;
font-size:.85rem;
color:#cbd5e1;
transition:all .2s ease
}

.dropdown-menu li a:hover,.dropdown-menu li a.active {
background:rgba(212,175,55,0.1);
color:var(--accent-gold-bright);
padding-left:22px
}

/* Desktop Hover Trigger & Arrow Rotation */
@media (min-width: 921px) {
.nav-item-dropdown:hover .dropdown-menu {
display:block
}

.nav-item-dropdown:hover .dropdown-arrow {
transform:rotate(180deg)
}
}

/* --- Mobile Navigation Drawer Fix (Single Definitive Block) --- */
@media (max-width: 920px) {
.nav-bar {
padding:10px 16px
}

.brand-text {
font-size:1.05rem
}

.nav-toggle {
display:block!important
}

.nav-links {
position:fixed!important;
top:0!important;
right:-100%!important;
left:auto!important;
width:280px!important;
height:100vh!important;
background:#090b10!important;
border-left:1px solid var(--border-card);
flex-direction:column!important;
align-items:flex-start!important;
padding:70px 24px 30px!important;
gap:12px!important;
box-shadow:-15px 0 40px rgba(0,0,0,0.9)!important;
transition:right .3s ease-in-out!important;
z-index:99999!important;
overflow-y:auto!important
}

.nav-links.active {
right:0!important
}

.nav-links a {
font-size:.95rem;
display:block;
width:100%;
padding:6px 0;
border-bottom:1px solid rgba(255,255,255,0.05)
}

.dropdown-trigger {
display:flex;
justify-content:space-between;
align-items:center;
width:100%;
font-size:.95rem;
padding:6px 0;
border-bottom:1px solid rgba(255,255,255,0.05)
}

.nav-item-dropdown .dropdown-menu {
display:none!important;
position:static!important;
background:rgba(0,0,0,0.3)!important;
border:none!important;
box-shadow:none!important;
padding-left:16px!important;
width:100%!important
}

.nav-item-dropdown.open .dropdown-menu {
display:block!important
}

.nav-item-dropdown.open .dropdown-arrow {
transform:rotate(180deg)
}

.nav-toggle.open span:nth-child(1) {
transform:rotate(45deg) translate(5px,5px)
}

.nav-toggle.open span:nth-child(2) {
opacity:0
}

.nav-toggle.open span:nth-child(3) {
transform:rotate(-45deg) translate(5px,-5px)
}
}

/* --- Stage Hero Banner with Face Framing --- */
.hero-banner {
position:relative;
min-height:520px;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
padding:60px 20px;
overflow:hidden;
background-color:#06070a
}

.hero-banner::before {
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background-image:url(images/hero-banner.jpg);
background-repeat:no-repeat;
background-position:center 20%;
background-size:cover;
opacity:.88;
filter:contrast(1.08) brightness(1.04)
}

.hero-banner::after {
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:radial-gradient(circle at 50% 25%,rgba(255,212,121,0.18) 0%,transparent 65%),linear-gradient(to bottom,rgba(7,8,11,0.25) 0%,rgba(7,8,11,0.75) 75%,var(--bg-dark) 100%);
pointer-events:none
}

.hero-content {
max-width:920px;
position:relative;
z-index:2;
margin-top:130px;
background:rgba(10,12,17,0.6);
padding:30px 24px;
border-radius:20px;
backdrop-filter:blur(8px);
-webkit-backdrop-filter:blur(8px);
border:1px solid rgba(255,255,255,0.08)
}

.stage-pill {
display:inline-flex;
align-items:center;
padding:5px 16px;
background:rgba(229,184,92,0.12);
border:1px solid rgba(229,184,92,0.4);
border-radius:50px;
color:var(--accent-gold-bright);
font-size:.78rem;
font-weight:600;
text-transform:uppercase;
letter-spacing:1.5px;
margin-bottom:16px;
box-shadow:0 0 15px rgba(229,184,92,0.2)
}

.hero-banner h1 {
font-size:clamp(1.6rem,4.2vw,3rem);
font-weight:800;
line-height:1.25;
color:#fff;
margin-bottom:16px;
text-shadow:0 3px 18px rgba(0,0,0,0.9)
}

.hero-banner p {
font-size:clamp(0.95rem,2vw,1.15rem);
color:#e2e8f0;
max-width:760px;
margin:0 auto 24px;
font-weight:300
}

/* Buttons */
.btn-group {
display:flex;
gap:14px;
justify-content:center;
flex-wrap:wrap
}

.btn {
display:inline-flex;
align-items:center;
justify-content:center;
padding:12px 28px;
border-radius:30px;
font-size:.92rem;
font-weight:600;
cursor:pointer;
letter-spacing:.5px;
transition:all .3s cubic-bezier(0.16,1,0.3,1)
}

.btn-gold {
background:var(--accent-gold-gradient);
color:#07080b;
box-shadow:0 4px 18px rgba(212,175,55,0.32)
}

.btn-gold:hover {
transform:translateY(-2px);
box-shadow:0 6px 25px rgba(212,175,55,0.5);
color:#000;
text-decoration:none
}

.btn-glass {
background:rgba(255,255,255,0.06);
color:#fff;
border:1px solid rgba(255,255,255,0.16);
backdrop-filter:blur(8px)
}

.btn-glass:hover {
background:rgba(255,255,255,0.14);
border-color:var(--accent-gold);
transform:translateY(-2px);
text-decoration:none
}

/* Global Content Sections */
.section {
padding:60px 20px;
position:relative
}

.container {
max-width:var(--max-width);
margin:0 auto
}

.section-title {
text-align:center;
font-size:clamp(1.5rem,3.2vw,2.2rem);
font-weight:700;
margin-bottom:12px;
background:linear-gradient(180deg,#fff 40%,#cbd5e1 100%);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent
}

.section-subtitle {
text-align:center;
font-size:1rem;
color:var(--text-muted);
max-width:800px;
margin:0 auto 38px;
font-weight:300
}

.section-stage {
background:radial-gradient(circle at center,#11202e 0%,#080c11 100%);
border-top:1px solid rgba(212,175,55,0.12);
border-bottom:1px solid rgba(212,175,55,0.12)
}

.section-noir {
background:#090a0d
}

/* Grid Layouts */
.spotlight-grid {
display:grid;
grid-template-columns:repeat(auto-fit,minmax(290px,1fr));
gap:26px
}

.spotlight-card {
background:var(--bg-card);
border:1px solid var(--border-card);
border-radius:16px;
overflow:hidden;
backdrop-filter:blur(12px);
display:flex;
flex-direction:column;
transition:all .3s ease
}

.spotlight-card:hover {
transform:translateY(-4px);
border-color:var(--border-glow);
box-shadow:0 10px 28px rgba(0,0,0,0.6),0 0 20px rgba(212,175,55,0.12)
}

.uncut-media-stage {
width:100%;
background:#000;
display:flex;
align-items:center;
justify-content:center;
border-bottom:1px solid rgba(255,255,255,0.06)
}

.uncut-media-stage img {
width:100%;
height:auto;
max-height:420px;
object-fit:contain;
display:block
}

.spotlight-body {
padding:22px;
flex:1;
display:flex;
flex-direction:column
}

.spotlight-body h2,.spotlight-body h3 {
font-size:1.2rem;
margin-bottom:10px;
color:#fff
}

.spotlight-body p {
color:var(--text-muted);
font-size:.94rem;
margin-bottom:16px;
flex:1
}

.duo-grid {
display:grid;
grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
gap:28px
}

.feature-frame {
background:rgba(13,17,24,0.75);
border:1px solid var(--border-card);
border-radius:16px;
overflow:hidden;
backdrop-filter:blur(10px);
display:flex;
flex-direction:column
}

.feature-frame-body {
padding:24px
}

.feature-frame-body h2,.feature-frame-body h3 {
font-size:1.3rem;
color:#fff;
margin-bottom:12px
}

.feature-frame-body p {
color:#e2e8f0;
font-size:.95rem;
margin-bottom:14px
}

.gold-bullet-list {
list-style:none;
padding-left:0;
margin:14px 0
}

.gold-bullet-list li {
position:relative;
padding-left:22px;
margin-bottom:8px;
font-size:.92rem;
color:var(--text-muted)
}

.gold-bullet-list li::before {
content:"♦";
position:absolute;
left:0;
color:var(--accent-gold);
font-size:.75rem
}

/* --- Optimized Video Theater Grid & Uncropped Thumbnails --- */
.video-theater-grid {
display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
gap:24px;
width:100%
}

.theater-card {
background:var(--bg-card);
border:1px solid var(--border-card);
border-radius:14px;
overflow:hidden;
display:flex;
flex-direction:column;
transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease
}

.theater-card:hover {
transform:translateY(-4px);
border-color:var(--border-glow);
box-shadow:0 10px 28px rgba(0,0,0,0.6)
}

.facade-stage {
position:relative;
width:100%;
padding-top:56.25%;
background:#020305;
display:block;
overflow:hidden;
cursor:pointer
}

.facade-stage img {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
object-fit:contain;
background:#000;
display:block
}

.theater-play-btn {
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
display:flex;
flex-direction:column;
align-items:center;
gap:8px;
transition:transform .25s ease
}

.play-core {
width:62px;
height:42px;
background:rgba(14,17,24,0.88);
border:1px solid rgba(255,255,255,0.25);
border-radius:12px;
display:flex;
align-items:center;
justify-content:center;
box-shadow:0 4px 18px rgba(0,0,0,0.6)
}

.play-core::after {
content:"";
border-style:solid;
border-width:8px 0 8px 16px;
border-color:transparent transparent transparent #ffd479
}

.play-caption {
color:#fff;
font-size:.72rem;
font-weight:600;
background:rgba(0,0,0,0.85);
padding:4px 10px;
border-radius:20px
}

.facade-stage:hover .theater-play-btn {
transform:translate(-50%,-50%) scale(1.08)
}

.facade-stage:hover .play-core {
background:var(--accent-ruby);
border-color:transparent
}

.facade-stage:hover .play-core::after {
border-color:transparent transparent transparent #fff
}

.facade-stage iframe {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
border:none
}

.theater-info {
padding:20px;
flex:1;
display:flex;
flex-direction:column;
justify-content:space-between
}

.theater-info h3 {
font-size:1.1rem;
line-height:1.35;
margin-bottom:8px;
color:#fff
}

.theater-info p {
font-size:.9rem;
color:var(--text-muted);
margin:0
}

/* FAQ Wrap */
.faq-wrap {
max-width:860px;
margin:0 auto
}

.faq-unit {
background:var(--bg-card);
border:1px solid rgba(255,255,255,0.08);
border-radius:12px;
padding:20px 22px;
margin-bottom:14px
}

.faq-unit h3 {
font-size:1.1rem;
color:var(--accent-gold-bright);
margin-bottom:6px
}

.faq-unit p {
color:var(--text-muted);
font-size:.94rem
}

/* --- Optimized Footer & Enlarged Social Icons Styling --- */
.site-footer {
background:#040507;
border-top:1px solid rgba(212,175,55,0.18);
padding:50px 20px 36px;
text-align:center
}

.footer-inner {
display:flex;
flex-direction:column;
align-items:center;
gap:20px
}

/* SEO Footer Navigation Sitemap Links */
.footer-nav-links {
display:flex;
justify-content:center;
flex-wrap:wrap;
gap:18px 24px;
margin-bottom:6px
}

.footer-nav-links a {
color:var(--text-muted);
font-size:.9rem;
font-weight:500;
transition:color .25s ease
}

.footer-nav-links a:hover {
color:var(--accent-gold-bright)
}

.footer-tagline {
color:#cbd5e1;
font-size:.95rem;
margin-bottom:4px
}

/* Enlarged Social Circle Strip */
.social-circle-strip {
display:flex;
justify-content:center;
align-items:center;
gap:16px;
margin:10px 0 16px;
flex-wrap:wrap
}

.social-circle {
width:48px;
height:48px;
border-radius:50%;
background:rgba(255,255,255,0.04);
border:1px solid rgba(212,175,55,0.25);
color:var(--accent-gold);
display:flex;
align-items:center;
justify-content:center;
transition:all .3s cubic-bezier(0.16,1,0.3,1);
box-shadow:0 4px 12px rgba(0,0,0,0.4)
}

.social-circle:hover {
transform:translateY(-4px) scale(1.08);
background:var(--accent-gold-gradient);
color:#07080b;
border-color:transparent;
box-shadow:0 6px 20px rgba(212,175,55,0.4)
}

.footer-credits {
color:#64748b;
font-size:.85rem;
letter-spacing:.3px
}

@media (max-width: 600px) {
.hero-banner {
min-height:460px;
padding:30px 14px 40px
}

.hero-banner::before {
background-position:center 10%
}

.hero-content {
margin-top:150px;
padding:20px 16px
}

.section {
padding:45px 14px
}
}

/* --- Indian Idol 2 Story Timeline & Milestone Components --- */
.journey-timeline-card {
background:var(--bg-card);
border:1px solid var(--border-card);
border-radius:14px;
padding:24px;
margin-bottom:24px;
backdrop-filter:blur(10px)
}

.timeline-list {
list-style:none;
display:flex;
flex-direction:column;
gap:14px;
margin-top:14px
}

.timeline-item {
background:rgba(255,255,255,0.03);
border:1px solid rgba(255,255,255,0.08);
border-left:4px solid var(--accent-gold);
border-radius:10px;
padding:18px 20px;
transition:all .25s ease
}

.timeline-item:hover {
background:rgba(255,255,255,0.05);
border-left-color:var(--accent-gold-bright)
}

.timeline-item.highlight-gold {
border-left-color:#f59e0b;
background:rgba(245,158,11,0.04)
}

.timeline-header-row {
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:wrap;
gap:10px;
margin-bottom:6px
}

.timeline-label {
font-size:1.05rem;
font-weight:700;
color:var(--accent-gold-bright);
display:flex;
align-items:center;
gap:8px
}

.timeline-text {
font-size:.96rem;
color:#e2e8f0;
line-height:1.65
}

.song-badge {
display:inline-block;
background:rgba(229,184,92,0.15);
color:var(--accent-gold-bright);
font-weight:700;
font-size:.78rem;
padding:2px 8px;
border-radius:4px;
margin-right:6px;
border:1px solid rgba(229,184,92,0.3)
}

.stage-badge {
display:inline-block;
background:rgba(245,158,11,0.12);
color:var(--accent-gold);
font-size:.78rem;
font-weight:700;
padding:3px 10px;
border-radius:20px;
border:1px solid rgba(245,158,11,0.3)
}

/* Audio Listen Button & Modal */
.btn-listen {
display:inline-flex;
align-items:center;
gap:7px;
background:var(--accent-gold-gradient);
color:#07080b;
padding:6px 16px;
border-radius:50px;
font-size:.82rem;
font-weight:700;
cursor:pointer;
border:none;
box-shadow:0 2px 10px rgba(212,175,55,0.25);
transition:all .2s ease
}

.btn-listen:hover {
filter:brightness(1.12);
transform:translateY(-1px);
box-shadow:0 4px 14px rgba(212,175,55,0.4)
}

.player-modal {
display:none;
position:fixed;
inset:0;
background:rgba(0,0,0,0.85);
z-index:99999;
align-items:center;
justify-content:center;
padding:16px
}

.player-modal.active {
display:flex
}

.modal-content {
background:#111319;
border:1px solid var(--border-card);
border-radius:14px;
width:100%;
max-width:520px;
padding:20px;
box-shadow:0 10px 40px rgba(0,0,0,0.8)
}

.modal-header {
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:14px;
border-bottom:1px solid rgba(255,255,255,0.08);
padding-bottom:10px
}

.modal-title {
font-size:.95rem;
color:#fff;
font-weight:600;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
padding-right:10px
}

.modal-close {
background:transparent;
border:none;
color:#aaa;
font-size:26px;
cursor:pointer;
line-height:1
}

.modal-close:hover {
color:#fff
}

.player-iframe {
width:100%;
height:140px;
border:none;
border-radius:8px;
background:#000
}

/* Stage Milestone Grid */
.stage-milestone-grid {
display:grid;
grid-template-columns:repeat(2,1fr);
gap:20px;
margin-top:14px
}

@media (max-width: 768px) {
.stage-milestone-grid {
grid-template-columns:1fr
}
}

/* Reviews & Quick Actions */
.reviews-strip {
background:rgba(255,255,255,0.03);
border:1px solid rgba(212,175,55,0.2);
border-radius:12px;
padding:14px 20px;
margin:0 auto 36px;
max-width:820px;
display:flex;
align-items:center;
justify-content:space-between;
flex-wrap:wrap;
gap:14px
}

.reviews-meta-group {
display:flex;
align-items:center;
gap:14px
}

.g-badge-icon {
width:34px;
height:34px;
flex-shrink:0
}

.rating-row {
display:flex;
align-items:center;
gap:8px
}

.rating-score {
font-size:1.25rem;
color:#fff;
font-weight:700
}

.rating-stars {
color:#f59e0b;
font-size:.95rem
}

.rating-count {
color:var(--text-muted);
font-size:.85rem
}

.business-brand {
font-size:.85rem;
color:var(--accent-gold)
}

.quick-action-grid {
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:20px;
max-width:980px;
margin:0 auto 44px
}

.contact-action-card {
text-decoration:none;
padding:26px 20px;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
text-align:center;
transition:transform .25s ease
}

.contact-action-card:hover {
transform:translateY(-3px)
}

.contact-action-icon {
width:54px;
height:54px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
margin-bottom:14px
}

.icon-wa {
background:#25d366;
color:#fff;
font-size:1.6rem;
box-shadow:0 4px 15px rgba(37,211,102,0.3)
}

.icon-phone {
background:var(--accent-gold);
color:#000;
font-size:1.4rem;
box-shadow:0 4px 15px rgba(229,184,92,0.3)
}

.icon-mail {
background:#1877f2;
color:#fff;
font-size:1.4rem;
box-shadow:0 4px 15px rgba(24,119,242,0.3)
}

.contact-action-title {
color:#fff;
font-size:1.1rem;
margin-bottom:4px;
display:block
}

.contact-action-value {
color:var(--accent-gold);
font-size:.95rem;
font-weight:600
}

/* Service Packages & Media Kit */
.service-package-card {
padding:24px;
display:flex;
flex-direction:column;
justify-content:space-between
}

.package-header {
color:var(--accent-gold);
margin-bottom:12px;
display:flex;
align-items:center;
gap:10px
}

.package-desc {
color:#cbd5e1;
font-size:.95rem;
line-height:1.6;
margin-bottom:18px
}

.package-cta-group {
display:flex;
gap:12px;
flex-wrap:wrap
}

.btn-card-action {
flex:1;
min-width:140px;
padding:10px 16px
}

.media-kit-header {
background:var(--bg-card);
border:1px solid var(--border-card);
border-radius:14px;
padding:32px 26px;
margin-bottom:36px;
backdrop-filter:blur(10px)
}

.guidelines-grid {
display:grid;
grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
gap:16px;
margin-top:20px;
padding-top:20px;
border-top:1px solid rgba(255,255,255,0.08)
}

.guideline-item {
background:rgba(255,255,255,0.02);
padding:14px 16px;
border-radius:8px;
border-left:3px solid var(--accent-gold)
}

.guideline-item strong {
display:block;
color:var(--accent-gold-bright);
font-size:.92rem;
margin-bottom:4px
}

.gallery-grid {
display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
gap:28px;
margin-bottom:48px
}

.gallery-card {
background:var(--bg-card);
border:1px solid var(--border-card);
border-radius:16px;
overflow:hidden;
display:flex;
flex-direction:column;
transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease
}

.gallery-card:hover {
transform:translateY(-4px);
border-color:var(--border-glow);
box-shadow:0 10px 28px rgba(0,0,0,0.6),0 0 20px rgba(212,175,55,0.12)
}

.gallery-img-box {
position:relative;
width:100%;
height:420px;
background:#000;
overflow:hidden;
cursor:pointer
}

.gallery-img-box img {
width:100%;
height:100%;
object-fit:cover;
display:block;
transition:transform .35s ease
}

.gallery-card:hover .gallery-img-box img {
transform:scale(1.04)
}

/* Streaming & MP3 Hub */
.streaming-hub-box {
background:var(--bg-card);
border:1px solid var(--border-card);
border-radius:16px;
padding:32px 24px;
margin-bottom:36px;
text-align:center;
backdrop-filter:blur(10px)
}

.streaming-apps-row {
display:flex;
justify-content:center;
align-items:center;
gap:16px;
flex-wrap:wrap;
margin-top:20px
}

.streaming-badge-link {
display:inline-flex;
align-items:center;
gap:10px;
padding:12px 22px;
border-radius:50px;
color:#ffffff;
font-weight:600;
font-size:.92rem;
text-decoration:none;
transition:transform .25s ease,box-shadow .25s ease
}

.mp3-track-list {
display:flex;
flex-direction:column;
gap:10px
}

.mp3-track-row {
display:flex;
align-items:center;
justify-content:space-between;
background:rgba(255,255,255,0.02);
border:1px solid rgba(255,255,255,0.06);
border-left:4px solid var(--accent-gold);
border-radius:8px;
padding:12px 16px;
gap:14px;
transition:all .25s ease
}

.mp3-track-row:hover {
background:rgba(255,255,255,0.05);
border-left-color:var(--accent-gold-bright);
transform:translateX(3px)
}

/* Bollywood Legends Gallery */
.legends-gallery-grid {
display:grid;
grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
gap:24px;
margin-top:28px;
margin-bottom:48px
}

.legend-card {
background:var(--bg-card);
border:1px solid var(--border-card);
border-radius:14px;
overflow:hidden;
display:flex;
flex-direction:column;
backdrop-filter:blur(10px);
transition:transform .25s ease,box-shadow .25s ease
}

.legend-img-wrap {
width:100%;
background:#020305;
display:flex;
align-items:center;
justify-content:center;
position:relative;
cursor:pointer;
border-bottom:1px solid rgba(255,255,255,0.08);
padding:12px
}

.legend-img-wrap img {
width:100%;
height:auto;
max-height:380px;
object-fit:contain;
display:block;
border-radius:6px
}

.legend-card-caption {
padding:14px 16px;
text-align:center;
background:rgba(10,14,20,0.75);
flex:1;
display:flex;
align-items:center;
justify-content:center
}

.legend-card-caption p {
color:#f1f5f9;
font-size:.9rem;
font-weight:600;
line-height:1.4;
margin:0
}

/* --- About Page Specific Layout Enhancements --- */
.about-hero-grid {
display:grid;
grid-template-columns:380px 1fr;
gap:36px;
align-items:center;
background:var(--bg-card);
border:1px solid var(--border-card);
border-radius:18px;
padding:32px;
margin-bottom:36px;
backdrop-filter:blur(12px)
}

.about-portrait-wrap {
width:100%;
border-radius:12px;
overflow:hidden;
border:1px solid rgba(212,175,55,0.25);
background:#000
}

.about-portrait-wrap img {
width:100%;
height:auto;
max-height:440px;
object-fit:cover;
display:block
}

.about-intro-text .section-title,.about-intro-text .section-subtitle {
text-align:left;
margin-left:0;
margin-right:0
}

.about-text-lead {
font-size:1rem;
color:#e2e8f0;
line-height:1.7
}

.about-text-para {
color:var(--text-muted);
font-size:.96rem;
margin-bottom:14px;
line-height:1.7
}

/* Fast Facts Table Rows Alignment Fix */
.facts-table-wrap {
display:flex;
flex-direction:column;
gap:10px;
margin-top:14px
}

.fact-row-item {
display:grid;
grid-template-columns:240px 1fr;
align-items:center;
background:rgba(255,255,255,0.02);
border:1px solid rgba(255,255,255,0.06);
padding:12px 18px;
border-radius:8px;
gap:16px
}

.fact-label {
font-weight:600;
color:var(--accent-gold-bright);
font-size:.92rem
}

.fact-val {
color:#f1f5f9;
font-size:.92rem;
text-align:left
}

@media (max-width: 920px) {
.about-hero-grid {
grid-template-columns:1fr;
padding:20px
}

.about-portrait-wrap img {
max-height:360px
}

.fact-row-item {
grid-template-columns:1fr;
gap:4px
}
}

/* Review Action & Spacing */
.g-review-action-row {
display:flex;
align-items:center;
gap:16px!important;
flex-wrap:wrap
}

.btn-write-review {
background:var(--accent-gold-gradient);
color:#07080b;
font-weight:700;
padding:10px 22px!important;
border-radius:50px;
font-size:.88rem;
display:inline-flex;
align-items:center;
gap:8px;
text-decoration:none;
white-space:nowrap;
box-shadow:0 4px 15px rgba(212,175,55,0.25);
transition:all .25s ease
}

.btn-write-review:hover {
transform:translateY(-2px);
filter:brightness(1.1);
color:#000
}

/* Side-by-Side Celebrity Testimonial Cards (Uncropped Images) */
.testimonial-card-featured {
background:var(--bg-card);
border:1px solid var(--border-card);
border-radius:16px;
overflow:hidden;
display:grid;
grid-template-columns:320px 1fr!important;
margin-bottom:28px;
backdrop-filter:blur(10px);
transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease
}

.testimonial-card-featured:hover {
transform:translateY(-3px);
border-color:var(--border-glow);
box-shadow:0 10px 30px rgba(0,0,0,0.6),0 0 20px rgba(212,175,55,0.12)
}

.testimonial-media {
background:#020305;
display:flex;
align-items:center;
justify-content:center;
border-right:1px solid rgba(255,255,255,0.08);
padding:16px
}

.testimonial-media img {
width:100%;
height:auto;
max-height:380px;
object-fit:contain!important;
display:block;
border-radius:8px
}

.testimonial-content {
padding:30px 28px;
display:flex;
flex-direction:column;
justify-content:center
}

@media (max-width: 820px) {
.testimonial-card-featured {
grid-template-columns:1fr!important
}

.testimonial-media {
border-right:none;
border-bottom:1px solid rgba(255,255,255,0.08)
}
}

.reviews-masonry-grid {
display:grid!important;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr))!important;
gap:24px!important;
margin-top:28px!important;
align-items:stretch
}

.audience-review-card {
background:rgba(14,18,25,0.75);
border:1px solid rgba(255,255,255,0.08);
border-radius:12px;
padding:24px 22px!important;
display:flex;
flex-direction:column;
justify-content:space-between;
gap:16px;
height:100%;
transition:transform .2s ease,border-color .2s ease
}

.audience-review-card:hover {
transform:translateY(-2px);
border-color:rgba(212,175,55,0.4)
}

.audience-review-card img.review-screenshot,.audience-review-card .reviewer-avatar + img,.audience-review-card img:not(.reviewer-avatar) {
width:100%;
max-height:180px;
object-fit:contain;
border-radius:8px;
background:#000;
margin-bottom:10px
}

/* Lightbox Popup Viewport Bound */
.image-lightbox {
display:none;
position:fixed;
inset:0;
background:rgba(0,0,0,0.94);
z-index:999999;
align-items:center;
justify-content:center;
padding:15px
}

.image-lightbox.active {
display:flex!important
}

.image-lightbox img {
max-width:85vw!important;
max-height:55vh!important;
width:auto!important;
height:auto!important;
object-fit:contain!important;
border-radius:8px;
border:1px solid rgba(212,175,55,0.3);
box-shadow:0 0 35px rgba(0,0,0,0.8)
}

.image-lightbox-close {
position:absolute;
top:15px;
right:20px;
color:#fff;
font-size:38px;
cursor:pointer;
background:transparent;
border:none;
z-index:1000000
}

/* --- Mobile Menu Header & Close 'X' Button Styling --- */
.mobile-menu-header {
display:none;
width:100%;
justify-content:space-between;
align-items:center;
padding-bottom:16px;
margin-bottom:8px;
border-bottom:1px solid rgba(255,255,255,0.1)
}

.menu-brand-title {
font-family:'Cinzel',serif;
font-size:1.1rem;
color:var(--accent-gold-bright);
font-weight:700
}

.nav-close-btn {
background:transparent;
border:none;
color:#fff;
font-size:32px;
cursor:pointer;
line-height:1;
padding:0 4px;
transition:color .2s ease
}

.nav-close-btn:hover {
color:var(--accent-gold)
}

/* Enable mobile menu header display inside the active drawer */
@media (max-width: 920px) {
.mobile-menu-header {
display:flex
}
}

/* --- Fix 2nd Screenshot: Button Spacing & Icon Padding --- */
.gallery-btn-row {
display:flex;
gap:12px!important
/* Adds clear separation between Zoom and Download buttons */
}

.gallery-btn-row .btn {
gap:8px!important;
/* Adds padding/spacing between font-awesome icon and button text */
padding:10px 18px!important;
white-space:nowrap
}

/* --- Gallery Card Button Spacing & Padding Correction --- */
.gallery-btn-row {
display:flex;
gap:14px!important;
/* Forces a clear gap between Zoom and Download buttons */
align-items:center;
margin-top:8px
}

.gallery-btn-row .btn {
display:inline-flex;
align-items:center;
justify-content:center;
gap:8px!important;
/* Clean space between FontAwesome icon and button text */
padding:11px 20px!important;
/* Comfortable internal button padding */
font-size:.88rem;
font-weight:600;
white-space:nowrap;
border-radius:30px
}

/* Ensure icons scale and align nicely */
.gallery-btn-row .btn i {
font-size:.9rem
}

.reduce_margin_bottom {
margin-bottom:0
}