/* Partners — hero "línea de recurrencia": el scroll reproduce 12 meses de cartera */
/* El logotipo es oscuro y en el resto del sitio siempre cae sobre fondo claro;
   acá el header arranca flotando sobre el hero oscuro, así que se cambia por la
   variante blanca mientras no está "stuck" (fondo claro del header sticky).
   Antes se resolvía con filter:brightness(0) invert(1), pero eso blanquea
   TAMBIÉN el punto azul y entonces el punto se funde con la C: la marca queda
   como un bulto blanco y pierde su forma. La variante blanca oficial conserva
   el punto azul, que además rima con el azul de la pastilla "IA". */
#top:not(.stuck) .brand img{content:url("/site/img/championsys-logo-white.svg")}
.rc-sc{position:relative;height:320vh;margin-top:calc(-1 * var(--hh,0px));overflow:clip}
.rc-pan{position:sticky;top:0;height:100svh;overflow:hidden;background:#080a16;color:#fff}
.rc-pan:before{content:"";position:absolute;inset:0;background:radial-gradient(58% 44% at 12% 4%,rgba(91,141,239,.28),transparent 68%),radial-gradient(50% 42% at 88% 18%,rgba(124,92,245,.26),transparent 70%),radial-gradient(76% 54% at 58% 106%,rgba(242,112,79,calc(.12 + var(--p,0) * .34)),transparent 72%);pointer-events:none;transition:background .3s linear}
.rc-pan:after{content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:calc(100% / 12) 100%;mask-image:linear-gradient(180deg,transparent,#000 46%);pointer-events:none}
.rc-prog{position:absolute;top:0;left:0;right:0;height:2px;z-index:6;background:rgba(255,255,255,.08)}
.rc-prog i{display:block;height:100%;width:calc(var(--p,0) * 100%);background:linear-gradient(90deg,#b9a8ff,var(--coral));box-shadow:0 0 14px rgba(242,112,79,.7)}
.rc-top{position:relative;z-index:3;padding:calc(var(--hh,0px) + clamp(18px,3.4vh,48px)) 0 clamp(120px,20vh,240px)}
.rc-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,3.6vw,64px);align-items:start}
/* la columna de texto se apila por encima del derrame del glow vecino */
.rc-grid>div:first-child{position:relative;z-index:4}

.rc-kick{display:inline-flex;align-items:center;gap:10px;font-size:11px;font-weight:900;letter-spacing:.18em;text-transform:uppercase;color:#8b93bd}
.rc-kick s{text-decoration:none;width:7px;height:7px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 4px rgba(242,112,79,.2)}
.rc-h1{font-size:clamp(27px,min(3.6vw,4.8vh),54px);line-height:1.02;letter-spacing:-.045em;font-weight:800;margin:clamp(8px,1.4vh,16px) 0 0;color:#fff}
.rc-h1 .l{display:block;overflow:hidden;padding:.14em 0 .24em;margin:-.14em 0 -.24em}
.rc-h1 .l i{display:block;font-style:normal;transform:translateY(106%);animation:rcup 1.05s var(--d,0ms) cubic-bezier(.16,.9,.2,1) forwards}
@keyframes rcup{to{transform:none}}
.rc-h1 em{font-style:normal;background:linear-gradient(96deg,var(--coral),#f6a37f 44%,#b9a8ff);-webkit-background-clip:text;background-clip:text;color:transparent}

/* protagonista: el 30% */
.rc-big{display:flex;align-items:flex-end;gap:clamp(14px,1.6vw,24px);margin:clamp(10px,2vh,26px) 0 0}
.rc-fig{position:relative;flex:none;line-height:.76}
.rc-num{font-size:clamp(74px,min(11.5vw,20vh),210px);font-weight:800;letter-spacing:-.06em;font-variant-numeric:tabular-nums;background:linear-gradient(176deg,#fff 20%,#ffd0bd 60%,rgba(242,112,79,.9));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 44px 100px rgba(242,112,79,.32)}
.rc-cap{flex:1 1 0;padding-bottom:.95em;font-size:clamp(12.5px,1.5vh,14.5px);font-weight:700;color:#9aa2c8;line-height:1.4;max-width:30ch}
.rc-cap u{text-decoration:none;color:#fff;display:block;font-weight:800;font-size:clamp(15px,1.9vh,18px);letter-spacing:-.025em;margin-bottom:4px}
.rc-lede{font-size:clamp(13px,1.6vh,15.5px);line-height:1.58;font-weight:500;color:#b0b8dc;margin:clamp(12px,2vh,22px) 0 0;max-width:52ch}
.rc-lede b{color:#fff;font-weight:800}
.rc-cta{display:flex;gap:10px;flex-wrap:wrap;margin:clamp(12px,1.8vh,20px) 0 0}
.rc-cta .btn-g{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.18);color:#fff}
.rc-cta .btn-g:hover{background:rgba(255,255,255,.16);color:#fff}
.rc-fade{opacity:0;transform:translateY(14px);animation:rcf .9s var(--d,0ms) cubic-bezier(.2,.85,.2,1) forwards}
@keyframes rcf{to{opacity:1;transform:none}}

/* tarjeta del simulador — glowing shadow: sombra de color viva debajo del vidrio */
.rc-card{--g1:#4f8cff;--g2:#8b7cf0;--g3:#ffffff;--g4:#f2704f;--rcang:210deg;position:relative;isolation:isolate;border-radius:24px;padding:clamp(12px,1.9vh,22px)}
/* rim finito: define el canto sin dibujar un borde duro */
.rc-card .rc-rim{position:absolute;inset:-2.5px;border-radius:26.5px;z-index:0;pointer-events:none;filter:saturate(1.5);background:conic-gradient(from var(--rcang),var(--g1),var(--g2) 26%,var(--g3) 44%,var(--g4) 62%,var(--g1));opacity:.9;animation:rcspin 14s linear infinite}
/* glowing shadow: manchas de color que respiran y derraman por debajo */
.rc-card .rc-halo{position:absolute;inset:-26px;border-radius:44px;z-index:0;pointer-events:none;filter:blur(34px) saturate(1.3);opacity:.6;background:
 radial-gradient(38% 44% at var(--b1x,22%) var(--b1y,16%),var(--g1),transparent 68%),
 radial-gradient(40% 46% at var(--b2x,80%) var(--b2y,26%),var(--g2),transparent 68%),
 radial-gradient(42% 48% at var(--b3x,68%) var(--b3y,86%),var(--g4),transparent 68%),
 radial-gradient(34% 38% at var(--b4x,14%) var(--b4y,80%),#4ad9c0,transparent 68%);
 animation:rcdrift 18s ease-in-out infinite alternate,rcorbit 26s linear infinite}
/* sombra proyectada, del mismo color, más difusa y abajo */
/* cometa: un tramo brillante que viaja por el perímetro */
.rc-card .rc-rim:after{content:"";position:absolute;inset:0;border-radius:inherit;padding:2.5px;background:conic-gradient(from var(--rcarc),transparent 0 58%,rgba(255,255,255,.35) 70%,#fff 78%,rgba(255,255,255,.35) 86%,transparent 94%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;filter:blur(.6px);animation:rcarc 5.5s linear infinite}
@property --rcarc{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes rcarc{to{--rcarc:360deg}}
.rc-card .rc-halo:after{content:"";position:absolute;inset:14% 8% -12%;border-radius:50%;background:radial-gradient(60% 60% at 50% 50%,var(--g2),transparent 70%);filter:blur(30px);opacity:.55}
/* relleno de vidrio que cubre el glow y deja ver solo el derrame */
.rc-card .rc-fill{position:absolute;inset:0;border-radius:inherit;z-index:1;pointer-events:none;background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.03)),rgba(10,12,28,.88);backdrop-filter:blur(22px) saturate(1.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 30px 70px -34px rgba(4,6,20,.9)}
@property --rcang{syntax:'<angle>';inherits:false;initial-value:210deg}
@keyframes rcspin{to{--rcang:570deg}}
@keyframes rcdrift{to{--b1x:34%;--b1y:34%;--b2x:64%;--b2y:12%;--b3x:52%;--b3y:70%;--b4x:26%;--b4y:64%}}
@keyframes rcorbit{to{rotate:360deg}}
@property --b1x{syntax:'<percentage>';inherits:false;initial-value:22%}
@property --b1y{syntax:'<percentage>';inherits:false;initial-value:16%}
@property --b2x{syntax:'<percentage>';inherits:false;initial-value:80%}
@property --b2y{syntax:'<percentage>';inherits:false;initial-value:26%}
@property --b3x{syntax:'<percentage>';inherits:false;initial-value:68%}
@property --b3y{syntax:'<percentage>';inherits:false;initial-value:86%}
@property --b4x{syntax:'<percentage>';inherits:false;initial-value:14%}
@property --b4y{syntax:'<percentage>';inherits:false;initial-value:80%}
/* luz que sigue al cursor */
.rc-card .rc-spot{position:absolute;inset:0;border-radius:inherit;z-index:2;pointer-events:none;opacity:0;transition:opacity .35s;background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.13),transparent 62%)}
.rc-card:hover .rc-spot{opacity:1}
.rc-card>*:not(.rc-rim):not(.rc-halo):not(.rc-fill):not(.rc-spot){position:relative;z-index:3}
.rc-chead{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.rc-tag{display:inline-flex;align-items:center;gap:8px;font-size:10px;font-weight:900;letter-spacing:.15em;color:#ffb99f;padding:6px 11px;border-radius:999px;background:rgba(242,112,79,.14);border:1px solid rgba(242,112,79,.4)}
.rc-mo{display:inline-flex;align-items:center;gap:8px;font-size:10.5px;font-weight:900;letter-spacing:.12em;color:#dfe4ff;padding:7px 12px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(255,255,255,.07);font-variant-numeric:tabular-nums}
.rc-mo s{text-decoration:none;width:6px;height:6px;border-radius:50%;background:var(--coral);animation:rcpulse 1.8s ease-in-out infinite}
@keyframes rcpulse{0%,100%{opacity:.35}50%{opacity:1}}
.rc-amt{display:flex;align-items:baseline;gap:8px;margin:clamp(8px,1.3vh,16px) 0 0}
.rc-amt span{font-size:15px;font-weight:800;color:#9aa2c8}
.rc-amt b{font-size:clamp(26px,min(3.4vw,3.9vh),52px);font-weight:800;letter-spacing:-.045em;line-height:.88;font-variant-numeric:tabular-nums;color:#fff}
.rc-amtl{font-size:clamp(11px,1.35vh,12.5px);font-weight:700;color:#9aa2c8;margin:5px 0 0}
.rc-amtl b{color:#fff;font-weight:800}
.rc-mets{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(6px,.9vh,8px);margin:clamp(8px,1.3vh,16px) 0 0}
.rc-met{padding:clamp(8px,1.1vh,11px) clamp(9px,1.2vh,12px);border-radius:14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1)}
.rc-met b{display:block;font-size:clamp(15px,1.9vh,23px);font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:#fff}
.rc-met em{font-style:normal;display:block;font-size:clamp(9px,1.15vh,10.5px);font-weight:800;letter-spacing:.04em;color:#8b93bd;margin-top:2px;line-height:1.25}
.rc-ctrl{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:clamp(8px,1.3vh,16px) 0 0;padding-top:clamp(8px,1.3vh,14px);border-top:1px solid rgba(255,255,255,.12);font-size:11.5px;font-weight:800;color:#b0b8dc}
.rc-segs{display:inline-flex;gap:5px;padding:4px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14)}
.rc-segs button{border:0;background:none;color:#a8b0d6;font:inherit;font-size:11.5px;font-weight:800;padding:6px 12px;border-radius:999px;cursor:pointer;transition:.25s}
.rc-segs button:hover{color:#fff}
.rc-segs button[aria-pressed=true]{background:#fff;color:#12142a}
.rc-note{margin:7px 0 0;font-size:clamp(10.5px,1.3vh,11.5px);font-weight:600;line-height:1.45;color:#9aa2c8}
.rc-note b{color:#fff;font-weight:800}
.rc-sim-cta{display:inline-flex;align-items:center;gap:8px;margin:clamp(8px,1.3vh,14px) 0 0;padding:clamp(8px,1.2vh,11px) 15px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);color:#fff;text-decoration:none;font-size:12.5px;font-weight:800;transition:background .3s,border-color .3s,transform .3s}
.rc-sim-cta:hover{background:#fff;border-color:#fff;color:#12142a;transform:translateY(-2px)}
.rc-disc{margin:clamp(8px,1.4vh,12px) 0 0;font-size:clamp(11.5px,1.35vh,12.5px);font-weight:600;line-height:1.45;color:#a7aed0}
.rc-disc b{color:#fff;font-weight:800}

/* gráfico full-bleed con cabezal */
.rc-chart{position:absolute;left:0;right:0;bottom:0;z-index:4;height:clamp(120px,20vh,240px);pointer-events:none}
.rc-chart svg{display:block;width:100%;height:100%}
.rc-bars{position:absolute;inset:auto 0 26px;display:grid;grid-template-columns:repeat(12,1fr);align-items:end;height:calc(100% - 26px)}
.rc-bars i{margin:0 16%;border-radius:5px 5px 0 0;background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,.03));height:var(--h);transform-origin:bottom;transform:scaleY(var(--k,0));transition:transform .2s linear,background .35s,box-shadow .35s}
.rc-bars i.on{background:linear-gradient(180deg,#f2704f,rgba(242,112,79,.1));box-shadow:0 0 24px -4px rgba(242,112,79,.7)}
.rc-ax{position:absolute;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(12,1fr);font-size:10px;font-weight:800;letter-spacing:.08em;color:#767ea0;padding-bottom:8px}
.rc-ax span{text-align:center;transition:color .3s}
.rc-ax span.on{color:#fff}
.rc-line{fill:none;stroke:url(#rcgl);stroke-width:3.5;stroke-linecap:round;filter:drop-shadow(0 0 14px rgba(242,112,79,.55))}
.rc-area{fill:url(#rcgr)}
.rc-head{position:absolute;top:0;bottom:26px;width:1px;background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,.06));left:0;translate:-.5px 0;z-index:3;pointer-events:none}
.rc-dot{position:absolute;width:11px;height:11px;border-radius:50%;background:#fff;box-shadow:0 0 0 5px rgba(242,112,79,.28),0 0 22px rgba(242,112,79,.9);translate:-50% -50%;z-index:4;pointer-events:none}
/* el globo del mes viaja en su propio carril: arriba del gráfico, nunca sobre el eje */
.rc-tip{position:absolute;bottom:34px;z-index:5;translate:-50% 0;padding:7px 11px;border-radius:12px;background:rgba(8,10,22,.86);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(10px);font-size:11px;font-weight:800;color:#fff;white-space:nowrap;pointer-events:none}
.rc-tip s{text-decoration:none;color:#ffb99f}
.rc-cue{display:inline-flex;align-items:center;gap:9px;margin:clamp(10px,1.8vh,18px) 0 0;font-size:10.5px;font-weight:900;letter-spacing:.16em;color:#8b93bd;opacity:calc(1 - var(--p,0) * 4);transition:opacity .3s}
.rc-cue s{text-decoration:none;width:1px;height:18px;background:linear-gradient(180deg,transparent,#8b93bd);animation:rccu 2s ease-in-out infinite}
@keyframes rccu{0%,100%{transform:scaleY(.4);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}}

@media (max-width:1180px){.rc-big{flex-wrap:wrap;gap:6px 18px}.rc-cap{flex:1 1 100%;padding-bottom:0;max-width:none}}
@media (max-width:1080px){.rc-grid{gap:20px}.rc-lede{font-size:13px;line-height:1.5}}
/* alturas cortas: la tarjeta se compacta en vez de recortarse */
@media (min-height:1040px){.rc-mets{grid-template-columns:1fr 1fr}}
@media (max-height:620px){.rc-prog{display:none}}
@media (max-width:820px){.rc-sc{height:auto}.rc-pan{position:static;height:auto;overflow:hidden}.rc-top{padding:calc(var(--hh,0px) + 28px) 0 24px}.rc-grid{grid-template-columns:1fr;gap:22px}.rc-big{flex-wrap:wrap;gap:6px 18px}.rc-cap{padding-bottom:0;max-width:none}.rc-chart{position:relative;height:190px;margin-top:8px}.rc-cue{display:none}}
/* la composición fijada necesita alto mínimo: por debajo, el hero pasa a flujo normal */
@media (max-height:660px){.rc-sc{height:auto}.rc-pan{position:static;height:auto;overflow:hidden}.rc-top{padding:calc(var(--hh,0px) + 22px) 0 16px}.rc-chart{position:relative;height:170px;margin-top:10px}.rc-cue{display:none}.rc-lede .full{display:none}}
@media (prefers-reduced-motion:reduce){.rc-h1 .l i,.rc-fade,.rc-cue s,.rc-mo s,.rc-card .rc-rim,.rc-card .rc-rim:after,.rc-card .rc-halo{animation:none!important}.rc-card .rc-halo{opacity:.6!important;transform:none!important}.rc-h1 .l i,.rc-fade{opacity:1!important;transform:none!important}.rc-bars i{transform:scaleY(1)}}

/* ---------- costura hero → página: disolución larga, sin filos ---------- */
/* el panel funde su propio canto inferior: no queda línea recta */
.rc-seam{position:relative;z-index:5;height:clamp(150px,24vh,290px);margin-top:0;pointer-events:none;overflow:clip}
/* gradiente largo de muchas paradas: el oscuro se disuelve en el claro de la página */
.rc-seam .sk{position:absolute;inset:0;background:radial-gradient(76% 46% at 58% -8%,rgba(242,112,79,.2),transparent 72%),linear-gradient(180deg,#080a16 0%,#090c1c 14%,#0c1024 28%,rgba(17,21,48,.88) 44%,rgba(38,44,86,.62) 58%,rgba(96,106,158,.34) 70%,rgba(170,178,212,.16) 82%,rgba(231,235,244,.04) 92%,rgba(231,235,244,0) 100%)}
/* aurora que cruza el límite y tiñe las dos mitades */
.rc-seam .lg{position:absolute;left:50%;top:-34%;width:150%;height:150%;translate:-50% 0;filter:blur(60px);opacity:.42;-webkit-mask:linear-gradient(180deg,#000 40%,rgba(0,0,0,.35) 70%,transparent 92%);mask:linear-gradient(180deg,#000 40%,rgba(0,0,0,.35) 70%,transparent 92%);background:radial-gradient(28% 40% at 22% 44%,var(--g1,#4f8cff),transparent 70%),radial-gradient(30% 42% at 52% 34%,var(--g2,#8b7cf0),transparent 70%),radial-gradient(28% 40% at 82% 50%,var(--g4,#f2704f),transparent 70%);animation:rcseam 24s ease-in-out infinite alternate}
@keyframes rcseam{to{transform:translate3d(-5%,4%,0) scale(1.1)}}
.rc-seam .ed{display:none}
/* motas de luz que suben y se apagan */
.rc-seam .pt{position:absolute;inset:0;opacity:.5;background-image:radial-gradient(1.4px 1.4px at 12% 58%,rgba(255,255,255,.55),transparent),radial-gradient(1.4px 1.4px at 34% 36%,rgba(255,255,255,.4),transparent),radial-gradient(1.4px 1.4px at 58% 64%,rgba(255,255,255,.48),transparent),radial-gradient(1.4px 1.4px at 78% 40%,rgba(255,255,255,.32),transparent),radial-gradient(1.4px 1.4px at 90% 68%,rgba(255,255,255,.44),transparent);-webkit-mask:linear-gradient(180deg,#000,transparent 72%);mask:linear-gradient(180deg,#000,transparent 72%);animation:rcrise 11s ease-in-out infinite alternate}
@keyframes rcrise{to{transform:translateY(-16px);opacity:.24}}
@media (prefers-reduced-motion:reduce){.rc-seam .lg,.rc-seam .pt{animation:none!important}}