:root{
  --tinta:#0B2233;
  --tinta-suave:#3D5568;
  --agua:#0F7A80;
  --agua-oscura:#0A5B60;
  --ambar:#F2B705;
  --nube:#EFF3F4;
  --linea:#D5DEE2;
  --papel:#FFFFFF;
  --texto:#132433;
  --gris:#5A6C7A;
  --medida:68ch;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--papel);color:var(--texto);
  font-family:'IBM Plex Sans',system-ui,sans-serif;font-size:17px;line-height:1.65;
}
h1,h2,h3,h4{font-family:'Archivo',system-ui,sans-serif;font-weight:700;line-height:1.1;margin:0 0 .75rem;letter-spacing:-.02em;color:var(--tinta)}
h1{font-size:clamp(2.1rem,5vw,3.6rem)}
h2{font-size:clamp(1.5rem,3vw,2.15rem)}
h3{font-size:1.2rem}
p{margin:0 0 1.1rem;max-width:var(--medida)}
a{color:var(--agua-oscura)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--ambar);outline-offset:2px}
img{max-width:100%;height:auto}
.saltar{position:absolute;left:-9999px;background:var(--tinta);color:#fff;padding:.6rem 1rem;z-index:100}
.saltar:focus{left:1rem;top:1rem}
.apagado{color:var(--gris)}
.contenedor{padding:0 clamp(1.1rem,5vw,4.5rem)}

/* ---------- barra superior ---------- */
.barra{display:flex;align-items:center;gap:1.5rem;padding:.9rem clamp(1.1rem,5vw,4.5rem);border-bottom:1px solid var(--linea);position:sticky;top:0;background:rgba(255,255,255,.97);backdrop-filter:blur(8px);z-index:20}
.logo{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--tinta)}
.logo-sigla{font-family:'Archivo',sans-serif;font-weight:700;font-size:.95rem;letter-spacing:.14em;background:var(--tinta);color:#fff;padding:.55rem .6rem .5rem;border-radius:3px}
.logo-nombre{font-family:'Archivo',sans-serif;font-weight:600;font-size:1.05rem;line-height:1.15;display:flex;flex-direction:column}
.logo-nombre small{font-family:'IBM Plex Sans',sans-serif;font-weight:400;font-size:.76rem;color:var(--gris);letter-spacing:0}
.barra nav{margin-left:auto;display:flex;gap:1.6rem}
.barra nav a{color:var(--tinta-suave);text-decoration:none;font-size:.95rem;padding:.2rem 0;border-bottom:2px solid transparent}
.barra nav a:hover{color:var(--tinta);border-bottom-color:var(--agua)}
.barra nav a[aria-current]{color:var(--tinta);border-bottom-color:var(--tinta)}
.menu-btn{display:none;margin-left:auto;font:inherit;font-size:.9rem;background:none;border:1px solid var(--linea);border-radius:4px;padding:.45rem .8rem;color:var(--tinta);cursor:pointer}

/* ---------- portada ---------- */
.portada{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(2rem,5vw,4.5rem);align-items:start;padding:clamp(2.5rem,6vw,4.5rem) clamp(1.1rem,5vw,4.5rem) clamp(2rem,4vw,3rem)}
.portada-texto p{font-size:1.12rem;color:var(--tinta-suave)}
.desde{font-size:.9rem;color:var(--agua-oscura);margin-bottom:1rem;font-weight:500}
.acciones{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.6rem}

/* ---------- el directorio: la pieza principal ---------- */
.directorio{border-top:2px solid var(--tinta)}
.directorio-titulo{font-family:'IBM Plex Sans',sans-serif;font-size:.85rem;color:var(--gris);margin:.7rem 0 0;font-weight:500}
.fila{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:1rem;
  padding:.95rem .8rem .95rem .1rem;border-bottom:1px solid var(--linea);text-decoration:none;color:var(--tinta);position:relative}
.fila:hover,.fila:focus-visible{background:var(--tinta);color:#fff;padding-left:.8rem}
.fila:hover .fila-rubro,.fila:focus-visible .fila-rubro{color:#9DC3C6}
.fila-dominio{font-family:'Archivo',sans-serif;font-weight:600;font-size:clamp(1.1rem,2.1vw,1.45rem);letter-spacing:-.015em}
.fila-nombre{display:block;font-family:'IBM Plex Sans',sans-serif;font-weight:400;font-size:.88rem;color:inherit;opacity:.72;letter-spacing:0}
.fila-rubro{font-size:.82rem;color:var(--gris);text-align:right;white-space:nowrap}
.fila-marca{position:absolute;left:-.55rem;top:50%;width:4px;height:0;background:var(--ambar);transform:translateY(-50%);transition:height .15s}
.fila:hover .fila-marca{height:60%}

/* ---------- botones ---------- */
.boton{display:inline-block;background:var(--tinta);color:#fff!important;text-decoration:none;font-weight:600;font-size:.96rem;padding:.8rem 1.5rem;border-radius:4px;border:0;cursor:pointer;font-family:inherit}
.boton:hover{background:var(--agua-oscura)}
.boton-linea{display:inline-block;background:none;color:var(--tinta)!important;border:1px solid var(--tinta);padding:.75rem 1.45rem;border-radius:4px;text-decoration:none;font-weight:600;font-size:.96rem;font-family:inherit;cursor:pointer}
.boton-linea:hover{background:var(--nube)}
.boton-agua{background:var(--agua)}
.boton-agua:hover{background:var(--agua-oscura)}

/* ---------- bloques ---------- */
.bloque{padding:clamp(2.5rem,5vw,4rem) clamp(1.1rem,5vw,4.5rem)}
.bloque-nube{background:var(--nube)}
.bloque-tinta{background:var(--tinta);color:#EAF1F3}
.bloque-tinta h2,.bloque-tinta h3{color:#fff}
.bloque-tinta a{color:#8ED0D4}
.cabezal{max-width:var(--medida);margin-bottom:2rem}
.cabezal p{color:var(--gris);font-size:1.05rem}
.bloque-tinta .cabezal p{color:#B9CCD4}

/* ---------- fichas de división ---------- */
.rubro-grupo{margin-bottom:2.6rem}
.rubro-encabezado{display:flex;align-items:baseline;gap:1rem;border-bottom:2px solid var(--tinta);padding-bottom:.5rem;margin-bottom:1.3rem}
.rubro-encabezado h2{margin:0;font-size:1.3rem}
.rubro-encabezado span{font-size:.85rem;color:var(--gris);margin-left:auto}
.tarjetas{display:grid;grid-template-columns:repeat(auto-fill,minmax(285px,1fr));gap:1.4rem}
.tarjeta{display:flex;flex-direction:column;border-left:3px solid var(--agua);padding:.2rem 0 .2rem 1.2rem}
.tarjeta h3{margin-bottom:.35rem}
.tarjeta p{font-size:.94rem;color:var(--gris);flex:1;margin-bottom:.8rem}
.tarjeta-links{display:flex;gap:1.1rem;align-items:center;font-size:.9rem}
.tarjeta-links a{font-weight:600;text-decoration:none}
.tarjeta-links a:hover{text-decoration:underline}
.tarjeta-dominio{color:var(--gris)!important;font-weight:400!important}

/* ---------- ficha individual ---------- */
.ficha{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:clamp(2rem,5vw,4rem);padding:clamp(2rem,5vw,3.5rem) clamp(1.1rem,5vw,4.5rem)}
.ficha-migas{font-size:.88rem;color:var(--gris);margin-bottom:1.2rem}
.ficha-migas a{color:var(--gris)}
.ficha-logo{max-height:64px;width:auto;margin-bottom:1.2rem}
.ficha-lista{list-style:none;padding:0;margin:0 0 1.5rem}
.ficha-lista li{padding:.55rem 0 .55rem 1.4rem;border-bottom:1px solid var(--linea);position:relative;font-size:.96rem}
.ficha-lista li::before{content:"";position:absolute;left:0;top:1.1rem;width:7px;height:7px;background:var(--agua);border-radius:50%}
.panel{border:1px solid var(--linea);border-radius:6px;padding:1.5rem;background:var(--nube)}
.panel h3{font-size:1.05rem}
.panel p{font-size:.94rem;color:var(--gris)}
.panel-dominio{font-family:'Archivo',sans-serif;font-weight:600;font-size:1.2rem;color:var(--tinta);display:block;margin-bottom:1rem;word-break:break-word}
.vecinas{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.8rem}
.vecinas a{font-size:.88rem;text-decoration:none;border:1px solid var(--linea);border-radius:20px;padding:.3rem .85rem;color:var(--tinta-suave);background:#fff}
.vecinas a:hover{border-color:var(--tinta);color:var(--tinta)}

/* ---------- textos largos ---------- */
.texto{max-width:var(--medida)}
.texto h2{margin-top:2.2rem;font-size:1.3rem}
.texto ul{padding-left:1.2rem}
.texto li{margin-bottom:.4rem;max-width:var(--medida)}
.fecha-edicion{font-size:.88rem;color:var(--gris);border-bottom:1px solid var(--linea);padding-bottom:1rem;margin-bottom:1.6rem}
.dos-columnas{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(2rem,5vw,4rem);align-items:start}
.hechos{list-style:none;padding:0;margin:0}
.hechos li{display:flex;justify-content:space-between;gap:1rem;padding:.7rem 0;border-bottom:1px solid var(--linea);font-size:.95rem}
.hechos strong{font-family:'Archivo',sans-serif;color:var(--tinta)}

/* ---------- contacto ---------- */
.contacto{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(2rem,5vw,4rem);align-items:start}
.formulario{display:grid;gap:1rem;border:1px solid var(--linea);border-radius:6px;padding:1.7rem;background:#fff}
.formulario label{display:grid;gap:.35rem;font-size:.9rem;font-weight:500;color:var(--tinta)}
.formulario input,.formulario select,.formulario textarea{font:inherit;font-size:.96rem;padding:.7rem .8rem;border:1px solid var(--linea);border-radius:4px;background:#fff;color:var(--texto)}
.formulario input:focus,.formulario select:focus,.formulario textarea:focus{border-color:var(--agua)}
.par{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.trampa{position:absolute;left:-9999px}
.error{background:#FBE7E3;color:#9C3520;border-left:3px solid #9C3520;padding:.8rem 1rem;margin:0;font-size:.93rem}
.exito{background:#E2F1EF;color:#0A5B60;border-left:3px solid var(--agua);padding:1.4rem;border-radius:4px}
.exito h3{color:var(--agua-oscura)}
.datos-contacto{list-style:none;padding:0;margin:1.5rem 0 0}
.datos-contacto li{padding:.7rem 0;border-bottom:1px solid var(--linea);font-size:.96rem}
.datos-contacto span{display:block;font-size:.82rem;color:var(--gris)}

/* ---------- pie ---------- */
.pie{background:var(--tinta);color:#B9CCD4;padding:clamp(2.2rem,4vw,3rem) clamp(1.1rem,5vw,4.5rem) 1.5rem;font-size:.92rem}
.pie-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem}
.pie p{margin:0 0 .4rem;max-width:none}
.pie a{color:#B9CCD4;text-decoration:none}
.pie a:hover{color:#fff;text-decoration:underline}
.pie-marca{font-family:'Archivo',sans-serif;font-weight:600;color:#fff;font-size:1.05rem;margin-bottom:.5rem}
.pie-titulo{color:#fff;font-weight:600;margin-bottom:.5rem}
.pie-cierre{border-top:1px solid #23485F;margin-top:2rem;padding-top:1.2rem;font-size:.85rem}

/* ---------- aviso de cookies ---------- */
.cookies{position:fixed;left:1rem;right:1rem;bottom:1rem;max-width:640px;margin:0 auto;background:#fff;border:1px solid var(--linea);border-left:4px solid var(--ambar);
  border-radius:4px;padding:1rem 1.2rem;box-shadow:0 14px 36px rgba(11,34,51,.18);display:flex;gap:1.2rem;align-items:center;flex-wrap:wrap;z-index:30}
.cookies p{margin:0;flex:1;min-width:230px;font-size:.88rem;color:var(--gris)}
.cookies button{font:inherit;font-size:.9rem;font-weight:600;background:var(--tinta);color:#fff;border:0;border-radius:4px;padding:.6rem 1.2rem;cursor:pointer}

@media (max-width:900px){
  .portada,.ficha,.contacto,.dos-columnas{grid-template-columns:1fr}
  .pie-grid{grid-template-columns:1fr 1fr}
  .menu-btn{display:block}
  .barra{flex-wrap:wrap}
  .barra nav{display:none;width:100%;flex-direction:column;gap:0;margin:0}
  .barra nav.abierto{display:flex}
  .barra nav a{padding:.7rem 0;border-bottom:1px solid var(--linea)}
}
@media (max-width:560px){
  body{font-size:16px}
  .par,.pie-grid{grid-template-columns:1fr}
  .fila{grid-template-columns:1fr;gap:.2rem}
  .fila-rubro{text-align:left}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
