/* answers.css - la seccion de RESPUESTAS del plan organico.
 *
 * Nace con la segunda pagina, no con la primera: dos copias del mismo CSS se separan
 * solas, y estan previstas entre doce y quince paginas. Misma leccion que la lista de
 * paginas y que los umbrales de la ley de luz.
 *
 * Tokens identicos a los del resto del sitio. Sin cursiva en ningun sitio: el resalte
 * de la casa se hace con color y con peso. */
:root{
    --bg0:#f6f8fb; --bg1:#ffffff;
    --optic:#0e1420; --ice:#2f6fb8; --steel:#5a7fb0;
    --muted:#4d5a70; --faint:#8a97ab;
    --line:rgba(15,40,85,.12); --line-2:rgba(15,40,85,.2);
    --sans:'Inter',system-ui,-apple-system,sans-serif;
  }
  *,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
  body{background:var(--bg0);color:var(--optic);font-family:var(--sans);font-weight:400;line-height:1.7;-webkit-font-smoothing:antialiased}
  .aura{position:fixed;inset:0;z-index:0;pointer-events:none;background:
    radial-gradient(60% 45% at 15% 4%,rgba(47,111,184,.10),transparent 70%),
    radial-gradient(50% 40% at 90% 16%,rgba(0,229,255,.06),transparent 72%)}
  .topbar{position:relative;z-index:2;border-bottom:1px solid var(--line);background:rgba(246,248,251,.82);backdrop-filter:blur(8px)}
  .topbar .wrap{display:flex;align-items:center;justify-content:space-between;padding:16px 26px}
  /* LA MARCA ES EL LOGO DE CRISTAL, NO UN ROTULO DE TEXTO (2026-08-29).
     Estas paginas nacieron con la marca escrita en Archivo y el resto del sitio
     lleva la B de cristal. El dueno lo vio a la primera. La regla de la casa es que
     un desconocido debe poder poner diez piezas nuestras en una mesa y saber que son
     de la misma casa, y el ADN visual es el CRISTAL, no una tipografia.
     Mismo fichero y misma altura que la nav de la home: no se aproxima, se copia. */
  .brand{display:inline-flex;line-height:0;flex:none;text-decoration:none}
  .brand img{display:block;height:34px;width:auto}
  .topbar a.back{color:var(--muted);text-decoration:none;font-size:.92rem;font-weight:500}
  .topbar a.back:hover{color:var(--ice)}
  main{position:relative;z-index:1}
  .wrap{max-width:760px;margin:0 auto;padding:0 26px}
  .crumb{color:var(--faint);font-size:.86rem;letter-spacing:.06em;text-transform:uppercase;margin:56px 0 18px}
  h1{font-size:clamp(1.85rem,5.6vw,2.7rem);font-weight:600;letter-spacing:-.022em;line-height:1.18}
  .standfirst{margin-top:22px;font-size:1.12rem;color:var(--muted)}
  .answer{margin:36px 0 8px;padding:24px 26px;border:1px solid var(--line-2);border-left:3px solid var(--ice);background:var(--bg1);border-radius:4px}
  .answer .lbl{display:block;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ice);font-weight:600;margin-bottom:10px}
  h2{margin:52px 0 16px;font-size:clamp(1.25rem,3.6vw,1.55rem);font-weight:600;letter-spacing:-.015em;line-height:1.3}
  h3{margin:32px 0 10px;font-size:1.06rem;font-weight:600}
  p{margin:16px 0;color:var(--muted)}
  p strong,li strong{color:var(--optic);font-weight:600}
  ul,ol{margin:16px 0 16px 20px;color:var(--muted)}
  li{margin:9px 0;padding-left:4px}
  .sums{margin:26px 0;border-top:1px solid var(--line);width:100%;border-collapse:collapse;display:block;overflow-x:auto}
  .sums table{width:100%;border-collapse:collapse;min-width:420px}
  .sums td,.sums th{border-bottom:1px solid var(--line);padding:12px 14px 12px 0;text-align:left;font-size:.98rem;color:var(--muted)}
  .sums th{color:var(--optic);font-weight:600}
  .sums td.n{font-variant-numeric:tabular-nums;color:var(--optic);font-weight:500}
  .nota{margin:22px 0;padding:16px 18px;border:1px dashed var(--line-2);border-radius:4px;font-size:.94rem;color:var(--faint)}
  .qa{padding:26px 0;border-bottom:1px solid var(--line)}
  .qa h3{margin:0 0 10px}
  .cierre{margin:60px 0 0;padding:30px 0 0;border-top:1px solid var(--line-2)}
  .btn{display:inline-block;margin-top:18px;padding:14px 26px;background:var(--optic);color:#fff;text-decoration:none;border-radius:3px;font-weight:600;font-size:.98rem}
  .btn:hover{background:var(--ice)}
  .sig{margin-top:14px;font-size:.9rem;color:var(--faint)}
  footer{position:relative;z-index:1;margin-top:72px;border-top:1px solid var(--line);padding:28px 26px 46px;text-align:center;color:var(--faint);font-size:.88rem}
  footer a{color:var(--muted);text-decoration:none}
  footer a:hover{color:var(--ice)}
  @media(max-width:640px){.crumb{margin-top:38px}.answer{padding:20px}}
