/* LA HOJA DE LAS FICHAS DE /aprende/
   La comparten 147 fichas. Antes vivia copiada dentro de cada una de ellas, 27 KB por
   pagina, asi que un cambio de color eran 147 archivos y quien leia tres fichas se
   bajaba lo mismo tres veces.

   SE EDITA AQUI. Las fuentes de trabajo/sitio/paginas/aprende/ solo la enlazan, y el
   remate propio de cada familia de ficha vive en su <style id="ficha-..."> , que va
   despues de esta hoja y por eso puede pisarla. */

  :root{
    --blanco:#FFFFFF;
    --marfil:#FBF8F1;
    --antracita:#021212;
    --vino:#3B161F;
    --f-title:'Manrope', Arial, Helvetica, sans-serif;
    --f-head:'Arimo',Arial,Helvetica,sans-serif;
    --f-body:'Arimo',Arial,Helvetica,sans-serif;
    --neutro:#70706a;
    --panel:#faf8f4;
  }
  *{box-sizing:border-box;}
  html{-webkit-text-size-adjust:100%;}
  body{
    margin:0;
    background:var(--blanco);
    color:var(--antracita);
    font-family:Arimo, Arial, Helvetica, sans-serif;
    font-size:17px;
    line-height:1.5;
    letter-spacing:-.1px;
  }
  /* ---- Cabecera de sitio ---- */
  /* ═══════ PORTADA | el disco de vino con la rueda ═══════ */
  .portada{
    position:relative; background:var(--marfil);
    overflow:hidden; isolation:isolate;
  }
  .portada .disco{
    position:absolute; z-index:0; pointer-events:none;
    background:var(--vino); border-radius:50%;
    display:grid; place-items:center;
  }
  .portada .disco picture{display:flex; align-items:center; justify-content:center; width:100%; height:100%;}
  .portada .disco img{width:84%; height:auto; display:block; margin:0 auto;}
  .portada-interior{position:relative; z-index:1; max-width:1120px; margin:0 auto;}
  .rotulo-tema{
    font-family:'Manrope', Arial, sans-serif; font-weight:800; text-transform:uppercase;
    font-size:15px; text-transform:uppercase; letter-spacing:1.3px;
    color:var(--vino); margin:0 0 14px;
  }
  h1{
    font-family:'Manrope', Arial, sans-serif; font-weight:800; text-transform:uppercase;
    line-height:.92; letter-spacing:-.5px; margin:0 0 16px;
    color:var(--antracita); font-size:clamp(56px, 15vw, 104px);
  }
  h1 span{
    display:block; font-size:.34em; letter-spacing:-.5px;
    color:var(--vino); margin-top:14px; line-height:1.05;
  }
  .bajada{font-size:clamp(17px, 2.1vw, 20px); line-height:1.55; color:#3a3a33; margin:0 0 22px;}
  .firma{font-size:13.5px; color:var(--neutro); margin:0;}
  .firma b{color:var(--antracita); font-weight:600;}
  /* — móvil y tablet: el disco va en el flujo, así nunca tapa el texto — */
  .portada{padding:0 0 44px;}
  .portada .disco{
    position:static; width:116vw; aspect-ratio:1;
    margin:-14vw -8vw 22px; transform:none;
  }
  .portada .disco img{width:80%;}
  .portada-interior{padding:0 22px;}
  @media(min-width:600px){
    .portada{padding:0 0 52px;}
    .portada .disco{width:82vw; margin:-10vw -6vw 26px 18vw;}
    .portada-interior{padding:0 26px;}
  }
  /* — escritorio: el disco a la derecha y el texto al lado — */
  @media(min-width:900px){
    .portada{padding:0 26px;}
    .portada .disco{
      position:absolute; width:min(50%, 680px); margin:0; /* 54% de la hoja, no de la ventana: dentro del carril la hoja es mas angosta (22 ago 2026) */
      top:50%; right:-6%; left:auto; transform:translateY(-50%);
    }
    .portada .disco img{width:84%;}
    .portada-interior{
      padding:86px 0 80px; min-height:min(62vw, 720px);
      display:flex; flex-direction:column; justify-content:center;
    }
    .portada-interior > *{max-width:min(46%, 500px);}
  }
  @media(min-width:1240px){
    .portada .disco{right:-2%;}
    .portada-interior > *{max-width:min(46%, 540px);}
  }
  /* ═══════ LA FICHA | tarjetas que se tocan ═══════ */
  .franja{background:var(--antracita); color:var(--marfil); padding:34px 0 38px;}
  .franja-int{max-width:1120px; margin:0 auto; padding:0 22px;}
  @media(min-width:600px){ .franja-int{padding:0 26px;} }
  .franja-tit{
    display:flex; align-items:center; gap:10px;
    margin:0 0 18px;
  }
  .franja-tit svg{width:19px; height:19px; fill:var(--marfil); flex:0 0 auto;}
  .franja-tit h2{
    font-family:'Manrope', Arial, sans-serif; font-weight:800; text-transform:uppercase;
    font-size:20px; letter-spacing:-.5px; margin:0; color:var(--marfil);
  }
  .franja-tit span{font-size:13.5px; color:#a49a9c; letter-spacing:-.5px;}
  @media(max-width:560px){ .franja-tit span{display:none;} }
  .franja-tira{display:grid; gap:12px; grid-template-columns:repeat(2,1fr);}
  @media(min-width:560px){ .franja-tira{grid-template-columns:repeat(3,1fr);} }
  @media(min-width:1000px){ .franja-tira{grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px;} .dato{padding:18px 14px 14px;} .dato .v{font-size:21px;} }
  .dato{
    appearance:none; border:0; font:inherit; text-align:left;
    background:var(--marfil); color:var(--antracita);
    padding:20px 18px 16px; border-radius:5px; cursor:pointer;
    display:flex; flex-direction:column; gap:10px;
    transition:transform .16s ease, background .16s ease;
  }
  .dato:hover{background:#fff; transform:translateY(-3px);}
  .dato:focus-visible{outline:3px solid #c98b9b; outline-offset:2px;}
  .dato[aria-expanded="true"]{background:#fff; transform:translateY(-3px);}
  .dato .redondel{
    width:44px; height:44px; border-radius:50%;
    background:var(--vino); color:var(--marfil);
    display:flex; align-items:center; justify-content:center;
    font-family:'Manrope', Arial, sans-serif; font-weight:800; text-transform:uppercase; font-size:21px; letter-spacing:.03em;
    flex:0 0 auto;
  }
  .dato .redondel svg{width:21px; height:21px; fill:currentColor;}
  .dato .k{
    display:block; font-size:10.5px; text-transform:uppercase;
    letter-spacing:1.3px; color:var(--neutro); font-weight:700; margin-bottom:2px;
  }
  .dato .v{
    display:block; font-family:'Manrope', Arial, sans-serif; font-weight:800; text-transform:uppercase;
    font-size:23px; letter-spacing:.045em; color:var(--antracita); line-height:1.1;
  }
  .dato .mas{
    display:inline-block; margin-top:auto; padding-top:12px;
    font-size:12.5px; font-weight:700; color:var(--vino); letter-spacing:.1px;
  }
  .dato .mas{display:flex; align-items:center; gap:6px;}
  .dato .mas .fl{
    display:inline-flex; line-height:0;
    transition:transform .2s ease;
  }
  .dato .mas .fl svg{width:13px; height:13px; fill:currentColor; display:block;}
  .dato[aria-expanded="true"] .mas .fl{transform:rotate(180deg);}
  .franja-panel{display:none; margin-top:12px;}
  .franja-panel.abierto{display:block;}
  .franja-panel .caja{
    background:var(--vino); color:var(--marfil);
    border-radius:5px; padding:26px 24px;
    display:grid; gap:18px;
  }
  @media(min-width:860px){
    .franja-panel .caja{
      grid-template-columns:64px minmax(0,1fr) auto;
      align-items:center; gap:26px; padding:28px 30px;
    }
  }
  .franja-panel .grande{
    width:56px; height:56px; border-radius:50%;
    background:rgba(251,248,241,.13);
    display:flex; align-items:center; justify-content:center;
    font-family:'Manrope', Arial, sans-serif; font-weight:800; text-transform:uppercase; font-size:26px;
  }
  .franja-panel .grande svg{width:27px; height:27px; fill:var(--marfil); color:var(--marfil);}
  .franja-panel h3{
    font-family:'Manrope', Arial, sans-serif; font-weight:800; text-transform:uppercase;
    font-size:22px; letter-spacing:-.5px; margin:0 0 8px; color:var(--marfil);
  }
  .franja-panel p{margin:0; color:#f1e7e8; font-size:15.5px; line-height:1.5;}
  .franja-panel .ir{
    display:inline-block; white-space:nowrap;
    background:var(--marfil); color:var(--vino);
    font-weight:700; font-size:14.5px; text-decoration:none;
    padding:13px 22px; border-radius:5px;
  }
  .franja-panel .ir::after{content:" →";}
  .franja-panel .ir:hover{background:#fff;}
  @media(prefers-reduced-motion:reduce){ .dato, .dato .mas .fl{transition:none;} }
  /* ═══════ Migas ═══════ */
  .migas{
    max-width:1120px; margin:0 auto; padding:20px 22px 0;
    font-size:13px; color:var(--neutro);
  }
  @media(min-width:600px){ .migas{padding:20px 26px 0;} }
  .migas a{color:var(--neutro); text-decoration:none;}
  .migas a:hover{color:var(--vino);}
  .migas span{margin:0 7px; opacity:.5;}
  /* ═══════ Cuerpo ═══════ */
  .articulo{
    max-width:1120px; margin:0 auto; padding:34px 22px 90px;
    display:grid; grid-template-columns:minmax(0,1fr);
  }
  @media(min-width:600px){ .articulo{padding:38px 26px 90px;} }
  @media(min-width:960px){ .articulo{padding-top:52px;} }
  .cuerpo-articulo h2{
    font-family:'Manrope', Arial, sans-serif; font-weight:800; text-transform:uppercase;
    font-size:clamp(26px, 3.4vw, 34px); line-height:1.1;
    letter-spacing:-.5px; margin:40px 0 14px;
  }
  .cuerpo-articulo p{margin:0 0 15px;}
  .cuerpo-articulo strong{font-weight:700;}
  .entradilla{font-size:18.5px; line-height:1.45; margin-bottom:22px;}
  .planetas{margin:26px 0 10px;}
  @media(min-width:820px){ .planetas{display:grid; grid-template-columns:1fr 1fr; gap:16px;} .planeta{margin:0;} }
  .planeta{
    background:var(--panel); padding:26px; margin:0 0 16px; border-radius:5px;
    display:grid; grid-template-columns:44px minmax(0,1fr); column-gap:18px; align-items:start;
  }
  .planeta .ico{grid-row:1 / span 3; width:38px; height:38px; color:var(--vino); margin-top:4px;}
  .planeta .ico svg{width:100%; height:100%; fill:currentColor;}
  .planeta h3{
    font-family:'Manrope', Arial, sans-serif; font-weight:800; text-transform:uppercase;
    font-size:22px; letter-spacing:-.5px; margin:0 0 4px;
  }
  .planeta .funcion{
    font-size:11px; text-transform:uppercase; letter-spacing:1.2px;
    color:var(--neutro); font-weight:700; margin:0 0 12px;
  }
  .planeta p{margin:0; line-height:1.5;}
  ul.lista{margin:2px 0 20px; padding:0; list-style:none;}
  ul.lista li{position:relative; padding:0 0 11px 22px; line-height:1.5;}
  ul.lista li::before{
    content:""; position:absolute; left:2px; top:10px;
    width:7px; height:7px; background:var(--vino); border-radius:50%;
  }
  ul.lista li:last-child{padding-bottom:0;}
  ul.lista b{font-weight:700;}
  .aviso{background:rgba(59,22,31,.055); padding:20px 22px; margin:32px 0; border-radius:5px;}
  .aviso p{margin:0;}
  .en-tu-carta{
    background:var(--antracita); color:var(--marfil);
    padding:34px 30px; margin:46px 0; border-radius:5px;
  }
  .en-tu-carta h3{
    font-family:'Manrope', Arial, sans-serif; font-weight:800; text-transform:uppercase;
    font-size:27px; line-height:1.12; letter-spacing:-.5px;
    margin:0 0 14px; color:var(--marfil);
  }
  .en-tu-carta p{margin:0 0 20px; color:#e6e2da; font-size:16px; line-height:1.5;}
  /* El enlace de dentro del parrafo salia con el azul de fabrica del navegador sobre
     la tinta (Mafe lo cazo el 20 ago 2026). Va en marfil, subrayado fino, que sobre
     este fondo se lee y sigue pareciendo enlace. */
  .en-tu-carta p a{color:var(--marfil,#fbf8f1); text-decoration:underline; text-underline-offset:2px; text-decoration-thickness:1px;}
  .en-tu-carta p a:hover{text-decoration-thickness:2px;}
  .boton{
    display:inline-block; background:var(--marfil); color:var(--antracita);
    font-weight:700; font-size:15px; letter-spacing:.2px; text-decoration:none;
    padding:14px 24px; border-radius:5px;
  }
  .boton:hover{background:#fff;}
  /* sello del signo en la portada */
  /* los otros once, con lamina */
  .otros-signos .lamina{display:block; width:100%; height:auto; aspect-ratio:1/1;
    object-fit:cover; border-radius:5px; background:#fff;}
  .otros-signos .sin-pagina{display:block; padding:0 0 14px; cursor:default;}
  .otros-signos .sin-pagina .lamina{filter:saturate(.22) brightness(1.06); opacity:.6;}
  .otros-signos .sin-pagina .nom{color:#6b6259;}
  .otros-signos{
    display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px; margin:24px 0 8px; padding:0; list-style:none;
  }
  @media(min-width:560px){ .otros-signos{grid-template-columns:repeat(6,minmax(0,1fr));} }
  @media(min-width:900px){ .otros-signos{grid-template-columns:repeat(11,minmax(0,1fr)); gap:8px;} }
  .otros-signos a{
    display:block; padding:0 0 14px;
    background:transparent; color:var(--antracita); text-decoration:none;
    transition:transform .16s ease;
  }
  .otros-signos a:hover{background:#fff; transform:translateY(-3px);}
  .otros-signos .orden{
    display:block; font-family:Arimo, Arial, sans-serif; font-size:10.5px;
    font-weight:700; letter-spacing:1.3px; color:var(--neutro); margin-bottom:-7px;
  }
  .otros-signos .nom{display:block; margin-top:9px; font-size:12px; letter-spacing:0;
    line-height:1.06; min-height:2.12em; overflow-wrap:anywhere;
    display:block; font-family:'Manrope', Arial, sans-serif; font-weight:800; text-transform:uppercase;
    font-size:20px; letter-spacing:.045em; line-height:1.1;
  }
  @media(prefers-reduced-motion:reduce){ .otros-signos a{transition:none;} }
  .pregunta{margin:0 0 20px;}
  .pregunta h3{
    font-family:'Manrope', Arial, sans-serif; font-weight:800; text-transform:uppercase;
    font-size:22px; letter-spacing:-.5px; margin:0 0 8px;
  }
  .pregunta p{margin:0;}
  .autora{
    margin:52px 0 0; padding:30px; background:var(--panel); border-radius:5px;
    display:flex; gap:20px; align-items:flex-start;
  }
  .autora img{flex:0 0 76px; width:76px; height:76px; border-radius:50%; object-fit:cover; display:block;}
  .autora h3{
    font-family:'Manrope', Arial, sans-serif; font-weight:800; text-transform:uppercase;
    font-size:21px; letter-spacing:-.5px; margin:0 0 8px;
  }
  .autora p{margin:0; font-size:15px; line-height:1.5; color:#4a4a44;}
  .pie{background:var(--antracita); color:#bcb8b1; padding:44px 22px; font-size:14px;}
  @media(min-width:600px){ .pie{padding:44px 26px;} }
  .pie-interior{max-width:1120px; margin:0 auto;}
  .pie .marca{
    font-family:'Manrope', Arial, sans-serif; font-weight:800; text-transform:uppercase; font-size:22px;
    color:var(--marfil); letter-spacing:.055em; margin:0 0 16px;
  }
  .pie a{color:#e6e2da; text-decoration:none; margin-right:22px; line-height:2.2;}
  .pie a:hover{color:var(--marfil);}
  .pie .legal{margin-top:22px; font-size:12.5px; color:#94908a;}
  /* Links al sitio dentro de la barra lateral, debajo de las vistas de la carta. */
  /* Mismo recuadro que las pestañas de la barra (Mafe, 22 jul 2026): filo blanco al 14%,
     radio 5, relleno 12/14 y letra de 14 en 600. Copiado de .tab.tab-main leyendo sus
     valores en el navegador, para que no queden dos cajas parecidas pero distintas.
     El sangrado de 51px alinea el texto con el de las pestañas, que llevan icono delante. */
  #hero .rail-link{display:flex;align-items:center;gap:12px;box-sizing:border-box;width:100%;
    font-family:var(--f-body);font-size:0.875rem;font-weight:600;color:#ffffff;
    text-decoration:none;text-align:left;padding:12px 14px;
    background:transparent;border:1px solid rgba(255,255,255,.14);border-radius:5px;
    transition:background .15s,border-color .15s}
  #hero .rail-link:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.3)}
  /* El rótulo y el icono heredarían el antracita de .chartfan .cf-nm, que sobre este
     fondo oscuro no se ve. Las reglas que los aclaran solo apuntan a .tab, así que aquí
     se repiten para .rail-link, con el mismo dorado de los iconos de la barra. */
  #hero .rail-link .cf-nm{color:#ffffff!important;background:transparent!important;
    box-shadow:none!important;font-family:var(--f-body);font-size:0.875rem;font-weight:600}
  #hero .rail-link .cf-emb{color:#cdbb8b}
  /* Reservar es la unica pastilla marfil de la barra lateral (Mafe, 27 jul 2026),
     igual que en la franja del celular: es la unica puerta que lleva al negocio y
     tiene que cantar. Texto e icono en el mismo vino oscuro de la franja de abajo,
     y el puntito del icono se queda en el vino de marca, que sobre marfil se ve. */
  #hero .rail-link.rail-reservar{background:#fbf8f1;border-color:#fbf8f1}
  #hero .rail-link.rail-reservar .cf-nm{color:#471d26!important}
  #hero .rail-link.rail-reservar .cf-emb{color:#471d26}
  #hero .rail-link.rail-reservar:hover{background:#ffffff;border-color:#ffffff}
  @keyframes mh-slide{from{transform:translateX(28%);opacity:.4}to{transform:none;opacity:1}}
  @media(max-width:900px){
    /* Hamburguesa ENCENDIDA otra vez (Mafe, 20 ago 2026). Estuvo escondida desde el
       21 jul, y con ella escondida estas páginas se quedaban en el teléfono sin
       ninguna puerta salvo la ruedita de «Mi carta», porque aquí no hay barra de
       abajo como en la carta. Se enciende siguiendo la nota que dejó la versión
       vieja: inline-flex aquí y el nombre centrado entre el botón y la pastilla,
       que es como ya lo hace la página de consultas. */
    #hero{display:none!important}
    /* En celular la ruedita vino es la ÚNICA puerta a la carta (la hamburguesa
       está escondida), y sola no dice nada: una clienta del lanzamiento no
       encontraba dónde ver su carta (24 jul 2026). El pill va siempre abierto
       con su etiqueta "Mi carta" a la vista; el toque sigue abriendo la lista. */
  }
  /* portada de texto de las páginas de fundamentos (18 ago 2026), copiada del índice de signos */
  .port-fund{background:var(--marfil); padding:44px 26px 0;}
  .port-fund .int{max-width:1120px; margin:0 auto;}
  .port-fund .rotulo-tema a{color:inherit; text-decoration:none;}
  .port-fund h1{font-family:var(--f-title); font-weight:400; font-size:clamp(44px,7vw,84px); line-height:.95; letter-spacing:-.5px; margin:6px 0 18px; color:var(--antracita);}
  .port-fund .bajada{margin:0; font-size:16.5px; line-height:1.62; color:#4a443f;}
  .port-fund .firma{margin:16px 0 0; font-size:12.5px; color:#6b6259;}
  .tabla-fund{width:100%; border-collapse:collapse; margin:18px 0 26px; font-size:15.5px;}
  .tabla-fund th,.tabla-fund td{text-align:left; padding:10px 12px; border-bottom:1px solid var(--line,#D6CEC4); vertical-align:top; border-radius:0!important;}
  .tabla-fund th{font-family:var(--f-title); font-weight:400; font-size:15px; letter-spacing:.04em; color:var(--vino);}
  .tabla-fund td b{color:var(--antracita);}
  .sigue{list-style:none; padding:0; margin:20px 0 8px; display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:10px;}
  .sigue a{display:block; padding:16px 18px; background:#fff; color:var(--antracita); text-decoration:none; border:1px solid var(--line,#D6CEC4);}
  .sigue a b{display:block; font-family:var(--f-title); font-weight:400; font-size:19px; letter-spacing:.03em; margin-bottom:4px;}
  .sigue a span{font-size:14px; color:#4a443f; line-height:1.45;}
  .sigue a:hover{border-color:var(--vino);}
  .ancla{scroll-margin-top:90px;}
  /* MANROPE (18 ago 2026): titular desde el 17 ago; Staatliches retirada. Como Staatliches era caps-only, la caja alta se pide por CSS. */
  .port-fund h1,.casas-hero h1,.port-signos h1,.sigue a b,.contacto-vias a b,.tabla-fund th,.aviso-cursos h3,.aviso-cursos button,.casa-ficha-num,.casa-ficha-rot,.casas-rejilla span{font-weight:800; text-transform:uppercase;}
  .port-fund h1,.casas-hero h1,.port-signos h1,.portada h1{letter-spacing:-.5px;}
  h2{letter-spacing:-.3px;}
  /* ═══ MAQUETA WIX (18 ago 2026, v2): la composición de Wix de verdad. Portada, franja tinta a sangre con las nubes, y secciones a todo el ancho que alternan claro y oscuro. Tipografía con los valores de la carta: título Manrope 800 caja alta -.5px, rótulo Manrope 700 12px caja alta +.5px. Sin degradados ni sombras. ═══ */
  html,body{overflow-x:clip;}
  .wx-int{max-width:1120px; margin:0 auto; padding:0 26px;}
  /* — portada — */
  .wx-hero{background:var(--marfil); padding:48px 0 0;}
  .wx-hero-int{max-width:1120px; margin:0 auto; padding:0 26px 40px; display:grid; grid-template-columns:minmax(0,1fr); gap:26px; align-items:center;}
  @media(min-width:820px){ .wx-hero.con-figura .wx-hero-int{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:48px;} }
  .wx-hero h1{font-family:var(--f-title); font-weight:800; text-transform:uppercase; font-size:clamp(42px,6.4vw,76px); line-height:.98; letter-spacing:-.5px; margin:0 0 18px; color:var(--antracita);}
  .wx-hero .bajada{margin:0; font-size:17px; line-height:1.62; color:var(--antracita);}
  .wx-hero .firma{margin:16px 0 0; font-size:12.5px; color:#6b6259;}
  .wx-hero-fig{display:flex; justify-content:center;}
  .wx-hero-fig img{width:min(100%,440px); height:auto; display:block; border-radius:5px;}
  .wx-hero-fig.redonda img{border-radius:50%; aspect-ratio:1/1; object-fit:cover; width:min(100%,400px);}
  .wx-hero.centrada .wx-hero-int{text-align:center; justify-items:center;}
  .wx-hero.centrada .bajada{font-size:17.5px;}
  .wx-hero .boton{margin-top:26px; background:var(--antracita); color:var(--marfil); font-family:var(--f-title); font-weight:700; letter-spacing:0; padding:16px 30px; font-size:16px;}
  .wx-hero .boton:hover{background:var(--vino); color:var(--marfil);}
  .wx-hero  /* — la franja tinta a sangre, con las nubes de Wix asomando por arriba — */
  .wx-banda{background:var(--antracita); color:var(--marfil); padding:34px 0 44px; position:relative;}
  .wx-banda.con-nubes{margin-top:78px;}
  .wx-banda.con-nubes::before{content:""; position:absolute; left:0; right:0; top:-79px; height:80px; background:url(/aprende/img/nubes.svg) center bottom / 100% 80px no-repeat; pointer-events:none;}
  @media(max-width:600px){ .wx-banda.con-nubes{margin-top:44px;} .wx-banda.con-nubes::before{top:-44px; height:45px; background-size:100% 45px;} }
  .wx-banda-tit{display:block; text-align:center; font-family:var(--f-title); font-weight:700; text-transform:uppercase; font-size:.75rem; letter-spacing:-.5px; color:var(--marfil); margin:0 0 18px;}
  .wx-rejilla + .wx-banda-tit{margin-top:38px;}
  .wx-rejilla{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px;}
  @media(min-width:560px){ .wx-rejilla{grid-template-columns:repeat(3,minmax(0,1fr));} .wx-rejilla.c4,.wx-rejilla.c5,.wx-rejilla.c6{grid-template-columns:repeat(4,minmax(0,1fr));} }
  @media(min-width:900px){ .wx-rejilla{gap:18px;} .wx-rejilla.c5{grid-template-columns:repeat(5,minmax(0,1fr));} .wx-rejilla.c6{grid-template-columns:repeat(6,minmax(0,1fr));} .wx-rejilla.c2{grid-template-columns:repeat(2,minmax(0,1fr)); max-width:600px; margin:0 auto;} .wx-rejilla.c3{max-width:840px; margin:0 auto;} .wx-rejilla.c4{max-width:960px; margin:0 auto;} }
  .wx-rejilla a,.wx-rejilla > li > div{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; background:var(--marfil); color:var(--antracita); border-radius:5px; padding:26px 12px 20px; min-height:132px; height:100%; text-decoration:none; border:1px solid var(--marfil); text-align:center; box-sizing:border-box;}
  .wx-rejilla a:hover{background:#fff; border-color:var(--vino);}
  .wx-rejilla svg{width:52px; height:52px; fill:currentColor; display:block;}
  .wx-rejilla span{font-family:var(--f-title); font-weight:700; text-transform:uppercase; font-size:.75rem; letter-spacing:.5px; line-height:1.2;}
  .wx-rejilla small{font-size:12.5px; color:#6b6259; margin-top:-7px;}
  .wx-rejilla img{width:100%; height:auto; display:block;}
  /* — las secciones a sangre, una por pieza, que alternan claro y oscuro como en Wix — */
  .wx-sangre{width:100vw; margin-left:calc(50% - 50vw);}
  .wx-seccion{padding:54px 0 48px; margin-top:0; margin-bottom:0;}
  .wx-seccion.claro{background:var(--marfil); color:var(--antracita);}
  .wx-seccion.oscuro{background:var(--antracita); color:var(--marfil);}
  .wx-seccion-cab{display:grid; grid-template-columns:minmax(0,1fr) 110px; gap:14px 26px; align-items:center; margin-bottom:22px;}
  @media(min-width:720px){ .wx-seccion-cab{grid-template-columns:minmax(0,1fr) 150px; gap:30px;} }
  .wx-seccion h3{margin:0; font-family:var(--f-title); font-weight:800; text-transform:uppercase; font-size:clamp(26px,3.4vw,34px); letter-spacing:-.5px; line-height:1.1; color:inherit;}
  .wx-seccion-rot{display:block; margin-top:8px; font-family:var(--f-title); font-weight:700; text-transform:uppercase; font-size:.75rem; letter-spacing:.5px; color:var(--vino);}
  .wx-seccion.oscuro .wx-seccion-rot{color:#D6CEC4;}
  .wx-glifo{position:relative; width:110px; height:110px; color:inherit; flex:0 0 auto; justify-self:end;}
  @media(min-width:720px){ .wx-glifo{width:150px; height:150px;} }
  .wx-glifo .marco{position:absolute; inset:0; width:100%; height:100%; display:block;}
  .wx-glifo .glifo{position:absolute; inset:25%; width:50%; height:50%; fill:currentColor; display:block;}
  .wx-seccion p{margin:0 0 16px; font-size:17px; line-height:1.55; color:inherit;}
  .wx-seccion p:last-child{margin-bottom:0;}
  .wx-seccion .grados{margin-left:12px; font-size:.6em; letter-spacing:0; color:#6b6259;}
  .wx-seccion.oscuro .grados{color:#D6CEC4;}
  /* la tira «signos del elemento», cuadros con el glifo, centrada como en Wix */
  .wx-signos{margin:28px 0 6px; text-align:center;}
  .wx-signos-rot{display:block; font-family:var(--f-title); font-weight:700; text-transform:uppercase; font-size:.75rem; letter-spacing:.5px; margin:0 0 14px; color:inherit;}
  .wx-signos-rot em{font-style:normal; color:var(--vino);}
  .wx-seccion.oscuro .wx-signos-rot em{color:#D6CEC4;}
  .wx-signos ul{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; justify-content:center; gap:14px;}
  .wx-signos a{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; width:104px; height:104px; background:var(--antracita); color:var(--marfil); border-radius:5px; text-decoration:none; border:1px solid var(--antracita);}
  .wx-seccion.oscuro .wx-signos a{background:var(--marfil); color:var(--antracita); border-color:var(--marfil);}
  .wx-signos a:hover{background:var(--vino); border-color:var(--vino); color:var(--marfil);}
  .wx-signos svg{width:36px; height:36px; fill:currentColor; display:block;}
  .wx-signos small{font-family:var(--f-title); font-size:.6875rem; letter-spacing:.5px; text-transform:uppercase; font-weight:700; white-space:nowrap;}
  /* — botones «¿Quedaste con alguna duda?» de Contacto y Preguntas frecuentes — */
  .wx-dudas{margin:44px 0 10px; text-align:center;}
  .wx-dudas h2{margin-bottom:6px!important;}
  .wx-dudas p{margin:0 0 18px; color:var(--antracita);}
  .wx-dudas ul{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:minmax(0,1fr); gap:12px;}
  @media(min-width:640px){ .wx-dudas ul{grid-template-columns:repeat(2,minmax(0,1fr));} }
  .wx-dudas a{display:block; padding:16px 18px; background:var(--antracita); color:var(--marfil); text-decoration:none; border-radius:5px; font-family:var(--f-title); font-weight:700; font-size:15px; letter-spacing:0; border:1px solid var(--antracita);}
  .wx-dudas a:hover{background:var(--vino); border-color:var(--vino);}
  /* — la tira de pantallas de Preguntas frecuentes — */
  .wx-pantallas{list-style:none; margin:30px 0 8px; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px;}
  .wx-pantallas img{width:100%; height:auto; display:block; border-radius:5px; border:1px solid var(--line,#D6CEC4);}
  @media(max-width:560px){ .wx-pantallas{grid-template-columns:minmax(0,1fr);} }
  /* — el espaciado de los títulos, con los valores de la carta (Mafe cazó el de fábrica el 18 ago 2026) — */
  .cuerpo-articulo h2,.pregunta h3,.en-tu-carta h3,.autora h3,.planeta h3,.sigue a b,.svc-bloque .svc-t,.svc-nm,.pie .marca,.tabla-fund th,.port-signos h1{letter-spacing:-.5px!important;}
  .cuerpo-articulo h2{margin-top:46px;}
  .planeta .funcion,.dato .k,.franja-tit h2,.migas{letter-spacing:0!important;}
  .boton,.svc-btn{font-weight:700!important; letter-spacing:0!important; text-transform:none!important;}
  .sg-dat,.aviso-cursos-consent{letter-spacing:0!important;}
  .aviso-cursos h3,.contacto-vias a b{letter-spacing:-.5px!important;}
  .aviso-cursos button{font-weight:700!important; letter-spacing:0!important; text-transform:none!important;}
  .wx-seccion .mas-ficha{margin:18px 0 0;}
  .wx-seccion .mas-ficha a{font-family:var(--f-title); font-weight:700; text-transform:uppercase; font-size:.75rem; letter-spacing:.5px; color:var(--vino); text-decoration:none; border-bottom:1px solid currentColor; border-radius:0!important; padding-bottom:3px;}
  .wx-seccion.oscuro .mas-ficha a{color:#D6CEC4;}