@font-face{font-family:"Bricolage Grotesque";src:url("/assets/fonts/bricolage-latin.woff2") format("woff2");font-weight:400 800;font-style:normal;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url("/assets/fonts/instrument-latin.woff2") format("woff2");font-weight:400 600;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("/assets/fonts/plexmono-400-latin.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("/assets/fonts/plexmono-500-latin.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
/* =========================================================
   RELEVA WEB V0 — prototipo de referencia
   Tokens derivados de src/styles.css (app) + RELEVA_Deck (20/09/2026). v2: revisión narrativa 24/09.
   Diseño de un solo tema por decisión: la marca vive en papel + noche.
   ========================================================= */
:root{
  color-scheme: light;
  /* color */
  --papel:#F4F2EC;          /* fondo cálido del deck */
  --papel-2:#ECE9E1;        /* superficie hundida sobre papel */
  --blanco:#FFFFFF;
  --noche:#1B2450;          /* fondo-oscuro de la app / deck */
  --noche-2:#243063;        /* superficie sobre noche */
  --indigo:#2F3D8F;         /* acción primaria */
  --lavanda:#AEB6E6;        /* píldora inferior del isotipo */
  --indigo-suave:#EEF0FA;
  --naranja:#E8622A;        /* testigo: solo acento, nunca texto pequeño */
  --naranja-suave:#FDF0EA;
  --tinta:#14151C;
  --tinta-60:#5A5D6B;
  --linea:#DDD9CF;          /* línea sobre papel */
  --linea-noche:rgba(174,182,230,.22);
  --error:#B42318;
  --exito:#1F6B45;
  /* tipografía */
  --f-display:"Bricolage Grotesque", "Arial Narrow", ui-sans-serif, system-ui, sans-serif;
  --f-sans:"Instrument Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-mono:"IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --t-hero:clamp(2.5rem, 1.55rem + 4.1vw, 5rem);
  --t-h2:clamp(1.75rem, 1.3rem + 1.9vw, 3rem);
  --t-h3:clamp(1.25rem, 1.15rem + .45vw, 1.5rem);
  --t-lead:clamp(1.0625rem, 1rem + .3vw, 1.25rem);
  --t-body:1rem;
  --t-small:.875rem;
  --t-label:.75rem;
  /* espacio (base 4) */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:64px; --s9:96px; --s10:128px;
  --gutter:20px;
  --max:1200px;
  --sec:clamp(64px, 40px + 6vw, 128px);  /* padding vertical de sección */
  /* forma */
  --r:12px; --r-lg:20px; --r-pill:999px;
  --btn-h:52px;
  /* movimiento */
  --ease:cubic-bezier(.4,0,.2,1);
  --t-fast:120ms; --t-mid:240ms; --t-slow:600ms;
}
@media (min-width:640px){ :root{ --gutter:32px; } }
@media (min-width:1024px){ :root{ --gutter:48px; } }

*,*::before,*::after{ box-sizing:border-box; }
[hidden]{ display:none!important; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } *{ animation:none!important; transition:none!important; } }
body{
  margin:0; background:var(--papel); color:var(--tinta);
  font-family:var(--f-sans); font-size:var(--t-body); line-height:1.55;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img,svg{ max-width:100%; }
a{ color:inherit; }
:focus-visible{ outline:3px solid var(--naranja); outline-offset:3px; border-radius:6px; }
.sr-only{ position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.wrap{ width:100%; max-width:calc(var(--max) + 2*var(--gutter)); margin-inline:auto; padding-inline:var(--gutter); }

/* ---------- tipografía ---------- */
h1,h2,h3{ font-family:var(--f-display); font-weight:750; letter-spacing:-.022em; line-height:1.02; margin:0; text-wrap:balance; font-variation-settings:"opsz" 96; }
h1{ font-size:var(--t-hero); font-weight:800; letter-spacing:-.028em; }
h2{ font-size:var(--t-h2); line-height:1.05; }
h3{ font-size:var(--t-h3); line-height:1.15; letter-spacing:-.02em; font-variation-settings:"opsz" 36; }
p{ margin:0; text-wrap:pretty; }
.lead{ font-size:var(--t-lead); line-height:1.5; color:var(--tinta-60); max-width:36em; }
.label{ font-family:var(--f-mono); font-size:var(--t-label); font-weight:500; letter-spacing:.14em; text-transform:uppercase; line-height:1.3; }
.muted{ color:var(--tinta-60); }
.acento{ color:var(--naranja); }

/* ---------- marca ---------- */
.marca{ display:inline-flex; align-items:center; gap:.42em; text-decoration:none; color:var(--indigo); font-size:28px; line-height:1; --iso-top:var(--indigo); --iso-bottom:var(--lavanda); }
.marca img{ display:block; width:116px; height:auto; max-width:none; }
.marca--negativo img{ width:132px; }
.wordmark{ font-family:var(--f-display); font-weight:800; font-variation-settings:"opsz" 96, "wdth" 86; letter-spacing:-.04em; display:inline-flex; align-items:baseline; }
.testigo{ display:inline-block; width:.15em; height:.98em; margin-inline:.035em; border-radius:var(--r-pill); background:var(--naranja); transform:translateY(.02em); }
.marca--negativo{ color:#fff; --iso-top:#fff; --iso-bottom:var(--lavanda); }

/* ---------- botones ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--s2);
  min-height:var(--btn-h); padding:14px 22px; border-radius:var(--r);
  font:600 1rem/1.2 var(--f-sans); text-decoration:none; cursor:pointer;
  border:2px solid transparent; transition:background-color var(--t-fast) linear, color var(--t-fast) linear, border-color var(--t-fast) linear, transform var(--t-fast) var(--ease);
  -webkit-tap-highlight-color:transparent;
}
.btn:active{ transform:translateY(1px); }
.btn--primario{ background:var(--indigo); color:#fff; border-color:var(--indigo); }
.btn--primario:hover{ background:var(--noche); border-color:var(--noche); }
.btn--claro{ background:#fff; color:var(--noche); border-color:#fff; }
.btn--claro:hover{ background:var(--indigo-suave); border-color:var(--indigo-suave); }
.btn--perfilado{ background:transparent; color:var(--indigo); border-color:var(--indigo); }
.btn--perfilado:hover{ background:var(--indigo-suave); }
.btn--sm{ min-height:40px; padding:8px 16px; font-size:.9375rem; border-radius:10px; }
.btn[aria-busy="true"]{ pointer-events:none; opacity:.85; }
.btn .spinner{ width:16px; height:16px; border-radius:50%; border:2px solid rgba(255,255,255,.35); border-top-color:#fff; animation:giro .8s linear infinite; }
@keyframes giro{ to{ transform:rotate(360deg); } }
.enlace{ display:inline-flex; align-items:center; gap:.4em; min-height:44px; font-weight:600; color:var(--indigo); text-decoration:none; background:linear-gradient(currentColor,currentColor) 0 calc(100% - 10px)/0 2px no-repeat; transition:background-size var(--t-mid) var(--ease); }
.enlace:hover{ background-size:100% 2px; }
.enlace .flecha{ transition:transform var(--t-mid) var(--ease); }
.enlace:hover .flecha{ transform:translateX(3px); }

/* ---------- etiqueta de etapa ---------- */
.etapa{
  display:inline-flex; align-items:center; gap:10px; padding:7px 14px 7px 10px;
  border:1px solid var(--linea); border-radius:var(--r-pill); background:rgba(255,255,255,.6);
  color:var(--tinta); font-family:var(--f-mono); font-size:.75rem; font-weight:500; letter-spacing:.04em; line-height:1.2; white-space:nowrap; max-width:100%;
}
@media (max-width:380px){ .etapa{ font-size:.6875rem; letter-spacing:.01em; gap:8px; } }
.etapa .mini{ width:22px; height:12px; flex:none; position:relative; }
.etapa .mini::before,.etapa .mini::after{ content:""; position:absolute; top:0; width:14px; height:12px; border-radius:6px; }
.etapa .mini::before{ left:0; background:var(--indigo); }
.etapa .mini::after{ right:0; background:var(--naranja); mix-blend-mode:multiply; opacity:.9; }
.etapa .sep{ opacity:.35; }

/* ---------- cabecera ---------- */
.cabecera{ position:sticky; top:env(safe-area-inset-top,0px); z-index:20; background:rgba(244,242,236,.86); backdrop-filter:saturate(1.4) blur(12px); -webkit-backdrop-filter:saturate(1.4) blur(12px); border-bottom:1px solid transparent; transition:border-color var(--t-mid) linear; }
.cabecera.con-borde{ border-bottom-color:var(--linea); }
.cabecera .wrap{ display:flex; align-items:center; justify-content:space-between; gap:var(--s4); height:64px; }
.nav{ display:none; gap:var(--s6); align-items:center; }
.nav a{ text-decoration:none; font-weight:500; font-size:.9375rem; color:var(--tinta-60); padding-block:10px; }
.nav a:hover{ color:var(--tinta); }
@media (min-width:768px){ .nav{ display:flex; } .cabecera .wrap{ height:72px; } }

/* ---------- hero ---------- */
.hero{ padding-block:clamp(28px, 16px + 4vw, 96px) clamp(56px, 40px + 5vw, 120px); }
.hero .wrap{ display:grid; gap:var(--s7); align-items:center; }
@media (min-width:960px){ .hero .wrap{ grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:var(--s8); } }
.hero-texto{ display:grid; gap:var(--s5); justify-items:start; }
.hero h1 [data-variant]{ display:block; }
.hero .lead{ color:var(--tinta-60); }
.acciones{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--s3) var(--s5); margin-top:var(--s2); }
.acciones .btn{ width:100%; }
@media (min-width:480px){ .acciones .btn{ width:auto; } }
.nota-etapa{ font-size:var(--t-small); color:var(--tinta-60); display:flex; align-items:center; gap:8px; }
.nota-etapa::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--naranja); flex:none; }

/* escena ilustrativa: misma hora, distinto valor */
.escena{ background:var(--blanco); border:1px solid var(--linea); border-radius:var(--r-lg); padding:var(--s5); display:grid; gap:var(--s5); max-width:520px; width:100%; justify-self:center; }
.escena-cab{ display:flex; justify-content:space-between; align-items:center; gap:var(--s3); }
.slot{ font-family:var(--f-mono); font-size:.8125rem; color:var(--tinta); letter-spacing:.04em; }
.badge{ font-family:var(--f-mono); font-size:.6875rem; letter-spacing:.12em; text-transform:uppercase; padding:5px 9px; border-radius:6px; background:var(--indigo-suave); color:var(--indigo); font-weight:500; }
.celda-hero{ border-radius:var(--r); background:var(--indigo-suave); min-height:64px; display:flex; align-items:center; justify-content:center; font-family:var(--f-mono); font-size:.8125rem; color:var(--indigo); letter-spacing:.06em; }
.pregunta{ font-family:var(--f-mono); font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; color:var(--tinta-60); }
.valores{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s4); align-items:end; }
.valor{ display:grid; gap:var(--s2); }
.barra-caja{ height:132px; display:flex; align-items:flex-end; }
.barra{ width:64px; border-radius:10px; transform-origin:bottom; }
.barra--a{ height:22%; background:var(--lavanda); }
.barra--b{ height:100%; background:var(--naranja); }
.cargada .barra{ animation:crece 900ms var(--ease) both; }
.cargada .barra--b{ animation-delay:180ms; }
@keyframes crece{ from{ transform:scaleY(.35); } to{ transform:scaleY(1); } }
.valor .quien{ font-weight:600; font-size:.9375rem; }
.valor .cita{ font-family:var(--f-mono); font-size:.75rem; color:var(--tinta-60); }
.valor--b .cita{ color:#A33F17; }
.escena-pie{ border-top:1px solid var(--linea); padding-top:var(--s4); display:flex; justify-content:space-between; gap:var(--s3); flex-wrap:wrap; }
.escena-pie .label{ color:var(--tinta-60); font-size:.6875rem; }

/* ---------- sección noche: la idea ---------- */
.noche{ background:var(--noche); color:#fff; }
.noche .muted,.noche .lead{ color:rgba(255,255,255,.72); }
.noche .label{ color:var(--lavanda); }
.sec{ padding-block:var(--sec); }
.idea .wrap{ display:grid; gap:var(--s8); }
@media (min-width:960px){ .idea .wrap{ grid-template-columns:minmax(0,6fr) minmax(0,5fr); align-items:center; gap:var(--s9); } }
.bloque{ display:grid; gap:var(--s4); }
.bloque + .bloque{ margin-top:var(--s7); padding-top:var(--s7); border-top:1px solid var(--linea-noche); }
.idea h2{ max-width:14em; }
.idea p.cuerpo{ font-size:var(--t-lead); line-height:1.55; color:rgba(255,255,255,.8); max-width:34em; }
.horizonte{ margin-top:var(--s5); font-size:var(--t-small); color:rgba(255,255,255,.6); max-width:34em; }

/* rejilla: motivo maestro de la app, estática */
.rejilla{ background:var(--noche-2); border:1px solid var(--linea-noche); border-radius:var(--r-lg); padding:var(--s4); }
.rejilla-grid{ display:grid; grid-template-columns:44px repeat(5,minmax(0,1fr)); gap:6px; }
.rejilla-grid .dia{ text-align:center; font-family:var(--f-mono); font-size:.6875rem; letter-spacing:.1em; color:var(--lavanda); padding-bottom:6px; }
.rejilla-grid .hora{ display:flex; align-items:center; font-family:var(--f-mono); font-size:.6875rem; color:rgba(255,255,255,.6); }
.c{ min-height:48px; border-radius:10px; border:1px solid var(--linea-noche); }
.c--llena{ background:rgba(174,182,230,.28); border-color:transparent; }
.c--quiero{ border:2px solid var(--naranja); background:rgba(232,98,42,.12); position:relative; }
.c--quiero::after{ content:""; position:absolute; inset:0; margin:auto; width:8px; height:8px; border-radius:50%; background:var(--naranja); }
.leyenda{ display:flex; flex-wrap:wrap; gap:var(--s2) var(--s5); margin-top:var(--s4); padding-top:var(--s3); border-top:1px solid var(--linea-noche); font-size:.75rem; color:rgba(255,255,255,.72); }
.leyenda span{ display:inline-flex; align-items:center; gap:8px; }
.leyenda i{ width:14px; height:14px; border-radius:4px; display:inline-block; }
.rejilla-cap{ margin-top:var(--s3); font-family:var(--f-mono); font-size:.6875rem; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.45); }

/* ---------- perspectivas ---------- */
.perspectivas .cab-sec{ display:grid; gap:var(--s4); margin-bottom:var(--s7); max-width:40em; }
.tarjetas{ display:grid; gap:var(--s4); }
@media (min-width:768px){ .tarjetas{ grid-template-columns:1fr 1fr; gap:var(--s5); } }
.tarjeta{ background:var(--blanco); border:1px solid var(--linea); border-radius:var(--r-lg); padding:clamp(24px, 18px + 1.5vw, 40px); display:flex; flex-direction:column; gap:var(--s4); scroll-margin-top:96px; }
.tarjeta .label{ color:var(--tinta-60); display:flex; align-items:center; gap:10px; }
.tarjeta .label .punto{ width:10px; height:10px; border-radius:50%; }
.tarjeta p{ color:var(--tinta-60); }
.tarjeta .pie{ margin-top:auto; padding-top:var(--s4); display:flex; flex-wrap:wrap; align-items:center; gap:var(--s3) var(--s5); }
.email{ font-family:var(--f-mono); font-size:.875rem; color:var(--tinta); user-select:all; }

/* ---------- estado + formulario ---------- */
.estado{ background:var(--papel-2); }
.estado .wrap{ display:grid; gap:var(--s8); }
@media (min-width:960px){ .estado .wrap{ grid-template-columns:minmax(0,5fr) minmax(0,6fr); gap:var(--s9); align-items:start; } .estado .col-izq{ position:sticky; top:112px; } }
.col-izq{ display:grid; gap:var(--s5); }
.fases{ list-style:none; margin:var(--s3) 0 0; padding:0; display:grid; gap:0; }
.fase{ display:grid; grid-template-columns:28px 1fr; gap:var(--s4); position:relative; padding-bottom:var(--s5); }
.fase:last-child{ padding-bottom:0; }
.fase::before{ content:""; position:absolute; left:13px; top:28px; bottom:0; width:2px; background:var(--linea); }
.fase:last-child::before{ display:none; }
.fase .marca-fase{ width:28px; height:28px; border-radius:50%; border:2px solid var(--linea); background:var(--papel-2); display:grid; place-items:center; font-family:var(--f-mono); font-size:.6875rem; color:var(--tinta-60); }
.fase--hecha .marca-fase{ background:var(--indigo); border-color:var(--indigo); color:#fff; }
.fase--ahora .marca-fase{ border-color:var(--naranja); background:#fff; }
.fase--ahora .marca-fase::after{ content:""; width:10px; height:10px; border-radius:50%; background:var(--naranja); }
.fase .t{ display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 10px; font-weight:600; }
.fase .estado-fase{ font-family:var(--f-mono); font-size:.6875rem; letter-spacing:.12em; text-transform:uppercase; color:var(--tinta-60); font-weight:500; }
.fase--ahora .estado-fase{ color:#A33F17; }
.fase p{ color:var(--tinta-60); font-size:.9375rem; margin-top:2px; }

.form-card{ background:var(--blanco); border:1px solid var(--linea); border-radius:var(--r-lg); padding:clamp(20px, 14px + 2vw, 48px); scroll-margin-top:88px; }
.form-card h3{ margin-bottom:var(--s2); }
.form-card .intro{ color:var(--tinta-60); margin-bottom:var(--s6); }
form{ display:grid; gap:var(--s5); }
fieldset{ border:0; padding:0; margin:0; min-width:0; }
legend,.campo > label{ font-weight:600; font-size:.9375rem; margin-bottom:var(--s2); display:block; padding:0; }
.opc{ font-weight:400; color:var(--tinta-60); }
.perfiles{ display:grid; gap:var(--s2); }
@media (min-width:560px){ .perfiles{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.perfil{ position:relative; display:grid; }
.perfil span{ height:100%; }
.perfil input{ position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.perfil span{ display:flex; align-items:center; justify-content:center; text-align:center; min-height:52px; padding:10px 12px; border:1px solid var(--linea); border-radius:var(--r); font-weight:500; font-size:.9375rem; background:#fff; transition:border-color var(--t-fast) linear, background-color var(--t-fast) linear, color var(--t-fast) linear; }
.perfil:hover span{ border-color:var(--lavanda); }
.perfil input:checked + span{ border:2px solid var(--indigo); background:var(--indigo-suave); color:var(--indigo); font-weight:600; }
.perfil input:focus-visible + span{ outline:3px solid var(--naranja); outline-offset:2px; }
.campo{ display:grid; }
.fila{ display:grid; gap:var(--s5); }
@media (min-width:560px){ .fila--2{ grid-template-columns:1fr 1fr; } }
input[type=text],input[type=email],textarea{
  width:100%; min-height:52px; padding:13px 16px; border:1px solid var(--linea); border-radius:var(--r);
  font:400 1rem/1.4 var(--f-sans); color:var(--tinta); background:#fff; transition:border-color var(--t-fast) linear, box-shadow var(--t-fast) linear;
}
textarea{ min-height:112px; resize:vertical; }
input::placeholder,textarea::placeholder{ color:#8E90A0; }
input:hover,textarea:hover{ border-color:#C9C5BA; }
input:focus,textarea:focus{ outline:none; border-color:var(--indigo); box-shadow:0 0 0 3px rgba(47,61,143,.16); }
.campo.invalido input{ border-color:var(--error); }
.ayuda{ font-size:.8125rem; color:var(--tinta-60); margin-top:6px; }
.msg-error{ font-size:.8125rem; color:var(--error); margin-top:6px; display:flex; gap:6px; align-items:flex-start; }
.solo-club{ display:grid; gap:var(--s5); padding:var(--s5); border-radius:var(--r); background:var(--indigo-suave); }
.check{ display:grid; grid-template-columns:22px 1fr; gap:var(--s3); align-items:start; padding:var(--s4); border:1px solid var(--linea); border-radius:var(--r); cursor:pointer; }
.check input{ width:20px; height:20px; margin:1px 0 0; accent-color:var(--indigo); }
.check span{ font-size:.875rem; color:var(--tinta-60); line-height:1.45; }
.aviso{ font-size:.8125rem; color:var(--tinta-60); line-height:1.5; border-left:2px solid var(--linea); padding-left:var(--s3); }
.aviso strong{ color:var(--tinta); font-weight:600; }
.pendiente{ background:repeating-linear-gradient(135deg, rgba(232,98,42,.14) 0 6px, rgba(232,98,42,.06) 6px 12px); border-radius:4px; padding:0 4px; color:#8A3510; }
.enviar{ display:grid; gap:var(--s3); }
.enviar .btn{ width:100%; }
@media (min-width:560px){ .enviar{ grid-template-columns:auto 1fr; align-items:center; gap:var(--s5); } .enviar .btn{ width:auto; min-width:200px; } }
.no-reserva{ font-size:.8125rem; color:var(--tinta-60); }
.banner-error{ display:flex; gap:var(--s3); padding:var(--s4); border-radius:var(--r); background:#FDECEA; color:#7A1B12; font-size:.9375rem; line-height:1.45; }
.banner-error svg{ flex:none; margin-top:2px; }
.exito{ display:grid; gap:var(--s4); justify-items:start; padding-block:var(--s4); }
.exito .icono{ width:56px; height:56px; border-radius:50%; background:var(--indigo-suave); display:grid; place-items:center; }
.exito p{ color:var(--tinta-60); max-width:34em; }

/* ---------- FAQ ---------- */
.faq .wrap{ display:grid; gap:var(--s7); }
@media (min-width:960px){ .faq .wrap{ grid-template-columns:minmax(0,4fr) minmax(0,7fr); gap:var(--s9); } }
.faq dl{ margin:0; display:grid; }
.faq dt{ font-family:var(--f-display); font-weight:700; font-size:var(--t-h3); letter-spacing:-.02em; line-height:1.2; font-variation-settings:"opsz" 36; }
.faq dd{ margin:var(--s3) 0 0; color:var(--tinta-60); max-width:36em; }
.faq .par{ padding-block:var(--s6); border-top:1px solid var(--linea); }
.faq .par:first-child{ border-top:0; padding-top:0; }

/* ---------- cierre + pie ---------- */
.cierre{ padding-block:var(--sec); }
.cierre .wrap{ display:grid; gap:var(--s5); justify-items:start; }
.cierre h2{ max-width:16em; }
.pie-sitio{ border-top:1px solid var(--linea-noche); background:var(--noche); color:rgba(255,255,255,.72); padding-block:var(--s8) calc(var(--s6) + env(safe-area-inset-bottom,0px)); font-size:.875rem; }
.pie-sitio .wrap{ display:grid; gap:var(--s6); }
.pie-sup{ display:grid; gap:var(--s5); }
@media (min-width:768px){ .pie-sup{ grid-template-columns:1fr auto; align-items:end; } }
.pie-links{ display:flex; flex-wrap:wrap; gap:var(--s2) var(--s5); }
.pie-links a{ text-decoration:none; color:#fff; padding-block:10px; }
.pie-links a:hover{ text-decoration:underline; text-underline-offset:4px; }
.pie-inf{ border-top:1px solid var(--linea-noche); padding-top:var(--s5); display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--s3); font-family:var(--f-mono); font-size:.6875rem; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.5); }

/* ---------- entrada suave (desde estado visible) ---------- */
.aparece{ animation:sube 700ms var(--ease) both; }
.aparece.d1{ animation-delay:80ms; } .aparece.d2{ animation-delay:160ms; } .aparece.d3{ animation-delay:240ms; } .aparece.d4{ animation-delay:320ms; }
@keyframes sube{ from{ transform:translateY(10px); opacity:.001; } to{ transform:none; opacity:1; } }

/* =========================================================
   v2 · REVISIÓN NARRATIVA — añadidos sobre el sistema aprobado
   ========================================================= */
/* pestañas de situaciones en la escena */
.tabs{ display:flex; flex-wrap:wrap; gap:6px; }
.tab{ font:500 .8125rem/1 var(--f-sans); color:var(--tinta-60); background:transparent; border:1px solid var(--linea); border-radius:var(--r-pill); padding:9px 14px; min-height:36px; cursor:pointer; transition:background-color var(--t-fast) linear, color var(--t-fast) linear, border-color var(--t-fast) linear; }
.tab:hover{ border-color:var(--lavanda); color:var(--tinta); }
.tab[aria-selected="true"]{ background:var(--noche); border-color:var(--noche); color:#fff; }
.escena-cuerpo{ display:grid; gap:var(--s5); }
.slot{ white-space:nowrap; }
.escena-cab{ flex-wrap:wrap; }
@media (max-width:480px){
  .tabs{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
  .tab{ border-radius:10px; padding:8px 6px; font-size:.75rem; line-height:1.2; min-height:44px; text-align:center; }
  .slot{ font-size:.75rem; }
}
.escena-cuerpo.cambia{ animation:funde 320ms var(--ease) both; }
@keyframes funde{ from{ opacity:.001; transform:translateY(4px); } to{ opacity:1; transform:none; } }
.valor .cita{ min-height:2.6em; }
@media (max-width:480px){ .valor .cita{ min-height:4em; } }

/* tres posiciones */
.tarjetas--3{ display:grid; gap:var(--s4); }
@media (min-width:960px){ .tarjetas--3{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s5); } }
.tarjeta .punto--lavanda{ background:var(--lavanda); }

/* preguntas abiertas en la columna de estado */
.abiertas{ margin-top:var(--s3); padding:var(--s5); border:1px dashed #CFCABE; border-radius:var(--r-lg); display:grid; gap:var(--s3); }
.abiertas ul{ margin:0; padding:0; list-style:none; display:grid; gap:var(--s3); }
.abiertas li{ display:grid; grid-template-columns:18px 1fr; gap:var(--s2); font-size:.9375rem; line-height:1.45; }
.abiertas li::before{ content:"?"; font-family:var(--f-mono); font-size:.75rem; color:var(--indigo); font-weight:500; padding-top:2px; }

/* formulario de participación: opciones en lista */
.opciones{ display:grid; gap:var(--s2); }
@media (min-width:640px){ .opciones{ grid-template-columns:1fr 1fr; } .opciones .opcion:last-child{ grid-column:1 / -1; } }
.opcion{ position:relative; display:grid; }
.opcion input{ position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.opcion span{ display:grid; grid-template-columns:12px 1fr; gap:12px; align-items:center; min-height:56px; padding:12px 16px; border:1px solid var(--linea); border-radius:var(--r); background:#fff; font-weight:500; font-size:.9375rem; line-height:1.3; transition:border-color var(--t-fast) linear, background-color var(--t-fast) linear; }
.opcion span::before{ content:""; width:10px; height:10px; border-radius:50%; background:var(--dot, var(--linea)); }
.opcion:hover span{ border-color:var(--lavanda); }
.opcion input:checked + span{ border:2px solid var(--indigo); background:var(--indigo-suave); color:var(--indigo); font-weight:600; padding:11px 15px; }
.opcion input:focus-visible + span{ outline:3px solid var(--naranja); outline-offset:2px; }
.chips{ display:flex; flex-wrap:wrap; gap:8px; }
.chip{ position:relative; }
.chip input{ position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.chip span{ display:inline-flex; align-items:center; min-height:40px; padding:8px 14px; border:1px solid var(--linea); border-radius:var(--r-pill); background:#fff; font-size:.875rem; transition:all var(--t-fast) linear; }
.chip input:checked + span{ background:var(--noche); border-color:var(--noche); color:#fff; }
.chip input:focus-visible + span{ outline:3px solid var(--naranja); outline-offset:2px; }
.condicional{ display:grid; gap:var(--s5); padding:var(--s5); border-radius:var(--r); background:var(--indigo-suave); }
.check.resaltado{ border-color:var(--indigo); background:var(--indigo-suave); }

/* La marca usa los vectores oficiales. Los secundarios comparten el mismo sistema. */
.pagina-simple{ min-height:65vh; }
.pagina-simple .wrap{ max-width:760px; }
.pagina-simple h1{ font-size:clamp(2.5rem,2rem + 2vw,3rem); margin-block:var(--s4) var(--s5); }
.pagina-simple p + p{ margin-top:var(--s4); }
.pagina-simple .btn{ margin-top:var(--s6); }
.trampa{ position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
@media(max-width:359px){ .wrap{ padding-inline:16px; } .escena{ padding:16px; } .escena-pie{ gap:4px; } .rejilla{ padding:12px; } }
/* Consent controls reuse the approved button language; no new brand system. */
button.enlace { border:0; background:transparent; font:inherit; cursor:pointer; color:inherit; padding:0; text-align:left; }
/* Optional consent is a compact non-modal floating panel, not a page section. */
#analytics-choice{ position:fixed; z-index:100; right:24px; bottom:24px; width:min(440px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); overflow-y:auto; padding:24px; border:1px solid var(--linea); border-radius:var(--r-lg); background:var(--papel); color:var(--tinta); box-shadow:0 12px 48px rgba(27,36,80,.18); }
#analytics-choice .wrap{ padding:0; }
#analytics-choice h2{ font-size:1.5rem; line-height:1.15; margin-bottom:12px; }
#analytics-choice p{ font-size:.875rem; line-height:1.5; }
#analytics-choice .acciones{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:20px; }
#analytics-choice .btn{ min-height:44px; padding:10px 12px; font-size:.875rem; }
@media(max-width:480px){ #analytics-choice{ right:16px; bottom:16px; padding:20px; } }