/* APRENDIZIA · web pública. Colores de IDENTIDAD_VISUAL.md. Sin fuentes ni recursos de terceros. */
:root{--petroleo:#1D5E73;--petroleo-osc:#154756;--mostaza:#F2C76B;--crema:#F6F4EF;--tinta:#1D2B33;--gris:#5D6B73;--linea:#DCD8CE;--blanco:#fff;--error:#A12A1F;--ok:#1E6B3A}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:76px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:"Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;color:var(--tinta);background:var(--blanco);line-height:1.6;font-size:17px}
img{max-width:100%;height:auto;display:block}
a{color:var(--petroleo)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--mostaza);outline-offset:2px}
h1,h2,h3{line-height:1.2;color:var(--petroleo-osc)}
h1{font-size:clamp(2rem,4.5vw,3.1rem);margin:0 0 .5em;color:var(--blanco)}
h2{font-size:clamp(1.6rem,3vw,2.1rem);margin:0 0 .6em}
h3{font-size:1.15rem;margin:0 0 .35em}
.ancho{max-width:1120px;margin:0 auto;padding:0 20px}
.angosto{max-width:760px}
.saltar{position:absolute;left:-999px;top:8px;background:var(--mostaza);color:var(--tinta);padding:8px 12px;z-index:20}
.saltar:focus{left:8px}

/* barra */
.barra{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.96);border-bottom:1px solid var(--linea)}
.barra-in{display:flex;align-items:center;justify-content:space-between;min-height:64px;gap:16px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--petroleo-osc);font-weight:700;letter-spacing:.14em}
nav{display:flex;align-items:center;gap:20px}
nav a{text-decoration:none;color:var(--tinta);font-weight:500}
nav a:hover{color:var(--petroleo)}
.menu-btn{display:none;background:none;border:1px solid var(--linea);border-radius:8px;padding:8px 14px;font:inherit;color:var(--tinta);cursor:pointer}
@media (max-width:860px){
  .menu-btn{display:block}
  nav{display:none;position:absolute;left:0;right:0;top:64px;background:var(--blanco);flex-direction:column;align-items:stretch;padding:12px 20px 20px;border-bottom:1px solid var(--linea);gap:4px}
  nav.abierto{display:flex}
  nav a{padding:10px 0}
}

/* botones */
.boton{display:inline-block;background:var(--mostaza);color:var(--tinta);text-decoration:none;font-weight:700;border:0;border-radius:999px;padding:12px 24px;font-size:1rem;font-family:inherit;cursor:pointer}
.boton:hover{filter:brightness(.95)}
.boton.claro{background:transparent;color:var(--petroleo);border:2px solid currentColor}
.boton.chico{padding:8px 18px;color:var(--tinta)}
.boton[disabled]{opacity:.6;cursor:wait}
.acciones{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}

/* portada */
.portada{background:var(--petroleo);color:var(--blanco);padding:64px 0 72px}
.portada .boton.claro{color:var(--blanco)}
.portada-in{display:grid;grid-template-columns:1.4fr 1fr;gap:48px;align-items:center}
.bajada{font-size:1.2rem;color:#E9F1F3;max-width:36em}
.sellos{list-style:none;padding:0;margin:28px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.sellos li{border:1px solid rgba(255,255,255,.45);border-radius:999px;padding:4px 14px;font-size:.92rem}
.telefono{margin:0;justify-self:center;max-width:280px;border-radius:32px;overflow:hidden;border:8px solid var(--petroleo-osc);box-shadow:0 20px 40px rgba(0,0,0,.25);background:var(--crema)}
@media (max-width:860px){.portada-in{grid-template-columns:1fr}.telefono{max-width:220px}}

/* secciones */
.seccion{padding:72px 0}
.suave{background:var(--crema)}
.destacado{font-size:1.35rem;color:var(--petroleo-osc);border-left:5px solid var(--mostaza);padding-left:18px;font-weight:600}
.nota{color:var(--gris);font-size:.95rem}
.pasos{list-style:none;counter-reset:paso;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pasos li{counter-increment:paso;background:var(--crema);border-radius:16px;padding:22px 22px 18px;position:relative}
.pasos li::before{content:counter(paso);display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--petroleo);color:var(--blanco);font-weight:700;margin-bottom:10px}
.tarjetas{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.tarjetas article{background:var(--blanco);border:1px solid var(--linea);border-radius:16px;padding:22px}
.seccion:not(.suave) .tarjetas article{background:var(--crema);border-color:transparent}
.tarjetas.dos-col{grid-template-columns:repeat(2,1fr)}
.dos{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
@media (max-width:860px){.pasos,.tarjetas,.tarjetas.dos-col,.dos{grid-template-columns:1fr}}
@media (min-width:861px) and (max-width:1000px){.pasos,.tarjetas{grid-template-columns:repeat(2,1fr)}}
.lista{padding-left:1.2em}
.lista li{margin-bottom:.5em}
.etiqueta{display:inline-block;vertical-align:middle;font-size:.8rem;font-weight:600;background:var(--mostaza);color:var(--tinta);border-radius:999px;padding:2px 10px;margin-left:6px}

/* galería */
.galeria{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:start}
.galeria figure{margin:0}
.galeria img{border-radius:12px;border:1px solid var(--linea)}
.galeria .vertical img{max-width:200px;margin:0 auto}
.galeria figcaption{color:var(--gris);font-size:.92rem;margin-top:8px;text-align:center}
@media (max-width:860px){.galeria{grid-template-columns:1fr}}

/* preguntas */
details{background:var(--blanco);border:1px solid var(--linea);border-radius:12px;padding:0 18px;margin-bottom:10px}
summary{cursor:pointer;font-weight:600;padding:14px 0;color:var(--petroleo-osc)}
details p{margin:0 0 16px}

/* formulario */
.formulario{background:var(--blanco);border:1px solid var(--linea);border-radius:16px;padding:24px;display:flex;flex-direction:column}
.formulario label{font-weight:600;margin:12px 0 4px}
.formulario input,.formulario select,.formulario textarea{font:inherit;color:inherit;padding:10px 12px;border:1px solid #B9B4A8;border-radius:10px;background:var(--blanco);width:100%}
.formulario textarea{resize:vertical}
.formulario [aria-invalid="true"]{border-color:var(--error)}
.formulario .boton{margin-top:16px;align-self:flex-start}
.opc{font-weight:400;color:var(--gris)}
.trampa{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.estado{min-height:1.6em;margin:12px 0 0;font-weight:600}
.estado.ok{color:var(--ok)}
.estado.error{color:var(--error)}

/* pie */
.pie{background:var(--petroleo-osc);color:#D9E6EA;padding:28px 0}
.pie a{color:var(--blanco)}
.pie-in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;align-items:center}
.pie p{margin:0;display:flex;align-items:center;gap:8px}

/* páginas de texto (privacidad, borrar cuenta, 404) */
.texto{padding:48px 0 64px}
.texto h1{color:var(--petroleo-osc);font-size:clamp(1.8rem,4vw,2.4rem)}
.texto h2{font-size:1.35rem;margin-top:1.6em}
.texto table{border-collapse:collapse;width:100%;margin:12px 0}
.texto th,.texto td{border:1px solid var(--linea);padding:8px 10px;text-align:left;vertical-align:top}
.texto th{background:var(--crema)}
.fecha{color:var(--gris)}
@media (max-width:600px){.texto table,.texto tbody,.texto tr,.texto td,.texto th{display:block}.texto tr:first-child{display:none}.texto td{border-top:0}.texto tr{border-top:1px solid var(--linea);margin-bottom:8px}}