/* ============================================================================
   Tomiqo — landing de captación
   Dirección visual: "pista de noche". La pista de pádel española se juega de
   21:00 a 23:00, en una caja de cristal bajo focos. Ese es el fondo: verde
   petróleo, líneas de cal, y un único amarillo de bola como acento.
   El plan que genera Tomiqo aparece encima en papel hueso: el desorden es
   oscuro, el plan es claro. Esa es toda la tesis del producto en dos superficies.
   ========================================================================= */

:root {
  /* superficies */
  --pista:    #0B3238;   /* césped bajo focos */
  --pista-2:  #0E3D45;   /* superficie elevada */
  --pista-3:  #16535D;   /* bordes */
  --plan:     #EFEDE2;   /* papel hueso: el plan generado */
  --plan-2:   #E1DECF;

  /* tinta */
  --linea:    #EAF0EC;   /* línea de cal: texto sobre pista */
  --cal:      #8AA7A4;   /* cristal: texto secundario */
  --tinta:    #14262A;   /* texto sobre papel */
  --tinta-2:  #5C6E70;

  /* los dos polos del grupo desigual. No son decoración: son los dos extremos
     del nivel dentro de un mismo grupo, y se usan solo para eso. */
  --bola:     #D6F24E;   /* el que va justo */
  --barro:    #E0663C;   /* el que va sobrado */
  /* Los mismos dos acentos, para fondo claro. Sobre papel hueso el amarillo bola
     da 1,07:1 —invisible— y el naranja 2,91:1. Estos dos pasan AA (>4,5) sobre las
     cuatro superficies claras de la marca: papel, aviso y los dos chips. */
  --bola-papel:  #4C620D;
  --barro-papel: #9C3C1B;

  /* nombres que esperan los SVG de marca, enganchados a los tokens de arriba */
  --tomiqo-bola:    var(--bola);
  --tomiqo-costura: var(--pista);

  --radio:    3px;
  --ancho:    1180px;
  --tipo-display: "Familjen Grotesk", ui-sans-serif, system-ui, sans-serif;
  --tipo-texto:   "Instrument Sans", ui-sans-serif, system-ui, sans-serif;
  --tipo-dato:    "Martian Mono", ui-monospace, "SFMono-Regular", monospace;
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  background: var(--pista);
  color: var(--linea);
  font-family: var(--tipo-texto);
  font-size: 17px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3 {
  font-family: var(--tipo-display);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.02;
  margin: 0;
  text-wrap: balance;
}

p { margin: 0; text-wrap: pretty; }

a { color: inherit; }

:focus-visible {
  outline: 2px solid var(--bola);
  outline-offset: 3px;
  border-radius: 2px;
}

.envoltura { width: 100%; max-width: var(--ancho); margin-inline: auto; padding-inline: 24px; }

/* etiqueta de utilidad: siempre monoespaciada, siempre pequeña, siempre en mayúscula */
.rotulo {
  font-family: var(--tipo-dato);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--cal);
  display: block;
}

/* ─────────────────────────────── barra ──────────────────────────────── */
.barra {
  position: sticky; top: 0; z-index: 60;
  background: color-mix(in srgb, var(--pista) 88%, transparent);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid color-mix(in srgb, var(--pista-3) 60%, transparent);
}
.barra__interior { display: flex; align-items: center; justify-content: space-between; height: 58px; }
.marca { display: flex; align-items: center; gap: 9px; text-decoration: none; }
.marca__simbolo { width: 21px; height: 21px; flex: none; }
.marca__nombre { font-family: var(--tipo-display); font-weight: 700; font-size: 20px; letter-spacing: -0.04em; }
.marca__estado {
  font-family: var(--tipo-dato); font-size: 9px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--bola);
  border: 1px solid color-mix(in srgb, var(--bola) 35%, transparent);
  border-radius: 999px; padding: 3px 8px 2px; white-space: nowrap;
}

