/* ── tipografías alojadas en el propio archivo (OFL) ── */
  @font-face { font-family: Archivo; src: url("/fuentes/archivo-31ae968660.woff2") format("woff2"); font-weight: 400 800; font-style: normal; font-display: swap; }
  @font-face { font-family: "Archivo Black"; src: url("/fuentes/archivo-black-3818963e81.woff2") format("woff2"); font-weight: 400 900; font-style: normal; font-display: swap; }
  @font-face { font-family: "Chivo Mono"; src: url("/fuentes/chivo-mono-4a91dacc36.woff2") format("woff2"); font-weight: 400 700; font-style: normal; font-display: swap; }
  @font-face { font-family: Alegreya; src: url("/fuentes/alegreya-cursiva-d16196e2f1.woff2") format("woff2"); font-weight: 400 700; font-style: italic; font-display: swap; }

  /* ══════════════════════════════════════════════════════════════
     MALDITO SUDACA · sistema visual
     Mundo: puesto de feria de noche. Toldo, varillas, comanda.
     Forma: todo a canto vivo (radio 0). Única excepción: la
     notación BPMN, donde el radio es parte del lenguaje.
     ══════════════════════════════════════════════════════════════ */
  :root {
    /* fondos */
    --noche: #141210; --noche2: #1b1815; --noche3: #221e1a;
    --hueso: #efe9de; --papel: #f6f1e6; --papel2: #fbf8f1;
    /* tinta */
    --tinta: #14120f; --grafito: #4a443c; --gris: #5f584f; --gris2: #6d6656;
    --texto: #d5cec3; --texto2: #bdb6ab; --humo: #a49d93;
    /* acentos */
    --maiz: #e6b13a; --maiz-hondo: #8a5a10;
    --bugan: #b8446b; --bugan-claro: #c9587e; --bugan-hondo: #a53a5f; --bugan-fondo: #962d52;
    --verde: #4a9d86; --verde-hondo: #2a6455;
    --error: #9c2626;
    /* líneas */
    --linea: #2e2924; --linea2: #3a342e; --borde-int: #726a60;
    --lineaClara: #ded6c7; --lineaClara2: #cdc3ae; --borde-campo: #948b79;
    /* tipografía */
    --sans: Archivo, "Helvetica Neue", system-ui, -apple-system, sans-serif;
    --negra: "Archivo Black", Archivo, "Helvetica Neue", system-ui, sans-serif;
    --mono: "Chivo Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
    --serif: Alegreya, "Iowan Old Style", Georgia, serif;
    --t-display: clamp(40px, 9vw, 80px);
    --t-h1: clamp(30px, 5.4vw, 50px);
    --t-h2: clamp(23px, 3.5vw, 34px);
    --t-h3: 19px;
    --t-lead: clamp(17px, 1.35vw, 19px);
    --t-nota: 13.5px;
    --t-mono: 11.5px;
    /* aire: siempre más arriba que abajo */
    --sec-arriba: clamp(56px, 8.4vw, 104px);
    --sec-abajo: clamp(38px, 5.6vw, 68px);
    --tras-titulo: 18px;
    /* movimiento */
    --sal: cubic-bezier(.2,.65,.3,1);
    --ent: cubic-bezier(.5,0,.85,.4);
    --rapido: 140ms; --medio: 200ms; --lento: 260ms;
    /* sombra de cartel pintado: desplazamiento duro, proporcional al cuerpo */
    --cartel: .055em .055em 0 var(--bugan);
    color-scheme: dark;
  }

  * { box-sizing: border-box; }
  html { scrollbar-color: var(--linea2) var(--noche); }
  ::selection { background: var(--maiz); color: var(--noche); }
  .claro ::selection, .cierre ::selection { background: var(--tinta); color: var(--papel2); }

  body {
    margin: 0; background: var(--noche); color: var(--texto);
    font-family: var(--sans); font-size: 16px; line-height: 1.6;
    -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
    font-variant-numeric: tabular-nums; overflow-x: hidden; word-spacing: .04em;
  }
  h1, h2, h3, h4 { margin: 0; text-wrap: balance; color: var(--hueso); }
  p, ul, ol, dl, figure { margin: 0; text-wrap: pretty; }
  ul { padding: 0; list-style: none; }
  a { color: inherit; }
  b, strong { font-weight: 600; }
  svg { display: block; }

  /* foco: siempre visible, nunca animado */
  :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 2px solid var(--maiz); outline-offset: 3px;
    box-shadow: 0 0 0 5px rgba(230,177,58,.22); transition: none;
  }
  .claro :where(a, button, input, select, textarea, summary):focus-visible,
  .cierre :where(a, button):focus-visible {
    outline-color: var(--bugan-hondo); box-shadow: 0 0 0 5px rgba(165,58,95,.2);
  }
  .cierre :where(a, button):focus-visible { outline-color: #fff; box-shadow: 0 0 0 5px rgba(255,255,255,.3); }

  .wrap { width: 100%; max-width: 1200px; margin: 0 auto; padding-inline: 20px; }
  @media (min-width: 640px) { .wrap { padding-inline: 32px; } }
  .narrow > * { max-width: 62ch; }
  .mono { font-family: var(--mono); }
  .mono, code, kbd, .comanda, th, legend, .rot { word-spacing: normal; }
  .sec { padding-block: var(--sec-arriba) var(--sec-abajo); }
  .sec-sm { padding-block: clamp(36px,5vw,60px) clamp(28px,4vw,44px); }

  /* ── tipografía ── */
  h1.page { font-family: var(--negra); font-weight: 400; text-transform: uppercase; font-size: var(--t-h1); line-height: .96; letter-spacing: -.022em; margin-left: -.02em; text-shadow: var(--cartel); }
  h2 { font-family: var(--negra); font-weight: 400; text-transform: uppercase; font-size: var(--t-h2); line-height: 1.02; letter-spacing: -.015em; margin-left: -.02em; }
  h2 em, h1.page em { font-style: normal; color: var(--maiz); }
  h3 { font-size: var(--t-h3); font-weight: 700; line-height: 1.25; letter-spacing: -.005em; }
  .lead { font-size: var(--t-lead); line-height: 1.65; color: var(--texto); max-width: 62ch; margin-top: var(--tras-titulo); }
  .lead b { color: var(--hueso); }
  .txt { font-size: 16px; line-height: 1.72; color: var(--texto2); max-width: 66ch; }
  .txt b { color: var(--hueso); }
  .nota { font-size: var(--t-nota); color: var(--humo); line-height: 1.62; max-width: 62ch; }
  .rot { font-family: var(--mono); font-size: var(--t-mono); letter-spacing: .13em; text-transform: uppercase; }
  /* rótulo del cartel: la línea chica pintada sobre el nombre grande */
  .eyebrow {
    display: block; font-weight: 600; font-size: 12.5px; line-height: 1.35;
    letter-spacing: .18em; word-spacing: .16em; text-transform: uppercase;
    color: var(--maiz); margin-bottom: 16px;
  }
  .claro .eyebrow { color: var(--maiz-hondo); }
  .cierre .eyebrow { color: #f3d7e0; }

  /* ── botones ── */
  .btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    text-decoration: none; font-family: inherit; font-weight: 600; font-size: 15px; line-height: 1.2;
    padding: 13px 22px; min-height: 46px; border-radius: 0; cursor: pointer;
    background: var(--maiz); color: var(--noche); border: 1px solid var(--maiz);
    text-wrap: nowrap; white-space: nowrap;
    transition: background var(--rapido) var(--sal), border-color var(--rapido) var(--sal),
                color var(--rapido) var(--sal), transform var(--rapido) var(--sal),
                box-shadow var(--medio) var(--sal);
  }
  .btn.ghost { background: transparent; color: var(--hueso); border-color: var(--borde-int); }
  .btn[disabled], .btn[aria-disabled="true"] { opacity: .5; cursor: not-allowed; pointer-events: none; }
  .btn[data-cargando] { color: transparent; position: relative; pointer-events: none; }
  .btn[data-cargando]::after {
    content: ""; position: absolute; inset: 0; margin: auto; width: 15px; height: 15px;
    border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%;
    color: var(--noche); animation: gira .7s linear infinite;
  }
  @keyframes gira { to { transform: rotate(360deg); } }
  .cta-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 28px; }

  @media (hover: hover) and (pointer: fine) {
    .btn:hover { background: #f0be4d; border-color: #f0be4d; box-shadow: 0 6px 20px -10px rgba(230,177,58,.8); }
    .btn.ghost:hover { background: rgba(239,233,222,.07); border-color: var(--hueso); box-shadow: none; }
    .cierre .btn:hover { background: #241f1b; border-color: #241f1b; box-shadow: none; }
    .cierre .btn.ghost:hover { background: rgba(255,255,255,.14); border-color: #fff; }
    .envio .btn:hover { background: #2a251f; border-color: #2a251f; }
    .envio .btn.sec:hover { background: rgba(20,18,15,.06); border-color: var(--tinta); }
  }
  @media (prefers-reduced-motion: no-preference) {
    .btn:active { transform: scale(.96); }
  }

  /* ── tablas ── */
  .tabla { position: relative; overflow-x: auto; margin-top: 26px; border: 1px solid var(--linea2); scrollbar-width: thin; }
  .claro .tabla { border-color: var(--lineaClara); }
  table { border-collapse: collapse; width: 100%; min-width: 580px; font-size: 14.5px; }
  th, td { text-align: left; padding: 13px 15px; border-bottom: 1px solid var(--linea); vertical-align: top; }
  .claro th, .claro td { border-color: var(--lineaClara); }
  th { font-family: var(--mono); font-size: var(--t-mono); letter-spacing: .11em; text-transform: uppercase; color: var(--maiz); font-weight: 500; }
  .claro th { color: var(--maiz-hondo); }
  td { color: var(--texto2); } td b { color: var(--hueso); }
  .claro td { color: var(--grafito); } .claro td b { color: var(--tinta); }
  tbody tr:last-child td { border-bottom: 0; }
  .num, .uf, .desde { font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; white-space: nowrap; }

  /* ── toldo y encabezado ── */
  .toldo {
    height: 16px;
    background: repeating-linear-gradient(90deg, var(--bugan) 0 21px, var(--hueso) 21px 42px);
    -webkit-mask-image: linear-gradient(#000 0 0), radial-gradient(circle 5.1px at 5.25px 5.25px, #000 0 5px, transparent 5.3px);
    mask-image: linear-gradient(#000 0 0), radial-gradient(circle 5.1px at 5.25px 5.25px, #000 0 5px, transparent 5.3px);
    -webkit-mask-size: 100% 11px, 10.5px 10.5px; mask-size: 100% 11px, 10.5px 10.5px;
    -webkit-mask-position: top left, bottom left; mask-position: top left, bottom left;
    -webkit-mask-repeat: no-repeat, repeat-x; mask-repeat: no-repeat, repeat-x;
  }
  .head {
    position: sticky; top: 0; z-index: 40; background: rgba(20,18,16,.94);
    backdrop-filter: blur(10px) saturate(1.2); -webkit-backdrop-filter: blur(10px) saturate(1.2);
    box-shadow: 0 1px 0 var(--linea);
    transition: box-shadow var(--lento) var(--sal), background var(--lento) var(--sal);
  }
  .head[data-fija] { background: rgba(17,15,13,.97); box-shadow: 0 1px 0 var(--linea2), 0 18px 34px -26px rgba(0,0,0,1); }
  .head-in { display: flex; align-items: center; gap: 10px; padding-block: 11px; }
  .brand { display: flex; align-items: center; gap: 10px; margin-right: auto; text-decoration: none; min-height: 44px; }
  .brand svg { width: 21px; height: 22px; color: var(--hueso); flex: none; transition: color var(--medio) var(--sal); }
  .wordmark { font-weight: 500; font-size: 12px; letter-spacing: .2em; word-spacing: .1em; text-transform: uppercase; white-space: nowrap; color: var(--hueso); }
  @media (min-width: 420px) { .wordmark { font-size: 13px; letter-spacing: .23em; } }

  .nav { display: none; align-items: center; gap: 4px; }
  .nav-item { position: relative; display: flex; align-items: center; }
  .nav a {
    text-decoration: none; color: #b8b0a6; font-size: 13px; letter-spacing: .035em;
    padding: 12px 10px; position: relative; white-space: nowrap;
    transition: color var(--rapido) var(--sal);
  }
  .nav a::after {
    content: ""; position: absolute; left: 10px; right: 10px; bottom: 7px; height: 1px;
    background: currentColor; transform: scaleX(0); transform-origin: left;
    transition: transform var(--medio) var(--sal);
  }
  .nav a[aria-current="page"] { color: var(--maiz); }
  .nav a[aria-current="page"]::after { transform: scaleX(1); }
  @media (hover: hover) and (pointer: fine) {
    .nav a:hover { color: var(--hueso); }
    .nav a:hover::after { transform: scaleX(1); }
    .nav-item:hover .sub-btn { color: var(--hueso); }
  }
  .sub-btn {
    background: none; border: 0; padding: 12px 10px 12px 4px; margin-left: -10px; cursor: pointer;
    color: #b8b0a6; display: inline-flex; align-items: center; justify-content: center; min-height: 44px; min-width: 30px;
    transition: color var(--rapido) var(--sal);
  }
  .sub-btn svg { width: 11px; height: 11px; transition: transform var(--medio) var(--sal); }
  .sub-btn[aria-expanded="true"] svg { transform: rotate(180deg); }
  .submenu {
    position: absolute; top: calc(100% + 6px); left: -8px; min-width: 232px; z-index: 50;
    background: var(--noche2); border: 1px solid var(--linea2); padding: 6px;
    box-shadow: 0 24px 44px -22px rgba(0,0,0,.95);
    opacity: 0; visibility: hidden; transform: translateY(-6px);
    transition: opacity var(--medio) var(--sal), transform var(--medio) var(--sal), visibility 0s linear var(--medio);
  }
  .nav-item[data-abierto] .submenu { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
  .submenu a { display: block; padding: 13px 12px; font-size: 13.5px; color: var(--texto2); letter-spacing: 0; }
  .submenu a::after { display: none; }
  .submenu a span { font-family: var(--mono); font-size: 11px; color: var(--maiz); margin-right: 9px; }
  @media (hover: hover) and (pointer: fine) { .submenu a:hover { color: var(--hueso); background: var(--noche3); } }
  .submenu a[aria-current="page"] { color: var(--maiz); }

  .btn-head { padding: 10px 15px; min-height: 44px; font-size: 13px; display: none; }
  .burger {
    display: inline-flex; align-items: center; justify-content: center; gap: 9px;
    background: transparent; border: 1px solid var(--borde-int); color: var(--hueso);
    font: inherit; font-size: 13px; min-height: 44px; min-width: 44px; padding: 0 12px; cursor: pointer;
    transition: border-color var(--rapido) var(--sal), background var(--rapido) var(--sal);
  }
  .burger-ico { display: grid; gap: 4px; width: 17px; }
  .burger-ico i { display: block; height: 1.5px; background: currentColor; transition: transform var(--medio) var(--sal), opacity var(--rapido) var(--sal); }
  .burger[aria-expanded="true"] .burger-ico i:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
  .burger[aria-expanded="true"] .burger-ico i:nth-child(2) { opacity: 0; }
  .burger[aria-expanded="true"] .burger-ico i:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }
  .burger-txt { display: none; }
  @media (hover: hover) and (pointer: fine) { .burger:hover { border-color: var(--hueso); background: rgba(239,233,222,.05); } }
  @media (min-width: 560px) { .btn-head { display: inline-flex; } .burger-txt { display: inline; } }
  @media (min-width: 1000px) { .nav { display: flex; } .burger { display: none; } }

  .menu-movil {
    display: grid; grid-template-rows: 0fr; overflow: hidden;
    background: var(--noche2); box-shadow: inset 0 1px 0 var(--linea);
    transition: grid-template-rows var(--lento) var(--sal);
  }
  .menu-movil > div { min-height: 0; overflow: hidden; }
  .menu-movil.abierto { grid-template-rows: 1fr; }
  .mm-fila { display: flex; align-items: stretch; box-shadow: inset 0 -1px 0 var(--linea); }
  .menu-movil a { display: flex; align-items: center; flex: 1; min-height: 52px; padding: 10px 20px; text-decoration: none; color: var(--texto); font-size: 15px; }
  .menu-movil a[aria-current="page"] { color: var(--maiz); }
  .mm-tog { background: none; border: 0; border-left: 1px solid var(--linea); color: var(--humo); width: 56px; display: grid; place-items: center; cursor: pointer; }
  .mm-tog svg { width: 12px; height: 12px; transition: transform var(--medio) var(--sal); }
  .mm-tog[aria-expanded="true"] svg { transform: rotate(180deg); }
  .mm-sub { display: grid; grid-template-rows: 0fr; overflow: hidden; background: var(--noche); transition: grid-template-rows var(--medio) var(--sal); }
  .mm-sub > div { min-height: 0; overflow: hidden; }
  .mm-sub[data-abierto] { grid-template-rows: 1fr; }
  .mm-sub a { padding-left: 34px; font-size: 14px; color: var(--texto2); min-height: 48px; box-shadow: inset 0 -1px 0 var(--linea); }
  .mm-sub a span { font-family: var(--mono); font-size: 11px; color: var(--maiz); margin-right: 10px; }
  .mm-cta { background: var(--maiz); box-shadow: none; }
  .mm-cta a { color: var(--noche); font-weight: 600; }
  .mm-cta a[aria-current="page"] { color: var(--noche); }
  @media (min-width: 1000px) { .menu-movil { display: none !important; } }
  @media (prefers-reduced-motion: no-preference) {
    .menu-movil.abierto .mm-fila { animation: entraFila var(--lento) var(--sal) both; }
    .menu-movil.abierto .mm-fila:nth-child(2) { animation-delay: 20ms; }
    .menu-movil.abierto .mm-fila:nth-child(3) { animation-delay: 40ms; }
    .menu-movil.abierto .mm-fila:nth-child(4) { animation-delay: 60ms; }
    .menu-movil.abierto .mm-fila:nth-child(5) { animation-delay: 80ms; }
    .menu-movil.abierto .mm-fila:nth-child(6) { animation-delay: 100ms; }
    .menu-movil.abierto .mm-fila:nth-child(7) { animation-delay: 120ms; }
    @keyframes entraFila { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
  }

  /* ── páginas y transición ── */
  .pagina[hidden] { display: none !important; }
  @media (prefers-reduced-motion: no-preference) {
    .pagina.entra { animation: entraPag 240ms var(--sal) both; }
    @keyframes entraPag { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: none; } }
  }

  /* ── franja de partidas ── */
  .franja { position: relative; background: var(--hueso); color: var(--tinta); }
  .franja > .wrap { overflow-x: auto; scrollbar-width: none; }
  .franja > .wrap::-webkit-scrollbar { display: none; }
  .franja::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 38px; pointer-events: none; background: linear-gradient(to right, rgba(239,233,222,0), var(--hueso)); }
  @media (min-width: 760px) { .franja::after { display: none; } }
  .franja ul { display: flex; align-items: center; gap: 26px; font-weight: 800; text-transform: uppercase; font-size: 13px; letter-spacing: .05em; word-spacing: .14em; white-space: nowrap; padding-block: 4px; }
  .franja a { text-decoration: none; display: inline-flex; align-items: center; min-height: 44px; transition: color var(--rapido) var(--sal); }
  .franja li::before { content: "◆"; color: var(--bugan-hondo); margin-right: 9px; font-size: 8px; vertical-align: 3px; }
  @media (hover: hover) and (pointer: fine) { .franja a:hover { color: var(--bugan-hondo); } }

  /* ── portada ── */
  .hero { padding-block: clamp(46px, 7vw, 84px) clamp(36px, 5vw, 60px); }
  .hero h1 { font-family: var(--negra); font-weight: 400; text-transform: uppercase; font-size: var(--t-display); line-height: .88; letter-spacing: -.03em; margin-left: -.035em; text-shadow: var(--cartel); }
  .hero-pie { display: grid; gap: 24px; margin-top: 30px; }
  @media (min-width: 900px) { .hero-pie { grid-template-columns: 1fr .9fr; gap: 48px; align-items: start; padding-top: 6px; } }
  .firma { font-family: var(--serif); font-style: italic; font-size: clamp(21px, 3vw, 30px); line-height: 1.24; color: var(--maiz); padding-bottom: 5px; max-width: 15ch; }
  .bajada { font-size: 17.5px; line-height: 1.62; color: var(--texto); max-width: 48ch; }
  .hero-b .cta-row { margin-top: 24px; }
  .hero-b .nota { margin-top: 20px; padding-top: 17px; box-shadow: inset 0 1px 0 var(--linea2); }
  @media (prefers-reduced-motion: no-preference) {
    .hero .eyebrow, .hero h1, .hero .firma, .hero-b > * { animation: sube 420ms var(--sal) both; }
    .hero h1 { animation-delay: 60ms; }
    .hero .firma { animation-delay: 130ms; }
    .hero-b > *:nth-child(1) { animation-delay: 180ms; }
    .hero-b > *:nth-child(2) { animation-delay: 230ms; }
    .hero-b > *:nth-child(3) { animation-delay: 275ms; }
    @keyframes sube { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
  }

  /* ── ground claro ── */
  .claro { background: var(--hueso); color: var(--tinta); scrollbar-color: var(--lineaClara2) var(--hueso); }
  .claro h2, .claro h3, .claro h1.page, .claro h4 { color: var(--tinta); }
  .claro h2 em, .claro h1.page em { color: var(--bugan-hondo); }
  .claro .lead { color: var(--grafito); }
  .claro .txt { color: var(--grafito); }
  .claro .lead b, .claro .txt b { color: var(--tinta); }
  .claro .nota { color: var(--gris); }

  /* ── BPMN ── */
  .flujo { position: relative; margin-top: 26px; border: 1px solid var(--lineaClara); background: var(--papel2); }
  .flujo-scroll { overflow-x: auto; scrollbar-width: thin; scrollbar-color: var(--lineaClara2) transparent; }
  .flujo svg { min-width: 1020px; width: 100%; height: auto; }
  .flujo::after {
    content: ""; position: absolute; top: 1px; right: 1px; bottom: 1px; width: 44px; pointer-events: none;
    background: linear-gradient(to right, rgba(251,248,241,0), var(--papel2));
  }
  @media (min-width: 1080px) { .flujo::after { display: none; } }
  .leyenda { display: flex; flex-wrap: wrap; gap: 10px 18px; margin-top: 14px; font-size: 12.5px; color: var(--gris); }
  .leyenda span { display: flex; align-items: center; gap: 7px; }
  .chip { width: 12px; height: 12px; border: 1.5px solid var(--grafito); display: inline-block; flex: none; }
  .chip.ev { border-radius: 50%; } .chip.gw { transform: rotate(45deg); } .chip.sub { border-width: 2.5px; }

  /* ── pizarra: las tres formas de trabajar ── */
  .pizarra { margin-top: 32px; border-top: 1px solid var(--lineaClara2); }
  .fila-serv {
    display: grid; gap: 6px 30px; padding: 26px 0 26px 18px; position: relative;
    border-bottom: 1px solid var(--lineaClara2); text-decoration: none; color: var(--tinta);
    transition: background var(--medio) var(--sal), padding-left var(--medio) var(--sal);
  }
  .fila-serv::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--maiz-hondo); }
  .fila-serv:nth-child(2)::before { background: var(--bugan-hondo); }
  .fila-serv:nth-child(3)::before { background: var(--verde-hondo); }
  .fs-nombre { font-family: var(--negra); font-weight: 400; text-transform: uppercase; font-size: 21px; line-height: 1.05; letter-spacing: -.012em; }
  .fila-serv:first-child .fs-nombre { font-size: 25px; }
  .fs-sub { font-family: var(--serif); font-style: italic; font-size: 15.5px; color: var(--maiz-hondo); line-height: 1.4; }
  .fila-serv:nth-child(2) .fs-sub { color: var(--bugan-hondo); }
  .fila-serv:nth-child(3) .fs-sub { color: var(--verde-hondo); }
  .fs-txt { font-size: 14.5px; line-height: 1.66; color: var(--grafito); max-width: 56ch; }
  .fs-precio { font-family: var(--mono); font-size: 13.5px; color: var(--tinta); white-space: nowrap; align-self: center; }
  .fs-precio b { font-weight: 700; }
  .fs-ver { display: block; margin-top: 8px; font-family: var(--mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--maiz-hondo); opacity: 0; transform: translateY(-3px); transition: opacity var(--medio) var(--sal), transform var(--medio) var(--sal); }
  @media (min-width: 800px) {
    .fila-serv { grid-template-columns: minmax(190px, .82fr) minmax(0, 1.9fr) auto; align-items: start; padding-block: 30px; }
    .fs-nombre { grid-column: 1; } .fs-sub { grid-column: 1; grid-row: 2; }
    .fs-txt { grid-column: 2; grid-row: 1 / span 2; }
    .fs-precio { grid-column: 3; grid-row: 1 / span 2; text-align: right; align-self: center; }
  }
  @media (hover: hover) and (pointer: fine) {
    a.fila-serv:hover { background: var(--papel2); padding-left: 26px; }
    a.fila-serv:hover .fs-ver { opacity: 1; transform: none; }
  }

  /* ── comanda ── */
  .comanda {
    background: var(--papel); color: var(--tinta); border: 1px solid var(--lineaClara2);
    font-family: var(--mono); font-size: 13px; line-height: 1.5; padding: 22px 20px; max-width: 520px;
    box-shadow: 0 18px 38px -28px rgba(20,18,15,.7);
  }
  .comanda .c-top { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; padding-bottom: 11px; border-bottom: 1px solid var(--lineaClara2); }
  .comanda .c-top b { letter-spacing: .16em; font-weight: 700; }
  .comanda .c-top span { font-family: var(--serif); font-style: italic; font-size: 14px; color: var(--bugan-hondo); }
  .comanda .c-meta { display: flex; flex-wrap: wrap; gap: 4px 18px; padding: 11px 0; border-bottom: 1px dashed var(--lineaClara2); color: var(--gris2); font-size: 11px; letter-spacing: .05em; text-transform: uppercase; }
  .comanda li { display: flex; gap: 12px; padding: 11px 0; border-bottom: 1px dotted #d6cdb9; }
  .comanda li i { font-style: normal; color: var(--gris2); font-variant-numeric: tabular-nums; }
  .comanda li div { flex: 1; }
  .comanda li b { font-family: var(--sans); font-size: 14px; font-weight: 600; }
  .comanda li small { display: block; color: var(--gris2); font-size: 11.5px; margin-top: 4px; line-height: 1.55; }
  .comanda li span { color: var(--bugan-hondo); font-size: 11px; white-space: nowrap; font-variant-numeric: tabular-nums; }
  .comanda .c-foot { padding-top: 13px; color: var(--gris2); font-size: 11.5px; }

  .dos { display: grid; gap: 32px; margin-top: 30px; align-items: start; }
  @media (min-width: 900px) { .dos { grid-template-columns: 1fr 1fr; gap: 48px; } }

  /* ── partidas ── */
  .partidas { display: grid; gap: 14px; margin-top: 30px; }
  @media (min-width: 760px) { .partidas { grid-template-columns: 1fr 1fr; } }
  .partida {
    border: 1px solid var(--linea2); padding: 26px 24px; background: var(--noche2);
    text-decoration: none; display: block; position: relative;
    transition: background var(--medio) var(--sal), border-color var(--medio) var(--sal), box-shadow var(--medio) var(--sal);
  }
  .partida h3 { font-size: 21px; text-transform: uppercase; letter-spacing: -.01em; }
  .partida h3 span { color: var(--maiz); font-family: var(--mono); font-size: 12.5px; margin-right: 4px; font-variant-numeric: tabular-nums; }
  .partida p { color: var(--texto2); font-size: 14.5px; margin-top: 11px; line-height: 1.62; }
  .partida .mas { font-family: var(--mono); font-size: 11.5px; letter-spacing: .08em; color: var(--maiz); margin-top: 18px; display: block; }
  @media (hover: hover) and (pointer: fine) {
    .partida:hover { background: var(--noche3); border-color: var(--borde-int); box-shadow: 0 16px 32px -24px rgba(0,0,0,.95); }
  }

  /* ── cajas ── */
  .bloques { display: grid; gap: 16px; margin-top: 28px; }
  @media (min-width: 880px) { .bloques { grid-template-columns: 1fr 1fr; } }
  .caja { border: 1px solid var(--linea2); background: var(--noche2); padding: 26px 24px; }
  .claro .caja { border-color: var(--lineaClara); background: var(--papel2); }
  .caja h3 { font-size: 17.5px; }
  .caja h3 small { display: block; font-family: var(--mono); font-size: var(--t-mono); color: var(--maiz); letter-spacing: .12em; text-transform: uppercase; font-weight: 400; margin-bottom: 6px; }
  .claro .caja h3 small { color: var(--maiz-hondo); }
  .caja ul { margin-top: 14px; display: grid; gap: 3px; }
  .caja li { font-size: 14.5px; line-height: 1.68; color: var(--texto2); padding-left: 16px; position: relative; }
  .claro .caja li { color: var(--grafito); }
  .caja li::before { content: ""; position: absolute; left: 2px; top: .72em; width: 5px; height: 1px; background: var(--humo); }
  .claro .caja li::before { background: var(--borde-campo); }
  .caja li b { color: var(--hueso); } .claro .caja li b { color: var(--tinta); }
  .caja .ficha { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--linea); font-family: var(--mono); font-size: 11.5px; color: var(--humo); display: grid; gap: 5px; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
  .claro .caja .ficha { border-color: var(--lineaClara); color: var(--gris); }

  /* ── veredicto ── */
  .veredicto { display: grid; gap: 14px; margin-top: 26px; }
  @media (min-width: 780px) { .veredicto { grid-template-columns: repeat(3, 1fr); } }
  .v { border: 1px solid var(--lineaClara2); border-top: 3px solid; padding: 20px 20px 22px; background: var(--papel2); }
  .v b { display: block; text-transform: uppercase; font-size: 12.5px; letter-spacing: .1em; font-family: var(--mono); font-weight: 500; }
  .v p { font-size: 14px; line-height: 1.6; margin-top: 9px; color: var(--grafito); }
  .v-1 { border-top-color: var(--verde-hondo); } .v-1 b { color: var(--verde-hondo); }
  .v-2 { border-top-color: var(--maiz-hondo); } .v-2 b { color: var(--maiz-hondo); }
  .v-3 { border-top-color: var(--gris); } .v-3 b { color: var(--gris); }

  /* ── listas ── */
  .no li, .reglas li { font-size: 15px; line-height: 1.68; padding-left: 28px; position: relative; color: var(--texto2); }
  .claro .no li, .claro .reglas li { color: var(--grafito); }
  .no, .reglas { display: grid; gap: 13px; }
  .no li::before { content: "✕"; position: absolute; left: 0; top: 2px; color: var(--bugan-claro); font-size: 12px; }
  .claro .no li::before { color: var(--bugan-hondo); }
  .reglas li::before { content: ""; position: absolute; left: 0; top: .62em; width: 13px; height: 1px; background: var(--maiz); }
  .claro .reglas li::before { background: var(--maiz-hondo); }
  .reglas li b { color: var(--hueso); } .claro .reglas li b { color: var(--tinta); }

  .pronto { display: inline-block; font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--humo); border: 1px solid var(--borde-int); padding: 4px 9px; white-space: nowrap; }
  .claro .pronto { color: var(--gris); border-color: var(--borde-campo); }

  /* ── equipo ── */
  .equipo { display: grid; gap: 34px 26px; margin-top: 30px; align-items: start; }
  .ph {
    display: grid; place-items: center; text-align: center; min-height: 210px; padding: 20px; margin: 0;
    background: var(--papel2); outline: 1px dashed var(--borde-campo); outline-offset: -1px;
    color: var(--gris); font-family: var(--mono); font-size: 11px; letter-spacing: .13em; text-transform: uppercase; line-height: 2;
  }
  .persona { display: grid; gap: 22px 32px; align-content: start; }
  @media (min-width: 720px) { .persona { grid-template-columns: minmax(0, 306px) minmax(0, 1fr); align-items: start; } }
  .retrato {
    width: 100%; height: auto; max-width: 360px; display: block;
    outline: 1px solid var(--lineaClara2); outline-offset: -1px;
    box-shadow: 0 22px 44px -30px rgba(20,18,15,.85);
  }
  .persona .ph { min-height: 240px; }
  .persona h3 { font-family: var(--negra); font-weight: 400; text-transform: uppercase; font-size: 20px; line-height: 1.05; letter-spacing: -.012em; }
  .persona-rol { font-family: var(--serif); font-style: italic; font-size: 16px; color: var(--maiz-hondo); margin-top: 5px; padding-bottom: 3px; }
  .persona-cred { margin-top: 15px; display: grid; gap: 9px; }
  .persona-cred li { font-size: 14.5px; line-height: 1.62; color: var(--grafito); padding-left: 16px; position: relative; }
  .persona-cred li::before { content: ""; position: absolute; left: 0; top: .72em; width: 9px; height: 1px; background: var(--maiz-hondo); }
  .persona-web { margin-top: 18px; padding-top: 15px; box-shadow: inset 0 1px 0 var(--lineaClara2); }
  .persona-web a { font-family: var(--mono); font-size: 13px; letter-spacing: .04em; color: var(--maiz-hondo); text-decoration: none; display: inline-flex; align-items: center; min-height: 44px; border-bottom: 1px solid transparent; transition: border-color var(--rapido) var(--sal); }
  @media (hover: hover) and (pointer: fine) { .persona-web a:hover { border-bottom-color: var(--maiz-hondo); } }

  .uf { font-family: var(--mono); color: var(--maiz); font-size: 14.5px; white-space: nowrap; }
  .claro .uf { color: var(--maiz-hondo); }

  /* ── formulario ── */
  form { margin-top: 30px; }
  fieldset { border: 1px solid var(--lineaClara); padding: 24px 22px; margin: 0 0 16px; background: var(--papel2); }
  legend { font-family: var(--mono); font-size: var(--t-mono); letter-spacing: .15em; text-transform: uppercase; color: var(--maiz-hondo); padding-inline: 9px; }
  .campos { display: grid; gap: 18px; }
  @media (min-width: 680px) { .campos { grid-template-columns: 1fr 1fr; } .campo.ancho { grid-column: 1 / -1; } }
  .campo label { display: block; font-size: 13.5px; font-weight: 600; color: var(--tinta); margin-bottom: 7px; }
  .campo .ayuda { font-weight: 400; color: var(--gris); font-size: 12.5px; }
  input, select, textarea {
    width: 100%; font: inherit; font-size: 15px; padding: 11px 12px; min-height: 46px; color: var(--tinta);
    background: #fff; border: 1px solid var(--borde-campo); border-radius: 0; color-scheme: light;
    transition: border-color var(--rapido) var(--sal), box-shadow var(--rapido) var(--sal);
  }
  select { appearance: none; -webkit-appearance: none; padding-right: 38px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%235f584f' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 13px center; background-size: 12px; }
  textarea { min-height: 104px; resize: vertical; line-height: 1.6; }
  input::placeholder, textarea::placeholder { color: var(--gris); }
  input:disabled, select:disabled, textarea:disabled { background: #efebe2; color: var(--gris); cursor: not-allowed; }
  @media (hover: hover) and (pointer: fine) { input:hover, select:hover, textarea:hover { border-color: var(--gris); } }
  input:user-invalid, textarea:user-invalid { border-color: var(--error); box-shadow: inset 2px 0 0 var(--error); }
  .opciones { display: flex; flex-wrap: wrap; gap: 2px 18px; }
  .opciones label { display: flex; align-items: center; gap: 9px; font-weight: 400; font-size: 14.5px; margin: 0; min-height: 46px; padding-block: 2px; cursor: pointer; }
  .opciones input { width: 20px; height: 20px; min-height: 0; accent-color: var(--bugan-hondo); color-scheme: light; flex: none; cursor: pointer; }
  details.extra { border: 1px solid var(--lineaClara); background: var(--papel2); padding: 4px 22px; margin-bottom: 16px; }
  details.extra summary { cursor: pointer; font-weight: 700; color: var(--tinta); font-size: 15.5px; padding-block: 16px; min-height: 48px; display: flex; align-items: center; gap: 11px; list-style: none; }
  details.extra summary::-webkit-details-marker { display: none; }
  details.extra summary::before {
    content: ""; flex: none; width: 11px; height: 11px; border-right: 1.5px solid var(--maiz-hondo); border-bottom: 1.5px solid var(--maiz-hondo);
    transform: translateY(-2px) rotate(45deg); transition: transform var(--medio) var(--sal);
  }
  details.extra[open] summary::before { transform: translateY(1px) rotate(225deg); }
  details.extra[open] summary { box-shadow: inset 0 -1px 0 var(--lineaClara); margin-bottom: 4px; }
  details.extra[open] { padding-bottom: 20px; }
  .envio { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 24px; }
  .envio .btn { background: var(--tinta); color: var(--papel2); border-color: var(--tinta); }
  .envio .btn[data-cargando]::after { color: var(--papel2); }
  .envio .btn.sec { background: transparent; color: var(--tinta); border-color: var(--borde-campo); }
  .resumen { margin-top: 20px; }
  .resumen label { display: block; font-size: 13.5px; font-weight: 600; color: var(--tinta); margin-bottom: 7px; }
  .resumen textarea { font-family: var(--mono); font-size: 12.5px; min-height: 220px; background: #fff; }
  .aviso { margin-top: 14px; font-size: 13.5px; color: var(--gris); max-width: 68ch; line-height: 1.6; }
  .trampa { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .envio-estado {
    margin-top: 18px; max-width: 68ch; font-size: 14.5px; line-height: 1.6; color: var(--tinta);
    background: #fff; padding: 14px 16px; box-shadow: inset 3px 0 0 var(--verde-hondo);
  }
  .envio-estado[data-mal] { box-shadow: inset 3px 0 0 var(--error); }
  .envio-estado b { font-weight: 600; }


  /* ── política de privacidad (fragmento de Hanko, sin tocar su texto) ── */
  .politica { max-width: 78ch; overflow-wrap: break-word; }
  .politica article > h1 { font-family: var(--negra); font-weight: 400; text-transform: uppercase; font-size: var(--t-h1); line-height: .98; letter-spacing: -.022em; margin-left: -.02em; color: var(--tinta); text-shadow: var(--cartel); }
  .politica h2 { font-size: var(--t-h2); color: var(--tinta); margin-top: 52px; scroll-margin-top: 90px; }
  .politica h3 { font-size: 17.5px; color: var(--tinta); margin-top: 30px; }
  .politica p, .politica li { font-size: 16px; line-height: 1.72; color: var(--grafito); }
  .politica p { margin: 14px 0 0; }
  .politica strong { color: var(--tinta); font-weight: 700; }
  .politica em { font-style: italic; }
  .politica code { font-family: var(--mono); font-size: .86em; background: var(--papel); border: 1px solid var(--lineaClara); padding: 1px 5px; }
  .politica article > p:nth-of-type(1) { margin-top: 22px; font-family: var(--mono); font-size: var(--t-mono); letter-spacing: .13em; text-transform: uppercase; }
  .politica article > p:nth-of-type(1) strong { color: var(--maiz-hondo); font-weight: 500; }
  .politica article > p:nth-of-type(2) { margin-top: 4px; font-family: var(--mono); font-size: var(--t-mono); letter-spacing: .13em; text-transform: uppercase; color: var(--gris); }
  .politica article > p:nth-of-type(3) { font-size: var(--t-lead); line-height: 1.65; margin-top: var(--tras-titulo); }
  .politica ul, .politica ol { margin: 12px 0 0; padding-left: 0; }
  .politica ul > li { position: relative; padding-left: 20px; margin-top: 8px; }
  .politica ul > li::before { content: ""; position: absolute; left: 2px; top: .72em; width: 7px; height: 7px; background: var(--maiz-hondo); }
  .politica ul ul > li::before { background: transparent; box-shadow: inset 0 0 0 1.5px var(--maiz-hondo); }
  .politica ol { list-style: decimal; padding-left: 24px; }
  .politica ol > li { margin-top: 6px; padding-left: 4px; }
  .politica ol > li::marker { font-family: var(--mono); font-size: 13px; color: var(--maiz-hondo); }
  .politica hr { border: 0; border-top: 1px solid var(--lineaClara2); margin: 36px 0 0; }
  .politica .tabla { margin-top: 18px; background: var(--papel2); }
  .politica table { min-width: 560px; }
  .politica td { font-size: 14.5px; line-height: 1.6; }
  .politica a { color: var(--bugan-hondo); text-decoration-thickness: 1px; text-underline-offset: 3px; }
  .politica article > p:last-child { margin-top: 24px; }
  .politica article > p:last-child a { display: inline-flex; align-items: center; min-height: 48px; padding: 12px 20px; border: 1px solid var(--tinta); background: var(--tinta); color: var(--papel2); text-decoration: none; font-weight: 600; font-size: 14.5px; }
  @media (hover: hover) and (pointer: fine) {
    .politica a:hover { color: var(--tinta); }
    .politica article > p:last-child a:hover { background: #2a251f; color: var(--papel2); }
  }
  /* ── aviso de cookies ── */
  .pie-cookies { background: none; border: 0; padding: 0; font: inherit; color: inherit; cursor: pointer; min-height: 44px; }
  @media (hover: hover) and (pointer: fine) { .pie-cookies:hover { color: var(--hueso); } }
  .cookies { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; background: var(--noche2); border-top: 1px solid var(--linea2); box-shadow: 0 -18px 40px -24px rgba(0,0,0,.9); color: var(--texto); max-height: 80vh; overflow-y: auto; }
  .cookies[hidden] { display: none; }
  /* cerrado: una franja del mismo alto que la de slvm.cl (61 px movil, 55 px escritorio) */
  .cookies-in { display: block; padding-block: 6px; }
  .cookies-txt { min-width: 0; }
  .cookies-cab { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; column-gap: 10px; row-gap: 2px; }
  .cookies-titulo { margin: 0; flex: 0 0 auto; font-family: var(--mono); font-size: 11px; line-height: 1.2; letter-spacing: .1em; text-transform: uppercase; color: var(--maiz); white-space: nowrap; }
  .cookies-pol { margin: 0; flex: 1 1 auto; min-width: 0; font-size: 11px; line-height: 1.2; text-align: right; }
  .cookies-pol a { color: var(--hueso); text-underline-offset: 3px; }
  .ck-largo { display: none; }
  .cookies-acciones { display: flex; gap: 8px; align-items: center; margin-top: 4px; }
  .ck-btn { flex: 1 1 0; min-width: 0; justify-content: center; min-height: 28px; height: 28px; padding: 0 8px; font-size: 12px; }
  .ck-btn[hidden] { display: none; }
  @media (min-width: 760px) {
    .cookies-in { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-block: 9px; }
    .cookies-txt { flex: 1 1 auto; }
    .cookies-cab { flex-wrap: nowrap; column-gap: 12px; }
    .cookies-titulo { font-size: var(--t-mono); letter-spacing: .14em; }
    .cookies-pol { font-size: 11.5px; }
    .cookies-acciones { flex: 0 0 auto; margin-top: 0; gap: 10px; }
    .ck-btn { flex: 0 0 auto; min-width: 112px; min-height: 36px; height: 36px; font-size: 13.5px; }
  }
  @media (min-width: 1040px) { .cookies-in { gap: 28px; } .cookies-cab { column-gap: 18px; } .cookies-pol { font-size: 13.5px; } }
  @media (min-width: 1180px) { .ck-largo { display: inline; } }
  /* abierto: el detalle y las dos casillas se despliegan sobre la franja */
  .cookies-detalle { margin-top: 12px; }
  .cookies-detalle[hidden] { display: none; }
  .cookies-detalle > p { margin: 0; font-size: 14px; line-height: 1.6; max-width: 76ch; }
  .cookies-detalle a { color: var(--hueso); text-underline-offset: 3px; }
  .cookies-opciones { display: grid; gap: 4px; margin-top: 12px; }
  .cookies-opciones[hidden] { display: none; }
  .cookies-op { display: grid; grid-template-columns: auto 1fr; gap: 11px; align-items: start; font-size: 14px; line-height: 1.55; cursor: pointer; padding-block: 8px; max-width: 76ch; }
  .cookies-op input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--maiz); cursor: pointer; }
  .cookies-op b { color: var(--hueso); }
  .cookies[data-abierto] .cookies-in { display: block; padding-block: 18px 20px; }
  .cookies[data-abierto] .cookies-cab { display: block; }
  .cookies[data-abierto] .cookies-titulo { margin-bottom: 4px; font-size: var(--t-mono); letter-spacing: .14em; }
  .cookies[data-abierto] .cookies-pol { text-align: left; font-size: 14px; line-height: 1.6; max-width: 76ch; }
  .cookies[data-abierto] .ck-largo { display: inline; }
  .cookies[data-abierto] .cookies-acciones { margin-top: 18px; flex-wrap: wrap; }
  .cookies[data-abierto] .ck-btn { flex: 0 0 auto; min-width: 128px; min-height: 46px; height: auto; padding: 13px 22px; font-size: 15px; }
  body[data-cookies] .wa { display: none; }
  body[data-cookies] .pie { padding-bottom: 96px; }
  @media (min-width: 760px) { body[data-cookies] .pie { padding-bottom: 76px; } }
  @media (min-width: 560px) { .pie { padding-right: 176px; } }
  /* ── aviso de datos y casilla del cuestionario ── */
  .aviso-datos { margin-top: 22px; max-width: 68ch; padding: 16px 18px; background: var(--papel2); border: 1px solid var(--lineaClara); box-shadow: inset 3px 0 0 var(--maiz-hondo); }
  .aviso-datos p { margin: 0; font-size: 14px; line-height: 1.62; color: var(--grafito); }
  .aviso-datos p + p { margin-top: 8px; }
  .aviso-datos a, .aviso a { color: var(--bugan-hondo); text-underline-offset: 3px; }
  .consiente { margin: 20px 0 0; padding: 20px 22px 16px; background: var(--papel2); border: 1px solid var(--lineaClara); display: grid; gap: 10px; min-width: 0; }
  .consiente legend { display: flex; gap: 6px; align-items: baseline; }
  .consiente legend .req { color: var(--bugan-hondo); font-size: 14px; line-height: 0; }
  .consiente-aviso { margin: 0; font-size: 14px; line-height: 1.62; color: var(--grafito); max-width: 72ch; }
  .consiente-nota { margin: 2px 0 0; font-size: 13.5px; line-height: 1.5; color: var(--gris); }
  .casilla { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: start; }
  .casilla input[type="checkbox"] { width: 21px; height: 21px; min-height: 0; margin: 10px 0 0; padding: 0; flex: none; accent-color: var(--bugan-hondo); color-scheme: light; cursor: pointer; }
  .casilla label { display: block; font-size: 15px; line-height: 1.55; color: var(--tinta); cursor: pointer; padding-block: 9px; max-width: 64ch; text-wrap: pretty; }
  .casilla label a { color: var(--bugan-hondo); text-underline-offset: .22em; }
  .casilla input[aria-invalid="true"] { outline: 2px solid var(--error); outline-offset: 3px; }
  .casilla-err { margin: -6px 0 2px 33px; font-size: 13px; color: var(--error); font-weight: 600; }
  .casilla-err[hidden] { display: none; }
  .obligatorio { font-weight: 400; color: var(--gris); font-size: 12.5px; }
  /* ── cierre y pie ── */
  .cierre { padding-block: var(--sec-arriba) var(--sec-abajo); background: var(--bugan-fondo); color: #fff; }
  .cierre h1.page, .cierre h2 { color: #fff; }
  .cierre h1.page { text-shadow: .05em .05em 0 var(--noche); }
  .cierre p { color: #f9ecf1; }
  .cierre .nota-cierre { font-size: 14px; margin-top: 24px; color: #f3d7e0; max-width: 62ch; }
  .cierre .texto-cierre { font-size: 18px; line-height: 1.6; margin-top: 16px; max-width: 56ch; }
  .cierre .btn { background: var(--noche); color: var(--hueso); border-color: var(--noche); }
  .cierre .btn.ghost { background: transparent; border-color: rgba(255,255,255,.7); color: #fff; }
  .pie { padding-block: 24px 28px; color: var(--humo); font-size: 12.5px; display: flex; flex-wrap: wrap; gap: 10px 22px; border-top: 1px solid var(--linea); align-items: center; }
  .pie a { text-decoration: none; display: inline-flex; align-items: center; min-height: 44px; transition: color var(--rapido) var(--sal); }
  @media (hover: hover) and (pointer: fine) { .pie a:hover { color: var(--hueso); } }
  @media (max-width: 559px) { .pie { padding-bottom: 88px; } }

  /* ── WhatsApp ── */
  .wa {
    position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 60;
    display: flex; align-items: center; gap: 9px; text-decoration: none; min-height: 48px; padding: 12px 16px;
    background: #25d366; color: #08331b; font-weight: 700; font-size: 14px;
    box-shadow: 0 14px 30px -14px rgba(0,0,0,.85);
    transition: transform var(--medio) var(--sal), box-shadow var(--medio) var(--sal), background var(--rapido) var(--sal);
  }
  .wa svg { width: 20px; height: 20px; flex: none; }
  .wa span { display: none; }
  @media (min-width: 560px) { .wa span { display: inline; } }
  @media (hover: hover) and (pointer: fine) { .wa:hover { background: #1fbb59; box-shadow: 0 18px 34px -14px rgba(0,0,0,.9); } }
  @media (prefers-reduced-motion: no-preference) { .wa:active { transform: scale(.96); } }

  /* ── salto al contenido ── */
  .saltar { position: absolute; left: -9999px; top: 0; z-index: 90; background: var(--maiz); color: var(--noche); padding: 12px 18px; font-weight: 600; font-size: 14px; text-decoration: none; }
  .saltar:focus { left: 12px; top: 12px; }

  /* ── utilidades de ritmo ── */
  .esp-xs { margin-top: 12px; }
  .esp-s  { margin-top: 16px; }
  .esp-m  { margin-top: 22px; }
  .esp-l  { margin-top: 28px; }
  .esp-xxl{ margin-top: clamp(44px, 6.5vw, 72px); }
  .ancho-todo { grid-column: 1 / -1; }

  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  }

  /* v3.5: cada sección es una página; el cambio entre ellas se funde como antes */
  @view-transition { navigation: auto; }
  @media (prefers-reduced-motion: reduce) { @view-transition { navigation: none; } }