@import url('https://fonts.googleapis.com/css2?family=Albert+Sans:wght@400;500;600;700&display=swap');
/* Smart Trading Club · portada en Bitrix · generado por portada-bitrix/build.py (no editar a mano).
   Fuentes: club/public/css/tokens.css + sitio.css + portada-bitrix/src/portada.css */
#stc {
color-scheme: dark;
--turquesa-1: #3CFECA;  --turquesa-2: #1FD1D6;  --turquesa-3: #1A92C6;
--cota-1: #3CFECA;
--cota-2: #2EE8D0;
--cota-3: #1FD1D6;
--cota-4: #1CB2CE;
--cota-5: #1A92C6;
--degradado: linear-gradient(135deg, #3CFECA 0%, #1FD1D6 50%, #1A92C6 100%);
--fondo: #000000;
--panel: #0B0F11;
--panel-2: #141A1D;
--panel-3: #1C2428;
--filete: #2A3338;
--filete-suave: rgba(255, 255, 255, 0.09);
--tinta: #F5F7F8;
--tinta-2: #C4CCD0;
--nota: #8D989E;
--enlace: #6FE6DE;
--ok: #6EE7A0;
--verde-texto: var(--ok);
--aviso: #FFC46B;
--borde-control: #66747B;
--peligro: #FF8A80;
--sobre-acento: #000000;
--primario: #1FD1D6;
--primario-filete: #1FD1D6;
--primario-hover: linear-gradient(135deg, #6BFFD8 0%, #3FDDE0 50%, #2FA3D3 100%);
--primario-activo: linear-gradient(135deg, #2FE6B6 0%, #19BCC1 50%, #1784B3 100%);
--halo: 0 12px 34px -14px rgba(31, 209, 214, .55);
--luz-1: rgba(60,254,202,.22), rgba(60,254,202,.163) 20%, rgba(60,254,202,.099) 38%, rgba(60,254,202,.044) 54%, rgba(60,254,202,.012) 66%, transparent 76%;
--luz-2: rgba(31,209,214,.42), rgba(31,209,214,.31) 20%, rgba(31,209,214,.19) 38%, rgba(31,209,214,.084) 54%, rgba(31,209,214,.022) 66%, transparent 76%;
--luz-3: rgba(26,146,198,.34), rgba(26,146,198,.25) 20%, rgba(26,146,198,.153) 38%, rgba(26,146,198,.068) 54%, rgba(26,146,198,.018) 66%, transparent 76%;
--difuminado: radial-gradient(32% 42% at 72% 46%, var(--luz-2)),
radial-gradient(24% 30% at 60% 72%, var(--luz-1)),
radial-gradient(28% 36% at 86% 28%, var(--luz-3));
--difuminado-banda: radial-gradient(60% 120% at 100% 100%, var(--luz-2)),
radial-gradient(40% 80% at 85% 0%, var(--luz-3)),
var(--panel);
--f-display: "Albert Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
--f-texto: "Albert Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
--f-mono: "Atkinson Hyperlegible Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;
--t-h1: clamp(38px, 17.6px + 5.2vw, 84px);
--t-h2: clamp(30px, 20.8px + 2.4vw, 52px);
--t-h3: 24px;
--t-entradilla: 20px;
--t-texto: 17px;
--t-rotulo: 14px;
--r-s: 8px;
--r-m: 14px;
--r-l: 22px;
--r-pill: 999px;
--sombra-1: inset 0 1px 0 rgba(255,255,255,.06);
--sombra-2: inset 0 1px 0 rgba(255,255,255,.08), 0 24px 60px -20px rgba(0,0,0,.9);
--foco: 0 0 0 3px #000000, 0 0 0 5px #9AF5E6;
--ease: cubic-bezier(.16, 1, .3, 1);
--ancho: 1200px;
--gutter: clamp(16px, 4vw, 40px);
}
@media (prefers-reduced-motion: reduce) {
#stc *,#stc *::before,#stc *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
#stc .btn {
--_bg: var(--degradado);
display: inline-flex; align-items: center; justify-content: center; gap: .55em;
min-height: 48px; padding: 0 1.5em;
font: 600 16px/1 var(--f-texto); letter-spacing: 0;
color: var(--sobre-acento); background: var(--_bg);
border: 1px solid transparent; border-radius: var(--r-pill);
box-shadow: var(--halo);
text-decoration: none; cursor: pointer; user-select: none;
transition: background .2s var(--ease), transform .2s var(--ease), box-shadow .2s var(--ease);
}
#stc .btn:hover { --_bg: var(--primario-hover); transform: translateY(-1px); }
#stc .btn:active { --_bg: var(--primario-activo); transform: translateY(0) scale(.98); }
#stc .btn:focus-visible { outline: none; box-shadow: var(--foco); }
#stc .btn--sec { --_bg: transparent; color: var(--tinta); border-color: var(--borde-control); box-shadow: none; }
#stc .btn--sec:hover { --_bg: rgba(255,255,255,.06); border-color: var(--tinta-2); }
#stc .btn--fantasma { --_bg: transparent; color: var(--enlace); border-color: transparent; box-shadow: none; padding-inline: .6em; }
#stc .btn--fantasma:hover { --_bg: rgba(111,230,222,.08); }
#stc .btn--sec:active,#stc .btn--fantasma:active { --_bg: rgba(255,255,255,.10); }
#stc .btn--peligro { --_bg: #7A1F2B; color: #fff; border-color: #C2525F; box-shadow: none; }
#stc .btn--peligro:hover,#stc .btn--peligro:active { --_bg: #8E2533; }
#stc .btn[disabled],#stc .btn[aria-busy="true"] { opacity: .6; cursor: progress; transform: none; }
#stc .btn--chico { min-height: 38px; padding: 0 1.1em; font-size: 15px; }
#stc .lockup { display: inline-flex; align-items: center; gap: .35em; color: var(--tinta); font: 600 20px/1 var(--f-display); letter-spacing: -.015em; text-decoration: none; white-space: nowrap; }
#stc .lockup__simbolo { flex: none; width: auto; height: 1.26em; }
@media (max-width: 419px) {
#stc .lockup--compacto .lockup__simbolo { height: 28px; }
#stc .lockup--compacto .lockup__nombre { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
#stc .portada {
--luz: 0% 0%;
position: relative; aspect-ratio: 16 / 9; display: flex; align-items: flex-end; padding: 0 20px 18px;
background: radial-gradient(85% 110% at var(--luz), var(--luz-2)), var(--fondo);
}
#stc .portada[data-etapa="2"] { --luz: 100% 0%; }
#stc .portada[data-etapa="3"] { --luz: 0% 100%; }
#stc .portada[data-etapa="4"] { --luz: 100% 100%; }
#stc .portada::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--degradado); }
#stc .portada__num { color: var(--tinta); font: 700 52px/1 var(--f-display); letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
@media (prefers-contrast: more) { #stc .portada { background: var(--fondo); } }
#stc {
--e-1: 4px; --e-2: 8px; --e-3: 12px; --e-4: 16px; --e-5: 24px;
--e-6: 32px; --e-7: 48px; --e-8: 64px; --e-9: 96px; --e-10: 128px;
--alto-cabecera: 64px;
--seccion: clamp(64px, 8vw, 120px);
}
#stc *,#stc *::before,#stc *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 80px; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
#stc {
margin: 0; min-height: 100vh;
background: var(--fondo); color: var(--tinta-2);
font: 400 var(--t-texto)/1.6 var(--f-texto);
overflow-x: clip;
-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
#stc img,#stc svg,#stc video { display: block; max-width: 100%; }
#stc img { height: auto; }
#stc h1,#stc h2,#stc h3,#stc h4 { margin: 0; color: var(--tinta); font-family: var(--f-display); overflow-wrap: anywhere; min-width: 0; text-wrap: balance; }
#stc h1 { font-size: var(--t-h1); font-weight: 700; line-height: 1.02; letter-spacing: -0.022em; }
#stc h2 { font-size: var(--t-h2); font-weight: 600; line-height: 1.08; letter-spacing: -0.018em; }
#stc h3 { font-size: var(--t-h3); font-weight: 600; line-height: 1.2; letter-spacing: -0.01em; }
#stc p { margin: 0; text-wrap: pretty; }
#stc ul,#stc ol { margin: 0; padding: 0; }
#stc strong { color: var(--tinta); font-weight: 600; }
#stc a { color: var(--enlace); text-decoration-thickness: 1px; text-underline-offset: .2em; }
#stc a:hover { text-decoration-thickness: 2px; }
#stc :focus-visible { outline: 2px solid var(--enlace); outline-offset: 3px; }
#stc main:focus { outline: none; }
#stc ::selection { background: var(--primario); color: var(--sobre-acento); }
#stc [hidden] { display: none !important; }
#stc .vh { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
#stc .nowrap { white-space: nowrap; }
#stc .contenedor { width: 100%; max-width: calc(var(--ancho) + 2 * var(--gutter)); margin-inline: auto; padding-inline: var(--gutter); }
#stc .saltar {
position: absolute; left: var(--e-4); top: -120px; z-index: 100;
padding: var(--e-3) var(--e-4); border-radius: var(--r-s);
background: var(--tinta); color: var(--fondo); font-weight: 600; text-decoration: none;
}
#stc .saltar:focus { top: var(--e-3); }
#stc .cabecera { position: sticky; top: 0; z-index: 50; background: var(--fondo); border-bottom: 1px solid var(--filete-suave); }
#stc .cabecera__fila { display: flex; align-items: center; gap: var(--e-3); min-height: var(--alto-cabecera); }
#stc .cabecera__marca { flex: none; justify-self: start; align-self: center; padding: var(--e-1); margin-left: calc(-1 * var(--e-1)); border-radius: var(--r-s); font-size: 18px; }
#stc .cabecera__nav { display: none; }
#stc .cabecera__enlaces { display: flex; align-items: center; gap: var(--e-1); list-style: none; }
#stc .cabecera__enlaces a,#stc .cabecera__idioma {
display: inline-flex; align-items: center; min-height: 38px; padding: 0 var(--e-3);
border-radius: var(--r-s); color: var(--tinta-2); text-decoration: none;
font: 500 15px/1 var(--f-texto);
transition: background-color .2s var(--ease), color .2s var(--ease);
}
#stc .cabecera__enlaces a:hover,#stc .cabecera__idioma:hover { background: var(--filete-suave); color: var(--tinta); }
#stc .cabecera__acciones { margin-left: auto; display: flex; align-items: center; gap: var(--e-2); }
#stc .cabecera__idioma,#stc .cabecera__entrar { display: none; }
#stc .menu-movil > summary {
list-style: none; display: inline-flex; align-items: center; gap: var(--e-2);
min-height: 38px; padding: 0 var(--e-4); border: 1px solid var(--borde-control); border-radius: var(--r-pill);
color: var(--tinta); font: 500 15px/1 var(--f-texto); cursor: pointer; user-select: none;
transition: background-color .2s var(--ease);
}
#stc .menu-movil > summary::-webkit-details-marker { display: none; }
#stc .menu-movil > summary:hover { background: var(--filete-suave); }
#stc .menu-movil > summary:focus-visible { outline: none; box-shadow: var(--foco); }
#stc .menu-movil__icono { position: relative; width: 14px; height: 10px; }
#stc .menu-movil__icono::before,#stc .menu-movil__icono::after {
content: ""; position: absolute; left: 0; right: 0; height: 2px; border-radius: 1px; background: currentColor;
transition: transform .2s var(--ease);
}
#stc .menu-movil__icono::before { top: 1px; }
#stc .menu-movil__icono::after { bottom: 1px; }
#stc .menu-movil[open] .menu-movil__icono::before { transform: translateY(3px) rotate(45deg); }
#stc .menu-movil[open] .menu-movil__icono::after { transform: translateY(-3px) rotate(-45deg); }
#stc .menu-movil__panel {
position: absolute; left: 0; right: 0; top: 100%;
max-height: calc(100dvh - var(--alto-cabecera)); overflow-y: auto;
padding: var(--e-2) var(--gutter) var(--e-6);
background: var(--fondo); border-bottom: 1px solid var(--filete);
box-shadow: var(--sombra-2);
}
#stc .menu-movil__panel ul { list-style: none; }
#stc .menu-movil__panel li a {
display: flex; align-items: center; min-height: 52px;
border-bottom: 1px solid var(--filete-suave);
color: var(--tinta); text-decoration: none; font: 500 18px/1.2 var(--f-texto);
}
#stc .menu-movil__acciones { display: flex; flex-wrap: wrap; gap: var(--e-3); margin-top: var(--e-5); }
#stc .menu-movil__acciones .btn { flex: 1 1 140px; }
@media (max-width: 419px) {
#stc .cabecera .lockup--compacto .lockup__nombre { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; font-size: 16px; }
#stc .cabecera__acciones > .btn { display: none; }
}
@media (min-width: 1120px) {
#stc .cabecera__marca { font-size: 22.8576px; }
#stc .cabecera__fila { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); }
#stc .cabecera__nav { display: block; }
#stc .cabecera__acciones { justify-self: end; margin-left: 0; }
#stc .cabecera__idioma,#stc .cabecera__entrar { display: inline-flex; }
#stc .menu-movil { display: none; }
}
#stc .estado { list-style: none; display: flex; flex-wrap: wrap; gap: var(--e-2) var(--e-5); font-size: var(--t-rotulo); line-height: 1.4; color: var(--tinta-2); }
#stc .estado li { display: inline-flex; align-items: center; gap: var(--e-2); }
#stc .estado li::before { content: ""; flex: none; width: 10px; height: 10px; border-radius: 50%; }
#stc .estado__listo::before { background: var(--enlace); }
#stc .estado__pendiente::before { border: 1.5px solid var(--nota); }
#stc .heroe { position: relative; isolation: isolate; overflow: clip; padding-block: var(--e-7) var(--e-8); }
#stc .heroe::before {
content: ""; position: absolute; inset: -10% -5% -10% -20%; z-index: -1; pointer-events: none;
background: var(--difuminado);
}
#stc .heroe__rejilla { display: grid; gap: var(--e-5); align-items: center; }
#stc .heroe h1 { font-size: clamp(38px, 19.2px + 4vw, 68px); }
#stc .heroe h1 span { display: block; }
#stc .heroe__entradilla { margin-top: var(--e-5); max-width: 44ch; font-size: var(--t-entradilla); line-height: 1.5; color: var(--tinta-2); }
#stc .heroe__botones { display: flex; flex-wrap: wrap; gap: var(--e-3); margin-top: var(--e-6); }
#stc .heroe__botones .btn { flex: 1 1 auto; }
#stc .heroe__linea { margin-top: var(--e-5); font-size: 17px; color: var(--tinta-2); }
#stc .heroe__visual { order: -1; }
#stc .heroe__icono { width: 112px; height: auto; }
@media (max-width: 959px) {
#stc .heroe::before { inset: 0; background:
radial-gradient(220px 170px at calc(var(--gutter) + 56px) calc(var(--e-7) + 56px), var(--luz-2)),
radial-gradient(150px 120px at calc(var(--gutter) + 120px) calc(var(--e-7) + 96px), var(--luz-1)); }
}
@media (min-width: 960px) {
#stc .heroe { padding-block: var(--e-8) var(--e-9); }
#stc .heroe__rejilla { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--e-7); }
#stc .heroe__botones .btn { flex: 0 0 auto; min-height: 52px; }
#stc .heroe__visual { order: 0; display: grid; place-items: center; }
#stc .heroe__icono { width: min(30vw, 360px); }
}
@media (prefers-contrast: more) { #stc .heroe::before { display: none; } }
#stc .seccion { padding-block: var(--seccion); }
#stc .seccion--panel { background: var(--panel); border-block: 1px solid var(--filete-suave); }
#stc .seccion--filete { border-top: 1px solid var(--filete-suave); }
#stc .seccion__cabeza { max-width: 736px; margin-bottom: var(--e-7); }
#stc .seccion__entradilla { margin-top: var(--e-4); max-width: 60ch; font-size: 18px; line-height: 1.55; color: var(--tinta-2); }
#stc .seccion__cabeza .estado { margin-top: var(--e-5); }
#stc .antetitulo { margin-bottom: var(--e-3); color: var(--nota); font: 600 13px/1.4 var(--f-texto); letter-spacing: .08em; text-transform: uppercase; }
#stc .dos-columnas { display: grid; gap: var(--e-6); }
#stc .dos-columnas > .seccion__cabeza { margin-bottom: 0; }
@media (min-width: 960px) { #stc .dos-columnas { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--e-8); align-items: start; } }
#stc .mercado__rejilla { display: grid; gap: var(--e-7); }
#stc .mercado__intro .seccion__entradilla { max-width: 52ch; }
#stc .medidores { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-3); margin-top: var(--e-6); }
#stc .medidor {
display: grid; gap: var(--e-2); align-content: start; min-height: 128px; padding: var(--e-4);
background: var(--panel-2); border: 1px solid var(--filete); border-radius: var(--r-m);
}
#stc .medidor--nota { grid-column: 1 / -1; }
#stc .medidor__nombre { font-size: 13px; font-weight: 500; line-height: 1.35; color: var(--nota); }
#stc .medidor__valor { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 var(--e-2); }
#stc .medidor__num { color: var(--tinta); font: 600 36px/1 var(--f-display); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
#stc .medidor--nota .medidor__num { font-size: 44px; }
#stc .medidor__de { margin-left: -.35em; color: var(--nota); font-size: 16px; font-variant-numeric: tabular-nums; }
#stc .medidor__etiqueta { color: var(--tinta); font-weight: 600; line-height: 1.3; }
#stc .barra { position: relative; height: 8px; margin-top: var(--e-2); background: var(--panel-3); }
#stc .barra::before { content: ""; position: absolute; left: 50%; top: -3px; bottom: -3px; width: 2px; margin-left: -1px; background: var(--borde-control); }
#stc .barra::after { content: ""; position: absolute; left: 0; right: 0; top: -3px; bottom: -3px; border-inline: 2px solid var(--borde-control); }
#stc .barra__marca { position: absolute; top: 50%; width: 16px; height: 16px; border-radius: 50%; background: var(--tinta); border: 3px solid var(--panel-2); transform: translate(-50%, -50%); }
#stc .barra__escala { display: flex; justify-content: space-between; gap: var(--e-2); font-size: 12px; line-height: 1.3; color: var(--nota); }
#stc .medidor__msj { font-size: 13px; line-height: 1.4; color: var(--tinta-2); }
#stc .cal__titulo { font-size: 19px; line-height: 1.35; }
#stc .aviso-linea { margin-top: var(--e-3); padding: var(--e-2) var(--e-3); background: var(--panel-2); border-left: 3px solid var(--aviso); border-radius: 0 var(--r-s) var(--r-s) 0; color: var(--tinta); font-size: 15px; }
#stc .cal__lista { margin-top: var(--e-3); }
#stc .mercado[aria-busy="true"] .cal__lista { min-height: 320px; }
#stc .cal__vacio { margin-top: var(--e-4); color: var(--tinta-2); }
#stc .cal__pasados { border-bottom: 1px solid var(--filete-suave); }
#stc .cal__pasados > summary {
list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: var(--e-3);
min-height: 48px; color: var(--tinta); font: 500 16px/1.35 var(--f-display);
}
#stc .cal__pasados > summary::-webkit-details-marker { display: none; }
#stc .cal__pasados > summary::after {
content: ""; flex: none; width: 9px; height: 9px; margin-right: 4px;
border-right: 2px solid var(--enlace); border-bottom: 2px solid var(--enlace);
transform: translateY(-3px) rotate(45deg); transition: transform .2s var(--ease);
}
#stc .cal__pasados[open] > summary::after { transform: translateY(2px) rotate(-135deg); }
#stc .cal__pasados > summary:hover { color: var(--enlace); }
#stc .cal__dias { list-style: none; }
#stc .cal__dia { margin-top: var(--e-4); }
#stc .cal__dia-titulo { padding-bottom: var(--e-2); border-bottom: 1px solid var(--filete-suave); color: var(--nota); font: 600 13px/1.4 var(--f-texto); letter-spacing: .06em; text-transform: uppercase; }
#stc .cal__eventos { list-style: none; }
#stc .ev { display: grid; gap: 4px; padding-block: var(--e-3); border-bottom: 1px solid var(--filete-suave); }
#stc .ev__hora { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--e-2); font-size: 14px; color: var(--tinta-2); font-variant-numeric: tabular-nums; }
#stc .ev__hora time { color: var(--tinta); font-weight: 600; }
#stc .ev__prox { margin-left: auto; padding: 1px 8px; border: 1px solid var(--enlace); border-radius: var(--r-pill); color: var(--enlace); font: 600 12px/1.5 var(--f-texto); letter-spacing: .06em; text-transform: uppercase; }
#stc .ev__titulo { color: var(--tinta); font: 500 17px/1.35 var(--f-display); }
#stc .ev__datos { display: flex; flex-wrap: wrap; gap: 2px var(--e-5); margin: 0; font-size: 14px; }
#stc .ev__datos div { display: flex; gap: 6px; }
#stc .ev__datos dt { color: var(--nota); }
#stc .ev__datos dd { margin: 0; color: var(--tinta); font-weight: 600; font-variant-numeric: tabular-nums; }
#stc .ev__sorpresa { font-size: 14px; color: var(--tinta-2); }
#stc .mercado__respaldo { margin-bottom: var(--e-2); color: var(--tinta-2); font-size: 17px; }
#stc .mercado__cta { margin-top: var(--e-6); width: 100%; padding-block: .75em; line-height: 1.25; text-align: center; }
#stc .mercado__nota { margin-top: var(--e-3); font-size: 15px; color: var(--nota); }
#stc .mercado__aviso { margin-top: var(--e-4); padding-top: var(--e-4); border-top: 1px solid var(--filete-suave); font-size: 15px; color: var(--tinta-2); }
#stc .mercado__pie p { margin-top: var(--e-2); font-size: 13px; line-height: 1.5; color: var(--nota); }
@media (min-width: 640px) { #stc .mercado__cta { width: auto; } }
@media (min-width: 960px) {
#stc .mercado__rejilla { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--e-8); align-items: start; }
#stc .mercado__intro { position: sticky; top: calc(var(--alto-cabecera) + var(--e-6)); }
}
#stc .ruta { position: relative; list-style: none; display: grid; gap: var(--e-4); padding-left: 36px; }
#stc .etapa {
--nodo-x: -24px; --nodo-y: 42px;
position: relative; display: flex; flex-direction: column; gap: var(--e-3); padding: var(--e-5);
background: var(--panel); border: 1px solid var(--filete); border-radius: var(--r-l); box-shadow: var(--sombra-1);
}
#stc .etapa:nth-child(1) { --de: var(--turquesa-1); --a: var(--cota-2); }
#stc .etapa:nth-child(2) { --de: var(--cota-2); --a: var(--cota-4); }
#stc .etapa:nth-child(3) { --de: var(--cota-4); --a: var(--turquesa-3); }
#stc .etapa:not(:last-child)::before {
content: ""; position: absolute; left: calc(var(--nodo-x) - 1px); top: var(--nodo-y);
width: 2px; height: calc(100% + var(--e-4) + 2px); background: linear-gradient(var(--de), var(--a));
}
#stc .etapa__nodo {
position: absolute; left: var(--nodo-x); top: var(--nodo-y); z-index: 1; width: 12px; height: 12px;
border-radius: 50%; background: var(--fondo); border: 2px solid var(--borde-control); transform: translate(-50%, -50%);
}
#stc .etapa--nova .etapa__nodo { width: 14px; height: 14px; border: 0; background: var(--tinta); }
#stc .etapa__cabeza { display: flex; flex-direction: column; align-items: flex-start; gap: var(--e-2); }
#stc .etapa__num { color: var(--tinta); font: 700 36px/1 var(--f-display); letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
#stc .etapa__nivel { font-size: var(--t-rotulo); font-weight: 500; color: var(--nota); }
#stc .etapa h3 { font-size: 20px; line-height: 1.25; }
#stc .etapa__texto { font-size: 16px; line-height: 1.55; }
@media (min-width: 1100px) {
#stc .ruta { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--e-5); padding: 40px 0 0; }
#stc .etapa { --nodo-x: 31px; --nodo-y: -21px; }
#stc .etapa:not(:last-child)::before {
left: var(--nodo-x); top: calc(var(--nodo-y) - 1px);
width: calc(100% + var(--e-5) + 2px); height: 2px; background: linear-gradient(90deg, var(--de), var(--a));
}
}
@media (prefers-contrast: more) { #stc .etapa::before { background: var(--borde-control) !important; } }
#stc .temario { display: grid; gap: var(--e-5); margin-top: var(--e-8); padding-top: var(--e-7); border-top: 1px solid var(--filete-suave); }
#stc .temario__titulo { font-size: clamp(24px, 19.2px + 1vw, 32px); }
#stc .temario__lista { display: grid; margin: 0; }
#stc .temario__lista > div { display: grid; align-content: start; gap: var(--e-1); padding-block: var(--e-4); border-top: 1px solid var(--filete-suave); }
#stc .temario__lista dt { color: var(--tinta); font: 600 18px/1.3 var(--f-display); }
#stc .temario__lista dd { margin: 0; }
@media (min-width: 760px) { #stc .temario__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--e-7); } }
@media (min-width: 960px) { #stc .temario { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--e-8); align-items: start; } }
#stc .cursos__pie { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-3) var(--e-5); margin-top: var(--e-7); }
#stc .cursos__pie p { max-width: 62ch; }
#stc .funciona { display: grid; gap: var(--e-7); }
#stc .capturas { margin: 0; }
#stc .capturas__marco { overflow: hidden; background: var(--fondo); border: 1px solid var(--filete); border-radius: var(--r-l); box-shadow: var(--sombra-2); }
#stc .capturas__marco img { width: 100%; }
#stc .capturas__chica { display: none; }
#stc .funciona__pie { margin-top: var(--e-3); font-size: var(--t-rotulo); color: var(--nota); }
#stc .pasos { list-style: none; }
#stc .paso { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--e-2) var(--e-4); padding-block: var(--e-5); border-top: 1px solid var(--filete-suave); }
#stc .paso:last-child { border-bottom: 1px solid var(--filete-suave); }
#stc .paso__num {
grid-row: span 2; width: 32px; height: 32px; display: grid; place-items: center;
border: 1px solid var(--borde-control); border-radius: 50%;
color: var(--tinta); font: 600 15px/1 var(--f-display);
}
#stc .paso h3 { align-self: center; font-size: 22px; }
#stc .paso p { grid-column: 2; }
@media (min-width: 960px) {
#stc .funciona { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--e-8); align-items: start; }
#stc .capturas { position: sticky; top: calc(var(--alto-cabecera) + var(--e-6)); }
#stc .capturas__lienzo { position: relative; aspect-ratio: 100 / 68; }
#stc .capturas__principal { width: 90%; }
#stc .capturas__chica { display: block; position: absolute; border-radius: var(--r-m); }
#stc .capturas__chica--1 { right: 0; top: 48%; width: 44%; }
#stc .capturas__chica--2 { left: 5%; bottom: 0; width: 50%; }
#stc .paso { padding-block: var(--e-6); }
}
#stc .manifiesto .seccion__cabeza { margin-bottom: var(--e-6); }
#stc .limites { list-style: none; border-bottom: 1px solid var(--filete-suave); }
#stc .limites li { display: grid; gap: var(--e-2); padding-block: var(--e-5); border-top: 1px solid var(--filete-suave); }
#stc .limites strong { color: var(--tinta); font: 600 clamp(24px, 16.8px + 1.9vw, 42px)/1.12 var(--f-display); letter-spacing: -0.018em; text-wrap: balance; }
#stc .limites span { max-width: 56ch; font-size: 18px; line-height: 1.55; color: var(--tinta-2); }
#stc .manifiesto__cierre { margin-top: var(--e-7); color: var(--tinta); font: 600 clamp(24px, 16.8px + 1.9vw, 42px)/1.12 var(--f-display); letter-spacing: -0.018em; text-wrap: balance; }
#stc .limites__nota { margin-top: var(--e-5); max-width: 62ch; font-size: 15px; color: var(--nota); }
#stc .limites__nota strong { font-weight: 500; }
@media (min-width: 960px) {
#stc .manifiesto { padding-top: var(--e-10); }
#stc .limites li { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--e-7); align-items: baseline; padding-block: var(--e-6); }
}
#stc .planes-centro { max-width: calc(720px + 2 * var(--gutter)); }
#stc .planes-centro .seccion__cabeza { margin-inline: auto; text-align: center; }
#stc .planes-centro .seccion__entradilla { margin-inline: auto; }
#stc .planes { display: grid; gap: var(--e-4); grid-template-columns: minmax(0, 1fr); }
#stc .plan { display: flex; flex-direction: column; gap: var(--e-4); padding: var(--e-6); background: var(--fondo); border: 1px solid var(--filete); border-radius: var(--r-m); }
#stc .plan--destacado { border-color: var(--primario-filete); }
#stc .plan__nombre { font-size: 20px; }
#stc .plan__precio { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--e-2); }
#stc .plan__cifra { color: var(--tinta); font: 600 28px/1.1 var(--f-texto); font-variant-numeric: tabular-nums; }
#stc .plan__periodo { color: var(--nota); }
#stc .plan__nota { margin-top: calc(-1 * var(--e-2)); font-size: 14px; color: var(--nota); }
#stc .planes__estado { margin: var(--e-5) auto 0; max-width: 60ch; padding: var(--e-3) var(--e-4); background: var(--fondo); border: 1px solid var(--filete); border-radius: var(--r-m); color: var(--tinta-2); font-size: 15px; text-align: left; }
#stc .plan .btn { margin-top: auto; }
#stc .incluye { margin-top: var(--e-6); }
#stc .incluye h3 { font-size: 18px; }
#stc .incluye ul { list-style: none; margin-top: var(--e-3); border-top: 1px solid var(--filete-suave); }
#stc .incluye li { position: relative; padding: var(--e-3) 0 var(--e-3) var(--e-5); border-bottom: 1px solid var(--filete-suave); }
#stc .incluye li::before { content: ""; position: absolute; left: 4px; top: calc(var(--e-3) + .72em); width: 6px; height: 6px; border-radius: 50%; background: var(--tinta-2); }
#stc .nota-pago { margin-top: var(--e-5); font-size: 15px; color: var(--nota); max-width: 62ch; }
@media (min-width: 640px) { #stc .planes { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); } }
#stc .canales { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-2) var(--e-5); }
#stc .canal { display: inline-flex; align-items: center; gap: var(--e-2); min-height: 44px; color: var(--tinta-2); font-weight: 500; text-decoration: none; }
#stc .canal svg { flex: none; }
#stc a.canal:not(.btn):hover { color: var(--tinta); text-decoration: underline; }
#stc .canal.btn { color: var(--tinta); }
#stc .recuadro-aviso { margin-top: var(--e-6); padding: var(--e-4) var(--e-5); background: var(--panel); border: 1px solid var(--filete); border-left: 3px solid var(--aviso); border-radius: var(--r-m); font-size: 15px; color: var(--tinta-2); }
#stc .preguntas { border-top: 1px solid var(--filete-suave); }
#stc .pregunta { border-bottom: 1px solid var(--filete-suave); }
#stc .pregunta > summary {
list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: var(--e-4);
padding-block: var(--e-5); color: var(--tinta); font: 500 18px/1.35 var(--f-display);
}
#stc .pregunta > summary::-webkit-details-marker { display: none; }
#stc .pregunta > summary::after {
content: ""; flex: none; width: 10px; height: 10px; margin-right: 4px;
border-right: 2px solid var(--enlace); border-bottom: 2px solid var(--enlace);
transform: translateY(-3px) rotate(45deg); transition: transform .2s var(--ease);
}
#stc .pregunta[open] > summary::after { transform: translateY(2px) rotate(-135deg); }
#stc .pregunta > summary:hover { color: var(--enlace); }
#stc .pregunta > summary:focus-visible,#stc .cal__pasados > summary:focus-visible { outline-offset: 4px; border-radius: 4px; }
#stc .pregunta__respuesta { max-width: 65ch; padding-bottom: var(--e-5); }
#stc .pregunta__respuesta p + p { margin-top: var(--e-3); }
@supports (interpolate-size: allow-keywords) {
@media (prefers-reduced-motion: no-preference) {
#stc { interpolate-size: allow-keywords; }
#stc .pregunta::details-content { height: 0; overflow: clip; transition: height .25s var(--ease), content-visibility .25s allow-discrete; }
#stc .pregunta[open]::details-content { height: auto; }
}
}
#stc .cierre { padding-block: 0 var(--seccion); }
#stc .cierre__banda {
max-width: 880px; margin-inline: auto; padding: var(--e-8) var(--e-5); text-align: center;
border-radius: var(--r-l); background: var(--difuminado-banda); border: 1px solid var(--filete-suave);
}
#stc .cierre__banda h2 { color: var(--tinta); }
#stc .cierre__banda p { margin: var(--e-4) auto 0; max-width: 44ch; color: var(--tinta); font-size: 18px; }
#stc .cierre__banda .btn { margin-top: var(--e-6); }
@media (prefers-contrast: more) { #stc .cierre__banda { background: var(--panel); } }
@media (min-width: 960px) { #stc .cierre__banda { padding: var(--e-9) var(--e-8); } }
#stc .pie { padding-block: var(--e-9) var(--e-7); border-top: 1px solid var(--filete-suave); }
#stc .pie__frase { max-width: 20ch; color: var(--tinta); font: 600 clamp(28px, 18.4px + 2.6vw, 48px)/1.06 var(--f-display); letter-spacing: -0.02em; text-wrap: balance; }
#stc .pie__riesgo { margin-top: var(--e-6); max-width: 78ch; font-size: 15px; color: var(--nota); }
#stc .pie__riesgo + .pie__riesgo { margin-top: var(--e-3); }
#stc .pie__meta { display: grid; gap: var(--e-6); margin-top: var(--e-8); padding-top: var(--e-6); border-top: 1px solid var(--filete-suave); }
#stc .pie__marca { justify-self: start; padding: var(--e-1); margin-left: calc(-1 * var(--e-1)); border-radius: var(--r-s); font-size: 22px; }
#stc .pie__grupo { display: grid; gap: var(--e-2); align-content: start; }
#stc .pie__titulo { font-size: var(--t-rotulo); font-weight: 500; color: var(--nota); }
#stc .pie__enlaces { list-style: none; display: flex; flex-wrap: wrap; gap: var(--e-1) var(--e-5); }
#stc .pie__enlaces a { display: inline-flex; align-items: center; min-height: 32px; color: var(--tinta-2); text-decoration: none; }
#stc .pie__enlaces a:hover { color: var(--tinta); text-decoration: underline; }
#stc .pie__empresa { font-size: var(--t-rotulo); color: var(--nota); }
@media (min-width: 640px) { #stc .pie__meta { grid-template-columns: repeat(2, minmax(0, 1fr)); } #stc .pie__marca { grid-column: 1 / -1; } }
@media (min-width: 1100px) {
#stc .pie__meta { grid-template-columns: auto repeat(3, minmax(0, 1fr)) minmax(0, 1.5fr); gap: var(--e-7); align-items: start; }
#stc .pie__marca { grid-column: auto; }
#stc .pie__enlaces { flex-direction: column; gap: 0; }
}
#stc .legal { padding-block: var(--e-8) var(--seccion); }
#stc .legal__cabeza { max-width: 736px; margin-bottom: var(--e-7); }
#stc .legal__cabeza h1 { font-size: var(--t-h2); line-height: 1.08; letter-spacing: -0.018em; }
#stc .legal__cabeza p { margin-top: var(--e-4); font-size: 18px; }
#stc .legal__rejilla { display: grid; gap: var(--e-7); }
#stc .indice { padding: var(--e-4); background: var(--panel); border: 1px solid var(--filete); border-radius: var(--r-m); }
#stc .indice__titulo { margin-bottom: var(--e-2); font-size: var(--t-rotulo); font-weight: 500; color: var(--nota); }
#stc .indice ol { list-style: none; display: grid; gap: 2px; }
#stc .indice a { display: block; padding: 6px 10px; border-radius: var(--r-s); color: var(--tinta-2); text-decoration: none; line-height: 1.35; }
#stc .indice a:hover { background: var(--filete-suave); color: var(--tinta); }
#stc .texto-legal { max-width: 72ch; }
#stc .texto-legal > section { padding-top: var(--e-7); margin-top: var(--e-7); border-top: 1px solid var(--filete-suave); }
#stc .texto-legal > section:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
#stc .texto-legal h2 { font-size: clamp(24px, 20px + 1vw, 32px); line-height: 1.15; letter-spacing: -0.012em; }
#stc .texto-legal h3 { margin-top: var(--e-6); font-size: 19px; }
#stc .texto-legal p,#stc .texto-legal ul,#stc .texto-legal ol { margin-top: var(--e-3); }
#stc .texto-legal ul,#stc .texto-legal ol { padding-left: 1.25em; }
#stc .texto-legal li + li { margin-top: var(--e-2); }
#stc .texto-legal li::marker { color: var(--nota); }
#stc .texto-legal code { font: .9em var(--f-mono); color: var(--tinta); overflow-wrap: anywhere; }
#stc .legal__cabeza .version { margin-top: var(--e-3); font-size: var(--t-rotulo); color: var(--nota); }
#stc .texto-legal .destacado { padding: var(--e-4) var(--e-5); background: var(--panel); border: 1px solid var(--filete); border-radius: var(--r-m); }
@media (min-width: 960px) {
#stc .legal__rejilla { grid-template-columns: 250px minmax(0, 1fr); gap: var(--e-9); align-items: start; }
#stc .indice { position: sticky; top: calc(var(--alto-cabecera) + var(--e-6)); }
}
#stc .no-existe { padding-block: var(--e-9) var(--seccion); }
#stc .no-existe p { margin-top: var(--e-4); max-width: 52ch; font-size: 18px; }
#stc .no-existe__acciones { display: flex; flex-wrap: wrap; gap: var(--e-3); margin-top: var(--e-6); }
#stc {
--alto-cabecera: 64px;
--f-mono: ui-monospace, "Cascadia Mono", Consolas, monospace;
}
#stc { padding-top: var(--alto-cabecera); text-align: left; letter-spacing: normal; }
#stc h1,#stc h2,#stc h3,#stc h4 { color: var(--tinta) !important; text-transform: none; }
#stc p,#stc li,#stc dd,#stc dt,#stc label,#stc summary,#stc figcaption { font-family: var(--f-texto); }
#stc a { box-shadow: none; }
#stc .btn,#stc .btn:hover,#stc .btn:focus { text-decoration: none; }
#stc .btn { color: var(--sobre-acento) !important; }
#stc .btn--sec,#stc .btn--sec:hover { color: var(--tinta) !important; }
#stc .btn--fantasma,#stc .btn--fantasma:hover { color: var(--enlace) !important; }
#stc input,#stc select,#stc textarea,#stc button { font: inherit; letter-spacing: normal; }
#stc .cabecera { position: fixed; top: 0; left: 0; right: 0; z-index: 900; }
#stc .cabecera__crear { display: none; }
#stc .lockup__simbolo { height: 1.26em; width: auto; }
#stc .cabecera__marca .lockup__nombre { font-size: 16px; }
@media (min-width: 520px) { #stc .cabecera__crear { display: inline-flex; } #stc .cabecera__marca .lockup__nombre { font-size: inherit; } }
@media (max-width: 419px) { #stc .cabecera__acciones > .btn { display: none; } }
#stc .menu-movil__acciones .btn:first-child { flex-basis: 100%; }
#stc .heroe__marca { margin-bottom: var(--e-4); color: var(--enlace); font: 600 14px/1.4 var(--f-texto); letter-spacing: .08em; text-transform: uppercase; }
#stc .heroe__visual { order: 0; margin-top: var(--e-6); }
#stc .orbita {
--d: min(calc(100vw - 2 * var(--gutter)), 360px);
--t: 54px;
--vuelta: 140s;
position: relative; width: var(--d); aspect-ratio: 1 / 1; margin-inline: auto;
}
#stc .orbita::before {
content: ""; position: absolute; inset: 14%; border-radius: 50%; pointer-events: none;
background: radial-gradient(50% 50% at 50% 50%, var(--luz-2));
}
#stc .orbita__anillo { position: absolute; inset: calc(var(--t) / 2); border-radius: 50%; border: 1px solid var(--filete); }
#stc .orbita__anillo::after {
content: ""; position: absolute; inset: -1px; border-radius: 50%;
background: conic-gradient(from 0deg, transparent 0 62%, rgba(60,254,202,.0) 62%, #3CFECA 84%, #1A92C6 100%);
-webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1.5px));
mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1.5px));
animation: stc-girar 18s linear infinite;
}
#stc .orbita__nucleo { position: absolute; left: 50%; top: 50%; width: 40%; height: auto; transform: translate(-50%, -50%); }
#stc .orbita__lista { position: absolute; inset: 0; margin: 0; padding: 0; list-style: none; animation: stc-girar var(--vuelta) linear infinite; }
#stc .orbita__item {
position: absolute; left: 50%; top: 50%; width: var(--t); height: var(--t); margin: calc(var(--t) / -2) 0 0 calc(var(--t) / -2);
transform: rotate(calc(var(--i) * 40deg - 90deg)) translateX(calc(var(--d) / 2 - var(--t) / 2)) rotate(calc(var(--i) * -40deg + 90deg));
}
#stc .orbita__enlace { position: relative; display: block; width: 100%; height: 100%; border-radius: 50%; animation: stc-girar var(--vuelta) linear infinite reverse; }
#stc .orbita__ico { width: 100%; height: 100%; object-fit: contain; transition: transform .35s var(--ease); }
#stc .orbita__enlace:hover .orbita__ico,#stc .orbita__enlace:focus-visible .orbita__ico { transform: scale(1.14); }
#stc .orbita__enlace:focus-visible { outline: none; box-shadow: var(--foco); }
#stc .orbita__nombre {
position: absolute; left: 50%; top: 100%; z-index: 2; transform: translate(-50%, 4px);
padding: 4px 10px; white-space: nowrap; pointer-events: none;
background: var(--panel-2); border: 1px solid var(--filete); border-radius: var(--r-pill);
color: var(--tinta); font: 500 13px/1.3 var(--f-texto);
opacity: 0; transition: opacity .2s var(--ease), transform .2s var(--ease);
}
#stc .orbita__enlace:hover .orbita__nombre,#stc .orbita__enlace:focus-visible .orbita__nombre { opacity: 1; transform: translate(-50%, 8px); }
#stc .orbita:hover .orbita__lista,#stc .orbita:hover .orbita__enlace,#stc .orbita:focus-within .orbita__lista,#stc .orbita:focus-within .orbita__enlace { animation-play-state: paused; }
@keyframes stc-girar { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
#stc .orbita__lista,#stc .orbita__enlace,#stc .orbita__anillo::after { animation: none !important; }
}
@media (min-width: 960px) {
#stc .heroe { padding-block: var(--e-8) var(--e-9); }
#stc .heroe__visual { margin-top: 0; }
#stc .orbita { --d: min(40vw, 520px); --t: 92px; }
}
@media (max-width: 959px) { #stc .heroe::before { inset: auto 0 0 0; height: 60%; background: radial-gradient(60% 50% at 50% 60%, var(--luz-2)); } }
#stc .ruta { margin-top: 0; }
@media (min-width: 1100px) { #stc .ruta { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
#stc .ciclo { display: grid; gap: var(--e-3); margin-top: var(--e-7); padding: var(--e-5); background: var(--panel); border: 1px solid var(--filete); border-radius: var(--r-l); }
#stc .ciclo__paso { display: flex; align-items: center; gap: var(--e-3); color: var(--tinta); font-weight: 500; }
#stc .ciclo__num { flex: none; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--borde-control); color: var(--tinta); font: 600 15px/1 var(--f-display); }
#stc .ciclo__paso:nth-child(2) .ciclo__num { border: 0; background: var(--degradado); color: var(--sobre-acento); }
@media (min-width: 760px) {
#stc .ciclo { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e-5); }
#stc .ciclo__paso:not(:last-child)::after { content: ""; flex: 1 1 auto; height: 1px; margin-left: var(--e-2); background: var(--filete); }
}
#stc .mercados__rejilla { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--e-4); grid-template-columns: minmax(0, 1fr); }
#stc .ficha {
position: relative; display: flex; flex-direction: column; gap: var(--e-2); padding: var(--e-5) var(--e-5) var(--e-5);
background: var(--panel); border: 1px solid var(--filete); border-radius: var(--r-l); box-shadow: var(--sombra-1);
scroll-margin-top: calc(var(--alto-cabecera) + var(--e-5));
}
#stc .ficha::before {
content: ""; position: absolute; left: 0; top: 0; width: 200px; height: 160px; pointer-events: none; border-radius: var(--r-l) 0 0 0;
background: radial-gradient(70% 70% at 30% 35%, rgba(31,209,214,.10), transparent 72%);
}
#stc .ficha__ico { position: relative; width: 104px; height: 104px; margin: -8px 0 var(--e-2) -10px; }
#stc .ficha h3 { position: relative; font-size: 20px; line-height: 1.25; }
#stc .ficha p { font-size: 16px; line-height: 1.55; color: var(--tinta-2); }
#stc .ficha__estado { display: inline-flex; align-items: center; gap: var(--e-2); margin-top: auto; padding-top: var(--e-3); font-size: var(--t-rotulo) !important; }
#stc .ficha__estado::before { content: ""; flex: none; width: 10px; height: 10px; border-radius: 50%; }
#stc .ficha:target { border-color: var(--borde-control); }
#stc .ficha--integral { border-color: var(--borde-control); }
#stc .mercados__nota { margin-top: var(--e-6); max-width: 70ch; font-size: 15px; color: var(--nota); }
@media (min-width: 640px) { #stc .mercados__rejilla { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { #stc .mercados__rejilla { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e-5); } }
#stc .formatos { display: grid; gap: var(--e-4); }
#stc .formato { display: flex; flex-direction: column; gap: var(--e-4); padding: var(--e-6); background: var(--panel); border: 1px solid var(--filete); border-radius: var(--r-l); }
#stc .formato h3 { font-size: 24px; }
#stc .formato__cta { align-self: flex-start; }
@media (min-width: 760px) { #stc .formatos { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-5); } }
#stc #comunidad .seccion__cabeza,#stc #community .seccion__cabeza { margin-bottom: var(--e-6); }
#stc .contacto { padding: var(--e-6) var(--e-5); background: var(--panel); border: 1px solid var(--filete); border-radius: var(--r-l); scroll-margin-top: calc(var(--alto-cabecera) + var(--e-5)); }
#stc .contacto__titulo { font-size: 28px; }
#stc .contacto__texto { margin-top: var(--e-3); }
#stc .formulario { display: grid; gap: var(--e-4); margin-top: var(--e-5); }
#stc .campo { display: grid; gap: 6px; }
#stc .campo label { color: var(--tinta); font-size: 15px; font-weight: 500; }
#stc .campo input,#stc .campo select,#stc .campo textarea {
width: 100%; min-height: 48px; margin: 0; padding: 10px 14px;
background: var(--fondo); color: var(--tinta); border: 1px solid var(--borde-control); border-radius: var(--r-s);
font-size: 16px; line-height: 1.4; box-shadow: none; appearance: none;
}
#stc .campo select {
padding-right: 40px; cursor: pointer;
background-image: linear-gradient(45deg, transparent 50%, #6FE6DE 50%), linear-gradient(135deg, #6FE6DE 50%, transparent 50%);
background-position: calc(100% - 20px) 21px, calc(100% - 15px) 21px; background-size: 5px 5px; background-repeat: no-repeat;
}
#stc .campo select option { background: var(--panel-2); color: var(--tinta); }
#stc .campo textarea { min-height: 128px; resize: vertical; }
#stc .campo input:focus-visible,#stc .campo select:focus-visible,#stc .campo textarea:focus-visible { outline: none; border-color: var(--enlace); box-shadow: var(--foco); }
#stc .campo [aria-invalid="true"] { border-color: var(--peligro); }
#stc .campo__error { min-height: 0; color: var(--peligro); font-size: 14px; }
#stc .campo__error:empty { display: none; }
#stc .formulario__enviar { justify-self: start; }
#stc .formulario__estado { color: var(--tinta); font-size: 15px; }
#stc .formulario__estado:empty { display: none; }
#stc .formulario__privacidad { font-size: 14px; color: var(--nota); }
@media (min-width: 960px) { #stc .contacto { padding: var(--e-7); } }
#stc .aviso-legal { padding-block: var(--e-8); border-top: 1px solid var(--filete-suave); scroll-margin-top: var(--alto-cabecera); }
#stc .aviso-legal__titulo { font-size: 24px; }
#stc .aviso-legal__texto { margin-top: var(--e-5); }
#stc .aviso-legal__texto p { margin-top: var(--e-3); font-size: 14px; line-height: 1.6; color: var(--nota); break-inside: avoid; }
#stc .aviso-legal__texto p:first-child { margin-top: 0; }
#stc .aviso-legal__texto strong { color: var(--tinta-2); }
@media (min-width: 960px) { #stc .aviso-legal__texto { columns: 2; column-gap: var(--e-8); } }
@media (min-width: 1100px) {
#stc .pie__meta { grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.4fr) minmax(0, 1.4fr); gap: var(--e-6); }
#stc .pie__marca { grid-column: 1 / -1; }
}
#stc .etapa__cursos { flex-direction: column; flex-wrap: nowrap; gap: var(--e-2); margin-top: auto; padding-top: var(--e-4); border-top: 1px solid var(--filete-suave); font-size: 15px; }
#stc .etapa__cursos li { align-items: flex-start; }
#stc .etapa__cursos li::before { margin-top: .4em; }
#stc .ciclo__nota { margin-top: var(--e-4); max-width: 72ch; font-size: 15px; color: var(--nota); }
#stc .antetitulo { display: flex; align-items: center; gap: 12px; }
#stc .antetitulo::before {
content: ""; flex: none; width: 40px; height: 8px;
background: radial-gradient(circle at calc(100% - 4px) 50%, #F5F7F8 3px, transparent 3.5px),
linear-gradient(90deg, #3CFECA, #1A92C6) left center / calc(100% - 10px) 2px no-repeat;
}
@media (prefers-contrast: more) { #stc .antetitulo::before { background: var(--borde-control); height: 2px; } }
#stc .etapa__nodo { background: var(--fondo) !important; border: 2px solid var(--borde-control) !important; width: 12px !important; height: 12px !important; }
#stc .etapa { transition: border-color .25s var(--ease); }
#stc .ciclo__rotulo { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-2) var(--e-3); margin-top: var(--e-7); color: var(--tinta); font-weight: 600; }
#stc .ciclo__estado { display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px; border: 1px solid var(--borde-control); border-radius: var(--r-pill); color: var(--tinta-2); font-size: 13px; font-weight: 500; }
#stc .ciclo__estado::before { content: ""; width: 8px; height: 8px; border-radius: 50%; border: 1.5px solid var(--nota); }
#stc .ciclo__rotulo + .ciclo { margin-top: var(--e-3); }
#stc .mercados { background: radial-gradient(70% 45% at 50% 0%, rgba(31,209,214,.09), transparent 70%), var(--fondo); }
#stc .mercados .seccion__cabeza { max-width: 832px; }
#stc .ficha { overflow: hidden; padding: var(--e-5); gap: var(--e-2); }
#stc .ficha::before { display: none; }
#stc .ficha::after {
content: ""; position: absolute; left: -20px; top: -30px; width: 240px; height: 220px; pointer-events: none; z-index: 0;
background: radial-gradient(50% 50% at 50% 50%, rgba(31,209,214,.11), transparent 70%);
}
#stc .ficha > * { position: relative; z-index: 1; }
#stc .ficha__ico { width: 128px; height: 128px; margin: -12px 0 0 -14px; transition: transform .45s var(--ease); }
#stc .ficha:hover .ficha__ico { transform: translateY(-4px) scale(1.04); }
@media (min-width: 640px) {
#stc .mercados__rejilla { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#stc .ficha--grande,#stc .ficha--ancha,#stc .ficha--banda { grid-column: 1 / -1; }
}
@media (min-width: 1000px) {
#stc .mercados__rejilla { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--e-4); }
#stc .ficha--grande { grid-column: span 2; grid-row: span 2; padding: var(--e-7); justify-content: flex-end; }
#stc .ficha--grande .ficha__ico { width: 240px; height: 240px; margin: 0 0 auto -20px; }
#stc .ficha--grande::after { width: 460px; height: 420px; left: -40px; top: -40px; }
#stc .ficha--grande h3 { font-size: 32px; letter-spacing: -.015em; }
#stc .ficha--grande p { font-size: 18px; max-width: 34ch; }
#stc .ficha--ancha { grid-column: span 2; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--e-4); align-content: center; }
#stc .ficha--ancha .ficha__ico { grid-row: span 2; margin: -6px 0 -6px -10px; width: 144px; height: 144px; }
#stc .ficha--ancha h3 { align-self: end; }
#stc .ficha--banda { grid-column: 1 / -1; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--e-6); align-items: center; padding: var(--e-5) var(--e-7); }
#stc .ficha--banda .ficha__ico { grid-row: span 2; margin: -10px 0; }
#stc .ficha--banda h3 { align-self: end; font-size: 24px; }
#stc .ficha--banda p { max-width: 60ch; }
}
#stc .ficha--banda { border-color: var(--borde-control); background: linear-gradient(100deg, rgba(31,209,214,.07), transparent 45%), var(--panel); }
#stc .capturas__marco,#stc .ventana { border-radius: var(--r-l); overflow: hidden; background: var(--panel); border: 1px solid var(--filete); box-shadow: var(--sombra-2); }
#stc .capturas__marco::before,#stc .ventana::before {
content: ""; display: block; height: 30px; border-bottom: 1px solid var(--filete);
background: radial-gradient(circle at 18px 15px, #3A4448 4.5px, transparent 5px),
radial-gradient(circle at 36px 15px, #3A4448 4.5px, transparent 5px),
radial-gradient(circle at 54px 15px, #3A4448 4.5px, transparent 5px), var(--panel-2);
}
#stc .capturas__marco img,#stc .ventana img { display: block; width: 100%; height: auto; }
@media (min-width: 960px) {
#stc .capturas__lienzo { aspect-ratio: auto !important; display: grid; grid-template-columns: 1fr 1fr; gap: var(--e-4); align-items: start; }
#stc .capturas__principal { width: auto !important; grid-column: 1 / -1; }
#stc .capturas__chica { position: static !important; width: auto !important; }
}
#stc .mercado__respaldo { display: grid; gap: var(--e-3); margin-bottom: var(--e-2); color: var(--tinta-2); font-size: 17px; }
#stc .ejemplo { margin: 0; }
#stc .ejemplo figcaption { margin-top: var(--e-3); font-size: 14px; color: var(--nota); }
#stc .ejemplo__etq { display: inline-block; margin-right: 6px; padding: 1px 9px; border: 1px solid var(--borde-control); border-radius: var(--r-pill); color: var(--tinta); font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
#stc .formato { padding: var(--e-6) 0 0; background: none; border: 0; border-top: 1px solid var(--filete); border-radius: 0; }
#stc .formato h3 { font-size: clamp(24px, 19.2px + 1vw, 32px); letter-spacing: -.012em; }
#stc .formato p { max-width: 46ch; font-size: 17px; }
@media (min-width: 760px) { #stc .formatos { gap: var(--e-8); } }
#stc .contacto__correo { margin-top: var(--e-4); font-size: 15px; color: var(--tinta-2); }
@media (min-width: 960px) {
#stc #preguntas .dos-columnas,#stc #faq .dos-columnas { grid-template-columns: minmax(0, 1fr); max-width: calc(820px + 2 * var(--gutter)); gap: var(--e-6); }
}
#stc .cierre__banda { position: relative; overflow: hidden; isolation: isolate; }
#stc .cierre__banda::before {
content: ""; position: absolute; z-index: -1; width: 520px; height: 520px; right: -200px; top: -260px; border-radius: 50%;
background: conic-gradient(from 200deg, transparent 0 55%, #3CFECA 75%, #1A92C6 95%, transparent 100%);
-webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1.5px));
mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1.5px));
opacity: .8;
}
#stc .pie__riesgo a { color: var(--enlace); }
#stc .btn { transition: background .18s var(--ease), transform .18s var(--ease), box-shadow .18s var(--ease), border-color .18s var(--ease); }
#stc .btn:active { transition-duration: .06s; }
#stc .pregunta > summary { transition: color .18s var(--ease); }
#stc .canal { transition: color .18s var(--ease); }
.landing-block:has(#stc){padding:0!important;margin:0!important;background:#000!important}