/* JR Characters 2.2.4 — motion composition. Base content is visible without JavaScript. */
.jr-characters-page{--jr-char-ease:cubic-bezier(.22,1,.36,1)}
.jr-characters-page .jr-char-button{transition:background 220ms ease,color 220ms ease,border-color 220ms ease,transform 260ms var(--jr-char-ease)}
.jr-char-button>span,.jr-char-text-link>span{display:inline-block;transition:transform 260ms var(--jr-char-ease)}
.jr-char-button:hover>span,.jr-char-text-link:hover>span{transform:translate(3px,-3px)}
.jr-char-button[href^="#"]:hover>span{transform:translateY(3px)}
/* The reveal wrapper keeps filter reordering independent of each card's entry. */
.jr-char-card__inner{height:100%;display:flex;flex-direction:column}
.jr-char-card__copy{flex:1}
.jr-char-card__photos{flex-shrink:0}
.jr-characters-page .jr-char-hero--pro{position:relative;padding-top:clamp(122px,9vw,172px);padding-bottom:26px;background:var(--jr-char-black);overflow:hidden}
.jr-char-hero__grid{position:absolute;inset:0;pointer-events:none;opacity:.4;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:8.333vw 8.333vw;mask-image:linear-gradient(#000,transparent 76%)}
.jr-char-hero__heading{position:relative;z-index:10}
.jr-characters-page .jr-char-hero--pro h1{margin-top:24px!important;line-height:.90!important;font-size:clamp(78px,10.3vw,178px)!important;letter-spacing:-.08em!important}
.jr-characters-page .jr-char-hero h1>.jr-char-title-mask{display:inline-block;overflow:hidden;vertical-align:bottom;max-width:100%;padding:0 .055em .12em 0;margin:0 -.055em -.12em 0;color:#fff;line-height:1.03}
.jr-characters-page .jr-char-hero h1>.jr-char-title-mask--blue{color:var(--jr-char-blue)!important}
.jr-char-title-mask>[data-jr-title-line]{display:inline-block}
.jr-char-hero--pro .jr-char-hero__meta{margin:28px 0 12px;position:relative;z-index:12}
.jr-char-hero__cast{position:relative;width:min(100%,1640px);height:clamp(390px,41vw,670px);margin:0 auto;isolation:isolate}
.jr-char-hero__halo{position:absolute;z-index:0;bottom:-12%;left:31%;width:38%;aspect-ratio:1;border-radius:50%;background:var(--jr-char-blue);transform-origin:center}
.jr-characters-page .jr-char-hero__word{position:absolute;z-index:0;left:50%;top:16%;transform:translateX(-50%);white-space:nowrap;font-size:clamp(100px,16vw,260px)!important;line-height:1!important;font-weight:900!important;letter-spacing:-.09em!important;color:transparent!important;-webkit-text-stroke:1px rgba(255,255,255,.15);pointer-events:none}
.jr-char-hero__slot{position:absolute;bottom:0;transform-origin:50% 80%}
.jr-char-hero__slot--1{left:-2%;width:28%;z-index:1}
.jr-char-hero__slot--2{left:16%;width:29%;z-index:3}
.jr-char-hero__slot--3{left:33.5%;width:33%;z-index:5}
.jr-char-hero__slot--4{left:56%;width:28.5%;z-index:4}
.jr-char-hero__slot--5{left:77%;width:27%;z-index:2}
.jr-char-hero__slot--1 .jr-char-hero__person{transform:rotate(-5deg) translateY(7%)}
.jr-char-hero__slot--2 .jr-char-hero__person{transform:rotate(-3deg) translateY(11%)}
.jr-char-hero__slot--4 .jr-char-hero__person{transform:rotate(3deg) translateY(5%)}
.jr-char-hero__slot--5 .jr-char-hero__person{transform:rotate(5deg) translateY(9%)}
.jr-char-hero__person{position:relative;display:block;transform-origin:50% 90%;color:#fff}
.jr-char-hero__portrait img{display:block;width:100%;height:auto;max-width:100%;filter:drop-shadow(0 18px 20px rgba(0,0,0,.22))}
.jr-char-hero__name{position:absolute;z-index:8;bottom:12%;left:50%;transform:translateX(-50%);display:flex;gap:12px;align-items:center;justify-content:center;max-width:94%;padding:11px 16px;border:1px solid rgba(255,255,255,.25);border-radius:999px;background:rgba(7,9,12,.92);color:#fff;font-size:10px;font-weight:700;line-height:1.4;white-space:nowrap;opacity:0;transition:opacity 200ms ease,border-color 200ms ease}
.jr-char-hero__name b{font-size:16px;font-weight:500}
.jr-char-hero__person:hover .jr-char-hero__name,.jr-char-hero__person:focus-visible .jr-char-hero__name{opacity:1;border-color:#fff}
.jr-char-hero__person:focus-visible{outline:2px solid #fff!important;outline-offset:-4px!important}
.jr-char-hero__fade{position:absolute;z-index:9;inset:82% 0 0;pointer-events:none;background:linear-gradient(transparent,var(--jr-char-black) 97%)}
.jr-char-hero--pro .jr-char-hero__foot{position:relative;z-index:10;margin-top:8px}
.jr-char-hero__scroll{display:inline-flex;align-items:center;gap:14px;min-height:36px}
.jr-char-hero__scroll span{font-size:20px;color:#fff}
/* Photographic scene: CSS sticky only in supported desktop motion mode. */
.jr-char-story{position:relative;background:var(--jr-char-black);color:#fff;scroll-margin-top:76px}
.jr-char-story__sticky{position:relative;isolation:isolate;overflow:hidden;padding:100px 0 60px}
.jr-char-story.is-scroll-story{height:270svh}
.jr-char-story.is-scroll-story .jr-char-story__sticky{position:sticky;top:0;height:100svh;min-height:620px;padding:96px 0 42px;display:flex;align-items:center}
.jr-char-story__circle{position:absolute;z-index:-1;left:74%;top:46%;width:min(58vh,620px);aspect-ratio:1;border-radius:50%;background:var(--jr-char-blue);translate:-50% -50%;transform-origin:center;pointer-events:none}
.jr-char-story__layout{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:clamp(26px,4vw,70px);align-items:center;position:relative;z-index:2}
.jr-characters-page .jr-char-story .jr-char-eyebrow{color:#fff!important}
.jr-characters-page .jr-char-story h2{font-size:clamp(52px,6.1vw,104px)!important;line-height:.97!important;letter-spacing:-.075em!important;margin:26px 0 30px!important}
.jr-characters-page .jr-char-story.is-scroll-story h2{font-size:clamp(48px,min(6.1vw,9.2svh),104px)!important}
.jr-char-story .jr-char-copy{color:#cacaca;max-width:500px}
.jr-char-story .jr-char-text-link{color:#fff;border-color:#717171}
.jr-char-story__visual{position:relative;min-width:0}
.jr-char-story__portraits{position:relative;aspect-ratio:4/4.5;max-height:590px;overflow:hidden}
.jr-char-story__frame{position:absolute;inset:0;overflow:hidden}
.jr-char-story__frame img{display:block;width:100%;height:100%;object-fit:contain;object-position:center top;transform-origin:center 30%}
.jr-char-story__frame--abogado img{transform:translateY(7.5%)}
.jr-char-story__frame--fan-del-cafe img{transform:translateY(7.4%)}
.jr-char-story__frame--coach-de-spinning img{transform:translateY(.4%)}
.jr-char-story__frame--senor-frijol img{transform:translateY(12.6%)}
.jr-char-story__frame--novia-de-telenovela img{transform:translateY(9.4%)}
.jr-char-story.is-scroll-story .jr-char-story__portraits{height:calc(100svh - 236px);min-height:350px;max-height:680px;aspect-ratio:auto}
.jr-char-story__portraits::after{content:"";position:absolute;z-index:2;inset:86% 0 0;pointer-events:none;background:linear-gradient(transparent,var(--jr-char-black))}
.jr-char-story__caption{position:relative;z-index:3;display:flex;gap:20px;align-items:baseline;padding:16px 0;border-top:1px solid rgba(255,255,255,.26);color:#fff}
.jr-char-story__caption>span{font-size:10px;font-weight:700;white-space:nowrap;letter-spacing:.10em}
.jr-characters-page .jr-char-story__caption>p{font-size:clamp(23px,2.1vw,34px)!important;line-height:1.15!important;letter-spacing:-.04em!important;font-weight:800!important;color:#fff!important}
.jr-char-story__controls{display:flex;gap:8px;position:relative;z-index:3}
.jr-char-story__controls button{position:relative;display:grid;place-items:center;width:44px;height:44px;background:transparent;border:1px solid #676767;border-radius:50%;color:#fff;font-size:10px;font-weight:700;letter-spacing:.06em;transition:background 220ms,border-color 220ms,color 220ms}
.jr-char-story__controls button[aria-pressed=true]{background:#fff;color:var(--jr-char-black);border-color:#fff}
.jr-char-story__controls button:hover{border-color:#fff}
.jr-characters-page .jr-char-story__hint{margin-top:48px!important;display:flex;align-items:center;gap:18px;font-size:9px!important;font-weight:700!important;line-height:1.5!important;letter-spacing:.10em!important;text-transform:uppercase;color:#cacaca!important}
.jr-char-story__hint span{font-size:20px}
.jr-char-story__finale{position:absolute;z-index:4;inset:0;display:flex;align-items:center;text-align:center;padding:96px 0 60px;opacity:0;visibility:hidden;pointer-events:none}
.jr-char-story__finale.is-active{pointer-events:auto}
.jr-characters-page .jr-char-story__final-title{margin:24px 0 36px!important;font-size:clamp(68px,8.5vw,146px)!important;font-weight:900!important;line-height:.95!important;letter-spacing:-.075em!important;color:#fff!important}
.jr-char-story__final-title>span{color:var(--jr-char-black)}
.jr-char-story__progress{display:none;position:absolute;z-index:5;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.16);pointer-events:none}
.jr-char-story.is-scroll-story .jr-char-story__progress{display:block}
.jr-char-story__progress>span{display:block;width:100%;height:100%;background:#fff;transform:scaleX(0);transform-origin:left}
.jr-char-motion-status{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
@media(min-width:1440px){.jr-char-hero__cast{margin-top:-12px}.jr-char-hero__slot--1{width:27%}.jr-char-hero__slot--5{width:26%}}
@media(max-width:1100px){.jr-char-hero--pro .jr-char-hero__meta{flex-direction:row;align-items:flex-end;margin-bottom:20px}.jr-char-hero__cast{height:44vw;min-height:360px}.jr-char-story__layout{gap:30px}.jr-char-story__sticky{padding:88px 0 64px}}
@media(max-width:1000px){.jr-characters-page .jr-char-story h2{font-size:clamp(48px,6.3vw,70px)!important}.jr-char-story__circle{width:56vw;top:50%}.jr-char-hero--pro .jr-char-hero__meta{align-items:flex-start;flex-direction:column;gap:20px}.jr-char-hero__slot--1{left:-5%;width:30%}.jr-char-hero__slot--2{left:13%;width:32%}.jr-char-hero__slot--3{left:33%;width:34%}.jr-char-hero__slot--4{left:57%;width:30%}.jr-char-hero__slot--5{left:80%;width:29%}}
@media(max-width:800px){.jr-char-story__layout{grid-template-columns:1fr;gap:34px}.jr-char-story__copy{max-width:620px}.jr-char-story__visual{width:min(100%,560px);justify-self:center}.jr-char-story__circle{left:50%;top:68%;width:70vw;max-width:560px}.jr-char-story__portraits{max-height:620px}.jr-char-story__controls{justify-content:center}.jr-char-story__caption{justify-content:center}.jr-char-story .jr-char-copy{max-width:520px}}
@media(max-width:600px){.jr-characters-page .jr-char-hero--pro{padding-top:112px;padding-bottom:22px}.jr-characters-page .jr-char-hero--pro h1{font-size:clamp(54px,14.8vw,88px)!important;line-height:.96!important;letter-spacing:-.07em!important;margin-top:22px!important}.jr-char-hero--pro .jr-char-hero__meta{margin-top:24px;margin-bottom:14px;gap:20px}.jr-char-hero__cast{height:95vw;min-height:305px;max-height:510px;margin-top:8px}.jr-char-hero__slot--2,.jr-char-hero__slot--4{display:none}.jr-char-hero__slot--1{left:-17%;width:65%;z-index:2}.jr-char-hero__slot--3{left:16%;width:68%;z-index:4}.jr-char-hero__slot--5{left:65%;width:59%;z-index:1}.jr-char-hero__slot--1 .jr-char-hero__person{transform:rotate(-6deg) translateY(7%)}.jr-char-hero__slot--5 .jr-char-hero__person{transform:rotate(5deg) translateY(9%)}.jr-char-hero__halo{left:17%;width:66%;bottom:1%}.jr-characters-page .jr-char-hero__word{font-size:29vw!important;top:8%}.jr-char-hero__name{display:none}.jr-char-hero__fade{top:86%}.jr-char-hero--pro .jr-char-hero__foot{gap:6px;margin-top:12px;padding-top:16px}.jr-char-hero__scroll{min-height:44px}.jr-char-story__sticky{padding:76px 0 48px}.jr-characters-page .jr-char-story h2{font-size:clamp(44px,11.5vw,66px)!important;line-height:1!important;letter-spacing:-.06em!important}.jr-char-story__layout{gap:16px}.jr-char-story__circle{top:70%;width:90vw}.jr-char-story__portraits{aspect-ratio:4/4.7;min-height:0;max-height:520px}.jr-char-story__caption{gap:16px;padding:16px 0}.jr-characters-page .jr-char-story__caption>p{font-size:25px!important}.jr-char-story__controls{gap:10px}.jr-char-story__controls button{width:46px;height:46px}.jr-char-story .jr-char-text-link{margin-top:14px}}
@media(prefers-reduced-motion:reduce){.jr-characters-page .jr-char-story.is-scroll-story{height:auto!important}.jr-characters-page .jr-char-story.is-scroll-story .jr-char-story__sticky{position:relative!important;height:auto!important;min-height:0!important}.jr-char-story__finale,.jr-char-story__progress{display:none!important}.jr-char-hero__layer,.jr-char-hero__entrance,.jr-char-hero__portrait,.jr-char-hero__heading,[data-jr-title-line],[data-jr-entrance]{transform:none!important;opacity:1!important;visibility:visible!important}}
.jr-characters-page.jr-motion-off *{animation:none!important;transition:none!important}
.jr-characters-page.jr-motion-off .jr-char-button:hover,.jr-characters-page.jr-motion-off .jr-char-button:hover>span{transform:none!important}

/* 2.2 — keep the footer above moving portraits on an opaque brand background. */
.jr-char-hero__footer-panel{position:relative;z-index:20;background:#07090c;padding:8px 0 2px;isolation:isolate}
.jr-characters-page .jr-char-hero--pro .jr-char-hero__foot{position:relative;margin-top:0;padding-top:18px;align-items:center;color:#fff;font-size:11px;font-weight:700;line-height:1.6;border-color:rgba(255,255,255,.25)}
.jr-characters-page .jr-char-hero__foot>a{color:#fff!important;min-height:44px}
.jr-char-story__frame--sabe-de-vinos img{transform:translateY(8.5%)}
.jr-char-story__frame--empresario img{transform:translateY(7.6%)}
.jr-char-story__frame--fresa img{transform:translateY(8.7%)}
.jr-char-story__photo-link{display:block;width:100%;height:100%}
.jr-char-story__caption{flex-wrap:wrap;align-items:center;gap:8px 18px}
.jr-char-story__caption>p{flex:1}
.jr-characters-page .jr-char-story__video-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:#fff;font-size:11px;font-weight:700;white-space:nowrap;border-bottom:1px solid rgba(255,255,255,.5)}
.jr-char-card__video{position:relative;display:block;overflow:hidden}
.jr-char-card__play{position:absolute;left:50%;top:50%;translate:-50% -50%;display:grid;place-items:center;width:54px;height:54px;padding-left:3px;border-radius:50%;background:rgba(7,9,12,.9);color:#fff;border:1px solid rgba(255,255,255,.7);font-size:18px;pointer-events:none;opacity:0;transform:scale(.92);transition:opacity 220ms ease,transform 260ms var(--jr-char-ease)}
.jr-char-card__video:hover .jr-char-card__play,.jr-char-card__video:focus-visible .jr-char-card__play{opacity:1;transform:scale(1)}
.jr-char-card__featured{position:absolute;top:16px;right:16px;z-index:2;display:inline-flex;align-items:center;min-height:30px;padding:7px 12px;border-radius:999px;background:#07090c;color:#fff;font-size:9px;font-weight:700;line-height:1.4;letter-spacing:.09em;text-transform:uppercase;pointer-events:none}
.jr-char-card__copy{display:flex;flex-direction:column;align-items:flex-start}
.jr-characters-page .jr-char-card__watch{display:inline-flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;margin-top:18px;border-bottom:1px solid rgba(255,255,255,.55);color:#fff;font-size:11px;font-weight:700;letter-spacing:.025em}
.jr-char-card__watch>span{display:inline-block;font-size:17px;transition:transform 260ms var(--jr-char-ease)}
.jr-char-card__watch:hover>span{transform:translate(3px,-3px)}
.jr-char-card__video:focus-visible{outline-offset:-5px!important;outline-color:#fff!important}
@media(hover:none){.jr-char-card__play{opacity:1;transform:none;width:46px;height:46px}}
@media(max-width:600px){.jr-characters-page .jr-char-hero--pro .jr-char-hero__foot{align-items:flex-start;gap:4px;font-size:10px;letter-spacing:.06em;padding-top:16px}.jr-char-story__caption{gap:6px 14px}.jr-characters-page .jr-char-story__video-link{font-size:10px}.jr-char-card__featured{top:12px;right:12px}}
@media(prefers-reduced-motion:reduce){.jr-char-card__play{transform:none}.jr-char-card__watch:hover>span{transform:none}}

/* 2.2.1 — names share their own layer above the portraits and their fade. */
.jr-char-hero__names{position:absolute;z-index:12;left:20px;right:20px;bottom:24px;height:44px;pointer-events:none}
.jr-characters-page .jr-char-hero__names .jr-char-hero__name{bottom:0;max-width:calc(100vw - 40px);background:#07090c;color:#fff!important;border-color:rgba(255,255,255,.55);pointer-events:none;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.jr-char-hero__names .jr-char-hero__name--1{left:12%}
.jr-char-hero__names .jr-char-hero__name--2{left:30.5%}
.jr-char-hero__names .jr-char-hero__name--3{left:50%}
.jr-char-hero__names .jr-char-hero__name--4{left:70.25%}
.jr-char-hero__names .jr-char-hero__name--5{left:90.5%}
.jr-char-hero__cast:has(.jr-char-hero__slot--1:hover,.jr-char-hero__slot--1:focus-within) .jr-char-hero__names .jr-char-hero__name--1,.jr-characters-page .jr-char-hero__names .jr-char-hero__name--1:hover{opacity:1;border-color:#fff;pointer-events:auto}
.jr-char-hero__cast:has(.jr-char-hero__slot--2:hover,.jr-char-hero__slot--2:focus-within) .jr-char-hero__names .jr-char-hero__name--2,.jr-characters-page .jr-char-hero__names .jr-char-hero__name--2:hover{opacity:1;border-color:#fff;pointer-events:auto}
.jr-char-hero__cast:has(.jr-char-hero__slot--3:hover,.jr-char-hero__slot--3:focus-within) .jr-char-hero__names .jr-char-hero__name--3,.jr-characters-page .jr-char-hero__names .jr-char-hero__name--3:hover{opacity:1;border-color:#fff;pointer-events:auto}
.jr-char-hero__cast:has(.jr-char-hero__slot--4:hover,.jr-char-hero__slot--4:focus-within) .jr-char-hero__names .jr-char-hero__name--4,.jr-characters-page .jr-char-hero__names .jr-char-hero__name--4:hover{opacity:1;border-color:#fff;pointer-events:auto}
.jr-char-hero__cast:has(.jr-char-hero__slot--5:hover,.jr-char-hero__slot--5:focus-within) .jr-char-hero__names .jr-char-hero__name--5,.jr-characters-page .jr-char-hero__names .jr-char-hero__name--5:hover{opacity:1;border-color:#fff;pointer-events:auto}
@media(max-width:600px){.jr-char-hero__names{display:none}}