:root{
  --papel:#F5F5F0;
  --papel-2:#EFEDE4;
  --blanco:#FFFFFF;
  --tinta:#141414;
  --tinta-suave:#5B5B54;
  --borde:#E5E3DA;
  --azul:#8FD6EF;
  --azul-claro:#DFF2FB;
  --azul-profundo:#0E5E80;
  --azul-noche:#072B3C;
  --azul-marino:#041E2B;
  --ambar:#E8A33D;
  --ambar-oscuro:#C98320;
  --ambar-claro:#FBEFD7;
  --radio:18px;
  --radio-xl:26px;
  --sombra:0 18px 44px rgba(4,30,43,.12);
  --sombra-suave:0 8px 24px rgba(4,30,43,.07);
  --fuente:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --fuente-titulos:"Playfair Display",Georgia,"Times New Roman",serif;
}

*{box-sizing:border-box;margin:0;padding:0}

html{scroll-behavior:smooth;scroll-padding-top:88px;-webkit-text-size-adjust:100%}

body{font-family:var(--fuente);color:var(--tinta);background:var(--papel);line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}

img{max-width:100%;display:block;height:auto}

a{color:var(--azul-profundo);text-decoration:none}
a:hover{color:var(--azul-noche)}

h1,h2,h3,h4{font-family:var(--fuente-titulos);line-height:1.15;font-weight:700;color:var(--tinta);letter-spacing:-.01em;text-wrap:balance}

.contenedor{width:min(1160px,92%);margin-inline:auto}