/* ─────────────────────────────── botones ────────────────────────────── */
.boton {
  font-family: var(--tipo-texto); font-size: 16px; font-weight: 600;
  border-radius: var(--radio); border: 1px solid transparent;
  padding: 14px 22px; cursor: pointer;
  display: inline-flex; align-items: center; gap: 10px;
  transition: background-color .16s ease, color .16s ease, border-color .16s ease, transform .16s ease;
}
.boton:active { transform: translateY(1px); }
.boton[disabled] { opacity: .4; cursor: not-allowed; }

.boton--primario { background: var(--bola); color: #10251A; }
.boton--primario:hover:not([disabled]) { background: color-mix(in srgb, var(--bola) 82%, #fff); }

.boton--fantasma { background: transparent; color: var(--linea); border-color: var(--pista-3); }
.boton--fantasma:hover:not([disabled]) { border-color: var(--cal); background: color-mix(in srgb, var(--pista-2) 70%, transparent); }

.boton--papel { background: var(--tinta); color: var(--plan); }
.boton--papel:hover:not([disabled]) { background: #24393E; }

.boton--enlace {
  background: none; border: none; padding: 0;
  font-size: 14px; color: var(--cal); text-decoration: underline;
  text-underline-offset: 4px; cursor: pointer;
}
.boton--enlace:hover { color: var(--linea); }

/* ─────────────────────────────── hero ───────────────────────────────── */
.hero { padding: clamp(48px, 9vw, 104px) 0 clamp(40px, 6vw, 72px); }
.hero__rejilla {
  display: grid; gap: clamp(32px, 5vw, 64px);
  grid-template-columns: minmax(0, 1.02fr) minmax(0, 1fr);
  align-items: center;
}
.hero__titulo {
  font-size: clamp(42px, 6.4vw, 76px);
  margin: 18px 0 0;
}
.hero__titulo em { font-style: normal; color: var(--bola); }
.hero__entrada {
  margin-top: 22px; font-size: clamp(17px, 1.9vw, 20px);
  color: var(--cal); max-width: 46ch;
}
.hero__entrada strong { color: var(--linea); font-weight: 600; }
.hero__acciones { margin-top: 32px; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.hero__nota { font-family: var(--tipo-dato); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--cal); }

/* la pista: el objeto más característico del oficio, y el enunciado del problema */
.pista-svg { width: 100%; height: auto; display: block; }
.pista-svg .cesped { fill: var(--pista-2); }
.pista-svg .cal { stroke: color-mix(in srgb, var(--linea) 45%, transparent); stroke-width: .7; fill: none; }
.pista-svg .cristal { stroke: var(--pista-3); stroke-width: 2; fill: none; }
.pista-svg .red { stroke: var(--linea); stroke-width: 1.1; stroke-dasharray: 2 1.6; opacity: .75; }
.pista-svg .etiqueta { font-family: var(--tipo-dato); font-size: 4.4px; letter-spacing: .06em; fill: var(--cal); text-transform: uppercase; }
.pista-svg .trazo {
  stroke: var(--bola); stroke-width: .9; fill: none; opacity: .85;
  stroke-dasharray: 60; stroke-dashoffset: 60;
  animation: trazar 5.2s ease-in-out infinite;
}
.pista-svg .trazo:nth-of-type(2) { animation-delay: .5s; }
.pista-svg .trazo:nth-of-type(3) { animation-delay: 1s; }
.pista-svg .trazo:nth-of-type(4) { animation-delay: 1.5s; }
@keyframes trazar {
  0%   { stroke-dashoffset: 60; opacity: 0; }
  12%  { opacity: .9; }
  40%  { stroke-dashoffset: 0; opacity: .9; }
  62%  { stroke-dashoffset: 0; opacity: 0; }
  100% { stroke-dashoffset: 0; opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .pista-svg .trazo { animation: none; stroke-dashoffset: 0; opacity: .5; }
}
.pista-pie {
  margin-top: 14px; display: flex; gap: 20px; flex-wrap: wrap;
  font-family: var(--tipo-dato); font-size: 9.5px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--cal);
}
.pista-pie span { display: inline-flex; align-items: center; gap: 7px; }
.pista-pie i { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }

/* ─────────────────────────── secciones ──────────────────────────────── */
.seccion { padding: clamp(56px, 8vw, 96px) 0; }
.seccion--alto { background: var(--pista-2); border-block: 1px solid var(--pista-3); }
.seccion__cabecera { max-width: 62ch; margin-bottom: 40px; }
.seccion__titulo { font-size: clamp(30px, 4vw, 44px); margin-top: 14px; }
.seccion__entrada { margin-top: 16px; color: var(--cal); }

/* ─────────────────────────── generador ──────────────────────────────── */
.generador {
  background: var(--pista-2);
  border: 1px solid var(--pista-3);
  border-radius: var(--radio);
  overflow: hidden;
}
.generador__pasos {
  display: flex; gap: 0; border-bottom: 1px solid var(--pista-3);
}
.paso-pestana {
  flex: 1; background: none; border: none; cursor: pointer;
  padding: 16px 18px; text-align: left; color: var(--cal);
  border-right: 1px solid var(--pista-3);
  font-family: var(--tipo-texto); font-size: 15px; font-weight: 600;
  transition: color .16s ease, background-color .16s ease;
}
.paso-pestana:last-child { border-right: none; }
.paso-pestana:hover:not([disabled]) { color: var(--linea); }
.paso-pestana[aria-selected="true"] { color: var(--linea); background: color-mix(in srgb, var(--bola) 7%, transparent); }
.paso-pestana[disabled] { opacity: .45; cursor: not-allowed; }
.paso-pestana .rotulo { margin-bottom: 5px; }
.paso-pestana[aria-selected="true"] .rotulo { color: var(--bola); }

.paso-panel { padding: clamp(24px, 3.4vw, 40px); }
.paso-panel[hidden] { display: none; }
.campo + .campo { margin-top: 34px; }
.campo__titulo { font-size: 19px; font-weight: 600; margin-bottom: 4px; font-family: var(--tipo-display); letter-spacing: -.02em; }
.campo__ayuda { font-size: 14px; color: var(--cal); margin-bottom: 16px; }

.opciones { display: flex; gap: 8px; flex-wrap: wrap; }
.opcion {
  font-family: var(--tipo-texto); font-size: 15px; font-weight: 500;
  background: transparent; color: var(--cal);
  border: 1px solid var(--pista-3); border-radius: var(--radio);
  padding: 10px 16px; cursor: pointer;
  transition: color .14s ease, border-color .14s ease, background-color .14s ease;
}
.opcion:hover { color: var(--linea); border-color: var(--cal); }
.opcion[aria-pressed="true"] {
  color: #10251A; background: var(--bola); border-color: var(--bola); font-weight: 600;
}

.opciones--bloque { display: grid; grid-template-columns: repeat(auto-fit, minmax(196px, 1fr)); gap: 8px; }
.opcion--bloque { text-align: left; padding: 14px 16px; }
.opcion--bloque b { display: block; font-weight: 600; font-size: 15px; }
.opcion--bloque small { display: block; margin-top: 3px; font-size: 12.5px; opacity: .72; line-height: 1.35; }

.paso-pie {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  margin-top: 36px; padding-top: 22px; border-top: 1px solid var(--pista-3);
  flex-wrap: wrap;
}

/* el control firma: no eliges "un nivel", eliges la horquilla que hay dentro
   de tu grupo. La distancia entre los dos pulgares ES el problema del producto. */
.horquilla { margin-top: 8px; }
.horquilla__carril {
  position: relative; height: 46px; margin: 0 11px;
  touch-action: none;
}
.horquilla__base {
  position: absolute; top: 21px; left: -11px; right: -11px; height: 4px;
  background: var(--pista); border: 1px solid var(--pista-3); border-radius: 999px;
}
.horquilla__tramo {
  position: absolute; top: 21px; height: 4px; border-radius: 999px;
  background: linear-gradient(90deg, var(--bola), var(--barro));
}
.horquilla__pulgar {
  position: absolute; top: 12px; width: 22px; height: 22px; margin-left: -11px;
  border-radius: 50%; border: 3px solid var(--pista-2); cursor: grab;
  background: var(--bola); padding: 0;
}
.horquilla__pulgar[data-extremo="alto"] { background: var(--barro); }
.horquilla__pulgar:active { cursor: grabbing; }
.horquilla__escala {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; margin-top: 2px;
}
.horquilla__escala span {
  font-family: var(--tipo-dato); font-size: 9px; letter-spacing: .04em;
  text-transform: uppercase; color: var(--cal); text-align: center;
  transition: color .16s ease;
}
.horquilla__escala span[data-dentro="si"] { color: var(--linea); }
.horquilla__lectura {
  margin-top: 14px; font-size: 14.5px; color: var(--cal);
  border-left: 2px solid var(--pista-3); padding-left: 14px; min-height: 42px;
}
.horquilla__lectura b { color: var(--linea); font-weight: 600; }

/* ───────────────────────── el plan generado ─────────────────────────── */
.resultado { padding-bottom: clamp(56px, 8vw, 96px); }
.resultado[hidden] { display: none; }

.plan {
  background: var(--plan); color: var(--tinta);
  border-radius: var(--radio); overflow: hidden;
  box-shadow: 0 24px 60px -28px rgba(0,0,0,.75);
}
.plan__cabecera {
  padding: clamp(24px, 3.2vw, 36px);
  border-bottom: 1px solid var(--plan-2);
  display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; flex-wrap: wrap;
}
.plan__rotulo {
  font-family: var(--tipo-dato); font-size: 10px; letter-spacing: .16em;
  text-transform: uppercase; color: var(--tinta-2); display: flex;
  align-items: center; gap: 8px;
}
/* Sobre papel hueso el amarillo bola desaparece: aquí manda la variante oscura. */
.plan__simbolo {
  width: 17px; height: 17px; flex: none; color: var(--tinta);
  --tomiqo-bola: var(--bola-papel); --tomiqo-costura: var(--plan);
}
.plan__titulo { font-size: clamp(25px, 3vw, 34px); margin-top: 10px; color: var(--tinta); }
.plan__meta { display: flex; gap: 26px; flex-wrap: wrap; margin-top: 16px; }
.plan__meta div { min-width: 74px; }
.plan__meta b { display: block; font-family: var(--tipo-dato); font-size: 15px; font-weight: 600; margin-top: 3px; color: var(--tinta); }

.plan__aviso {
  margin: 0 clamp(24px, 3.2vw, 36px); margin-top: clamp(20px, 2.6vw, 28px);
  background: color-mix(in srgb, var(--barro) 11%, transparent);
  border-left: 3px solid var(--barro);
  padding: 14px 18px; font-size: 14.5px; color: var(--tinta);
}
.plan__aviso[hidden] { display: none; }
/* El naranja de marca sobre fondo claro da 2,6:1 y no llega a AA. En papel
   manda siempre la variante oscura: --barro-papel. */
.plan__aviso b { display: block; font-family: var(--tipo-dato); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--barro-papel); margin-bottom: 5px; }

.bloques { padding: clamp(20px, 2.6vw, 28px) clamp(24px, 3.2vw, 36px) clamp(28px, 3.6vw, 40px); }

.bloque {
  display: grid; grid-template-columns: 74px minmax(0, 1fr); gap: 20px;
  padding: 24px 0; border-top: 1px solid var(--plan-2);
}
.bloque:first-child { border-top: none; padding-top: 6px; }
.bloque__reloj { font-family: var(--tipo-dato); font-size: 13px; font-weight: 600; color: var(--tinta); padding-top: 2px; }
.bloque__reloj small { display: block; font-size: 9.5px; font-weight: 400; letter-spacing: .1em; text-transform: uppercase; color: var(--tinta-2); margin-top: 5px; }
.bloque__tipo { font-family: var(--tipo-dato); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-2); }
.bloque__titulo { font-family: var(--tipo-display); font-size: 21px; font-weight: 700; letter-spacing: -.02em; margin: 7px 0 0; color: var(--tinta); }
.bloque__texto { margin-top: 9px; font-size: 15.5px; line-height: 1.5; color: #2E4247; }
.bloque__cola { margin-top: 12px; font-size: 13px; color: var(--tinta-2); }
.bloque__cola b { font-weight: 600; color: #2E4247; }

.ejercicio + .ejercicio { margin-top: 26px; padding-top: 22px; border-top: 1px dashed var(--plan-2); }

/* las dos adaptaciones: mismo ejercicio, dos consignas. Es el producto entero. */
.ajustes { display: grid; grid-template-columns: repeat(auto-fit, minmax(232px, 1fr)); gap: 10px; margin-top: 14px; }
.ajuste { padding: 12px 14px; border-radius: var(--radio); font-size: 14px; line-height: 1.45; }
.ajuste--justo   { background: color-mix(in srgb, var(--bola) 26%, var(--plan)); }
.ajuste--sobrado { background: color-mix(in srgb, var(--barro) 15%, var(--plan)); }
.ajuste b {
  display: block; font-family: var(--tipo-dato); font-size: 9.5px; letter-spacing: .1em;
  text-transform: uppercase; margin-bottom: 6px; color: #3A4C4F;
}

/* ─────────────────────── el muro de email ───────────────────────────── */
.muro { position: relative; }
.muro__velo {
  filter: blur(7px); opacity: .5; pointer-events: none; user-select: none;
  max-height: 300px; overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 34%, transparent 96%);
          mask-image: linear-gradient(to bottom, #000 0%, #000 34%, transparent 96%);
}
.captura {
  position: relative; margin: -150px clamp(24px, 3.2vw, 36px) 0;
  background: var(--tinta); color: var(--plan);
  border-radius: var(--radio); padding: clamp(26px, 3.4vw, 38px);
  box-shadow: 0 20px 50px -24px rgba(0,0,0,.8);
}
.captura__titulo { font-size: clamp(23px, 2.6vw, 29px); color: var(--plan); }
.captura__entrada { margin-top: 12px; color: #A9BCBD; font-size: 15.5px; max-width: 54ch; }
.captura__rejilla { display: grid; grid-template-columns: repeat(auto-fit, minmax(216px, 1fr)); gap: 14px; margin-top: 26px; }
.captura__ancho { grid-column: 1 / -1; }

.entrada { display: block; }
.entrada > span { font-family: var(--tipo-dato); font-size: 9.5px; letter-spacing: .12em; text-transform: uppercase; color: #8FA3A4; display: block; margin-bottom: 7px; }
.entrada input, .entrada select, .entrada textarea {
  width: 100%; font-family: var(--tipo-texto); font-size: 15.5px;
  background: #1D3237; color: var(--plan);
  border: 1px solid #2F484D; border-radius: var(--radio);
  padding: 12px 14px;
}
.entrada input::placeholder, .entrada textarea::placeholder { color: #6C8385; }
.entrada input:focus, .entrada select:focus, .entrada textarea:focus { border-color: var(--bola); outline: none; }
.entrada select { appearance: none; cursor: pointer; }
.entrada--error input, .entrada--error select { border-color: var(--barro); }
/* Ojo con la especificidad: `.entrada > span` (0,1,1) le gana a `.entrada__error`
   (0,1,0), así que el error hay que apagarlo con al menos la misma fuerza o se
   queda visible desde el primer render. */
.entrada .entrada__error,
.entrada > span.entrada__error,
.consentimiento .entrada__error { display: none; }

.entrada--error .entrada__error,
.entrada--error > span.entrada__error { display: block; }

.entrada__error {
  font-family: var(--tipo-texto); font-size: 13px; font-weight: 400;
  letter-spacing: 0; text-transform: none;
  color: var(--barro); margin: 6px 0 0;
}

.consentimiento { display: flex; gap: 11px; align-items: flex-start; font-size: 13.5px; color: #A9BCBD; margin-top: 22px; line-height: 1.45; }
.consentimiento input { margin: 3px 0 0; accent-color: var(--bola); width: 17px; height: 17px; flex: none; }

.captura__fallo {
  margin-top: 20px; padding: 12px 15px; font-size: 14.5px; line-height: 1.45;
  color: var(--plan); border-left: 3px solid var(--barro);
  background: color-mix(in srgb, var(--barro) 22%, transparent);
}
.captura__fallo[hidden] { display: none; }

.captura__pie { margin-top: 24px; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.captura__legal { font-size: 12.5px; color: #7B9092; }

.gracias { text-align: left; }
.gracias[hidden] { display: none; }
.gracias__titulo { font-size: clamp(23px, 2.6vw, 29px); color: var(--plan); }
.gracias__texto { margin-top: 12px; color: #A9BCBD; max-width: 56ch; }
.gracias__acciones { margin-top: 24px; display: flex; gap: 12px; flex-wrap: wrap; }

/* ────────────────────────── prueba y límites ────────────────────────── */
.datos { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 1px; background: var(--pista-3); border: 1px solid var(--pista-3); }
.dato { background: var(--pista); padding: 26px 24px; }
.dato b { display: block; font-family: var(--tipo-display); font-size: 40px; font-weight: 700; letter-spacing: -.045em; line-height: 1; }
.dato p { margin-top: 10px; font-size: 14.5px; color: var(--cal); }

.limites { display: grid; grid-template-columns: repeat(auto-fit, minmax(258px, 1fr)); gap: 26px; }
.limite { border-top: 2px solid var(--barro); padding-top: 16px; }
.limite h3 { font-size: 19px; }
.limite p { margin-top: 9px; font-size: 15px; color: var(--cal); }

.cierre { text-align: center; padding: clamp(64px, 9vw, 112px) 0; }
.cierre__titulo { font-size: clamp(32px, 5vw, 54px); max-width: 20ch; margin-inline: auto; }
.cierre__acciones { margin-top: 32px; }

.pie { border-top: 1px solid var(--pista-3); padding: 30px 0 44px; }
.pie__interior { display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; align-items: center; }
.pie__texto { font-size: 13px; color: var(--cal); max-width: 62ch; }
.pie__enlace {
  font-family: var(--tipo-dato); font-size: 10px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--cal); text-decoration: none;
  border: 1px solid var(--pista-3); border-radius: 3px; padding: 8px 14px;
  transition: color .15s ease, border-color .15s ease;
}
.pie__enlace:hover { color: var(--linea); border-color: var(--cal); }

/* ────────────────────────────── móvil ───────────────────────────────── */
@media (max-width: 900px) {
  .hero__rejilla { grid-template-columns: 1fr; }
  .generador__pasos { flex-direction: column; }
  .paso-pestana { border-right: none; border-bottom: 1px solid var(--pista-3); }
  .paso-pestana:last-child { border-bottom: none; }
}
@media (max-width: 620px) {
  body { font-size: 16px; }
  /* El hero ya tiene su propio botón dos dedos más abajo: en móvil el de la
     barra solo servía para partir el nombre de marca en dos líneas. */
  .barra .boton--fantasma { display: none; }
  /* En una columna, el flex de la ficha dejaba huecos irregulares entre datos. */
  .plan__meta { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px 18px; }
  .bloque { grid-template-columns: 1fr; gap: 10px; }
  .bloque__reloj { display: flex; align-items: baseline; gap: 10px; }
  .bloque__reloj small { margin-top: 0; }
  .captura { margin-inline: 16px; margin-top: -120px; }
  .paso-pie { flex-direction: column; align-items: stretch; }
  .paso-pie .boton { justify-content: center; }
}

/* ───────────────────── impresión: el plan a pista ───────────────────── */
@media print {
  .barra, .hero, .seccion, .cierre, .pie, .captura, .plan__acciones { display: none !important; }
  body { background: #fff; color: #000; font-size: 11pt; }
  .resultado { padding: 0; }
  .plan { box-shadow: none; background: #fff; }
  .muro__velo { filter: none; opacity: 1; max-height: none; -webkit-mask-image: none; mask-image: none; }
  .ajuste--justo   { background: #F2F6DC; border: 1px solid #D9E39C; }
  .ajuste--sobrado { background: #FBEAE3; border: 1px solid #EFC5B3; }
  .bloque { break-inside: avoid; }
}