/* PharmaTrace 360: borrador privado 06-11-2026. Mismos tokens visuales que 04_Codigo_Fuente/assets/site.css.
   Sin JavaScript ni recursos externos; tipografía del sistema. */
:root { --navy:#0D2139; --navy2:#173550; --turq:#3CD6C4; --turqd:#0E9488; --light:#F2F6F9; --line:#DCE6EE; --mint:#E3F7F4;
  --t2:#4A5D73; --cab:65px; --pad:56px; --r:16px; --max:1200px; --font:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:calc(var(--cab) + 16px - var(--pad)); }
body { margin:0; font-family:var(--font); color:var(--navy); background:#fff; line-height:1.55; font-size:17px; }
img { max-width:100%; height:auto; display:block; }
a { color:inherit; }
.env { max-width:var(--max); margin-inline:auto; padding-inline:16px; }
.franja { background:var(--navy); color:#BFD0DE; font-size:12px; letter-spacing:.04em; text-align:center; padding:4px 8px; }
.cab { position:sticky; top:0; z-index:5; background:#fff; border-bottom:1px solid var(--line); }
.cab-in { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:64px; position:relative; }
.logo { display:flex; align-items:center; gap:10px; text-decoration:none; font-weight:600; font-size:20px; letter-spacing:-.02em; white-space:nowrap; }
.marca { width:32px; height:32px; flex:none; }
.logo b { color:var(--turqd); margin-left:5px; }
.nav-esc { display:none; gap:20px; font-size:15px; }
.nav-esc a { text-decoration:none; color:var(--t2); white-space:nowrap; }
.nav-esc a:hover { color:var(--navy); }
.boton { display:inline-flex; align-items:center; white-space:nowrap; background:var(--navy); color:#fff; text-decoration:none; font-weight:600;
  font-size:15px; padding:12px 20px; border-radius:10px; border:2px solid var(--navy); }
.boton.sec { background:#fff; color:var(--navy); }
.cab .boton { display:none; }
.nav-mov summary { list-style:none; cursor:pointer; font-weight:600; padding:10px 14px; border:1px solid var(--line); border-radius:10px; }
.nav-mov summary::-webkit-details-marker { display:none; }
.nav-mov nav { z-index:6; position:absolute; inset-inline:0; top:100%; background:#fff; border-bottom:1px solid var(--line); padding:8px 16px 16px; display:grid; gap:2px; }
.nav-mov nav a { text-decoration:none; padding:10px 4px; border-bottom:1px solid var(--line); }
:focus-visible { outline:3px solid var(--turqd); outline-offset:2px; }

.portada { background:linear-gradient(180deg,var(--light),#fff); padding:40px 0 24px; }
.sobre { color:var(--turqd); font-weight:600; font-size:14px; letter-spacing:.06em; text-transform:uppercase; margin:0 0 12px; }
h1 { font-size:clamp(30px,6vw,56px); line-height:1.08; letter-spacing:-.03em; margin:0 0 16px; max-width:18em; }
.lead { font-size:19px; color:var(--t2); max-width:44em; margin:0 0 24px; }
.botones { display:flex; flex-wrap:wrap; gap:12px; margin:0 0 32px; }
.seccion { padding:56px 0; }
.seccion.oscura { background:var(--navy); color:#fff; }
.seccion.oscura .intro { color:#C6D7E4; }
h2 { font-size:clamp(26px,4.4vw,40px); line-height:1.15; letter-spacing:-.02em; margin:0 0 12px; max-width:20em; }
h3 { font-size:18px; margin:0 0 6px; }
.intro { font-size:18px; color:var(--t2); max-width:48em; margin:0 0 28px; }

figure { margin:0; }
.sub { margin:32px 0 16px; font-size:20px; }
.col { display:grid; gap:24px; }
.estrecha { max-width:900px; margin:8px auto 0; }
.captura { width:100%; border:1px solid var(--line); border-radius:var(--r); background:#fff; box-shadow:0 8px 30px rgba(13,33,57,.10); }
figcaption { font-size:14px; color:var(--t2); margin-top:10px; }
.ficticio { color:var(--turqd); font-weight:600; }
.rejilla { align-items:start; display:grid; gap:24px; grid-template-columns:1fr; margin-bottom:24px; }
.dos { display:grid; gap:32px; grid-template-columns:1fr; align-items:start; margin-top:8px; }
.tarjetas { list-style:none; margin:0; padding:0; display:grid; gap:16px; grid-template-columns:1fr; }
.tarjetas li { background:var(--light); border:1px solid var(--line); border-radius:var(--r); padding:20px; }
.tarjetas p { margin:0; color:var(--t2); font-size:16px; }
.oscura .tarjetas li { background:var(--navy2); border-color:#27496A; }
.oscura .tarjetas p { color:#C6D7E4; }

.pasos { list-style:none; margin:0 0 28px; padding:0; display:grid; gap:12px; }
.pasos li { display:flex; gap:14px; align-items:flex-start; background:#fff; border:1px solid var(--line); border-radius:12px; padding:14px 16px; }
.pasos .n { flex:none; width:30px; height:30px; border-radius:50%; background:var(--turq); color:var(--navy); font-weight:700; display:grid; place-items:center; }
.pasos strong { display:block; }
.pasos span:not(.n) { display:block; color:var(--t2); font-size:15px; }
.esquema { border:2px dashed var(--grey,#9DB3C6); border-radius:var(--r); padding:20px; background:#fff; position:relative; }
.rotulo { margin:0 0 12px; display:inline-block; background:var(--mint); color:#0B6F66; font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:3px 10px; border-radius:20px; }
.red { display:grid; gap:10px; grid-template-columns:1fr 1fr; }
.nodo { background:var(--light); border:1px solid var(--line); border-radius:10px; padding:10px 12px; font-size:15px; text-align:center; }
.nodo.centro { grid-column:1/-1; background:var(--navy); color:#fff; font-weight:600; }
.pie-esq { color:var(--t2); font-size:14px; margin:12px 0 0; }
.flujo { margin:0; padding-left:22px; display:grid; gap:12px; }
.lista { margin:0 0 16px; padding-left:20px; }
.lista li { margin-bottom:6px; }
.destacado { font-weight:700; font-size:20px; color:var(--turqd); margin:8px 0 0; }
.caso, .nota { background:var(--mint); border-radius:12px; padding:14px 16px; margin:0 0 24px; font-size:16px; }
.nota { margin:24px 0 0; background:var(--light); color:var(--t2); }
.futuro-esq { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:0; }
.futuro-esq span { border:1px solid var(--line); background:var(--light); padding:12px 16px; border-radius:10px; }
.futuro-esq .punteado { border:2px dashed var(--t2); background:#fff; }
.futuro-esq em { color:var(--t2); }
.contacto { background:var(--light); }
.aviso-borrador { background:#FFF4D6; border:1px solid #E8C55B; border-radius:10px; padding:12px 14px; font-size:15px; }
.pie { background:var(--navy); color:#C6D7E4; padding:28px 0; font-size:14px; }
.pie p { margin:0 0 6px; }

@media (min-width:760px) {
  .rejilla, .dos, .tarjetas { grid-template-columns:1fr 1fr; }
  .tarjetas.una { grid-template-columns:1fr; }
  .env { padding-inline:24px; }
  .portada { padding:64px 0 32px; }
  .seccion { padding:80px 0; }
  :root { --pad:80px; }
}
@media (min-width:1260px) {
  .nav-esc { display:flex; }
  .nav-mov { display:none; }
  .cab .boton { display:inline-flex; }
}
@media (min-width:1080px) {
  .oscura .tarjetas { grid-template-columns:repeat(4,1fr); }
  .tarjetas:not(.una):not(.dos) { grid-template-columns:repeat(2,1fr); }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

.ampliar { display:block; cursor:zoom-in; }

/* Portada: dos párrafos con jerarquía */
.intro-portada { max-width:52em; margin:0 0 28px; }
.intro-portada p { font-size:19px; line-height:1.6; color:var(--t2); margin:0 0 16px; }
.intro-portada p:first-child { font-size:clamp(19px,2.2vw,22px); color:var(--navy); }
mark { background:linear-gradient(transparent 58%,rgba(60,214,196,.45) 58%); color:var(--navy); font-weight:600; padding:0 2px; }
/* Formulario */
.form-grid { align-items:start; }
.form { display:grid; gap:16px; background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:20px; }
.campo label { display:block; font-weight:600; font-size:15px; margin-bottom:6px; }
.req, .opc { font-weight:400; color:var(--t2); font-size:13px; }
.campo input, .campo textarea { width:100%; font:inherit; padding:12px 14px; border:1px solid #9DB3C6; border-radius:10px; background:#fff; color:var(--navy); }
.campo [aria-invalid="true"] { border-color:#B3261E; }
.err { color:#B3261E; font-size:14px; margin:6px 0 0; min-height:0; }
.err:empty { display:none; }
.trampa { position:absolute; inset-inline-start:-9999px; width:1px; height:1px; overflow:hidden; }
.privacidad-espacio { border:1px dashed var(--t2); border-radius:10px; padding:10px 12px; font-size:14px; color:var(--t2); margin:0; }
.estado { margin:0; font-size:15px; }
.estado:empty { display:none; }
.estado.ok { background:var(--mint); border-radius:10px; padding:12px 14px; }
.estado.mal { background:#FDECEA; color:#7A1712; border-radius:10px; padding:12px 14px; }
.estado.info { color:var(--t2); }
.boton:disabled { opacity:.6; cursor:progress; }
.alt-correo { color:var(--t2); font-size:15px; }

@media (max-width:360px) { .logo span { font-size:17px; } .marca { width:28px; height:28px; } .cab-in { gap:8px; } .nav-mov summary { padding:8px 10px; } }

.dos > *, .rejilla > *, .tarjetas > * { min-width:0; }
.nodo { overflow-wrap:anywhere; }
@media (max-width:420px) { .red { grid-template-columns:1fr; } }

/* v3: portada más compacta (la captura aparece antes) */
.portada { padding:24px 0 16px; }
.sobre { margin:0 0 8px; font-size:13px; }
h1 { font-size:clamp(28px,4.4vw,44px); margin:0 0 14px; max-width:22em; }
.intro-portada { max-width:64em; margin:0 0 18px; }
.intro-portada p { font-size:16.5px; line-height:1.5; margin:0 0 10px; }
.intro-portada p:first-child { font-size:clamp(17px,1.7vw,19px); }
.botones { margin:0 0 20px; }
@media (min-width:760px) { .portada { padding:32px 0 24px; } .intro-portada { display:grid; grid-template-columns:1fr 1fr; gap:24px; max-width:none; }
  .intro-portada p { margin:0; } }
/* v3: ingesta en secuencia */
.pasos.horizontal { counter-reset:p; }
@media (min-width:1000px) {
  .pasos.horizontal { grid-template-columns:repeat(5,1fr); gap:28px; }
  .pasos.horizontal li { flex-direction:column; gap:10px; position:relative; height:100%; }
  .pasos.horizontal li:not(:last-child)::after { content:"→"; position:absolute; inset-inline-end:-22px; top:18px; color:var(--turqd); font-weight:700; font-size:20px; }
}
/* v3: informes con desplegable */
.constr { margin-top:24px; border:1px solid var(--line); border-radius:var(--r); background:#fff; }
.constr summary { cursor:pointer; padding:16px 20px; font-weight:600; list-style:none; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.constr summary::-webkit-details-marker { display:none; }
.constr summary::after { content:"+"; font-size:22px; color:var(--turqd); line-height:1; }
.constr[open] summary::after { content:"–"; }
.constr[open] summary { border-bottom:1px solid var(--line); }
.constr > .rejilla, .constr > figure, .constr > .estrecha { margin:20px; }
.dest { font-size:22px; margin:0 0 10px; }
.texto-dem { color:var(--t2); margin:0 0 16px; }
/* v3: menos hueco entre Implantación y evolución futura */
#implantacion { padding-bottom:24px; }
#futuro { padding-top:24px; padding-bottom:40px; }
@media (min-width:760px) { #implantacion { padding-bottom:32px; } #futuro { padding-top:32px; } }

/* v4: petición por escrito o de viva voz */
.voz { background:var(--navy); color:#fff; border-radius:var(--r); padding:18px 22px; margin:0 0 24px; }
.voz h3 { color:#fff; font-size:20px; margin:0 0 6px; }
.voz p { margin:0; color:#D6DEE7; max-width:52em; }

/* v5: recorridos de ingesta */
.recorridos { list-style:none; margin:0 0 24px; padding:0; display:grid; gap:16px; grid-template-columns:1fr; }
.recorridos li { background:var(--light); border:1px solid var(--line); border-radius:var(--r); padding:20px; min-width:0; }
.recorridos .etq { display:inline-block; background:var(--mint); color:#0B6F66; font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:3px 10px; border-radius:20px; margin-bottom:10px; }
.recorridos p { margin:0; color:var(--t2); font-size:16px; }
@media (min-width:1000px) {
  .recorridos { grid-template-columns:repeat(3,1fr); }
  .pasos.horizontal.cuatro { grid-template-columns:repeat(4,1fr); }
}
.beneficio { font-size:clamp(20px,2.4vw,26px); font-weight:700; color:var(--navy); border-left:5px solid var(--turq); padding:6px 0 6px 18px; margin:28px 0; max-width:34em; }

/* v6: legales y formulario */
.acepto { display:flex; gap:10px; align-items:flex-start; font-size:15px; }
.acepto input { margin-top:4px; width:18px; height:18px; flex:none; }
.info-priv { font-size:13.5px; color:var(--t2); border-top:1px solid var(--line); padding-top:12px; }
.info-priv p { margin:0 0 8px; }
.enlaces-legales a, .ubicacion { color:inherit; }
.ubicacion { color:var(--t2); margin:0; }
.pie a { color:#fff; text-decoration:underline; text-underline-offset:3px; }
.legal { padding:40px 0 64px; }
.legal h1 { font-size:clamp(28px,4.4vw,40px); margin:0 0 6px; }
.legal h2 { font-size:20px; margin:28px 0 8px; }
.legal p, .legal li { max-width:52em; color:#1F2A37; }
.legal .act { color:var(--t2); margin:0 0 12px; font-size:15px; }
.legal .volver { margin:0 0 16px; font-size:15px; }
.legal .datos { padding-left:20px; }