/* Enlace de salto */
.saltar{position:absolute;left:-9999px;top:0;z-index:1000;background:var(--ambar);color:#2A1B06;padding:12px 20px;border-radius:0 0 14px 0;font-weight:700}
.saltar:focus{left:0}

/* Cabecera */
.cabecera{position:sticky;top:0;z-index:60;background:rgba(245,245,240,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:box-shadow .3s ease,border-color .3s ease}
.cabecera.compacta{box-shadow:0 6px 24px rgba(4,30,43,.10);border-bottom-color:var(--borde)}
.cabecera__interior{display:flex;align-items:center;gap:16px;height:76px}

.marca{display:flex;align-items:center;gap:10px;color:var(--tinta)}
.marca__logo{width:42px;height:42px;border-radius:12px;box-shadow:var(--sombra-suave)}
.marca__texto{font-family:var(--fuente-titulos);font-weight:700;font-size:1.35rem;letter-spacing:-.02em}

.menu{display:flex;gap:4px;margin-left:auto;align-items:center}
.menu a{padding:9px 15px;border-radius:999px;color:var(--tinta-suave);font-weight:600;font-size:.95rem;transition:background .2s ease,color .2s ease}
.menu a:hover{background:var(--azul-claro);color:var(--azul-profundo)}

.menu__boton{display:none;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;background:none;border:0;cursor:pointer;border-radius:10px}
.menu__boton span{display:block;width:24px;height:3px;background:var(--tinta);border-radius:3px;transition:transform .3s ease,opacity .3s ease;margin-inline:auto}
.menu__boton.activo span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.menu__boton.activo span:nth-child(2){opacity:0}
.menu__boton.activo span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* Hero */
.hero{background:radial-gradient(900px 520px at 85% -10%,rgba(143,214,239,.28),transparent 60%),radial-gradient(700px 500px at 10% 115%,rgba(232,163,61,.2),transparent 55%),linear-gradient(160deg,var(--azul-noche),var(--azul-marino));color:#EAF6FB;padding:80px 0 72px;text-align:center}
.hero__interior{display:flex;flex-direction:column;align-items:center;gap:18px}
.hero__logo{width:128px;height:128px;border-radius:26px;box-shadow:0 20px 50px rgba(0,0,0,.4)}
.hero__sobre{font-size:.8rem;letter-spacing:1.4px;text-transform:uppercase;font-weight:700;color:var(--azul);background:rgba(143,214,239,.12);padding:8px 18px;border-radius:999px}
.hero__titulo{font-size:clamp(3rem,9vw,5rem);color:#fff;font-weight:700;letter-spacing:-.02em;font-style:italic}
.hero__lema{font-family:var(--fuente-titulos);font-style:italic;font-size:clamp(1.15rem,3vw,1.5rem);color:var(--azul)}
.hero__texto{max-width:660px;color:#CBE3EE;font-size:1.06rem}
.hero__acciones{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:10px}

/* Botones */
.boton{display:inline-flex;align-items:center;gap:8px;padding:14px 28px;border-radius:999px;font-weight:700;font-size:1rem;line-height:1;transition:transform .2s ease,box-shadow .2s ease,background .2s ease,color .2s ease;touch-action:manipulation}
.boton:hover{transform:translateY(-2px)}
.boton:focus-visible{outline:3px solid var(--azul);outline-offset:2px}
.boton--ambar{background:var(--ambar);color:#2A1B06;box-shadow:0 10px 24px rgba(232,163,61,.38)}
.boton--ambar:hover{background:var(--ambar-oscuro);color:#1A1003}
.boton--fantasma{background:rgba(255,255,255,.08);color:#fff;border:1.5px solid rgba(255,255,255,.35)}
.boton--fantasma:hover{background:rgba(255,255,255,.18);color:#fff}
.boton--azul{background:var(--azul-profundo);color:#fff;box-shadow:0 10px 22px rgba(14,94,128,.3)}
.boton--azul:hover{background:var(--azul-noche);color:#fff}
.boton--app{background:var(--azul-profundo);color:#fff;box-shadow:0 8px 18px rgba(14,94,128,.28);padding:11px 20px;font-size:.92rem}

/* Secciones */
.seccion{padding:76px 0}
.seccion--fondo{background:var(--blanco)}
.etiqueta{display:inline-block;font-size:.78rem;font-weight:800;letter-spacing:1.3px;text-transform:uppercase;color:var(--azul-profundo);background:var(--azul-claro);padding:6px 15px;border-radius:999px;margin-bottom:16px}
.titulo{font-size:clamp(1.9rem,4.5vw,2.6rem);margin-bottom:14px}
.titulo em{font-style:italic;color:var(--ambar-oscuro)}
.intro{max-width:780px;color:var(--tinta-suave);font-size:1.08rem;margin-bottom:36px}

/* Tarjetas de valores */
.columnas{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:26px}
.tarjeta{background:var(--blanco);border:1px solid var(--borde);border-radius:var(--radio);padding:30px;box-shadow:var(--sombra-suave)}
.tarjeta--valor h3{font-size:1.2rem;margin-bottom:10px}
.tarjeta--valor p{color:var(--tinta-suave)}
.tarjeta__icono{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;font-size:1.6rem;background:var(--azul-claro);border-radius:16px;margin-bottom:16px}

/* Noticias */
.noticias{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px}
.noticia{display:flex;flex-direction:column;background:var(--blanco);border:1px solid var(--borde);border-radius:var(--radio-xl);overflow:hidden;box-shadow:var(--sombra-suave);transition:transform .25s ease,box-shadow .25s ease}
.noticia:hover{transform:translateY(-5px);box-shadow:var(--sombra)}
.noticia--destacada{border-color:var(--azul);box-shadow:0 12px 34px rgba(14,94,128,.14)}
.noticia__cuerpo{padding:26px;display:flex;flex-direction:column;gap:10px;flex:1}
.noticia__meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.noticia__etiqueta{font-size:.72rem;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--azul-profundo);background:var(--azul-claro);padding:4px 11px;border-radius:999px}
.noticia--destacada .noticia__etiqueta{background:var(--ambar);color:#2A1B06}
.noticia__fecha{font-size:.82rem;color:var(--tinta-suave);font-variant-numeric:tabular-nums}
.noticia__titulo{font-size:1.3rem;line-height:1.25}
.noticia__texto{color:var(--tinta-suave);font-size:.96rem}

/* Aplicaciones */
.apps{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:22px}
.app{display:flex;flex-direction:column;background:var(--papel);border:1px solid var(--borde);border-radius:var(--radio-xl);overflow:hidden;box-shadow:var(--sombra-suave);transition:transform .25s ease,box-shadow .25s ease}
.app:hover{transform:translateY(-5px);box-shadow:var(--sombra)}
.app--proxima{opacity:.84}
.app__cuerpo{padding:26px 26px 20px;flex:1}
.app__emoji{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;font-size:1.7rem;background:var(--azul-claro);border-radius:16px;margin-bottom:14px}
.app__nombre{font-size:1.25rem;margin-bottom:8px}
.app__desc{color:var(--tinta-suave);font-size:.97rem}
.app__etiquetas{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.app__etiquetas span{font-size:.76rem;font-weight:700;color:var(--azul-profundo);background:var(--azul-claro);padding:5px 12px;border-radius:999px}
.app__pie{padding:16px 26px;border-top:1px dashed var(--borde);display:flex;align-items:center}
.app__aviso{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:#8A6D2F;background:var(--ambar-claro);padding:8px 16px;border-radius:999px;font-size:.88rem}
.app__aviso::before{content:"⏳"}

/* Barrioteca */
.pasos{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin:30px 0 42px}
.paso{background:var(--blanco);border:1px solid var(--borde);border-radius:var(--radio);padding:22px 18px;text-align:center;box-shadow:var(--sombra-suave)}
.paso__num{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:var(--ambar);color:#2A1B06;font-weight:800;font-size:1rem;margin-bottom:12px}
.paso h3{font-size:1.05rem;margin-bottom:8px}
.paso p{font-size:.9rem;color:var(--tinta-suave)}

.instalacion{background:linear-gradient(135deg,var(--azul-claro),#F2FAFE);border:1px solid #CBE7F3;border-radius:var(--radio-xl);padding:32px}
.instalacion h3{font-size:1.3rem;margin-bottom:12px}
.instalacion p{margin-bottom:8px}
.instalacion .boton{margin-top:14px}

/* Ubicación */
.ubicacion{display:grid;grid-template-columns:.85fr 1.15fr;gap:26px;align-items:stretch}
.ubicacion__datos{background:var(--blanco);border:1px solid var(--borde);border-radius:var(--radio-xl);padding:32px;box-shadow:var(--sombra-suave);display:flex;flex-direction:column;gap:12px}
.ubicacion__datos h3{font-size:1.3rem}
.ubicacion__direccion{font-size:1.15rem;color:var(--tinta)}
.ubicacion__nota{color:var(--tinta-suave);font-size:.95rem}
.ubicacion__datos .boton{align-self:flex-start;margin-top:8px}
.ubicacion__mapa{border-radius:var(--radio-xl);overflow:hidden;border:1px solid var(--borde);box-shadow:var(--sombra-suave);min-height:340px}
.ubicacion__mapa iframe{width:100%;height:100%;min-height:340px;border:0;display:block}

/* Contacto */
.contacto{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:22px}
.contacto__tarjeta{display:flex;flex-direction:column;gap:6px;background:var(--blanco);border:1px solid var(--borde);border-radius:var(--radio-xl);padding:28px;box-shadow:var(--sombra-suave);transition:transform .25s ease,box-shadow .25s ease}
.contacto__tarjeta:hover{transform:translateY(-4px);box-shadow:var(--sombra);color:var(--azul-noche)}
.contacto__icono{font-size:1.8rem;margin-bottom:8px}
.contacto__nombre{font-family:var(--fuente-titulos);font-weight:700;font-size:1.2rem;color:var(--tinta)}
.contacto__valor{font-weight:600;color:var(--azul-profundo)}
.contacto__desc{color:var(--tinta-suave);font-size:.92rem}

/* Programación */
.apertura{display:flex;gap:18px;align-items:flex-start;background:linear-gradient(135deg,var(--azul-claro),#F2FAFE);border:1px solid #CBE7F3;border-radius:var(--radio-xl);padding:26px 28px;margin-bottom:30px}
.apertura__icono{font-size:2rem;line-height:1}
.apertura__cuerpo h3{font-size:1.25rem;margin-bottom:6px}
.apertura__cuerpo p{color:var(--tinta-suave)}

.programacion{display:flex;flex-direction:column;gap:16px}
.evento{display:flex;gap:20px;align-items:stretch;background:var(--blanco);border:1px solid var(--borde);border-radius:var(--radio-xl);padding:22px 24px;box-shadow:var(--sombra-suave);transition:transform .25s ease,box-shadow .25s ease}
.evento:hover{transform:translateY(-3px);box-shadow:var(--sombra)}
.evento__fecha{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:68px;background:var(--azul-claro);border-radius:16px;padding:12px 10px}
.evento__dia{font-family:var(--fuente-titulos);font-weight:700;font-size:1.7rem;line-height:1;color:var(--azul-profundo)}
.evento__mes{font-size:.72rem;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--azul-profundo);margin-top:4px}
.evento__cuerpo{display:flex;flex-direction:column;gap:8px}
.evento__meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.evento__etiqueta{font-size:.72rem;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--azul-profundo);background:var(--azul-claro);padding:4px 11px;border-radius:999px}
.evento__hora{font-size:.85rem;font-weight:700;color:var(--ambar-oscuro);font-variant-numeric:tabular-nums}
.evento__titulo{font-size:1.25rem}
.evento__texto{color:var(--tinta-suave);font-size:.95rem}
.programacion__vacia{background:var(--blanco);border:1px dashed var(--borde);border-radius:var(--radio-xl);padding:32px;text-align:center;color:var(--tinta-suave)}

/* Pie */
.pie{background:linear-gradient(160deg,var(--azul-noche),var(--azul-marino));color:#CBE3EE;padding:56px 0 0}
.pie__interior{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:34px;padding-bottom:38px}
.pie__logo{width:64px;height:64px;border-radius:16px;margin-bottom:14px}
.pie h4{color:#fff;font-size:.9rem;margin-bottom:12px;letter-spacing:.5px;text-transform:uppercase;font-family:var(--fuente)}
.pie a{display:block;color:#CBE3EE;padding:4px 0}
.pie a:hover{color:var(--azul)}
.pie p{font-size:.95rem}
.pie__fin{border-top:1px solid rgba(255,255,255,.12);padding:20px 0;font-size:.88rem;color:#9DB7C2}

/* Animaciones */
.aparecer{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.aparecer.visible{opacity:1;transform:none}

/* Responsive */
@media (max-width:920px){
  .menu__boton{display:flex}
  .menu{position:absolute;top:76px;left:0;right:0;flex-direction:column;align-items:stretch;background:var(--papel);border-bottom:1px solid var(--borde);box-shadow:var(--sombra);padding:14px;gap:4px;display:none}
  .menu.abierto{display:flex}
  .menu a{text-align:center;padding:12px;border-radius:12px}
  .columnas{grid-template-columns:1fr}
  .pasos{grid-template-columns:repeat(2,1fr)}
  .ubicacion{grid-template-columns:1fr}
  .pie__interior{grid-template-columns:1fr;gap:24px}
}

@media (max-width:560px){
  .pasos{grid-template-columns:1fr}
  .hero{padding:56px 0}
  .hero__logo{width:104px;height:104px}
  .seccion{padding:54px 0}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none !important;animation:none !important}
  .aparecer{opacity:1;transform:none}
}