/* ═══════════════════════════════════════════════════════════════
   KEYONS · MANUAL DE MARCA
   Estilos propios del manual. Todo valor sale de tokens.css.
   El manual es la primera aplicación del sistema: si algo aquí
   rompe una regla, la regla o el manual están mal.
   ═══════════════════════════════════════════════════════════════ */

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr-h) + 32px);-webkit-text-size-adjust:100%}
body{
  font-family:var(--font-sans);font-size:16px;line-height:1.6;
  background:var(--color-bg);color:var(--color-text);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img,svg{display:block}
h1,h2,h3,.t-h2,.t-h3,.t-lead,.statement,.chap__t{text-wrap:balance}
p{text-wrap:pretty}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--color-brand-soft);color:var(--color-text)}
:focus-visible{outline:2px solid var(--k-noche);outline-offset:3px}

/* ═══ TIPOGRAFÍA ═══ */
.t-display{font-family:var(--font-display);font-weight:500;font-size:clamp(52px,8.6vw,128px);line-height:.93;letter-spacing:-.04em}
.t-h1{font-family:var(--font-display);font-weight:500;font-size:clamp(48px,6.4vw,96px);line-height:.96;letter-spacing:-.035em}
.t-h2{font-weight:500;font-size:clamp(28px,3.4vw,46px);line-height:1.08;letter-spacing:-.03em;color:var(--color-text-title-muted)}
/* Los títulos van en un solo color: no se destacan palabras sueltas sin motivo */
.t-h2 .mute{color:inherit}
/* Títulos de ítem y de categoría: Jakarta con peso propio, distinto del cuerpo */
.t-h3{font-weight:600;font-size:clamp(20px,2vw,26px);line-height:1.2;letter-spacing:-.02em}
.t-h4{font-weight:600;font-size:17px;line-height:1.35;letter-spacing:-.01em}
.t-lead{font-size:clamp(18px,1.5vw,21px);line-height:1.5;color:var(--color-text-2);letter-spacing:-.005em}
.t-body{font-size:16px;color:var(--color-text-2)}
.t-sm{font-size:14px;line-height:1.55;color:var(--color-text-3)}
.t-editorial{font-family:var(--font-display);font-weight:500;text-transform:uppercase;text-align:center;font-size:clamp(32px,5.6vw,80px);line-height:1.25;letter-spacing:-.025em;color:var(--color-text-title-muted)}
.t-num{font-variant-numeric:tabular-nums}
/* Destacado dentro del texto: semibold y Azul Noche, para guiar la lectura */
strong,b{font-weight:600;color:var(--color-text)}
.on-dark strong,.on-dark b{color:inherit}

/* Rótulo entre paréntesis: dato editorial, nunca título */
.paren{font-size:13px;font-weight:500;color:var(--color-text-2);font-variant-numeric:tabular-nums}

/* Kicker · TASA Orbiter en mayúsculas, precedido por la estrella de marca. */
.kicker{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-display);font-weight:500;font-size:13px;line-height:1;letter-spacing:.08em;text-transform:uppercase;
  color:var(--color-text);
}
.kicker::before{
  content:'';width:12px;height:12px;flex:0 0 auto;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='3.2 3.6 25.6 25.6'%3E%3Cpath fill-rule='evenodd' d='M22.53,28.42l-6.53-4.04-6.53,4.04-2.54-1.85,1.84-7.43-5.87-4.94.97-2.99,7.67-.55,2.9-7.09h3.14l2.9,7.09,7.67.55.97,2.99-5.87,4.94,1.84,7.43-2.53,1.85ZM16,20.48 L20.9,23.51 L19.52,17.93 L23.91,14.23 L18.17,13.82 L16,8.49 L13.83,13.82 L8.09,14.23 L12.48,17.93 L11.1,23.51 L16,20.48Z'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='3.2 3.6 25.6 25.6'%3E%3Cpath fill-rule='evenodd' d='M22.53,28.42l-6.53-4.04-6.53,4.04-2.54-1.85,1.84-7.43-5.87-4.94.97-2.99,7.67-.55,2.9-7.09h3.14l2.9,7.09,7.67.55.97,2.99-5.87,4.94,1.84,7.43-2.53,1.85ZM16,20.48 L20.9,23.51 L19.52,17.93 L23.91,14.23 L18.17,13.82 L16,8.49 L13.83,13.82 L8.09,14.23 L12.48,17.93 L11.1,23.51 L16,20.48Z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.on-dark .kicker{color:var(--color-text-inverse)}

/* ═══ REGLA DE ESQUINAS ═══
   Toda composición de 2+ elementos: el lado que toca el límite del
   conjunto termina recto, el que mira a otro elemento se curva.
   Un elemento solo lleva esquinas rectas.
   Los controles de una línea (botón, campo, badge) usan píldora. */
.grp{display:grid;gap:var(--gap)}
.grp--fusion{gap:var(--gap-fusion)}
.grp > *{border-radius:var(--r-none)}
.grp[data-r="component"] > *{--rr:var(--r-component)}
.grp[data-r="card"] > *{--rr:var(--r-card)}
.grp[data-r="block"] > *{--rr:var(--r-block)}
.grp--row > *:first-child{border-radius:0 var(--rr) var(--rr) 0}
.grp--row > *:not(:first-child):not(:last-child){border-radius:var(--rr)}
.grp--row > *:last-child{border-radius:var(--rr) 0 0 var(--rr)}
.grp--col > *:first-child{border-radius:0 0 var(--rr) var(--rr)}
.grp--col > *:not(:first-child):not(:last-child){border-radius:var(--rr)}
.grp--col > *:last-child{border-radius:var(--rr) var(--rr) 0 0}
.grp > *:only-child{border-radius:0}
.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1100px){
  .c4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grp--row.c4 > *:nth-child(1){border-radius:0 var(--rr) var(--rr) var(--rr)}
  .grp--row.c4 > *:nth-child(2){border-radius:var(--rr) 0 var(--rr) var(--rr)}
  .grp--row.c4 > *:nth-child(3){border-radius:var(--rr) var(--rr) var(--rr) 0}
  .grp--row.c4 > *:nth-child(4){border-radius:var(--rr) var(--rr) 0 var(--rr)}
}
@media(max-width:760px){
  .c2,.c3,.c4{grid-template-columns:minmax(0,1fr)}
  .grp--row > *:first-child,.grp--row.c4 > *:nth-child(1){border-radius:0 0 var(--rr) var(--rr)}
  .grp--row > *:not(:first-child):not(:last-child),.grp--row.c4 > *:nth-child(2),.grp--row.c4 > *:nth-child(3){border-radius:var(--rr)}
  .grp--row > *:last-child,.grp--row.c4 > *:nth-child(4){border-radius:var(--rr) var(--rr) 0 0}
  .grp--row > *:only-child{border-radius:0}
}

/* ═══ BOTONES ═══
   Normalizados a partir del inventario del sitio: transición 300 ms,
   activo al 97 %, deshabilitado al 50 %, nunca negrita en hover.
   Solo las acciones (principal y sólidos) se enderezan al contacto. */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  font-family:var(--font-sans);font-size:14px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  padding:16px 40px;border:1px solid transparent;border-radius:var(--r-pill);
  text-decoration:none;white-space:nowrap;cursor:pointer;
  transition:border-radius var(--m-base) var(--e-io),background-color var(--m-base) var(--e-io),color var(--m-base) var(--e-io),
             border-color var(--m-base) var(--e-io),transform var(--m-fast) var(--e-out);
}
.btn svg{width:20px;height:20px;flex:0 0 auto;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--m-base) var(--e-io)}
.btn:active{transform:scale(.97)}
.btn[disabled]{opacity:.5;pointer-events:none}
.btn--primary{background:var(--btn-primary-bg);color:var(--btn-primary-fg)}
.btn--solid{background:var(--btn-solid-bg);color:var(--btn-solid-fg)}
/* Cristal · sobre imagen, cielo o color. No se endereza. */
.btn--glass{font-size:14px;font-weight:500;letter-spacing:.01em;text-transform:none;padding:12px 32px;
  background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.3);color:#fff;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.btn--glass-ink{font-size:14px;font-weight:500;letter-spacing:.01em;text-transform:none;padding:12px 32px;
  background:rgba(255,255,255,.3);border-color:rgba(16,18,42,.18);color:var(--k-noche);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
@media(hover:hover){
  .btn--primary:hover,.btn--solid:hover{border-radius:var(--r-none)}
  .btn:hover svg.dir{transform:translateX(4px)}
  .btn--primary:hover{background:var(--color-bg);border-color:var(--btn-primary-bg)}
  .btn--solid:hover{background:var(--btn-solid-hover-bg);color:var(--btn-solid-hover-fg)}
  .btn--glass:hover{background:rgba(255,255,255,.2)}
  .btn--glass-ink:hover{background:rgba(255,255,255,.55);border-color:rgba(16,18,42,.35)}
}
.btn-row{display:flex;flex-wrap:wrap;gap:var(--s4);align-items:center}

/* Botón de texto · "Volver al inicio": 14 px, 500, Azul Noche al 55 % → 100 %,
   flecha de 16 px a 8 px que se desplaza 4 px en su dirección */
.btn-text{
  display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;line-height:20px;
  color:rgba(16,18,42,.55);text-decoration:none;transition:color var(--m-base) ease;
}
.btn-text svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--m-base) var(--e-io)}
.btn-text:hover{color:var(--k-noche)}
.btn-text:hover .go-r{transform:translateX(4px)}
.btn-text:hover .go-l{transform:translateX(-4px)}
.btn-text:hover .go-u{transform:translateY(-4px)}
.on-dark .btn-text{color:rgba(244,244,244,.6)}
.on-dark .btn-text:hover{color:var(--k-blanco)}

/* Botón de icono · "Flechas de carrusel": círculo de 36 px, borde fino Gris Plata,
   chevron de 20 px. Hover: relleno Azul Noche, icono blanco. No se endereza. */
.btn-icon{
  width:36px;height:36px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;
  border:1px solid rgba(168,170,181,.7);color:var(--k-gris-4);background:transparent;text-decoration:none;
  transition:background-color var(--m-base) var(--e-io),border-color var(--m-base) var(--e-io),color var(--m-base) var(--e-io),transform var(--m-fast) var(--e-out);
}
.btn-icon svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--m-base) var(--e-io)}
.btn-icon:hover{background:var(--k-noche);border-color:var(--k-noche);color:#fff}
.btn-icon:active{transform:scale(.97)}
@media(max-width:767px){.btn-icon{width:32px;height:32px}.btn-icon svg{width:16px;height:16px}}

/* Enlace en texto corrido: letra Noche, subrayado Cielo */
.link{color:var(--link-fg);font-weight:600;text-decoration:underline;text-decoration-color:var(--link-underline);text-decoration-thickness:2px;text-underline-offset:5px;
  transition:text-decoration-color var(--m-fast) var(--e-out),text-underline-offset var(--m-fast) var(--e-out)}
.link:hover{text-decoration-color:var(--color-text);text-underline-offset:7px}

/* ═══ BADGES · texto e icono Azul Noche, el color vive en el fondo ═══ */
.badge{display:inline-flex;align-items:center;gap:var(--s2);font-size:13px;font-weight:600;line-height:1;color:var(--badge-fg);padding:8px 14px 8px 11px;border-radius:var(--r-pill);white-space:nowrap}
.badge svg{width:14px;height:14px;stroke:currentColor;stroke-width:var(--icon-stroke);fill:none;stroke-linecap:round;stroke-linejoin:round}
.badge--vigente{background:var(--color-status-success)}
.badge--borrador{background:var(--color-status-warning)}
.badge--pendiente{background:var(--color-status-neutral)}
.badge--info{background:var(--color-status-info)}
.badge--error{background:var(--color-status-error)}

/* Estado · la forma también comunica, no solo el color */
.dot{width:8px;height:8px;border-radius:50%;flex:0 0 auto;display:inline-block}
.dot--vigente{background:var(--k-noche)}
.dot--borrador{background:linear-gradient(90deg,var(--k-noche) 50%,transparent 50%);box-shadow:inset 0 0 0 1.5px var(--k-noche)}
.dot--pendiente{box-shadow:inset 0 0 0 1.5px var(--k-gris-4)}

.vin{flex:0 0 auto;color:var(--color-warm)}

/* ═══ ESTRUCTURA ═══ */
.wrap{max-width:1280px;margin:0 auto;padding:0 var(--s12)}
@media(max-width:760px){.wrap{padding:0 var(--s4)}}
.section{padding:var(--s32) 0}
@media(max-width:760px){.section{padding:var(--s20) 0}}
.on-dark{background:var(--color-inverse);color:var(--color-text-inverse)}
.sec-head{margin-bottom:var(--s16)}
.sec-head .t-lead{max-width:640px;margin-top:var(--s6)}
.sec-head .kicker{margin-bottom:var(--s6)}

/* ═══ CABECERA · misma especificación que el sitio web ═══ */
:root{
  --hdr-h:112px;
  --spring-lift:linear(0, .0293, .1035, .2049, .3196, .4373, .5505, .6543, .7459, .8238, .8878, .9387, .9776, 1.006, 1.0254, 1.0376, 1.044, 1.046, 1.0448, 1.0416, 1.037, 1.0317, 1.0263, 1.0211, 1.0163, 1.012, 1.0084, 1.0054, 1.003, 1.0012, .9998, .9989, .9983, .998, .9979, .9979, .9981, .9983, .9985, .9988, 1);
  --spring-line:linear(0, .0205, .0728, .1457, .2303, .3199, .4095, .4958, .5763, .6496, .715, .7722, .8215, .8633, .8981, .9267, .9497, .968, .9821, .9928, 1.0006, 1.0062, 1.0098, 1.012, 1.0131, 1.0134, 1.0131, 1.0123, 1.0113, 1.0102, 1.009, 1.0078, 1.0066, 1.0056, 1.0046, 1.0037, 1.003, 1.0023, 1.0018, 1.0013, 1);
  --hdr-fg:rgba(16,18,42,.7);
  --hdr-fg-hover:var(--k-cielo);
  --hdr-fg-active:var(--k-cielo);
  --hdr-line-hover:rgba(114,155,221,.35);
  --hdr-line-active:var(--k-cielo);
  --hdr-logo:var(--k-noche);
  --hdr-search:var(--k-noche);
}
body{padding-top:var(--hdr-h)}
body.is-home{padding-top:0}
.hdr{position:fixed;top:0;left:0;right:0;z-index:50;height:var(--hdr-h);color:var(--hdr-fg)}
.hdr__bg{position:absolute;inset:0;z-index:-1;overflow:hidden;background:rgba(244,244,244,.9);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(114,155,221,.5);transition:background-color 500ms var(--e-io),border-color 500ms var(--e-io)}
.hdr__in{position:relative;height:100%;max-width:1280px;margin:0 auto;padding:0 24px;display:flex;align-items:center}
/* Portada: cristal Azul Cielo con nubes. Sobre el fondo Cielo los enlaces
   pasan de blanco a Azul Noche, con las mismas opacidades. */
.hdr--home{--hdr-fg:rgba(16,18,42,.65);--hdr-fg-hover:var(--k-noche);--hdr-fg-active:var(--k-noche);--hdr-line-hover:var(--k-noche);--hdr-line-active:var(--k-noche);--hdr-logo:var(--k-noche);--hdr-search:var(--k-noche)}
.hdr--home .hdr__bg{background:rgba(114,155,221,.35);backdrop-filter:blur(36px);-webkit-backdrop-filter:blur(36px);border-bottom-color:rgba(255,255,255,.5)}
.hdr--home.is-solid{--hdr-fg:rgba(16,18,42,.7);--hdr-fg-hover:var(--k-cielo);--hdr-fg-active:var(--k-cielo);--hdr-line-hover:rgba(114,155,221,.35);--hdr-line-active:var(--k-cielo);--hdr-logo:var(--k-noche)}
.hdr--home.is-solid .hdr__bg{background:rgba(244,244,244,.9);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom-color:rgba(114,155,221,.5)}
.hdr__clouds{position:absolute;inset:0;opacity:0;transition:opacity 500ms var(--e-io)}
.hdr--home .hdr__clouds{opacity:1}
.hdr--home.is-solid .hdr__clouds{opacity:0}
.cloud{position:absolute;left:100%;fill:#fff;animation:cloud linear infinite;will-change:transform}
/* Nube difusa: una mancha de luz sin silueta */
.haze{position:absolute;left:100%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.95),rgba(255,255,255,.55) 45%,rgba(255,255,255,0));animation:cloud linear infinite;will-change:transform}
@keyframes cloud{from{transform:translateX(0)}to{transform:translateX(calc(-100vw - 100% - 40px))}}
.hdr__links{display:flex;gap:40px;align-items:center;height:100%}
.hdr__link{position:relative;display:inline-block;font-size:14px;line-height:20px;font-weight:500;letter-spacing:.025em;color:var(--hdr-fg);text-decoration:none;
  transition:color 300ms ease,transform 515ms var(--spring-lift)}
.hdr__link::after{content:'';position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--hdr-line-hover);transform:scaleX(0);transform-origin:left;
  transition:transform 300ms var(--e-out),background-color 300ms ease}
@media(hover:hover){.hdr__link:hover{color:var(--hdr-fg-hover);transform:translateY(-1px)}.hdr__link:hover::after{transform:scaleX(1)}}
.hdr__link[aria-current="true"]{color:var(--hdr-fg-active)}
.hdr__link[aria-current="true"]::after{background:var(--hdr-line-active);transform:scaleX(1);animation:line-in 495ms var(--spring-line) both}
@keyframes line-in{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.hdr__logo{position:absolute;left:50%;top:50%;width:80px;height:80px;transform:translate(-50%,-50%);color:var(--hdr-logo);transition:color 500ms var(--e-io)}
.hdr__logo svg{width:100%;height:100%;fill:currentColor;transition:transform 300ms ease}
.hdr__logo:hover svg{transform:scale(1.05)}
.hdr__right{margin-left:auto;display:flex;align-items:center;gap:var(--s4)}
/* Buscador en el lugar del selector de idioma. Hover: el relleno barre
   de izquierda a derecha, la lupa gira y se revela el atajo. */
.hdr__search{position:relative;overflow:hidden;isolation:isolate;height:37px;display:inline-flex;align-items:center;gap:8px;padding:8px 20px;
  border:1px solid currentColor;border-radius:var(--r-pill);font-size:14px;font-weight:500;line-height:20px;color:var(--hdr-search);
  transition:color 300ms ease,border-color 300ms ease}
.hdr__search::before{content:'';position:absolute;inset:0;z-index:-1;background:var(--k-cielo);transform:scaleX(0);transform-origin:left;transition:transform 420ms var(--e-io)}
.hdr--home:not(.is-solid) .hdr__search::before{background:var(--k-noche)}
.hdr__search svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;transition:transform 515ms var(--spring-lift)}
.hdr__search kbd{font-family:var(--font-sans);font-size:11px;font-weight:600;letter-spacing:.04em;opacity:0;max-width:0;overflow:hidden;white-space:nowrap;transition:max-width 420ms var(--e-io),opacity 300ms ease,margin 420ms var(--e-io)}
@media(hover:hover){
  .hdr__search:hover{color:#fff;border-color:var(--k-cielo)}
  .hdr--home:not(.is-solid) .hdr__search:hover{border-color:var(--k-noche)}
  .hdr__search:hover::before{transform:scaleX(1)}
  .hdr__search:hover svg{transform:rotate(-14deg) scale(1.08)}
  .hdr__search:hover kbd{opacity:.8;max-width:60px;margin-left:4px}
}
.hdr__burger{display:none;width:40px;height:40px;padding:8px;margin-left:auto;color:var(--hdr-search);transition:color 500ms var(--e-io)}
.hdr__burger svg{width:24px;height:24px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round}
.hdr__burger path{transition:transform 300ms var(--e-io),opacity 200ms ease;transform-origin:center}
.hdr.is-open .hdr__burger .b1{transform:translateY(5px) rotate(45deg)}
.hdr.is-open .hdr__burger .b2{opacity:0}
.hdr.is-open .hdr__burger .b3{transform:translateY(-5px) rotate(-45deg)}
.hdr__panel{position:absolute;top:100%;left:0;right:0;padding:32px;background:rgba(114,155,221,.9);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  border-top:1px solid rgba(255,255,255,.1);box-shadow:0 25px 50px -12px rgba(0,0,0,.25);opacity:0;transform:translateY(-10px);visibility:hidden;pointer-events:none;
  transition:opacity 300ms var(--e-out),transform 300ms var(--e-out),visibility 0s linear 300ms;max-height:calc(100vh - var(--hdr-h));overflow-y:auto}
.hdr.is-open .hdr__panel{opacity:1;transform:none;visibility:visible;pointer-events:auto;transition:opacity 300ms var(--e-out),transform 300ms var(--e-out)}
.hdr__panel nav{display:flex;flex-direction:column;gap:32px}
.hdr__panel a{font-size:20px;line-height:28px;font-weight:500;color:rgba(255,255,255,.8);text-decoration:none;transition:color 300ms ease}
.hdr__panel a:hover{color:var(--k-atardecer)}
.hdr__panel a[aria-current="true"]{color:#B2BFE5;font-weight:700}
.hdr__panel-foot{margin-top:32px;padding-top:32px;border-top:1px solid rgba(255,255,255,.1)}
.hdr__panel-search{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;padding:16px;border:1px solid #fff;border-radius:var(--r-pill);font-size:14px;font-weight:500;color:#fff;transition:background-color 300ms ease,border-color 300ms ease}
.hdr__panel-search svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round}
.hdr__panel-search:hover{background:var(--k-cielo);border-color:var(--k-cielo)}
@media(max-width:1179px){
  .hdr__links,.hdr__right{display:none}
  .hdr__burger{display:inline-flex}
  .hdr__logo{left:24px;width:64px;height:64px;transform:translateY(-50%)}
}
@media(max-width:940px) and (orientation:landscape) and (max-height:520px){
  :root{--hdr-h:52px}
  .hdr__in{padding:0 20px}
  .hdr__logo{left:20px;height:34px;width:auto;max-width:136px}
  .hdr__logo svg{height:34px;width:auto}
  .hdr__panel{padding:16px 24px 20px}
  .hdr__panel nav{gap:14px}
  .hdr__panel a{font-size:16px;line-height:1.35}
  .hdr__panel-foot{margin-top:16px;padding-top:16px}
  .hdr__panel-search{padding:10px}
}

/* ═══ PORTADA ═══
   Capas, de atrás hacia adelante: degradado de cielo (0), nubes (10),
   cristal acanalado (20), contenido (30). La cabecera va encima con su propio cristal. */
.hero{position:relative;overflow:hidden;isolation:isolate;color:var(--k-noche);
  min-height:64vh;display:flex;align-items:center;
  background:linear-gradient(180deg,#3D7ACC 0%,var(--k-cielo) 30%,#8AAEE0 70%,#B2BFE5 100%)}
@media(min-width:768px){.hero{min-height:70vh}}
@media(min-width:1024px){.hero{min-height:76vh}}
@media(hover:none) and (max-width:1180px){.hero{min-height:70svh}}
.hero__clouds{position:absolute;inset:0;z-index:10;pointer-events:none;overflow:hidden}
.hero-cloud{position:absolute;left:0;fill:#fff;will-change:transform;animation:heroCloudDrift linear infinite}
@keyframes heroCloudDrift{from{transform:translateX(110vw)}to{transform:translateX(-600px)}}
/* Cristal acanalado: desenfoque de 22 px, velo blanco al 6 % y un canal cóncavo cada 50 px */
.hero__glass{position:absolute;inset:0;z-index:20;pointer-events:none;
  backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);background-color:rgba(255,255,255,.06);
  background-image:repeating-linear-gradient(90deg,
    rgba(255,255,255,.16) 0px,rgba(255,255,255,.16) 1px,
    rgba(255,255,255,.07) 1px,rgba(255,255,255,.01) 25px,
    rgba(255,255,255,.01) 26px,rgba(255,255,255,.07) 49px,
    rgba(255,255,255,.07) 50px)}
.hero__in{position:relative;z-index:30;width:100%;max-width:1280px;margin:0 auto;padding:calc(var(--hdr-h) + var(--s12)) var(--s12) var(--s16)}
.hero .t-lead{max-width:600px;margin-top:var(--s10);color:var(--k-noche)}
@media(max-width:760px){.hero__in{padding:calc(var(--hdr-h) + var(--s10)) var(--s4) var(--s12)}}
@media(prefers-reduced-motion:reduce){.hero-cloud,.cloud,.haze{animation:none}}

/* Índice del manual · cada área con su color corporativo */
.area{display:flex;flex-direction:column;background:var(--color-surface);overflow:hidden}
.area__color{height:64px}
.area__body{display:flex;flex-direction:column;flex:1;padding:var(--s8) var(--s6) var(--s6)}
.area__body .t-sm{margin-top:var(--s2);min-height:3.1em}
.area__list{list-style:none;margin-top:var(--s6);border-top:1px solid var(--color-border)}
.area__list a{display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:var(--s2);align-items:center;padding:11px 0;border-bottom:1px solid var(--color-border);
  font-size:14px;font-weight:500;color:var(--color-text-2);text-decoration:none;transition:color var(--m-fast) ease,padding var(--m-base) var(--e-io)}
.area__list a span{font-size:12px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.area__list a:hover{color:var(--color-text);padding-left:6px}
.area__foot{margin-top:auto;padding-top:var(--s6);display:flex;align-items:center;justify-content:space-between}
.area__foot .paren{color:var(--color-text-3)}

/* Degradados corporativos · imágenes oficiales con textura de grano */
.grad{background-size:cover;background-position:center;background-color:var(--k-cielo)}
.grad--cielo{background-image:url('../assets/img/degradado-cielo.jpg');background-color:#6C93CE}
.grad--salmon{background-image:url('../assets/img/degradado-salmon.jpg');background-color:#D27671}
.grad--atardecer{background-image:url('../assets/img/degradado-atardecer.jpg');background-color:#E7A6A6}
.grad--noche{background-image:url('../assets/img/degradado-noche.jpg');background-color:#212238}

/* Cómo leer · columnas editoriales separadas por líneas */
.cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--color-border-strong)}
.cols > div{padding:var(--s8) var(--s8) 0 var(--s8);border-left:1px solid var(--color-border)}
.cols > div:first-child{padding-left:0;border-left:0}
.cols__n{font-family:var(--font-display);font-size:44px;font-weight:400;line-height:1;color:var(--color-text-title-muted);margin-bottom:var(--s10)}
.cols .t-h4{margin-bottom:var(--s3)}
@media(max-width:1000px){.cols{grid-template-columns:repeat(2,minmax(0,1fr))}.cols > div:nth-child(3){padding-left:0;border-left:0}.cols > div{padding-bottom:var(--s10)}}
@media(max-width:600px){.cols{grid-template-columns:1fr}.cols > div{padding:var(--s8) 0;border-left:0;border-bottom:1px solid var(--color-border)}}

.footer{border-top:1px solid var(--color-border-strong);padding:var(--s12) 0 var(--s10)}
.footer__in{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s8);flex-wrap:wrap}
.footer__name{font-size:17px;font-weight:600;letter-spacing:-.01em;margin-bottom:var(--s1)}

/* ═══ DOCUMENTO: lateral · contenido · índice ═══ */
.doc{max-width:1520px;margin:0 auto;display:grid;grid-template-columns:288px minmax(0,1fr) 232px}
@media(max-width:1280px){.doc{grid-template-columns:272px minmax(0,1fr)}.toc{display:none}}
@media(max-width:900px){.doc{grid-template-columns:minmax(0,1fr)}}
.side{position:sticky;top:var(--hdr-h);height:calc(100vh - var(--hdr-h));overflow-y:auto;overscroll-behavior:contain;padding:var(--s10) 0 var(--s16);border-right:1px solid var(--color-border)}
.side__area{display:block;padding:0 var(--s8) var(--s6);text-decoration:none}
.side__area .kicker{font-size:12px}
.nav-ch{margin-bottom:var(--s1)}
.nav-ch__btn{width:100%;display:grid;grid-template-columns:28px minmax(0,1fr) 16px;align-items:center;gap:var(--s2);padding:10px var(--s6) 10px var(--s8);text-align:left;font-size:15px;font-weight:600;color:var(--color-text)}
.nav-ch__num{font-size:12px;font-weight:600;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.nav-ch__btn svg{width:14px;height:14px;stroke:var(--color-text-3);stroke-width:var(--icon-stroke);fill:none;transition:transform var(--m-base) var(--e-io)}
.nav-ch[aria-expanded="true"] > .nav-ch__btn svg{transform:rotate(90deg)}
.nav-list{display:none;padding:2px 0 var(--s3)}
.nav-ch[aria-expanded="true"] > .nav-list{display:block}
.nav-sub{padding:var(--s3) var(--s6) var(--s1) calc(var(--s8) + 36px);font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--color-text-3)}
.nav-grp{padding:var(--s3) var(--s6) var(--s1) calc(var(--s8) + 36px);font-size:13px;font-weight:600;color:var(--color-text)}
/* La pestaña activa toca el borde del lateral (recto) y mira al contenido (curvo) */
.nav-item{display:flex;align-items:center;gap:var(--s3);margin-right:var(--s6);padding:8px var(--s4) 8px calc(var(--s8) + 36px);font-size:14px;line-height:1.35;color:var(--color-text-2);text-decoration:none;
  border-radius:0 var(--r-pill) var(--r-pill) 0;transition:background-color var(--m-fast) var(--e-out),color var(--m-fast) var(--e-out)}
.nav-item__t{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-item.is-deep{padding-left:calc(var(--s8) + 48px)}
.nav-item .dot{margin-left:auto}
a.nav-item:hover{background:var(--k-cielo-100);color:var(--color-text)}
.nav-item[aria-current="page"]{background:var(--color-brand-soft);color:var(--color-text);font-weight:600}
.nav-item.is-empty{color:var(--color-text-3);cursor:default}
.side__legend{margin:var(--s8) var(--s8) 0;padding-top:var(--s6);border-top:1px solid var(--color-border);display:grid;gap:var(--s2)}
.side__legend span{display:flex;align-items:center;gap:var(--s3);font-size:12px;color:var(--color-text-3)}
.side,.toc{scrollbar-width:thin;scrollbar-color:transparent transparent}
.side:hover,.toc:hover{scrollbar-color:var(--k-gris-5) transparent}
@media(max-width:900px){
  .side{position:fixed;inset:0 auto 0 0;height:100vh;width:min(320px,88vw);z-index:62;padding-top:var(--s10);background:var(--color-bg);transform:translateX(-100%);transition:transform var(--m-base) var(--e-io);box-shadow:0 20px 60px rgba(16,18,42,.12)}
  body.nav-open .side{transform:none}
  body.nav-open .scrim{opacity:1;pointer-events:auto}
}
.scrim{position:fixed;inset:0;background:rgba(16,18,42,.28);opacity:0;pointer-events:none;z-index:61;transition:opacity var(--m-base) var(--e-out)}
.chapbar{display:none}
@media(max-width:900px){
  .chapbar{position:sticky;top:var(--hdr-h);z-index:40;display:flex;align-items:center;gap:var(--s3);width:100%;padding:14px var(--s4);background:rgba(244,244,244,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border);font-size:14px;font-weight:600;color:var(--color-text);text-align:left}
  .chapbar svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round}
  .chapbar span{color:var(--color-text-3);font-weight:500}
}

.content{padding:var(--s12) var(--s16) var(--s24);min-width:0}
@media(max-width:1100px){.content{padding:var(--s10) var(--s10) var(--s20)}}
@media(max-width:760px){.content{padding:var(--s8) var(--s4) var(--s16)}}
.content > *{max-width:1000px}
.crumbs{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;font-size:13px;color:var(--color-text-3);margin-bottom:var(--s16)}
.crumbs a{text-decoration:none;transition:color var(--m-fast)}.crumbs a:hover{color:var(--color-text)}
.crumbs svg{width:12px;height:12px;stroke:currentColor;stroke-width:var(--icon-stroke);fill:none}

/* Encabezado de página: título, texto y ficha apilados, sin huecos */
.page-head{display:flex;flex-direction:column;align-items:flex-start;padding-bottom:var(--s12)}
.page-head .kicker{margin-bottom:var(--s8)}
.page-head .t-lead{max-width:640px;margin-top:var(--s6)}
.facts{display:grid;width:100%;max-width:480px;margin-top:var(--s10)}
.facts div{display:flex;justify-content:space-between;gap:var(--s4);padding:10px 0;border-bottom:1px solid var(--color-border-strong);font-size:13px}
.facts div:first-child{border-top:1px solid var(--color-border-strong)}
.facts b{font-weight:600;text-align:right}

/* Banda de color del área */
.band{height:clamp(160px,18vw,240px);margin-bottom:var(--s16)}

/* Sección editorial: rótulo a la izquierda, contenido a la derecha */
.dsec{display:grid;grid-template-columns:180px minmax(0,1fr);gap:var(--s8);padding-top:var(--s8);margin-bottom:var(--s24);border-top:1px solid var(--color-border-strong)}
.dsec__label{padding-top:6px}
.dsec .t-h2{margin-bottom:var(--s5)}
.dsec__lede{max-width:620px;margin-bottom:var(--s12)}
@media(max-width:1000px){.dsec{grid-template-columns:1fr;gap:var(--s4);margin-bottom:var(--s20)}}

/* Muestras de color · barras altas, datos debajo, sin cajas. Clic copia el código.
   Las barras forman una sola pieza: la curva vive en la barra, no en la leyenda. */
.swatches{align-items:start}
.sw{display:block;width:100%;text-align:left;cursor:copy;background:none;border-radius:0!important}
.sw__fill{position:relative;height:300px}
.sw__fill.is-light{box-shadow:inset 0 0 0 1px var(--color-border)}
.swatches--sm .sw__fill{height:150px}
.sw__meta{padding:var(--s5) 2px 0}
.sw__name{font-size:15px;font-weight:600}
.sw__hex{font-size:13px;color:var(--color-text-3);font-variant-numeric:tabular-nums;margin-top:2px}
.sw__role{font-size:13px;color:var(--color-text-3);margin-top:var(--s3);line-height:1.5;max-width:220px}
.sw__copy{position:absolute;left:var(--s4);bottom:var(--s4);font-size:12px;font-weight:600;padding:7px 12px;border-radius:var(--r-pill);color:var(--k-noche);
  background:var(--glass-bg-strong);border:1px solid rgba(255,255,255,.6);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  opacity:0;transform:translateY(4px);transition:opacity var(--m-fast) var(--e-out),transform var(--m-fast) var(--e-out)}
.sw:hover .sw__copy,.sw:focus-visible .sw__copy{opacity:1;transform:none}
.swatches > .sw:first-child .sw__fill{border-radius:0 var(--rr) var(--rr) 0}
.swatches > .sw:not(:first-child):not(:last-child) .sw__fill{border-radius:var(--rr)}
.swatches > .sw:last-child .sw__fill{border-radius:var(--rr) 0 0 var(--rr)}
@media(max-width:1100px){
  .swatches.c4 > .sw:nth-child(1) .sw__fill{border-radius:0 var(--rr) var(--rr) var(--rr)}
  .swatches.c4 > .sw:nth-child(2) .sw__fill{border-radius:var(--rr) 0 var(--rr) var(--rr)}
  .swatches.c4 > .sw:nth-child(3) .sw__fill{border-radius:var(--rr) var(--rr) var(--rr) 0}
  .swatches.c4 > .sw:nth-child(4) .sw__fill{border-radius:var(--rr) var(--rr) 0 var(--rr)}
  .swatches.c4{row-gap:var(--s8)}
}
.sub-h{margin:var(--s16) 0 var(--s5)}

/* Barra de proporción y su leyenda */
.ratio{height:88px}
.ratio-key{display:grid;margin-top:var(--s6);border-top:1px solid var(--color-border)}
.ratio-key div{display:grid;grid-template-columns:18px 56px minmax(0,1fr);gap:var(--s3);align-items:center;padding:10px 0;border-bottom:1px solid var(--color-border);font-size:14px;color:var(--color-text-2)}
.ratio-key b{font-weight:600;color:var(--color-text);font-variant-numeric:tabular-nums}
.chip{display:inline-block;width:14px;height:14px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(16,18,42,.12)}

/* Reglas · filas numeradas, sin cajas */
.rules{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s12)}
.rule{display:grid;grid-template-columns:40px minmax(0,1fr);gap:var(--s4);padding:var(--s6) 0;border-top:1px solid var(--color-border)}
.rule__n{font-size:13px;font-weight:600;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums;padding-top:2px}
.rule__t{font-size:17px;font-weight:600;letter-spacing:-.01em;margin-bottom:var(--s2)}
.rule__d{font-size:14px;line-height:1.6;color:var(--color-text-3)}
@media(max-width:900px){.rules{grid-template-columns:minmax(0,1fr)}}

/* Hacer / No hacer · escenario y leyenda fuera de la caja */
.dd{display:flex;flex-direction:column;border-radius:0!important}
.dd__stage{min-height:240px;display:flex;align-items:center;justify-content:center;gap:var(--s5);flex-wrap:wrap;padding:var(--s10) var(--s6);background:var(--color-surface)}
.dd__stage.on-cielo{background:var(--k-cielo)}
.dd-grid > .dd:first-child .dd__stage{border-radius:0 var(--r-card) var(--r-card) 0}
.dd-grid > .dd:last-child .dd__stage{border-radius:var(--r-card) 0 0 var(--r-card)}
@media(max-width:760px){
  .dd-grid > .dd:first-child .dd__stage{border-radius:0 0 var(--r-card) var(--r-card)}
  .dd-grid > .dd:last-child .dd__stage{border-radius:var(--r-card) var(--r-card) 0 0}
}
.dd__cap{display:grid;grid-template-columns:24px minmax(0,1fr);gap:var(--s3);padding:var(--s5) 2px 0}
.dd__cap svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;margin-top:2px}
.dd__cap b{display:block;font-size:15px;font-weight:600;margin-bottom:var(--s1)}
.dd__cap .t-sm{max-width:360px}

/* Tabla */
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{text-align:left;font-size:13px;font-weight:500;color:var(--color-text-3);padding:0 var(--s4) var(--s3) 0;border-bottom:1px solid var(--color-border-strong)}
.tbl td{padding:var(--s4) var(--s4) var(--s4) 0;border-bottom:1px solid var(--color-border);vertical-align:middle;font-variant-numeric:tabular-nums;color:var(--color-text-2)}
.tbl td:first-child{font-weight:600;color:var(--color-text);white-space:nowrap}
.tbl td .chip{vertical-align:-2px;margin-right:var(--s2)}
.tbl-wrap{overflow-x:auto}

/* Código · para desarrollo */
.code{background:var(--color-inverse);color:var(--color-text-inverse)}
.code__bar{display:flex;align-items:center;justify-content:space-between;padding:var(--s3) var(--s3) var(--s3) var(--s6);border-bottom:1px solid rgba(244,244,244,.1)}
.code__file{font-family:var(--font-mono);font-size:12px;color:rgba(244,244,244,.6)}
.code__copy{font-size:13px;font-weight:500;padding:8px 18px;border-radius:var(--r-pill);color:var(--k-blanco);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.25);
  transition:background-color var(--m-base) var(--e-io),border-color var(--m-base) var(--e-io)}
.code__copy:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.45)}
.code pre{margin:0;padding:var(--s6);overflow-x:auto;font-family:var(--font-mono);font-size:13.5px;line-height:1.75}
.code .c{color:rgba(244,244,244,.45)}.code .p{color:var(--k-cielo-300)}.code .v{color:var(--k-atardecer)}

/* Nota editorial · la decisión se lee como pie, no como aviso */
.note{max-width:620px}
.note .t-h4{margin-bottom:var(--s2)}

/* Paginador · líneas editoriales, sin cajas */
.pager{display:grid;grid-template-columns:1fr 1fr;gap:var(--s8);margin-top:var(--s24);border-top:1px solid var(--color-border-strong)}
.pager > *{display:flex;flex-direction:column;gap:var(--s3);padding-top:var(--s6);text-decoration:none}
.pager > *:last-child{text-align:right;align-items:flex-end}
.pager .paren{color:var(--color-text-3)}
.pager__t{display:inline-flex;align-items:center;gap:var(--s3);font-size:clamp(20px,2vw,26px);font-weight:600;letter-spacing:-.02em;color:var(--color-text)}
.pager__t svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--m-base) var(--e-io)}
.pager a:first-child:hover svg{transform:translateX(-4px)}
.pager a:last-child:hover svg{transform:translateX(4px)}
.pager .is-soon .pager__t{color:var(--color-text-title-muted)}
@media(max-width:600px){.pager{grid-template-columns:1fr}.pager > *:last-child{text-align:left;align-items:flex-start}}

/* Índice de la página */
.toc{position:sticky;top:var(--hdr-h);align-self:start;padding:var(--s12) var(--s6) var(--s12) 0;max-height:calc(100vh - var(--hdr-h));overflow-y:auto}
.toc__t{font-size:13px;font-weight:500;color:var(--color-text-3);margin-bottom:var(--s4)}
.toc a{display:block;padding:7px 0 7px var(--s4);font-size:13px;line-height:1.4;color:var(--color-text-3);text-decoration:none;border-left:2px solid var(--color-border);transition:color var(--m-fast),border-color var(--m-fast)}
.toc a:hover{color:var(--color-text)}
.toc a.is-active{color:var(--color-text);font-weight:600;border-color:var(--color-brand)}

/* Página de área · sin índice lateral derecho, contenido a todo el ancho */
body.is-area .doc{grid-template-columns:288px minmax(0,1fr)}
body.is-area .content > *{max-width:1180px}
@media(max-width:900px){body.is-area .doc{grid-template-columns:minmax(0,1fr)}}
.chap{padding:var(--s12) 0 var(--s16);border-top:1px solid var(--color-border-strong)}
.chap__head{display:grid;grid-template-columns:112px minmax(0,1fr) auto;gap:var(--s8);align-items:start;margin-bottom:var(--s10)}
.chap__n{font-family:var(--font-display);font-size:clamp(44px,5vw,68px);font-weight:400;line-height:.85;letter-spacing:-.03em;color:var(--color-text-title-muted)}
.chap__t{font-weight:600;font-size:clamp(24px,2.4vw,32px);line-height:1.1;letter-spacing:-.025em}
.chap__d{margin-top:var(--s3);max-width:560px}
.chap__meta{display:flex;flex-direction:column;align-items:flex-end;gap:var(--s3);padding-top:4px}
.chap__meta .paren{color:var(--color-text-3)}
.chap__cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));column-gap:var(--s8);row-gap:var(--s8);margin-left:calc(112px + var(--s8))}
.chap__col-t{font-size:13px;font-weight:500;color:var(--color-text-2);padding-bottom:var(--s3);border-bottom:1px solid var(--color-border-strong)}
.chap__grp{font-size:12px;font-weight:600;color:var(--color-text-3);padding:var(--s4) 0 var(--s1)}
.pg{display:flex;align-items:center;gap:var(--s3);padding:11px 0;border-bottom:1px solid var(--color-border);font-size:15px;color:var(--color-text-3);text-decoration:none}
.pg .dot{margin-left:auto}
a.pg{color:var(--color-text);font-weight:600;transition:padding var(--m-base) var(--e-io)}
a.pg svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;opacity:0;transform:translateX(-4px);transition:opacity var(--m-base) var(--e-io),transform var(--m-base) var(--e-io)}
a.pg:hover{padding-left:6px}
a.pg:hover svg{opacity:1;transform:none}
@media(max-width:900px){.chap__head{grid-template-columns:64px minmax(0,1fr);gap:var(--s5)}.chap__meta{grid-column:2;align-items:flex-start;flex-direction:row;padding:0}.chap__cols{margin-left:0}}

/* ═══ BUSCADOR ═══ */
.search{position:fixed;inset:0;z-index:70;display:none;align-items:flex-start;justify-content:center;padding:14vh var(--s4) var(--s4);background:rgba(16,18,42,.3);backdrop-filter:blur(8px)}
.search.is-open{display:flex}
.search__box{width:min(640px,100%);background:var(--color-surface);box-shadow:0 30px 80px rgba(16,18,42,.25);animation:rise var(--m-base) var(--e-out)}
@keyframes rise{from{opacity:0;transform:translateY(8px)}}
.search__field{padding:var(--s5)}
/* Sin halo de color: el halo queda para estados (error, aprobado, requerido) */
.search__field input{width:100%;font:inherit;font-size:16px;padding:16px 24px;border:1px solid var(--color-border);border-radius:var(--field-radius);background:var(--color-surface);color:var(--color-text);outline:none;transition:border-color var(--m-fast),background-color var(--m-fast)}
.search__field input:focus{border-color:var(--color-border-strong);background:var(--color-bg)}
.search__res{max-height:52vh;overflow-y:auto;border-top:1px solid var(--color-border);padding:var(--s2) 0}
.search__res a,.search__res div.r{display:flex;align-items:center;gap:var(--s4);padding:var(--s3) var(--s6);text-decoration:none}
.search__res .r-path{font-size:12px;color:var(--color-text-3)}
.search__res .r-t{font-size:15px;font-weight:600}
.search__res .r-body{min-width:0;flex:1}
.search__res .is-sel{background:var(--k-cielo-100)}
.search__empty{padding:var(--s6);font-size:14px;color:var(--color-text-3)}
.search__foot{display:flex;flex-wrap:wrap;gap:var(--s3) var(--s6);padding:var(--s3) var(--s6);border-top:1px solid var(--color-border);font-size:12px;color:var(--color-text-3)}
.search__foot span{display:inline-flex;align-items:center;gap:var(--s2)}
.search__foot kbd{font-family:var(--font-sans);font-size:11px;font-weight:600;color:var(--color-text);background:var(--color-bg);border:1px solid var(--color-border);border-radius:6px;padding:3px 7px}

.toast{position:fixed;left:50%;bottom:var(--s8);z-index:80;transform:translate(-50%,16px);opacity:0;pointer-events:none;display:inline-flex;align-items:center;gap:var(--s2);padding:12px 20px;border-radius:var(--r-pill);background:var(--color-inverse);color:var(--color-text-inverse);font-size:14px;font-weight:600;transition:opacity var(--m-base) var(--e-out),transform var(--m-base) var(--e-out)}
.toast.is-on{opacity:1;transform:translate(-50%,0)}
.toast svg{width:16px;height:16px;stroke:var(--k-cielo);stroke-width:var(--icon-stroke);fill:none;stroke-linecap:round;stroke-linejoin:round}

.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
.glass-field span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass-field kbd{white-space:nowrap}
@media(hover:none),(max-width:600px){.glass-field kbd{display:none}}

/* ═══════════════════════════════════════════════════════════════
   COMPONENTES EDITORIALES · capítulos narrativos (Marca)
   ═══════════════════════════════════════════════════════════════ */
.chapter > *{max-width:1180px}
.cs{padding-top:var(--s8);margin-bottom:var(--s32);border-top:1px solid var(--color-border-strong)}
.cs__label{display:flex;gap:var(--s3);margin-bottom:var(--s12)}
.cs__label .paren:first-child{color:var(--color-text-title-muted)}
.cs .t-h2{margin-bottom:var(--s8)}
@media(max-width:760px){.cs{margin-bottom:var(--s20)}}

/* Declaración: una idea grande, con la parte secundaria atenuada */
.statement{font-weight:500;font-size:clamp(28px,3.5vw,50px);line-height:1.12;letter-spacing:-.03em;max-width:1040px}
.statement .mute{color:var(--color-text-title-muted)}
.prose{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s12);margin-top:var(--s12)}
.prose p{font-size:17px;line-height:1.65;color:var(--color-text-2)}
@media(max-width:900px){.prose{grid-template-columns:1fr;gap:var(--s6)}}

/* Portal: una abertura de cielo en un muro Azul Noche */
.portal{position:relative;height:clamp(380px,40vw,540px);overflow:hidden;isolation:isolate;margin-bottom:var(--s24);
  background:var(--portal-img,url("../assets/img/degradado-noche.jpg")) center/cover,var(--k-noche);color:var(--k-blanco)}
/* Con imagen propia se retira la abertura dibujada y un velo asegura la lectura */
.portal--img .portal__slit,.portal--img .portal__glow,.portal--img .portal__horizon{display:none}
.portal--img::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(16,18,42,.72) 0%,rgba(16,18,42,0) 60%)}
.portal__slit{position:absolute;left:62%;top:0;height:66%;width:14%;
  background:linear-gradient(180deg,#3D7ACC 0%,var(--k-cielo) 26%,#B2BFE5 50%,var(--k-atardecer) 74%,#FFCE49 100%);
  /* Profundidad: el muro proyecta sombra hacia adentro de la abertura */
  box-shadow:inset 14px 0 22px -10px rgba(16,18,42,.55),inset -10px 0 20px -10px rgba(16,18,42,.4),inset 0 18px 24px -14px rgba(16,18,42,.45),0 0 140px 14px rgba(233,157,158,.22)}
.portal__slit::after{content:"";position:absolute;top:0;bottom:0;left:-10px;width:10px;background:linear-gradient(90deg,rgba(16,18,42,0),rgba(16,18,42,.55))}
.portal__horizon{position:absolute;left:0;right:0;top:66%;height:1px;transform:scaleY(.5);transform-origin:top;background:linear-gradient(90deg,rgba(244,244,244,0) 30%,rgba(244,244,244,.12) 62%,rgba(244,244,244,.05) 100%)}
.portal strong{color:#fff}
.portal__glow{position:absolute;left:59%;width:20%;top:66%;bottom:-4%;filter:blur(26px);opacity:.85;
  background:radial-gradient(60% 55% at 50% 0%,rgba(255,206,73,.55) 0%,rgba(233,157,158,.3) 38%,rgba(114,155,221,.08) 72%,rgba(114,155,221,0) 100%)}
.portal__txt{position:absolute;left:var(--s10);bottom:var(--s10);max-width:min(760px,90%)}
.portal__txt p{max-width:580px}
.portal .kicker{color:var(--k-blanco);margin-bottom:var(--s6)}
.portal .t-display{font-size:clamp(52px,7.4vw,112px);white-space:nowrap}
.portal__txt p{margin-top:var(--s5);font-size:17px;line-height:1.55;color:rgba(244,244,244,.78)}
@media(max-width:760px){.portal__slit,.portal__glow{left:66%;width:20%}.portal__txt{left:var(--s5);bottom:var(--s6);right:var(--s5)}}

/* Franja de cita sobre degradado */
.quote-band{padding:clamp(64px,9vw,128px) var(--s8);margin-top:var(--s16);text-align:center;background:var(--k-cielo)}
.quote-band p{font-family:var(--font-display);font-weight:500;font-size:clamp(30px,4.2vw,60px);line-height:1.08;letter-spacing:-.03em;max-width:900px;margin:0 auto;color:var(--k-noche)}

/* Tarjeta con imagen y capa de cristal */
.card-img{position:relative;min-height:500px;display:flex;align-items:flex-end;padding:var(--s5);background-size:cover;background-position:center;overflow:hidden}
.card-img--cielo{background-image:url("../assets/img/degradado-cielo.jpg")}
.card-img--noche{background-image:url("../assets/img/degradado-noche.jpg")}
.card-img--salmon{background-image:url("../assets/img/degradado-salmon.jpg")}
.card-img--atardecer{background-image:url("../assets/img/degradado-atardecer.jpg")}
.glass-panel{width:100%;padding:var(--s8);background:rgba(244,244,244,.64);border:1px solid rgba(255,255,255,.65);
  backdrop-filter:blur(22px) saturate(1.3);-webkit-backdrop-filter:blur(22px) saturate(1.3)}
.glass-panel .kicker{margin-bottom:var(--s5)}
.glass-panel p{font-size:17px;line-height:1.6;color:var(--k-noche)}
.card-img--noche .glass-panel{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.18)}
.card-img--noche .glass-panel p,.card-img--noche .glass-panel .kicker,.card-img--noche .glass-panel strong{color:var(--k-blanco)}
.card-img__word{position:absolute;top:var(--s6);left:var(--s8);font-family:var(--font-display);font-weight:500;font-size:clamp(56px,7vw,104px);letter-spacing:-.04em;line-height:1}
.card-img--noche .card-img__word{color:rgba(244,244,244,.92)}
.card-img--cielo .card-img__word{color:var(--k-noche)}

/* Espectro: el nivel varía, la línea de arriba no */
.spectrum{margin-top:var(--s12)}
.spectrum__const{display:flex;align-items:center;gap:var(--s3);padding-bottom:var(--s4);font-size:14px;font-weight:600}
.spectrum__const::after{content:"";flex:1;height:2px;background:var(--k-noche)}
.spectrum__bar{position:relative;height:88px;margin-top:var(--s8);background:linear-gradient(90deg,#E0E7F1 0%,#C6D5EC 18%,var(--k-cielo) 52%,#3D6BAF 78%,var(--k-noche) 100%)}
.spectrum__mark{position:absolute;top:0;bottom:0;width:1px;background:rgba(255,255,255,.75)}
.spectrum__mark span{position:absolute;bottom:calc(100% + 10px);left:0;transform:translateX(-50%);white-space:nowrap;font-size:12px;font-weight:600;color:var(--k-noche)}
.spectrum__mark--dash{background:repeating-linear-gradient(180deg,rgba(255,255,255,.8) 0 5px,transparent 5px 10px)}
.spectrum__ends{display:flex;justify-content:space-between;gap:var(--s6);margin-top:var(--s4);font-size:14px;color:var(--color-text-2)}
.spectrum__ends > div:last-child{text-align:right}
.spectrum__ends b{display:block}
.spectrum__axis{display:flex;align-items:center;gap:var(--s3);margin-top:var(--s5);font-size:13px;color:var(--color-text-3)}
.spectrum__axis::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--color-border-strong),var(--k-noche))}
.spectrum__axis svg{order:2;width:16px;height:16px;stroke:var(--k-noche);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.closing{margin-top:var(--s12);padding-top:var(--s6);border-top:1px solid var(--color-border);font-size:clamp(20px,2vw,26px);font-weight:600;letter-spacing:-.02em;max-width:760px}

/* Origen: ondas que salen de un punto */
.origin{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:var(--s12);align-items:stretch}
.rings{position:relative;min-height:440px;overflow:hidden;background:url("../assets/img/degradado-cielo.jpg") center/cover,var(--k-cielo)}
.rings::before{content:"";position:absolute;inset:0;
  background:repeating-radial-gradient(circle at 24% 76%,rgba(255,255,255,0) 0 64px,rgba(255,255,255,.55) 65px,rgba(255,255,255,0) 67px 104px);
  -webkit-mask:radial-gradient(circle at 24% 76%,#000 20%,transparent 75%);mask:radial-gradient(circle at 24% 76%,#000 20%,transparent 75%)}
.rings__dot{position:absolute;left:24%;top:76%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#fff;box-shadow:0 0 0 8px rgba(255,255,255,.25),0 0 40px 6px #fff}
.rings__chip{display:none!important;position:absolute;right:var(--s5);top:var(--s5);display:grid;gap:2px;padding:12px 18px;border-radius:var(--r-control);
  background:rgba(244,244,244,.62);border:1px solid rgba(255,255,255,.65);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);font-size:13px}
.rings__chip b{font-size:15px}
@media(max-width:900px){.origin{grid-template-columns:1fr}.rings{min-height:320px}}

/* Promesas: lista que se despliega */
.promises{margin-top:var(--s10);border-bottom:1px solid var(--color-border-strong)}
.promise{border-top:1px solid var(--color-border-strong)}
.promise summary{display:grid;grid-template-columns:56px minmax(0,1fr) 36px;gap:var(--s4);align-items:center;padding:var(--s6) 0;cursor:pointer;list-style:none}
.promise summary::-webkit-details-marker{display:none}
.promise__n{font-size:13px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.promise__t{font-size:clamp(18px,1.8vw,22px);font-weight:600;letter-spacing:-.015em;line-height:1.3}
.promise .btn-icon .v{transform-box:fill-box;transform-origin:center;transition:transform var(--m-base) var(--e-io)}
.promise[open] .btn-icon .v{transform:scaleY(0)}
.promise summary:hover .btn-icon{background:var(--k-noche);border-color:var(--k-noche);color:#fff}
.promise__body{padding:0 52px var(--s8) calc(56px + var(--s4));max-width:820px;font-size:16px;line-height:1.65;color:var(--color-text-2);animation:rise var(--m-base) var(--e-out)}
@media(max-width:600px){.promise summary{grid-template-columns:40px minmax(0,1fr) 36px}.promise__body{padding-left:0;padding-right:0}}

/* Mosaico de principios · la regla de esquinas se calcula por posición */
.bento{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);margin-top:var(--s10)}
.pr{min-height:300px;padding:var(--s8);display:flex;flex-direction:column;justify-content:space-between;gap:var(--s10);background-color:var(--color-surface);border:1px solid var(--color-border);background-size:cover;background-position:center}
.pr--wide{grid-column:span 2}
.pr__n .paren{color:inherit;opacity:.7}
.pr h3{font-size:clamp(22px,2.2vw,30px);font-weight:600;letter-spacing:-.025em;line-height:1.1;margin-bottom:var(--s3)}
.pr p{font-size:15px;line-height:1.6;max-width:520px;opacity:.88}
.pr--noche{background-image:url("../assets/img/degradado-noche.jpg");border-color:transparent;color:var(--k-blanco)}
.pr--cielo{background-image:url("../assets/img/degradado-cielo.jpg");border-color:transparent;color:var(--k-noche)}
.pr--salmon{background-image:url("../assets/img/degradado-salmon.jpg");border-color:transparent;color:var(--k-noche)}
.pr--atardecer{background-image:url("../assets/img/degradado-atardecer.jpg");border-color:transparent;color:var(--k-noche)}
.pr--noche strong{color:#fff}
@media(max-width:900px){
  .bento{grid-template-columns:1fr}
  .pr--wide{grid-column:auto}
  .bento > .pr{border-radius:var(--r-card)!important}
  .bento > .pr:first-child{border-radius:0 0 var(--r-card) var(--r-card)!important}
  .bento > .pr:last-child{border-radius:var(--r-card) var(--r-card) 0 0!important}
}

.cols--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:1000px){.cols--3{grid-template-columns:1fr}.cols--3 > div{padding:var(--s8) 0;border-left:0;border-bottom:1px solid var(--color-border)}}

/* Tarjeta de color liso · Misión, Visión y superficies de capítulo */
.card-solid{position:relative;min-height:460px;display:flex;flex-direction:column;justify-content:space-between;gap:var(--s12);padding:var(--s8)}
.card-solid--cielo{background:var(--k-cielo);color:var(--k-noche)}
.card-solid--noche{background:var(--k-noche);color:var(--k-blanco)}
.card-solid--noche strong{color:#fff}
.card-solid .kicker{color:inherit}
.card-solid .card-solid__word{font-family:var(--font-display);font-weight:500;font-size:clamp(56px,7vw,104px);letter-spacing:-.04em;line-height:1;max-width:none;color:inherit}
.card-solid p{font-size:17px;line-height:1.6;max-width:520px}
.card-solid--noche p{color:rgba(244,244,244,.82)}
.pr--noche{background:var(--k-noche)!important}
.pr--cielo{background:var(--k-cielo)!important}
.pr--salmon{background:var(--k-salmon)!important}
.pr--atardecer{background:var(--k-atardecer)!important}
.cs .t-lead{max-width:760px}
.quote-band__pre{display:block;max-width:520px;margin:0 auto var(--s6);font-size:17px;line-height:1.5;color:var(--k-noche)}

/* ═══ Recuadros mínimos · blanco puro o Blanco Keyons; Azul Cielo solo como acento puntual ═══ */
.box{background:var(--color-surface);border:1px solid var(--color-border);padding:var(--s8);display:flex;flex-direction:column;gap:var(--s6)}
.box--keyons{background:var(--color-bg);border-color:var(--color-border-strong)}
.box--cielo{background:var(--k-cielo);border-color:transparent}
.box__n{font-size:13px;font-weight:500;color:var(--color-text-3);font-variant-numeric:tabular-nums}
.box--cielo .box__n{color:var(--k-noche)}
.box__t{font-size:20px;font-weight:600;letter-spacing:-.015em;line-height:1.25}
.box p{font-size:15px;line-height:1.6;color:var(--color-text-2)}
.box--cielo p{color:var(--k-noche)}
.box p strong{font-weight:inherit;color:inherit}
.duo{margin-top:var(--s10)}
.duo .box{min-height:300px;justify-content:space-between}
.duo .box p{font-size:17px;max-width:520px}

/* Principios: 4 columnas; esquinas según posición en el mosaico */
.grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);margin-top:var(--s10)}
.grid4 > .box{min-height:230px;justify-content:space-between}
.grid4 > .span2{grid-column:span 2}
@media(max-width:1100px){
  .grid4{grid-template-columns:1fr}
  .grid4 > .span2{grid-column:auto}
  .grid4 > .box{border-radius:var(--r-card)!important;min-height:0}
  .grid4 > .box:first-child{border-radius:0 0 var(--r-card) var(--r-card)!important}
  .grid4 > .box:last-child{border-radius:var(--r-card) var(--r-card) 0 0!important}
}
.promise__body strong{font-weight:inherit;color:inherit}

/* ═══════════════════════════════════════════════════════════════
   SISTEMA EDITORIAL · un solo lenguaje para capítulos narrativos
   Rótulo a la izquierda, contenido a la derecha, líneas finas,
   sin rellenos ni recuadros, espacio negativo generoso.
   ═══════════════════════════════════════════════════════════════ */
.ed{display:grid;grid-template-columns:200px minmax(0,1fr);column-gap:var(--s16);padding:var(--s8) 0 var(--s32);border-top:1px solid var(--color-border-strong)}
.ed__label{position:sticky;top:calc(var(--hdr-h) + var(--s8));align-self:start;display:grid;gap:var(--s1);font-size:13px;line-height:1.4}
.ed__label span:first-child{color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.ed__label span:last-child{color:var(--color-text-2)}
.ed__title{color:var(--color-text-title-muted);font-weight:500;font-size:clamp(30px,3.2vw,44px);line-height:1.1;letter-spacing:-.03em;max-width:760px;text-wrap:balance}
.ed__lead{margin-top:var(--s8);max-width:600px;font-size:clamp(18px,1.5vw,20px);line-height:1.55;color:var(--color-text-2)}
.ed__lead strong{font-weight:600;color:var(--color-text)}
.ed__cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:var(--s16);border-top:1px solid var(--color-border)}
.ed__cols > div{padding:var(--s8) var(--s10) 0 0}
.ed__cols > div + div{padding:var(--s8) 0 0 var(--s10);border-left:1px solid var(--color-border)}
.ed__cols .paren{display:block;margin-bottom:var(--s5);color:var(--color-text-3)}
.ed__cols p{font-size:16px;line-height:1.65;color:var(--color-text-2);max-width:460px}
.ed__cols--big p{font-size:clamp(17px,1.4vw,19px);color:var(--color-text)}
@media(max-width:1000px){
  .ed{grid-template-columns:1fr;row-gap:var(--s8);padding-bottom:var(--s20)}
  .ed__label{position:static;display:flex;gap:var(--s3)}
  .ed__cols{grid-template-columns:1fr}
  .ed__cols > div + div{padding:var(--s8) 0 0;border-left:0;border-top:1px solid var(--color-border);margin-top:var(--s8)}
}

/* Cita: una línea que lleva a la frase */
.pull{margin-top:var(--s20)}
.pull small{display:block;margin:0 0 var(--s4) 144px;font-size:14px;color:var(--color-text-3);max-width:520px}
.pull__q{display:flex;align-items:baseline;gap:var(--s6);font-family:var(--font-display);font-weight:500;font-size:clamp(30px,3.6vw,52px);line-height:1.05;letter-spacing:-.03em}
.pull__q::before{content:"";flex:0 0 120px;height:1px;background:var(--k-noche);transform:translateY(-.3em)}
@media(max-width:600px){.pull small{margin-left:0}.pull__q::before{flex-basis:40px}}

/* Filas: índice, título y texto separados por líneas finas */
.rows{margin-top:var(--s12);border-bottom:1px solid var(--color-border-strong)}
.row{display:grid;grid-template-columns:56px minmax(0,.9fr) minmax(0,1.1fr);column-gap:var(--s8);padding:var(--s6) 0;border-top:1px solid var(--color-border-strong);align-items:baseline}
.row__n{font-size:13px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.row__t{font-size:clamp(18px,1.6vw,21px);font-weight:600;letter-spacing:-.015em;line-height:1.3}
.row__d{font-size:15px;line-height:1.6;color:var(--color-text-2);max-width:440px}
@media(max-width:760px){.row{grid-template-columns:40px minmax(0,1fr);row-gap:var(--s2)}.row__d{grid-column:2}}
.ed .spectrum,.ed .origin,.ed .promises{margin-top:var(--s16)}
.ed .closing{border-top:0;padding-top:0;margin-top:var(--s12);font-weight:500;color:var(--color-text)}
.ed .cols{margin-top:var(--s16)}

/* Resaltado · la idea clave se marca con Azul Cielo, sin comillas ni recuadros */
.hl--warm{background:rgba(206,99,93,.2)!important}
.hl{background:rgba(114,155,221,.3);color:var(--color-text);padding:.04em .22em;border-radius:0;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.ed__close{margin-top:var(--s16);max-width:640px;font-size:clamp(20px,1.8vw,24px);line-height:1.5;color:var(--color-text-2);text-wrap:pretty}

/* Texto en dos tiempos: primera frase destacada, segunda de apoyo */
.ed__cols .p-lead{font-size:clamp(18px,1.5vw,20px);line-height:1.5;color:var(--color-text);margin-bottom:var(--s5)}
.ed__cols .p-body{font-size:16px;line-height:1.65;color:var(--color-text-2)}

/* Matriz: columnas = niveles, filas = lo que pasa en cada nivel.
   Lo que es igual en todos los niveles ocupa toda la fila. */
.matrix{margin-top:var(--s16);border-top:1px solid var(--color-border-strong)}
.matrix__row{display:grid;grid-template-columns:200px repeat(2,minmax(0,1fr));border-bottom:1px solid var(--color-border)}
.matrix__row > *{padding:var(--s5) var(--s5) var(--s5) 0}
.matrix__row > * + *{padding-left:var(--s5);border-left:1px solid var(--color-border)}
.matrix__head > *{padding-top:var(--s6);padding-bottom:var(--s6)}
.matrix__lvl{font-size:15px;font-weight:600;letter-spacing:-.01em;color:var(--color-text-3)}
.matrix__lvl small{display:block;margin-top:var(--s1);font-size:13px;font-weight:400;color:var(--color-text-3);letter-spacing:0}
.matrix__k{font-size:13px;color:var(--color-text-3)}
.matrix__v{font-size:15px;color:var(--color-text)}
.matrix__span{grid-column:2 / -1;text-align:center;font-size:15px;color:var(--color-text)}
.matrix__depth{height:4px;margin-top:var(--s4);background:linear-gradient(90deg,#C6D5EC,var(--k-noche))}
@media(max-width:900px){
  .matrix__row{grid-template-columns:1fr 1fr}
  .matrix__row > :first-child{grid-column:1/-1;border-left:0;padding-bottom:0}
  .matrix__row > :nth-child(2){border-left:0;padding-left:0}
  .matrix__span{grid-column:1/-1;border-left:0!important;padding-left:0!important}
}

/* Origen: imagen apaisada debajo del texto */
.rings--wide{min-height:0;aspect-ratio:21/8;margin-top:var(--s16)}
@media(max-width:760px){.rings--wide{aspect-ratio:4/3}}

/* Promesas: retícula de dos columnas con viñetas de marca */
.vgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s12);row-gap:var(--s12);margin-top:var(--s16)}
.vitem{display:grid;grid-template-columns:20px minmax(0,1fr);align-content:start;column-gap:var(--s5)}
.vitem svg{margin-top:2px;color:var(--vc,var(--k-salmon))}
.vitem__t{font-size:17px;font-weight:600;letter-spacing:-.01em;line-height:1.35}
.vitem__d{grid-column:2;margin-top:var(--s2);font-size:15px;line-height:1.6;color:var(--color-text-2);max-width:420px}
@media(max-width:760px){.vgrid{grid-template-columns:1fr;row-gap:var(--s10)}}

/* Título con una parte destacada en Azul Noche (solo cuando la frase lo justifica) */
.t-h2 .ink,.ed__title .ink{color:var(--color-text)}

/* Bloques apilados: rótulo corto a la izquierda, texto a la derecha */
.ed__stack{margin-top:var(--s16);border-bottom:1px solid var(--color-border)}
.ed__stack > div{display:grid;row-gap:var(--s3);padding:var(--s8) 0;border-top:1px solid var(--color-border)}
.ed__stack .paren{color:var(--color-text-3);padding-top:3px}
.ed__stack p{font-size:17px;line-height:1.65;color:var(--color-text-2);max-width:600px}
@media(max-width:760px){.ed__stack > div{grid-template-columns:1fr;row-gap:var(--s3)}}
.ed__cols p strong{font-weight:600;color:var(--color-text)}
.ed__cols p + p{margin-top:var(--s4)}

/* Principios: retícula de tres columnas con líneas verticales; el central cierra a todo el ancho */
.pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:var(--s12);border-top:1px solid var(--color-border-strong)}
.pgrid > div{padding:var(--s8) var(--s6) var(--s10);border-bottom:1px solid var(--color-border);border-left:1px solid var(--color-border)}
.pgrid > div:nth-child(3n+1){border-left:0;padding-left:0}
.pgrid:not(.pgrid--2):not(.pgrid--4) > div:last-child:not(:nth-child(3n)){border-right:1px solid var(--color-border);padding-right:var(--s6)}
.pgrid--close > div:last-child{grid-column:1/-1;border-left:0;padding-left:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);column-gap:var(--s6);align-items:baseline}
.pgrid__n{display:block;font-size:13px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums;margin-bottom:var(--s8)}
.pgrid__t{font-size:18px;font-weight:600;letter-spacing:-.015em;line-height:1.3;margin-bottom:var(--s2)}
.pgrid__d{font-size:15px;line-height:1.6;color:var(--color-text-2);max-width:420px}
.pgrid--close > div:last-child .pgrid__n{grid-column:1/-1}
@media(max-width:900px){
  .pgrid{grid-template-columns:1fr}
  .pgrid > div{border-left:0;padding-left:0;padding-right:0}
  .pgrid--close > div:last-child{display:block}
}

/* Pila de color: barras horizontales cuya altura es la proporción de uso */
.palette{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);column-gap:var(--s16);row-gap:var(--s10);margin-top:var(--s12);align-items:start}
.cstack{display:grid;gap:0}
.cband{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s4);width:100%;padding:var(--s4) var(--s5);text-align:left;cursor:copy;font-size:13px;color:var(--k-noche);transition:filter var(--m-fast) var(--e-out)}

.cband b{font-weight:600;color:inherit}
.cband span{font-variant-numeric:tabular-nums;opacity:.8}
.cband--light{box-shadow:inset 0 0 0 1px var(--color-border)}
.cband--dark{color:var(--k-blanco)}
.cstack > .cband:first-child{border-radius:0 0 var(--r-component) var(--r-component)}
.cstack > .cband:not(:first-child):not(:last-child){border-radius:var(--r-component)}
.cstack > .cband:last-child{border-radius:var(--r-component) var(--r-component) 0 0}
.palette .ratio-key{margin-top:var(--s8)}
@media(max-width:1000px){.palette{grid-template-columns:1fr}}

/* Aparición al desplazar: la información entra a medida que se lee */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .8s var(--e-out),transform .8s var(--e-out)}
.reveal.is-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* ═══ CONCEPTO · cielos, diario, metáforas y composición ═══ */

/* Cielos provisorios: degradado del manual + grano (se reemplazan por fotos propias) */
.sky{position:relative;isolation:isolate;overflow:hidden}
.sky::after{content:"";position:absolute;inset:0;background-image:var(--grain);background-size:160px;opacity:.3;mix-blend-mode:overlay;pointer-events:none}
.sky--amanecer{background:var(--sky-amanecer)}
.sky--mediodia{background:var(--sky-mediodia)}
.sky--atardecer{background:var(--sky-atardecer)}
.sky--noche{background:var(--sky-noche)}
.sky--galaxia{background:var(--sky-galaxia)}
.band.sky{height:clamp(180px,20vw,280px)}

/* Uso de cielos: el ancho de cada franja es su frecuencia */
.skyuse{margin-top:var(--s12)}
.skyuse__bar{height:120px}
.skyuse__bar,.skyuse__labels{display:grid;grid-template-columns:45fr 15fr 15fr 15fr 10fr}
.skyuse__labels{column-gap:0;margin-top:var(--s4)}
.skyuse__labels span{font-size:13px;line-height:1.4;color:var(--color-text-3);padding-right:var(--s2)}
.skyuse__labels b{display:block;font-weight:600;color:var(--color-text)}
@media(max-width:760px){.skyuse__labels span{font-size:11px}}

/* Retículas de 2 y 4 columnas con la misma lógica de líneas */
.pgrid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.pgrid--2 > div:nth-child(3n+1){border-left:1px solid var(--color-border);padding-left:var(--s6)}
.pgrid--2 > div:nth-child(2n+1){border-left:0;padding-left:0}
.pgrid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.pgrid--4 > div:nth-child(3n+1){border-left:1px solid var(--color-border);padding-left:var(--s6)}
.pgrid--4 > div:nth-child(4n+1){border-left:0;padding-left:0}
@media(max-width:900px){.pgrid--2,.pgrid--4{grid-template-columns:1fr}.pgrid--2 > div,.pgrid--4 > div{border-left:0!important;padding-left:0!important}}

/* Entrada del Diario de Cielos: imagen con su ficha */
.entry{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);column-gap:var(--s12);row-gap:var(--s8);margin-top:var(--s12);align-items:end}
.entry__img{position:relative;aspect-ratio:4/3}
.entry__img .split{position:absolute;left:0;right:0;top:80%;border-top:1px dashed rgba(255,255,255,.75)}
.entry__img .split span{position:absolute;right:var(--s4);font-size:12px;font-weight:600;color:#fff}
.entry__img .split span:first-child{bottom:calc(100% + 8px)}
.entry__img .split span:last-child{top:8px}
.entry__img figcaption{position:absolute;left:var(--s4);bottom:var(--s4);font-size:13px;font-weight:600;color:var(--k-blanco)}
.entry .facts{margin-top:0;max-width:none}
@media(max-width:900px){.entry{grid-template-columns:1fr}}

/* Tablas editoriales con más columnas */
.matrix__t{font-size:16px;font-weight:600;letter-spacing:-.01em;line-height:1.3;color:var(--color-text)}
.matrix--cond .matrix__row{grid-template-columns:56px minmax(0,.9fr) minmax(0,1.2fr) minmax(0,1fr)}
.matrix--5 .matrix__row{grid-template-columns:120px repeat(5,minmax(0,1fr))}
.matrix--5 .matrix__v{font-size:14px}
.matrix__n{font-size:13px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
@media(max-width:900px){
  .matrix--cond .matrix__row{grid-template-columns:40px minmax(0,1fr)}
  .matrix--cond .matrix__row > *{border-left:0!important;padding-left:0!important}
  .matrix--cond .matrix__row > :nth-child(n+3){grid-column:2}
  .matrix--cond .matrix__head{display:none}
  .matrix--5{overflow-x:auto}
  .matrix--5 .matrix__row{min-width:720px}
}

/* Escala de libertad creativa sobre la tabla de canales */
.scale{margin:var(--s12) 0 0 120px}
.scale__bar{height:6px;background:linear-gradient(90deg,var(--k-cielo-200) 0%,var(--k-cielo) 45%,var(--k-noche) 100%)}
.scale__ends{display:flex;justify-content:space-between;margin-bottom:var(--s3);font-size:13px;color:var(--color-text-3)}
@media(max-width:900px){.scale{margin-left:0}}

/* ═══ Encabezado con imagen (portal) · variantes ═══ */
/* Foto de cielo con texto en Azul Noche */
.portal--cielo{background:url("../assets/img/degradado-cielo.jpg") center/cover,var(--k-cielo);color:var(--k-noche)}
.portal--cielo .kicker,.portal--cielo .portal__txt p{color:var(--k-noche)}
.portal--photo{background:url("../assets/img/cielo-foto.jpg") center 35%/cover,var(--k-cielo);color:var(--k-noche)}
.portal--photo::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(244,244,244,.55) 0%,rgba(244,244,244,0) 58%)}
.portal--photo .portal__txt{z-index:1}
.portal--photo .kicker{color:var(--k-noche)}
.portal--photo .portal__txt p{color:var(--k-noche)}
/* Paleta: el muro es Azul Noche y la ventana muestra los demás colores base */
.portal__colors{position:absolute;left:62%;top:0;height:66%;width:14%;display:grid;grid-template-rows:2fr 1fr 1fr;
  box-shadow:inset 14px 0 22px -10px rgba(16,18,42,.45),0 0 120px 10px rgba(114,155,221,.18)}
.portal__colors span:nth-child(1){background:var(--k-blanco)}
.portal__colors span:nth-child(2){background:var(--k-cielo)}
.portal__colors span:nth-child(3){background:var(--k-salmon)}
@media(max-width:760px){.portal__colors{left:66%;width:20%}}

/* ═══ Zigzag editorial · texto e imagen alternados ═══ */
.zig{margin-top:var(--s16)}
.zig__item{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:var(--s16);align-items:center;padding:var(--s12) 0}
.zig__item + .zig__item{border-top:1px solid var(--color-border)}
.zig__item:nth-child(even) .zig__img{order:-1}
.zig__img{aspect-ratio:10/23;max-width:200px;width:100%;background-size:cover;background-position:center;justify-self:center}
.zig__n{font-size:13px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.zig__t{margin-top:var(--s3);font-size:clamp(22px,2.2vw,28px);font-weight:600;letter-spacing:-.02em;line-height:1.15}
.zig__meta{margin-top:var(--s2);font-size:13px;color:var(--color-text-3)}
.zig__d{margin-top:var(--s5);max-width:380px;font-size:16px;line-height:1.6;color:var(--color-text-2)}
.zig__img--amanecer{background-image:url("../assets/img/cielo-amanecer.webp")}
.zig__img--mediodia{background-image:url("../assets/img/cielo-mediodia.webp")}
.zig__img--atardecer{background-image:url("../assets/img/cielo-atardecer.webp")}
.zig__img--noche{background-image:url("../assets/img/cielo-noche.webp")}
.zig__img--galaxia{background-image:url("../assets/img/cielo-galaxia.webp")}
@media(max-width:760px){.zig__item{grid-template-columns:1fr;row-gap:var(--s8)}.zig__item:nth-child(even) .zig__img{order:0}.zig__img{justify-self:start;max-width:240px}}

/* Imagen del Diario */
.entry__img--photo{background:url("../assets/img/diario-ejemplo.webp") center/cover}

/* ═══ Pasos · condiciones con su criterio ═══ */
.steps{margin-top:var(--s12);border-bottom:1px solid var(--color-border-strong)}
.step{display:grid;grid-template-columns:56px minmax(0,1.1fr) minmax(0,.9fr);column-gap:var(--s8);padding:var(--s10) 0;border-top:1px solid var(--color-border-strong)}
.step__n{font-size:13px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums;padding-top:4px}
.step__t{font-size:clamp(20px,1.9vw,24px);font-weight:600;letter-spacing:-.02em;line-height:1.2}
.step__d{margin-top:var(--s3);font-size:16px;line-height:1.6;color:var(--color-text-2);max-width:420px}
.step__c .paren{display:block;margin-bottom:var(--s2);color:var(--color-text-3)}
.step__c p{font-size:15px;line-height:1.6;color:var(--color-text)}
@media(max-width:760px){.step{grid-template-columns:40px minmax(0,1fr);row-gap:var(--s5)}.step__c{grid-column:2}}

/* ═══ Canales · una barra vertical marca de más libertad a más contención ═══ */
.chan{display:grid;grid-template-columns:6px minmax(0,1fr);column-gap:var(--s8);margin-top:var(--s12)}
.chan__bar{background:linear-gradient(180deg,var(--k-cielo-200) 0%,var(--k-cielo) 45%,var(--k-noche) 100%)}
.chan__ends{display:flex;justify-content:space-between;font-size:13px;color:var(--color-text-3);margin:0 0 var(--s3) calc(6px + var(--s8))}
.chan__row{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr) minmax(0,1fr);column-gap:var(--s6);padding:var(--s5) 0;border-top:1px solid var(--color-border)}
.chan__row:last-child{border-bottom:1px solid var(--color-border)}
.chan__row b{font-size:16px;font-weight:600;color:var(--color-text)}
.chan__row span{font-size:15px;line-height:1.5;color:var(--color-text-2)}
.chan__head span{font-size:13px;color:var(--color-text-3)}
@media(max-width:760px){.chan__row{grid-template-columns:1fr;row-gap:var(--s1)}.chan__head{display:none}}

/* ═══ Contraste de pares · lo que evitamos frente a lo que hacemos ═══ */
.pairs{margin-top:var(--s12);border-bottom:1px solid var(--color-border-strong)}
.pairs__row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border-top:1px solid var(--color-border-strong)}
.pairs__row > *{padding:var(--s6) var(--s6) var(--s6) 0}
.pairs__row > * + *{padding-left:var(--s6);border-left:1px solid var(--color-border)}
.pairs__head > *{padding-top:var(--s4);padding-bottom:var(--s4);font-size:13px;color:var(--color-text-3)}
.pairs__no{font-size:15px;line-height:1.5;color:var(--color-text-3)}
.pairs__no b{display:block;font-weight:600;color:var(--color-text-2);text-decoration:line-through;text-decoration-color:var(--k-salmon);text-decoration-thickness:1.5px}
.pairs__yes{font-size:16px;line-height:1.5;font-weight:600;color:var(--color-text)}
@media(max-width:760px){.pairs__row{grid-template-columns:1fr}.pairs__row > * + *{border-left:0;padding-left:0;padding-top:0}}

/* Leyenda de proporción en dos renglones */
.ratio-key span strong{display:block;font-weight:600;color:var(--color-text)}

/* Canales como lista con viñetas: nombre, receptor y uso de metáforas */
.vitem__d .paren{color:var(--color-text-3);margin-right:var(--s1)}
.vitem__d span + span{display:block;margin-top:var(--s1)}

/* Arcos de cristal: el mismo cristal acanalado de la portada (desenfoque, velo al 6 %,
   un canal cóncavo con filo de 1 px), curvado en arcos concéntricos. Sin brillo ni resplandor. */
.portal__arcs{position:absolute;inset:0;pointer-events:none;
  backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);background-color:rgba(255,255,255,.06);
  background-image:repeating-radial-gradient(circle at -8% 140%,
    rgba(255,255,255,.16) 0px,rgba(255,255,255,.16) 1px,
    rgba(255,255,255,.07) 1px,rgba(255,255,255,.01) 30px,
    rgba(255,255,255,.01) 31px,rgba(255,255,255,.07) 59px,
    rgba(255,255,255,.07) 60px)}
.portal--cielo .portal__txt{z-index:1}

/* Ejemplos de redacción */
.ex{margin-top:var(--s5);padding-top:var(--s4);border-top:1px solid var(--color-border)}
.ex .paren{display:block;margin-bottom:var(--s2);color:var(--color-text-3)}
.ex p{font-size:17px;line-height:1.55;color:var(--color-text)}

/* ════ Voz · diagramación ════
   Retícula de 12 columnas dentro de la columna de contenido. Las piezas se apoyan en ella
   y la rompen a propósito: lectura en diagonal, contraste de escala y notas al margen. */

/* 3.2 · Regla y muestra: la regla arriba a la izquierda, la prueba abajo a la derecha */
.canon{margin-top:var(--s16);border-bottom:1px solid var(--color-border)}
.canon__row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s6);padding:var(--s8) 0 var(--s10);border-top:1px solid var(--color-border)}
.canon__rule{grid-column:1 / span 6}
.canon__n{display:block;margin-bottom:var(--s6);font-size:13px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.canon__t{font-size:clamp(22px,2.1vw,27px);font-weight:500;line-height:1.2;letter-spacing:-.022em;color:var(--color-text)}
.canon__d{margin-top:var(--s4);max-width:330px;font-size:15px;line-height:1.6;color:var(--color-text-2)}
.canon__ex{grid-column:8 / -1;align-self:end;display:grid;gap:var(--s5);padding-top:var(--s16)}
.canon__ex .paren{display:block;margin-bottom:var(--s1);color:var(--color-text-3)}
.canon__no{font-size:15px;line-height:1.5;color:var(--color-text-3);text-decoration:line-through;text-decoration-color:var(--k-salmon);text-decoration-thickness:1.5px}
.canon__yes{font-size:18px;line-height:1.45;letter-spacing:-.01em;color:var(--color-text)}

/* 3.3 · Índice: las palabras en tamaño de titular; sus definiciones, como notas al pie */
.index{margin-top:var(--s16);font-size:clamp(28px,3.1vw,42px);font-weight:500;line-height:1.28;letter-spacing:-.03em;color:var(--color-text);text-wrap:pretty}
.index__w{white-space:nowrap;margin-right:.32em;transition:color var(--m-fast) var(--e-out)}
.index__w sup{margin-left:.12em;font-size:12px;font-weight:500;letter-spacing:0;vertical-align:1.6em;line-height:0;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.index.is-hover .index__w{color:var(--color-text-disabled)}
.index.is-hover .index__w.is-on{color:var(--color-text)}
.notes{margin-top:var(--s16);padding-top:var(--s8);border-top:1px solid var(--color-border);columns:3;column-gap:var(--s8)}
.note{break-inside:avoid;display:grid;grid-template-columns:26px minmax(0,1fr);margin-bottom:var(--s6);transition:opacity var(--m-fast) var(--e-out)}
.note > span{font-size:12px;line-height:1.9;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.note p{font-size:14px;line-height:1.55;color:var(--color-text-2)}
.note p em{display:block;font-style:normal;font-weight:500;color:var(--color-text)}
.notes.is-hover .note{opacity:.32}
.notes.is-hover .note.is-on{opacity:1}

/* 3.4 · Hoja de corrección: la palabra tachada y, debajo, la que la reemplaza */
.redline{margin-top:var(--s16);columns:2;column-gap:var(--s16);column-rule:1px solid var(--color-border)}
.redline__i{break-inside:avoid;padding:var(--s5) 0 var(--s6);border-top:1px solid var(--color-border)}
.redline__no{font-size:18px;line-height:1.35;letter-spacing:-.01em;color:var(--color-text-2);text-decoration:line-through;text-decoration-color:var(--k-salmon);text-decoration-thickness:1.5px}
.redline__yes{display:grid;grid-template-columns:22px minmax(0,1fr);margin-top:var(--s2);font-size:15px;line-height:1.5;color:var(--color-text)}
.redline__yes::before{content:"";width:16px;height:16px;margin-top:3px;background:var(--k-cielo);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8h10M9.2 4.2 13 8l-3.8 3.8' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8h10M9.2 4.2 13 8l-3.8 3.8' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}

/* 3.5 · Alcance: una regla que se abre de lo local a lo global */
.reach{position:relative;margin-top:var(--s16);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--s8);padding-top:var(--s10);border-top:1px solid var(--color-border-strong)}
.reach > div{position:relative}
.reach > div::before{content:"";position:absolute;left:0;top:calc(-1 * var(--s10));width:1px;height:var(--tick,10px);background:var(--color-text)}
.reach > div:nth-child(2){--tick:18px}
.reach > div:nth-child(3){--tick:26px}
.reach .paren{display:block;margin-bottom:var(--s4);color:var(--color-text-3)}
.reach p{font-size:15px;line-height:1.6;color:var(--color-text-2);max-width:260px}
.asides{margin-top:var(--s20);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s6);row-gap:var(--s10)}
.asides > .paren{grid-column:1 / span 3;color:var(--color-text-3)}
.aside{grid-column:span 4}
.aside:first-of-type{grid-column:5 / span 4}
.aside::before{content:"";display:block;width:32px;height:1px;margin-bottom:var(--s5);background:var(--color-text)}
.aside p:first-child{font-size:17px;font-weight:500;line-height:1.35;color:var(--color-text)}
.aside p + p{margin-top:var(--s3);font-size:14px;line-height:1.6;color:var(--color-text-2)}

/* 3.6 · Texto anotado: la muestra a la izquierda, la nota al margen */
.annot{margin-top:var(--s16);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s6);row-gap:var(--s12)}
.annot__txt{grid-column:1 / span 8;font-size:clamp(20px,1.9vw,24px);line-height:1.5;letter-spacing:-.012em;color:var(--color-text);text-wrap:balance}
.annot__note{grid-column:10 / -1;position:relative;align-self:start;margin-top:.75em;padding-top:var(--s3);border-top:1px solid var(--color-text)}
.annot__note::before{content:"";position:absolute;top:-1px;right:100%;width:calc(100% / 3 + var(--s6));border-top:1px dashed var(--color-border-strong)}
.annot__note .paren{display:block;color:var(--color-text)}
.annot__note p{margin-top:var(--s2);font-size:14px;line-height:1.55;color:var(--color-text-2)}
.uses{margin-top:var(--s16);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s10);border-top:1px solid var(--color-border);padding-top:var(--s6)}
.uses .paren{display:block;margin-bottom:var(--s3);color:var(--color-text-3)}
.uses p{font-size:15px;line-height:1.7;color:var(--color-text-2)}

/* 3.7 · Principios en franja y léxico: la frase humana pesa más que el término */
.strip{margin-top:var(--s16);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--color-border)}
.strip > div{padding:var(--s6) var(--s5) 0 0}
.strip > div + div{padding-left:var(--s5);border-left:1px solid var(--color-border)}
.strip__n{display:block;margin-bottom:var(--s4);font-size:13px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.strip__t{font-size:17px;font-weight:500;line-height:1.3;letter-spacing:-.01em;color:var(--color-text)}
.strip__d{margin-top:var(--s3);font-size:14px;line-height:1.55;color:var(--color-text-2)}
.lex{margin-top:var(--s20);border-bottom:1px solid var(--color-border)}
.lex__head,.lex__row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s6);align-items:baseline}
.lex__head{padding-bottom:var(--s3)}
.lex__head .paren{color:var(--color-text-3)}
.lex__head .paren:first-child,.lex__k{grid-column:1 / span 4}
.lex__head .paren:last-child,.lex__v{grid-column:5 / -1}
.lex__row{padding:var(--s5) 0;border-top:1px solid var(--color-border)}
.lex__k{font-family:var(--font-display);font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-3)}
.lex__v{font-size:clamp(18px,1.6vw,21px);line-height:1.4;letter-spacing:-.012em;color:var(--color-text)}

@media(max-width:1100px){.strip{grid-template-columns:repeat(2,minmax(0,1fr))}.strip > div:nth-child(3){padding-left:0;border-left:0}.strip > div:nth-child(n+3){margin-top:var(--s6);border-top:1px solid var(--color-border)}.notes{columns:2}}
@media(max-width:760px){
  .canon__rule,.canon__ex,.annot__txt,.annot__note,.lex__k,.lex__v,.asides > .paren,.aside,.aside:first-of-type{grid-column:1 / -1}
  .canon__ex{padding-top:var(--s6)}
  .annot__note::before{display:none}
  .annot{row-gap:var(--s5)}
  .notes,.redline{columns:1}
  .reach,.uses{grid-template-columns:1fr;row-gap:var(--s10)}
  .strip{grid-template-columns:1fr}.strip > div,.strip > div + div{padding-left:0;border-left:0}
  .lex__row{row-gap:var(--s1)}
}

/* Encabezados con el segundo degradado de cielo */
.portal--cielo2{background:url("../assets/img/degradado-cielo-2.jpg") center/cover,var(--k-cielo)}

/* 1.2 · Misión y visión apiladas, con el texto un punto más presente */
.ed__stack--big p{font-size:clamp(17px,1.4vw,19px);color:var(--color-text);max-width:680px}
.ed__stack--big p strong{font-weight:600}
.ed__stack > div > p + p{margin-top:var(--s1)}

/* 3.2 · Reglas en dos columnas: 01–02 a la izquierda, 03–04 a la derecha */
.canon--2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(4,auto);grid-auto-flow:column}
.canon--2 .canon__row{grid-row:span 2;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:subgrid;row-gap:0;padding:var(--s8) var(--s8) var(--s10) 0}
.canon--2 .canon__row:nth-child(n+3){padding:var(--s8) 0 var(--s10) var(--s8);border-left:1px solid var(--color-border)}
.canon--2 .canon__rule,.canon--2 .canon__ex{grid-column:1}
.canon--2 .canon__ex{align-self:start;padding-top:var(--s8);margin-top:0}
.canon--2 .canon__d{max-width:none}
@media(max-width:900px){.canon--2{grid-template-columns:1fr;grid-template-rows:none;grid-auto-flow:row}.canon--2 .canon__row{grid-row:auto;grid-template-rows:auto}.canon--2 .canon__row,.canon--2 .canon__row:nth-child(n+3){padding:var(--s8) 0 var(--s10);border-left:0}}

/* 3.3 · Selector de palabras: la lista crece sin ocupar más espacio */
.lexi{margin-top:var(--s16);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s6);border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border)}
.lexi__list{grid-column:1 / span 4;max-height:440px;overflow-y:auto;padding:var(--s5) var(--s5) var(--s5) 0;border-right:1px solid var(--color-border);scrollbar-width:thin;scrollbar-color:var(--color-border-strong) transparent}
.lexi__list button{display:grid;grid-template-columns:30px minmax(0,1fr);align-items:baseline;width:100%;padding:8px 0;text-align:left;font-size:16px;line-height:1.35;color:var(--color-text-3);transition:color var(--m-fast) var(--e-out)}
.lexi__list button span{font-size:12px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.lexi__list button:hover,.lexi__list button[aria-selected="true"]{color:var(--color-text)}
.lexi__list button[aria-selected="true"]{font-weight:500}
.lexi__list button[aria-selected="true"] span{color:var(--color-text)}
.lexi__panel{grid-column:6 / -1;display:flex;flex-direction:column;padding:var(--s10) 0 var(--s8)}
.lexi__count{color:var(--color-text-3)}
.lexi__w{margin-top:var(--s6);font-size:clamp(30px,3.2vw,44px);font-weight:500;line-height:1.1;letter-spacing:-.03em;color:var(--color-text);text-wrap:balance}
.lexi__d{margin-top:var(--s5);max-width:440px;font-size:18px;line-height:1.55;color:var(--color-text-2);text-wrap:pretty}
.lexi__panel.is-swap .lexi__w,.lexi__panel.is-swap .lexi__d{animation:lexiIn var(--m-base) var(--e-out)}
@keyframes lexiIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.lexi__nav{display:flex;gap:var(--s8);margin-top:auto;padding-top:var(--s12)}
@media(max-width:760px){
  .lexi__list{grid-column:1 / -1;display:flex;gap:var(--s6);max-height:none;overflow-x:auto;overflow-y:hidden;padding:var(--s4) 0;border-right:0;border-bottom:1px solid var(--color-border);scroll-snap-type:x mandatory}
  .lexi__list button{display:flex;gap:6px;width:auto;flex:0 0 auto;white-space:nowrap;scroll-snap-align:start}
  .lexi__panel{grid-column:1 / -1;padding-top:var(--s8)}
}

/* 3.7 · Así lo decimos: término arriba, frase humana debajo */
.ed__sub{margin-top:var(--s20);font-size:18px;font-weight:500;letter-spacing:-.01em;color:var(--color-text)}
.gloss{margin-top:var(--s6);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s10);border-bottom:1px solid var(--color-border)}
.gloss > div{display:grid;align-content:start;row-gap:var(--s2);padding:var(--s5) 0 var(--s6);border-top:1px solid var(--color-border)}
.gloss .paren{color:var(--color-text-3)}
.gloss p{font-size:17px;line-height:1.45;letter-spacing:-.008em;color:var(--color-text)}
@media(max-width:760px){.gloss{grid-template-columns:1fr}}

/* ════ Identidad · Logotipo ════ */
.lspec{margin-top:var(--s16)}
.lspec + .lspec{margin-top:var(--s20)}
.lspec__head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s6);align-items:start}
.lspec__name{grid-column:1 / span 5}
.lspec__n{display:block;margin-bottom:var(--s4);font-size:13px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.lspec__t{font-size:clamp(22px,2.1vw,27px);font-weight:500;line-height:1.2;letter-spacing:-.022em;color:var(--color-text)}
.lspec__txt{grid-column:6 / -1}
.lspec__txt p{font-size:15px;line-height:1.65;color:var(--color-text-2)}
.lspec__txt p + p{margin-top:var(--s4)}
.lspec__txt .paren{display:block;margin-bottom:var(--s1);color:var(--color-text-3)}
.stage{position:relative;display:grid;place-items:center;margin-top:var(--s8);aspect-ratio:16/7;background:var(--k-blanco);border:1px solid var(--color-border);color:var(--k-noche)}
.stage > .paren{position:absolute;left:var(--s5);top:var(--s4);color:var(--color-text-3)}
.stage svg{display:block;height:auto}
.stage--sq{aspect-ratio:4/3}
.stage--tall{aspect-ratio:auto;padding:var(--s16) var(--s8) var(--s10)}
.stage__pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s6);margin-top:var(--s6)}
.stage__pair .stage{margin-top:0}
.cap{margin-top:var(--s3);font-size:13px;line-height:1.5;color:var(--color-text-3)}
.grid-l{stroke:var(--k-cielo);stroke-opacity:.85;stroke-width:1;fill:none;vector-effect:non-scaling-stroke}
.zone{fill:var(--k-cielo-100);fill-opacity:.7;stroke:var(--k-cielo);stroke-width:1;vector-effect:non-scaling-stroke}
.zone-in{fill:var(--k-blanco);stroke:var(--k-cielo);stroke-width:1;stroke-opacity:.6;vector-effect:non-scaling-stroke}
.mark{color:var(--k-cielo-300)}
.minrow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s6);margin-top:var(--s12)}
.minrow .stage{aspect-ratio:auto;height:180px;margin-top:0}
.minrow img{display:block}
.minrow dl{margin-top:var(--s4);display:grid;grid-template-columns:auto 1fr;column-gap:var(--s4);row-gap:var(--s1);font-size:14px}
.minrow dt{color:var(--color-text-3)}
.minrow dd{color:var(--color-text);font-variant-numeric:tabular-nums}
.minrow h3{margin-top:var(--s5);font-size:16px;font-weight:500;color:var(--color-text)}
.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4);margin-top:var(--s12)}
.tile{display:grid;place-items:center;aspect-ratio:1;border:1px solid var(--color-border)}
.tile svg{width:56%;height:auto}
.tiles figcaption,.wrong figcaption{margin-top:var(--s3);font-size:13px;line-height:1.45;color:var(--color-text-2)}
.wrongs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s8) var(--s6);margin-top:var(--s12)}
.wrong .tile,.minspec .tile{aspect-ratio:4/3;overflow:hidden;position:relative}

.wrong figcaption b{display:block;margin-bottom:2px;font-weight:500;color:var(--color-text)}
.wrong .tile::after{content:"";position:absolute;right:14px;bottom:14px;width:26px;height:26px;border-radius:50%;
  background:var(--k-salmon) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 3l6 6M9 3l-6 6' stroke='white' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center/12px no-repeat}
@media(max-width:1100px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.wrongs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
  .lspec__name,.lspec__txt{grid-column:1 / -1}.lspec__txt{margin-top:var(--s5)}
  .stage__pair,.minrow{grid-template-columns:1fr}
  .stage{aspect-ratio:4/3}
  .wrongs{grid-template-columns:1fr}
}

/* 3.5 · Alcance: tres círculos que se abren desde Costa Rica */
.reachviz{position:relative;margin-top:var(--s16);aspect-ratio:21/8;overflow:hidden}
.reachviz svg{position:absolute;inset:0;width:100%;height:100%}
.reachviz .rv-c{fill:none;stroke:var(--k-noche);stroke-opacity:.55;stroke-width:1;vector-effect:non-scaling-stroke}
.reachviz .rv-halo{fill:var(--k-noche);fill-opacity:.1}
.reachviz .rv-l{stroke:rgba(16,18,42,.3);stroke-width:1;vector-effect:non-scaling-stroke}
.reachviz .rv-dot{fill:var(--k-noche)}
.reachviz__t{position:absolute;transform:translateY(-50%);font-size:clamp(13px,1.7vw,22px);font-weight:500;letter-spacing:-.015em;line-height:1.1;color:var(--k-noche);white-space:nowrap}
.anim .reachviz .rv-g{transition:transform 1.4s var(--e-out),opacity 1s ease;transform-box:view-box;transform-origin:21% 94.5%}
.anim .reachviz:not(.is-drawn) .rv-g{transform:scale(.82);opacity:0}
.anim .reachviz .rv-g:nth-of-type(2){transition-delay:.15s}
.anim .reachviz .rv-g:nth-of-type(3){transition-delay:.3s}
.anim .reachviz .reachviz__t,.anim .reachviz .rv-l{transition:opacity .8s ease .7s}
.anim .reachviz:not(.is-drawn) .reachviz__t,.anim .reachviz:not(.is-drawn) .rv-l{opacity:0}

/* 3.7 · Temáticas: índice vertical a la izquierda, la temática elegida a la derecha */
.ed__sub + .ed__lead{margin-top:var(--s3)}
.cats{margin-top:var(--s12);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s6);border-top:1px solid var(--color-border)}
.cats__tabs{grid-column:1 / span 4;align-self:start;position:sticky;top:calc(var(--hdr-h) + var(--s6));display:grid;padding:var(--s5) var(--s5) var(--s5) 0}
.cats__tabs button{display:grid;grid-template-columns:30px minmax(0,1fr);align-items:baseline;padding:9px 0;text-align:left;font-size:16px;line-height:1.35;color:var(--color-text-3);transition:color var(--m-fast) var(--e-out)}
.cats__tabs button span{font-size:12px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.cats__tabs button:hover,.cats__tabs button[aria-selected="true"]{color:var(--color-text)}
.cats__tabs button[aria-selected="true"]{font-weight:500}
.cats__tabs button[aria-selected="true"] span{color:var(--color-text)}
.cats__panel{grid-column:5 / -1;padding:var(--s6) 0 0 var(--s8);border-left:1px solid var(--color-border)}
.cats__panel[hidden]{display:none}
.cats__panel.is-swap{animation:lexiIn var(--m-base) var(--e-out)}
.cats__how{display:grid;row-gap:var(--s2);font-size:15px;line-height:1.6;color:var(--color-text-2)}
.cats__how .paren{color:var(--color-text-3)}
.cats .gloss{margin-top:var(--s6);grid-template-columns:1fr;border-bottom:0}
@media(max-width:760px){.cats__tabs{grid-column:1 / -1;position:static;display:flex;gap:var(--s5);overflow-x:auto;scroll-snap-type:x mandatory;border-bottom:1px solid var(--color-border)}.cats__tabs button{flex:0 0 auto;display:flex;gap:6px;white-space:nowrap;scroll-snap-align:start}.cats__panel{grid-column:1 / -1;padding-left:0;border-left:0}}

/* Fichas de tamaño mínimo: la marca a tamaño real con su cota */
.tile__lbl{position:absolute;left:14px;top:12px;color:var(--color-text-3)}
.minspec .tile{background:var(--k-blanco)}
.real{display:grid;justify-items:center;row-gap:8px}
.real svg{display:block;width:100%;height:auto;color:var(--k-noche)}
.dim{position:relative;width:100%;height:9px;border-left:1px solid var(--k-cielo);border-right:1px solid var(--k-cielo)}
.dim::before{content:"";position:absolute;left:0;right:0;top:4px;border-top:1px solid var(--k-cielo)}
.dim__t{font-size:11px;line-height:1;color:var(--color-text-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.minspec figcaption{margin-top:var(--s3);display:grid;row-gap:2px;font-size:13px;line-height:1.45;color:var(--color-text-2);font-variant-numeric:tabular-nums}
.minspec figcaption b{margin-bottom:2px;font-weight:500;color:var(--color-text)}

/* Retículas y áreas que se dibujan al entrar en pantalla */
.anim [data-draw] .grid-l{transform-box:fill-box;transform-origin:center;transition:transform 1.2s var(--e-out),opacity .9s ease;transition-delay:calc(var(--i,0) * 55ms)}
.anim [data-draw]:not(.is-drawn) .grid-v{transform:scaleY(0);opacity:0}
.anim [data-draw]:not(.is-drawn) .grid-h{transform:scaleX(0);opacity:0}
.anim [data-draw]:not(.is-drawn) .grid-c{transform:scale(.7);opacity:0}
.anim [data-draw] .zone{transition:opacity 1s ease .1s}
.anim [data-draw]:not(.is-drawn) .zone{opacity:0}
.anim [data-draw] .mk{transition:transform 1.2s var(--e-out) .3s,opacity .9s ease .3s}
.anim [data-draw]:not(.is-drawn) .mk{opacity:0}
.anim [data-draw]:not(.is-drawn) .mk--l{transform:translateX(40px)}
.anim [data-draw]:not(.is-drawn) .mk--r{transform:translateX(-40px)}
.anim [data-draw]:not(.is-drawn) .mk--t{transform:translateY(40px)}
.anim [data-draw]:not(.is-drawn) .mk--b{transform:translateY(-40px)}

/* Arcos sobre cualquier encabezado: el texto siempre por delante */
.portal__arcs + .portal__txt{z-index:1}

/* 4.1 · Versiones: número, nombre y texto apilados; la marca debajo */
.lspec{display:block}
.lspec__txt{margin-top:var(--s4);max-width:640px}
.lspec__txt p{font-size:17px;line-height:1.65;color:var(--color-text-2)}
.lspec__txt p + p{margin-top:var(--s4)}

/* 4.5 · Carrusel de tamaños mínimos: una ficha a la vez */
.mslide{margin-top:var(--s12)}
.mslide__view{overflow:hidden}
.mslide__track{display:flex;transition:transform .9s var(--e-out)}
.mslide__item{flex:0 0 100%;min-width:0}
.mslide__stage{position:relative;display:grid;place-items:center;aspect-ratio:16/7;background:var(--k-blanco);border:1px solid var(--color-border)}
.mslide__cap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s6);align-items:baseline;margin-top:var(--s6)}
.mslide__name{grid-column:1 / span 5;font-size:clamp(20px,1.9vw,24px);font-weight:500;line-height:1.2;letter-spacing:-.02em;color:var(--color-text)}
.mslide__cap dl{grid-column:6 / -1;display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:var(--s5);row-gap:var(--s1);font-size:15px;line-height:1.5}
.mslide__cap dt{color:var(--color-text-3)}
.mslide__cap dd{color:var(--color-text);font-variant-numeric:tabular-nums}
.mslide__foot{display:flex;align-items:center;gap:var(--s6);margin-top:var(--s10);padding-top:var(--s5);border-top:1px solid var(--color-border)}
.mslide__count{font-size:13px;color:var(--color-text-3);font-variant-numeric:tabular-nums}
.mslide__bar{position:relative;flex:1;height:1px;overflow:hidden;background:var(--color-border)}
.mslide__bar i{position:absolute;inset:0;background:var(--k-cielo);transform:scaleX(0);transform-origin:left}
.mslide.is-run .mslide__bar i{animation:mslideRun var(--dur,5s) linear forwards}
.mslide.is-paused .mslide__bar i{animation-play-state:paused}
@keyframes mslideRun{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.mslide__nav{display:flex;gap:var(--s6)}
@media(max-width:760px){.mslide__stage{aspect-ratio:4/3}.mslide__name,.mslide__cap dl{grid-column:1 / -1}.mslide__cap dl{margin-top:var(--s3)}}

/* 4.7 · Lista de usos incorrectos */
.vgrid--no{row-gap:var(--s8)}

/* 4.11 · Cifras del criterio de transición */
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:var(--s12);border-top:1px solid var(--color-border-strong)}
.stats > div{padding:var(--s8) var(--s6) var(--s10);border-left:1px solid var(--color-border)}
.stats > div:first-child{padding-left:0;border-left:0}
.stats__n{display:block;font-size:13px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.stats__v{margin-top:var(--s6);white-space:nowrap;font-size:clamp(28px,2.8vw,40px);font-weight:500;line-height:1;letter-spacing:-.035em;color:var(--color-text);font-variant-numeric:tabular-nums}
.stats__t{margin-top:var(--s5);font-size:16px;font-weight:500;color:var(--color-text)}
.stats__d{margin-top:var(--s2);font-size:14px;line-height:1.55;color:var(--color-text-2)}
@media(max-width:900px){.stats{grid-template-columns:1fr}.stats > div{padding-left:0;border-left:0;border-bottom:1px solid var(--color-border)}}

/* 4.8 · Los corchetes aparecen dentro del logotipo */
.anim [data-draw] .emerge{transition:opacity 1.4s ease .4s}
.anim [data-draw]:not(.is-drawn) .emerge{opacity:0}

/* Arcos sobre Azul Noche: sin velo blanco, en tonos vecinos del propio noche */
.portal:not(.portal--cielo) .portal__arcs{backdrop-filter:none;-webkit-backdrop-filter:none;background-color:transparent;
  background-image:repeating-radial-gradient(circle at -8% 140%,
    rgba(150,158,210,.16) 0px,rgba(150,158,210,.16) 1px,
    rgba(5,8,23,.1) 1px,rgba(5,8,23,0) 30px,
    rgba(5,8,23,0) 31px,rgba(40,44,82,.12) 59px,
    rgba(40,44,82,.12) 60px)}

/* 6.1 · Capas concéntricas */
.reachviz--layers .rv-g{transform-origin:23% 49.9%!important}

/* 5.11 · Cifras: número grande, unidad volada y una línea que crece */
.tally{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--s8);margin-top:var(--s12)}
.tally__i{position:relative;padding:var(--s2) 0 var(--s4) var(--s5)}
.tally__i::before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--color-border-strong);transform-origin:top}
.tally__n{display:block;font-size:13px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.tally__v{display:flex;align-items:flex-start;margin-top:var(--s10);font-size:clamp(56px,6.4vw,88px);font-weight:400;line-height:.9;letter-spacing:-.05em;color:var(--color-text);font-variant-numeric:tabular-nums}
.tally__v b{font-weight:400}
.tally__v sup{margin:.12em 0 0 .12em;font-size:15px;font-weight:500;letter-spacing:0;line-height:1;color:var(--color-text-2)}
.tally__t{margin-top:var(--s6);font-size:16px;font-weight:500;color:var(--color-text)}
.tally__d{margin-top:var(--s2);font-size:14px;line-height:1.55;color:var(--color-text-2);max-width:240px}
.anim .tally__i::before{transition:transform 1.2s var(--e-out)}
.anim .tally:not(.is-drawn) .tally__i::before{transform:scaleY(0)}
.anim .tally .tally__i:nth-child(2)::before{transition-delay:.12s}
.anim .tally .tally__i:nth-child(3)::before{transition-delay:.24s}
@media(max-width:900px){.tally{grid-template-columns:1fr;row-gap:var(--s10)}}

/* 6.6 · Escalas tonales */
.scales{margin-top:var(--s12);display:grid;row-gap:var(--s12)}
.scale__head{display:flex;align-items:baseline;gap:var(--s4);flex-wrap:wrap}
.scale__t{font-size:18px;font-weight:500;letter-spacing:-.01em;color:var(--color-text)}
.scale__d{font-size:14px;color:var(--color-text-3)}
.scale__row{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));margin-top:var(--s4)}
.tone{position:relative;display:grid;align-content:space-between;min-height:118px;padding:var(--s3) var(--s2) var(--s3) var(--s3);text-align:left;cursor:copy;font-size:12px;line-height:1.3;transition:transform var(--m-fast) var(--e-out)}
.tone:hover{transform:translateY(-3px)}
.tone__s{font-weight:500}
.tone__h{font-variant-numeric:tabular-nums;opacity:.85}
.tone__tag{position:absolute;left:var(--s3);top:30px;font-size:11px;opacity:.85}
@media(max-width:900px){.scale__row{grid-template-columns:repeat(3,minmax(0,1fr))}.tone{min-height:84px}}

/* 6.7 · Cielos con sus ingredientes */
.skyrows{margin-top:var(--s12);border-bottom:1px solid var(--color-border)}
.skyrow{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s6);padding:var(--s8) 0;border-top:1px solid var(--color-border)}
.skyrow__img{grid-column:1 / span 3;aspect-ratio:3/4;background:center/cover no-repeat}
.skyrow__body{grid-column:5 / -1}
.skyrow__n{display:block;font-size:13px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.skyrow__t{margin-top:var(--s3);font-size:clamp(22px,2.1vw,27px);font-weight:500;letter-spacing:-.022em;line-height:1.2}
.skyrow__d{margin-top:var(--s3);font-size:15px;line-height:1.6;color:var(--color-text-2);max-width:460px}
.skyrow__f{display:grid;row-gap:2px;margin-top:var(--s4);font-size:14px;color:var(--color-text)}
.skyrow__f .paren{color:var(--color-text-3)}
.ings{display:flex;flex-wrap:wrap;gap:var(--s3) var(--s4);margin-top:var(--s6)}
.ing{display:grid;justify-items:start;row-gap:6px;font-size:11px;color:var(--color-text-3);font-variant-numeric:tabular-nums;cursor:copy;text-align:left}
.ing i{width:40px;height:40px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(16,18,42,.08)}
.ing--tbd{cursor:default}
.ing--tbd i{background:transparent;box-shadow:none;border:1px dashed var(--color-border-strong)}
@media(max-width:760px){.skyrow__img{grid-column:1 / span 5}.skyrow__body{grid-column:7 / -1}}

/* 6.9 · Gradiente Keyons frente al de librería */
.gradpair{display:grid;grid-template-columns:1fr 1fr;gap:var(--s6);margin-top:var(--s12)}
.gradpair figcaption{display:grid;row-gap:2px;margin-top:var(--s3);font-size:14px;color:var(--color-text-2)}
.gradpair figcaption .paren{color:var(--color-text-3)}
.gradpair s{text-decoration-color:var(--k-salmon);text-decoration-thickness:1.5px}
#gradientes .canon{margin-top:var(--s12)}
#gradientes .canon__ex{display:none}
@media(max-width:760px){.gradpair{grid-template-columns:1fr}}

/* 6.10–6.12 · Barras de proporción */
.props{display:grid;row-gap:var(--s8);margin-top:var(--s12)}
.props .prop{margin-top:0}
.prop{margin-top:var(--s12)}
.prop__l{margin-bottom:var(--s3);font-size:13px;font-weight:500;color:var(--color-text-3)}
.prop__bar{display:flex;height:64px;box-shadow:inset 0 0 0 1px var(--color-border)}
.prop__s{display:flex;align-items:flex-end;min-width:0;padding:var(--s3);font-size:13px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(16,18,42,.12)}
.prop__s + .prop__s{box-shadow:inset 0 0 0 1px rgba(16,18,42,.12),inset 1px 0 0 rgba(16,18,42,.12)}
.prop__s b{font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap}
.prop__leg{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s6);margin-top:var(--s3);font-size:13px;color:var(--color-text-2)}
.prop__leg span{display:inline-flex;align-items:center;gap:var(--s2)}
.prop__leg i{width:10px;height:10px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--color-border-strong)}
.moments{margin-top:var(--s10)}
.moments .paren{color:var(--color-text-3)}
.moments ul{list-style:none;display:flex;flex-wrap:wrap;gap:var(--s2) var(--s3);margin-top:var(--s3)}
.moments li{padding:6px 14px;border-radius:var(--r-pill);box-shadow:inset 0 0 0 1px var(--color-border-strong);font-size:14px;color:var(--color-text)}
.tbl--models td{vertical-align:top;line-height:1.5}
.tbl--models td:nth-child(2){max-width:300px;white-space:normal}

/* 6.14 · Grises tipográficos como muestra de lectura */
.grays{margin-top:var(--s12);border-bottom:1px solid var(--color-border)}
.gray{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s6);align-items:center;padding:var(--s6) 0;border-top:1px solid var(--color-border)}
.gray__n{grid-column:1 / span 3;font-size:13px;color:var(--color-text-3)}
.gray__s{grid-column:4 / span 6;font-size:19px;line-height:1.4;letter-spacing:-.01em}
.gray__line{grid-column:4 / span 6;height:2px}
.gray__m{grid-column:10 / -1;display:grid;row-gap:2px;font-size:13px;color:var(--color-text-2);font-variant-numeric:tabular-nums;text-align:right}
.gray__m button,.hexlink{font:inherit;color:var(--color-text);cursor:copy;font-variant-numeric:tabular-nums}
.gray__m button{justify-self:end}
.hexlink{border-bottom:1px solid var(--k-cielo)}
@media(max-width:760px){.gray__n,.gray__s,.gray__line,.gray__m{grid-column:1 / -1}.gray__m{text-align:left;margin-top:var(--s2)}.gray__m button{justify-self:start}}

/* 6.15 · Estados */
.states{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s5);margin-top:var(--s12)}
.state{aspect-ratio:1}
.state--tbd{border:1px dashed var(--color-border-strong)}
.states figcaption{display:grid;row-gap:2px;margin-top:var(--s3);font-size:13px;color:var(--color-text-3)}
.states figcaption b{font-weight:500;color:var(--color-text)}
@media(max-width:760px){.states{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* 7.1 · Familias */
.fams{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:var(--s12);border-top:1px solid var(--color-border)}
.fam{padding:var(--s8) var(--s8) 0 0}
.fam + .fam{padding:var(--s8) 0 0 var(--s8);border-left:1px solid var(--color-border)}
.fam__glyph{font-size:clamp(110px,12vw,168px);font-weight:500;line-height:.9;letter-spacing:-.05em;color:var(--color-text)}
.fam--display .fam__glyph{font-family:var(--font-display)}
.fam__t{margin-top:var(--s8);font-size:22px;font-weight:500;letter-spacing:-.02em}
.fam--display .fam__t{font-family:var(--font-display)}
.fam__r{margin-top:var(--s1);font-size:13px;font-weight:500;color:var(--color-text-3)}
.fam__m{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:var(--s5);row-gap:var(--s2);margin-top:var(--s6);font-size:14px;line-height:1.5}
.fam__m dt{color:var(--color-text-3)}
.fam__m dd{color:var(--color-text)}
.fam__abc{margin-top:var(--s8);font-size:15px;line-height:1.6;letter-spacing:.02em;color:var(--color-text-2);word-break:break-all}
.fam--display .fam__abc{font-family:var(--font-display)}
@media(max-width:760px){.fams{grid-template-columns:1fr}.fam + .fam{padding-left:0;border-left:0;margin-top:var(--s8);border-top:1px solid var(--color-border)}}

/* 7.2 · Escala con líneas guía, al estilo de un pliego de especificación */
.tsc{margin-top:var(--s12);border-bottom:1px solid var(--color-border)}
.tsc__head,.tsc__row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s5);align-items:baseline}
.tsc__head{padding-bottom:var(--s3);font-size:12px;color:var(--color-text-3)}
.tsc__head span:nth-child(1),.tsc__n{grid-column:1 / span 2}
.tsc__head span:nth-child(2),.tsc__s{grid-column:3 / span 7}
.tsc__head span:nth-child(3),.tsc__m{grid-column:10 / -1}
.tsc__row{padding:var(--s5) 0;border-top:1px solid var(--color-border)}
.tsc__n{font-size:13px;color:var(--color-text-3)}
.tsc__s{color:var(--color-text);min-width:0}
.tsc__m{display:grid;row-gap:2px;font-size:12px;line-height:1.45;color:var(--color-text-3);font-variant-numeric:tabular-nums}
.tsc--display{font-family:var(--font-display);font-weight:500;font-size:clamp(52px,6.6vw,96px);line-height:.93;letter-spacing:-.04em}
.tsc--h2{font-weight:500;font-size:clamp(30px,3.2vw,44px);line-height:1.1;letter-spacing:-.03em;color:var(--color-text-title-muted)!important}
.tsc--h3{font-weight:500;font-size:clamp(22px,2.1vw,27px);line-height:1.2;letter-spacing:-.022em}
.tsc--h4{font-weight:600;font-size:18px;line-height:1.3;letter-spacing:-.015em}
.tsc--lead{font-size:clamp(18px,1.5vw,20px);line-height:1.55;color:var(--color-text-2)!important}
.tsc--body{font-size:17px;line-height:1.65;color:var(--color-text-2)!important}
.tsc--sm{font-size:15px;line-height:1.6;color:var(--color-text-2)!important}
.tsc--paren{font-size:13px;font-weight:500;color:var(--color-text-2)!important}
.tsc--kicker{font-family:var(--font-display);font-weight:500;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
@media(max-width:900px){.tsc__head{display:none}.tsc__n,.tsc__s,.tsc__m{grid-column:1 / -1}.tsc__s{margin-top:var(--s2)}.tsc__m{margin-top:var(--s2)}}

/* 7.3 y 7.4 · Demostraciones */
.tdemo{margin-top:var(--s12);padding:var(--s10) 0 var(--s10) var(--s8);border-left:1px solid var(--color-border-strong)}
.tdemo__t{font-size:clamp(26px,2.6vw,34px);font-weight:500;line-height:1.1;letter-spacing:-.03em;color:var(--color-text-title-muted)}
.tdemo__l{margin-top:var(--s5);max-width:520px;font-size:18px;line-height:1.55;color:var(--color-text-2)}
.tdemo__c{margin-top:var(--s8);max-width:520px;font-size:20px;line-height:1.5;color:var(--color-text-2)}
.kdemo{display:flex;flex-wrap:wrap;gap:var(--s10);margin-top:var(--s12);padding:var(--s10) 0;border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border)}

/* ════ Regla de esquinas en grupos: exterior recto, interior curvo ════
   Una esquina que toca el borde del grupo es recta; la que mira a otro miembro del grupo, curva. */
.stage--tall + .stage__pair{margin-top:var(--s2)}
.stage--tall:has(+ .stage__pair){border-radius:0 0 var(--r-component) var(--r-component)}
.stage--tall + .stage__pair{gap:var(--s2)}
.stage--tall + .stage__pair > .stage:first-child{border-radius:var(--r-component) var(--r-component) var(--r-component) 0}
.stage--tall + .stage__pair > .stage:last-child{border-radius:var(--r-component) var(--r-component) 0 var(--r-component)}
.tiles{gap:var(--s2)}
.tiles > figure:first-child .tile{border-radius:0 var(--r-component) var(--r-component) 0}
.tiles > figure:not(:first-child):not(:last-child) .tile{border-radius:var(--r-component)}
.tiles > figure:last-child .tile{border-radius:var(--r-component) 0 0 var(--r-component)}
.scale__row{gap:4px;padding-bottom:26px}
.tone{box-shadow:inset 0 0 0 1px rgba(16,18,42,.1);border-radius:var(--r-control)}
.tone:first-child{border-radius:0 var(--r-control) var(--r-control) 0}
.tone:last-child{border-radius:var(--r-control) 0 0 var(--r-control)}
.tone.is-base::after{content:"";position:absolute;left:50%;bottom:-22px;width:12px;height:12px;margin-left:-6px;background:var(--k-noche);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='3.2 3.6 25.6 25.6'%3E%3Cpath fill-rule='evenodd' d='M22.53,28.42l-6.53-4.04-6.53,4.04-2.54-1.85,1.84-7.43-5.87-4.94.97-2.99,7.67-.55,2.9-7.09h3.14l2.9,7.09,7.67.55.97,2.99-5.87,4.94,1.84,7.43-2.53,1.85ZM16,20.48 L20.9,23.51 L19.52,17.93 L23.91,14.23 L18.17,13.82 L16,8.49 L13.83,13.82 L8.09,14.23 L12.48,17.93 L11.1,23.51 L16,20.48Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='3.2 3.6 25.6 25.6'%3E%3Cpath fill-rule='evenodd' d='M22.53,28.42l-6.53-4.04-6.53,4.04-2.54-1.85,1.84-7.43-5.87-4.94.97-2.99,7.67-.55,2.9-7.09h3.14l2.9,7.09,7.67.55.97,2.99-5.87,4.94,1.84,7.43-2.53,1.85ZM16,20.48 L20.9,23.51 L19.52,17.93 L23.91,14.23 L18.17,13.82 L16,8.49 L13.83,13.82 L8.09,14.23 L12.48,17.93 L11.1,23.51 L16,20.48Z'/%3E%3C/svg%3E") center/contain no-repeat}
.tone__base{position:absolute;left:var(--s3);top:30px;font-size:11px;opacity:.85}
.prop__bar{gap:3px;box-shadow:none}
.prop__s{box-shadow:inset 0 0 0 1px rgba(16,18,42,.1)!important;border-radius:var(--r-control)}
.prop__s:first-child{border-radius:0 var(--r-control) var(--r-control) 0}
.prop__s:last-child{border-radius:var(--r-control) 0 0 var(--r-control)}
.prop__s:only-child{border-radius:0}

/* 5.6 · Los dos colores de cada combinación */
.pair{display:grid;row-gap:var(--s1);margin-top:var(--s3);font-size:14px;color:var(--color-text)}
.pair span{display:inline-flex;align-items:center;gap:var(--s2)}
.pair span + span{color:var(--color-text-2)}
.pair i{width:12px;height:12px;border-radius:50%}

/* 5.7 · Lista de una sola columna */
.nolist{list-style:none;margin-top:var(--s12);border-bottom:1px solid var(--color-border)}
.nolist li{display:grid;grid-template-columns:20px minmax(0,4fr) minmax(0,7fr);column-gap:var(--s5);align-items:center;padding:var(--s4) 0;border-top:1px solid var(--color-border)}
.nolist li svg{align-self:center;color:var(--vc,var(--k-salmon))}
.nolist__t{font-size:16px;font-weight:500;color:var(--color-text)}
.nolist__d{font-size:15px;line-height:1.55;color:var(--color-text-2)}
@media(max-width:760px){.nolist li{grid-template-columns:20px minmax(0,1fr)}.nolist__d{grid-column:2}}

/* 5.11 · Cifras en carrusel: número grande y texto al lado */
.mslide--stats .mslide__view{border-top:2px solid var(--k-noche)}
.stat{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s6);align-items:center;min-height:260px;padding:var(--s8) 0}
.stat__v{grid-column:1 / span 6;display:flex;align-items:flex-start;font-size:clamp(96px,11vw,168px);font-weight:400;line-height:.85;letter-spacing:-.06em;color:var(--color-text);font-variant-numeric:tabular-nums}
.stat__v b{font-weight:400}
.stat__v sup{margin:.1em 0 0 .14em;font-size:18px;font-weight:500;letter-spacing:0;line-height:1;color:var(--color-text-2)}
.stat__txt{grid-column:8 / -1}
.stat__n{font-family:var(--font-display);font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-3)}
.stat__t{margin-top:var(--s3);font-size:22px;font-weight:500;line-height:1.2;letter-spacing:-.02em;color:var(--color-text)}
.stat__d{margin-top:var(--s3);font-size:15px;line-height:1.6;color:var(--color-text-2)}
.mslide--stats .mslide__foot{margin-top:0;border-top:1px solid var(--color-border)}
@media(max-width:760px){.stat__v,.stat__txt{grid-column:1 / -1}.stat__txt{margin-top:var(--s5)}}

/* 6.1 · Esferas de mayor a menor presencia */
.orbs{position:relative;margin-top:var(--s16);aspect-ratio:1000/430}
.orbs svg{position:absolute;inset:0;width:100%;height:100%}
.orbs .orb-line{fill:none;stroke:var(--k-noche);stroke-opacity:.45;stroke-width:1;vector-effect:non-scaling-stroke}
.orbs .orb-l{stroke:var(--k-noche);stroke-opacity:.35;stroke-width:1;vector-effect:non-scaling-stroke}
.orbs__t{position:absolute;transform:translateY(-100%);display:flex;align-items:baseline;gap:8px;padding-left:2px;font-size:clamp(13px,1.5vw,19px);font-weight:500;line-height:1.15;letter-spacing:-.015em;color:var(--color-text);white-space:nowrap}
.orbs__t span{font-size:12px;font-weight:500;letter-spacing:0;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.orbs__t small{font-size:13px;font-weight:400;letter-spacing:0;color:var(--color-text-3)}
@media(max-width:760px){.orbs__t small{display:none}}

/* 6.2 · Texto, flecha orgánica y escala de proporción bajo la paleta */
.palette--v2{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.palette__txt .ed__lead + .ed__lead{margin-top:var(--s6)}
.palette__arrow{display:block;width:100%;max-width:340px;height:auto;margin-top:var(--s10);fill:none;stroke:var(--k-noche);stroke-opacity:.55;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:900px){.palette__arrow{display:none}}

/* 6.9 · Gradientes de muestra */
.gdemo{position:relative;aspect-ratio:4/3;overflow:hidden}
.gdemo--org{background:url("../assets/img/cielo-atardecer.webp") center/cover}
.gdemo--lin{background:url("../assets/img/gradiente-lineal.webp") center/cover}
.gradpair > figure:first-child .gdemo{border-radius:0 var(--r-component) var(--r-component) 0}
.gradpair > figure:last-child .gdemo{border-radius:var(--r-component) 0 0 var(--r-component)}
.gradpair{gap:var(--s2)}

/* Momentos vivos: lista con viñetas cuadradas intercaladas */
.vlist{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s10);margin-top:var(--s3)!important}
.vlist li{display:flex;align-items:center;gap:var(--s3);padding:var(--s3) 0;border-top:1px solid var(--color-border);font-size:15px;color:var(--color-text);box-shadow:none!important;border-radius:0!important}
.vlist svg{flex:0 0 auto;width:16px;height:16px;color:var(--vc,var(--k-salmon))}
.moments .vlist li{padding:var(--s3) 0}
@media(max-width:760px){.vlist{grid-template-columns:1fr}}

/* 6.13 · Matriz de tres modelos */
.matrix--3 .matrix__row{grid-template-columns:150px repeat(3,minmax(0,1fr))}

/* Arcos sobre Azul Cielo: sin velo, en tonos vecinos del celeste */
.portal--cielo .portal__arcs{backdrop-filter:none;-webkit-backdrop-filter:none;background-color:transparent;
  background-image:repeating-radial-gradient(circle at -8% 140%,
    rgba(224,231,241,.3) 0px,rgba(224,231,241,.3) 1px,
    rgba(36,45,78,.04) 1px,rgba(36,45,78,0) 30px,
    rgba(36,45,78,0) 31px,rgba(172,195,231,.12) 59px,
    rgba(172,195,231,.12) 60px)}

/* ════ 07 · Tipografía ════ */
.plate{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s6);align-items:end;margin-top:var(--s12);padding-top:var(--s8);border-top:1px solid var(--color-border)}
.plate__glyph{grid-column:1 / span 6;font-size:clamp(150px,17vw,260px);font-weight:500;line-height:.78;letter-spacing:-.06em;color:var(--color-text)}
.plate__body{grid-column:8 / -1}
.plate--flip .plate__glyph{grid-column:7 / -1;grid-row:1;text-align:right}
.plate--flip .plate__body{grid-column:1 / span 5;grid-row:1}
.plate--display .plate__glyph,.plate--display .plate__t,.plate--display .plate__w,.plate--display .plate__abc{font-family:var(--font-display)}
.plate--display .plate__glyph{color:var(--color-text-title-muted)}
.plate .paren{color:var(--color-text-3)}
.plate__t{margin-top:var(--s3);font-size:clamp(24px,2.4vw,32px);font-weight:500;letter-spacing:-.025em;line-height:1.1}
.plate__d{margin-top:var(--s3);font-size:15px;line-height:1.6;color:var(--color-text-2)}
.plate__w{list-style:none;margin-top:var(--s6);border-top:1px solid var(--color-border)}
.plate__w li{display:flex;justify-content:space-between;align-items:baseline;padding:var(--s2) 0;border-bottom:1px solid var(--color-border);font-size:20px;letter-spacing:-.01em;color:var(--color-text)}
.plate__w li span{font-size:12px;font-weight:500;color:var(--color-text-3);font-variant-numeric:tabular-nums}
.plate__abc{margin-top:var(--s5);font-size:13px;line-height:1.7;letter-spacing:.04em;color:var(--color-text-3);word-break:break-all}
.plate__note{margin-top:var(--s8);font-size:14px;color:var(--color-text-3)}

.sp{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s6);margin-top:var(--s12)}
.sp__sheet{grid-column:1 / span 8}
.sp__row{display:grid;grid-template-columns:72px minmax(0,1fr);column-gap:var(--s5);align-items:end;padding:var(--s4) 0 var(--s2);border-bottom:1px solid var(--color-border)}
.sp__k{font-size:11px;color:var(--color-text-3);padding-bottom:4px}
.sp__m{grid-column:2;margin-top:var(--s1);font-size:11px;color:var(--k-cielo-600, #5E80B9);font-variant-numeric:tabular-nums}
.sp__s{color:var(--color-text)}
.sp--kicker .kicker{margin:0}
.sp--title{font-size:clamp(30px,3.2vw,44px);font-weight:500;line-height:1.1;letter-spacing:-.03em;color:var(--color-text-title-muted)}
.sp--lead{font-size:clamp(18px,1.5vw,20px);line-height:1.55;color:var(--color-text-2)}
.sp--body{font-size:17px;line-height:1.65;color:var(--color-text-2);max-width:520px}
.sp--paren{font-size:13px;font-weight:500;color:var(--color-text-2)}
.sp__display{grid-column:10 / -1;align-self:start;padding-top:var(--s4)}
.sp__aa{font-family:var(--font-display);font-weight:500;font-size:clamp(96px,10vw,150px);line-height:.85;letter-spacing:-.05em;color:var(--color-text-title-muted)}
.sp__cap{display:grid;row-gap:2px;margin-top:var(--s4);padding-top:var(--s3);border-top:1px solid var(--color-border);font-size:12px;color:var(--color-text-3)}
.sp__cap b{font-weight:500;color:var(--color-text)}
.szcs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:var(--s6);border-top:1px solid var(--color-border-strong)}
.szc{padding:var(--s5) var(--s5) var(--s6) 0;border-bottom:1px solid var(--color-border)}
.szc:not(:nth-child(3n+1)){padding-left:var(--s5);border-left:1px solid var(--color-border)}
.szc__k{font-size:13px;color:var(--color-text-3)}
.szc__v{display:flex;align-items:flex-start;margin-top:var(--s3);font-size:34px;font-weight:400;line-height:1;letter-spacing:-.03em;color:var(--color-text);font-variant-numeric:tabular-nums}
.szc__v sup{margin:.15em 0 0 .2em;font-size:12px;letter-spacing:0;color:var(--color-text-3)}
.szc__m{margin-top:var(--s3);font-size:13px;line-height:1.5;color:var(--color-text-2)}

.anat{row-gap:var(--s10)}
.anat__s{grid-column:1 / span 8;color:var(--color-text)}
.anat--t{font-size:clamp(28px,2.8vw,38px);font-weight:500;line-height:1.1;letter-spacing:-.03em;color:var(--color-text-title-muted)}
.anat--l{font-size:18px;line-height:1.55;color:var(--color-text-2)}
.anat--c{font-size:20px;line-height:1.5;color:var(--color-text-2)}

.kzoom{margin-top:var(--s12)}
.kzoom__big{padding:var(--s12) 0 var(--s8);border-top:1px solid var(--color-border)}
.kzoom__big .kicker{font-size:clamp(28px,4vw,52px);gap:.6em}
.kzoom__big .kicker::before{width:.9em;height:.9em}
.kzoom__parts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--s8)}
.kzoom__parts > div{padding-top:var(--s4);border-top:1px solid var(--k-noche)}
.kzoom__parts .paren{color:var(--color-text)}
.kzoom__parts p{margin-top:var(--s2);font-size:14px;line-height:1.55;color:var(--color-text-2)}
.kzoom__real{display:flex;align-items:center;gap:var(--s8);margin-top:var(--s10);padding-top:var(--s6);border-top:1px solid var(--color-border)}
.kzoom__real .paren{color:var(--color-text-3)}

.rulexs{margin-top:var(--s12);border-bottom:1px solid var(--color-border)}
.rulex{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s6);align-items:center;padding:var(--s8) 0;border-top:1px solid var(--color-border)}
.rulex__r{grid-column:1 / span 6}
.rulex__n{font-size:13px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.rulex__t{margin-top:var(--s3);font-size:20px;font-weight:500;line-height:1.2;letter-spacing:-.02em;color:var(--color-text)}
.rulex__d{margin-top:var(--s3);max-width:340px;font-size:15px;line-height:1.6;color:var(--color-text-2)}
.rulex__demo{grid-column:8 / -1;color:var(--color-text)}
.dm-a{font-size:20px;font-weight:600;letter-spacing:-.015em}
.dm-b{margin-top:var(--s2);font-size:15px;line-height:1.6;color:var(--color-text-2)}
.dm-sizes{display:flex;align-items:baseline;gap:var(--s6);font-weight:500;letter-spacing:-.03em}
.dm-tight{font-size:26px;font-weight:500;line-height:1.05;letter-spacing:-.03em;color:var(--color-text-title-muted)}
.dm-loose{margin-top:var(--s3);font-size:15px;line-height:1.65;color:var(--color-text-2)}
.dm-track{display:flex;align-items:baseline;gap:var(--s8)}
.dm-track > span:first-child{font-size:44px;font-weight:500;letter-spacing:-.04em}
.dm-num{display:grid;justify-items:end;width:max-content;font-size:20px;font-variant-numeric:tabular-nums}
.dm-tasa{font-family:var(--font-display);font-size:56px;font-weight:500;line-height:1;letter-spacing:-.04em}
@media(max-width:900px){
  .plate__glyph,.plate__body,.plate--flip .plate__glyph,.plate--flip .plate__body{grid-column:1 / -1;grid-row:auto;text-align:left}
  .plate__body{margin-top:var(--s6)}
  .sp__sheet,.sp__display{grid-column:1 / -1}.sp__display{margin-top:var(--s10)}
  .szcs{grid-template-columns:1fr 1fr}.szc:not(:nth-child(3n+1)){padding-left:0;border-left:0}
  .anat__s{grid-column:1 / -1}
  .kzoom__parts{grid-template-columns:1fr;row-gap:var(--s6)}
  .rulex__r,.rulex__demo{grid-column:1 / -1}.rulex__demo{margin-top:var(--s5)}
}
.moments .vlist{display:grid;gap:0 var(--s10)}

.orbs__t--r{flex-direction:row}

/* Fondo de los encabezados Azul Noche: un noche con luz salmón que suaviza las curvas */
.portal:not(.portal--cielo):not(.portal--img):not(.portal--salmon){background:url("../assets/img/degradado-noche-2.webp") center/cover,var(--k-noche)}
/* 5.6 · el Blanco necesita su contorno para verse sobre Blanco Keyons */
.pair i[style*="--k-blanco"]{box-shadow:inset 0 0 0 1px var(--color-border-strong)}
/* 6.9 · una sola línea entre las reglas y la pila de abajo */
#gradientes .canon + .ed__stack{margin-top:0;border-top:0}
#gradientes .canon + .ed__stack > div:first-child{border-top:0}

/* ════ Menú lateral contraído: solo números ════ */
.side__head{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);padding:0 var(--s4) var(--s6) 0}
.side__head .side__area{padding-bottom:0}
.side__toggle{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;color:var(--color-text-3);transition:background-color var(--m-fast) var(--e-out),color var(--m-fast) var(--e-out)}
.side__toggle:hover{background:var(--k-cielo-100);color:var(--color-text)}
.side__toggle svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--m-base) var(--e-io)}
.nav-item__n{display:none;font-size:12px;font-weight:500;font-variant-numeric:tabular-nums}
body.is-area.side-min .doc{grid-template-columns:76px minmax(0,1fr)}
.side-min .side__head{flex-direction:column-reverse;gap:var(--s4);padding:0 0 var(--s6)}
.side-min .side__area{padding:0}
.side-min .side__area .kicker{font-size:0;gap:0}
.side-min .side__toggle svg{transform:rotate(180deg)}
.side-min .nav-ch__btn{grid-template-columns:1fr;justify-items:center;padding:10px 0}
.side-min .nav-ch__btn > span:nth-child(2),.side-min .nav-ch__btn svg{display:none}
.side-min .nav-ch__num{font-size:13px;color:var(--color-text)}
.side-min .nav-sub,.side-min .nav-grp,.side-min .side__legend{display:none}
.side-min .nav-item{justify-content:center;margin:2px 10px;padding:6px 0;border-radius:var(--r-pill)}
.side-min .nav-item__t,.side-min .nav-item .dot{display:none}
.side-min .nav-item__n{display:inline}
@media(max-width:900px){.side__toggle{display:none}body.is-area.side-min .doc{grid-template-columns:minmax(0,1fr)}}

/* ════ Formato del código de color ════ */
.fmt-row{display:flex;align-items:center;gap:var(--s3);margin-top:var(--s5)}
.fmt-row .paren{color:var(--color-text-3)}
.fmt{display:inline-flex;gap:2px;padding:2px;border-radius:var(--r-pill);box-shadow:inset 0 0 0 1px var(--color-border-strong)}
.fmt button{padding:4px 12px;border-radius:var(--r-pill);font-size:12px;font-weight:500;color:var(--color-text-3);transition:background-color var(--m-fast) var(--e-out),color var(--m-fast) var(--e-out)}
.fmt button:hover{color:var(--color-text)}
.fmt button[aria-pressed="true"]{background:var(--k-noche);color:var(--k-blanco)}
.scales,.skyrows,.grays{margin-top:var(--s8)}

/* 6.6 · Escalas como fichas: color arriba, código en Azul Noche sobre Blanco Keyons */
.tone{display:grid;grid-template-rows:80px auto;align-content:stretch;min-height:0;padding:0;overflow:hidden;background:var(--k-blanco);box-shadow:inset 0 0 0 1px var(--color-border);color:var(--k-noche)!important}
.tone:hover{transform:none}
.tone__c{display:block}
.tone__l{display:grid;row-gap:2px;padding:var(--s2) var(--s2) var(--s3);text-align:left;font-size:11px;line-height:1.3}
.tone__s{display:flex;align-items:center;gap:5px;font-weight:600;color:var(--k-noche)}
.tone__h{color:var(--color-text-2);opacity:1;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.tone.is-base::after{display:none}
.tone.is-base .tone__s::after{content:"";width:10px;height:10px;background:var(--k-noche);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='3.2 3.6 25.6 25.6'%3E%3Cpath fill-rule='evenodd' d='M22.53,28.42l-6.53-4.04-6.53,4.04-2.54-1.85,1.84-7.43-5.87-4.94.97-2.99,7.67-.55,2.9-7.09h3.14l2.9,7.09,7.67.55.97,2.99-5.87,4.94,1.84,7.43-2.53,1.85ZM16,20.48 L20.9,23.51 L19.52,17.93 L23.91,14.23 L18.17,13.82 L16,8.49 L13.83,13.82 L8.09,14.23 L12.48,17.93 L11.1,23.51 L16,20.48Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='3.2 3.6 25.6 25.6'%3E%3Cpath fill-rule='evenodd' d='M22.53,28.42l-6.53-4.04-6.53,4.04-2.54-1.85,1.84-7.43-5.87-4.94.97-2.99,7.67-.55,2.9-7.09h3.14l2.9,7.09,7.67.55.97,2.99-5.87,4.94,1.84,7.43-2.53,1.85ZM16,20.48 L20.9,23.51 L19.52,17.93 L23.91,14.23 L18.17,13.82 L16,8.49 L13.83,13.82 L8.09,14.23 L12.48,17.93 L11.1,23.51 L16,20.48Z'/%3E%3C/svg%3E") center/contain no-repeat}
.scale__row{padding-bottom:0}
.tone__base{display:none}

/* 6.1 · etiquetas debajo de las esferas 02 y 04 */
.orbs{aspect-ratio:1000/520}
.orbs__t--b{transform:none}

/* 6.10–6.12 · leyenda como en Combinaciones */
.prop__leg{gap:var(--s2) var(--s8);font-size:14px;font-weight:600;color:var(--color-text)}
.prop__leg i{width:14px;height:14px;box-shadow:none}
.prop__leg i[style*="--k-blanco"]{box-shadow:inset 0 0 0 1px var(--color-border-strong)}

/* 6.15 · estados y badges */
.states{gap:var(--s2)}
.stfig{cursor:copy}
.stfig .state{width:100%;cursor:copy;border-radius:var(--r-component)}
.states > .stfig:first-child .state{border-radius:0 var(--r-component) var(--r-component) 0}
.states > .stfig:last-child .state{border-radius:var(--r-component) 0 0 var(--r-component)}
.states figcaption .cv{display:block;margin-top:2px;color:var(--color-text-2);font-variant-numeric:tabular-nums}
.bcards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s2);margin-top:var(--s10)}
.bcard{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s3);padding:var(--s8) var(--s6);background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border);border-radius:var(--r-component)}
.bcards > .bcard:first-child{border-radius:0 var(--r-component) var(--r-component) 0}
.bcards > .bcard:last-child{border-radius:var(--r-component) 0 0 var(--r-component)}
.bcard__t{margin-bottom:var(--s2);font-family:var(--font-display);font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-3)}
.badge{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:var(--r-pill);font-size:13px;font-weight:600;color:var(--k-noche)}
.badge svg{width:16px;height:16px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;color:var(--fg)}
.b-cel{background:#C6D5EC;--fg:#6D97DC}.b-ver{background:#D5E0D2;--fg:#789170}.b-ama{background:#F4E8C1;--fg:#C89B3F}.b-lav{background:#D9D6ED;--fg:#7E81B9}
.b-ter{background:#F0D0CB;--fg:#CE635D}.b-nar{background:#F5D8B8;--fg:#E87838}.b-gri{background:#E0E1E5;--fg:#6B6D7E}
@media(max-width:1100px){.bcards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.bcards{grid-template-columns:1fr}}

/* 5.1 · versiones con combinaciones */
.vcard{margin-top:var(--s8)}
.vstage{margin-top:0;transition:background-color .6s var(--e-out),color .6s var(--e-out),border-color .6s var(--e-out)}
.vstage__mark{width:100%;height:100%;display:grid;place-items:center;color:inherit;cursor:copy}
.vstage__mark svg{transition:transform var(--m-base) var(--e-out)}
.vstage__mark:hover svg{transform:scale(1.02)}
.vstage__hint{position:absolute;right:var(--s5);bottom:var(--s4);font-size:12px;color:var(--color-text-3);opacity:0;transition:opacity var(--m-base) var(--e-out)}
.vstage:hover .vstage__hint{opacity:1}
.vstage.is-dark{border-color:transparent}
.vstage.is-dark > .paren,.vstage.is-dark .vstage__hint{color:rgba(244,244,244,.62)}
.vbar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;row-gap:var(--s4);margin-top:var(--s4)}
.vbar__combo{display:flex;align-items:center;gap:var(--s3);font-size:14px;font-weight:600;color:var(--color-text)}
.vbar__combo span span{font-weight:400;color:var(--color-text-2)}
.vbar__dots{display:inline-flex}
.vbar__dots i{width:16px;height:16px;border-radius:50%;box-shadow:0 0 0 1px var(--k-blanco),0 0 0 2px var(--color-border-strong)}
.vbar__dots i + i{margin-left:-5px}
.vbar__nav{display:flex;align-items:center;gap:var(--s3);font-size:13px;color:var(--color-text-3);font-variant-numeric:tabular-nums}
.vbar__dl{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2)}
.vbar__dl .paren{margin-right:var(--s2);color:var(--color-text-3)}
.vbar__dl button{padding:6px 14px;border-radius:var(--r-pill);box-shadow:inset 0 0 0 1px var(--color-border-strong);font-size:13px;font-weight:500;color:var(--color-text);transition:background-color var(--m-fast) var(--e-out),color var(--m-fast) var(--e-out)}
.vbar__dl button:hover{background:var(--k-noche);color:var(--k-blanco)}

/* 5.4 · rayado tenue del área de protección */
.anim [data-draw] .zone-hatch{transition:opacity 1s ease .1s}
.anim [data-draw]:not(.is-drawn) .zone-hatch{opacity:0}

/* 2.1.1 · cielo esmerilado con una ventana nítida que da profundidad */
.zig__img{position:relative;overflow:hidden;isolation:isolate}
.zig__img::before{content:"";position:absolute;inset:-28px;z-index:-1;background-image:inherit;background-size:cover;background-position:center;filter:blur(16px) saturate(.92)}
.zig__img::after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(rgba(255,255,255,.2),rgba(255,255,255,.2)),var(--grain);background-size:auto,140px;mix-blend-mode:soft-light}
.zig__win{position:absolute;z-index:1;left:20%;top:30%;width:60%;height:34%;background-image:inherit;background-repeat:no-repeat;background-size:auto calc(100% / .34);background-position:50% 45.45%;
  box-shadow:inset 0 3px 10px rgba(16,18,42,.28),inset 0 -1px 0 rgba(255,255,255,.4),0 1px 0 rgba(255,255,255,.35)}
.zig__item:nth-child(even) .zig__win{left:15%;top:34%;width:70%;height:auto;aspect-ratio:1;border-radius:50%;background-size:auto calc(100% / .3043);background-position:50% 48.87%}
.zig__img{background-size:auto 100%}

/* ════ 07 · Tipografía ════ */
.plate + .plate{border-top:0}
.plate__w li{padding:0}
.plate__w button{display:flex;justify-content:space-between;align-items:baseline;width:100%;padding:var(--s2) 0;font-size:20px;letter-spacing:-.01em;color:var(--color-text-2);text-align:left;transition:color var(--m-fast) var(--e-out)}
.plate__w button:hover,.plate__w button[aria-pressed="true"]{color:var(--color-text)}
.plate__w button span{font-size:12px;font-weight:500;font-style:normal;color:var(--color-text-3);font-variant-numeric:tabular-nums}
.plate__w button[aria-pressed="true"]{box-shadow:inset 2px 0 0 var(--k-cielo);padding-left:var(--s3)}
.plate__rare{padding:var(--s4) 0 var(--s1)!important}
.plate__rare .paren{color:var(--color-text-3)}
.plate__glyph,.plate__abc{transition:font-weight var(--m-base) var(--e-out)}
.tester{margin-top:var(--s10);border-top:1px solid var(--color-border-strong);border-bottom:1px solid var(--color-border)}
.tester__bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s4);padding:var(--s4) 0;border-bottom:1px solid var(--color-border)}
.tester__in{flex:1 1 260px;min-width:0;padding:6px 0;border:0;background:transparent;font:inherit;font-size:15px;color:var(--color-text);outline:none}
.tester__in:focus-visible{box-shadow:0 1px 0 var(--k-cielo)}
.tester__lv{display:flex;flex-wrap:wrap;gap:2px}
.tester__lv button{padding:4px 12px;border-radius:var(--r-pill);font-size:12px;font-weight:500;color:var(--color-text-3)}
.tester__lv button:hover{color:var(--color-text)}
.tester__lv button[aria-pressed="true"]{background:var(--k-noche);color:var(--k-blanco)}
.tester__out{display:flex;align-items:center;height:150px;overflow:hidden;color:var(--color-text);white-space:nowrap;text-overflow:ellipsis}
.tester__out.tsx--body,.tester__out.tsx--lead{white-space:normal}
.tsx--display{font-family:var(--font-display);font-weight:500;font-size:clamp(44px,5.4vw,80px);line-height:1;letter-spacing:-.04em}
.tsx--title{font-size:clamp(30px,3.2vw,44px);font-weight:500;letter-spacing:-.03em;color:var(--color-text-title-muted)}
.tsx--lead{font-size:20px;line-height:1.55;color:var(--color-text-2)}
.tsx--body{font-size:17px;line-height:1.65;color:var(--color-text-2)}
.tester__out.kicker{display:flex;height:150px}
.tester__meta{padding:var(--s3) 0;font-size:12px;color:var(--color-text-3);border-top:1px solid var(--color-border)}

/* 5.1 · combinaciones en lista */
.combos{list-style:none;display:grid;row-gap:var(--s2);margin-top:var(--s5)}
.combos li{display:flex;align-items:center;gap:var(--s3);font-size:16px;font-weight:600;color:var(--color-text)}
.combos li > span:last-child{font-weight:400;color:var(--color-text-2)}

/* 6.6 · fichas más anchas, con desplazamiento lateral */
.scale__row{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(118px,1fr);overflow-x:auto;padding-bottom:var(--s3);scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:var(--color-border-strong) transparent}
.tone{scroll-snap-align:start}
.tone__l{font-size:12px;padding:var(--s3)}
.tone.is-light .tone__c{box-shadow:inset 0 0 0 1px var(--color-border-strong)}

/* 6.15 · siete fondos de estado; íconos de badge en Azul Noche */
.states--7{grid-template-columns:repeat(7,minmax(0,1fr))}
.badge svg{color:var(--k-noche)}
@media(max-width:1100px){.states--7{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* Encabezado de Modos: Salmón con arcos claros */
.portal--salmon{background:url("../assets/img/degradado-salmon.jpg") center/cover,var(--k-salmon);color:var(--k-noche)}
.portal--salmon .kicker,.portal--salmon .portal__txt p{color:var(--k-noche)}
.portal.portal--salmon .portal__arcs{backdrop-filter:none;-webkit-backdrop-filter:none;background-color:transparent;
  background-image:repeating-radial-gradient(circle at -8% 140%,rgba(247,236,235,.32) 0px,rgba(247,236,235,.32) 1px,rgba(86,46,51,.05) 1px,rgba(86,46,51,0) 30px,rgba(86,46,51,0) 31px,rgba(231,193,191,.14) 59px,rgba(231,193,191,.14) 60px)}

/* ════ 11 · Datos ════ */
.chart{display:block;width:100%;height:auto;overflow:visible}
.chart text{font-family:var(--font-sans);font-variant-numeric:tabular-nums}
.chart .tag{font-size:11px;font-weight:500;fill:#6B6D7E}
.chart .t{font-size:14px;font-weight:500;fill:var(--k-noche)}
.chart .v{font-size:11px;font-weight:500;fill:var(--k-noche)}
.chart .src{font-size:10px;fill:#6B6D7E}
.chart .big{font-family:var(--font-display);font-size:64px;font-weight:500;letter-spacing:-2px;fill:var(--k-noche)}
.chart .ax{stroke:var(--k-noche);stroke-opacity:.3;stroke-width:1}
.chart .pin circle{fill:var(--k-noche)}
.chart .pin text{font-size:10px;font-weight:600;fill:var(--k-blanco)}
.kinds{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:var(--s5);row-gap:var(--s2);font-size:14px}
.kinds dt{color:var(--color-text-3)}
.kinds dd{font-weight:500;color:var(--k-noche)}
.pstrips{display:grid;row-gap:var(--s3)}
.pstrips p{display:grid;grid-template-columns:96px minmax(0,1fr);align-items:center;font-size:13px;color:var(--color-text-3)}
.pstrip{display:flex;gap:3px}
.pstrip i{flex:1;height:18px;border-radius:var(--r-micro)}
.dswatch{display:flex;flex-wrap:wrap;gap:var(--s5) var(--s6);margin-top:var(--s4)}
.dsw{display:grid;justify-items:start;row-gap:4px;font-size:12px;text-align:left;cursor:copy}
.dsw i{width:52px;height:52px;border-radius:50%}
.dsw b{font-weight:500;color:var(--k-noche)}
.dsw .cv{color:var(--color-text-3);font-variant-numeric:tabular-nums}
.chartbox{margin-top:var(--s10);padding:var(--s8);background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border)}
.annot__fig{grid-column:1 / span 8;margin-top:0}
.annot__notes{grid-column:10 / -1;display:grid;row-gap:var(--s8);align-content:start}
.annot__notes .annot__note{grid-column:auto}
#tipografia .matrix{margin-top:var(--s12)}
.kinds-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s12) var(--s10);margin-top:var(--s12)}
.kind__fig{display:flex;flex-direction:column;justify-content:flex-end;min-height:150px;padding:var(--s5) 0;border-top:1px solid var(--color-border-strong)}
.kind figcaption{display:grid;row-gap:var(--s1);margin-top:var(--s3);font-size:14px;line-height:1.55;color:var(--color-text-2)}
.kind figcaption b{font-size:17px;font-weight:500;color:var(--color-text)}
.bignum{font-family:var(--font-display);font-size:76px;font-weight:500;line-height:.9;letter-spacing:-.04em;color:var(--k-noche)}
.bignum__c{margin-top:var(--s3);font-size:13px;line-height:1.5;color:var(--color-text-2)}
.bignum__c span{font-size:11px;color:var(--color-text-3)}
@media(max-width:900px){.annot__fig,.annot__notes{grid-column:1 / -1}.kinds-grid{grid-template-columns:1fr}}
.scales > .scale{min-width:0}
.scale__row{max-width:100%;min-width:0}

/* 6.6 · carrusel de tonos con flechas, sin barra */
.scale__head{align-items:center}
.scale__nav{display:flex;gap:var(--s2);margin-left:auto}
.scale__nav .btn-icon{width:32px;height:32px}
.scale__nav .btn-icon svg{width:16px;height:16px}
.scale__row{scrollbar-width:none;scroll-behavior:smooth;padding-bottom:0}
.scale__row::-webkit-scrollbar{display:none}
.tone.is-light{box-shadow:inset 0 0 0 1px var(--color-border-strong)}
.tone.is-light .tone__c{box-shadow:inset 0 -1px 0 var(--color-border-strong)}

/* 6.15 · siete fondos en dos filas: cuatro y tres */
.states--7{grid-template-columns:repeat(4,minmax(0,1fr))}
.states--7 > .stfig .state{border-radius:var(--r-component)}
.states--7 > .stfig:nth-child(1) .state,.states--7 > .stfig:nth-child(5) .state{border-radius:0 var(--r-component) var(--r-component) 0}
.states--7 > .stfig:nth-child(4) .state,.states--7 > .stfig:nth-child(7) .state{border-radius:var(--r-component) 0 0 var(--r-component)}

/* ════ 11 · Datos: fichas editoriales ════ */
.chart .ph{font-family:var(--font-display);font-size:22px;font-weight:400;fill:var(--k-noche)}
.chart .bign{font-family:var(--font-display);font-size:30px;font-weight:400;letter-spacing:-.5px;fill:var(--k-noche)}
.chart .lab{font-size:12px;fill:#6B6D7E}
.dcards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2);margin-top:var(--s12)}
.dcard{display:flex;flex-direction:column;padding:var(--s8);background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border);border-radius:var(--r-component)}
.dcards > .dcard:nth-child(odd){border-radius:0 var(--r-component) var(--r-component) 0}
.dcards > .dcard:nth-child(even){border-radius:var(--r-component) 0 0 var(--r-component)}
.dcard__l{font-size:12px;font-weight:500;color:var(--color-text-3)}
.dcard__n{margin-top:var(--s3);font-family:var(--font-display);font-size:clamp(28px,2.6vw,40px);font-weight:400;line-height:1;letter-spacing:-.03em;color:var(--k-noche);font-variant-numeric:tabular-nums}
.dcard__c{margin-top:var(--s3);max-width:340px;font-size:13px;line-height:1.5;color:var(--color-text-2)}
.dcard__chart{margin-top:auto;padding-top:var(--s8)}
.dcard__foot{margin-top:var(--s4);font-size:11px;color:var(--color-text-3)}
.dcard--wide{margin-top:var(--s2);border-radius:var(--r-component) var(--r-component) 0 0}
.dcard--wide .dcard__chart{max-width:520px}
.annot__fig .dcard{border-radius:0}
@media(max-width:900px){.dcards{grid-template-columns:1fr}.dcards > .dcard{border-radius:0!important}}

/* ════ 08 · Forma y espacio ════ */
.chart--demo{max-width:640px}
.rads{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--s5);margin-top:var(--s12)}
.rad__s{display:block;aspect-ratio:1;background:#ACC3E7}
.rad figcaption{display:grid;row-gap:2px;margin-top:var(--s3);font-size:12px;line-height:1.45;color:var(--color-text-2)}
.rad figcaption b{font-family:var(--font-mono);font-size:12px;font-weight:500;color:var(--k-noche)}
.rad figcaption span{color:var(--color-text-3);font-variant-numeric:tabular-nums}
@media(max-width:900px){.rads{grid-template-columns:repeat(3,minmax(0,1fr))}}
.spcs{margin-top:var(--s10);border-bottom:1px solid var(--color-border)}
.spc{display:grid;grid-template-columns:48px 140px 64px minmax(0,1fr);align-items:center;column-gap:var(--s5);padding:var(--s3) 0;border-top:1px solid var(--color-border);font-size:13px}
.spc__k{font-family:var(--font-mono);color:var(--k-noche)}
.spc__b{height:14px;background:var(--k-salmon);border-radius:0 var(--r-micro) var(--r-micro) 0}
.spc__v{color:var(--color-text);font-variant-numeric:tabular-nums}
.spc__u{color:var(--color-text-2)}
@media(max-width:760px){.spc{grid-template-columns:40px 130px 54px}.spc__u{grid-column:1 / -1}}
.matrix code,.ed code{font-family:var(--font-mono);font-size:.92em;color:var(--k-noche)}

/* ════ 09 · Elementos gráficos ════ */
.vinas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s2);margin-top:var(--s12)}
.vinas figure{display:flex;flex-direction:column;padding:var(--s8);background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border);border-radius:var(--r-component)}
.vinas figure:first-child{border-radius:0 var(--r-component) var(--r-component) 0}
.vinas figure:last-child{border-radius:var(--r-component) 0 0 var(--r-component)}
.vinas svg{width:120px;height:120px;margin:var(--s4) auto var(--s6)}
.vinas__board > div{display:grid;grid-template-columns:repeat(4,28px);gap:10px;justify-content:center;margin:var(--s6) auto var(--s8)}
.vinas__board svg{width:28px;height:28px;margin:0}
.vinas figcaption{display:grid;row-gap:2px;font-size:13px;color:var(--color-text-2)}
.vinas figcaption b{font-size:15px;font-weight:500;color:var(--color-text)}
.emph{margin-top:var(--s10);border-bottom:1px solid var(--color-border)}
.emph > div{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s6);row-gap:var(--s2);align-items:baseline;padding:var(--s6) 0;border-top:1px solid var(--color-border)}
.emph .paren{grid-column:1 / span 3;color:var(--color-text-3)}
.emph__s{grid-column:4 / span 9;font-size:20px;line-height:1.45;color:var(--color-text-2)}
.emph__s s{text-decoration-color:var(--k-salmon);text-decoration-thickness:1.5px}
.emph__d{grid-column:4 / span 9;font-size:14px;color:var(--color-text-3)}
.lines{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s8) var(--s10);margin-top:var(--s10)}
.lines > div{display:grid;row-gap:var(--s3)}
.lines p{display:grid;row-gap:2px;font-size:13px;color:var(--color-text-2)}
.lines b{font-size:15px;font-weight:500;color:var(--color-text)}
.ln{position:relative;display:block;height:20px}
.ln::before{content:"";position:absolute;left:0;right:0;top:10px}
.ln--1::before{border-top:1px solid var(--color-border)}
.ln--2::before{border-top:1px solid var(--color-border-strong)}
.ln--3::before{border-top:1px dashed var(--color-border-strong)}
.ln--4::before{border-top:1px solid var(--k-cielo)}
.ln--4 i::before,.ln--4 i::after{content:"";position:absolute;top:5px;width:1px;height:11px;background:var(--k-cielo)}
.ln--4 i::before{left:0}.ln--4 i::after{right:0}
.glass2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2);margin-top:var(--s12)}
.gl{aspect-ratio:4/3;background-size:cover;background-position:center}
.gl--flute{background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.16) 0px,rgba(255,255,255,.16) 1px,rgba(255,255,255,.07) 1px,rgba(255,255,255,.01) 25px,rgba(255,255,255,.01) 26px,rgba(255,255,255,.07) 49px,rgba(255,255,255,.07) 50px),url("../assets/img/degradado-cielo.jpg");border-radius:0 var(--r-component) var(--r-component) 0}
.gl--arcs{background-image:repeating-radial-gradient(circle at -8% 140%,rgba(224,231,241,.42) 0px,rgba(224,231,241,.42) 1px,rgba(36,45,78,.06) 1px,rgba(36,45,78,0) 30px,rgba(36,45,78,0) 31px,rgba(172,195,231,.16) 59px,rgba(172,195,231,.16) 60px),url("../assets/img/degradado-cielo-2.jpg");border-radius:var(--r-component) 0 0 var(--r-component)}
.glass2 figcaption,.pats figcaption{display:grid;row-gap:2px;margin-top:var(--s3);font-size:13px;line-height:1.5;color:var(--color-text-2)}
.glass2 b,.pats b{font-size:15px;font-weight:500;color:var(--color-text)}
.pats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s8) var(--s2);margin-top:var(--s12)}
.pat{aspect-ratio:1;border-radius:var(--r-component)}
.pats figure:nth-child(3n+1) .pat{border-radius:0 var(--r-component) var(--r-component) 0}
.pats figure:nth-child(3n) .pat{border-radius:var(--r-component) 0 0 var(--r-component)}
.pat--brackets{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cg fill='%23F4F4F4' fill-opacity='.42'%3E%3Cg transform='translate%288 12%29 scale%28.05%29'%3E%3Cg transform='translate%28-224 -295%29'%3E%3Cpath d='M224.15,507.07c57.79-55.45,87.02-155.84,91.42-211.97h206.28c.09,3.02.13,6.67.13,9.69,0,115.43-95.9,193.93-186.13,235.21,91.17,42.68,186.13,119.8,186.13,235.24h0c0,3.02-.04,6.67-.13,9.67h-206.28c-4.4-56.11-33.62-156.5-91.39-211.95l-.02-65.88Z'/%3E%3Cpath d='M855.83,572.95c-57.77,55.45-87,155.84-91.39,211.95h-206.28c-.09-3-.13-6.65-.13-9.67h0c0-115.43,94.95-192.56,186.13-235.24-90.23-41.28-186.13-119.78-186.13-235.21,0-3.02.04-6.67.13-9.69h206.28c4.4,56.13,33.62,156.52,91.42,211.97l-.02,65.88Z'/%3E%3C/g%3E%3C/g%3E%3Cg transform='translate%2888 52%29 rotate%2890%29 scale%28.05%29'%3E%3Cg transform='translate%28-224 -295%29'%3E%3Cpath d='M224.15,507.07c57.79-55.45,87.02-155.84,91.42-211.97h206.28c.09,3.02.13,6.67.13,9.69,0,115.43-95.9,193.93-186.13,235.21,91.17,42.68,186.13,119.8,186.13,235.24h0c0,3.02-.04,6.67-.13,9.67h-206.28c-4.4-56.11-33.62-156.5-91.39-211.95l-.02-65.88Z'/%3E%3Cpath d='M855.83,572.95c-57.77,55.45-87,155.84-91.39,211.95h-206.28c-.09-3-.13-6.65-.13-9.67h0c0-115.43,94.95-192.56,186.13-235.24-90.23-41.28-186.13-119.78-186.13-235.21,0-3.02.04-6.67.13-9.69h206.28c4.4,56.13,33.62,156.52,91.42,211.97l-.02,65.88Z'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") 0 0/96px 96px,url("../assets/img/degradado-cielo.jpg") center/cover}
.pat--board{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg transform='translate%286 6%29'%3E%3Cpath fill='%23CE635D' fill-rule='evenodd' d='M1.1 1.1h17.8v17.8H1.1ZM10 5.55a4.45 4.45 0 1 0 0 8.9a4.45 4.45 0 1 0 0-8.9Z'/%3E%3C/g%3E%3Cg transform='translate%2838 6%29'%3E%3Cpath fill='%23729BDD' fill-rule='evenodd' d='M10 0a10 10 0 1 0 0 20a10 10 0 1 0 0-20ZM7.76 6h4.48A1.76 1.76 0 0 1 14 7.76v4.48A1.76 1.76 0 0 1 12.24 14H7.76A1.76 1.76 0 0 1 6 12.24V7.76A1.76 1.76 0 0 1 7.76 6Z'/%3E%3C/g%3E%3Cg transform='translate%286 38%29'%3E%3Cpath fill='%23729BDD' fill-rule='evenodd' d='M10 0a10 10 0 1 0 0 20a10 10 0 1 0 0-20ZM7.76 6h4.48A1.76 1.76 0 0 1 14 7.76v4.48A1.76 1.76 0 0 1 12.24 14H7.76A1.76 1.76 0 0 1 6 12.24V7.76A1.76 1.76 0 0 1 7.76 6Z'/%3E%3C/g%3E%3Cg transform='translate%2838 38%29'%3E%3Cpath fill='%23CE635D' fill-rule='evenodd' d='M1.1 1.1h17.8v17.8H1.1ZM10 5.55a4.45 4.45 0 1 0 0 8.9a4.45 4.45 0 1 0 0-8.9Z'/%3E%3C/g%3E%3C/svg%3E") 0 0/64px 64px,var(--k-blanco);box-shadow:inset 0 0 0 1px var(--color-border)}
.pat--flute{background:repeating-linear-gradient(90deg,rgba(255,255,255,.16) 0px,rgba(255,255,255,.16) 1px,rgba(255,255,255,.07) 1px,rgba(255,255,255,.01) 25px,rgba(255,255,255,.01) 26px,rgba(255,255,255,.07) 49px,rgba(255,255,255,.07) 50px),url("../assets/img/cielo-mediodia.webp") center/cover}
.pat--arcs{background:repeating-radial-gradient(circle at 20% 80%,rgba(255,255,255,.3) 0 1px,rgba(255,255,255,0) 1px 26px),url("../assets/img/degradado-noche-2.webp") center/cover}
.pat--grain{position:relative;overflow:hidden;background:url("../assets/img/cielo-atardecer.webp") center/cover}
.pat--grain::after{content:"";position:absolute;inset:0;background-image:var(--grain);background-size:120px;opacity:.75;mix-blend-mode:overlay}
@media(max-width:900px){.vinas,.glass2{grid-template-columns:1fr}.pats{grid-template-columns:repeat(2,minmax(0,1fr))}.emph .paren,.emph__s,.emph__d{grid-column:1 / -1}}

/* ════ 10 · Iconografía ════ */
.bp{overflow:visible}
.bp__f{fill:var(--k-puro);stroke:var(--k-cielo);stroke-width:.06}
.bp__g line{stroke:var(--k-cielo);stroke-opacity:.28;stroke-width:.03}
.bp__live{fill:var(--k-cielo-100);fill-opacity:.45;stroke:var(--k-cielo);stroke-width:.05}
.bp__k{fill:none;stroke:var(--k-salmon);stroke-opacity:.55;stroke-width:.05}
.bp__k2{stroke-dasharray:.3 .3}
.bpwrap{margin-top:var(--s10)}
.bpwrap__fig{position:relative;width:min(420px,100%);aspect-ratio:1}
.bpwrap__fig .bp,.bpwrap__icon,.bpwrap__icon .ic{position:absolute;inset:0;width:100%;height:100%}
.bpwrap__icon{color:var(--k-noche);opacity:.92}
.icat{margin-top:var(--s10);--ic-c:#10122A;--ic-ko:#F4F4F4}
.icat__view{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s2)}
.icat__stage{position:relative;aspect-ratio:1;background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border);border-radius:0 var(--r-component) var(--r-component) 0;transition:background-color .5s var(--e-out)}
.icat__stage .bp,.icat__big{position:absolute;inset:10%;width:80%;height:80%}
.icat__big{color:var(--ic-c)}
.icat__big .ic{width:100%;height:100%}
.icat.is-dark .icat__stage{background:var(--k-noche)}
.icat.is-dark .bp__f{fill:var(--k-noche)}
.icat__info{display:flex;flex-direction:column;gap:var(--s4);padding:var(--s8);background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border);border-radius:var(--r-component) 0 0 var(--r-component)}
.icat__info .paren{color:var(--color-text-3)}
.icat__name{font-size:26px;font-weight:500;letter-spacing:-.02em;color:var(--color-text)}
.icat__file{margin-top:-8px;font-family:var(--font-mono);font-size:13px;color:var(--color-text-3)}
.icat__colors{display:grid;gap:var(--s2);margin-top:var(--s4)}
.icat__colors button{display:flex;align-items:center;gap:var(--s3);padding:6px 0;font-size:14px;color:var(--color-text-2)}
.icat__colors button i{width:16px;height:16px;border-radius:50%;box-shadow:0 0 0 1px var(--color-border-strong)}
.icat__colors button[aria-pressed="true"]{font-weight:600;color:var(--color-text)}
.icat__colors button[aria-pressed="true"] i{box-shadow:0 0 0 2px var(--k-blanco),0 0 0 3px var(--k-noche)}
.icat__dl{margin-top:auto}
.icat__rev{font-size:12px;color:var(--k-salmon)}
.icat__bar{display:flex;align-items:center;gap:var(--s5);margin-top:var(--s10);padding:var(--s3) 0;border-top:1px solid var(--color-border-strong);border-bottom:1px solid var(--color-border)}
.icat__q{flex:1;min-width:0;padding:6px 0;border:0;background:transparent;font:inherit;font-size:15px;color:var(--color-text);outline:none}
.icat__count{font-size:12px;color:var(--color-text-3);font-variant-numeric:tabular-nums}
.icat__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:var(--s1);margin-top:var(--s5);padding:var(--s2);border-radius:var(--r-component);transition:background-color .5s var(--e-out)}
.icat.is-dark .icat__grid{background:var(--k-noche)}
.ict{position:relative;display:grid;justify-items:center;row-gap:8px;padding:var(--s5) var(--s1) var(--s3);border-radius:var(--r-control);color:var(--ic-c);transition:background-color var(--m-fast) var(--e-out)}
.ict .ic{width:32px;height:32px}
.ict span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;color:var(--color-text-3)}
.ict:hover,.ict.is-sel{background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border)}
.icat.is-dark .ict:hover,.icat.is-dark .ict.is-sel{background:rgba(244,244,244,.08);box-shadow:none}
.icat.is-dark .ict span{color:rgba(244,244,244,.55)}
.ict.is-rev::after{content:"";position:absolute;top:8px;right:8px;width:6px;height:6px;border-radius:50%;background:var(--k-salmon)}
.ict[hidden]{display:none}
.icat .ko-s{stroke:var(--ic-ko)}
.icat .ko-f{fill:var(--ic-ko)}
.ict:hover .ic [pathLength],.icat__big.is-anim .ic [pathLength]{stroke-dasharray:1;animation:icDraw .45s cubic-bezier(.34,1.4,.64,1) both}
.ict:hover .ic path:not([pathLength]),.icat__big.is-anim .ic path:not([pathLength]){transform-box:fill-box;transform-origin:center;animation:icPop .45s cubic-bezier(.34,1.4,.64,1) both}
@keyframes icDraw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes icPop{from{opacity:.2;transform:scale(.86)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.ict:hover .ic *,.icat__big .ic *{animation:none!important}}
.audit{margin-top:var(--s10)}
.audit img{display:block;width:100%;height:auto;background:#fff;box-shadow:inset 0 0 0 1px var(--color-border)}
@media(max-width:900px){.icat__view{grid-template-columns:1fr}.icat__stage,.icat__info{border-radius:0}}
.dcards .dcard__n{font-family:var(--font-sans);font-size:22px;font-weight:500;letter-spacing:-.02em}
.dcard--wide .dcard__chart{max-width:600px}

/* ════ Ronda 16 ════ */
/* 6.6 · tonos que se confunden con el fondo: todo el contorno en el gris de los demás */
.tone.is-light{box-shadow:inset 0 0 0 1px var(--color-border)}
.tone.is-light .tone__c{border-radius:inherit;border-bottom-left-radius:0;border-bottom-right-radius:0;box-shadow:inset 0 0 0 1px var(--color-border)}
/* 6.15 · el texto vive sobre el color */
.states--7 .state--in{aspect-ratio:auto;min-height:148px;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:2px;padding:var(--s5);text-align:left;color:var(--k-noche)}
.state--in b{font-size:15px;font-weight:600}
.state--in span{font-size:12px;line-height:1.4;color:rgba(16,18,42,.72)}
.state--in .cv{margin-top:var(--s2);font-variant-numeric:tabular-nums;color:var(--k-noche)}

/* Ventana: cielo esmerilado afuera, nítido adentro (9.5 y 6.7) */
.win{position:relative;overflow:hidden;isolation:isolate;background:var(--win-img) center/cover,var(--k-cielo)}
.win::before{content:"";position:absolute;inset:-32px;z-index:0;background:var(--win-img) center/cover;filter:blur(16px) saturate(.95)}
.win::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(rgba(255,255,255,.18),rgba(255,255,255,.18)),var(--grain);background-size:auto,140px;mix-blend-mode:soft-light;pointer-events:none}
.win__in{position:absolute;inset:0;z-index:2;background:var(--win-img) center/cover;clip-path:inset(var(--wy,12.5%) var(--wx,17%))}
.win__edge{position:absolute;z-index:3;inset:var(--wy,12.5%) var(--wx,17%);box-shadow:inset 0 3px 10px rgba(16,18,42,.26),inset 0 -1px 0 rgba(255,255,255,.5),0 1px 0 rgba(255,255,255,.35);pointer-events:none}
.skyrow__img.win{background-image:var(--win-img)}
.wins{display:grid;grid-template-columns:5fr 7fr;gap:var(--s2);align-items:end;margin-top:var(--s12)}
.win--v{aspect-ratio:3/4;border-radius:0 var(--r-component) var(--r-component) 0}
.win--h{aspect-ratio:4/3;--wx:12.5%;--wy:16.7%;border-radius:var(--r-component) 0 0 var(--r-component)}
@media(max-width:760px){.wins{grid-template-columns:1fr}.win--v,.win--h{border-radius:0}}

/* Encabezados de capítulo: arcos sobre color liso */
body .portal:not(.portal--img):not(.portal--cielo):not(.portal--salmon){background:var(--k-noche)}
body .portal.portal--cielo:not(.portal--img){background:var(--k-cielo)}
body .portal.portal--salmon{background:var(--k-salmon)}

/* 8.1 · un recuadro por ejemplo */
.cbx{display:grid;row-gap:var(--s1);margin-top:var(--s12)}
.cbx__i{position:relative;display:grid;place-items:center;min-height:220px;padding:var(--s12) var(--s8);background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border)}
.cbx__i:first-child{border-radius:0 0 var(--r-component) var(--r-component)}
.cbx__i:nth-child(2){border-radius:var(--r-component)}
.cbx__i:last-child{border-radius:var(--r-component) var(--r-component) 0 0}
.cbx__i figcaption{position:absolute;left:var(--s6);top:var(--s5);display:grid;row-gap:2px;max-width:220px;font-size:13px;line-height:1.5;color:var(--color-text-3)}
.cbx__i figcaption .paren{color:var(--color-text)}
.cbx__svg{display:block;height:auto;overflow:visible}
.cbx__i:nth-child(1) .cbx__svg{width:270px}.cbx__i:nth-child(2) .cbx__svg{width:180px}.cbx__i:nth-child(3) .cbx__svg{width:160px}
@media(max-width:760px){.cbx__i{padding-top:var(--s20)}.cbx__i figcaption{right:var(--s6);max-width:none}}

/* 8.2 · radios con su uso real */
.rrows{margin-top:var(--s12);border-bottom:1px solid var(--color-border)}
.rrow{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s6);align-items:center;padding:var(--s8) 0;border-top:1px solid var(--color-border)}
.rrow__k{grid-column:1 / span 2;display:grid;row-gap:2px}
.rrow__k b{font-family:var(--font-mono);font-size:13px;font-weight:500;color:var(--k-noche)}
.rrow__k span{font-size:13px;color:var(--color-text-3)}
.rrow__u{grid-column:3 / span 4;display:grid;grid-template-columns:auto 1fr;column-gap:var(--s3);row-gap:var(--s1);font-size:13px;line-height:1.5;color:var(--color-text-2)}
.rrow__u .paren{color:var(--color-text-3)}
.rdemo{grid-column:7 / -1;display:flex;gap:var(--s1);align-items:center;min-width:0}
.rdemo__b{flex:0 1 auto;display:grid;place-items:center;min-width:0;background:#ACC3E7;font-size:13px;font-weight:500;color:var(--k-noche)}
.rdemo__b--o{background:transparent;box-shadow:inset 0 0 0 1px var(--k-noche);margin-left:var(--s2)}
@media(max-width:900px){.rrow__k,.rrow__u,.rdemo{grid-column:1 / -1}.rrow__u{margin-top:var(--s3)}.rdemo{margin-top:var(--s5)}}

/* 8.4 · tres niveles de retícula */
.lvls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s2);margin-top:var(--s10)}
.lvl{display:flex;flex-direction:column;gap:var(--s2);padding:var(--s8);background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border);border-radius:var(--r-component)}
.lvl:first-child{border-radius:0 var(--r-component) var(--r-component) 0}
.lvl:last-child{border-radius:var(--r-component) 0 0 var(--r-component)}
.lvl__n{font-size:13px;color:var(--color-text-3);font-variant-numeric:tabular-nums}
.lvl__t{font-size:20px;font-weight:500;letter-spacing:-.01em;color:var(--color-text)}
.lvl__a{font-size:14px;line-height:1.55;color:var(--color-text-2)}
.lvl__r{margin-top:auto;padding-top:var(--s5);border-top:1px solid var(--color-border);font-size:14px;line-height:1.5;color:var(--color-text)}

/* 8.5 · densidad con un recuadro por ejemplo */
.dmodes{margin-top:var(--s12);border-bottom:1px solid var(--color-border)}
.dmode{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s6);padding:var(--s10) 0;border-top:1px solid var(--color-border)}
.dmode__txt{grid-column:1 / span 5;display:grid;align-content:start;row-gap:var(--s2);font-size:14px;line-height:1.55;color:var(--color-text-2)}
.dmode__txt .paren{margin-top:var(--s3);color:var(--color-text-3)}
.dmode__t{font-size:20px;font-weight:500;letter-spacing:-.01em;color:var(--color-text)}
.dmode__d{font-size:15px;color:var(--color-text)}
.dmode .phbox{grid-column:7 / -1;align-self:start}
.phbox{display:grid;place-content:center;justify-items:center;row-gap:var(--s2);aspect-ratio:16/10;padding:var(--s6);border:1px dashed var(--color-border-strong);background:repeating-linear-gradient(135deg,transparent 0 10px,rgba(16,18,42,.03) 10px 11px);text-align:center;font-size:14px;line-height:1.45;color:var(--color-text-2)}
.phbox .paren{color:var(--color-text-3)}
.dui{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s6);margin-top:var(--s8)}
.dui .phbox{aspect-ratio:4/3}
.dui__t{margin-top:var(--s5);font-size:16px;font-weight:500;color:var(--color-text)}
.dui ul{list-style:none;display:grid;row-gap:6px;margin-top:var(--s3);font-size:14px;line-height:1.45;color:var(--color-text-2)}
.dui li{position:relative;padding-left:18px}
.dui li::before{content:"";position:absolute;left:0;top:.42em;width:10px;height:10px;background:var(--k-cielo);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' d='M10 0a10 10 0 1 0 0 20a10 10 0 1 0 0-20ZM7.76 6h4.48A1.76 1.76 0 0 1 14 7.76v4.48A1.76 1.76 0 0 1 12.24 14H7.76A1.76 1.76 0 0 1 6 12.24V7.76A1.76 1.76 0 0 1 7.76 6Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' d='M10 0a10 10 0 1 0 0 20a10 10 0 1 0 0-20ZM7.76 6h4.48A1.76 1.76 0 0 1 14 7.76v4.48A1.76 1.76 0 0 1 12.24 14H7.76A1.76 1.76 0 0 1 6 12.24V7.76A1.76 1.76 0 0 1 7.76 6Z'/%3E%3C/svg%3E") center/contain no-repeat}
@media(max-width:900px){.dmode__txt,.dmode .phbox{grid-column:1 / -1}.dmode .phbox{margin-top:var(--s6)}.dui,.lvls{grid-template-columns:1fr}.lvl{border-radius:0!important}}

/* 9.1 · tres colores de viñeta y sus ejemplos */
.vinas figure.is-dark{background:var(--k-noche);box-shadow:none}
.vinas figure.is-dark figcaption{color:rgba(244,244,244,.7)}
.vinas figure.is-dark figcaption b{color:var(--k-blanco)}
.vex{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2);margin-top:var(--s8)}
.vex__i{display:flex;flex-direction:column;gap:var(--s6);padding:var(--s8);background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border);border-radius:0 var(--r-component) var(--r-component) 0}
.vex__i + .vex__i{border-radius:var(--r-component) 0 0 var(--r-component)}
.vex__i .paren{color:var(--color-text-3)}
.vex__i--dark{background:var(--k-noche);box-shadow:none}
.vex__i--dark .paren{color:rgba(244,244,244,.6)}
.vli{list-style:none;display:grid;row-gap:var(--s3);font-size:15px;line-height:1.4;color:var(--color-text)}
.vli li{display:flex;align-items:center;gap:var(--s3)}
.vli svg{flex:none;width:18px;height:18px}
.vex__i--dark .vli{color:var(--k-blanco)}
.vex__i--dark .vli b{font-weight:500}
@media(max-width:760px){.vex{grid-template-columns:1fr}.vex__i{border-radius:0!important}}
/* 9.2 · itálica */
.emph__s em{font-style:italic}
/* 9.3 · flecha orgánica */
.ln--arrow{height:64px}
.ln--arrow svg{width:120px;height:64px;fill:none;stroke:var(--k-noche);overflow:visible}
.ln--arrow path{stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
/* 9.4 · arcos sobre color liso */
.gl--arcs{background-image:repeating-radial-gradient(circle at -8% 140%,rgba(224,231,241,.42) 0px,rgba(224,231,241,.42) 1px,rgba(36,45,78,.06) 1px,rgba(36,45,78,0) 30px,rgba(36,45,78,0) 31px,rgba(172,195,231,.16) 59px,rgba(172,195,231,.16) 60px);background-color:var(--k-cielo)}
/* 9.6 · acanalado sobre degradado liso */
.pat--flute{position:relative;overflow:hidden;background:repeating-linear-gradient(90deg,rgba(255,255,255,.18) 0px,rgba(255,255,255,.18) 1px,rgba(255,255,255,.08) 1px,rgba(255,255,255,.01) 25px,rgba(255,255,255,.01) 26px,rgba(255,255,255,.08) 49px,rgba(255,255,255,.08) 50px),
  linear-gradient(180deg,#3D6BAF 0%,#5A85CC 22%,#729BDD 46%,#8FB4DC 70%,#C4DBF0 100%)}
.pat--flute::after{content:"";position:absolute;inset:0;background-image:var(--grain);background-size:120px;opacity:.35;mix-blend-mode:overlay}
.pat--tbd{display:grid;place-items:center;border:1px dashed var(--color-border-strong);font-size:13px;color:var(--color-text-3)}

/* 10.5 · catálogo: lista a la izquierda, ficha fija a la derecha */
.icat{display:grid;grid-template-columns:minmax(0,1fr) 300px;column-gap:var(--s6);align-items:start}
.icat__list{grid-column:1;grid-row:1;min-width:0}
.icat__view{grid-column:2;grid-row:1;position:sticky;top:96px;grid-template-columns:1fr;gap:var(--s1)}
.icat__stage{border-radius:0 0 var(--r-component) var(--r-component)}
.icat__info{gap:var(--s3);padding:var(--s6);border-radius:var(--r-component) var(--r-component) 0 0}
.icat__name{font-size:20px;overflow-wrap:anywhere}
.icat__file{margin-top:-4px;font-size:12px;overflow-wrap:anywhere}
.icat__colors{grid-template-columns:repeat(3,auto);justify-content:start;column-gap:var(--s4);margin-top:var(--s2)}
.icat__colors button{font-size:13px}
.icat__dl{margin-top:var(--s2)}
.icat__bar{margin-top:0}
.icat__chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:var(--s4)}
.icat__chips button{padding:5px 12px;border-radius:var(--r-pill);font-size:12px;color:var(--color-text-2);box-shadow:inset 0 0 0 1px var(--color-border-strong);transition:background-color var(--m-fast) var(--e-out),color var(--m-fast) var(--e-out)}
.icat__chips button[aria-pressed="true"]{background:var(--k-noche);color:var(--k-blanco);box-shadow:none}
.icat__h{grid-column:1 / -1;display:flex;justify-content:space-between;margin-top:var(--s5);padding:var(--s3) var(--s1) 0;border-top:1px solid var(--color-border);font-size:12px;font-weight:500;color:var(--color-text-2)}
.icat__h:first-child{margin-top:0;border-top:0;padding-top:0}
.icat__h span{color:var(--color-text-3);font-variant-numeric:tabular-nums}
.icat__h[hidden]{display:none}
.icat.is-dark .icat__h{color:rgba(244,244,244,.85);border-color:rgba(244,244,244,.14)}
.icat.is-dark .icat__h span{color:rgba(244,244,244,.5)}
/* La animación ya no toca la transformación propia de cada trazo: solo aparece */
.ict:hover .ic path:not([pathLength]),.icat__big.is-anim .ic path:not([pathLength]){transform-box:view-box;transform-origin:0 0;animation:icFade .4s ease both}
@keyframes icFade{from{opacity:0}to{opacity:1}}
@media(max-width:1100px){.icat{grid-template-columns:1fr}.icat__view{grid-column:1;grid-row:1;position:relative;top:auto;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.icat__list{grid-row:2;margin-top:var(--s8)}
  .icat__stage{border-radius:0 var(--r-component) var(--r-component) 0}.icat__info{border-radius:var(--r-component) 0 0 var(--r-component)}}
@media(max-width:600px){.icat__view{grid-template-columns:1fr}.icat__stage,.icat__info{border-radius:0}}

/* 11 · Datos: tooltip, interacción y movimiento sutil */
.ctip{position:fixed;z-index:300;left:0;top:0;display:grid;row-gap:2px;padding:8px 12px;background:var(--k-noche);color:var(--k-blanco);font-size:12px;line-height:1.35;white-space:nowrap;border-radius:var(--r-control);pointer-events:none;opacity:0;transform:translate(-50%,calc(-100% - 14px));transition:opacity .15s ease}
.ctip b{font-weight:600}
.ctip span{color:rgba(244,244,244,.72)}
.ctip.is-on{opacity:1}
.chart--int .dt{outline:none;transition:opacity .25s var(--e-out)}
.chart--int:has(.dt:hover) .dt:not(:hover),.chart--int:has(.dt:focus-visible) .dt:not(:focus-visible){opacity:.32}
.chart .oarrow{fill:none;stroke:var(--k-noche);stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.chart .a-pop,.chart .a-grow{transform-box:fill-box;transform-origin:50% 100%}
.anim [data-draw] .a-pop{transition:opacity .6s var(--e-out),transform .7s cubic-bezier(.34,1.4,.64,1);transition-delay:calc(var(--i,0) * 45ms)}
.anim [data-draw]:not(.is-drawn) .a-pop{opacity:0;transform:translateY(8px) scale(.6)}
.anim [data-draw] .a-grow{transition:transform .5s var(--e-out);transition-delay:calc(var(--i,0) * 22ms)}
.anim [data-draw]:not(.is-drawn) .a-grow{transform:scaleY(0)}
.anim [data-draw] .a-draw{stroke-dasharray:1;transition:stroke-dashoffset 1.1s var(--e-out),fill-opacity .8s ease .5s;transition-delay:calc(var(--i,0) * 120ms)}
.anim [data-draw]:not(.is-drawn) .a-draw{stroke-dashoffset:1;fill-opacity:0}
.dcards > .dcard.dcard--wide{grid-column:1 / -1;margin-top:0;border-radius:0}
.dcard--wide .dcard__chart{width:100%;max-width:640px;margin-left:auto;margin-right:auto}
.dsw span{color:var(--color-text-3);font-variant-numeric:tabular-nums}
.dsw i{box-shadow:inset 0 0 0 1px rgba(16,18,42,.06)}
.emph--type .emph__s{line-height:1.2}
/* 11.5 · anatomía con notas al costado */
.annot--anat .annot__fig{grid-column:1 / span 7}
.anat{position:relative;border-radius:0!important}
.anat > *,.anat__foot p{position:relative}
.anat__t{margin-bottom:var(--s4);font-size:18px;font-weight:500;line-height:1.35;letter-spacing:-.01em;color:var(--k-noche)}
.anat .dcard__l{display:block}
.anat__n{font-size:56px}
.anat__chart{padding-top:var(--s6)}
.anat__foot{display:grid;row-gap:2px;margin-top:var(--s5);font-size:11px;color:var(--color-text-3)}
.anat__iso{position:absolute;right:0;bottom:0;width:26px;height:auto;fill:var(--k-noche)}
.apin{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--k-noche);color:var(--k-blanco);font-family:var(--font-sans);font-size:10px;font-weight:600;line-height:1;letter-spacing:0;font-variant-numeric:tabular-nums}
.anat .apin{position:absolute;left:calc(-1 * var(--s8) - 9px);top:.2em}
.anat__n .apin{top:.9em}
.anat__chart > .apin{left:auto;right:calc(-1 * var(--s8) - 9px);top:calc(var(--s6) + 38%)}
.anat__foot > .apin{left:auto;top:auto;right:calc(-1 * var(--s8) - 9px);bottom:4px}
.anotes{grid-column:9 / -1;list-style:none;display:grid;row-gap:var(--s4);align-content:start}
.anotes li{display:grid;grid-template-columns:auto 1fr;column-gap:var(--s3);padding-top:var(--s3);border-top:1px solid var(--color-border)}
.anotes li:first-child{border-top-color:var(--color-text)}
.anotes .apin{margin-top:1px}
.anotes p{font-size:13px;line-height:1.5;color:var(--color-text-2)}
.anotes b{display:block;font-size:14px;font-weight:500;color:var(--color-text)}
@media(max-width:900px){.annot--anat .annot__fig,.anotes{grid-column:1 / -1}.anat .apin{left:-12px}.anat__chart > .apin,.anat__foot > .apin{right:-12px}}
.dcards .dcard__chart{margin-top:auto;margin-bottom:auto}
.dcard--wide .dcard__chart{max-width:680px;padding-top:var(--s10)}
.anat .dcard__chart{margin-top:0;margin-bottom:0}
.anat__n{margin-top:var(--s2)}
.rrow__u{grid-column:3 / span 3}.rdemo{grid-column:6 / -1;justify-content:flex-end}
.rrow__u{grid-template-columns:1fr;row-gap:0}.rrow__u p + .paren{margin-top:var(--s2)}
.vex__i--dark .vli b{color:var(--k-blanco)}

/* ════ Ronda 17 ════ */
/* 8.1 · recuadros más altos, figuras sin aplastar */
.cbx__i{min-height:270px}
.cbx__i:nth-child(1) .cbx__svg{width:236px}.cbx__i:nth-child(2) .cbx__svg{width:150px}.cbx__i:nth-child(3) .cbx__svg{width:132px}
/* 8.2 y 8.3 · el mismo gris; un elemento solo va recto */
.rdemo__b{background:#C7C8CB}
.spc__b{background:#C7C8CB;border-radius:0}
/* 8.4 · tres niveles con su retícula */
.lvx{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s10) var(--s2);margin-top:var(--s12)}
.lvx__fig{padding:var(--s6);background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border);border-radius:var(--r-component)}
.lvx__i:first-child .lvx__fig{border-radius:0 var(--r-component) var(--r-component) 0}
.lvx__i:last-child .lvx__fig{border-radius:var(--r-component) 0 0 var(--r-component)}
.lvsvg{display:block;width:100%;height:auto;overflow:hidden}
.lvx figcaption{display:grid;row-gap:var(--s2);margin-top:var(--s5);padding-right:var(--s4)}
.lvx__n{font-size:13px;color:var(--color-text-3);font-variant-numeric:tabular-nums}
.lvx__t{font-size:20px;font-weight:500;letter-spacing:-.01em;color:var(--color-text)}
.lvx__r{font-size:15px;line-height:1.5;color:var(--color-text)}
.lvx__a{display:grid;row-gap:2px;margin-top:var(--s2);font-size:13px;line-height:1.5;color:var(--color-text-2)}
.lvx__a .paren{color:var(--color-text-3)}
@media(max-width:900px){.lvx{grid-template-columns:1fr}.lvx__fig{border-radius:0!important}}
/* 8.5 · viñetas intercaladas */
.dui li:nth-child(even)::before{background:var(--k-salmon);-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' d='M1.1 1.1h17.8v17.8H1.1ZM10 5.55a4.45 4.45 0 1 0 0 8.9a4.45 4.45 0 1 0 0-8.9Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' d='M1.1 1.1h17.8v17.8H1.1ZM10 5.55a4.45 4.45 0 1 0 0 8.9a4.45 4.45 0 1 0 0-8.9Z'/%3E%3C/svg%3E")}
/* 8.6 · camino vertical para un patrón nuevo */
.flow{list-style:none;position:relative;display:grid;row-gap:var(--s8);max-width:620px;margin-top:var(--s8)}
.flow::before{content:"";position:absolute;left:17px;top:18px;bottom:18px;border-left:1px dashed var(--color-border-strong)}
.flow li{position:relative;display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:var(--s5);align-items:start}
.flow__n{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--k-blanco);box-shadow:inset 0 0 0 1px var(--color-border-strong);font-size:12px;color:var(--color-text-2);font-variant-numeric:tabular-nums}
.flow li:last-child .flow__n{background:var(--k-noche);color:var(--k-blanco);box-shadow:none}
.flow__q{padding-top:7px;font-size:17px;font-weight:500;color:var(--color-text)}
.flow__a{margin-top:var(--s1);font-size:14px;line-height:1.55;color:var(--color-text-2)}
/* 9.1 · reglas de viñetas por modo y fondo */
.vmx{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2);margin-top:var(--s8)}
.vmx__i{display:flex;flex-direction:column;gap:var(--s3);padding:var(--s8);background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border)}
.vmx__i:nth-child(odd){border-radius:0 var(--r-component) var(--r-component) 0}
.vmx__i:nth-child(even){border-radius:var(--r-component) 0 0 var(--r-component)}
.vmx__i .paren{color:var(--color-text)}
.vmx__r{font-size:14px;line-height:1.5;color:var(--color-text-2)}
.vmx__i .vli{margin-top:var(--s3)}
.vmx__i.is-dark{background:var(--k-noche);box-shadow:none}
.vmx__i.is-dark .paren,.vmx__i.is-dark .vli{color:var(--k-blanco)}
.vmx__i.is-dark .vmx__r{color:rgba(244,244,244,.68)}
@media(max-width:760px){.vmx{grid-template-columns:1fr}.vmx__i{border-radius:0!important}}
/* 9.4 · los dos cristales, con el mismo acabado, sobre un degradado sutil */
.gl--flute,.gl--arcs{background-color:var(--k-cielo);background-size:auto,auto,auto;background-position:0 0}
.gl--flute{background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.16) 0px,rgba(255,255,255,.16) 1px,rgba(255,255,255,.07) 1px,rgba(255,255,255,.01) 25px,rgba(255,255,255,.01) 26px,rgba(255,255,255,.07) 49px,rgba(255,255,255,.07) 50px),
  radial-gradient(120% 80% at 50% 108%,rgba(224,231,241,.75) 0%,rgba(224,231,241,0) 60%),linear-gradient(180deg,#4F78C2 0%,#729BDD 55%,#9DBBE4 100%)}
.gl--arcs{background-image:repeating-radial-gradient(circle at -8% 140%,rgba(255,255,255,.16) 0px,rgba(255,255,255,.16) 1px,rgba(255,255,255,.07) 1px,rgba(255,255,255,.01) 30px,rgba(255,255,255,.01) 31px,rgba(255,255,255,.07) 59px,rgba(255,255,255,.07) 60px),
  radial-gradient(120% 80% at 0% 108%,rgba(224,231,241,.7) 0%,rgba(224,231,241,0) 60%),linear-gradient(180deg,#4F78C2 0%,#729BDD 55%,#9DBBE4 100%)}
/* Encabezados de capítulo: los mismos arcos, que se expanden despacio como ondas */
@property --ripple{syntax:"<length>";inherits:false;initial-value:0px}
body .portal .portal__arcs{backdrop-filter:none;-webkit-backdrop-filter:none;background-color:transparent;
  background-image:repeating-radial-gradient(circle at -8% 140%,rgba(255,255,255,.16) var(--ripple),rgba(255,255,255,.16) calc(var(--ripple) + 1px),rgba(255,255,255,.07) calc(var(--ripple) + 1px),rgba(255,255,255,.01) calc(var(--ripple) + 30px),rgba(255,255,255,.01) calc(var(--ripple) + 31px),rgba(255,255,255,.07) calc(var(--ripple) + 59px),rgba(255,255,255,.07) calc(var(--ripple) + 60px));
  animation:arcRipple 18s linear infinite}
@keyframes arcRipple{to{--ripple:60px}}
@media(prefers-reduced-motion:reduce){body .portal .portal__arcs{animation:none}}
/* 9.5 · ventanas verticales en cuatro figuras */
.wins--4{grid-template-columns:repeat(4,minmax(0,1fr));align-items:start}
.wins--4 figure{min-width:0}
.wins--4 figcaption{margin-top:var(--s3);font-size:13px;color:var(--color-text-2)}
.wins--4 .win{border-radius:var(--r-component)}
.wins--4 figure:first-child .win{border-radius:0 var(--r-component) var(--r-component) 0}
.wins--4 figure:last-child .win{border-radius:var(--r-component) 0 0 var(--r-component)}
.win--c .win__in{clip-path:circle(28% at 50% 50%)}
.win--c .win__edge{inset:auto;left:17%;width:66%;top:50%;aspect-ratio:1;transform:translateY(-50%);border-radius:50%}
.win--t .win__in{clip-path:polygon(50% 24%,84% 74%,16% 74%)}
.win--t .win__edge{inset:24% 16% 26%;box-shadow:none;clip-path:polygon(50% 0,100% 100%,0 100%);background:linear-gradient(0deg,rgba(255,255,255,.6) 0 1px,transparent 1px),linear-gradient(180deg,rgba(16,18,42,.26) 0%,rgba(16,18,42,0) 34%)}
.win--s{--wy:25.25%}
@media(max-width:900px){.wins--4{grid-template-columns:repeat(2,minmax(0,1fr))}.wins--4 .win{border-radius:0!important}}
/* 6.7 · Amanecer con el amarillo abajo */
.win--flip::before,.win--flip .win__in{transform:scaleY(-1)}
/* 10.5 · el trazo se dibuja y al terminar vuelve a cerrar sus uniones */
.ict:hover .ic [pathLength],.icat__big.is-anim .ic [pathLength]{stroke-dasharray:none;animation:icDraw2 .5s cubic-bezier(.22,.61,.36,1) backwards}
@keyframes icDraw2{from{stroke-dasharray:1;stroke-dashoffset:1}to{stroke-dasharray:1;stroke-dashoffset:0}}
/* 11.4 */
.dcards .dcard:not(.dcard--wide):nth-child(4) .dcard__chart{max-width:420px}
/* 11.5 · anatomía interactiva */
.anat{padding:var(--s10) 64px}
.anat .apin{position:absolute;left:-46px;top:.15em;border:0;cursor:pointer;transition:background-color var(--m-fast) var(--e-out),transform var(--m-fast) var(--e-out)}
.anat__n .apin{top:.7em}
.anat__chart > .apin{left:auto;right:-46px;top:calc(var(--s6) + 38%)}
.anat__sig{position:absolute;right:0;bottom:0;display:block;width:26px;height:20px}
.anat__sig .anat__iso{position:static;display:block;width:26px}
.anat__sig > .apin{left:auto;right:-46px;top:auto;bottom:0}
.anat__foot > .apin{display:none}
.anat [data-k]:not(.apin){transition:background-color .3s var(--e-out),box-shadow .3s var(--e-out)}
.anat [data-k].is-on:not(.apin){background:rgba(114,155,221,.13);box-shadow:0 0 0 8px rgba(114,155,221,.13)}
.apin.is-on,.apin:hover,.apin:focus-visible{background:var(--k-cielo);transform:scale(1.12);outline:none}
.anotes{row-gap:0}
.anotes li{grid-template-columns:40px minmax(0,1fr);padding:var(--s4) 0;cursor:pointer;outline:none;transition:opacity .3s var(--e-out)}
.anotes__n{font-family:var(--font-display);font-size:24px;line-height:1;color:var(--color-text-3);font-variant-numeric:tabular-nums;transition:color .3s var(--e-out)}
.anotes li.is-on .anotes__n{color:var(--k-cielo)}
.anotes li.is-on{border-top-color:var(--k-noche)}
.annot--anat.has-on .anotes li:not(.is-on){opacity:.32}
@media(max-width:900px){.anat{padding:var(--s8) 44px}.anat .apin{left:-34px}.anat__chart > .apin,.anat__sig > .apin{right:-34px}}
/* Portada: las líneas del cristal se dibujan como ondas */
.hero__glass.has-waves{background-image:none}
.hero__waves{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.anat__foot{row-gap:10px}

/* ════ Ronda 18 ════ */
/* 8.6 · número centrado con su título, todos rellenos */
.flow li{grid-template-columns:36px minmax(0,1fr);align-items:center;row-gap:4px}
.flow__n,.flow li:last-child .flow__n{background:var(--k-noche);color:var(--k-blanco);box-shadow:none}
.flow__q{padding-top:0}
.flow__a{grid-column:2;margin-top:0}
.flow::before{top:18px;bottom:44px}
/* 9.1 · secuencias de viñetas */
.vseq{display:flex;gap:6px;margin-bottom:6px}
.vseq svg{width:16px;height:16px;flex:none}
.vseq__t{display:block;font-size:13px;color:var(--color-text-2)}
/* 9.5 · el esmerilado se nota también sobre degradado */
.wins--4 .win::before{filter:blur(16px) saturate(.8) brightness(1.1)}
/* 10 · los íconos aparecen siempre de izquierda a derecha */
.ict:hover .ic [pathLength],.icat__big.is-anim .ic [pathLength]{animation:none;stroke-dasharray:none}
.ict:hover .ic path:not([pathLength]),.icat__big.is-anim .ic path:not([pathLength]){animation:none}
.ict:hover .ic,.icat__big.is-anim .ic{animation:icWipe .45s cubic-bezier(.22,.61,.36,1) both}
@keyframes icWipe{from{clip-path:inset(-2px 100% -2px -2px)}to{clip-path:inset(-2px -2px -2px -2px)}}
@media(prefers-reduced-motion:reduce){.ict:hover .ic,.icat__big.is-anim .ic{animation:none}}
/* 11 · cifras de abanicos */
.chart .pct{font-family:var(--font-display);font-weight:400;letter-spacing:-.02em;fill:var(--k-noche)}
/* 11.6 · documento real: ritmo vertical, firma integrada */
.anat{padding:var(--s10) 64px var(--s8)}
.anat > *{margin:0}
.anat__t{font-size:19px;line-height:1.35;margin:0}
.anat .dcard__l{margin-top:6px}
.anat__n{margin-top:var(--s5)!important;font-size:56px;line-height:1}
.anat .anat__chart{margin-top:var(--s5)!important;margin-bottom:0;padding-top:0}
.anat__chart > .apin{top:calc(40% - 9px)}
.anat__foot{display:flex;align-items:center;justify-content:space-between;gap:var(--s5);margin-top:var(--s6)!important;padding-top:var(--s4);border-top:1px solid var(--color-border)}
.anat__src{display:grid;row-gap:8px}
.anat__sig{position:relative;right:auto;bottom:auto;width:auto;height:auto}
.anat__sig .anat__iso{width:40px}
.anat__sig > .apin{right:-46px;top:50%;bottom:auto;margin-top:-9px}
.anotes li{align-items:center}
.anat{gap:0}
.annot--anat .annot__fig{grid-column:1 / span 8}
.annot--anat .anotes{grid-column:10 / -1}
@media(max-width:900px){.annot--anat .annot__fig,.annot--anat .anotes{grid-column:1 / -1}}

/* ════ Ronda 19 ════ */
/* Números dentro de círculos: centrados de verdad (las cifras de Jakarta asientan bajo) */
.apin,.flow__n{display:inline-flex;align-items:center;justify-content:center;line-height:1;padding:0 0 2px;font-variant-numeric:tabular-nums lining-nums}
/* 8.5 · viñetas al tamaño de la regla */
.dui li{padding-left:26px}
.dui li::before{width:16px;height:16px;top:.12em}
/* 10.5 · barra de búsqueda y filtros más livianos */
.icat__bar{gap:var(--s3);margin:0;padding:0;border:0}
.icat__q{flex:1;padding:9px 16px;border-radius:var(--r-pill);background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border);font-size:14px}
.icat__q:focus{box-shadow:inset 0 0 0 1px var(--k-cielo)}
.icat__count{font-size:11px}
.icat__chips{gap:2px;margin-top:var(--s3)}
.icat__chips button{padding:4px 10px;box-shadow:none;color:var(--color-text-3)}
.icat__chips button:hover{color:var(--color-text)}
.icat__h{margin-top:var(--s6);padding:0 var(--s1);border-top:0;font-size:11px;font-weight:500;color:var(--color-text-3)}
.icat__h span{font-weight:400}
.icat__grid{margin-top:var(--s4)}
/* 10 · animación con carácter: entra de izquierda a derecha, se asienta con un pequeño rebote */
.ict:hover .ic,.icat__big.is-anim .ic{transform-origin:50% 60%;animation:icWipe2 .62s cubic-bezier(.22,.61,.36,1) both}
@keyframes icWipe2{
  0%{clip-path:inset(-2px 100% -2px -2px);transform:translateX(-4px) scale(.9);opacity:.3}
  55%{clip-path:inset(-2px -2px -2px -2px);transform:translateX(1px) scale(1.05);opacity:1}
  78%{transform:translateX(0) scale(.985)}
  100%{clip-path:inset(-2px -2px -2px -2px);transform:none;opacity:1}}
@media(prefers-reduced-motion:reduce){.ict:hover .ic,.icat__big.is-anim .ic{animation:none}}
/* Encabezados de capítulo: lienzo de ondas al pasar el cursor */
.portal__arcs.has-waves{background-image:none!important}
.portal__waves{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.dcard--wide .dcard__chart:has(svg[aria-label^="Radar"]){max-width:460px}

/* ════ Ronda 20 ════ */
.chart .cap{font-size:9.5px;font-weight:500;letter-spacing:.08em;fill:#6B6D7E}
/* 10 · de nuevo el trazo que se dibuja, fluido y continuo; todos empiezan a la izquierda */
.ict:hover .ic,.icat__big.is-anim .ic{animation:none}
.ict:hover .ic [pathLength],.icat__big.is-anim .ic [pathLength]{stroke-dasharray:none;animation:icDraw3 .75s cubic-bezier(.45,.05,.25,1) backwards}
.ict:hover .ic path:not([pathLength]),.icat__big.is-anim .ic path:not([pathLength]){animation:icFade .45s ease .3s backwards}
@keyframes icDraw3{from{stroke-dasharray:1;stroke-dashoffset:1}to{stroke-dasharray:1;stroke-dashoffset:0}}

/* ════ 19 · Presentaciones: miniaturas de diapositivas a escala de 1920 × 1080 ════ */
.pcanvas{max-width:720px}
.slides{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s10) var(--s5);margin-top:var(--s12)}
.slfig figcaption{display:grid;row-gap:2px;margin-top:var(--s3);font-size:13px;line-height:1.5;color:var(--color-text-2)}
.slfig figcaption b{font-size:15px;font-weight:500;color:var(--color-text)}
.sl{position:relative;aspect-ratio:16/9;container-type:inline-size;overflow:hidden;background:var(--k-blanco);color:var(--k-noche);box-shadow:0 0 0 1px var(--color-border),0 10px 28px -18px rgba(16,18,42,.35)}
.sl > *{position:absolute;margin:0}
.sl--noche{background:var(--k-noche);color:var(--k-blanco)}
.sl--cielo{background:linear-gradient(180deg,#3D6BAF 0%,#729BDD 38%,#9EBADD 70%,#C4DBF0 100%);color:var(--k-noche)}
/* Medidas proporcionales al lienzo: 1 cqw = 19,2 px a tamaño real */
.sl__t{left:5.2cqw;top:4.5cqw;right:5.2cqw;font-size:3.6cqw;font-weight:500;line-height:1.12;letter-spacing:-.02em}
.sl__t--sm{font-size:2.9cqw}
.sl__k{left:5.2cqw;top:4.5cqw;font-size:1.15cqw;font-weight:500;letter-spacing:.06em;text-transform:uppercase;opacity:.75}
.sl__k--g{position:static;display:block;margin-bottom:.9cqw;color:var(--color-text-3);opacity:1}
.sl__h{left:5.2cqw;bottom:16cqw;font-family:var(--font-display);font-size:7.4cqw;font-weight:500;line-height:.98;letter-spacing:-.035em}
.sl__h--md{bottom:auto;top:50%;transform:translateY(-50%);font-size:6.2cqw}
.sl__m{left:5.2cqw;bottom:7.5cqw;font-size:1.25cqw;opacity:.75}
.sl__m--d{position:absolute;left:5.2cqw;top:30cqw;bottom:auto;color:var(--color-text-3);opacity:1}
.sl__logo{left:5.2cqw;top:4.5cqw;width:9cqw;height:auto}
.sl__logo--br{left:auto;top:auto;right:5.2cqw;bottom:5.5cqw;width:10cqw}
.sl__win{right:6cqw;top:7cqw;width:23cqw;height:42cqw;--wx:16%;--wy:11%}
.sl .win::before{inset:-12px;filter:blur(7px) saturate(.85) brightness(1.08)}
.sl__f{left:5.2cqw;right:5.2cqw;bottom:2.4cqw;display:flex;justify-content:space-between;padding-top:.8cqw;border-top:1px solid rgba(16,18,42,.12);font-size:.94cqw;color:var(--color-text-3)}
.sl--noche .sl__f,.sl--cielo .sl__f{border-color:rgba(255,255,255,.25);color:inherit;opacity:.75}
.sl__f b{font-weight:500}
.sl__ln{display:block;height:.75cqw;margin-top:.9cqw;border-radius:0;background:rgba(16,18,42,.14)}
.sl--noche .sl__ln{background:rgba(244,244,244,.25)}
.sl__ag{left:5.2cqw;right:5.2cqw;top:15cqw;display:grid;row-gap:0}
.sl__ag p{display:grid;grid-template-columns:5cqw 1fr auto;align-items:baseline;padding:1.5cqw 0;border-top:1px solid rgba(16,18,42,.12);font-size:1.9cqw}
.sl__ag span{font-size:1.25cqw;color:var(--color-text-3);font-variant-numeric:tabular-nums}
.sl__ag em{font-style:normal;font-size:1.25cqw;color:var(--color-text-3)}
.sl__big{left:5.2cqw;right:16cqw;top:12cqw;font-size:4.2cqw;font-weight:500;line-height:1.18;letter-spacing:-.02em}
.sl__big .sl__k--g{font-size:1.15cqw}
.sl__hl{background:var(--k-cielo-200);box-decoration-break:clone;-webkit-box-decoration-break:clone;padding:0 .3cqw}
.sl__cols{left:5.2cqw;right:5.2cqw;top:16cqw;display:grid;grid-template-columns:repeat(3,1fr);gap:.6cqw}
.sl__card{position:relative;height:24cqw;padding:2.2cqw;background:#FFFFFF;box-shadow:inset 0 0 0 1px rgba(16,18,42,.08)}
.sl__card:first-child{border-radius:0 1.6cqw 1.6cqw 0}
.sl__card:nth-child(2){border-radius:1.6cqw}
.sl__card:last-child{border-radius:1.6cqw 0 0 1.6cqw}
.sl__card span{display:block;margin-bottom:6cqw;font-size:1.25cqw;color:var(--color-text-3)}
.sl__steps{left:5.2cqw;right:5.2cqw;top:19cqw;display:grid;grid-template-columns:repeat(4,1fr);gap:2cqw;border-top:1px solid rgba(16,18,42,.16);padding-top:2.4cqw}
.sl__steps p{margin-top:1.2cqw;font-size:1.8cqw;font-weight:500}
.sl__vi{display:inline-flex}
.sl__vi svg{width:2cqw;height:2cqw}
.sl__nums{left:5.2cqw;right:5.2cqw;top:16cqw;display:grid;grid-template-columns:repeat(3,1fr);gap:3cqw}
.sl__nums b{display:block;font-family:var(--font-display);font-size:7.2cqw;font-weight:400;line-height:1;letter-spacing:-.03em}
.sl__nums div > b + .sl__ln{margin-top:2cqw}
.sl__chart{left:5.2cqw;right:5.2cqw;top:13cqw;width:89.6cqw;height:auto}
.sl__cmp{left:5.2cqw;right:5.2cqw;top:14cqw;display:grid;grid-template-columns:1fr 1fr;gap:5cqw}
.sl__li{display:flex;align-items:center;gap:1.2cqw;margin-top:1.6cqw}
.sl__li .sl__ln{flex:1;margin:0}
.sl__q{left:5.2cqw;right:12cqw;top:9cqw;font-size:4.4cqw;font-weight:500;line-height:1.16;letter-spacing:-.02em}
.sl__act{left:5.2cqw;right:5.2cqw;top:18cqw;display:grid;grid-template-columns:1fr auto;gap:6cqw;align-items:end}
.sl__act b{font-family:var(--font-display);font-size:11cqw;font-weight:400;line-height:.9;letter-spacing:-.04em;color:var(--k-cielo)}
.sl__act small{margin-left:.6cqw;font-family:var(--font-sans);font-size:1.6cqw;color:var(--color-text-3);letter-spacing:0}
.sl__act .sl__k--g{margin:0}
.sl .sl__t + .sl__act,.sl__k--g + .sl__t{top:8cqw}
.sl > .sl__k--g{position:absolute;left:5.2cqw;top:4.5cqw}
.sl__sum{left:5.2cqw;right:30cqw;top:15cqw}
.sl__sum .sl__li{margin-top:2.6cqw}
@media(max-width:760px){.slides{grid-template-columns:1fr}}

/* ════ Ronda 21 ════ */
.chart .a-growx{transform-box:fill-box;transform-origin:0 50%}
.anim [data-draw] .a-growx{transition:transform .8s var(--e-out);transition-delay:calc(var(--i,0) * 90ms)}
.anim [data-draw]:not(.is-drawn) .a-growx{transform:scaleX(0)}
/* 19.5 · proporción de color en columna */
.vprop{margin-top:var(--s12)}
.vprop > div,.vprop__leg{display:inline-flex;vertical-align:top}
.vprop__col{flex-direction:column;width:140px;height:420px;box-shadow:inset 0 0 0 1px var(--color-border)}
.vprop__s{display:flex;align-items:flex-start;min-height:0;padding:var(--s2) var(--s3);font-size:13px;overflow:hidden;box-shadow:inset 0 -1px 0 rgba(16,18,42,.1)}
.vprop__leg{list-style:none;flex-direction:column;height:420px;margin-left:var(--s6)}
.vprop__leg li{display:flex;align-items:flex-start;gap:var(--s3);min-height:22px;padding-top:var(--s2);font-size:13px;line-height:1.35;color:var(--color-text-2)}
.vprop__leg i{flex:none;width:12px;height:12px;margin-top:2px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(16,18,42,.15)}
.vprop__leg b{display:block;font-weight:500;color:var(--color-text)}
.dl-row{margin-top:var(--s8)}
.vprop__leg{height:auto;row-gap:var(--s4)}.vprop__leg li{flex:none!important;padding-top:0}.vprop__s b{font-weight:500}
.vprop__col{outline:1px solid var(--color-border);outline-offset:-1px}.vprop__s{min-height:28px;align-items:center}

/* ════ Ronda 22 ════ */
/* 6.1 · capas como contorno, igual que 3.5 */
.orbs .orb-c{fill:none;stroke:var(--k-noche);stroke-opacity:.55;stroke-width:1;vector-effect:non-scaling-stroke}
/* 10.5 · búsqueda y filtros: cada filtro con su botón */
.icat__bar{display:flex;align-items:center;gap:var(--s4)}
.icat__q{padding:10px 18px 10px 42px;background:var(--k-puro) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%238B8C92' stroke-width='1.5'%3E%3Ccircle cx='7' cy='7' r='4.5'/%3E%3Cpath d='m10.5 10.5 3 3'/%3E%3C/svg%3E") 16px 50%/16px no-repeat}
.icat__count{flex:none;min-width:70px;text-align:right}
.icat__chips{gap:8px;margin-top:var(--s4)}
.icat__chips button{padding:7px 14px;box-shadow:inset 0 0 0 1px var(--color-border-strong);font-size:12.5px;color:var(--color-text-2)}
.icat__chips button:hover{box-shadow:inset 0 0 0 1px var(--k-noche);color:var(--color-text)}
.icat__chips button[aria-pressed="true"]{box-shadow:none}
.icat__h{margin-top:var(--s8);padding:var(--s3) var(--s1) 0;border-top:1px solid var(--color-border)}
.icat__grid{margin-top:var(--s6)}
/* 10 · una sola animación para todos: aparece desde el centro y se asienta */
.ict:hover .ic [pathLength],.icat__big.is-anim .ic [pathLength]{animation:none;stroke-dasharray:none}
.ict:hover .ic path:not([pathLength]),.icat__big.is-anim .ic path:not([pathLength]){animation:none}
.ict:hover .ic,.icat__big.is-anim .ic{transform-origin:50% 50%;animation:icReveal .55s cubic-bezier(.22,.61,.36,1) both}
@keyframes icReveal{from{clip-path:circle(0% at 50% 50%);transform:scale(.88);opacity:.35}to{clip-path:circle(75% at 50% 50%);transform:none;opacity:1}}
@media(prefers-reduced-motion:reduce){.ict:hover .ic,.icat__big.is-anim .ic{animation:none}}
/* 9.6 · texturas de cielo */
.texs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s8) var(--s2);margin-top:var(--s8)}
.tex img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:var(--r-component)}
.tex:nth-child(3n+1) img{border-radius:0 var(--r-component) var(--r-component) 0}
.tex:nth-child(3n) img{border-radius:var(--r-component) 0 0 var(--r-component)}
.tex figcaption{display:grid;row-gap:2px;margin-top:var(--s3);font-size:13px;line-height:1.5;color:var(--color-text-2)}
.tex figcaption b{font-size:15px;font-weight:500;color:var(--color-text)}
.tex figcaption a{margin-top:var(--s2);font-size:12px;font-weight:500;color:var(--color-text);text-decoration:underline;text-underline-offset:3px}
@media(max-width:760px){.texs{grid-template-columns:1fr 1fr}.tex img{border-radius:0!important}}
/* 11.4 · constelación cuadrada en tarjeta ancha */
.dcard--sq .dcard__chart{max-width:440px}
.flow__tag{display:inline-block;margin-left:8px;padding:2px 9px;border-radius:var(--r-pill);font-size:11px;font-weight:500;vertical-align:middle;color:var(--color-text-2);box-shadow:inset 0 0 0 1px var(--color-border-strong)}.flow__tag.is-var{background:var(--k-cielo-200);box-shadow:none;color:var(--k-noche)}
/* Cinco áreas en la portada */
.c5{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:1100px){.c5{grid-template-columns:repeat(2,minmax(0,1fr))}.grp--row.c5 > *{border-radius:var(--rr)!important}}
@media(max-width:760px){.c5{grid-template-columns:minmax(0,1fr)}}
.grad--mediodia{background-image:linear-gradient(180deg,#3D6BAF 0%,#729BDD 38%,#9EBADD 70%,#C4DBF0 100%);background-color:#729BDD}
.hdr__links{gap:28px}@media(max-width:1200px){.hdr__links{gap:20px}}@media(max-width:1100px){.hdr__link{font-size:13px;letter-spacing:.01em}}

/* ════ Ronda 23 ════ */
/* Portada: carrusel de áreas */
#indice .sec-head{position:relative}
.acar__nav{position:absolute;right:0;bottom:0;display:flex;gap:8px}
.acar{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 2 * var(--s2)) / 3);gap:var(--s2);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.acar::-webkit-scrollbar{display:none}
.acar > *{scroll-snap-align:start}
@media(max-width:900px){.acar{grid-auto-columns:82%}.acar__nav{position:static;margin-top:var(--s4)}}
/* Filtro desplegable */
.fpop{position:relative;flex:none}
.fpop__btn{display:inline-flex;align-items:center;gap:10px;height:42px;padding:0 16px;border-radius:var(--r-pill);background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border);font-size:13px;font-weight:500;color:var(--color-text)}
.fpop__btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
.fpop__btn[aria-expanded="true"],.fpop__btn:hover{background:var(--k-noche);color:var(--k-blanco);box-shadow:none}
.fpop__panel{position:absolute;left:0;top:calc(100% + 8px);z-index:20;display:flex;flex-direction:column;align-items:stretch;gap:2px;min-width:240px;margin:0!important;padding:var(--s3);background:var(--k-puro);border-radius:var(--r-component);box-shadow:0 0 0 1px var(--color-border),0 18px 40px -18px rgba(16,18,42,.35)}
.fpop__panel[hidden]{display:none}
.fpop__h{padding:var(--s2) var(--s2) 4px;font-size:11px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;color:var(--color-text-3)}
.fpop__panel > button{justify-content:flex-start;text-align:left;padding:8px 12px;border-radius:var(--r-control);box-shadow:none!important;font-size:13px;color:var(--color-text-2)}
.fpop__panel > button:hover,.fpop__panel > button[aria-pressed="true"]{background:var(--k-noche);color:var(--k-blanco)}
.fpop__row{display:flex;flex-wrap:wrap;gap:6px;padding:0 var(--s1) var(--s2)}
.fpop__row button{padding:6px 12px;border-radius:var(--r-pill);box-shadow:inset 0 0 0 1px var(--color-border-strong);font-size:12.5px;color:var(--color-text-2);transition:background-color var(--m-fast) var(--e-out),color var(--m-fast) var(--e-out)}
.fpop__row button:hover,.fpop__row button[aria-pressed="true"]{background:var(--k-noche);color:var(--k-blanco);box-shadow:none}
.icat__chips button:hover{background:var(--k-noche);color:var(--k-blanco)}
/* 9.7 · galería */
.gal{margin-top:var(--s10)}
.gal__grid{columns:3;column-gap:var(--s2);margin-top:var(--s6)}
.gph{display:block;width:100%;margin:0 0 var(--s2);break-inside:avoid;text-align:left;cursor:zoom-in}
.gph[hidden]{display:none}
.gph__img{display:grid;place-items:center;width:100%;aspect-ratio:3/4;background:#C6D5EC center/cover no-repeat;border-radius:var(--r-component);transition:transform var(--m-base) var(--e-out)}
.gph--h .gph__img{aspect-ratio:4/3}
.gph:hover .gph__img{transform:scale(.985)}
.gph__img.is-ph{background:repeating-linear-gradient(135deg,transparent 0 10px,rgba(16,18,42,.04) 10px 11px),var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border-strong)}
.gph__img em,.gal__big em{font-style:normal;font-size:12px;color:var(--color-text-3)}
.gph__meta{display:grid;row-gap:2px;padding:var(--s3) var(--s1) var(--s4);font-size:12px;color:var(--color-text-3)}
.gph__meta b{font-size:14px;font-weight:500;color:var(--color-text)}
.gph__tags{color:var(--color-text-2)}
.gal__dlg{position:fixed;inset:0;z-index:400;display:grid;place-items:center;padding:var(--s8);background:rgba(16,18,42,.55);backdrop-filter:blur(6px)}
.gal__dlg[hidden]{display:none}
.gal__box{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,1fr);gap:var(--s2);width:min(1080px,100%);max-height:calc(100vh - 64px)}
.gal__big{position:relative;display:grid;place-items:center;min-height:420px;background:#C6D5EC center/cover no-repeat;border-radius:0 var(--r-component) var(--r-component) 0;overflow:hidden}
.gal__big.is-ph{background:var(--k-puro)}
.gal__big:not(.is-ph) em{display:none}
.gal__win,.gal__veil{position:absolute;inset:0;opacity:0;transition:opacity .4s var(--e-out);pointer-events:none}
.gal__win{background:inherit;filter:blur(14px);clip-path:polygon(0 0,100% 0,100% 100%,0 100%,0 0,17% 12%,17% 88%,83% 88%,83% 12%,17% 12%)}
.gal__big[data-fx="win"] .gal__win{opacity:1}
.gal__veil{background:linear-gradient(0deg,rgba(16,18,42,.6),rgba(16,18,42,0) 60%)}
.gal__big[data-fx="veil"] .gal__veil{opacity:1}
.gal__side{position:relative;display:flex;flex-direction:column;gap:var(--s3);padding:var(--s8);background:var(--k-puro);border-radius:var(--r-component) 0 0 var(--r-component);overflow:auto}
.gal__side .paren{margin-top:var(--s3);color:var(--color-text-3)}
.gal__side .gph__meta{padding:0}
.gal__x{position:absolute;right:var(--s4);top:var(--s4)}
.gal__x svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6}
.gal__cred{margin-top:auto;padding:12px 18px;border-radius:var(--r-pill);background:var(--k-noche);color:var(--k-blanco);font-size:13px;font-weight:500}
@media(max-width:900px){.gal__grid{columns:2}.gal__box{grid-template-columns:1fr}.gal__big,.gal__side{border-radius:0}}
/* 11.4 · lo que no se usa, tachado */
.nolist--no .nolist__t s{text-decoration-color:var(--k-salmon);text-decoration-thickness:1.5px;color:var(--color-text-2)}
/* 8.7 · anillos que salen del recuadro */
.dcard--bleed{overflow:hidden}
.dcard--bleed .dcard__chart{max-width:none;width:auto;margin:0 calc(-1 * var(--s8)) calc(-1 * var(--s8));padding-top:var(--s6)}
.gal__meta{display:grid;row-gap:4px;padding-right:var(--s8);font-size:13px;color:var(--color-text-3)}
.gal__meta b{font-size:22px;font-weight:500;letter-spacing:-.01em;color:var(--color-text);margin-bottom:var(--s2)}
.gal__side .fpop__row{padding:0}
.gal__win{clip-path:polygon(evenodd,0 0,100% 0,100% 100%,0 100%,0 0,17% 12%,17% 88%,83% 88%,83% 12%,17% 12%)}
.gal__win::after{content:"";position:absolute;inset:0;background:rgba(244,244,244,.18)}

/* ════ Ronda 24 · Capítulo 18, Presentaciones ════ */
/* 18.1 · Tipos */
.ptype{margin-top:var(--s10)}
.ptype__tabs{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;border-radius:var(--r-pill);background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border)}
.ptype__tabs button{padding:10px 20px;border-radius:var(--r-pill);font-size:14px;font-weight:500;color:var(--color-text-2);transition:background-color var(--m-base) var(--e-out),color var(--m-base) var(--e-out)}
.ptype__tabs button:hover{color:var(--color-text)}
.ptype__tabs button[aria-selected="true"]{background:var(--k-noche);color:var(--k-blanco)}
.ptype__scale{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:var(--s4);margin-top:var(--s8);font-size:12px;color:var(--color-text-3)}
.ptype__track{position:relative;height:1px;background:var(--k-gris-2,#C7C8CB)}
.ptype__dot{position:absolute;top:50%;left:var(--x);width:22px;height:22px;transform:translate(-50%,-50%);transition:left .8s cubic-bezier(.65,0,.35,1)}
.ptype__stage{margin-top:var(--s8)}
.ptype__panel{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:var(--s10);align-items:start}
.ptype__panel[hidden]{display:none}
.ptype__deck{position:relative;aspect-ratio:16/12}
.ptype__deck img{position:absolute;left:calc(var(--i) * 11%);top:calc(var(--i) * 14%);width:78%;aspect-ratio:16/9;object-fit:cover;box-shadow:0 0 0 1px var(--color-border),0 18px 36px -22px rgba(16,18,42,.45);animation:deckIn .7s var(--e-out) both;animation-delay:calc(var(--i) * 90ms)}
@keyframes deckIn{from{opacity:0;transform:translate(-14px,18px)}}
.ptype__spec{margin:0;animation:fadeUp .6s var(--e-out) both}
.ptype__spec div{display:grid;grid-template-columns:96px 1fr;gap:var(--s4);padding:12px 0;border-top:1px solid var(--color-border)}
.ptype__spec dt{font-size:12px;color:var(--color-text-3)}
.ptype__spec dd{margin:0;font-size:15px;line-height:1.5;color:var(--color-text)}
.ptype__spec a{color:inherit;text-decoration:underline;text-decoration-color:var(--k-cielo);text-underline-offset:3px}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}}
@media(max-width:900px){.ptype__panel{grid-template-columns:1fr}}
/* 18.2 · Así no, así sí */
.rw{margin-top:var(--s10)}
.rw__r{display:grid;grid-template-columns:minmax(150px,.7fr) 1fr 1fr;gap:var(--s6);padding:var(--s5) 0;border-top:1px solid var(--color-border);align-items:baseline}
.rw__r p{margin:0}
.rw__h{padding-top:0;border-top:0;font-size:12px;color:var(--color-text-3)}
.rw__k{font-size:13px;font-weight:500;color:var(--color-text-2)}
.rw__no{font-size:17px;line-height:1.4;color:var(--color-text-3)}
.rw__no s{text-decoration-color:var(--k-salmon);text-decoration-thickness:1.5px}
.rw__si{font-size:17px;line-height:1.4;font-weight:500;color:var(--color-text)}
@media(max-width:760px){.rw__r{grid-template-columns:1fr;gap:6px}.rw__h{display:none}}
/* 18.4 · Storytelling */
.story{margin-top:var(--s10);padding:var(--s8);background:var(--k-puro);border-radius:var(--r-card);outline:none}
.story:focus-visible{box-shadow:0 0 0 2px var(--color-focus,var(--k-cielo))}
.story__top{display:grid;grid-template-columns:180px minmax(0,1fr) auto;gap:var(--s8);align-items:center}
.story__drum{height:264px;overflow:hidden;-webkit-mask-image:linear-gradient(transparent,#000 34%,#000 66%,transparent);mask-image:linear-gradient(transparent,#000 34%,#000 66%,transparent)}
.story__reel{transition:transform .8s cubic-bezier(.65,0,.35,1)}
.story__reel span{display:block;height:88px;font-family:var(--font-display);font-size:84px;font-weight:400;line-height:88px;letter-spacing:-.04em;color:var(--color-text);opacity:.16;transition:opacity .6s var(--e-out)}
.story__reel span.is-on{opacity:1}
.story__body{min-height:236px;display:grid;align-content:center}
.story__p{animation:fadeUp .6s var(--e-out) both}
.story__p[hidden]{display:none}
.story__p p{margin:0}
.story__k{font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--color-text-3)}
.story__t{margin-top:6px!important;font-size:34px;font-weight:500;line-height:1.1;letter-spacing:-.02em;color:var(--color-text)}
.story__d{margin-top:var(--s3)!important;max-width:46ch;font-size:15px;line-height:1.55;color:var(--color-text-2)}
.story__ex{margin-top:var(--s5)!important;font-size:18px;line-height:1.4;color:var(--color-text)}
.story__ex .paren{display:block;margin-bottom:4px;font-size:12px;color:var(--color-text-3)}
.story__n{margin-top:var(--s3)!important;font-size:12px;color:var(--color-text-3)}
.story__ctl{display:flex;flex-direction:column;gap:8px}
.story__arc{display:block;width:100%;height:auto;margin-top:var(--s6);overflow:visible}
.story__pt{cursor:pointer}
.story__pt circle:nth-child(2){fill:#C7C8CB;transition:fill .4s var(--e-out)}
.story__pt.is-on circle:nth-child(2){fill:var(--k-noche)}
.story__pt.is-on text{fill:var(--color-text)}
.story__star{transition:transform .8s cubic-bezier(.65,0,.35,1)}
@media(max-width:900px){.story{padding:var(--s5)}.story__top{grid-template-columns:96px minmax(0,1fr)}.story__ctl{grid-column:1/-1;flex-direction:row}.story__drum{height:180px}.story__reel span{height:60px;font-size:52px;line-height:60px}}
/* 18.6 · Escalera tipográfica */
.tlad{margin-top:var(--s10)}
.tlad__r{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:var(--s8);align-items:end;padding:var(--s5) 0;border-bottom:1px solid var(--color-border)}
.tlad__r p{margin:0}
.tlad__s{font-weight:500;line-height:1.05;letter-spacing:-.02em;color:var(--color-text);overflow-wrap:anywhere}
.tlad__s--d{font-family:var(--font-display);letter-spacing:-.035em}
.tlad__m{display:grid;row-gap:2px;font-size:12px;color:var(--color-text-3)}
.tlad__m b{font-size:13px;font-weight:500;color:var(--color-text)}
.tlad__cap{margin-top:var(--s3)!important;font-size:12px;color:var(--color-text-3)}
@media(max-width:760px){.tlad__r{grid-template-columns:1fr;gap:var(--s2)}}
/* 18.7 · Color y ritmo */
.rhythm{margin-top:var(--s10)}
.rhythm__tabs{padding:0;margin-bottom:var(--s6)}
.rhythm__strip{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:6px}
.rhythm__strip[hidden]{display:none}
.rh{position:relative;display:block;aspect-ratio:16/9;background:var(--k-blanco);box-shadow:inset 0 0 0 1px var(--color-border-strong);cursor:default;outline:none;animation:rhIn .5s var(--e-out) both;animation-delay:calc(var(--i) * 35ms);transition:transform var(--m-base) var(--e-out)}
.rh:hover,.rh:focus-visible{transform:translateY(-4px)}
.rh:focus-visible{box-shadow:0 0 0 2px var(--k-cielo)}
@keyframes rhIn{from{opacity:0;transform:translateY(10px)}}
.rh--n{background:var(--k-noche);box-shadow:none}
.rh--c{background:var(--k-cielo);box-shadow:none}
.rh--a{background:var(--k-atardecer);box-shadow:none}
.rh--k{background:url(../assets/texturas/textura-cielo-de-papel.svg) center/cover;box-shadow:none}
.rh--d::after{content:"";position:absolute;left:14%;top:30%;width:22%;height:30%;background:var(--k-salmon)}
.rhythm__cap{min-height:20px;margin:var(--s4) 0 var(--s8);font-size:13px;color:var(--color-text-2)}
.rhythm__bar{display:flex;gap:2px;height:104px}
.rhythm__bar[hidden]{display:none}
.rb{display:flex;flex-direction:column;justify-content:flex-end;min-width:0;padding:10px 12px;overflow:hidden;color:var(--k-noche);animation:rbIn .8s var(--e-out) both;transform-origin:left}
@keyframes rbIn{from{transform:scaleX(.2);opacity:0}}
.rb b{font-family:var(--font-display);font-size:26px;font-weight:400;line-height:1;letter-spacing:-.02em}
.rb span{margin-top:4px;font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rb--w{background:var(--k-blanco);box-shadow:inset 0 0 0 1px var(--color-border-strong)}
.rb--n{background:var(--k-noche);color:var(--k-blanco)}
.rb--c{background:var(--k-cielo)}
.rb--a{background:var(--k-atardecer)}
.rb--k{background:url(../assets/texturas/textura-cielo-de-papel.svg) center/cover}
@media(max-width:760px){.rhythm__strip{grid-template-columns:repeat(5,minmax(0,1fr))}.rb b{font-size:18px}}
/* 18.8 · Imagen en diapositivas */
.sl--tex{background:url(../assets/texturas/textura-atardecer-en-acuarela.svg) center/cover}
.sl--foto{background:url(../assets/img/cielo-foto.jpg) center/cover;color:var(--k-blanco)}
.sl--foto::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,18,42,.55),rgba(16,18,42,0) 70%)}
.sl--foto .sl__f{color:rgba(244,244,244,.8);border-top-color:rgba(244,244,244,.3)}
.sl__ics{left:5.2cqw;right:5.2cqw;top:17cqw;display:grid;grid-template-columns:repeat(3,1fr);gap:3cqw}
.sl__ics .ic{width:7cqw;height:7cqw;color:var(--k-noche)}
.sl__ics p{margin:1.6cqw 0 0;font-size:1.9cqw;font-weight:500}
/* 18.10 · Plantillas */
.tpl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap);margin-top:var(--s10)}
.tpl__c{display:flex;flex-direction:column;overflow:hidden;background:var(--k-puro)}
.tpl__c:nth-child(1){border-radius:0 var(--r-card) var(--r-card) var(--r-card)}
.tpl__c:nth-child(2){border-radius:var(--r-card) 0 var(--r-card) var(--r-card)}
.tpl__c:nth-child(3){border-radius:var(--r-card) var(--r-card) var(--r-card) 0}
.tpl__c:nth-child(4){border-radius:var(--r-card) var(--r-card) 0 var(--r-card)}
.tpl__img{position:relative;aspect-ratio:16/9;background:var(--k-noche)}
.tpl__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s var(--e-out)}
.tpl__img img.is-on{opacity:1}
.tpl__b{display:flex;flex-direction:column;gap:var(--s2);padding:var(--s8)}
.tpl__b p{margin:0}
.tpl__t{margin:0;font-size:26px;font-weight:500;letter-spacing:-.02em}
.tpl__d{font-size:15px;line-height:1.5;color:var(--color-text-2)}
.tpl__m{font-size:12px;color:var(--color-text-3)}
.tpl__b .btn{align-self:flex-start;margin-top:var(--s4);gap:8px}
.tpl__b .btn svg,.dl-row .btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:760px){.tpl{grid-template-columns:1fr}.tpl__c:nth-child(n){border-radius:var(--r-card)}.tpl__c:first-child{border-radius:0 0 var(--r-card) var(--r-card)}.tpl__c:last-child{border-radius:var(--r-card) var(--r-card) 0 0}}
/* 18.11 · Crear con IA */
.aib{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:var(--s10);align-items:start;margin-top:var(--s10)}
.aib__steps{margin:0;padding:0;list-style:none;counter-reset:ai}
.aib__steps li{display:grid;row-gap:4px;padding:var(--s5) 0;border-top:1px solid var(--color-border);counter-increment:ai}
.aib__steps li::before{content:counter(ai,decimal-leading-zero);font-family:var(--font-display);font-size:13px;color:var(--color-text-3)}
.aib__steps b{font-size:17px;font-weight:500}
.aib__steps span{font-size:14px;line-height:1.5;color:var(--color-text-2)}
.aib__code{border-radius:var(--r-card);overflow:hidden}
.aib__code pre{font-size:12.5px;line-height:1.7;white-space:pre-wrap}
@media(max-width:900px){.aib{grid-template-columns:1fr}}
/* 18.12 · Lista interactiva */
.chk{margin-top:var(--s10)}
.chk__head{display:grid;grid-template-columns:auto 1fr auto;gap:var(--s5);align-items:center;margin-bottom:var(--s4)}
.chk__n{margin:0;font-size:13px;color:var(--color-text-3)}
.chk__n b{font-family:var(--font-display);font-size:34px;font-weight:400;color:var(--color-text);margin-right:4px}
.chk__bar{height:3px;background:var(--color-border)}
.chk__bar i{display:block;height:100%;width:var(--p,0%);background:var(--k-cielo);transition:width .5s var(--e-out)}
.chk__reset{font-size:13px;color:var(--color-text-3);text-decoration:underline;text-underline-offset:3px}
.chk__l{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s8);margin:0;padding:0;list-style:none}
.chk__l label{display:grid;grid-template-columns:28px 1fr;gap:var(--s3);padding:var(--s4) 0;border-top:1px solid var(--color-border);cursor:pointer}
.chk__l input{position:absolute;opacity:0;pointer-events:none}
.chk__box{position:relative;width:18px;height:18px;margin-top:2px;box-shadow:inset 0 0 0 1.5px var(--k-cielo);border-radius:50%;transition:background-color var(--m-fast) var(--e-out)}
.chk__l li:nth-child(even) .chk__box{border-radius:0;box-shadow:inset 0 0 0 1.5px var(--k-salmon)}
.chk__l input:checked + .chk__box{background:var(--k-cielo)}
.chk__l li:nth-child(even) input:checked + .chk__box{background:var(--k-salmon)}
.chk__l input:checked + .chk__box::after{content:"";position:absolute;left:6px;top:3px;width:4px;height:8px;border:solid var(--k-blanco);border-width:0 1.6px 1.6px 0;transform:rotate(45deg)}
.chk__l input:focus-visible + .chk__box{outline:2px solid var(--k-noche);outline-offset:2px}
.chk__l label > span:last-child{font-size:13.5px;line-height:1.5;color:var(--color-text-2);transition:color var(--m-fast)}
.chk__l label b{display:block;font-size:15px;font-weight:500;color:var(--color-text)}
.chk__l input:checked ~ span:last-child,.chk__l input:checked ~ span:last-child b{color:var(--color-text-3)}
@media(max-width:760px){.chk__l{grid-template-columns:1fr}}
.rb b,.rb span{color:inherit!important}
.rh--w::before,.rh--d::before{content:"";position:absolute;left:14%;top:16%;width:46%;height:6%;background:var(--k-gris-2,#C7C8CB)}
.rh--d::after{top:34%}
.aib__code pre{padding:var(--s6) var(--s6) var(--s8);font-size:12.5px;line-height:1.75}
/* ════ Ronda 25 ════ */
.grad--mediodia{background-image:url('../assets/img/degradado-mediodia.jpg');background-size:cover;background-position:center;background-color:#8FA8E0}
.acar{grid-auto-columns:calc((100% - 3 * var(--s2)) / 4);overflow-y:hidden;overscroll-behavior-x:contain;align-items:stretch}
@media(max-width:1100px){.acar{grid-auto-columns:calc((100% - 2 * var(--s2)) / 3)}}
@media(max-width:900px){.acar{grid-auto-columns:82%}}
/* 10.5 y 9.7 · el filtro va debajo de la búsqueda, discreto, y nunca mueve la barra */
.icat__bar{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"q n" "f f";align-items:center;column-gap:var(--s4);row-gap:6px}
.icat__bar .icat__q{grid-area:q}
.icat__bar .icat__count{grid-area:n}
.icat__bar .fpop{grid-area:f;justify-self:start}
.fpop__btn{height:auto;padding:4px 2px;gap:6px;border-radius:0;background:none!important;box-shadow:none!important;font-size:12.5px;font-weight:500;color:var(--color-text-3)}
.fpop__btn::before{content:"Filtrar";color:var(--color-text-3)}
.fpop__btn .fpop__val{color:var(--color-text);text-decoration:underline;text-decoration-color:var(--k-cielo);text-underline-offset:3px}
.fpop__btn:hover,.fpop__btn[aria-expanded="true"]{background:none;color:var(--color-text)}
.fpop__btn svg{order:-1;width:14px;height:14px}
.fpop__panel{top:calc(100% + 4px)}
/* 9.7 · galería en retícula ordenada: misma proporción, filas alineadas */
.gal__grid{columns:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4) var(--s3)}
.gph{margin:0}
.gph__img,.gph--h .gph__img{aspect-ratio:4/5}
.gph__meta{padding:var(--s3) 0 0}
@media(max-width:900px){.gal__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 9.6 · texturas en carrusel */
#patrones .ed__sub{position:relative}
.texs__nav{position:static;justify-content:flex-end;margin:var(--s6) 0 var(--s3)}
.texs--car{display:grid;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:calc((100% - 2 * var(--s3)) / 3);gap:var(--s3);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;margin-top:0}
.texs--car::-webkit-scrollbar{display:none}
.texs--car > *{scroll-snap-align:start}
@media(max-width:760px){.texs--car{grid-auto-columns:78%}}

/* ════ Ronda 25 · Capítulo 18 ════ */
:root{
  --sk-noche:var(--sky-noche);
  --sk-alba:radial-gradient(60% 40% at 30% 100%,rgba(233,157,158,.75) 0%,rgba(233,157,158,0) 72%),linear-gradient(180deg,#10122A 0%,#1F2C5C 45%,#4D5590 80%,#8D6F9C 100%);
  --sk-amanecer:radial-gradient(55% 50% at 86% 104%,#FFCE49 0%,rgba(255,206,73,0) 70%),radial-gradient(50% 46% at 16% 104%,rgba(233,157,158,.9) 0%,rgba(233,157,158,0) 72%),linear-gradient(180deg,#22336A 0%,#3D6BAF 58%,#7D95CE 100%);
  --sk-dia:radial-gradient(40% 50% at 80% 24%,rgba(255,255,255,.75) 0%,rgba(255,255,255,0) 70%),linear-gradient(180deg,#C4DBF0 0%,#ACC8EA 60%,#8FB4DC 100%);
  --sk-atardecer:radial-gradient(46% 40% at 26% 104%,#F5A742 0%,rgba(245,167,66,0) 72%),linear-gradient(180deg,#1E2550 0%,#3D3F7A 42%,#8E5C86 76%,#D9714A 100%);
}
/* Lista corta con viñetas de marca */
.blist{display:grid;row-gap:8px;margin:var(--s2) 0 0;padding:0;list-style:none}
.blist li{display:grid;grid-template-columns:14px 1fr;gap:12px;align-items:start;font-size:15px;line-height:1.5;color:var(--color-text-2)}
.blist svg{width:12px;height:12px;margin-top:5px;color:var(--vc,var(--k-cielo))}
/* 18.2 · Método: riel que se llena al bajar */
.mtd{margin-top:var(--s10)}
.mtd__phase{display:none}
.mtd__l{position:relative;margin:0;padding:0;list-style:none}
.mtd__rail{position:absolute;left:27px;top:28px;bottom:28px;width:1px;background:var(--color-border-strong)}
.mtd__rail i{display:block;width:100%;height:var(--p,0%);background:var(--k-noche);transition:height .15s linear}
.mtd__s{display:grid;grid-template-columns:56px minmax(0,1fr);gap:var(--s6);padding:var(--s4) 0}
.mtd__n{position:relative;z-index:1;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--color-bg);box-shadow:inset 0 0 0 1px var(--color-border-strong);font-family:var(--font-display);font-size:22px;color:var(--color-text-3);transition:background-color .4s var(--e-out),color .4s var(--e-out),box-shadow .4s var(--e-out)}
.mtd__s.is-design .mtd__n{box-shadow:inset 0 0 0 1px var(--k-cielo)}
.mtd__s.is-on .mtd__n{background:var(--k-noche);color:var(--k-blanco);box-shadow:none}
.mtd__s.is-design.is-on .mtd__n{background:var(--k-cielo);color:var(--k-noche)}
.mtd__s > div{padding-top:14px}
.mtd__t{margin:0 0 6px;font-size:20px;font-weight:500;letter-spacing:-.01em;color:var(--color-text)}
.mtd__s p:not(.mtd__t){margin:0;max-width:58ch;font-size:15px;line-height:1.55;color:var(--color-text-2)}
.mtd__s a{color:inherit;text-decoration:underline;text-decoration-color:var(--k-cielo);text-underline-offset:3px}
.mtd__gate{position:relative;z-index:1;display:flex;align-items:center;gap:var(--s4);margin:var(--s2) 0;padding:var(--s3) 0}
.mtd__gate svg{width:20px;height:20px;margin-left:18px;background:var(--color-bg)}
.mtd__gate span{font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--k-cielo-700)}
.mtd__gate::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--k-cielo),transparent)}
.pvs{display:grid;grid-template-columns:1fr 1fr;gap:var(--s8);margin-top:var(--s10)}
.pvs > div{padding-top:var(--s4);border-top:1px solid var(--color-border-strong)}
.pvs p{margin:0}
.pvs p + p{margin-top:var(--s2);font-size:15px;line-height:1.55;color:var(--color-text-2)}
.pvs a{color:inherit;text-decoration:underline;text-decoration-color:var(--k-cielo);text-underline-offset:3px}
@media(max-width:760px){.pvs{grid-template-columns:1fr}}
/* 18.3 · Principios y fórmula */
.prin{margin-top:var(--s10)}
.prin__r{display:grid;grid-template-columns:48px minmax(0,1fr) 200px;grid-template-areas:"n t a" "n d a";column-gap:var(--s6);row-gap:6px;padding:var(--s6) 0;border-top:1px solid var(--color-border)}
.prin__r p{margin:0}
.prin__n{grid-area:n;font-family:var(--font-display);font-size:15px;color:var(--color-text-3)}
.prin__t{grid-area:t;font-size:20px;font-weight:500;letter-spacing:-.01em}
.prin__d{grid-area:d;max-width:58ch;font-size:15px;line-height:1.55;color:var(--color-text-2)}
.prin__a{grid-area:a;font-size:12px;color:var(--color-text-3)}
.prin__a b{display:block;font-size:14px;font-weight:500;color:var(--color-text)}
@media(max-width:760px){.prin__r{grid-template-columns:36px 1fr;grid-template-areas:"n t" "n d" "n a"}}
.fml{margin-top:var(--s10);padding:var(--s8);background:var(--k-puro);border-radius:var(--r-card)}
.fml p{margin:0}
.fml__f{margin-top:var(--s4)!important;font-size:clamp(22px,2.6vw,34px);font-weight:500;line-height:1.5;letter-spacing:-.015em}
.fml__w{margin:0 .3em;color:var(--color-text-3)}
.fml__chip{padding:0 .2em;cursor:default;outline:none;transition:background-color .3s var(--e-out)}
[data-part="1"]{--pc:#C6D5EC;--pch:#ACC3E7}
[data-part="2"]{--pc:rgba(233,157,158,.38);--pch:rgba(233,157,158,.7)}
[data-part="3"]{--pc:#E0E7F1;--pch:#C6D5EC}
[data-part="4"]{--pc:#E0E1E5;--pch:#C7C8CB}
.fml__chip{background:var(--pc)}
.fml__chip.is-hot,.fml__chip:hover,.fml__chip:focus-visible{background:var(--pch)}
.fml__tabs{margin-top:var(--s8);padding:0}
.fml__ex{margin-top:var(--s4)!important;font-size:20px;line-height:1.6;color:var(--color-text);animation:fadeUp .5s var(--e-out) both}
.fml__ex[hidden]{display:none}
.fml__ex span{box-shadow:inset 0 -.42em 0 var(--pc);transition:box-shadow .3s var(--e-out)}
.fml__ex span.is-hot{box-shadow:inset 0 -1.3em 0 var(--pch)}
.fml__cap{margin-top:var(--s4)!important;font-size:12px;color:var(--color-text-3)}
/* 18.4 · El arco Keyons: el cielo avanza con la historia */
.arc6__sky--noche{background:var(--sk-noche)}
.arc6__sky--alba{background:var(--sk-alba)}
.arc6__sky--amanecer{background:var(--sk-amanecer)}
.arc6__sky--dia{background:var(--sk-dia)}
.arc6__sky--atardecer{background:var(--sk-atardecer)}
.arc6{position:relative;overflow:hidden;isolation:isolate;background:var(--k-noche);--ink:#F4F4F4;color:var(--ink)}
.arc6[data-ink="d"]{--ink:#10122A}
.arc6 > .arc6__sky{position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity 1s var(--e-out)}
.arc6 > .arc6__sky.is-on{opacity:1}
.arc6 .story__reel span,.arc6 .story__t,.arc6 .story__k,.arc6 .story__d{color:var(--ink);transition:color .8s var(--e-out)}
.arc6 .story__k,.arc6 .story__d{opacity:.78}
.arc6 .story__reel span{opacity:.22}
.arc6 .story__reel span.is-on{opacity:1}
.arc6 .btn-icon{color:var(--ink);background:transparent;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink) 40%,transparent)}
.arc6 .btn-icon:hover{background:color-mix(in srgb,var(--ink) 12%,transparent)}
.arc6 .story__arc{color:var(--ink)}
.arc6 .story__pt circle:nth-child(2){fill:currentColor;opacity:.45}
.arc6 .story__pt.is-on circle:nth-child(2){opacity:1}
.arc6 .story__pt text{fill:currentColor;opacity:.7}
.arc6 .story__pt.is-on text{opacity:1}
.sky4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);margin-top:var(--s5)}
.sky4 figure{margin:0}
.sky4 .arc6__sky{display:block;aspect-ratio:4/3}
.sky4 figure:first-child .arc6__sky{border-radius:0 var(--r-component) var(--r-component) 0}
.sky4 figure:not(:first-child):not(:last-child) .arc6__sky{border-radius:var(--r-component)}
.sky4 figure:last-child .arc6__sky{border-radius:var(--r-component) 0 0 var(--r-component)}
.sky4 figcaption{display:grid;row-gap:2px;margin-top:var(--s3);font-size:13px;line-height:1.45;color:var(--color-text-2)}
.sky4 figcaption b{font-size:15px;font-weight:500;color:var(--color-text)}
@media(max-width:760px){.sky4{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 18.5 · Reglas de pantalla */
.rcards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap);margin-top:var(--s10)}
.rcard{display:flex;flex-direction:column;padding:var(--s8);background:var(--k-puro);border-radius:var(--r-card)}
.rcard:nth-child(1){border-top-left-radius:0}
.rcard:nth-child(2){border-top-right-radius:0}
.rcard:nth-last-child(2){border-bottom-left-radius:0}
.rcard:last-child{border-bottom-right-radius:0}
.rcard p{margin:0}
.rcard__n{font-family:var(--font-display);font-size:15px;color:var(--color-text-3)}
.rcard__t{margin:var(--s3) 0 var(--s3);font-size:26px;font-weight:500;line-height:1.12;letter-spacing:-.02em}
.rcard__d{font-size:15px;line-height:1.55;color:var(--color-text-2)}
.rcard__ab{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5);margin-top:auto;padding-top:var(--s6)}
.rcard__ab p{padding-top:var(--s4);border-top:1px solid var(--color-border);font-size:15px;line-height:1.45;font-weight:500;color:var(--color-text)}
.rcard__ab .paren{display:block;margin-bottom:6px;font-size:12px;font-weight:400;color:var(--color-text-3)}
.rcard__ab s{font-weight:400;color:var(--color-text-3);text-decoration-color:var(--k-salmon);text-decoration-thickness:1.5px}
.rcard__src{margin-top:var(--s4)!important;font-size:12px;color:var(--color-text-3)}
@media(max-width:900px){.rcards{grid-template-columns:1fr}.rcard:nth-child(n){border-radius:var(--r-card)}.rcard:first-child{border-radius:0 0 var(--r-card) var(--r-card)}.rcard:last-child{border-radius:var(--r-card) var(--r-card) 0 0}}
/* 18.6 · Límites de texto */
.lims{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--s8);margin-top:var(--s10)}
.lim{padding:var(--s6) 0;border-top:1px solid var(--color-border-strong)}
.lim p{margin:0}
.lim__n{font-family:var(--font-display);font-size:76px;font-weight:400;line-height:1;letter-spacing:-.04em;color:var(--color-text)}
.lim__u{margin-top:6px!important;font-size:12px;color:var(--color-text-3)}
.lim__k{margin-top:var(--s4)!important;font-size:17px;font-weight:500}
.lim__d{margin-top:4px!important;font-size:14px;line-height:1.5;color:var(--color-text-2)}
@media(max-width:760px){.lims{grid-template-columns:repeat(2,minmax(0,1fr))}.lim__n{font-size:56px}}
/* 18.7 · Notas del presentador */
.snotes{margin-top:var(--s10);padding:var(--s4) var(--s8) var(--s6);background:var(--k-puro);border-radius:var(--r-card)}
.snotes__h{display:grid;grid-template-columns:120px 1fr 1.2fr;gap:var(--s6);padding:var(--s3) 0}
.snotes__h span:first-child{grid-column:1/3}
.snotes__r{display:grid;grid-template-columns:120px 1fr 1.2fr;gap:var(--s6);padding:var(--s4) 0;border-top:1px solid var(--color-border);align-items:baseline}
.snotes__r p{margin:0}
.snotes__r b{font-size:14px;font-weight:600}
.snotes__d{font-size:14px;line-height:1.5;color:var(--color-text-3)}
.snotes__e{padding-left:var(--s4);border-left:2px solid var(--k-cielo);font-size:15px;line-height:1.55;color:var(--color-text)}
@media(max-width:760px){.snotes{padding:var(--s4)}.snotes__h{display:none}.snotes__r{grid-template-columns:1fr;gap:6px}}
/* 18.8 · Voz en la sala */
.rw__k{display:grid;row-gap:4px;margin:0}
.rw__tag{font-size:11px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--color-text-3)}
.rw__k b{font-size:15px;font-weight:500;color:var(--color-text)}
.rw__k span:last-child{font-size:13px;line-height:1.5;color:var(--color-text-2)}
.rw__lbl{display:block;margin-bottom:4px;font-size:11px;font-weight:400;color:var(--color-text-3)}
.rw__src{display:block;margin-top:8px;font-size:12px;font-weight:400;line-height:1.45;color:var(--color-text-3)}
.rw__r{align-items:start}
/* 18.9 · Tabla de formato */
.ptbl{margin-top:var(--s8)}
.ptbl__r{display:grid;grid-template-columns:150px 260px minmax(0,1fr);gap:var(--s6);padding:var(--s4) 0;border-top:1px solid var(--color-border);align-items:baseline}
.ptbl__r span:first-child{font-size:13px;color:var(--color-text-3)}
.ptbl__r b{font-size:16px;font-weight:500}
.ptbl__r span:last-child{font-size:14px;line-height:1.5;color:var(--color-text-2)}
@media(max-width:760px){.ptbl__r{grid-template-columns:1fr;gap:4px}}
/* 18.11 · Contraste medido */
.ctab{margin-top:var(--s10)}
.ctab__r{display:grid;grid-template-columns:140px 190px 130px 130px minmax(0,1fr);gap:var(--s4);padding:var(--s4) 0;border-top:1px solid var(--color-border);align-items:center}
.ctab__h{padding-top:0;border-top:0;font-size:12px;color:var(--color-text-3)}
.ctab__r > b{font-size:14px;font-weight:500}
.ctab__c{display:flex;align-items:center;gap:12px;font-size:14px}
.ctab__c i{flex:none;width:28px;height:28px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--color-border-strong)}
.ctab__c > span{display:grid}
.ctab__c em{font-style:normal;font-size:12px;color:var(--color-text-3)}
.ctab__u{font-size:13px;line-height:1.5;color:var(--color-text-2)}
.cx{display:inline-flex;align-items:baseline;gap:6px;padding:5px 10px;border-radius:var(--r-pill);font-size:11px;color:var(--k-noche)}
.cx b{font-size:13px;font-weight:600;font-variant-numeric:tabular-nums}
.cx--ok{background:#D5E0D2}.cx--lg{background:#F4E8C1}.cx--no{background:#F0D0CB}.cx--na{padding:0;color:var(--color-text-3)}
.ctab__key{display:flex;flex-wrap:wrap;gap:8px;margin-top:var(--s5)}
@media(max-width:1000px){.ctab__h{display:none}.ctab__r{grid-template-columns:1fr 1fr;row-gap:8px}.ctab__r > b,.ctab__u{grid-column:1/-1}}
/* 18.12 · Ritmo con los cielos del arco */
.rh--sn{background:var(--sk-noche);box-shadow:none}
.rh--sp{background:var(--sk-alba);box-shadow:none}
.rh--sa{background:var(--sk-amanecer);box-shadow:none}
.rh--sd{background:var(--sk-dia);box-shadow:none}
.rh--st{background:var(--sk-atardecer);box-shadow:none}
.rb--s{background:linear-gradient(90deg,#17234F 0%,#4D5590 30%,#3D6BAF 55%,#8E5C86 80%,#D9714A 100%);color:var(--k-blanco)}
/* 18.13 · Riesgo y estado */
.lvl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);margin-top:var(--s10)}
.lvl__s{padding:var(--s6);background:var(--k-puro);border-radius:var(--r-card);box-shadow:inset 0 4px 0 var(--bg)}
.lvl__s:first-child{border-radius:0 var(--r-card) var(--r-card) 0}
.lvl__s:last-child{border-radius:var(--r-card) 0 0 var(--r-card)}
.lvl__s p{margin:0}
.lvl__hex{margin-top:var(--s5)!important;font-size:12px;color:var(--color-text-3)}
.lvl__d{margin-top:6px!important;font-size:14px;line-height:1.5;color:var(--color-text-2)}
.lvl__st{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:var(--s8)}
.lvl__st .paren{margin-right:var(--s3);color:var(--color-text-3)}
.rskd{margin:var(--s10) 0 0}
.rskd__sl{position:relative;aspect-ratio:16/9;container-type:inline-size;padding:4.2cqw 5cqw;background:var(--k-blanco);box-shadow:0 0 0 1px var(--color-border),0 10px 28px -18px rgba(16,18,42,.35)}
.rskd__sl p{margin:0}
.rskd__t{font-size:3.4cqw;font-weight:500;line-height:1.12;letter-spacing:-.02em}
.rskd__l{margin-top:3.4cqw}
.rskd__l p{display:flex;align-items:center;justify-content:space-between;padding:1.25cqw 0;border-top:1px solid var(--color-border);font-size:1.7cqw;color:var(--color-text-2)}
.rskd__l .badge{gap:.6cqw;padding:.7cqw 1.3cqw .7cqw 1cqw;font-size:1.35cqw}
.rskd__l .badge svg{width:1.5cqw;height:1.5cqw}
.rskd figcaption{margin-top:var(--s3);font-size:12px;color:var(--color-text-3)}
@media(max-width:900px){.lvl{grid-template-columns:repeat(2,minmax(0,1fr))}.lvl__s:nth-child(n){border-radius:var(--r-card)}}
/* 18.14 · Espacios para los ejemplos de imagen */
.sl--ph{background:repeating-linear-gradient(135deg,transparent 0 10px,rgba(16,18,42,.04) 10px 11px),var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border-strong)}
.sl--ph span{inset:0;display:grid;place-items:center;padding:0 8cqw;font-size:1.6cqw;text-align:center;color:var(--color-text-3)}
/* 18.16 · Plantillas: lista con descarga */
.tlist{margin-top:var(--s10)}
.tlist__r{display:grid;grid-template-columns:48px minmax(0,1fr) 220px auto;gap:var(--s6);align-items:center;padding:var(--s6) 0;border-top:1px solid var(--color-border)}
.tlist__r:last-child{border-bottom:1px solid var(--color-border)}
.tlist__r p{margin:0}
.tlist__n{font-family:var(--font-display);font-size:15px;color:var(--color-text-3)}
.tlist__t{font-size:22px;font-weight:500;letter-spacing:-.015em}
.tlist__d{margin-top:4px!important;font-size:14px;line-height:1.5;color:var(--color-text-2)}
.tlist__m{font-size:12px;line-height:1.6;color:var(--color-text-3)}
.tlist .btn{gap:8px}
.tlist .btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:760px){.tlist__r{grid-template-columns:36px 1fr;row-gap:var(--s3)}.tlist__m,.tlist .btn{grid-column:2}.tlist .btn{justify-self:start}}
/* 18.17 · Lista: todas las casillas son círculos */
.chk__l li:nth-child(even) .chk__box{border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--k-cielo)}
.chk__l li:nth-child(even) input:checked + .chk__box{background:var(--k-cielo)}
.fml__chip{white-space:nowrap}
.rcards{grid-template-columns:1fr}
.rcard{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);grid-template-areas:"n ab" "t ab" "d ab" "x src";column-gap:var(--s10);align-content:start}
.rcard:nth-child(n){border-radius:var(--r-card)}
.rcard:first-child{border-radius:0 0 var(--r-card) var(--r-card)}
.rcard:last-child{border-radius:var(--r-card) var(--r-card) 0 0}
.rcard__n{grid-area:n}.rcard__t{grid-area:t}.rcard__d{grid-area:d}
.rcard__ab{grid-area:ab;margin-top:0;padding-top:0;align-self:start}
.rcard__ab p{padding-top:0;border-top:0;padding-left:var(--s4);border-left:1px solid var(--color-border-strong)}
.rcard__ab p:last-child{border-left-color:var(--k-cielo)}
.rcard__src{grid-area:src;padding-left:var(--s4)}
@media(max-width:900px){.rcard{grid-template-columns:1fr;grid-template-areas:"n" "t" "d" "ab" "src"}.rcard__ab{margin-top:var(--s5)}}
.rskd{display:block;width:100%}
.rskd__sl{width:100%;box-sizing:border-box}
.lvl__s{box-shadow:none}
/* ════ Ronda 26 ════ */
.chart .ph-k{font-size:7.5px;font-weight:600;letter-spacing:.12em;fill:var(--k-noche)}
.chart .ph-t{font-size:13px;font-weight:400;fill:var(--k-noche)}
.chart .ph-v{font-size:22px;font-weight:400;letter-spacing:-.01em;fill:var(--k-noche)}
.chart .ph-n{font-family:var(--font-display);font-size:42px;font-weight:300;letter-spacing:-.02em;fill:var(--k-noche)}
.fpop__panel > button{border-radius:var(--r-pill)}
.fpop__btn{font-size:13px}
.fpop__btn .fpop__val{font-weight:600;color:var(--k-noche);text-decoration-thickness:2px;text-underline-offset:5px}

/* ════ Ronda 26 · Capítulo 18 rediagramado ════ */
.chapter--pres .ed__label{position:static}
.ed--full .ed__wide{grid-column:1/-1;margin-top:var(--s12);min-width:0}
.ed--full .ed__after{grid-column:2}
.ed--full .ed__after .ed__close{margin-top:var(--s12)}
.ed--full .ed__lead{max-width:640px}
@media(max-width:1000px){.ed--full .ed__wide,.ed--full .ed__after{grid-column:auto}.ed--full .ed__wide{margin-top:var(--s4)}}
/* 18.1 */
.ed__wide .ptype{margin-top:0}
.ptype__bar{display:flex;align-items:center;gap:var(--s10);flex-wrap:wrap}
.ptype__bar .ptype__scale{flex:1;min-width:260px;margin-top:0}
.ed__wide .ptype__panel{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:var(--s12);align-items:center}
.ed__wide .ptype__spec div{grid-template-columns:110px 1fr;padding:16px 0}
.ed__wide .ptype__spec dd{font-size:16px}
/* 18.2 */
.mt2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:var(--s12)}
.mt2__col ol{margin:0;padding:0;list-style:none}
.mt2__col--d{padding-left:var(--s12);border-left:1px solid var(--color-border-strong)}
.mt2__h{display:flex;align-items:center;gap:10px;margin:0 0 var(--s4);font-size:15px;font-weight:500;color:var(--color-text)}
.mt2__h .paren{color:var(--color-text-3);font-weight:400}
.mt2__h svg{width:18px;height:18px;flex:none}
.mt2__s{display:grid;grid-template-columns:52px minmax(0,1fr);gap:var(--s4);padding:var(--s5) 0;border-top:1px solid var(--color-border)}
.mt2__n{font-family:var(--font-display);font-size:34px;font-weight:300;line-height:1;letter-spacing:-.03em;color:var(--color-text-title-muted)}
.mt2__col--d .mt2__n{color:var(--k-cielo)}
.mt2__t{margin:2px 0 6px;font-size:18px;font-weight:500;letter-spacing:-.01em}
.mt2__s p:not(.mt2__t){margin:0;font-size:15px;line-height:1.55;color:var(--color-text-2)}
.mt2__s a{color:inherit;text-decoration:underline;text-decoration-color:var(--k-cielo);text-underline-offset:3px}
.mt2__s .blist{margin-top:var(--s2)}
.mt2__note{margin-top:var(--s8);padding:var(--s6);background:var(--k-puro);border-radius:var(--r-card)}
.mt2__note p{margin:0}
.mt2__note p + p{margin-top:var(--s2);font-size:15px;line-height:1.55;color:var(--color-text-2)}
@media(max-width:900px){.mt2{grid-template-columns:1fr}.mt2__col--d{padding-left:0;border-left:0;margin-top:var(--s10)}}
/* 18.3 */
.ed__wide .prin{margin-top:0}
.ed__wide .prin__r{grid-template-columns:56px minmax(0,1fr) minmax(0,1.3fr) 190px;grid-template-areas:"n t d a";align-items:baseline;column-gap:var(--s8)}
.ed__wide .prin__t{font-size:19px}
@media(max-width:1100px){.ed__wide .prin__r{grid-template-columns:44px 1fr;grid-template-areas:"n t" "n d" "n a"}}
.fml__top{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);flex-wrap:wrap}
.fml__top .fml__tabs{margin:0}
.ed__wide .fml{margin-top:var(--s12)}
/* 18.4 */
.ed__wide .story{margin-top:0}
.sky4{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:var(--s10)}
.sky4__h{grid-column:1/-1;margin:0;color:var(--color-text-3)}
/* 18.5 */
.wr2__tabs{margin:0 0 var(--s5);padding:0}
.wr2__set[hidden]{display:none}
.wr2__set{animation:fadeUp .5s var(--e-out) both}
.wr2__r{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,1fr);column-gap:var(--s8);padding:var(--s6) 0;border-top:1px solid var(--color-border);align-items:start}
.wr2__r:last-child{border-bottom:1px solid var(--color-border)}
.wr2__r p{margin:0}
.wr2__k{display:grid;grid-template-columns:36px 1fr;column-gap:var(--s3);row-gap:4px}
.wr2__n{grid-row:span 2;font-family:var(--font-display);font-size:15px;color:var(--color-text-3);padding-top:3px}
.wr2__t{font-size:18px;font-weight:500;letter-spacing:-.01em;line-height:1.3}
.wr2__d{font-size:14px;line-height:1.5;color:var(--color-text-2)}
.wr2__no,.wr2__si{font-size:16px;line-height:1.45}
.wr2__r .paren{display:block;margin-bottom:6px;font-size:12px;color:var(--color-text-3)}
.wr2__no s{color:var(--color-text-3);text-decoration-color:var(--k-salmon);text-decoration-thickness:1.5px}
.wr2__si{font-weight:500;color:var(--color-text)}
.wr2__src{display:block;margin-top:8px;font-size:12px;font-weight:400;color:var(--color-text-3)}
@media(max-width:900px){.wr2__r{grid-template-columns:1fr;row-gap:var(--s4)}}
/* 18.6 */
.ed__wide .lims{margin-top:0;grid-template-columns:repeat(6,minmax(0,1fr));column-gap:var(--s5)}
.ed__wide .lim__n{font-size:68px}
@media(max-width:1250px){.ed__wide .lims{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.ed__wide .lims{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ed__wide .snotes{margin-top:var(--s12)}
.snotes__h,.snotes__r{grid-template-columns:120px minmax(0,.85fr) minmax(0,1.2fr)}
.snotes__h span:first-child{grid-column:1/3}
/* 18.7 */
.lz{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:var(--s12);align-items:start}
.lz__fig .pcanvas{width:100%;height:auto}
.lz__r{display:grid;grid-template-columns:110px 1fr;column-gap:var(--s4);row-gap:2px;padding:12px 0;border-top:1px solid var(--color-border)}
.lz__r:last-child{border-bottom:1px solid var(--color-border)}
.lz__r span{grid-row:span 2;font-size:13px;color:var(--color-text-3)}
.lz__r b{font-size:16px;font-weight:500}
.lz__r p{margin:0;font-size:13px;line-height:1.5;color:var(--color-text-2)}
@media(max-width:900px){.lz{grid-template-columns:1fr}}
/* 18.8 */
.ed__wide .tlad{margin-top:0}
.ed__wide .tlad__r{grid-template-columns:minmax(0,1fr) 300px}
/* 18.9 */
.ed__wide .ctab{margin-top:0}
.ctab__r{grid-template-columns:240px 170px 170px minmax(0,1fr)}
@media(max-width:1000px){.ctab__r{grid-template-columns:1fr 1fr}}
/* 18.10 */
.ed__wide .rhythm{margin-top:0}
.rhythm__top{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);flex-wrap:wrap;margin-bottom:var(--s5)}
.rhythm__top .rhythm__tabs{margin:0}
.rhythm__top .rhythm__cap{margin:0;min-height:0}
.rhythm__strip + .rhythm__strip,.rhythm__strip{margin-bottom:var(--s8)}
/* 18.11 */
.rsk{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:var(--s12);align-items:start}
.rsk__i{display:grid;grid-template-columns:120px 1fr;column-gap:var(--s4);row-gap:2px;align-items:center;padding:14px 0;border-top:1px solid var(--color-border)}
.rsk__i .badge{grid-row:span 2;justify-self:start}
.rsk__i p{margin:0}
.rsk__hex{font-size:12px;color:var(--color-text-3)}
.rsk__d{font-size:14px;line-height:1.45;color:var(--color-text-2)}
.rsk__st{padding-top:var(--s5);border-top:1px solid var(--color-border)}
.rsk__st p{margin:0 0 10px;color:var(--color-text-3)}
.rsk__st div{display:flex;flex-wrap:wrap;gap:8px}
.rsk .rskd{margin:0}
@media(max-width:1000px){.rsk{grid-template-columns:1fr}}
/* 18.12 */
.imgx{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:var(--s12);align-items:start}
.imgx__g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s8) var(--s5)}
.imgx__g .slfig{margin:0}
.imgx__r > .paren{margin:0 0 var(--s3);color:var(--color-text-3)}
.imgx__l{margin:0;padding:0;list-style:none}
.imgx__l li{display:grid;grid-template-columns:16px 1fr;gap:12px;padding:14px 0;border-top:1px solid var(--color-border)}
.imgx__l svg{width:12px;height:12px;margin-top:5px;color:var(--vc,var(--k-cielo))}
.imgx__l p{margin:0;font-size:14px;line-height:1.5;color:var(--color-text-2)}
.imgx__l b{display:block;font-size:16px;font-weight:500;color:var(--color-text)}
@media(max-width:1000px){.imgx{grid-template-columns:1fr}}
/* 18.13 y 18.14 */
.ed__wide .tlist,.ed__wide .chk{margin-top:0}
.fml__w--c{margin-left:0}
.ed__wide .lim__u{min-height:2.9em;line-height:1.45}
/* Viento: cielo con paralaje, nubes empujadas por el gesto y sombra interior que acompaña */
.has-wind{background-color:transparent}
.wind__sky{position:absolute;inset:-4%;z-index:-1;background:inherit;will-change:transform;pointer-events:none}
.wind__clouds{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.wind__lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.wind__shade{position:absolute;inset:0;z-index:2;pointer-events:none;box-shadow:inset 0 0 70px rgba(16,18,42,.16)}
.hero .wind__shade{z-index:25}
.hero.has-wind .hero__glass{background-image:none}
body .portal .portal__arcs{animation:none!important;--ripple:0px;will-change:transform}
.portal.has-wind .portal__txt{z-index:3}
/* 9.5 · cinco ventanas; la quinta es una estrella sobre Galaxia */
.wins--5{grid-template-columns:repeat(5,minmax(0,1fr))}
.win--star .win__in{clip-path:polygon(50.00% 23.00%,51.13% 26.65%,52.60% 30.05%,54.41% 33.19%,56.56% 36.08%,59.05% 38.71%,61.88% 41.09%,65.05% 43.21%,68.56% 45.08%,72.41% 46.69%,76.60% 48.05%,81.13% 49.15%,86.00% 50.00%,81.13% 50.85%,76.60% 51.95%,72.41% 53.31%,68.56% 54.92%,65.05% 56.79%,61.88% 58.91%,59.05% 61.29%,56.56% 63.92%,54.41% 66.81%,52.60% 69.95%,51.13% 73.35%,50.00% 77.00%,48.87% 73.35%,47.40% 69.95%,45.59% 66.81%,43.44% 63.92%,40.95% 61.29%,38.12% 58.91%,34.95% 56.79%,31.44% 54.92%,27.59% 53.31%,23.40% 51.95%,18.87% 50.85%,14.00% 50.00%,18.87% 49.15%,23.40% 48.05%,27.59% 46.69%,31.44% 45.08%,34.95% 43.21%,38.12% 41.09%,40.95% 38.71%,43.44% 36.08%,45.59% 33.19%,47.40% 30.05%,48.87% 26.65%)}
.win--star .win__edge{inset:0;box-shadow:none;clip-path:polygon(50.00% 23.00%,51.13% 26.65%,52.60% 30.05%,54.41% 33.19%,56.56% 36.08%,59.05% 38.71%,61.88% 41.09%,65.05% 43.21%,68.56% 45.08%,72.41% 46.69%,76.60% 48.05%,81.13% 49.15%,86.00% 50.00%,81.13% 50.85%,76.60% 51.95%,72.41% 53.31%,68.56% 54.92%,65.05% 56.79%,61.88% 58.91%,59.05% 61.29%,56.56% 63.92%,54.41% 66.81%,52.60% 69.95%,51.13% 73.35%,50.00% 77.00%,48.87% 73.35%,47.40% 69.95%,45.59% 66.81%,43.44% 63.92%,40.95% 61.29%,38.12% 58.91%,34.95% 56.79%,31.44% 54.92%,27.59% 53.31%,23.40% 51.95%,18.87% 50.85%,14.00% 50.00%,18.87% 49.15%,23.40% 48.05%,27.59% 46.69%,31.44% 45.08%,34.95% 43.21%,38.12% 41.09%,40.95% 38.71%,43.44% 36.08%,45.59% 33.19%,47.40% 30.05%,48.87% 26.65%);background:linear-gradient(180deg,rgba(16,18,42,.28) 0%,rgba(16,18,42,0) 38%),linear-gradient(0deg,rgba(255,255,255,.18) 0%,rgba(255,255,255,0) 22%)}
@media(max-width:1100px){.wins--5{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* 9.6 · patrones propios y filtro de texturas */
.pats{grid-template-columns:repeat(3,minmax(0,1fr))}
.pat--img{padding:0;overflow:hidden;background:none}
.pat--img img{display:block;width:100%;height:100%;object-fit:cover}
.texf{margin-top:var(--s6)}
.texf__bar{display:flex;align-items:center;gap:var(--s4);flex-wrap:wrap;margin-bottom:var(--s4)}
.texf__chips{padding:0;margin:0}
.texf__q{flex:1;min-width:180px}
.texf .texs__nav{margin:0}
.tex[hidden]{display:none}
.tex__f{display:block;margin-bottom:2px;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--color-text-3)}
/* 9.7 · galería: collage editorial al inicio, retícula irregular para ver todas */
.gal__views{margin:var(--s5) 0 var(--s6);padding:0}
.gal .gph{position:relative;display:block;margin:0;cursor:zoom-in}
.gal .gph--v .gph__img{aspect-ratio:3/4}
.gal .gph--h .gph__img{aspect-ratio:4/3}
.gal .gph--c .gph__img{aspect-ratio:1/1}
.gal .gph__img{border-radius:6px;transition:transform .5s var(--e-out),filter .5s var(--e-out)}
.gal .gph:hover .gph__img{transform:none;filter:saturate(1.08)}
.gph__id{display:block;margin-top:6px;font-size:10px;font-weight:500;letter-spacing:.08em;color:var(--color-text-3)}
.gph__info{position:absolute;left:0;right:0;bottom:22px;display:grid;row-gap:2px;padding:28px 12px 10px;border-radius:0 0 6px 6px;background:linear-gradient(0deg,rgba(16,18,42,.82),rgba(16,18,42,0));
  font-size:11px;line-height:1.4;color:rgba(244,244,244,.82);text-align:left;opacity:0;transform:translateY(6px);transition:opacity .35s var(--e-out),transform .35s var(--e-out);pointer-events:none}
.gph__info b{font-size:12px;font-weight:600;color:var(--k-blanco)}
.gph:hover .gph__info,.gph:focus-visible .gph__info{opacity:1;transform:none}
.gph__img.is-ph em{padding:0 10px;text-align:center}
.gal__cap{display:none}
.gal[data-view="collage"] .gal__grid{position:relative;display:block;columns:auto;aspect-ratio:16/10;margin-top:var(--s4)}
.gal[data-view="collage"] .gph{position:absolute;left:var(--x);top:var(--y);width:var(--w)}
.gal[data-view="collage"] .gph--extra{display:none}
.gal[data-view="collage"] .gal__cap{position:absolute;left:39%;top:38%;width:16%;display:block;margin:0;font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;text-align:center;line-height:1.5;color:var(--color-text)}
.gal__cap span{font-weight:400;letter-spacing:.04em;color:var(--color-text-3)}
.gal[data-view="grid"] .gal__grid{display:block;columns:4;column-gap:var(--s3);aspect-ratio:auto}
.gal[data-view="grid"] .gph{width:100%;margin:0 0 var(--s3);break-inside:avoid}
.gal[data-view="grid"] .gph__id{display:none}
.gal[data-view="grid"] .gph__info{bottom:0}
.gph[hidden]{display:none!important}
@media(max-width:900px){.gal[data-view] .gal__grid{display:block;columns:2;aspect-ratio:auto}.gal[data-view] .gph{position:relative;left:auto;top:auto;width:100%;margin:0 0 var(--s3);break-inside:avoid}.gal[data-view] .gal__cap{display:none}}
@media(min-width:1001px){#fotografia .ed__label{position:static}#fotografia .gal{margin-left:calc(-200px - var(--s16))}}
.gal[data-view="grid"] .gal__grid{columns:5}@media(max-width:1200px){.gal[data-view="grid"] .gal__grid{columns:4}}
/* Cielo vivo: nubes calculadas y líneas que el viento curva */
.wind__clouds{position:absolute;left:-4%;top:-4%;width:108%;height:108%;pointer-events:none;will-change:transform}
.wind__shade{display:none}
.portal.has-wind .portal__arcs{background-image:none!important;transform:none!important}
.portal__arcs .wind__lines{position:absolute;inset:0;width:100%;height:100%}
.hero.has-wind .hero__glass{backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
/* Listas de pasos (.flow): números livianos sobre una línea fina, sin círculos */
.flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s8);max-width:none;margin-top:var(--s8);padding:0}
.flow::before{display:none}
.flow li{display:block;padding-top:var(--s5);border-top:1px solid var(--color-border-strong)}
.flow .flow__n,.flow li:last-child .flow__n{display:block;width:auto;height:auto;margin-bottom:var(--s4);padding:0;border-radius:0;background:none;box-shadow:none;font-family:var(--font-display);font-size:40px;font-weight:300;line-height:1;letter-spacing:-.03em;color:var(--color-text-title-muted)}
.flow li:last-child .flow__n{color:var(--k-cielo)}
.flow__q{padding-top:0;font-size:17px}
.flow__a{grid-column:auto;margin-top:6px}
@media(max-width:760px){.flow{grid-template-columns:1fr}}
/* Recursos y accesos desde los capítulos */
.goto{margin-top:var(--s8)}
.goto .btn{gap:10px}
.goto .btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.texs--grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s8) var(--s3);margin-top:var(--s5)}
.texs--muestra{margin-top:var(--s6)}
.texf--grid .texs--grid{margin-top:var(--s5)}
@media(max-width:900px){.texs--grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.pats--2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:720px}
.tlist__soon{justify-self:start;padding:8px 14px;border-radius:var(--r-pill);background:var(--k-gris-5);font-size:12.5px;color:var(--color-text-2)}
/* 9.7 · colecciones */
.coll{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4);margin-top:var(--s8)}
.coll__c{display:grid;gap:8px;padding:12px;background:var(--k-puro);border-radius:var(--r-card);color:inherit;text-decoration:none;transition:transform var(--m-base) var(--e-out),box-shadow var(--m-base) var(--e-out)}
.coll__c:hover{transform:translateY(-3px);box-shadow:0 16px 34px -22px rgba(16,18,42,.4)}
.coll__main{display:block;aspect-ratio:4/3;border-radius:calc(var(--r-card) - 10px);background:#C6D5EC center/cover no-repeat}
.coll__th{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.coll__t{display:block;aspect-ratio:1;border-radius:12px;background:#C6D5EC center/cover no-repeat}
.coll .is-ph{background:repeating-linear-gradient(135deg,transparent 0 8px,rgba(16,18,42,.05) 8px 9px),var(--k-blanco);box-shadow:inset 0 0 0 1px var(--color-border-strong)}
.coll__f{display:flex;align-items:baseline;justify-content:space-between;padding:6px 4px 2px}
.coll__f b{font-size:16px;font-weight:500}
.coll__f span{font-size:12px;color:var(--color-text-3)}
@media(max-width:900px){.coll{grid-template-columns:1fr 1fr}}
/* 10.5 · muestra del catálogo */
.ipv{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:2px;margin-top:var(--s8)}
.ipv__i{display:grid;place-items:center;aspect-ratio:1;background:var(--k-puro);color:var(--k-noche)}
.ipv__i:first-child{border-radius:var(--r-component) 0 0 0}.ipv__i:nth-child(8){border-radius:0 var(--r-component) 0 0}
.ipv__i:nth-last-child(8){border-radius:0 0 0 var(--r-component)}.ipv__i:last-child{border-radius:0 0 var(--r-component) 0}
.ipv__i svg{width:30px;height:30px}
@media(max-width:760px){.ipv{grid-template-columns:repeat(4,minmax(0,1fr))}}
.btn--outline{background:transparent;color:var(--k-noche);box-shadow:inset 0 0 0 1px var(--color-border-strong)}.btn--outline:hover{background:var(--k-noche);color:var(--k-blanco);box-shadow:none}
#patrones .pats{grid-template-columns:repeat(4,minmax(0,1fr))}@media(max-width:900px){#patrones .pats{grid-template-columns:repeat(2,minmax(0,1fr))}}
.texs--grid .tex img{border-radius:var(--r-component)}
/* Cielo con Ráfaga: el lienzo del módulo va detrás; el contenido, encima */
.has-cielo .hero__clouds,.has-cielo .portal__arcs{display:none}
.hero.has-cielo .hero__glass{backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.portal.has-cielo .portal__txt{position:absolute;z-index:2}
/* 8.7 · los textos de Círculos que crecen, en el gris de los demás gráficos */
.chart .ph-t,.chart .ph-k{fill:#6B6D7E}
.chart .ph-n{fill:#6B6D7E}
/* 10.5 · tres colores */
.itri{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);margin-top:var(--s8)}
.itri__c{display:flex;flex-direction:column;gap:var(--s6);margin:0;padding:var(--s8) var(--s6) var(--s6);border-radius:var(--r-card);box-shadow:inset 0 0 0 1px var(--color-border)}
.itri__c:first-child{border-radius:0 var(--r-card) var(--r-card) 0}.itri__c:last-child{border-radius:var(--r-card) 0 0 var(--r-card);box-shadow:none}
.itri__c > span{display:flex;gap:var(--s5)}
.itri__c svg{width:32px;height:32px}
.itri__c figcaption{display:grid;row-gap:4px;font-size:13px;line-height:1.5;opacity:.85}
.itri__c figcaption b{font-size:15px;font-weight:500;opacity:1}
@media(max-width:760px){.itri{grid-template-columns:1fr}.itri__c:nth-child(n){border-radius:var(--r-card)}}
.texf__bar .texf__chips + .texf__chips{padding-left:var(--s4);border-left:1px solid var(--color-border)}
/* Pasos (.flow y el método de 18): línea de tiempo vertical con puntos, como una historia */
.flow{display:block;position:relative;max-width:640px;margin-top:var(--s8);padding:0 0 0 var(--s10)}
.flow::before{display:block;content:"";position:absolute;left:7px;top:8px;bottom:8px;border-left:1px solid var(--color-border-strong)}
.flow li{position:relative;display:grid;grid-template-columns:56px minmax(0,1fr);column-gap:var(--s4);padding:0 0 var(--s8);border-top:0}
.flow li:last-child{padding-bottom:0}
.flow li::before{content:"";position:absolute;left:calc(-1 * var(--s10) + 1px);top:4px;width:13px;height:13px;border-radius:50%;background:var(--color-bg);box-shadow:inset 0 0 0 1px var(--k-noche)}
.flow li:last-child::before{background:var(--k-atardecer);box-shadow:inset 0 0 0 1px var(--k-atardecer)}
.flow .flow__n,.flow li:last-child .flow__n{grid-row:span 2;margin:0;font-family:var(--font-sans);font-size:15px;font-weight:500;letter-spacing:.06em;line-height:1.4;color:var(--color-text-2)}
.flow__q{font-size:17px;font-weight:600;line-height:1.4}
.flow__a{margin-top:4px;font-size:14.5px;color:var(--color-text-2)}
.mt2__col ol{position:relative;padding-left:var(--s10)}
.mt2__col ol::before{content:"";position:absolute;left:7px;top:28px;bottom:28px;border-left:1px solid var(--color-border-strong)}
.mt2__s{position:relative;grid-template-columns:44px minmax(0,1fr);border-top:0;padding:var(--s4) 0}
.mt2__s::before{content:"";position:absolute;left:calc(-1 * var(--s10) + 1px);top:calc(var(--s4) + 6px);width:13px;height:13px;border-radius:50%;background:var(--color-bg);box-shadow:inset 0 0 0 1px var(--k-noche)}
.mt2__col--d .mt2__s::before{box-shadow:inset 0 0 0 1px var(--k-cielo)}
.mt2__col--d .mt2__s:last-child::before{background:var(--k-atardecer);box-shadow:inset 0 0 0 1px var(--k-atardecer)}
.mt2__n{font-family:var(--font-sans);font-size:15px;font-weight:500;letter-spacing:.06em;line-height:1.6;color:var(--color-text-2)}
.mt2__col--d .mt2__n{color:var(--color-text-2)}
.mt2__t{font-weight:600;font-size:17px}
/* 23 · Galería en carrusel: palabra de fondo, imagen al frente, la siguiente asoma, contador y avance */
.gsl{position:relative;display:grid;grid-template-columns:minmax(220px,.3fr) minmax(0,1fr);gap:var(--s8);margin-top:var(--s8);padding-top:clamp(40px,7vw,96px);outline:none;overflow:hidden;--p:0%}
.gsl__ghost{position:absolute;left:-.04em;top:-.08em;margin:0;font-family:var(--font-display);font-size:clamp(90px,15vw,220px);font-weight:500;line-height:1;letter-spacing:-.05em;color:var(--k-gris-5);pointer-events:none;user-select:none}
.gsl__side{position:relative;z-index:1;display:flex;flex-direction:column;gap:var(--s6);padding-bottom:var(--s2)}
.gsl__t{margin:0;font-size:28px;font-weight:500;letter-spacing:-.02em}
.gsl__info{display:grid;row-gap:4px;min-height:84px;font-size:13px;line-height:1.5;color:var(--color-text-2);animation:fadeUp .5s var(--e-out) both}
.gsl__info b{font-size:15px;font-weight:600;color:var(--color-text)}
.gsl__nav{margin-top:auto;display:grid;gap:var(--s4)}
.gsl__n{margin:0;font-size:13px;color:var(--color-text-3)}
.gsl__n b{font-family:var(--font-display);font-size:28px;font-weight:400;color:var(--color-text);margin-right:6px}
.gsl__bar{position:relative;height:1px;background:var(--color-border-strong)}
.gsl__bar i{position:absolute;left:0;top:-1px;height:3px;width:var(--p);background:var(--k-noche);transition:width .8s cubic-bezier(.65,0,.35,1)}
.gsl__ctl{display:flex;gap:8px}
.gsl__view{position:relative;z-index:1;overflow:hidden}
.gsl__track{display:flex;align-items:flex-end;gap:var(--s4);transition:transform .9s cubic-bezier(.65,0,.35,1);will-change:transform}
.gal--slide .gph{flex:none;height:clamp(300px,34vw,460px);opacity:.45;transition:opacity .6s var(--e-out);cursor:pointer}
.gal--slide .gph.is-cur{opacity:1;cursor:zoom-in}
.gal--slide .gph__img{height:100%;width:auto;border-radius:4px}
.gal--slide .gph--v .gph__img{aspect-ratio:3/4}.gal--slide .gph--h .gph__img{aspect-ratio:4/3}.gal--slide .gph--c .gph__img{aspect-ratio:1/1}
.gal--slide .gph__id,.gal--slide .gph__info{display:none}
.gal--slide .gph:hover .gph__img{transform:none}
@media(max-width:900px){.gsl{grid-template-columns:1fr}.gsl__side{order:2}.gal--slide .gph{height:56vw}}
.gal--slide .gph{width:max-content!important;margin:0!important}.gal--slide .gph__img{display:block}
.flow li{align-items:start}.flow .flow__n{display:block;padding:0;line-height:1.5}.flow .flow__q{margin:0;padding:0;line-height:1.5}.flow li::before{top:5px}
.itri__c figcaption b{color:inherit!important}.itri .itri__c:first-child{border-radius:0 var(--r-card) var(--r-card) 0!important}.itri .itri__c:nth-child(2){border-radius:var(--r-card)!important}.itri .itri__c:last-child{border-radius:var(--r-card) 0 0 var(--r-card)!important}
/* ════ Ronda 28 ════ */
/* Sin tachados: lo que no se usa se muestra en gris, sin línea encima */
.content s,.content del{text-decoration:none!important;color:var(--color-text-3)}
/* Botones más contenidos dentro del manual */
.btn{gap:8px;font-size:12px;letter-spacing:.06em;padding:11px 22px}
.btn svg{width:15px;height:15px}
/* Títulos de subheader: si no caben, dos renglones equilibrados; nunca se cortan */
.portal .t-display{white-space:normal;text-wrap:balance;max-width:100%;font-size:clamp(46px,6.4vw,104px);line-height:.98}
.portal__txt{max-width:min(880px,calc(100% - 2 * var(--s10)))}
/* Barra de búsqueda más contenida */
.gal .icat__bar,.texf .texf__bar .texf__q{max-width:560px}
.xref{color:inherit;text-decoration:underline;text-decoration-color:var(--k-cielo);text-decoration-thickness:1.5px;text-underline-offset:3px;transition:color var(--m-fast)}.xref:hover{color:var(--k-cielo-700)}

/* ═══ Ronda 28-b ═══ */
/* Enlace en línea al cierre de una sección, en lugar de un botón */
.ed__more{margin-top:var(--s8);max-width:640px;font-size:16px;line-height:1.65;color:var(--color-text-2)}
.ed__more a,.cstk__c a,.xref{color:var(--color-text);text-decoration:underline;text-decoration-color:var(--k-cielo);text-decoration-thickness:1.5px;text-underline-offset:4px;transition:color var(--m-fast),text-decoration-color var(--m-fast)}
.ed__more a:hover,.cstk__c a:hover,.xref:hover{color:var(--k-cielo-700);text-decoration-color:currentColor}
.wr2__old{color:var(--color-text-3)}


/* Dos cuadrículas: miniaturas */
.gcmp{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s8);margin-top:var(--s8)}
.gcmp figure{margin:0}
.gcmp figcaption{display:grid;row-gap:4px;margin-top:var(--s5);font-size:14px;line-height:1.55;color:var(--color-text-2)}
.gcmp figcaption b{font-size:15px;font-weight:500;color:var(--color-text)}
.gmini{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:44px;gap:5px;height:142px}
.gmini--g{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr;gap:0;border-top:1px solid var(--color-border-strong)}
.gmini--g i{border-bottom:1px solid var(--color-border);border-left:1px solid var(--color-border)}
.gmini--g i:nth-child(3n+1){border-left:0}
.gmini--b i{grid-column:span var(--c);grid-row:span var(--r);background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border)}
.gmini--e i.n{background:var(--k-noche);box-shadow:none}
.gmini--e i.c{background:var(--k-cielo);box-shadow:none}
.gmini--e i.c2{background:var(--k-cielo-200);box-shadow:none}
.gmini--e i.s{background:#ECD7D6;box-shadow:none}
@media(max-width:900px){.gcmp{grid-template-columns:1fr}}

/* Bento: recuadros de distinto peso, con la regla de esquinas */
.bento{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:minmax(180px,auto);gap:var(--s2);margin-top:var(--s10)}
.bento__c{grid-column:span var(--c);grid-row:span var(--r);display:flex;flex-direction:column;justify-content:flex-end;padding:var(--s6);background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border)}
.bento__t{margin-bottom:var(--s2);font-size:18px;font-weight:600;letter-spacing:-.015em;line-height:1.25;color:var(--color-text)}
.bento__c:first-child .bento__t{font-size:clamp(24px,2.2vw,32px);font-weight:500;letter-spacing:-.025em;line-height:1.1}
.bento__d{font-size:15px;line-height:1.55;color:var(--color-text-2);max-width:440px}
.bento--color .bento__c--cielo{background:var(--k-cielo);box-shadow:none}
.bento--color .bento__c--cielo2{background:var(--k-cielo-200);box-shadow:none}
.bento--color .bento__c--salmon{background:#ECD7D6;box-shadow:none}
.bento--color .bento__c--cielo .bento__d,.bento--color .bento__c--cielo2 .bento__d,.bento--color .bento__c--salmon .bento__d{color:var(--k-noche)}
.bento--color .bento__c--noche{background:var(--k-noche);box-shadow:none}
.bento--color .bento__c--noche .bento__t{color:var(--k-blanco)}
.bento--color .bento__c--noche .bento__d{color:rgba(244,244,244,.72)}
@media(max-width:900px){.bento{grid-template-columns:1fr;grid-auto-rows:auto}.bento__c{grid-column:auto;grid-row:auto;min-height:150px}}

/* 9.1 · Cuatro viñetas y ejemplos en modo nocturno sobre Azul Noche */
.vinas--4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1100px){.vinas--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.vinas--4{grid-template-columns:1fr}}
.vdk{display:block;padding:14px 16px 12px;background:var(--k-noche)}
.vdk .vseq__t{color:rgba(244,244,244,.72)}

/* Lista con ícono: dos columnas separadas por líneas finas */
.ilist{list-style:none;margin:var(--s10) 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s10)}
.ilist li{display:grid;grid-template-columns:20px minmax(0,1fr);column-gap:var(--s4);align-items:start;padding:var(--s5) 0 var(--s6);border-top:1px solid var(--color-border)}
.ilist__i{display:block;padding-top:3px;color:var(--k-noche)}
.ilist__i svg{display:block;width:20px;height:20px}
.ilist__t{font-size:16px;font-weight:500;color:var(--color-text)}
.ilist__d{margin-top:4px;font-size:14px;line-height:1.55;color:var(--color-text-2)}
@media(max-width:760px){.ilist{grid-template-columns:1fr}}

/* 9.7 · Colecciones: tarjetas apiladas e inclinadas, una colección a la vez */
.cstk{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);column-gap:var(--s12);align-items:center;margin-top:var(--s10);outline:none}
.cstk__deck{position:relative;aspect-ratio:5/4}
.cstk__set{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .5s var(--e-out)}
.cstk__set.is-on{opacity:1;pointer-events:auto}
.cstk__card{position:absolute;left:50%;top:50%;width:48%;aspect-ratio:4/5;background:#C6D5EC center/cover no-repeat;box-shadow:0 0 0 6px var(--k-puro),0 28px 50px -30px rgba(16,18,42,.5);transform:translate(-50%,-50%) translate(var(--dx),var(--dy)) rotate(var(--rot));transition:transform .7s var(--e-out)}
.cstk__card--0{--rot:-9deg;--dx:-30%;--dy:3%}
.cstk__card--1{--rot:7deg;--dx:28%;--dy:-2%}
.cstk__card--2{--rot:-1.5deg;--dx:0%;--dy:0%}
.cstk__set:hover .cstk__card--0{--dx:-36%;--rot:-11deg}
.cstk__set:hover .cstk__card--1{--dx:34%;--rot:9deg}
.cstk__set.is-on .cstk__card{animation:cstkIn .9s var(--e-out) both}
.cstk__set.is-on .cstk__card--1{animation-delay:.08s}
.cstk__set.is-on .cstk__card--2{animation-delay:.16s}
@keyframes cstkIn{from{opacity:0;translate:-56px 7px}to{opacity:1;translate:0 0}}
.cstk .is-ph{background:repeating-linear-gradient(135deg,transparent 0 8px,rgba(16,18,42,.05) 8px 9px),var(--k-blanco)}
.cstk__n{margin-bottom:var(--s6);font-size:13px;color:var(--color-text-3);font-variant-numeric:tabular-nums}
.cstk__n b{margin-right:6px;font-weight:500;color:var(--color-text)}
.cstk__t{margin:0 0 var(--s4);font-size:clamp(28px,2.6vw,40px);font-weight:500;letter-spacing:-.025em;line-height:1.1}
.cstk__d{max-width:420px;font-size:16px;line-height:1.6;color:var(--color-text-2)}
.cstk__c{margin-top:var(--s5);font-size:14px;color:var(--color-text-3)}
.cstk__it:not([hidden]),.icar__it:not([hidden]){animation:fadeWind .6s var(--e-out) both}
@keyframes fadeWind{from{opacity:0;translate:-16px 2px}to{opacity:1;translate:0 0}}
.cstk__ctl{display:flex;gap:var(--s2);margin-top:var(--s8)}
@media(max-width:900px){.cstk{grid-template-columns:1fr;row-gap:var(--s8)}}

/* 10.5 · Un ícono a la vez, en sus tres colores */
.icar{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);column-gap:var(--s12);align-items:center;margin-top:var(--s10);outline:none}
.icar__stage{position:relative;aspect-ratio:1;background:#F4F4F4;box-shadow:inset 0 0 0 1px var(--color-border);transition:background-color .6s var(--e-out)}
.icar__s{position:absolute;inset:0;display:grid;place-items:center;color:var(--fg);opacity:0;transition:opacity .45s var(--e-out)}
.icar__s svg{width:34%;height:34%}
.icar__s.is-on{opacity:1;animation:icIn .7s var(--e-out) both}
@keyframes icIn{from{translate:-24px 3px}to{translate:0 0}}
.icar__k{margin-bottom:var(--s3);font-size:12px;letter-spacing:.02em;color:var(--color-text-3)}
.icar__t{margin:0 0 var(--s3);font-size:clamp(28px,2.6vw,40px);font-weight:500;letter-spacing:-.025em;line-height:1.1}
.icar__d{max-width:380px;font-size:16px;line-height:1.6;color:var(--color-text-2)}
.icar__nav{display:flex;gap:8px;margin-top:var(--s8)}
.icar__nav button{display:flex;align-items:center;width:56px;height:20px;padding:0;border:0;background:none;cursor:pointer}
.icar__nav i{position:relative;display:block;width:100%;height:2px;overflow:hidden;background:var(--color-border-strong)}
.icar__nav i::after{content:"";position:absolute;inset:0;background:var(--k-noche);transform:scaleX(0);transform-origin:left}
.icar__nav .is-on i::after{animation:icBar 3.6s linear forwards}
.icar:hover .icar__nav .is-on i::after{animation-play-state:paused}
@keyframes icBar{to{transform:scaleX(1)}}
@media(prefers-reduced-motion:reduce){.icar__nav .is-on i::after{animation:none;transform:scaleX(1)}}
@media(max-width:760px){.icar{grid-template-columns:1fr;row-gap:var(--s6)}}

/* Galería · ventana con el mismo margen en los cuatro lados y tres formas */
.gal__big{container-type:size;--wm:max(24px,8cqmin);--ws:60cqmin}
.gal__win{padding:var(--wm);background:rgba(244,244,244,.14);filter:none;clip-path:none;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  -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 exclude,linear-gradient(#000 0 0)}
.gal__win::after{display:none}
.gal__big[data-wsh="s"] .gal__win{padding:calc((100cqh - var(--ws)) / 2) calc((100cqw - var(--ws)) / 2)}
.gal__big[data-wsh="c"] .gal__win{padding:0;-webkit-mask:radial-gradient(circle at 50% 50%,transparent calc(var(--ws) / 2),#000 calc(var(--ws) / 2 + 1px));mask:radial-gradient(circle at 50% 50%,transparent calc(var(--ws) / 2),#000 calc(var(--ws) / 2 + 1px))}
.gal__hole{position:absolute;inset:var(--wm);box-shadow:inset 0 0 0 1px rgba(255,255,255,.6);opacity:0;pointer-events:none;transition:opacity .4s var(--e-out)}
.gal__big[data-wsh="s"] .gal__hole,.gal__big[data-wsh="c"] .gal__hole{inset:calc((100cqh - var(--ws)) / 2) calc((100cqw - var(--ws)) / 2)}
.gal__big[data-wsh="c"] .gal__hole{border-radius:50%}
.gal__big[data-fx="win"] .gal__hole{opacity:1}

/* Regla de esquinas en las imágenes de los grupos de Recursos */
.texs--grid .tex img,.gsl__track .gph__img{border-radius:var(--crn,var(--r-component))}
.cstk__card{width:54%}

/* ═══ Ronda 29 ═══ */
/* Sin tachado: el contraste lo da la etiqueta (Antes) o la flecha de transformación */
.pairs__no b,.canon__no,.redline__no{text-decoration:none}
.canon__no{color:var(--color-text-2)}
.redline{columns:1;column-rule:0;border-bottom:1px solid var(--color-border)}
.redline__i{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);column-gap:var(--s8);align-items:baseline;padding:var(--s5) 0}
.redline__no{font-size:17px;color:var(--color-text-3)}
.redline__yes{margin-top:0;font-size:16px}
@media(max-width:760px){.redline__i{grid-template-columns:1fr;row-gap:6px}}

/* 8.5 · viñetas de manual en Azul Noche */
.dui li::before,.dui li:nth-child(even)::before{background:var(--k-noche)}

.tester__out{height:auto;min-height:150px;padding:var(--s6) 0;white-space:normal;overflow-wrap:anywhere;text-wrap:balance}

/* 7.4 · Título, entrada y cierre: cada parte en su fila, con su nota alineada */
#titular .annot.anat{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,260px);column-gap:0;row-gap:0;padding:0;margin-top:var(--s12);border-bottom:1px solid var(--color-border)}
#titular .anat > *{grid-column:auto;margin:0;padding:var(--s8) 0;border-top:1px solid var(--color-border)}
#titular .anat__s{padding-right:var(--s10)}
#titular .annot__note{position:static;align-self:stretch;padding-left:var(--s8);border-left:1px solid var(--color-border)}
#titular .annot__note::before{display:none}
#titular .annot__note .paren{color:var(--color-text-3)}
#titular .annot__note p{margin-top:var(--s2)}
@media(max-width:760px){#titular .annot.anat{grid-template-columns:1fr}#titular .annot__note{padding:0 0 var(--s6);border-top:0;border-left:0}}

/* Retícula dinámica de líneas: la retícula de reglas, con recuadros de distinto tamaño */
.lgrid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));margin-top:var(--s12);border-top:1px solid var(--color-border-strong)}
.lgrid__c{grid-column:span var(--c);grid-row:span var(--r);padding:var(--s8) var(--s6) var(--s10);border-bottom:1px solid var(--color-border);border-left:1px solid var(--color-border)}
.lgrid__c.is-l0{border-left:0;padding-left:0}
.lgrid__n{display:block;margin-bottom:var(--s8);font-size:13px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.lgrid__t{margin-bottom:var(--s2);font-size:18px;font-weight:600;letter-spacing:-.015em;line-height:1.3;color:var(--color-text)}
.lgrid__d{max-width:420px;font-size:15px;line-height:1.6;color:var(--color-text-2)}
.lgrid--lead .lgrid__c:first-child .lgrid__t{font-size:clamp(26px,2.4vw,34px);font-weight:500;letter-spacing:-.025em;line-height:1.1;color:var(--color-text-title-muted)}
@media(max-width:900px){.lgrid{grid-template-columns:1fr}.lgrid__c{grid-column:auto;grid-row:auto;border-left:0;padding-left:0}}

/* Lista en dos columnas, sin ícono */
.ilist li{grid-template-columns:minmax(0,1fr)}

/* 9.8 · Colecciones: tarjetas cuadradas apiladas, borde fino */
.cstk__deck{aspect-ratio:4/3}
.cstk__card{width:46%;aspect-ratio:1;box-shadow:0 0 0 3px var(--k-puro),0 18px 36px -22px rgba(16,18,42,.45)}
.cstk__card--0{--rot:-11deg;--dx:-9%;--dy:2%}
.cstk__card--1{--rot:8deg;--dx:7%;--dy:-3%}
.cstk__card--2{--rot:-4deg;--dx:-3%;--dy:1%}
.cstk__card--3{--rot:1deg;--dx:0%;--dy:0%}
.cstk__set:hover .cstk__card--0{--dx:-14%;--rot:-13deg}
.cstk__set:hover .cstk__card--1{--dx:12%;--rot:10deg}
.cstk__set.is-on .cstk__card--3{animation-delay:.24s}
.cstk__t{font-size:clamp(24px,2.2vw,32px)}

/* 9.6 · Ráfaga */
.raf{position:relative;margin-top:var(--s10);aspect-ratio:12/5;overflow:hidden;background:var(--k-blanco);box-shadow:inset 0 0 0 1px var(--color-border);--r1:#D182AB;--r2:#E99D9E;--r3:#F5A742}
.raf[data-ph="amanecer"]{--r1:#B2BFE5;--r2:#FED8B5;--r3:#FFCE86}
.raf[data-ph="noche"]{--r1:#17234F;--r2:#3E547F;--r3:#2C3C78}
.raf[data-ph="galaxia"]{--r1:#5C4B7E;--r2:#E99D9E;--r3:#1E2A5C}
.raf__svg{position:absolute;inset:0;width:100%;height:100%}
.raf__svg stop{transition:stop-color .8s var(--e-out)}
.raf__v{position:absolute;left:22px;bottom:24px;writing-mode:vertical-rl;transform:rotate(180deg);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--color-text-3)}
.raf__ph{position:absolute;right:16px;bottom:16px}
@media(max-width:760px){.raf{aspect-ratio:4/3}}

/* 9.7 · Patrones: figura y texto alternados */
.patx{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);column-gap:var(--s12);align-items:center;margin-top:var(--s12);padding-top:var(--s12);border-top:1px solid var(--color-border)}
.patx--flip .patx__fig{order:2}
.patx__fig{margin:0}
.patx__fig svg{display:block;width:100%;height:auto;aspect-ratio:8/5}
.patx__t{margin:0 0 var(--s3);font-size:22px;font-weight:500;letter-spacing:-.02em}
.patx__d{font-size:16px;line-height:1.6;color:var(--color-text-2)}
.patx__r{list-style:none;margin:var(--s6) 0 0;padding:0;border-bottom:1px solid var(--color-border)}
.patx__r li{padding:10px 0;border-top:1px solid var(--color-border);font-size:14px;line-height:1.5;color:var(--color-text)}
.patx__w{margin-top:var(--s5);font-size:14px;line-height:1.55;color:var(--color-text-2)}
.patx__w .paren{display:block;margin-bottom:4px;color:var(--color-text-3)}
.wind__g{fill:none;stroke:var(--k-noche);stroke-opacity:.5;stroke-width:.8;animation:windx 30s linear infinite}
@keyframes windx{from{transform:translateX(-480px)}to{transform:translateX(0)}}
@media(prefers-reduced-motion:reduce){.wind__g{animation:none}}
@media(max-width:900px){.patx{grid-template-columns:1fr;row-gap:var(--s6)}.patx--flip .patx__fig{order:0}}
.ktstrip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
.ktstrip img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover}

/* 9.8 · Regla 70/30 y Diario de cielos */
.r73{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:var(--s12);align-items:start;margin-top:var(--s8)}
.r73__fig{position:relative;margin:0;aspect-ratio:4/5;overflow:hidden}
.r73__img{position:absolute;inset:0;background:#C6D5EC center/cover no-repeat}
.r73__cut{position:absolute;left:0;right:0;top:70%;border-top:1px dashed rgba(255,255,255,.9)}
.r73__a,.r73__b{position:absolute;left:16px;font-size:12px;font-weight:500;letter-spacing:.02em;color:#FFFFFF}
.r73__a{top:16px}.r73__b{top:calc(70% + 12px)}
.r73 .ed__stack{margin-top:0}
.diario{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:var(--s12);align-items:start;margin-top:var(--s5)}
.diario__p{font-size:18px;line-height:1.6;color:var(--color-text-2)}
.ficha{margin:0;padding:var(--s6);background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border)}
.ficha__h{display:flex;justify-content:space-between;align-items:baseline;padding-bottom:var(--s4)}
.ficha__h .paren{color:var(--color-text-3)}
.ficha__id{font-size:12px;color:var(--color-text-3);font-variant-numeric:tabular-nums}
.ficha > div:not(.ficha__h){display:grid;grid-template-columns:120px minmax(0,1fr);gap:var(--s4);padding:10px 0;border-top:1px solid var(--color-border)}
.ficha dt{font-size:13px;color:var(--color-text-3)}
.ficha dd{margin:0;font-size:15px;color:var(--color-text)}
@media(max-width:900px){.r73,.diario{grid-template-columns:1fr;row-gap:var(--s6)}}

/* Normas KYN-MRK */
.ed__id{display:block;margin-top:var(--s3);padding:0;border:0;background:none;font:inherit;font-size:11px;letter-spacing:.02em;color:var(--color-text-3);font-variant-numeric:tabular-nums;text-align:left;cursor:copy;transition:color var(--m-fast)}
.ed__id:hover{color:var(--k-cielo-700)}
.kcode{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:var(--s10);border-top:1px solid var(--color-border-strong)}
.kcode__p{padding:var(--s8) var(--s6);border-left:1px solid var(--color-border)}
.kcode__p:first-child{border-left:0;padding-left:0}
.kcode__s{margin-bottom:var(--s5);font-family:var(--font-display);font-size:clamp(40px,4.4vw,64px);font-weight:500;letter-spacing:-.03em;line-height:1;color:var(--color-text-title-muted)}
.kcode__p:nth-child(n+3) .kcode__s{color:var(--color-text)}
.kcode__p .paren{display:block;color:var(--color-text-3)}
.kcode__d{max-width:260px;margin-top:var(--s2);font-size:14px;line-height:1.55;color:var(--color-text-2)}
.kcodes{list-style:none;margin:var(--s6) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--s8)}
.kcodes li{display:flex;align-items:baseline;gap:var(--s4);padding:10px 0;border-top:1px solid var(--color-border);font-size:14px;color:var(--color-text-2)}
.kcodes b{min-width:38px;font-weight:600;color:var(--color-text)}
.kidx__q{max-width:420px;margin-bottom:var(--s5)}
.kidx__list{border-bottom:1px solid var(--color-border)}
.kidx__r{display:grid;grid-template-columns:170px 64px minmax(0,1fr) auto;align-items:baseline;gap:var(--s5);padding:12px 0;border-top:1px solid var(--color-border);color:inherit;text-decoration:none;transition:background-color var(--m-fast)}
.kidx__r:hover{background:rgba(114,155,221,.08)}
.kidx__r[hidden]{display:none}
.kidx__r b{font-size:14px;font-weight:500;font-variant-numeric:tabular-nums}
.kidx__n{font-size:13px;color:var(--color-text-3)}
.kidx__t{font-size:15px}
.kidx__r.is-off{opacity:.55}
.kidx__e{font-size:11px;color:var(--color-text-3)}
@media(max-width:760px){.kcode,.kcodes{grid-template-columns:1fr 1fr}.kcode__p:nth-child(3){border-left:0;padding-left:0}.kidx__r{grid-template-columns:1fr auto}.kidx__t{grid-column:1 / -1}}

/* Galería · formas de la ventana: aparecen solo con Ventana y tienen el mismo estilo que los demás botones */
.gal__wsh{margin-top:6px}
.gal__wsh[hidden]{display:none}
.gal__wsh:not([hidden]){animation:fadeWind .4s var(--e-out) both}
.gal__wsh i{display:inline-block;margin-right:7px;vertical-align:-1px;border:1.2px solid currentColor}
.gal__wsh i.r{width:12px;height:8px}.gal__wsh i.s{width:9px;height:9px}.gal__wsh i.c{width:9px;height:9px;border-radius:50%}
.gal__cred{transition:background-color var(--m-base) var(--e-out),transform var(--m-fast) var(--e-out)}
.gal__cred:hover{background:var(--k-cielo-800)}
.gal__cred:active{transform:scale(.985)}
.ktg{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,1fr);column-gap:var(--s6);margin-top:var(--s6)}
.ktg figure{margin:0}
.ktg .pat{aspect-ratio:3/4;height:auto;border-radius:0;box-shadow:none}
.ktg figcaption{display:grid;row-gap:2px;margin-top:var(--s4);font-size:13px;line-height:1.5;color:var(--color-text-2)}
.ktg figcaption b{font-size:15px;font-weight:500;color:var(--color-text)}
@media(max-width:760px){.ktg{grid-template-columns:1fr;row-gap:var(--s6)}.ktg .pat{aspect-ratio:16/9}}

/* ═══ Ronda 30 ═══ */
/* ID de norma: una etiqueta fina, no un texto suelto */
.ed__id{display:inline-flex;align-items:center;gap:8px;margin-top:var(--s6);padding:6px 10px 6px 9px;border:0;background:transparent;box-shadow:inset 0 0 0 1px var(--color-border);font-size:10.5px;font-weight:500;letter-spacing:.06em;line-height:1;color:var(--color-text-2);font-variant-numeric:tabular-nums;cursor:copy;transition:box-shadow var(--m-fast),color var(--m-fast)}
.ed__id::before{content:"";flex:none;width:5px;height:5px;border-radius:50%;background:var(--k-cielo)}
.ed__id:hover{box-shadow:inset 0 0 0 1px var(--k-noche);color:var(--k-noche)}

/* 3.4 · la flecha alineada con la primera línea */
.redline__yes{align-items:start}
.redline__yes::before{margin-top:calc((1.5em - 16px) / 2)}

/* 2.2 · títulos de ítem al tamaño de las demás secciones */
.step__t{font-size:17px;font-weight:600;letter-spacing:-.01em;line-height:1.35}

/* 3.2 · el texto «En Keyons» al mismo tamaño que «Antes» */
.canon__yes{font-size:15px;line-height:1.5}

/* 7.4 a 7.6 · menos tamaño, más orden */
#titular .anat > *{padding:var(--s6) 0}
#titular .anat--t{font-size:clamp(22px,2vw,28px)}
#titular .anat--l{font-size:16px}
#titular .anat--c{font-size:17px}
.kzoom{margin-top:var(--s8)}
.kzoom__big{padding:var(--s8) 0 var(--s6)}
.kzoom__big .kicker{font-size:clamp(18px,2vw,26px)}
.kzoom__real{margin-top:var(--s6);padding-top:var(--s5)}
.rulexs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s10) var(--s5);margin-top:var(--s10);border-bottom:0}
.rulex{display:flex;flex-direction:column-reverse;justify-content:flex-end;padding:0;border-top:0}
.rulex__demo{display:grid;place-items:center;align-content:center;aspect-ratio:4/3;margin-bottom:var(--s5);padding:var(--s5);overflow:hidden;background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border);border-radius:var(--crn,0);text-align:center}
.rulex__demo > *{max-width:100%;margin:0}
.rulex__demo .dm-tight{font-size:20px}
.rulex__demo .dm-loose{font-size:12px;margin-top:8px}
.rulex__demo .dm-a,.rulex__demo .dm-b{font-size:14px}
.rulex__demo .dm-tasa{font-size:34px}
.rulex__t{margin-top:var(--s2);font-size:16px}
.rulex__t br{display:none}
.rulex__d{max-width:none;font-size:14px}
@media(max-width:1100px){.rulexs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.rulexs{grid-template-columns:1fr}}

/* 8.7 · líneas del mismo gris que los círculos de 6.1 */
#diagramas svg circle[stroke="#10122A"],#diagramas svg ellipse[stroke="#10122A"],#diagramas svg path[stroke="#10122A"]{stroke-opacity:.45}
#diagramas svg line[stroke="#10122A"]{stroke-opacity:.35}
#diagramas svg [stroke="#8CACE2"]{stroke:#10122A;stroke-opacity:.35}
#diagramas .reachviz .rv-c{stroke-opacity:.45}
#diagramas .reachviz .rv-l{stroke:rgba(16,18,42,.35)}

/* Escalera (imagen 10): cada columna sube un escalón */
.stair{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));margin-top:var(--s10)}
.stair__i{padding:calc(var(--k) * 48px) var(--s6) var(--s2);border-left:1px solid var(--color-border-strong)}
.stair__n{display:block;margin-bottom:var(--s4);font-family:var(--font-display);font-size:30px;font-weight:300;line-height:1;letter-spacing:-.02em;color:var(--color-text-title-muted)}
.stair__t{margin-bottom:var(--s2);font-size:16px;font-weight:500;color:var(--color-text)}
.stair__d{font-size:14px;line-height:1.6;color:var(--color-text-2)}
@media(max-width:900px){.stair{grid-template-columns:1fr;row-gap:var(--s6)}.stair__i{padding:0 0 0 var(--s5)}}

/* Columnas con separador (imagen 15) */
.lcols{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));margin-top:var(--s8);border-top:1px solid var(--color-border-strong)}
.lcols__i{display:flex;flex-direction:column;padding:var(--s6) var(--s6) var(--s8);border-left:1px solid var(--color-border)}
.lcols__i:first-child{border-left:0;padding-left:0}
.lcols__n{font-size:12px;color:var(--color-text-3);font-variant-numeric:tabular-nums}
.lcols__ic{display:block;height:52px;margin:var(--s6) 0 var(--s5)}
.lcols__ic svg{height:100%;width:auto;fill:none;stroke:var(--k-noche);stroke-opacity:.6;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.lcols__t{margin:var(--s4) 0 var(--s2);font-size:16px;font-weight:500;color:var(--color-text)}
.lcols__ic + .lcols__t{margin-top:0}
.lcols__d{font-size:14px;line-height:1.6;color:var(--color-text-2)}
.lcols__a{margin-top:auto;padding-top:var(--s6);font-size:12px;line-height:1.4;color:var(--color-text-3)}
.lcols__a b{display:block;font-weight:500;color:var(--color-text)}
@media(max-width:900px){.lcols{grid-template-columns:1fr 1fr}.lcols__i:nth-child(odd){border-left:0;padding-left:0}}
@media(max-width:600px){.lcols{grid-template-columns:1fr}.lcols__i{border-left:0;padding-left:0;border-bottom:1px solid var(--color-border)}}

/* Proceso con círculo (imagen 17) */
.proc{margin-top:var(--s8)}
.proc__i{position:relative;display:grid;grid-template-columns:72px minmax(0,1fr);column-gap:var(--s8);padding-bottom:var(--s8)}
.proc__i::before{content:"";position:absolute;left:35.5px;top:72px;bottom:0;border-left:1px solid var(--color-border-strong)}
.proc__i:last-child{padding-bottom:0}
.proc__i:last-child::before{display:none}
.proc__c{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--k-noche);font-size:20px;font-weight:500;font-variant-numeric:tabular-nums;color:var(--color-text)}
.proc__t{margin:var(--s3) 0 var(--s2);font-size:20px;font-weight:500;letter-spacing:-.015em}
.proc__d{max-width:560px;font-size:15px;line-height:1.65;color:var(--color-text-2)}

/* Hoja editorial (imagen 14) */
.paper{margin-top:var(--s8);border-top:1px solid var(--k-noche);border-bottom:1px solid var(--k-noche)}
.paper__h,.paper__k{display:flex;justify-content:space-between;gap:var(--s4);font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-3)}
.paper__h{padding:var(--s3) 0;border-bottom:1px solid var(--color-border-strong)}
.paper__b{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.paper__c{padding:var(--s6) var(--s8) var(--s8) 0}
.paper__c + .paper__c{padding:var(--s6) 0 var(--s8) var(--s8);border-left:1px solid var(--color-border-strong)}
.paper__k{padding-bottom:var(--s3);border-bottom:1px solid var(--color-border)}
.paper__big{margin:var(--s6) 0 var(--s4);font-size:clamp(26px,2.4vw,34px);font-weight:400;line-height:1.1;letter-spacing:-.02em;color:var(--color-text)}
.paper__p{font-size:15px;line-height:1.6;color:var(--color-text-2)}
.paper__l{list-style:none;margin:var(--s6) 0 0;padding:0}
.paper__l li{display:flex;justify-content:space-between;padding:10px 0;border-top:1px solid var(--color-border);font-size:14px;color:var(--color-text)}
.paper__l li::after{content:"";width:6px;height:6px;margin-top:6px;border-radius:50%;background:var(--k-noche)}
.paper__img{display:block;height:96px;margin:var(--s5) 0 var(--s4);background:#C6D5EC center/cover no-repeat}
.paper__row{display:grid;grid-template-columns:110px minmax(0,1fr);gap:var(--s4);padding:10px 0;border-top:1px solid var(--color-border);font-size:15px;color:var(--color-text)}
.paper__row span{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-3);padding-top:3px}
@media(max-width:900px){.paper__b{grid-template-columns:1fr}.paper__c,.paper__c + .paper__c{padding:var(--s6) 0;border-left:0}.paper__c + .paper__c{border-top:1px solid var(--color-border-strong)}}

/* 9.8 · Regla 70/30 a lo ancho */
.r73w{position:relative;margin:var(--s6) 0 0;aspect-ratio:21/8;overflow:hidden}
.r73w__img{position:absolute;inset:0;background:#C6D5EC center/cover no-repeat}
.r73w__cut{position:absolute;left:0;right:0;top:70%;border-top:1px dashed rgba(255,255,255,.9)}
.r73w__a,.r73w__b{position:absolute;left:18px;font-size:12px;font-weight:500;letter-spacing:.02em;color:#FFFFFF}
.r73w__a{top:16px}.r73w__b{top:calc(70% + 12px)}

/* 9.8 · tarjetas apiladas: todas se abren juntas desde el montón */
@property --rot{syntax:"<angle>";inherits:false;initial-value:0deg}
@property --dx{syntax:"<percentage>";inherits:false;initial-value:0%}
@property --dy{syntax:"<percentage>";inherits:false;initial-value:0%}
.cstk__card{transition:--rot .7s var(--e-out),--dx .7s var(--e-out),--dy .7s var(--e-out)}
.cstk__set.is-on .cstk__card{animation:cstkFan .9s var(--e-out) both}
.cstk__set.is-on .cstk__card--0{animation-delay:.12s}
.cstk__set.is-on .cstk__card--1{animation-delay:.08s}
.cstk__set.is-on .cstk__card--2{animation-delay:.04s}
.cstk__set.is-on .cstk__card--3{animation-delay:0s}
@keyframes cstkFan{from{opacity:0;--rot:0deg;--dx:0%;--dy:0%;translate:-40px 5px}to{opacity:1;translate:0 0}}
.cstk__set:hover .cstk__card--2{--dx:-6%;--rot:-7deg}
.cstk__set:hover .cstk__card--3{--dy:-2%;--rot:2deg}

/* 9.1 · filas dentro de un párrafo largo */
.mrow{display:grid;grid-template-columns:150px minmax(0,1fr);column-gap:var(--s5);padding:8px 0;border-top:1px solid var(--color-border)}
.mrow:first-child{border-top:0;padding-top:0}
.mrow strong{font-weight:600}
@media(max-width:600px){.mrow{grid-template-columns:1fr}}

/* 9.5 · ventanas en carrusel */
.icar--win{grid-template-columns:minmax(0,300px) minmax(0,1fr)}
.icar--win .icar__stage{aspect-ratio:3/4;background:transparent!important;box-shadow:none}
.icar--win .icar__s{display:block}
.icar--win .win{position:absolute;inset:0;border-radius:0;aspect-ratio:auto}

/* 9.6 · ráfagas en seis estilos */
.rfps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s3);margin-top:var(--s10)}
.rfp{position:relative;margin:0;aspect-ratio:3/4;overflow:hidden;background:var(--k-blanco);box-shadow:inset 0 0 0 1px var(--color-border);border-radius:var(--crn,0)}
.rfp svg{position:absolute;inset:0;width:100%;height:100%}
.rfp__k,.rfp__n{position:absolute;top:16px;font-size:10px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--color-text-2)}
.rfp__k{left:18px}.rfp__n{right:18px;letter-spacing:.04em;font-variant-numeric:tabular-nums}
.rfp__f{position:absolute;left:18px;right:18px;bottom:16px;display:flex;align-items:flex-end;justify-content:space-between}
.rfp__t{font-size:20px;font-weight:500;letter-spacing:-.02em;line-height:1.1;color:var(--k-noche)}
.rfp__t small{display:block;margin-top:4px;font-size:12px;font-weight:400;letter-spacing:0;color:var(--color-text-2)}
.rfp__dots{display:flex;gap:4px}.rfp__dots i{width:7px;height:7px;border-radius:50%}
.rfps__hint{margin-top:var(--s4);font-size:13px;color:var(--color-text-3)}
@media(max-width:900px){.rfps{grid-template-columns:1fr 1fr}}

/* 11.4 · lo que no se usa, como figuras */
.nouse{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s3);margin-top:var(--s6)}
.nouse__i{margin:0}
.nouse__f{display:grid;place-items:center;aspect-ratio:1;background:var(--k-puro);box-shadow:inset 0 0 0 1px var(--color-border);border-radius:var(--crn,0)}
.nouse__f svg{width:52%;height:auto;fill:none;stroke:#8B8C92;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.nouse__t{margin-top:var(--s5);font-size:16px;font-weight:500;color:var(--color-text)}
.nouse__d{margin-top:4px;font-size:14px;line-height:1.55;color:var(--color-text-2)}
@media(max-width:900px){.nouse{grid-template-columns:1fr 1fr}}

/* Galería · formas de ventana en botones circulares, sin texto */
.fpop__row .gal__wsh{display:inline-flex;gap:4px;margin:0}
.fpop__row .gal__wsh[hidden]{display:none}
.fpop__row .gal__wsh button{display:grid;place-items:center;width:36px;height:36px;min-width:0;padding:0;border-radius:50%}
.gal__wsh i{margin:0;border-width:1.3px}
.gal__wsh i.r{width:14px;height:9px}.gal__wsh i.s{width:10px;height:10px}.gal__wsh i.c{width:11px;height:11px}
.gal__cred{box-shadow:inset 0 0 0 1px var(--k-noche)}
.gal__cred:hover{background:var(--k-puro);color:var(--k-noche)}

/* Buscador y filtro: una sola barra, fina y recta */
.icat__bar{display:grid;grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:"q f n";align-items:stretch;column-gap:0;row-gap:0}
.gal .icat__bar,.texf .texf__bar{max-width:720px}
.gal .icat__bar .icat__q,.icat__bar .icat__q{grid-area:q;height:48px;max-width:none;padding:0 16px 0 44px;border-radius:0;background-color:var(--k-puro);background-position:16px 50%;box-shadow:inset 0 0 0 1px var(--color-border)}
.icat__bar .icat__q:focus{position:relative;z-index:1;box-shadow:inset 0 0 0 1px var(--k-cielo)}
.icat__bar .fpop{grid-area:f;justify-self:stretch;margin-left:-1px}
.icat__bar .fpop__btn{height:48px;padding:0 18px;gap:8px;background:var(--k-puro)!important;box-shadow:inset 0 0 0 1px var(--color-border)!important;font-size:13px;font-weight:500;color:var(--color-text)}
.icat__bar .fpop__btn::before{content:"Filtros";color:inherit}
.icat__bar .fpop__btn .fpop__val{color:var(--color-text-3);font-weight:500;text-decoration:none}
.icat__bar .fpop__btn .fpop__val:empty{display:none}
.icat__bar .fpop__btn:hover,.icat__bar .fpop__btn[aria-expanded="true"]{background:var(--k-noche)!important;color:var(--k-blanco);box-shadow:none!important}
.icat__bar .fpop__btn:hover .fpop__val,.icat__bar .fpop__btn[aria-expanded="true"] .fpop__val{color:var(--k-blanco)}
.icat__bar .icat__count{grid-area:n;align-self:center;min-width:0;padding-left:var(--s5);white-space:nowrap}
.icat__bar .fpop__panel{right:auto;left:0}
.rulexs{grid-template-columns:repeat(3,minmax(0,1fr))}
.rulex__t br{display:inline}
.rulex__demo{aspect-ratio:5/4}
.rulex__demo .dm-tight{font-size:17px;line-height:1.05}
.rulex__demo .dm-loose{font-size:11px;line-height:1.5}
.rulex__demo .dm-a,.rulex__demo .dm-b{font-size:13px;line-height:1.45}
.rulex__demo .dm-a{font-size:15px}
.rulex__demo .dm-track{display:flex;align-items:baseline;gap:12px}
.rulex__demo .dm-track span:first-child{font-size:30px}
.rulex__demo .dm-sizes span:first-child{font-size:36px!important}
.rulex__demo .dm-num{font-size:14px}
@media(max-width:900px){.rulexs{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ═══ Ronda 31 ═══ */
.portal__arcs{display:none!important}
.ed__id{display:none}
.ed__label .ed__code{font-size:12px;letter-spacing:.03em;cursor:copy;transition:color var(--m-fast)}
.ed__label .ed__code:hover{color:var(--k-noche)}
.pairs__yes{font-size:15px}
.canon--2{display:block}
.canon--2 .canon__row,.canon--2 .canon__row:nth-child(n+3){display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:none;grid-row:auto;column-gap:var(--s6);padding:var(--s8) 0 var(--s10);border-left:0}
.canon--2 .canon__rule{grid-column:1 / span 6}
.canon--2 .canon__ex{grid-column:8 / -1;align-self:start;padding-top:0}
@media(max-width:900px){.canon--2 .canon__rule,.canon--2 .canon__ex{grid-column:1 / -1}.canon--2 .canon__ex{padding-top:var(--s6)}}
#titular .anat > .annot__note{padding:var(--s6) 0 var(--s6) var(--s8)}
@media(max-width:760px){#titular .anat > .annot__note{padding:0 0 var(--s6)}}

/* 7.6 · una regla a la vez */
.rview{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);column-gap:var(--s10);margin-top:var(--s10);border-top:1px solid var(--color-border-strong)}
.rview__list{list-style:none;margin:0;padding:0}
.rview__list li{border-bottom:1px solid var(--color-border)}
.rview__list button{display:flex;align-items:baseline;gap:var(--s4);width:100%;padding:14px 0;border:0;background:none;text-align:left;font:inherit;font-size:15px;color:var(--color-text-3);cursor:pointer;transition:color var(--m-fast)}
.rview__list button span{font-size:12px;color:var(--color-text-title-muted);font-variant-numeric:tabular-nums}
.rview__list button:hover,.rview__list button[aria-pressed="true"]{color:var(--color-text)}
.rview__list button[aria-pressed="true"]::after{content:"";align-self:center;width:6px;height:6px;margin-left:auto;border-radius:50%;background:var(--k-cielo)}
.rview__stage{padding-top:var(--s6)}
.rview__it:not([hidden]){animation:fadeWind .5s var(--e-out) both}
.rview__demo{display:grid;place-items:center;align-content:center;min-height:240px;padding:var(--s6) 0;border-bottom:1px solid var(--color-border);text-align:center}
.rview__demo > *{margin:0}
.rview__d{margin-top:var(--s5);max-width:420px;font-size:15px;line-height:1.6;color:var(--color-text-2)}
@media(max-width:760px){.rview{grid-template-columns:1fr}}

/* 11.4 · lo que no se usa, en una línea */
.nouse2{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--s6);margin-top:var(--s5);border-top:1px solid var(--color-border)}
.nouse2__i{padding-top:var(--s5)}
.nouse2__i svg{display:block;width:40px;height:30px;margin-bottom:var(--s4);fill:none;stroke:#8B8C92;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.nouse2__t{font-size:15px;font-weight:500;color:var(--color-text)}
.nouse2__d{margin-top:4px;font-size:13px;line-height:1.5;color:var(--color-text-3)}
@media(max-width:900px){.nouse2{grid-template-columns:1fr 1fr;row-gap:var(--s5)}}

/* Buscador y filtro con la regla de esquinas: exterior recto, interior curvo */
.icat__bar{column-gap:4px}
.icat__bar .fpop{margin-left:0}
.gal .icat__bar .icat__q,.icat__bar .icat__q{border-radius:0 var(--r-control) var(--r-control) 0}
.icat__bar .fpop__btn{border-radius:var(--r-control) 0 0 var(--r-control)}

/* Formas de la ventana: del mismo alto que los demás botones */
.fpop__row .gal__wsh{align-self:stretch}
.fpop__row .gal__wsh button{width:auto;height:auto;aspect-ratio:1;align-self:stretch;padding:0}
.entry__img .split{top:70%}
.xref{white-space:nowrap}
.fpop__row .gal__wsh button{flex:none;width:32px;height:32px;aspect-ratio:auto;align-self:center}

/* ═══ Ronda 32 ═══ */
/* Botones lineados: línea Azul Cielo y texto Azul Noche; hover Azul Noche con Blanco Keyons */
.btn-icon{border-color:var(--k-cielo);color:var(--k-noche)}
.btn-icon:hover,.promise summary:hover .btn-icon{background:var(--k-noche);border-color:var(--k-noche);color:var(--k-blanco)}
.btn--outline{color:var(--k-noche);box-shadow:inset 0 0 0 1px var(--k-cielo)}
.btn--outline:hover{background:var(--k-noche);color:var(--k-blanco);box-shadow:none}
.fpop__row button{color:var(--k-noche);box-shadow:inset 0 0 0 1px var(--k-cielo)}
.fpop__row button:hover{background:var(--k-noche);color:var(--k-blanco);box-shadow:none}
.fpop__row button[aria-pressed="true"],.fpop__row button[aria-pressed="true"]:hover{background:var(--k-noche);color:var(--k-blanco);box-shadow:none}

/* VOZ-002 · «Antes» a la altura del título de la regla */
.canon--2 .canon__ex{padding-top:var(--canon-off,42px)}
/* VOZ-004 · flecha en Azul Noche */
.redline__yes::before{background:var(--k-noche)}
/* ESP-005 · más aire entre viñetas */
.dui ul{row-gap:12px}
/* ESP-007 · etiquetas del mismo gris que los demás diagramas */
#diagramas .reachviz__t{font-size:clamp(12px,1.1vw,14px);font-weight:500;color:#6B6D7E}
/* ILU-002 · lo anterior en gris, sin tachar */
.emph__old{color:var(--color-text-3)}
/* ICO-001 · formas guía en la escala de Azul Cielo */
.bp__k{stroke:var(--k-cielo-700);stroke-opacity:.6}
.bp__k2{stroke:var(--k-cielo-400);stroke-opacity:.8}

/* ILU-007 · parámetros con más aire */
.patx__d{margin-bottom:var(--s2)}
.patx__r{margin-top:var(--s8)}
.patx__r li{padding:14px 0;font-size:14px;line-height:1.6}
.patx__w{margin-top:var(--s6);line-height:1.6}
.patx__fig img{display:block;width:100%;aspect-ratio:8/5;object-fit:cover}

/* ILU-008 · el texto del carrusel crece hacia arriba; número y flechas no se mueven */
.cstk{align-items:stretch}
.cstk__txt{display:flex;flex-direction:column}
.cstk__n{margin-bottom:0}
.cstk__it{margin-top:auto}
.cstk__ctl{margin-top:var(--s10)}

/* DAT-004 · lo que no se usa, en la retícula de cuatro, con íconos */
.pgrid--ico .pgrid__ic{display:block;width:28px;height:28px;margin-bottom:var(--s6)}
.pgrid--ico .pgrid__ic svg{width:100%;height:100%;fill:none;stroke:var(--k-noche);stroke-width:2;stroke-linecap:butt;stroke-linejoin:miter}

/* Galería y texturas: la barra pegada a las imágenes y del ancho de la sección */
.gsl{padding-top:0;margin-top:var(--s6)}
.gal .icat__bar,.gal.gal--slide .icat__bar{max-width:none}
.fpop__all{padding-bottom:var(--s3);margin-bottom:var(--s2);border-bottom:1px solid var(--color-border)}

/* 27 · Nomenclatura con aire */
.kex{margin:var(--s8) 0 0;font-family:var(--font-display);font-size:clamp(30px,3.4vw,46px);font-weight:500;letter-spacing:-.02em;color:var(--color-text)}
.kcodes{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s12);margin-top:var(--s6)}
.kcodes li{padding:16px 0}
.kidx__bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s4);margin-bottom:var(--s6)}
.kidx__bar .kidx__q{flex:1 1 320px;max-width:none;margin:0}
.kidx__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s12);border-bottom:0}
.kidx__r{grid-template-columns:150px 52px minmax(0,1fr) auto;padding:16px 0}
@media(max-width:900px){.kcodes,.kidx__list{grid-template-columns:1fr}}
.canon--2 .canon__ex{padding-top:45px}