/* Colegio Secundario Don Bosco — propuesta visual 2027.
   Estilos locales: no carga recursos de terceros. */
:root{--azul:#08264b;--azul2:#0d4179;--dorado:#d9a43c;--dorado-claro:#f3d88a;--rojo:#bb1222;--tinta:#12274a;--blanco:#fff;--muted:#59677a}
*{box-sizing:border-box}
html{min-height:100%;background:#dce5ef}
body{margin:0;padding:clamp(10px,2vw,28px);min-height:100vh;display:flex;justify-content:center;align-items:center;color:var(--tinta);font-family:Arial,Helvetica,sans-serif;background:radial-gradient(circle at 50% 0%,#f0f5fa,#d5e0eb)}
.pagina{position:relative;isolation:isolate;width:min(100%,1200px);min-height:min(740px,calc(100vh - 32px));display:flex;flex-direction:column;border:3px solid var(--dorado);outline:1px solid #f8e2a6;outline-offset:-8px;border-radius:25px;box-shadow:0 26px 65px #1129433d;overflow:hidden;background:#f7f9fc}
.cabecera{position:relative;z-index:2;text-align:center;padding:20px 24px 19px;color:white;background:linear-gradient(135deg,#0b315a,#071d39 55%,#174c83);border-bottom:3px solid var(--dorado)}
.cabecera::after{content:"";position:absolute;bottom:-9px;left:0;right:0;height:5px;background:linear-gradient(90deg,var(--rojo),#f12c35,var(--rojo))}
.marca{margin:0 auto 9px;display:flex;align-items:center;justify-content:center;gap:18px;color:var(--dorado-claro)}
.marca::before,.marca::after{content:"";height:1px;width:min(12vw,110px);background:linear-gradient(90deg,transparent,var(--dorado-claro))}.marca::after{transform:scaleX(-1)}
.monograma{width:72px;height:72px;border:2px solid var(--dorado-claro);border-radius:50%;display:grid;place-items:center;font:700 30px/1 Georgia,'Times New Roman',serif;letter-spacing:-5px;padding-right:5px;box-shadow:inset 0 0 0 4px #a5751b17}
.nombre-institucion{font:700 clamp(1.25rem,3.5vw,2.6rem)/1.2 Georgia,'Times New Roman',serif;margin:0;letter-spacing:.035em;text-wrap:balance}
.ubicacion{margin:6px 0 0;color:#f5d886;font:bold clamp(.73rem,1.5vw,1.12rem)/1.2 Georgia,'Times New Roman',serif;letter-spacing:.24em}
.contenido{flex:1;position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;padding:34px 20px 46px;background:linear-gradient(90deg,rgba(250,252,255,.75),rgba(250,252,255,.59) 52%,rgba(250,252,255,.73)),url('frente-colegio.webp') center 52%/cover no-repeat}
.titulo{font:700 clamp(1.95rem,4.5vw,3.5rem)/1.08 Georgia,'Times New Roman',serif;text-align:center;margin:8px 0 2px;color:#081f42;text-shadow:0 2px 2px #fffd;text-wrap:balance}
.ciclo{display:flex;align-items:center;justify-content:center;gap:16px;width:100%;margin:0 0 25px;color:var(--rojo);font:700 clamp(1.1rem,2.5vw,1.9rem)/1.3 Georgia,'Times New Roman',serif;text-align:center}
.ciclo:before,.ciclo:after{content:"";height:2px;width:min(7vw,86px);background:var(--rojo)}
.tarjeta{width:min(100%,580px);padding:clamp(22px,3.3vw,38px);border:2px solid var(--dorado);outline:1px solid #b58529;outline-offset:-6px;border-radius:27px;background:#fffffff0;box-shadow:0 16px 45px #10254424,0 3px 8px #10254417;backdrop-filter:blur(2px)}
.tarjeta h2{font:700 clamp(1.5rem,2.8vw,2rem)/1.2 Georgia,'Times New Roman',serif;text-align:center;margin:0 0 8px}
.subtitulo{text-align:center;margin:0;font-size:clamp(.98rem,1.8vw,1.1rem);line-height:1.5}
.linea-roja{height:2px;width:48%;max-width:245px;background:var(--rojo);margin:21px auto 22px}
.campo-etiqueta{display:block;font-weight:700;margin-bottom:9px;font-size:1.02rem}.campo-etiqueta::before{content:'✉';color:var(--rojo);font-size:1.35rem;vertical-align:middle;margin-right:9px}
.campo{display:block;width:100%;padding:15px 17px;background:#f4f6f9;color:#647084;border:1px solid #aab6c8;border-radius:10px;font:1rem Arial,Helvetica,sans-serif;cursor:not-allowed}
.boton{display:block;width:100%;margin-top:22px;padding:15px 18px;border:2px solid var(--dorado);outline:2px solid #1c4776;outline-offset:-7px;border-radius:15px;background:linear-gradient(#12518a,#06264e);color:#fff;font-weight:700;font-size:1.14rem;letter-spacing:.03em;box-shadow:0 6px 12px #0c345b36;opacity:1;cursor:not-allowed}
.estado{margin:20px 0 0;display:flex;gap:10px;align-items:flex-start;justify-content:center;color:#4a586f;font-size:.9rem;line-height:1.35}.estado svg{width:21px;height:21px;color:#b6811e;flex-shrink:0}
.aviso{max-width:580px;margin:18px auto 0;padding:10px 17px;border-radius:10px;border:1px solid #d6b771;background:#fffaf0e8;color:#5d4824;text-align:center;font-size:.88rem;line-height:1.35}
.pie{position:relative;padding:22px 20px 18px;text-align:center;color:#fff;background:linear-gradient(110deg,#071d3b,#0d4277,#071d3b);border-top:3px solid var(--dorado);font:clamp(.82rem,1.5vw,1rem)/1.35 Georgia,'Times New Roman',serif}
.pie::before{content:"";position:absolute;left:0;right:0;top:-9px;background:var(--rojo);height:4px}
@media(max-width:600px){body{padding:8px}.pagina{min-height:calc(100svh - 16px);border-radius:19px;outline-offset:-6px}.cabecera{padding:18px 14px 19px}.monograma{height:57px;width:57px;font-size:26px}.nombre-institucion{font-size:1.23rem}.ubicacion{font-size:.72rem;letter-spacing:.15em}.contenido{padding:25px 14px 30px;background-position:center center}.titulo{margin-top:13px;font-size:2rem}.ciclo{margin-bottom:23px;font-size:1.25rem;gap:8px}.ciclo:before,.ciclo:after{width:22px}.tarjeta{border-radius:23px}.tarjeta h2{font-size:1.6rem}.pie{padding:17px 12px;font-size:.8rem}.aviso{font-size:.82rem}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}