/* =========================================================
   CINEFLEX SIGNATURE EXPERIENCE v1.0
   A distinct neon-cinema identity layered safely over the app
   ========================================================= */
:root{
  --sig-cyan:#47e7ff;
  --sig-violet:#9b6cff;
  --sig-rose:#ff3d79;
  --sig-ink:#040712;
  --sig-glass:rgba(11,16,35,.62);
  --sig-border:rgba(157,228,255,.18);
}
html{scroll-behavior:smooth}
body{overflow-x:hidden}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.24;
  background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:46px 46px;mask-image:linear-gradient(to bottom,#000,transparent 78%);
}
.cf-noise{position:fixed;inset:0;pointer-events:none;z-index:2;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.75'/%3E%3C/svg%3E")}
.cf-cursor-glow{position:fixed;width:360px;height:360px;border-radius:50%;pointer-events:none;z-index:1;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(71,231,255,.10),rgba(155,108,255,.045) 38%,transparent 68%);transition:opacity .25s ease;opacity:0}
body:hover .cf-cursor-glow{opacity:1}

.logo{font-weight:950!important;font-style:italic;transform:skew(-6deg);background:linear-gradient(90deg,#fff 0 58%,var(--sig-cyan));-webkit-background-clip:text;background-clip:text;color:transparent!important}
.logo::after{content:"ORIGINAL"!important;transform:skew(6deg);display:inline-block;background:linear-gradient(135deg,var(--sig-cyan),#fff)!important;color:#07101c!important}

.banner{clip-path:polygon(0 0,100% 0,100% 93%,72% 100%,0 96%)}
.banner::before{background:linear-gradient(90deg,rgba(2,4,13,.96),rgba(2,4,13,.58) 44%,rgba(2,4,13,.08)),linear-gradient(0deg,rgba(2,4,13,.8),transparent 48%),radial-gradient(circle at 24% 64%,rgba(71,231,255,.18),transparent 26%)!important}
.hero-kicker{border-radius:8px 18px 8px 18px!important;background:linear-gradient(135deg,rgba(71,231,255,.12),rgba(155,108,255,.14))!important}
.hero-kicker::after{content:"• CURATED FOR YOU";color:var(--sig-cyan);font-size:.67rem;letter-spacing:.14em}
#banner-title{text-wrap:balance}
.banner-buttons button{position:relative;overflow:hidden}
.banner-buttons button::after{content:"";position:absolute;inset:-2px;transform:translateX(-120%) skewX(-18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);transition:transform .55s ease}
.banner-buttons button:hover::after{transform:translateX(120%) skewX(-18deg)}

.cf-studio-panel{margin-top:-92px!important;grid-template-columns:1.45fr 1fr 1fr!important;perspective:1000px}
.studio-card{position:relative;overflow:hidden;transition:transform .28s ease,border-color .28s ease}
.studio-card::after{content:"";position:absolute;width:130px;height:130px;border-radius:50%;right:-55px;top:-60px;background:radial-gradient(circle,rgba(71,231,255,.22),transparent 68%)}
.studio-card:hover{transform:translateY(-7px) rotateX(2deg);border-color:rgba(71,231,255,.38)}
.studio-main::before{content:"CF";position:absolute;right:16px;bottom:-20px;font-size:7rem;font-weight:950;color:rgba(255,255,255,.035);letter-spacing:-.12em}

.cf-discovery-dock{width:min(1180px,90%);margin:10px auto 52px;position:relative;z-index:7;padding:12px;display:flex;align-items:center;gap:10px;overflow-x:auto;scrollbar-width:none;border:1px solid var(--sig-border);border-radius:22px;background:linear-gradient(135deg,rgba(8,14,31,.82),rgba(17,12,34,.62));box-shadow:0 22px 70px rgba(0,0,0,.35);backdrop-filter:blur(22px)}
.cf-discovery-dock::-webkit-scrollbar{display:none}
.cf-dock-label{display:flex;align-items:center;gap:8px;white-space:nowrap;padding:0 12px;color:#fff;font-weight:850;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase}
.cf-dock-label i{color:var(--sig-cyan)}
.cf-dock-chip{border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.055);color:#cbd7ef;border-radius:999px;padding:10px 15px;white-space:nowrap;cursor:pointer;font-weight:750;transition:.22s ease}
.cf-dock-chip:hover,.cf-dock-chip.active{color:#07101c;background:linear-gradient(135deg,var(--sig-cyan),#fff);border-color:transparent;box-shadow:0 8px 24px rgba(71,231,255,.22);transform:translateY(-2px)}

.content{counter-reset:cfsection}
.row{counter-increment:cfsection;position:relative!important;padding-top:6px}
.row>h2{display:flex;align-items:center;gap:12px}
.row>h2::before{content:counter(cfsection,decimal-leading-zero);font-size:.67rem;letter-spacing:.12em;color:var(--sig-cyan);padding:5px 7px;border:1px solid rgba(71,231,255,.24);border-radius:7px;background:rgba(71,231,255,.06)}
.row>h2::after{background:linear-gradient(90deg,var(--sig-cyan),var(--sig-violet),transparent)!important}
.row:nth-of-type(even)::before{content:"";position:absolute;left:-8vw;right:-8vw;top:0;bottom:0;background:linear-gradient(90deg,transparent,rgba(155,108,255,.022),transparent);pointer-events:none}

.card,.netflix-item-container{--mx:50%;--my:50%;position:relative;isolation:isolate;overflow:hidden}
.card::after,.netflix-item-container::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:4;background:radial-gradient(circle at var(--mx) var(--my),rgba(255,255,255,.22),transparent 34%);opacity:0;transition:opacity .25s ease}
.card:hover::after,.netflix-item-container:hover::after{opacity:1}
.card img,.netflix-num-poster{filter:saturate(.94) contrast(1.04)}
.card:hover img,.netflix-item-container:hover img{filter:saturate(1.16) contrast(1.06) brightness(1.05)}
.cf-card-mark{position:absolute;top:9px;left:9px;z-index:6;display:flex;align-items:center;gap:5px;padding:5px 8px;border-radius:999px;background:rgba(3,7,17,.72);border:1px solid rgba(255,255,255,.15);backdrop-filter:blur(12px);font-size:.62rem;font-weight:900;letter-spacing:.07em;text-transform:uppercase;color:#fff;box-shadow:0 8px 22px rgba(0,0,0,.25)}
.cf-card-mark i{color:var(--sig-cyan)}
.cf-card-pulse{position:absolute;right:10px;top:10px;z-index:6;width:8px;height:8px;border-radius:50%;background:#56ff9a;box-shadow:0 0 0 0 rgba(86,255,154,.6);animation:cfLivePulse 1.8s infinite}
@keyframes cfLivePulse{70%{box-shadow:0 0 0 8px rgba(86,255,154,0)}100%{box-shadow:0 0 0 0 rgba(86,255,154,0)}}
.view-all-card>div{background:linear-gradient(145deg,rgba(71,231,255,.13),rgba(155,108,255,.12))!important;border:1px dashed rgba(71,231,255,.35);font-weight:850;letter-spacing:.05em}

.search-input-wrapper::before{content:"DISCOVER";font-size:.65rem;letter-spacing:.16em;color:var(--sig-cyan);font-weight:900}
.modal-content::before{content:"CINEFLEX ORIGINAL EXPERIENCE";display:block;padding:8px 16px;text-align:center;font-size:.62rem;font-weight:900;letter-spacing:.18em;color:var(--sig-cyan);background:linear-gradient(90deg,transparent,rgba(71,231,255,.08),transparent);border-bottom:1px solid rgba(255,255,255,.07)}

@media(max-width:820px){
  .cf-cursor-glow{display:none}.banner{clip-path:polygon(0 0,100% 0,100% 96%,0 100%)}
  .hero-kicker::after{display:none}.cf-studio-panel{margin-top:-58px!important;grid-template-columns:1fr!important}
  .cf-discovery-dock{width:calc(100% - 28px);margin-bottom:35px;padding:10px}.cf-dock-label{position:sticky;left:0;background:rgba(7,11,24,.96);z-index:2;border-radius:12px;padding:10px}
  .row>h2::before{font-size:.58rem}.cf-card-mark{font-size:.55rem;padding:4px 7px}
}
@media(prefers-reduced-motion:reduce){.cf-card-pulse,.cf-ambient span{animation:none!important}.studio-card,.cf-dock-chip,.card img{transition:none!important}}
