/* Copy of the main site's reels.css, adapted to this page's dark palette */
.rls{--blue:var(--coral);--ink-2:var(--ink2);--rule-soft:var(--rule);--red:#d81e1e;--sans:"Archivo",system-ui,sans-serif;--serif:"Newsreader",Georgia,serif;padding:clamp(56px,8vw,96px) 0}
.rls .w{padding-inline:clamp(20px,5vw,48px)}
.rls .kicker{display:block;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--coral);margin-bottom:14px}
.rls .sec-title{font-family:var(--serif);font-weight:400;font-size:clamp(34px,5vw,56px);line-height:1.05;margin:0}
.rls .sec-hl{background:none;color:var(--coral);font-style:italic}
.rls-nav button{background:transparent!important;color:var(--ink)!important}.rls-nav button:hover{background:var(--ink)!important;color:var(--bg)!important}
.rls-cta{width:auto;margin:0;text-decoration:none}.rls-cta:hover,.rls-cta:focus,.rls-cta:visited{color:var(--bg)}
@media (max-width:560px){.rls-rail{padding-inline:20px;scroll-padding-inline:20px}.rl-card,.rl-wrap{flex-basis:min(62vw,230px)}.rl-views{font-size:38px}.rls-total strong{font-size:56px}.rls-foot p{font-size:19px}.rls-cta{width:100%}}
/* Reels & Social (#reels) */
.rls{position:relative;overflow:clip}
.rls-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:24px 48px}
.rls-head .sec-title{margin-bottom:0}
.rls-total{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding-bottom:8px}
.rls-total strong{font-family:var(--sans);font-weight:700;font-size:clamp(56px,7vw,104px);line-height:.9;letter-spacing:-.04em;color:var(--blue);unicode-bidi:isolate;font-variant-numeric:tabular-nums}
.rls-total span{font-family:var(--sans);font-size:15px;color:var(--ink-2)}
.rls-rail{--g:clamp(20px,5vw,72px);display:flex;gap:18px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:max(var(--g),calc((100% - 1280px)/2 + var(--g)));padding:clamp(32px,4vw,48px) max(var(--g),calc((100% - 1280px)/2 + var(--g))) 28px;scrollbar-width:none}
.rls-rail::-webkit-scrollbar{display:none}
.rls-rail:focus{outline:none}
.rls-foot{display:flex;align-items:center;justify-content:space-between;gap:20px 32px;flex-wrap:wrap}
.rls-foot p{margin:0;font-family:var(--serif);font-size:clamp(20px,2vw,26px);line-height:1.3;color:var(--ink);text-wrap:pretty}
.rls-act{display:flex;align-items:center;gap:14px}
.rls-nav{display:flex;gap:8px}
.rls-nav button{width:46px;height:46px;border-radius:50%;border:1px solid var(--rule-soft);background:#fff;color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:background .2s,color .2s,border-color .2s,opacity .2s}
.rls-nav button:hover:not(:disabled){background:var(--ink);color:#fff;border-color:var(--ink)}
.rls-nav button:disabled{opacity:.35;cursor:default}
@media (max-width:760px){.rls-head{grid-template-columns:1fr;align-items:start}.rls-total{padding-bottom:0}.rls-nav{display:none}.rls-foot{flex-direction:column;align-items:flex-start}}

.rl-card{--rad:22px;position:relative;flex:0 0 clamp(214px,19vw,252px);aspect-ratio:9/16;border-radius:var(--rad);overflow:hidden;isolation:isolate;scroll-snap-align:start;background:#0b0d3a;color:#fff;font-family:var(--sans);box-shadow:0 24px 44px -26px rgba(20,22,60,.55),0 0 0 1px rgba(20,22,60,.06);transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .45s;outline:none}
.rl-card:hover,.rl-card:focus-visible{transform:translateY(-6px);box-shadow:0 34px 60px -26px rgba(216,30,30,.45),0 0 0 1px rgba(20,22,60,.06)}
.rl-card:focus-visible{box-shadow:0 0 0 3px var(--red)}
.rl-sc{position:absolute;inset:0;z-index:-2}
.rl-sc svg{width:100%;height:100%;display:block}
.rl-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(rgba(0,0,0,.42),transparent 18%,transparent 50%,rgba(4,5,20,.74) 70%,rgba(4,5,20,.94))}
.rl-top{display:flex;justify-content:space-between;align-items:center;gap:6px;padding:12px 12px 0;font-size:11px;font-weight:700}
.rl-pf{display:inline-flex;align-items:center;gap:5px;background:rgba(0,0,0,.45);padding:4px 9px;border-radius:999px;white-space:nowrap}
.rl-pf i{width:8px;height:8px;border-radius:50%}
.rl-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 9px 2px 8px;border-radius:999px;background:rgba(255,255,255,.94);box-shadow:0 1px 6px rgba(0,0,0,.25)}
.rl-badge small{font-size:8.5px;font-weight:700;color:#3a3a46}
.rl-badge img{height:20px;width:auto;display:block}
.rl-illu{position:absolute;bottom:14px;inset-inline-end:14px;z-index:1;font-size:10px;font-weight:600;opacity:.6}
.rl-subs{position:absolute;top:54%;left:0;right:0;display:flex;justify-content:center;gap:4px;flex-wrap:wrap;padding:0 22px}
.rl-subs span{height:13px;border-radius:4px;background:rgba(255,255,255,.92);box-shadow:0 2px 8px rgba(0,0,0,.3);opacity:0}
.rl-subs span:nth-child(2n){background:#ffd23f}
.rl-bot{position:absolute;left:0;right:0;bottom:0;padding:0 14px 16px}
.rl-tag{display:inline-block;font-size:10px;font-weight:700;background:var(--red);padding:3px 7px;border-radius:4px;margin-bottom:6px}
.rl-up{font-size:11.5px;font-weight:700;color:#7dffb0;margin-bottom:2px}
.rl-up b{unicode-bidi:isolate}
.rl-views{display:block;font-weight:700;font-size:clamp(40px,3.6vw,50px);letter-spacing:-.03em;line-height:.95;unicode-bidi:isolate;text-shadow:0 4px 24px rgba(216,30,30,.55)}
html[dir=rtl] .rl-views{text-align:right}
.rl-views.nr{font-size:17px;letter-spacing:0;opacity:.85}
.rl-vlabel{font-size:11.5px;font-weight:600;opacity:.9;margin-top:5px}
.rl-ap{background:rgba(255,255,255,.2);padding:1px 5px;border-radius:4px;margin-inline-start:4px}
.rl-eng{display:flex;gap:6px;margin-top:10px}
.rl-eng>span{display:inline-flex;align-items:center;gap:4px;background:rgba(255,255,255,.14);border-radius:999px;padding:4px 9px;font-size:12px;font-weight:700;line-height:1}
.rl-eng em{font-style:normal;font-size:12px}
.rl-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.rl-also{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}
.rl-also>span{font-size:10.5px;font-weight:700;border:1px solid rgba(255,255,255,.3);border-radius:999px;padding:3px 7px;white-space:nowrap}
.rl-also b{unicode-bidi:isolate}.rl-also .rl-sep{font-style:normal;padding:0 3px}
.rl-hearts{position:absolute;bottom:64px;inset-inline-end:16px;width:40px;height:220px;pointer-events:none}
.rl-hearts i{position:absolute;bottom:0;left:var(--x);font-style:normal;font-size:var(--s);opacity:0}

/* scene motion: only while the section is on screen */
.rls .rl-sc *{animation-play-state:paused}
.rls.live .rl-sc *{animation-play-state:running}
.rl-sc .rs-bob{animation:rsBob 2.6s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%}
.rl-sc .rs-nod{animation:rsNod 1.9s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 90%}
.rl-sc .rs-arm{animation:rsArm 1.7s ease-in-out infinite;transform-box:fill-box;transform-origin:100% 100%}
.rl-sc .rs-crowd{animation:rsCrowd 3.2s ease-in-out infinite}
.rl-sc .rs-ring{animation:rsRing 1.6s ease-out infinite;transform-box:fill-box;transform-origin:center;opacity:0}
.rl-sc .rs-r2{animation-delay:.55s}.rl-sc .rs-r3{animation-delay:1.1s}
.rl-sc .rs-blink{animation:rsBlink 1.2s ease-in-out infinite}
.rl-sc .rs-tw{animation:rsTw 2.2s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
.rl-sc .rs-tw:nth-of-type(2n){animation-delay:-.7s}.rl-sc .rs-tw:nth-of-type(3n){animation-delay:-1.4s}
.rl-sc .rs-ph{animation:rsPh 6s linear infinite}
.rl-sc .rs-glow{animation:rsGlow 3s ease-in-out infinite}
.rl-sc .rs-eq{animation:rsEq .9s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%}
.rl-sc .rs-eq:nth-of-type(2n){animation-delay:-.3s}.rl-sc .rs-eq:nth-of-type(3n){animation-delay:-.6s}
.rl-card:hover .rl-subs span,.rl-card:focus-visible .rl-subs span{animation:rsSub 3s cubic-bezier(.16,1,.3,1) infinite;animation-delay:calc(var(--k)*140ms)}
.rl-card:hover .rl-hearts i,.rl-card:focus-visible .rl-hearts i{animation:rsRise 2.2s ease-out 2;animation-delay:calc(var(--k)*170ms + 120ms)}
@keyframes rsBob{50%{transform:translateY(-2.5px)}}
@keyframes rsNod{30%{transform:rotate(-3deg)}70%{transform:rotate(2deg)}}
@keyframes rsArm{50%{transform:rotate(-14deg)}}
@keyframes rsCrowd{50%{transform:translateY(1.5px)}}
@keyframes rsRing{0%{opacity:.8;transform:scale(.4)}100%{opacity:0;transform:scale(1.6)}}
@keyframes rsBlink{50%{opacity:.25}}
@keyframes rsTw{50%{opacity:.2;transform:scale(.6)}}
@keyframes rsPh{from{transform:translateX(0)}to{transform:translateX(140px)}}
@keyframes rsGlow{50%{opacity:.55}}
@keyframes rsEq{50%{transform:scaleY(.35)}}
@keyframes rsSub{0%{opacity:0;transform:translateY(6px) scale(.8)}12%,78%{opacity:1;transform:none}92%,100%{opacity:0}}
@keyframes rsRise{0%{opacity:0;transform:translate(0,0) scale(.5)}15%{opacity:1}100%{opacity:0;transform:translate(var(--dx),-210px) scale(1.15)}}
@media (prefers-reduced-motion:reduce){.rls *,.rls *::before,.rls *::after{animation:none!important;transition:none!important}.rl-subs span{opacity:1}.rl-hearts{display:none}.rls-rail{scroll-behavior:auto}}

.rls-rail{scroll-snap-type:none}
.rl-wrap{--f:1;flex:0 0 clamp(214px,19vw,252px);transform:scale(calc(.86 + .14 * var(--f)));opacity:calc(.55 + .45 * var(--f));transition:opacity .2s;perspective:900px}
.rl-wrap .rl-card{width:100%;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .3s}
.rl-wrap .rl-card:hover{transform:translateY(-8px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))}
.rls-rail{cursor:grab;user-select:none}.rls-rail.drag{cursor:grabbing}.rls-rail.drag .rl-card{transition:none}
.rls-rail img{-webkit-user-drag:none}
@media (hover:none){.rl-wrap{transform:scale(calc(.9 + .1 * var(--f)))}}
@media (prefers-reduced-motion:reduce){.rl-wrap{transform:none;opacity:1}}
