@charset "UTF-8";
/* ============================================================
   Dicrisur, S.L. — Hoja de estilos única
   Almacén y transformador de vidrio · Alcalá de Guadaíra, Sevilla
   ============================================================ */

/* ---------- 1. Tipografía autoalojada ---------- */
@font-face{font-family:"Plex";src:url("../fonts/IBMPlexSans-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Plex";src:url("../fonts/IBMPlexSans-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Plex";src:url("../fonts/IBMPlexSans-SemiBold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"PlexCond";src:url("../fonts/IBMPlexSansCondensed-SemiBold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"PlexCond";src:url("../fonts/IBMPlexSansCondensed-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"PlexMono";src:url("../fonts/IBMPlexMono-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}

/* ---------- 2. Tokens ---------- */
:root{
  /* Identidad conservada de la web anterior */
  --azul:#0e4487;
  --azul-osc:#092f60;
  --azul-prof:#07203f;
  --azul-noche:#05162c;
  /* Acento: el verde-azulado del canto del vidrio float.
     --canto se usa para trazos e iconos; --canto-btn es el tono con el que
     el texto blanco alcanza 4.5:1, y es el único válido como fondo de botón. */
  --canto:#0a8c86;
  --canto-btn:#07726d;
  --canto-osc:#055d59;
  --canto-claro:#d5eceb;
  /* Neutros con sesgo frío */
  --papel:#f4f7f9;
  --papel-2:#e9eef3;
  --blanco:#fff;
  --tinta:#16203a;
  --tinta-2:#46536e;
  --tinta-3:#66718d;
  --linea:#dde4ec;
  --linea-fuerte:#c3cedb;

  --fuente:"Plex",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --fuente-tit:"PlexCond","Plex",-apple-system,"Segoe UI",sans-serif;
  --fuente-mono:"PlexMono",ui-monospace,Consolas,monospace;

  --ancho:1200px;
  --ancho-texto:68ch;
  --radio:3px;
  --sombra:0 1px 2px rgba(9,32,63,.06),0 6px 20px rgba(9,32,63,.07);
  --sombra-alta:0 2px 4px rgba(9,32,63,.08),0 16px 44px rgba(9,32,63,.14);
  --transicion:180ms cubic-bezier(.4,0,.2,1);
}

/* ---------- 3. Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
body{
  font-family:var(--fuente);
  font-size:1.0625rem;      /* 17px — la web anterior usaba 13-14px */
  line-height:1.65;
  color:var(--tinta);
  background:var(--blanco);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,picture,svg,video{display:block;max-width:100%;height:auto}
input,button,textarea,select{font:inherit;color:inherit}
table{border-collapse:collapse}

/* Foco visible — la plantilla anterior lo eliminaba con outline:none */
:focus-visible{outline:3px solid var(--canto);outline-offset:2px;border-radius:2px}
:focus:not(:focus-visible){outline:none}

::selection{background:var(--azul);color:#fff}

/* ---------- 4. Utilidades ---------- */
.contenedor{width:100%;max-width:var(--ancho);margin-inline:auto;padding-inline:clamp(1rem,4vw,2.5rem)}
.solo-lectores{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.saltar{position:absolute;top:-100px;left:1rem;z-index:200;background:var(--azul);color:#fff;padding:.75rem 1.25rem;font-weight:600;border-radius:0 0 var(--radio) var(--radio);transition:top var(--transicion)}
.saltar:focus{top:0}

/* Motivo de sección de doble acristalamiento: vidrio · cámara · vidrio */
.capas{height:6px;background:
  linear-gradient(var(--azul),var(--azul)) 0 0/100% 2px no-repeat,
  linear-gradient(var(--canto),var(--canto)) 0 100%/100% 2px no-repeat;
  background-color:transparent}

/* ---------- 5. Tipografía ---------- */
h1,h2,h3,h4{font-family:var(--fuente-tit);font-weight:700;line-height:1.12;letter-spacing:-.015em;text-wrap:balance;color:var(--tinta)}
h1{font-size:clamp(2.1rem,5.2vw,3.5rem)}
h2{font-size:clamp(1.65rem,3.4vw,2.4rem)}
h3{font-size:clamp(1.2rem,2vw,1.45rem);font-weight:600}
h4{font-size:1.0625rem;font-weight:600;letter-spacing:0}
p{text-wrap:pretty}
a{color:var(--azul);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--canto-osc)}

.rotulo{font-family:var(--fuente-mono);font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--canto-osc);font-weight:500}
.entradilla{font-size:clamp(1.1rem,1.9vw,1.3rem);line-height:1.55;color:var(--tinta-2);max-width:60ch}
.dato{font-family:var(--fuente-mono);font-variant-numeric:tabular-nums}

/* ---------- 6. Cabecera ---------- */
.cabecera{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.97);backdrop-filter:blur(10px);border-bottom:1px solid var(--linea)}
.cabecera-barra{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;min-height:76px}
.logo{display:flex;align-items:center;flex-shrink:0}
.logo img{width:auto;height:34px}

.cabecera-acciones{display:flex;align-items:center;gap:.6rem}
.tel-cabecera{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--fuente-mono);font-size:.95rem;font-weight:500;color:var(--azul);text-decoration:none;padding:.55rem .8rem;border-radius:var(--radio);min-height:44px;white-space:nowrap}
.tel-cabecera:hover{background:var(--papel);color:var(--azul-osc)}

/* Menú */
.nav{display:flex;align-items:center;gap:.15rem}
.nav-menu>li{position:relative;list-style:none}
.nav a{display:flex;align-items:center;min-height:44px;padding:.4rem .8rem;font-size:.97rem;font-weight:500;color:var(--tinta);text-decoration:none;border-radius:var(--radio);white-space:nowrap}
.nav a:hover,.nav a:focus-visible{background:var(--papel);color:var(--azul)}
.nav a[aria-current="page"]{color:var(--azul);box-shadow:inset 0 -2px 0 var(--canto)}
.nav-menu{list-style:none;padding:0;margin:0;display:flex;gap:.15rem}

.desplegable>button{display:flex;align-items:center;gap:.35rem;min-height:44px;padding:.4rem .8rem;font-size:.97rem;font-weight:500;color:var(--tinta);background:none;border:0;border-radius:var(--radio);cursor:pointer}
.desplegable>button:hover{background:var(--papel);color:var(--azul)}
.desplegable>button::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform var(--transicion)}
.desplegable>button[aria-expanded="true"]::after{transform:rotate(-135deg) translateY(-2px)}
/* top:100% sin hueco: con un margen ahí el ratón "sale" del área activa
   del <li> (que solo mide lo que mide el botón, al ser el submenú
   position:absolute) antes de llegar al desplegable, y este se cierra
   de golpe. El borde y la sombra ya separan visualmente los dos. */
.submenu{position:absolute;top:100%;left:0;min-width:270px;background:#fff;border:1px solid var(--linea);border-radius:var(--radio);box-shadow:var(--sombra-alta);padding:.4rem;list-style:none;margin:0;display:none;z-index:110}
.desplegable>button[aria-expanded="true"]+.submenu{display:block}
.submenu a{padding:.6rem .8rem;font-size:.95rem;border-radius:2px}
.submenu-grupo{font-family:var(--fuente-mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--tinta-3);padding:.7rem .8rem .25rem}

.hamburguesa{display:none;width:46px;height:46px;align-items:center;justify-content:center;background:none;border:1px solid var(--linea);border-radius:var(--radio);cursor:pointer}
.hamburguesa span{display:block;width:20px;height:2px;background:var(--tinta);position:relative;transition:var(--transicion)}
.hamburguesa span::before,.hamburguesa span::after{content:"";position:absolute;left:0;width:20px;height:2px;background:var(--tinta);transition:var(--transicion)}
.hamburguesa span::before{top:-6px}
.hamburguesa span::after{top:6px}
.hamburguesa[aria-expanded="true"] span{background:transparent}
.hamburguesa[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
.hamburguesa[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}

@media (max-width:1080px){
  .hamburguesa{display:flex}
  .tel-cabecera span{display:none}
  .nav{position:fixed;inset:76px 0 0;background:#fff;flex-direction:column;align-items:stretch;gap:0;padding:1rem clamp(1rem,4vw,2rem) 3rem;overflow-y:auto;transform:translateX(100%);transition:transform var(--transicion);border-top:1px solid var(--linea)}
  .nav[data-abierto="true"]{transform:translateX(0)}
  .nav-menu{flex-direction:column;gap:0;width:100%}
  .nav>li,.nav-menu>li{width:100%;border-bottom:1px solid var(--linea)}
  .nav a,.desplegable>button{width:100%;min-height:52px;font-size:1.05rem;border-radius:0}
  .desplegable>button{justify-content:space-between}
  .submenu{position:static;display:none;min-width:0;border:0;box-shadow:none;background:var(--papel);border-radius:0;padding:.25rem 0 .5rem;margin:0 0 .5rem}
  .desplegable>button[aria-expanded="true"]+.submenu{display:block}
  .submenu a{padding-left:1.5rem}
}

/* ---------- 7. Portada ---------- */
.hero{position:relative;background:var(--azul-prof);color:#fff;overflow:hidden}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,var(--azul-noche) 0%,rgba(7,32,63,.94) 42%,rgba(7,32,63,.55) 100%);z-index:1}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.hero-int{position:relative;z-index:2;padding-block:clamp(3.5rem,9vw,7rem);max-width:44rem}
.hero h1{color:#fff;margin-bottom:1.1rem}
.hero h1 em{font-style:normal;color:#7fd4cf}
.hero p{font-size:clamp(1.08rem,1.8vw,1.28rem);color:#c6d5e8;line-height:1.55;max-width:38rem}
.hero .rotulo{color:#7fd4cf;display:block;margin-bottom:1rem}
.hero-botones{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2rem}

/* Cifras del negocio */
.cifras{display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:1px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.16);position:relative;z-index:2;margin-top:2.75rem}
.cifra{background:var(--azul-prof);padding:1.1rem 1.15rem;display:flex;flex-direction:column;gap:.15rem}
.cifra b{font-family:var(--fuente-tit);font-size:1.85rem;line-height:1;color:#fff;font-variant-numeric:tabular-nums}
.cifra span{font-family:var(--fuente-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:#93aecd;line-height:1.35}

/* ---------- 8. Botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:48px;padding:.75rem 1.5rem;font-family:var(--fuente);font-size:1rem;font-weight:600;text-decoration:none;border:2px solid transparent;border-radius:var(--radio);cursor:pointer;transition:var(--transicion);text-align:center}
.btn-1{background:var(--canto-btn);color:#fff;border-color:var(--canto-btn)}
.btn-1:hover{background:var(--canto-osc);border-color:var(--canto-osc);color:#fff}
.btn-2{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.btn-2:hover{background:rgba(255,255,255,.12);border-color:#fff;color:#fff}
.btn-3{background:var(--azul);color:#fff;border-color:var(--azul)}
.btn-3:hover{background:var(--azul-osc);border-color:var(--azul-osc);color:#fff}
.btn-4{background:#fff;color:var(--azul);border-color:var(--linea-fuerte)}
.btn-4:hover{border-color:var(--azul);background:var(--papel);color:var(--azul)}

/* ---------- 9. Secciones ---------- */
.seccion{padding-block:clamp(3rem,7vw,5.5rem)}
.seccion-clara{background:var(--papel)}
.seccion-oscura{background:var(--azul-prof);color:#fff}
.seccion-oscura h2,.seccion-oscura h3{color:#fff}
.seccion-oscura p{color:#c6d5e8}
.seccion-oscura .rotulo{color:#7fd4cf}
.seccion-oscura .lista-clara{color:#c6d5e8}
/* Las cajas de fondo claro dentro de una sección oscura recuperan su propio
   color de texto: sin esto heredan el blanco y quedan ilegibles. */
.seccion-oscura .caja:not(.caja-cta),
.seccion-oscura .caja:not(.caja-cta) h2,
.seccion-oscura .caja:not(.caja-cta) h3,
.seccion-oscura .caja:not(.caja-cta) b{color:var(--tinta)}
.seccion-oscura .caja:not(.caja-cta) p,
.seccion-oscura .caja:not(.caja-cta) .caja-cpo,
.seccion-oscura .caja:not(.caja-cta) li{color:var(--tinta-2)}
.seccion-oscura .caja:not(.caja-cta) a:not(.btn){color:var(--azul)}
.seccion-cab{margin-bottom:2.5rem;max-width:var(--ancho-texto)}
.seccion-cab .rotulo{display:block;margin-bottom:.6rem}
.seccion-cab h2{margin-bottom:.75rem}
.seccion-cab p{color:var(--tinta-2);font-size:1.08rem}
.seccion-intro{margin:.6rem 0 1.25rem}
.seccion-texto{max-width:60ch;margin-bottom:1.5rem}

/* ---------- 10. Rejilla de productos ---------- */
.familia+.familia{margin-top:3rem}
.familia-tit{display:flex;align-items:baseline;gap:1rem;padding-bottom:.7rem;border-bottom:2px solid var(--azul);margin-bottom:1.5rem}
.familia-tit h3{font-size:clamp(1.15rem,2vw,1.4rem);margin:0}
.familia-tit .rotulo{margin-left:auto;text-align:right}

.rejilla{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,17.5rem),1fr));gap:1.5rem}
.tarjeta{display:flex;flex-direction:column;background:#fff;border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden;transition:var(--transicion);text-decoration:none;color:inherit;height:100%}
.tarjeta:hover{border-color:var(--canto);box-shadow:var(--sombra-alta);transform:translateY(-3px);color:inherit}
.tarjeta-img{aspect-ratio:3/2;overflow:hidden;background:var(--papel-2)}
.tarjeta-img img{width:100%;height:100%;object-fit:cover;transition:transform 400ms cubic-bezier(.4,0,.2,1)}
.tarjeta:hover .tarjeta-img img{transform:scale(1.04)}
.tarjeta-cpo{padding:1.15rem 1.25rem 1.4rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.tarjeta-cpo h4{font-family:var(--fuente-tit);font-size:1.2rem;font-weight:700;letter-spacing:-.01em;color:var(--azul)}
.tarjeta-cpo p{font-size:.96rem;color:var(--tinta-2);line-height:1.5;flex:1}
.tarjeta-mas{font-family:var(--fuente-mono);font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;color:var(--canto-osc);font-weight:500;display:inline-flex;align-items:center;gap:.4rem;margin-top:.25rem}
.tarjeta:hover .tarjeta-mas{gap:.7rem}
.tarjeta-mas::after{content:"→";transition:var(--transicion)}

/* ---------- 11. Página interior ---------- */
.migas{background:var(--papel);border-bottom:1px solid var(--linea);padding-block:.7rem;font-size:.87rem}
.migas ol{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;list-style:none;padding:0;margin:0;color:var(--tinta-3)}
.migas li{display:flex;align-items:center;gap:.45rem}
.migas li+li::before{content:"/";color:var(--linea-fuerte)}
.migas a{color:var(--tinta-2);text-decoration:none}
.migas a:hover{color:var(--azul);text-decoration:underline}
.migas [aria-current]{color:var(--tinta);font-weight:500}

.pagina-cab{padding-block:clamp(2.25rem,5vw,3.5rem) clamp(1.5rem,3vw,2.25rem);border-bottom:1px solid var(--linea)}
.pagina-cab .rotulo{display:block;margin-bottom:.6rem}
.pagina-cab h1{margin-bottom:.9rem}
.pagina-cab .entradilla{margin-top:.5rem}

.cuerpo{padding-block:clamp(2.25rem,5vw,3.5rem)}
.disposicion{display:grid;grid-template-columns:minmax(0,1fr) 19rem;gap:clamp(2rem,4vw,3.5rem);align-items:start}
@media (max-width:960px){.disposicion{grid-template-columns:1fr}}

.prosa{max-width:var(--ancho-texto);font-size:1.0625rem}
.prosa>*+*{margin-top:1.15rem}
.prosa h2{font-size:clamp(1.4rem,2.6vw,1.8rem);margin-top:2.5rem;padding-bottom:.5rem;border-bottom:1px solid var(--linea)}
.prosa h3{margin-top:2rem;color:var(--azul)}
.prosa h2:first-child,.prosa h3:first-child{margin-top:0}
.prosa p{color:var(--tinta-2)}
.prosa strong{color:var(--tinta);font-weight:600}
/* :where(.prosa) aporta especificidad cero: así una lista con su propio
   diseño (.catalogos, .descargas) puede ganarle sin necesidad de anidar
   selectores ni usar !important. Antes .prosa ul (0,1,1) le ganaba a
   .catalogos (0,1,0) y la aplastaba a una sola columna. */
:where(.prosa) ul,:where(.prosa) ol{padding-left:1.3rem;color:var(--tinta-2);display:flex;flex-direction:column;gap:.45rem}
.prosa li::marker{color:var(--canto)}
.prosa img{border-radius:var(--radio);border:1px solid var(--linea)}
.prosa figure{margin:2rem 0}
.prosa figcaption{font-size:.87rem;color:var(--tinta-3);margin-top:.6rem;font-family:var(--fuente-mono)}
.prosa a{font-weight:500}

/* Lista de características con marca de vidrio */
.lista-check{list-style:none;padding:0!important}
.lista-check li{position:relative;padding-left:1.75rem}
.lista-check li::before{content:"";position:absolute;left:0;top:.62em;width:10px;height:10px;background:var(--canto);border-radius:1px}

/* ---------- 12. Ficha técnica: los datos SON el producto ---------- */
.especs{border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden;margin:2rem 0}
.especs-cab{background:var(--azul);color:#fff;padding:.8rem 1.15rem;font-family:var(--fuente-tit);font-size:1.05rem;font-weight:600;letter-spacing:.01em}
.especs-cpo{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:1px;background:var(--linea)}
.espec{background:#fff;padding:.95rem 1.15rem;display:flex;flex-direction:column;gap:.15rem}
.espec dt{font-family:var(--fuente-mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--tinta-3)}
.espec dd{font-family:var(--fuente-mono);font-size:1.05rem;font-weight:500;color:var(--tinta);margin:0;font-variant-numeric:tabular-nums}

/* Tablas de valores técnicos */
.tabla-envoltura{overflow-x:auto;margin:1.75rem 0;border:1px solid var(--linea);border-radius:var(--radio);-webkit-overflow-scrolling:touch}
.tabla{width:100%;min-width:32rem;font-size:.94rem;background:#fff}
.tabla caption{text-align:left;padding:.85rem 1rem;font-family:var(--fuente-tit);font-size:1.02rem;font-weight:600;color:var(--tinta);background:var(--papel);border-bottom:1px solid var(--linea)}
.tabla th,.tabla td{padding:.62rem 1rem;text-align:left;border-bottom:1px solid var(--linea)}
.tabla thead th{background:var(--papel-2);font-family:var(--fuente-mono);font-size:.71rem;letter-spacing:.07em;text-transform:uppercase;color:var(--tinta-2);font-weight:500;vertical-align:bottom;line-height:1.35}
.tabla tbody tr:last-child th,.tabla tbody tr:last-child td{border-bottom:0}
.tabla tbody tr:nth-child(even){background:#fafcfd}
.tabla tbody th{font-family:var(--fuente-mono);font-weight:500;color:var(--azul);white-space:nowrap}
.tabla td{font-family:var(--fuente-mono);font-variant-numeric:tabular-nums;color:var(--tinta-2)}
.tabla-nota{font-size:.85rem;color:var(--tinta-3);margin-top:-1rem;margin-bottom:1.75rem}

/* ---------- 12b. Equipo ---------- */
.equipo{list-style:none;padding:0!important;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));gap:1px;background:var(--linea);border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden}
.persona{background:#fff;padding:.9rem 1.1rem;display:flex;flex-direction:column;gap:.1rem}
.persona b{font-size:1rem;font-weight:600;color:var(--tinta);line-height:1.3}
.persona span{font-family:var(--fuente-mono);font-size:.76rem;color:var(--tinta-3);line-height:1.4}

/* ---------- 12c. Preguntas frecuentes ---------- */
.faq-item{border-bottom:1px solid var(--linea);padding-bottom:1.4rem}
.faq-item+.faq-item{margin-top:1.6rem}
.faq-item h2{font-size:clamp(1.1rem,2vw,1.3rem);margin-top:0!important;padding-bottom:0!important;border-bottom:0!important;color:var(--azul)}
.faq-item p{margin-top:.6rem}

/* ---------- 13. Barra lateral ---------- */
.lateral{display:flex;flex-direction:column;gap:1.25rem;position:sticky;top:96px}
@media (max-width:960px){.lateral{position:static}}
.caja{border:1px solid var(--linea);border-radius:var(--radio);background:#fff;overflow:hidden}
.caja-cab{background:var(--papel);padding:.8rem 1.1rem;font-family:var(--fuente-tit);font-size:1rem;font-weight:600;border-bottom:1px solid var(--linea)}
.caja-cpo{padding:1.1rem;font-size:.95rem;color:var(--tinta-2);display:flex;flex-direction:column;gap:.7rem}
.caja-lista{list-style:none;padding:0;margin:0;display:flex;flex-direction:column}
.caja-lista li+li{border-top:1px solid var(--linea)}
.caja-lista a{display:block;padding:.7rem 1.1rem;font-size:.95rem;color:var(--tinta-2);text-decoration:none;min-height:44px;display:flex;align-items:center}
.caja-lista a:hover{background:var(--papel);color:var(--azul)}

/* Horario en la barra lateral */
.horario{display:flex;flex-direction:column;gap:.75rem;margin:0}
.horario dt{font-weight:600;color:var(--tinta);font-size:.95rem}
.horario dd{margin:.1rem 0 0;font-family:var(--fuente-mono);font-size:1.02rem;color:var(--tinta-2);font-variant-numeric:tabular-nums}
.horario-nota{font-size:.88rem;color:var(--tinta-3);margin-top:.25rem}

.caja-cta{background:var(--azul-prof);border-color:var(--azul-prof);color:#fff}
.caja-cta .caja-cab{background:var(--azul-noche);color:#fff;border-color:rgba(255,255,255,.14)}
.caja-cta .caja-cpo{color:#c6d5e8}
.caja-cta .btn{width:100%}

/* Descargas */
.descargas{list-style:none;padding:0;margin:1.75rem 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));gap:.75rem}
.descarga{display:flex;align-items:center;gap:.8rem;padding:.85rem 1rem;border:1px solid var(--linea);border-radius:var(--radio);background:#fff;text-decoration:none;color:var(--tinta);transition:var(--transicion);min-height:56px}
.descarga:hover{border-color:var(--canto);background:var(--canto-claro);color:var(--tinta)}
.descarga-icono{flex-shrink:0;width:34px;height:34px;display:grid;place-items:center;background:var(--azul);color:#fff;border-radius:2px;font-family:var(--fuente-mono);font-size:.6rem;font-weight:500;letter-spacing:.03em}
.descarga-txt{display:flex;flex-direction:column;line-height:1.3;min-width:0}
.descarga-txt b{font-size:.94rem;font-weight:500}
.descarga-txt span{font-family:var(--fuente-mono);font-size:.72rem;color:var(--tinta-3)}

/* ---------- 14. Catálogos ---------- */
/* Descargables: tarjeta compacta con icono de documento en lugar de la
   miniatura original (los thumbnails del Joomla traían recortes y proporciones
   inconsistentes que no se veían bien en rejilla). */
.catalogos{display:grid;grid-template-columns:repeat(auto-fill,minmax(7.5rem,1fr));gap:.85rem;list-style:none;padding:0;margin:0}
.catalogo{display:flex;flex-direction:column;align-items:center;gap:.6rem;padding:1rem .6rem;border:1px solid var(--linea);border-radius:var(--radio);background:#fff;text-decoration:none;color:inherit;text-align:center;transition:var(--transicion)}
.catalogo:hover{border-color:var(--canto);background:var(--canto-claro);box-shadow:var(--sombra);transform:translateY(-2px);color:inherit}
.catalogo-icono{position:relative;flex-shrink:0;width:2.5rem;height:3.1rem;background:var(--azul);border-radius:1px 7px 1px 1px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:.32rem}
.catalogo-icono::before{content:"";position:absolute;top:0;right:0;width:0;height:0;border-style:solid;border-width:0 .62rem .62rem 0;border-color:transparent var(--papel) transparent transparent}
.catalogo-icono span{font-family:var(--fuente-mono);font-size:.56rem;letter-spacing:.03em;color:#fff;font-weight:600}
.catalogo:hover .catalogo-icono{background:var(--canto-btn)}
.catalogo-nombre{font-size:.83rem;font-weight:500;line-height:1.32;color:var(--tinta)}
.catalogo-peso{font-family:var(--fuente-mono);font-size:.68rem;color:var(--tinta-3)}

/* ---------- 15. Formularios ---------- */
.formulario{max-width:40rem;display:flex;flex-direction:column;gap:1.15rem}
.campo{display:flex;flex-direction:column;gap:.4rem}
.campo label{font-size:.95rem;font-weight:600;color:var(--tinta)}
.campo .obligatorio{color:var(--canto-osc)}
.campo .ayuda{font-size:.85rem;color:var(--tinta-3);font-weight:400}
.campo input,.campo textarea,.campo select{width:100%;min-height:50px;padding:.7rem .9rem;background:#fff;border:1px solid var(--linea-fuerte);border-radius:var(--radio);font-size:1rem;transition:var(--transicion)}
.campo textarea{min-height:9rem;resize:vertical;line-height:1.55}
.campo input:hover,.campo textarea:hover{border-color:var(--tinta-3)}
.campo input:focus,.campo textarea:focus{border-color:var(--azul);box-shadow:0 0 0 3px rgba(14,68,135,.13);outline:none}
.campo input:user-invalid,.campo textarea:user-invalid{border-color:#b3261e}
.campo input:user-invalid+.error{display:block}
.error{display:none;font-size:.87rem;color:#b3261e;font-weight:500}

.casilla{display:flex;align-items:flex-start;gap:.7rem;font-size:.95rem;line-height:1.5;color:var(--tinta-2);cursor:pointer}
.casilla input[type=checkbox]{flex-shrink:0;width:22px;height:22px;min-height:0;margin-top:.15rem;accent-color:var(--azul);cursor:pointer}
.trampa{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden}

.aviso-rgpd{background:var(--papel);border:1px solid var(--linea);border-left:3px solid var(--azul);border-radius:var(--radio);padding:1.15rem 1.35rem;font-size:.92rem;line-height:1.6;color:var(--tinta-2)}
.aviso-rgpd h3{font-family:var(--fuente-tit);font-size:.95rem;letter-spacing:.04em;text-transform:uppercase;color:var(--tinta);margin-bottom:.7rem}
.aviso-rgpd dl{display:grid;gap:.4rem;margin:0}
.aviso-rgpd dt{font-weight:600;color:var(--tinta);display:inline}
.aviso-rgpd dd{margin:0 0 .5rem;display:inline}

.mensaje{padding:1rem 1.25rem;border-radius:var(--radio);font-size:.97rem;border:1px solid;margin-bottom:1.5rem}
.mensaje-ok{background:#e8f5e9;border-color:#7cb47f;color:#1c4620}
.mensaje-error{background:#fdecea;border-color:#e0a09a;color:#7d221a}

/* ---------- 16. Contacto ---------- */
.contacto-datos{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1px;background:var(--linea);border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden;margin:2rem 0}
.contacto-dato{background:#fff;padding:1.2rem 1.35rem;display:flex;flex-direction:column;gap:.35rem}
.contacto-dato .rotulo{margin-bottom:.15rem}
.contacto-dato a{font-family:var(--fuente-mono);font-size:1.08rem;font-weight:500;color:var(--azul);text-decoration:none;display:inline-flex;align-items:center;min-height:32px}
.contacto-dato a:hover{color:var(--canto-osc);text-decoration:underline}
.contacto-dato address{font-style:normal;color:var(--tinta-2);font-size:.97rem;line-height:1.5}

/* Mapa bajo demanda: no carga terceros hasta que se pulsa (sin cookies) */
.mapa{position:relative;border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden;background:var(--papel-2);aspect-ratio:16/9;margin:2rem 0}
.mapa iframe{width:100%;height:100%;border:0;display:block}
.mapa-aviso{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.9rem;text-align:center;padding:2rem;background:var(--papel-2)}
.mapa-aviso p{font-size:.94rem;color:var(--tinta-2);max-width:34ch}

/* ---------- 17. Franja de llamada a la acción ---------- */
.franja{background:var(--azul);color:#fff;padding-block:clamp(2.5rem,5vw,3.75rem)}
.franja-int{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:2rem}
.franja h2{color:#fff;font-size:clamp(1.5rem,3vw,2.1rem);margin-bottom:.5rem}
.franja p{color:#c6d5e8;max-width:44ch}
.franja-botones{display:flex;flex-wrap:wrap;gap:.75rem}
.franja .btn-1{background:#fff;color:var(--azul);border-color:#fff}
.franja .btn-1:hover{background:var(--canto-claro);border-color:var(--canto-claro);color:var(--azul-osc)}

/* ---------- 18. Pie ---------- */
.pie{background:var(--azul-noche);color:#a9bfd8;padding-block:clamp(2.75rem,5vw,4rem) 0;font-size:.95rem}
.pie-rejilla{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:2.5rem}
@media (max-width:900px){.pie-rejilla{grid-template-columns:repeat(2,1fr);gap:2rem}}
@media (max-width:520px){.pie-rejilla{grid-template-columns:1fr}}
.pie h2,.pie h3{font-family:var(--fuente-tit);font-size:.82rem;letter-spacing:.13em;text-transform:uppercase;color:#7fd4cf;margin-bottom:1rem;font-weight:600}
.pie ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.1rem}
.pie a{color:#c6d5e8;text-decoration:none;display:inline-flex;align-items:center;min-height:44px;padding-block:.15rem}
.pie a:hover{color:#fff;text-decoration:underline}
.pie address{font-style:normal;line-height:1.75;color:#a9bfd8}
.pie-zona{color:#a9bfd8;line-height:1.7}
.pie-h3-2{margin-top:1.5rem}
.pie-logo{height:32px;width:auto;margin-bottom:1.1rem;display:block}
.pie-contacto{display:flex;flex-direction:column;gap:.5rem;margin-top:.75rem}
.pie-contacto a{font-family:var(--fuente-mono);color:#fff;font-size:1rem}
.pie-legal{margin-top:3rem;border-top:1px solid rgba(255,255,255,.13);padding-block:1.4rem;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;font-size:.87rem;color:#8ba3c0}
.pie-legal ul{flex-direction:row;flex-wrap:wrap;gap:.4rem 1.3rem}
.pie-legal a{font-size:.87rem;min-height:44px}

/* ---------- 19. Botones flotantes de contacto (móvil) ---------- */
.flotante{position:fixed;right:1rem;bottom:1rem;z-index:90;display:flex;flex-direction:column;gap:.6rem}
.flotante a{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;box-shadow:var(--sombra-alta);color:#fff;text-decoration:none;transition:var(--transicion)}
.flotante a:hover{transform:scale(1.07);color:#fff}
.flotante svg{width:27px;height:27px;fill:currentColor}
.f-tel{background:var(--azul)}
.f-tel:hover{background:var(--azul-osc)}
.f-wa{background:#25d366}
.f-wa:hover{background:#1da851}
@media (min-width:1081px){.flotante{display:none}}

/* ---------- 20. Página de error ---------- */
.error-pagina{min-height:58vh;display:grid;place-items:center;text-align:center;padding-block:4rem}
.error-pagina .codigo{font-family:var(--fuente-mono);font-size:clamp(4rem,14vw,8rem);line-height:1;color:var(--papel-2);font-weight:500;letter-spacing:-.02em}
.error-texto{margin:1rem auto 2rem}
/* Aviso de error del formulario (enviar.php) */
.aviso-envio{padding-block:4rem;max-width:44rem;display:flex;flex-direction:column;gap:1.5rem}

/* ---------- 21. Aparición al cargar ---------- */
@media (prefers-reduced-motion:no-preference){
  .aparece{animation:aparece 600ms cubic-bezier(.22,1,.36,1) both}
  .aparece-2{animation-delay:110ms}
  .aparece-3{animation-delay:220ms}
  @keyframes aparece{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
}

/* ---------- 22. Impresión ---------- */
@media print{
  .cabecera,.pie,.flotante,.franja,.migas,.lateral,.hero-botones{display:none!important}
  body{font-size:11pt;color:#000;background:#fff}
  a{color:#000;text-decoration:underline}
  .tabla-envoltura{overflow:visible;border:1px solid #999}
  .prosa{max-width:none}
}