/* Shabbat landing page (standalone). Palette + type from the approved design. */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{overflow-x:hidden}
body{margin:0;background:#FBFAF7;color:#14170F;font-family:Heebo,system-ui,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.4}
a{color:#D91E6B;text-decoration:none}
a:hover{color:#6228D7}
img{max-width:100%}
button{font-family:inherit}
summary{list-style:none;cursor:pointer}
summary::-webkit-details-marker{display:none}
details[open] .om-plus{transform:rotate(45deg)}
.om-scroll{scrollbar-width:none}
.om-scroll::-webkit-scrollbar{display:none}
input::placeholder{color:rgba(20,23,15,.42)}
::selection{background:#EE2A7B;color:#fff}
@keyframes om-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.72)}}
@keyframes om-shine{0%{transform:translateX(-120%)}60%,100%{transform:translateX(320%)}}
@keyframes om-spin{to{transform:rotate(360deg)}}

.page{background:#FBFAF7}
.wrap{max-width:1360px;margin:0 auto;padding:0 clamp(18px,4vw,56px)}
.grad-text{background:linear-gradient(115deg,#F9CE34 0%,#EE2A7B 48%,#6228D7 100%);-webkit-background-clip:text;background-clip:text;color:transparent;display:inline-block}
.grad-bg{background:linear-gradient(115deg,#F9CE34 0%,#EE2A7B 48%,#6228D7 100%)}
.num{font-family:Archivo,sans-serif;font-variant-numeric:tabular-nums}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* header */
.hdr{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:clamp(10px,1.6vw,15px) clamp(16px,4vw,56px);position:relative;z-index:5}
.hdr-brand{display:flex;align-items:center;gap:clamp(10px,1.6vw,18px)}
.hdr-brand picture,.final-in picture{display:block;line-height:0}
.hdr-logo{height:clamp(86px,10vw,124px);width:auto;display:block}
.logo-fallback{font-weight:900;font-size:clamp(22px,2.6vw,32px);letter-spacing:-.02em;line-height:1}
.hdr-div{width:1px;height:42px;background:rgba(20,23,15,.14)}
.hdr-of{display:flex;flex-direction:column;gap:4px}
.hdr-of small{font-size:10px;font-weight:500;color:rgba(20,23,15,.5);line-height:1}
.hdr-chip{display:flex;align-items:center;background:#14170F;border-radius:9px;padding:5px 9px}
.hdr-chip img{height:20px;width:auto;display:block}
.btn-outline{font-size:14px;font-weight:900;border:1px solid rgba(238,42,123,.38);border-radius:999px;padding:9px 18px;color:#D91E6B;transition:background .2s,color .2s}
.btn-outline:hover{background:#EE2A7B;color:#fff;border-color:#EE2A7B}
.btn-primary{font-size:19px;font-weight:900;color:#fff;background:#EE2A7B;border:none;border-radius:14px;padding:16px;cursor:pointer;transition:background .2s}
.btn-primary:hover{background:#D0195F}
.btn-primary[disabled]{opacity:.7;cursor:wait}

/* hero */
.hero{position:relative;padding:clamp(16px,3vw,40px) clamp(18px,4vw,56px) clamp(56px,7vw,96px)}
.glow{position:absolute;border-radius:50%;pointer-events:none}
.hero .glow{top:-140px;right:-120px;width:520px;height:520px;background:radial-gradient(circle,rgba(238,42,123,.30),transparent 68%)}
.hero-in{max-width:1360px;margin:0 auto;position:relative;display:flex;flex-direction:column;gap:clamp(24px,3.2vw,40px)}
.hero-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:clamp(28px,4vw,56px);align-items:center}
.kicker{font-size:clamp(13px,1.3vw,15px);font-weight:900;letter-spacing:.02em;line-height:1.5;margin-bottom:22px}
.h1{font-weight:900;font-size:clamp(40px,6.4vw,84px);line-height:.94;letter-spacing:-.035em;margin:0 0 26px}
.lead{font-size:clamp(16px,1.5vw,20px);line-height:1.6;font-weight:300;color:rgba(20,23,15,.72);max-width:42ch;margin:0;text-wrap:pretty}

/* main video card */
.video-wrap{position:relative}
.video-card{position:relative;border-radius:28px;overflow:hidden;background:#14170F;border:1px solid rgba(20,23,15,.1);aspect-ratio:16/9;margin-inline:auto;width:100%;cursor:pointer}
.video-card.vertical{aspect-ratio:9/16;max-width:min(330px,100%);border-radius:24px}
.video-card .poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.video-card .fill{position:absolute;inset:0}
.video-card .fill-grad{background:linear-gradient(155deg,#F9CE34 0%,#EE2A7B 46%,#833AB4 78%,#405DE6 100%)}
.video-card .fill-light{background:radial-gradient(105% 62% at 68% 14%,rgba(255,255,255,.45),transparent 60%),radial-gradient(95% 58% at 14% 92%,rgba(0,0,0,.34),transparent 60%)}
.video-card .fill-lines{opacity:.14;background:repeating-linear-gradient(28deg,rgba(255,255,255,.9) 0 1px,transparent 1px 8px)}
.video-card .fill-shade{background:linear-gradient(to top,rgba(20,23,15,.72),rgba(20,23,15,.05) 55%,rgba(20,23,15,.25))}
.video-card .top{position:absolute;top:18px;right:18px;left:18px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.chip{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.92);border-radius:999px;padding:6px 12px 6px 8px}
.chip .av{width:24px;height:24px;border-radius:50%;background:linear-gradient(115deg,#F9CE34,#EE2A7B 50%,#6228D7);color:#fff;font-size:10px;font-weight:900;display:flex;align-items:center;justify-content:center}
.chip b{font-size:12px;font-weight:700;color:#14170F}
.dur{font-family:Archivo,sans-serif;font-size:11px;font-weight:700;color:#fff;background:rgba(20,23,15,.4);border-radius:7px;padding:5px 9px}
.play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:78px;height:78px;border-radius:50%;background:rgba(255,255,255,.95);display:flex;align-items:center;justify-content:center;box-shadow:0 10px 34px -8px rgba(20,23,15,.5);transition:transform .2s}
.video-card:hover .play{transform:translate(-50%,-50%) scale(1.06)}
.play svg{margin-left:4px}
.video-card .cap{position:absolute;bottom:20px;right:20px;left:20px;display:flex;flex-direction:column;gap:8px}
.video-card .cap b{font-size:clamp(16px,1.5vw,20px);font-weight:700;line-height:1.25;color:#fff;text-shadow:0 1px 14px rgba(20,23,15,.45);text-wrap:pretty}
.video-card iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;background:#000}
.video-card:not(.has-player).playing .fill,.video-card:not(.has-player).playing .top,.video-card:not(.has-player).playing .play,.video-card:not(.has-player).playing .cap,.video-card:not(.has-player).playing .poster{display:none}
.video-card.has-player{cursor:default}

/* Video.js inside the hero card */
.video-card .video-js{position:absolute;inset:0;width:100%;height:100%;background:#14170F}
.video-card .video-js .vjs-tech{object-fit:cover}
.vc-overlay{position:absolute;inset:0;z-index:2;pointer-events:none;transition:opacity .4s ease}
.video-card.playing .vc-overlay{opacity:0}
.unmute-btn{position:absolute;z-index:3;bottom:54px;inset-inline-end:14px;display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.95);color:#14170F;border:0;border-radius:999px;padding:9px 15px;font-family:Heebo,sans-serif;font-size:13px;font-weight:900;cursor:pointer;box-shadow:0 6px 18px -6px rgba(20,23,15,.55);transition:opacity .25s ease,transform .25s ease,background .2s}
.unmute-btn:hover{background:#fff;transform:translateY(-1px)}
.unmute-btn.hide{opacity:0;pointer-events:none;transform:translateY(8px)}

/* Video.js skin tuned to the campaign palette */
.vjs-hdb .vjs-play-progress,.vjs-hdb .vjs-volume-level{background:#EE2A7B}
.vjs-hdb .vjs-play-progress:before{color:#EE2A7B}
.vjs-hdb .vjs-control-bar{background:linear-gradient(to top,rgba(20,23,15,.85),rgba(20,23,15,.25))}
.vjs-hdb .vjs-big-play-button{border-color:rgba(255,255,255,.85);background:rgba(20,23,15,.55);border-radius:50%;width:78px;height:78px;line-height:74px;margin:-39px 0 0 -39px}
.vjs-hdb:hover .vjs-big-play-button{background:#EE2A7B;border-color:#EE2A7B}
.vjs-hdb .vjs-slider{background:rgba(255,255,255,.28)}
.video-wrap:has(.video-card.vertical){display:flex;justify-content:center}
.video-badge{position:absolute;top:-18px;left:-8px;z-index:4;color:#fff;font-weight:900;font-size:14px;padding:11px 18px;border-radius:999px;transform:rotate(-3deg);box-shadow:0 8px 22px -10px rgba(238,42,123,.7)}
.video-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:18px}

/* join box */
.join{background:#fff;border:1px solid rgba(20,23,15,.1);border-radius:26px;padding:clamp(16px,2.2vw,26px);display:flex;gap:clamp(14px,2.4vw,30px);align-items:center;flex-wrap:wrap;scroll-margin-top:20px}
.join-stats{flex:1 1 300px;min-width:min(250px,100%);display:flex;flex-direction:column;gap:14px;position:relative;overflow:hidden;background:linear-gradient(150deg,rgba(249,206,52,.1),rgba(238,42,123,.1) 55%,rgba(98,40,215,.1));border:1px solid rgba(238,42,123,.22);border-radius:22px;padding:clamp(16px,1.9vw,22px)}
.shine{position:absolute;top:0;bottom:0;width:34%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.65),transparent);animation:om-shine 4.6s ease-in-out infinite;pointer-events:none}
.join-stats>*{position:relative}
.join-num-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.big-num{font-size:clamp(52px,7vw,86px);font-weight:900;line-height:1;letter-spacing:-.045em;padding-block:2px}
.live-pill{display:flex;align-items:center;gap:6px;background:#EE2A7B;color:#fff;font-size:12px;font-weight:900;border-radius:999px;padding:6px 11px;white-space:nowrap}
.live-pill i{width:7px;height:7px;border-radius:50%;background:#fff;animation:om-pulse 1.3s ease-in-out infinite}
.join-stats p{margin:0;font-size:14px;font-weight:400;line-height:1.5;color:rgba(20,23,15,.72);text-wrap:pretty}
.bar{height:11px;border-radius:999px;background:rgba(20,23,15,.09);overflow:hidden}
.bar>i{display:block;height:100%;border-radius:999px;transition:width .6s ease-out}
.bar-labels{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;font-weight:900;margin-top:7px}
.bar-labels .a{color:#D91E6B}
.bar-labels .b{color:rgba(20,23,15,.5)}
.join-form{flex:2 1 400px;min-width:min(270px,100%);display:flex;flex-direction:column;gap:14px}
.pledge{font-size:clamp(17px,1.6vw,20px);font-weight:700;line-height:1.3;text-wrap:pretty}
.pledge span{color:rgba(20,23,15,.5);font-weight:400}
.reg-form{display:flex;flex-wrap:wrap;gap:10px}
.reg-form input{flex:1 1 130px;min-width:110px;font-family:Heebo,sans-serif;font-size:16px;color:#14170F;background:#FBFAF7;border:1px solid rgba(20,23,15,.18);border-radius:14px;padding:15px 18px;outline:none;transition:border-color .2s}
.reg-form input:focus{border-color:#EE2A7B}
.reg-form .btn-primary{flex:1 1 100%}
.reg-form .hp{position:absolute;left:-9999px;top:-9999px;opacity:0;height:0;width:0}
.reg-err{font-size:14px;font-weight:700;color:#D0195F;flex:1 1 100%;display:none}
.reg-form.has-err .reg-err{display:block}
.reg-done{display:none;flex-direction:column;gap:6px}
.reg-done b{font-size:26px;font-weight:900;color:#D91E6B}
.reg-done span{font-size:15px;font-weight:300;color:rgba(20,23,15,.72)}
.done .reg-form{display:none}
.done .reg-done{display:flex}

/* benefits */
.benefits{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:clamp(16px,2.4vw,32px);padding:2px clamp(2px,.6vw,10px)}
.benefit{display:flex;align-items:flex-start;gap:11px;padding:2px 0}
.benefit .ic{flex:0 0 auto;width:40px;height:40px;border-radius:13px;display:flex;align-items:center;justify-content:center}
.benefit .ic.pink{background:rgba(238,42,123,.1);color:#EE2A7B}
.benefit .ic.purple{background:rgba(98,40,215,.1);color:#6228D7}
.benefit .ic.orange{background:rgba(247,119,55,.13);color:#F77737}
.benefit div{display:flex;flex-direction:column;gap:2px;min-width:0}
.benefit b{font-size:clamp(16px,1.5vw,18px);font-weight:900;line-height:1.25}
.benefit .pink+div b{color:#EE2A7B}
.benefit .purple+div b{color:#6228D7}
.benefit .orange+div b{color:#F77737}
.benefit span{font-size:clamp(14px,1.35vw,16px);font-weight:400;line-height:1.5;color:rgba(20,23,15,.7);text-wrap:pretty}

/* sections */
.sec{position:relative;padding:clamp(56px,8vw,110px) 0;border-top:1px solid rgba(20,23,15,.11)}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:clamp(28px,4vw,48px)}
.h2{font-weight:900;font-size:clamp(32px,5.4vw,68px);line-height:.98;letter-spacing:-.03em;margin:0}
.h2.md{font-size:clamp(30px,5vw,60px);line-height:1}
.nav-btns{display:flex;gap:10px;padding-bottom:6px}
.nav-btns button{width:48px;height:48px;border-radius:50%;background:#fff;border:1px solid rgba(20,23,15,.14);color:#14170F;font-size:22px;font-weight:300;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:background .2s,color .2s}
.nav-btns button:hover{background:#EE2A7B;color:#fff;border-color:#EE2A7B}
.nav-btns button.swiper-button-disabled{opacity:.35;cursor:default}
.nav-btns button.swiper-button-disabled:hover{background:#fff;color:#14170F;border-color:rgba(20,23,15,.14)}
.row-swiper.swiper{padding:12px clamp(18px,4vw,56px) 26px;cursor:grab}
.row-swiper.swiper:active{cursor:grabbing}
.row-swiper .swiper-wrapper{align-items:stretch}
.row-swiper .swiper-slide{height:auto}

/* reasons */
.rcard{width:clamp(272px,26vw,336px);flex:0 0 clamp(272px,26vw,336px);border-radius:26px;padding:24px 24px 28px;display:flex;flex-direction:column;gap:14px;position:relative;overflow:hidden;color:#fff;transition:transform .25s ease,box-shadow .25s ease}
.rcard:hover{transform:translateY(-7px)}
.rcard .n{position:absolute;bottom:-30px;left:-4px;font-family:Archivo,sans-serif;font-size:140px;font-weight:900;line-height:1;letter-spacing:-.07em;color:rgba(255,255,255,.17);pointer-events:none}
.rcard .lt{position:absolute;inset:0;background:radial-gradient(90% 55% at 78% 8%,rgba(255,255,255,.3),transparent 60%);pointer-events:none}
.rcard .ic{position:relative;width:50px;height:50px;border-radius:16px;background:rgba(255,255,255,.24);border:1px solid rgba(255,255,255,.34);display:flex;align-items:center;justify-content:center;color:#fff}
.rcard b{position:relative;font-size:23px;font-weight:900;line-height:1.18;letter-spacing:-.025em;text-wrap:pretty}
.rcard p{position:relative;margin:0;font-size:15px;font-weight:400;line-height:1.6;color:rgba(255,255,255,.9);text-wrap:pretty}
.rcard.c1{background:linear-gradient(152deg,#405DE6,#5B51D8);box-shadow:0 16px 38px -18px rgba(64,93,230,.5)}
.rcard.c2{background:linear-gradient(152deg,#6228D7,#833AB4);box-shadow:0 16px 38px -18px rgba(98,40,215,.5)}
.rcard.c3{background:linear-gradient(152deg,#833AB4,#C13584);box-shadow:0 16px 38px -18px rgba(131,58,180,.5)}
.rcard.c4{background:linear-gradient(152deg,#C13584,#EE2A7B);box-shadow:0 16px 38px -18px rgba(193,53,132,.5)}
.rcard.c5{background:linear-gradient(152deg,#EE2A7B,#F77737);box-shadow:0 16px 38px -18px rgba(238,42,123,.5)}
.rcard.c6{background:linear-gradient(152deg,#F77737,#F9CE34);box-shadow:0 16px 38px -18px rgba(247,119,55,.55);color:#14170F}
.rcard.c6 .n{color:rgba(20,23,15,.14)}
.rcard.c6 .ic{background:rgba(20,23,15,.14);border:0;color:#14170F}
.rcard.c6 p{color:rgba(20,23,15,.76)}
.rcard.c6 .go{position:relative;margin-top:auto;align-self:flex-start;display:flex;align-items:center;gap:8px;background:#14170F;color:#fff;font-size:15px;font-weight:900;border-radius:999px;padding:11px 18px}
.rcard:hover{box-shadow:0 30px 56px -20px rgba(20,23,15,.35)}

/* guide */
.guide-in{max-width:900px;margin:0 auto;padding:0 clamp(18px,4vw,56px)}
.guide-in .h2{margin:0 0 14px}
.sub{font-size:clamp(16px,1.5vw,19px);font-weight:300;color:rgba(20,23,15,.68);margin:0 0 clamp(28px,4vw,44px)}
.prep{display:flex;align-items:center;gap:16px;flex-wrap:wrap;background:#fff;border:1px solid rgba(20,23,15,.1);border-radius:18px;padding:14px 18px;margin-bottom:14px}
.prep .lbl{font-size:15px;font-weight:900;color:#D91E6B}
.prep .bar{flex:1 1 140px;height:9px;min-width:110px}
.prep .bar>i{transition:width .35s ease}
.prep .cnt{font-size:13px;font-weight:900;color:#14170F;white-space:nowrap}
.steps{display:flex;flex-direction:column;gap:8px;margin-bottom:44px}
.step{border-radius:18px;padding:0 clamp(13px,1.8vw,18px);transition:background .2s;border:1px solid}
.step summary{display:flex;align-items:center;gap:clamp(9px,1.5vw,14px);padding:15px 0}
.step .chk{flex:0 0 auto;width:clamp(26px,3vw,30px);height:clamp(26px,3vw,30px);border-radius:50%;border:2px solid;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,color .2s}
.step .chk svg{display:none}
.step.done .chk svg,.step .chk:hover svg{display:block}
.step .ic{flex:0 0 auto;width:clamp(32px,3.8vw,38px);height:clamp(32px,3.8vw,38px);border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center}
.step .tt{display:flex;flex-direction:column;gap:1px;flex:1 1 auto;min-width:0}
.step .tt small{font-size:11px;font-weight:700}
.step .tt b{font-size:clamp(16px,1.6vw,20px);font-weight:900;letter-spacing:-.02em}
.om-plus{flex:0 0 auto;width:clamp(26px,3vw,30px);height:clamp(26px,3vw,30px);border-radius:50%;color:#fff;font-weight:300;font-size:21px;line-height:1;display:flex;align-items:center;justify-content:center;transition:transform .2s}
.step ul,.law ul{margin:0;padding:0 clamp(18px,2.2vw,24px) 24px 0;display:flex;flex-direction:column;gap:11px;font-size:clamp(16px,1.45vw,17px);font-weight:400;line-height:1.75;color:rgba(20,23,15,.9)}
.step .ps,.law .ps{padding:0 0 24px;display:flex;flex-direction:column;gap:13px;font-size:clamp(16px,1.45vw,17px);font-weight:400;line-height:1.75;color:rgba(20,23,15,.9)}
.step li::marker,.law li::marker{color:var(--c)}
.step .ps p,.law .ps p{margin:0}
.s1{--c:#405DE6;background:rgba(64,93,230,.07);border-color:rgba(64,93,230,.22)}
.s2{--c:#5B51D8;background:rgba(91,81,216,.07);border-color:rgba(91,81,216,.22)}
.s3{--c:#6228D7;background:rgba(98,40,215,.07);border-color:rgba(98,40,215,.22)}
.s4{--c:#833AB4;background:rgba(131,58,180,.07);border-color:rgba(131,58,180,.22)}
.s5{--c:#C13584;background:rgba(193,53,132,.07);border-color:rgba(193,53,132,.22)}
.s6{--c:#EE2A7B;background:rgba(238,42,123,.07);border-color:rgba(238,42,123,.22)}
.l1{--c:#EE2A7B;background:rgba(238,42,123,.07);border-color:rgba(238,42,123,.22)}
.l2{--c:#F77737;background:rgba(247,119,55,.08);border-color:rgba(247,119,55,.25)}
.l3{--c:#C13584;background:rgba(193,53,132,.07);border-color:rgba(193,53,132,.22)}
.l4{--c:#6228D7;background:rgba(98,40,215,.07);border-color:rgba(98,40,215,.22)}
.l5{--c:#EE2A7B;background:linear-gradient(135deg,rgba(249,206,52,.16),rgba(238,42,123,.14) 55%,rgba(98,40,215,.14));border-color:rgba(238,42,123,.32)}
.step .chk{border-color:var(--c);color:var(--c)}
.step .chk:hover,.step.done .chk{background:var(--c);color:#fff}
.step .ic,.law .ic{color:var(--c);box-shadow:0 2px 8px -3px var(--c)}
.step .tt small{color:var(--c)}
.step .om-plus,.law .om-plus{background:var(--c)}
/* the .law .ic white-background rule sits further down, so keep this one more specific */
.law.l5 .ic,.law.l5 .om-plus{background:linear-gradient(115deg,#F9CE34,#EE2A7B 50%,#6228D7);color:#fff;box-shadow:none}
.l5 summary b{color:#B01655}
.magic{background:#fff;border:1px solid rgba(238,42,123,.30);border-radius:24px;padding:clamp(24px,3vw,36px);margin-bottom:52px}
.magic-in{display:flex;gap:clamp(18px,2.4vw,28px);align-items:stretch;flex-wrap:wrap-reverse}
.magic-txt{flex:1 1 300px;min-width:min(260px,100%)}
.magic-txt .t{font-size:clamp(22px,2.6vw,32px);font-weight:900;letter-spacing:-.02em;margin-bottom:14px}
.magic-txt p{margin:0;font-size:clamp(16px,1.5vw,18px);font-weight:400;line-height:1.7;color:rgba(20,23,15,.88);text-wrap:pretty}
.magic-art{flex:0 1 240px;min-width:min(200px,100%);border-radius:18px;overflow:hidden;position:relative;background:linear-gradient(155deg,#F9CE34,#EE2A7B 60%,#833AB4);min-height:200px}
.magic-art .fill{position:absolute;inset:0;background:radial-gradient(70% 45% at 50% 18%,rgba(255,255,255,.6),transparent 62%),radial-gradient(90% 55% at 20% 92%,rgba(0,0,0,.3),transparent 60%)}
.magic-art svg{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:rgba(255,255,255,.85)}
.howto-lbl{font-size:15px;font-weight:900;color:#D91E6B;margin-bottom:14px}
.howto-intro{font-size:clamp(16px,1.45vw,17px);font-weight:400;line-height:1.7;color:rgba(20,23,15,.82);margin:0 0 18px}
.laws{display:flex;flex-direction:column;gap:8px}
.law{border-radius:18px;padding:0 clamp(13px,1.8vw,18px);border:1px solid}
.law summary{display:flex;align-items:center;gap:clamp(9px,1.5vw,14px);padding:15px 0}
.law .ic{flex:0 0 auto;width:clamp(32px,3.8vw,38px);height:clamp(32px,3.8vw,38px);border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center}
.law summary b{flex:1 1 auto;min-width:0;font-size:clamp(16px,1.6vw,20px);font-weight:900;letter-spacing:-.02em}
.law ul strong{font-weight:700}
.disclaimer{font-size:14px;font-weight:400;line-height:1.65;color:rgba(20,23,15,.62);margin:20px 0 0}

/* clips */
.clip{width:clamp(228px,21vw,286px);flex:0 0 clamp(228px,21vw,286px);aspect-ratio:9/16;border-radius:24px;overflow:hidden;position:relative;background:#14170F;cursor:pointer;display:flex;flex-direction:column;justify-content:flex-end;box-shadow:0 16px 40px -18px rgba(20,23,15,.5);transition:transform .25s ease,box-shadow .25s ease;border:0;padding:0;text-align:right;color:#fff;font-family:inherit}
.clip:hover{transform:translateY(-7px) scale(1.015);box-shadow:0 32px 60px -20px rgba(20,23,15,.55)}
.clip .poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.clip .fill{position:absolute;inset:0}
.clip .fill-grad{background:linear-gradient(150deg,#6228D7,#C13584 55%,#F77737)}
.clip.g2 .fill-grad{background:linear-gradient(150deg,#EE2A7B,#F9CE34)}
.clip.g3 .fill-grad{background:linear-gradient(150deg,#405DE6,#6228D7 60%,#EE2A7B)}
.clip.g4 .fill-grad{background:linear-gradient(150deg,#F77737,#EE2A7B 70%,#833AB4)}
.clip.g5 .fill-grad{background:linear-gradient(150deg,#833AB4,#405DE6)}
.clip .fill-light{background:radial-gradient(120% 70% at 70% 12%,rgba(255,255,255,.42),transparent 62%),radial-gradient(90% 60% at 12% 88%,rgba(0,0,0,.4),transparent 60%)}
.clip .fill-shade{background:linear-gradient(to top,rgba(20,23,15,.78),rgba(20,23,15,.05) 55%,rgba(20,23,15,.3))}
.clip .top{position:absolute;top:0;right:0;left:0;display:flex;align-items:center;justify-content:space-between;padding:14px}
.clip .chip{gap:7px;padding:5px 11px 5px 6px}
.clip .chip .av{width:22px;height:22px;font-size:9px}
.clip .chip b{font-size:11px}
.clip .dur{font-size:10px;border-radius:6px;padding:4px 7px;background:rgba(20,23,15,.45)}
.clip .play{width:62px;height:62px;box-shadow:0 0 0 10px rgba(255,255,255,.22),0 8px 24px -8px rgba(20,23,15,.5)}
.clip .play svg{margin-left:3px}
.clip .cap{position:relative;padding:16px;display:flex;flex-direction:column;gap:10px}
.clip .tag{align-self:flex-start;font-size:10px;font-weight:900;color:#14170F;background:#fff;border-radius:999px;padding:4px 10px}
.clip .ttl{font-size:16px;font-weight:800;line-height:1.25;color:#fff;text-wrap:pretty;text-shadow:0 1px 12px rgba(20,23,15,.45)}
.clip-more{width:clamp(160px,15vw,196px);flex:0 0 clamp(160px,15vw,196px);aspect-ratio:9/16;border-radius:24px;position:relative;overflow:hidden;background:#fff;border:2px dashed rgba(238,42,123,.4);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;color:#D91E6B;transition:transform .25s ease,border-color .25s}
.clip-more:hover{transform:translateY(-7px);border-color:#EE2A7B;color:#D91E6B}
.clip-more .arr{width:52px;height:52px;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:900}
.clip-more b{font-size:15px;font-weight:900;text-align:center;line-height:1.3;padding:0 14px}

/* final */
.final{position:relative;padding:clamp(64px,9vw,124px) clamp(18px,4vw,56px);border-top:1px solid rgba(20,23,15,.11);overflow:hidden}
.final .glow{top:50%;left:50%;transform:translate(-50%,-50%);width:760px;height:760px;background:radial-gradient(circle,rgba(238,42,123,.5),transparent 66%)}
.final-in{max-width:1000px;margin:0 auto;position:relative;text-align:center}
.final-logo{height:clamp(180px,21vw,290px);width:auto;display:block;margin:0 auto clamp(18px,2.2vw,30px)}
.final .h2{margin:0 0 20px;text-wrap:balance;font-size:clamp(30px,5.4vw,68px);letter-spacing:-.035em}
.final .lead{font-size:clamp(17px,1.8vw,22px);line-height:1.55;margin:0 auto clamp(32px,4vw,48px);max-width:36ch}
.final-count{display:flex;align-items:baseline;justify-content:center;gap:12px;flex-wrap:wrap;margin:0 auto clamp(26px,3.2vw,38px)}
.final-count .big-num{font-size:clamp(48px,6.4vw,78px)}
.final-count .lbl{font-size:clamp(16px,1.6vw,19px);font-weight:400;color:rgba(20,23,15,.68)}
.final-box{background:#fff;border:1px solid rgba(20,23,15,.12);border-radius:26px;padding:clamp(22px,2.6vw,32px);max-width:600px;margin:0 auto;text-align:right}
.final-box .pledge{font-size:clamp(17px,1.7vw,21px);line-height:1.35;margin-bottom:20px}
.final-box .reg-form{flex-direction:column;flex-wrap:nowrap}
.final-box .reg-form .two{display:flex;gap:10px;flex-wrap:wrap}
.final-box .reg-form .two input{flex:1 1 150px}
.final-box .btn-primary{margin-top:4px;padding:17px}
.final-note{font-size:clamp(15px,1.5vw,18px);font-weight:400;color:rgba(20,23,15,.66);margin:26px auto 0;max-width:34ch;text-wrap:pretty}

/* sticky bar */
.sticky{position:fixed;bottom:0;right:0;left:0;z-index:40;padding:12px clamp(14px,3vw,24px);background:rgba(251,250,247,.9);backdrop-filter:blur(14px);border-top:1px solid rgba(20,23,15,.1);display:flex;align-items:center;justify-content:space-between;gap:14px}
.sticky .t{font-size:clamp(13px,1.4vw,14px);font-weight:700;line-height:1.25;min-width:0}
.sticky .t span{font-weight:300;color:rgba(20,23,15,.66);font-size:13px}
.sticky a{font-size:15px;font-weight:900;color:#fff;background:#EE2A7B;border-radius:12px;padding:12px clamp(16px,2.4vw,22px);white-space:nowrap;flex:0 0 auto}
.sticky a:hover{background:#D0195F;color:#fff}
.spacer{height:76px}

/* player modal */
.modal{position:fixed;inset:0;z-index:100;background:rgba(20,23,15,.86);display:none;align-items:center;justify-content:center;padding:16px}
.modal.open{display:flex}
.modal-box{position:relative;width:min(92vw,960px);aspect-ratio:16/9;max-height:88vh;background:#000;border-radius:18px;overflow:hidden;box-shadow:0 30px 80px -20px rgba(0,0,0,.7)}
.modal-box.vertical{width:auto;height:88vh;aspect-ratio:9/16;max-width:92vw}
.modal-box iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.modal-box .video-js{position:absolute;inset:0;width:100%;height:100%;background:#000}
.modal-box .video-js .vjs-tech{object-fit:contain}
.modal-close{position:absolute;top:14px;left:14px;z-index:2;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.92);border:0;cursor:pointer;font-size:22px;line-height:1;color:#14170F}
.modal-title{position:fixed;bottom:20px;left:0;right:0;text-align:center;color:#fff;font-weight:700;font-size:16px;text-shadow:0 1px 10px rgba(0,0,0,.6);pointer-events:none}

@media (max-width:640px){
  .hdr-of{display:none}
  .video-badge{left:6px;top:-14px}
  .rcard .n{font-size:110px}
  .modal-box{width:96vw}
}
@media (prefers-reduced-motion:reduce){
  .shine,.live-pill i{animation:none}
  html{scroll-behavior:auto}
}