/* KAIA · reproductor de los videos tutoriales (assets/kaia-video.js).
   Colores y tipos de videos/kaia-tutoriales/diseno/frame.md: navy #08121A, azul petróleo #14405F (el único acento),
   crema #F1EBE1, tinta #0F1518 / #4E5A63; Archivo, IBM Plex Sans e IBM Plex Mono. La única sombra es la de la
   «pantalla flotante», fría y nunca negra. Marco 16:9 con padding-top, sin aspect-ratio, inset ni gap en flex:
   la portada la abren televisores con Chromium 69-79. */
.kv{margin:0;min-width:0;max-width:100%;font-family:'IBM Plex Sans',system-ui,-apple-system,sans-serif;color:#0F1518;text-align:left}
.kv *{box-sizing:border-box;min-width:0}
.kv-marco{position:relative;width:100%;height:0;padding-top:56.25%;border-radius:18px;overflow:hidden;background:#08121A;
  border:1px solid rgba(15,21,24,.11);box-shadow:0 40px 80px -34px rgba(8,18,26,.55),0 14px 30px -18px rgba(8,18,26,.35)}
.kv-video{position:absolute;top:0;left:0;width:100%;height:100%;display:block;background:#08121A;object-fit:contain}
.kv-play{position:absolute;left:20px;bottom:20px;display:flex;align-items:center;margin:0;padding:8px 22px 8px 8px;
  border:1px solid rgba(241,235,225,.32);border-radius:999px;background:rgba(8,18,26,.88);color:#fff;cursor:pointer;
  font:500 15px/1.2 'IBM Plex Sans',system-ui,sans-serif;transition:background-color .2s ease,transform .2s ease}
.kv-play:hover{background:#14405F;transform:translateY(-1px)}
.kv-play:focus-visible{outline:3px solid #F1EBE1;outline-offset:3px}
.kv-play-icono{position:relative;flex:0 0 auto;width:44px;height:44px;margin-right:14px;border-radius:50%;background:#F1EBE1}
.kv-play-icono:after{content:'';position:absolute;top:50%;left:50%;margin:-8px 0 0 -4px;border-style:solid;border-width:8px 0 8px 13px;
  border-color:transparent transparent transparent #08121A}
.kv-play-texto b{margin-left:8px;font:500 13px/1 'IBM Plex Mono',ui-monospace,monospace;letter-spacing:.06em;color:#F1EBE1}
.kv-activo .kv-play{display:none}
.kv-pie{display:block;padding:16px 0 0}
.kv-capitulos{display:flex;flex-wrap:wrap;margin:0 -4px}
.kv-cap{display:inline-flex;align-items:baseline;margin:0 4px 8px;padding:8px 13px;border:1px solid rgba(15,21,24,.16);border-radius:999px;
  background:#fff;color:#0F1518;font:500 13px/1.3 'IBM Plex Sans',system-ui,sans-serif;text-align:left;cursor:pointer;transition:border-color .15s ease}
.kv-cap:hover{border-color:#14405F}
.kv-cap:focus-visible{outline:2px solid #14405F;outline-offset:2px}
.kv-cap-t{margin-right:8px;font:500 12px/1 'IBM Plex Mono',ui-monospace,monospace;letter-spacing:.04em;color:#14405F}
.kv-cap[aria-current="true"]{background:#14405F;border-color:#14405F;color:#fff}
.kv-cap[aria-current="true"] .kv-cap-t{color:#F1EBE1}
.kv-cap-inicio{border-style:dashed}
.kv-meta{margin:6px 0 0;font:500 11.5px/1.7 'IBM Plex Mono',ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;color:#4E5A63}
.kv-meta span{white-space:nowrap}
.kv-meta span:not(:last-child):after{content:'·';margin-left:9px;color:#87929A}
.kv-meta span+span{margin-left:4px}
.kv-voz{color:#0F1518}
.kv-transcripcion{margin-top:10px;font-size:14px;line-height:1.6}
.kv-transcripcion summary{display:inline-block;padding:6px 0;color:#14405F;font-weight:500;cursor:pointer;border-bottom:1px solid rgba(20,64,95,.35)}
.kv-transcripcion summary:focus-visible{outline:2px solid #14405F;outline-offset:3px}
.kv-transcripcion-texto{max-height:320px;overflow:auto;margin-top:12px;padding:16px 18px;border-radius:12px;background:rgba(20,64,95,.06);color:#4E5A63}
.kv-transcripcion-texto p{margin:0 0 12px}
.kv-transcripcion-texto p:last-child{margin-bottom:0}
.kv-transcripcion-texto strong{color:#0F1518;font-weight:600}
/* Variante oscura: la portada y cualquier fondo navy. */
.kv-oscuro{color:#F1EBE1}
.kv-oscuro .kv-marco{border-color:rgba(241,235,225,.14)}
.kv-oscuro .kv-cap{background:transparent;border-color:rgba(241,235,225,.24);color:#F1EBE1}
.kv-oscuro .kv-cap:hover{border-color:#F1EBE1}
.kv-oscuro .kv-cap:focus-visible{outline-color:#F1EBE1}
.kv-oscuro .kv-cap-t{color:rgba(241,235,225,.72)}
.kv-oscuro .kv-cap[aria-current="true"]{background:#F1EBE1;border-color:#F1EBE1;color:#08121A}
.kv-oscuro .kv-cap[aria-current="true"] .kv-cap-t{color:#14405F}
.kv-oscuro .kv-meta{color:rgba(241,235,225,.72)}
.kv-oscuro .kv-meta span:not(:last-child):after{color:rgba(241,235,225,.4)}
.kv-oscuro .kv-voz{color:#F1EBE1}
.kv-oscuro .kv-transcripcion summary{color:#F1EBE1;border-bottom-color:rgba(241,235,225,.4)}
.kv-oscuro .kv-transcripcion summary:focus-visible{outline-color:#F1EBE1}
.kv-oscuro .kv-transcripcion-texto{background:rgba(241,235,225,.06);color:rgba(241,235,225,.82)}
.kv-oscuro .kv-transcripcion-texto strong{color:#F1EBE1}
@media (max-width:600px){
  .kv-marco{border-radius:12px}
  .kv-play{left:12px;bottom:12px;padding:6px 16px 6px 6px;font-size:13px}
  .kv-play-icono{width:36px;height:36px;margin-right:10px}
  .kv-play-icono:after{margin:-7px 0 0 -4px;border-width:7px 0 7px 11px}
  .kv-cap{padding:7px 11px;font-size:12.5px}
  .kv-meta{font-size:10.5px;letter-spacing:.08em}
}
@media (prefers-reduced-motion:reduce){.kv-play,.kv-cap{transition:none}.kv-play:hover{transform:none}}
/* Sección con video (Network, registro de proveedores): texto a la izquierda, video a la derecha; una columna en el
   celular. */
.kv-seccion{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);grid-gap:48px;align-items:center;margin:56px 0 8px;scroll-margin-top:16px}
.kv-seccion-eyebrow{margin:0 0 14px!important;font:500 11px/1.5 'IBM Plex Mono',ui-monospace,monospace;letter-spacing:.16em;text-transform:uppercase;color:#14405F}
.kv-seccion h2{margin:0 0 14px;font:600 clamp(26px,2.6vw,36px)/1.15 Archivo,sans-serif;letter-spacing:-.025em;color:#0F1518}
.kv-seccion-texto p{font-size:15px;line-height:1.7;color:#4E5A63;margin:0 0 14px;max-width:46ch}
.kv-seccion-texto .kv-seccion-nota{font-size:13px;color:#5B6670}
.kv-seccion-texto a{color:#14405F;text-underline-offset:3px}
.kv-enlace{margin:14px 0 0}
.kv-enlace a{display:inline-flex;align-items:center;color:#14405F;font:500 14px/1.4 'IBM Plex Sans',system-ui,sans-serif;text-decoration:none;border-bottom:1px solid rgba(20,64,95,.35);padding:4px 0}
.kv-enlace a:hover{border-bottom-color:#14405F}
.kv-enlace-play{position:relative;flex:none;width:26px;height:26px;margin-right:10px;border-radius:50%;background:#14405F}
.kv-enlace-play:after{content:'';position:absolute;top:50%;left:50%;margin:-5px 0 0 -3px;border-style:solid;border-width:5px 0 5px 8px;border-color:transparent transparent transparent #fff}
@media (max-width:900px){.kv-seccion{grid-template-columns:minmax(0,1fr);grid-gap:22px;margin-top:40px}}
/* Sourcing: el video 03 en el inicio público (en lugar de la tarjeta de relleno) y en el registro de proveedores,
   donde la mitad derecha quedaba vacía. */
.sc-body .sc-welcome.con-video{grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);gap:56px;align-items:start}
.sc-body .sc-video-inicio .sc-eyebrow,.sc-body .sc-provider-video .sc-eyebrow{margin-bottom:14px}
.sc-body .sc-welcome .sc-video-inicio>.sc-video-demo{margin:14px 0 0;max-width:none;font-size:13px;line-height:1.6;color:#5B6670}
.sc-body .sc-video-demo a{color:#14405F;text-underline-offset:3px}
.sc-body .sc-provider-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);grid-gap:56px;align-items:start}
.sc-body .sc-provider-hero .sc-provider-intro{max-width:none}
.sc-body .sc-provider-hero .sc-provider-intro h1{font-size:clamp(40px,4vw,60px)}
@media (max-width:1150px){.sc-body .sc-welcome.con-video,.sc-body .sc-provider-hero{grid-gap:36px;gap:36px}}
@media (max-width:900px){.sc-body .sc-welcome.con-video,.sc-body .sc-provider-hero{grid-template-columns:minmax(0,1fr)}.sc-body .sc-provider-video{margin-top:4px}}