/* CCF cinematic layer: shared by about, programs, blog, posts */
h1,h2,h3{font-synthesis:none;overflow-wrap:normal;word-break:normal;-webkit-hyphens:none;hyphens:none}
.phero{background:#000}
.phero .cbg{position:absolute;inset:0;z-index:-2;background:#000 url(/assets/hero-chart.webp) 70% 55%/cover no-repeat;opacity:.9;animation:cpan 34s ease-in-out infinite alternate;will-change:transform}
.phero .cbg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.94) 0,rgba(0,0,0,.78) 38%,rgba(0,0,0,.25) 75%,rgba(0,0,0,.35)),linear-gradient(180deg,rgba(0,0,0,.55),transparent 30%,transparent 70%,#030303)}
@keyframes cpan{from{transform:scale(1.04) translate3d(0,0,0)}to{transform:scale(1.1) translate3d(-1.5%,-1%,0)}}
@media(max-width:760px){.phero .cbg{background-image:url(/assets/hero-chart-m.webp);background-position:72% 100%}.phero .cbg:after{background:linear-gradient(180deg,rgba(0,0,0,.6),rgba(0,0,0,.72) 45%,rgba(0,0,0,.9) 75%,#030303)}}
.csd{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.csd i{position:absolute;bottom:-6px;width:var(--s);height:var(--s);border-radius:50%;background:#f0cc78;box-shadow:0 0 8px 2px rgba(240,204,120,.5);opacity:0;animation:csdu var(--d) linear var(--w) infinite}
@keyframes csdu{0%{transform:translate3d(0,0,0);opacity:0}15%{opacity:.55}80%{opacity:.3}100%{transform:translate3d(12px,-70vh,0);opacity:0}}
/* gold shimmer display headings, same font as homepage */
.phero h1 span,.sec h2 span,.cjoin h2 span{color:#f0cc78;background:linear-gradient(100deg,#f3d58a 0 38%,#fff6dc 48%,#b8893a 56%,#f3d58a 66% 100%) 0 0/250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:cshim 7s ease-in-out infinite}
@keyframes cshim{0%,55%{background-position:100% 0}100%{background-position:-50% 0}}
.kick,.mk{color:#d9b866}
/* ambient haze */
.camb{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.camb:before,.camb:after{content:"";position:absolute;width:60vw;height:60vw;max-width:900px;max-height:900px;border-radius:50%;filter:blur(40px)}
.camb:before{left:-15vw;top:5%;background:radial-gradient(closest-side,rgba(40,190,170,.09),transparent);animation:cambA 26s ease-in-out infinite alternate}
.camb:after{right:-15vw;bottom:0;background:radial-gradient(closest-side,rgba(130,80,220,.08),rgba(232,196,110,.04) 50%,transparent);animation:cambB 32s ease-in-out infinite alternate}
@keyframes cambA{to{transform:translate3d(12vw,8vh,0)}}@keyframes cambB{to{transform:translate3d(-10vw,-10vh,0)}}
.chz{position:relative;isolation:isolate}
/* glass cards with gold edge */
.pc,.bcard,.abf,.kitbox,.abox,.optf,.skok{position:relative;background:linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.01) 40%),linear-gradient(180deg,#111113,#070708)!important;box-shadow:0 0 0 1px rgba(212,175,90,.22),0 50px 100px -40px #000,0 0 60px -24px rgba(232,196,110,.16)!important;transition:box-shadow .5s,transform .5s!important}
.pc:hover,.bcard:hover{box-shadow:0 0 0 1px rgba(232,196,110,.55),0 50px 100px -40px #000,0 0 80px -10px rgba(232,196,110,.26)!important;transform:translateY(-4px)}
.pc.vip{box-shadow:0 0 0 1px rgba(232,196,110,.45),0 60px 120px -40px #000,0 0 90px -20px rgba(232,196,110,.25)!important}
.abf{padding:clamp(20px,3vw,36px);border-radius:2px}
.bcard{overflow:hidden}
/* cinematic closing CTA */
.pcta,.nl,.cjoin{position:relative;isolation:isolate;overflow:hidden}
.pcta .cbg2,.nl .cbg2,.cjoin .cbg2{position:absolute;inset:0;z-index:-2;background:#000 url(/assets/hero-chart.webp) 70% 60%/cover no-repeat;animation:cpan 30s ease-in-out infinite alternate}
.pcta .cbg2:after,.nl .cbg2:after,.cjoin .cbg2:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 60% 60% at 50% 50%,rgba(0,0,0,.9),rgba(0,0,0,.66) 60%,rgba(0,0,0,.3)),linear-gradient(#000,transparent 25%,transparent 80%,#000)}
@media(max-width:760px){.pcta .cbg2,.nl .cbg2,.cjoin .cbg2{background-image:url(/assets/hero-chart-m.webp);background-position:72% 100%}.pcta .cbg2:after,.nl .cbg2:after,.cjoin .cbg2:after{background:radial-gradient(ellipse 90% 45% at 50% 50%,rgba(0,0,0,.92),rgba(0,0,0,.62) 60%,rgba(0,0,0,.25)),linear-gradient(#000,transparent 20%,transparent 85%,#000)}}
.pcta{padding:clamp(48px,7vw,96px) clamp(20px,4vw,56px)!important;box-shadow:0 0 0 1px rgba(212,175,90,.25)}
.cjoin{min-height:80svh;display:flex;align-items:center;text-align:center;padding:110px 0}
.cjoin h2{font-size:clamp(56px,11vw,170px)}
.cjoin p{color:#cfd3d7;font-size:19px;max-width:46ch;margin:28px auto 0}
.cjoin .ctas{justify-content:center;margin-top:36px}
.cjoin .jl{margin:0 auto 26px;width:clamp(120px,16vw,200px);height:auto}
/* reveals */
html.cjs .crv{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
html.cjs .crv.cin{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.phero .cbg,.csd i,.camb:before,.camb:after,.phero h1 span,.sec h2 span,.cjoin h2 span,.cbg2{animation:none!important}.csd{display:none}html.cjs .crv{opacity:1;transform:none;transition:none}.pc:hover,.bcard:hover{transform:none}}

.skc img{box-shadow:0 0 0 1px rgba(212,175,90,.3),0 40px 90px -30px rgba(232,196,110,.25)}html.cjs .optf,html.cjs .skok{opacity:1!important;transform:none!important}
