/* La Huerta Milagro — hoja de estilos única
   Paleta tomada del logo. Uso institucional: color como acento, no como fondo. */

:root{
  --rojo:#D42027;
  --azul:#1B1464;
  --amarillo:#FFD200;
  --verde:#2E9B3F;
  --gris:#F7F7F4;
  --texto:#333333;
  --linea:#E3E3DC;
  --muted:#6B6B66;
  --ancho:1080px;
}

*,*::before,*::after{box-sizing:border-box;}

html{-webkit-text-size-adjust:100%;}

body{
  margin:0;
  background:#FFFFFF;
  color:var(--texto);
  font-family:"Source Sans 3","Source Sans Pro","Segoe UI",system-ui,-apple-system,Helvetica,Arial,sans-serif;
  font-size:17px;
  line-height:1.65;
  text-wrap:pretty;
}

h1,h2,h3,h4{
  color:var(--azul);
  font-weight:700;
  line-height:1.18;
  margin:0 0 .6em;
  text-wrap:balance;
}

h1{font-size:clamp(1.85rem,4.2vw,2.65rem);letter-spacing:-.01em;}
h2{font-size:clamp(1.35rem,2.6vw,1.85rem);}
h3{font-size:1.12rem;}

p{margin:0 0 1.1em;}
p:last-child{margin-bottom:0;}

a{color:var(--rojo);text-decoration:underline;text-underline-offset:2px;}
a:hover{color:var(--azul);}

strong{color:var(--azul);}

.contenedor{
  width:100%;
  max-width:var(--ancho);
  margin:0 auto;
  padding:0 24px;
}

.oculto-visual{
  position:absolute;width:1px;height:1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;
}

/* ---------- Encabezado ---------- */

.franja-marca{
  height:4px;
  background:var(--amarillo);
  position:sticky;
  top:0;
  z-index:60;
}

.encabezado{
  position:sticky;
  top:4px;
  z-index:60;
  background:#FFFFFF;
  border-bottom:1px solid var(--linea);
  transition:box-shadow .18s ease;
}

.desplazado .encabezado{box-shadow:0 2px 10px rgba(27,20,100,.10);}

.encabezado__fila{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:18px 24px;
  max-width:var(--ancho);
  margin:0 auto;
}

.marca{
  display:flex;
  align-items:center;
  gap:16px;
  text-decoration:none;
  position:relative;
  z-index:2;
}

.marca img{
  display:block;
  width:auto;
  height:58px;
  object-fit:contain;
}

.marca__texto{display:flex;flex-direction:column;line-height:1.15;}
.marca__nombre{color:var(--azul);font-weight:700;font-size:1.06rem;letter-spacing:-.01em;}
.marca__bajada{color:var(--muted);font-size:.74rem;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;}

.nav-toggle{position:absolute;opacity:0;pointer-events:none;}

.nav-boton{
  display:none;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:48px;
  min-width:120px;
  padding:0 18px;
  background:var(--azul);
  border:1px solid var(--azul);
  color:#FFFFFF;
  font-size:1rem;
  font-weight:600;
  cursor:pointer;
  position:relative;
  z-index:2;
}

.nav-boton svg{display:block;flex:none;}
.nav-boton .icono-cerrar{display:none;}
.nav-toggle:checked ~ .nav-boton .icono-menu{display:none;}
.nav-toggle:checked ~ .nav-boton .icono-cerrar{display:block;}

.nav{display:block;}

.nav ul{
  display:flex;
  flex-wrap:nowrap;
  gap:28px;
  list-style:none;
  margin:0;
  padding:0;
}

.nav a{
  display:inline-block;
  white-space:nowrap;
  color:var(--azul);
  font-size:16px;
  font-weight:600;
  text-decoration:none;
  padding:6px 0;
  border-bottom:3px solid transparent;
  transition:color .15s ease,border-color .15s ease;
}

.nav a:hover{color:var(--rojo);border-bottom-color:var(--amarillo);}

.nav a.activo{border-bottom-color:var(--rojo);color:var(--rojo);}

/* ---------- Secciones ---------- */

.seccion{padding:64px 0;}
.seccion--alt{background:var(--gris);border-top:1px solid var(--linea);border-bottom:1px solid var(--linea);}
.seccion--compacta{padding:44px 0;}

.eyebrow__territorio{
  display:block;
  color:var(--azul);
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin:-6px 0 14px;
}

.eyebrow{
  display:block;
  color:var(--rojo);
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  margin-bottom:12px;
}

.plomo{font-size:1.14rem;color:#2C2C2C;max-width:66ch;}

.prosa{max-width:70ch;}

/* ---------- Portada ---------- */

.portada{padding:72px 0 56px;}

.portada__rejilla{
  display:grid;
  grid-template-columns:1.4fr .8fr;
  gap:48px;
  align-items:center;
}

.portada__rejilla > *{min-width:0;}

.portada__marca{
  margin:0;
  border:1px solid var(--linea);
  background:var(--gris);
  padding:26px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.portada__marca img{
  display:block;
  width:100%;
  max-width:320px;
  height:auto;
}
.portada__titular{max-width:24ch;}
.portada h1{margin-bottom:.5em;}
.portada .plomo{max-width:62ch;}

.acciones{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:28px;
}

.boton{
  display:inline-block;
  background:var(--rojo);
  color:#FFFFFF;
  font-weight:600;
  font-size:.98rem;
  text-decoration:none;
  padding:13px 22px;
  border:1px solid var(--rojo);
}
.boton:hover{background:#B31A20;border-color:#B31A20;color:#FFFFFF;}

.boton--sec{background:transparent;color:var(--azul);border-color:var(--azul);}
.boton--sec:hover{background:var(--azul);color:#FFFFFF;border-color:var(--azul);}

.boton--grande{font-size:1.06rem;padding:16px 28px;}

/* ---------- Cifras ---------- */

.cifras{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
}

.cifra{
  background:#FFFFFF;
  border:1px solid var(--linea);
  border-top:3px solid var(--amarillo);
  padding:22px 20px;
}

.cifra__dato{
  display:block;
  color:var(--azul);
  font-size:clamp(1.6rem,3vw,2.15rem);
  font-weight:700;
  line-height:1.1;
  letter-spacing:-.02em;
}

.cifra__etiqueta{display:block;margin-top:6px;font-size:.95rem;color:var(--texto);}
.cifra__nota{display:block;margin-top:4px;font-size:.82rem;color:var(--muted);}

.nota-pequena{
  margin-top:18px;
  font-size:.85rem;
  color:var(--muted);
  max-width:80ch;
}

/* ---------- Tarjetas ---------- */

.rejilla{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:24px;
}

.tarjeta{
  background:#FFFFFF;
  border:1px solid var(--linea);
  padding:26px 24px;
}

.tarjeta__numero{
  display:block;
  color:var(--rojo);
  font-size:.8rem;
  font-weight:700;
  letter-spacing:.1em;
  margin-bottom:10px;
}

.tarjeta h3{margin-bottom:.5em;}
.tarjeta p{font-size:.98rem;}

/* ---------- Listas ---------- */

.lista{padding-left:1.15em;margin:0 0 1.1em;}
.lista li{margin-bottom:.55em;}
.lista li:last-child{margin-bottom:0;}

.lista-marcada{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:12px;
}

.lista-marcada li{
  position:relative;
  padding-left:26px;
  border-bottom:1px solid var(--linea);
  padding-bottom:12px;
}
.lista-marcada li:last-child{border-bottom:0;padding-bottom:0;}

.lista-marcada li::before{
  content:"";
  position:absolute;
  left:0;
  top:.62em;
  width:9px;
  height:9px;
  background:var(--verde);
}

.lista-numerada{
  counter-reset:n;
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:14px;
}

.lista-numerada li{
  counter-increment:n;
  position:relative;
  padding-left:42px;
}

.lista-numerada li::before{
  content:counter(n,decimal-leading-zero);
  position:absolute;
  left:0;
  top:.05em;
  color:var(--rojo);
  font-weight:700;
  font-size:.92rem;
  letter-spacing:.02em;
}

/* ---------- Tablas ---------- */

.tabla-envoltura{overflow-x:auto;margin:0 0 8px;}

table{
  width:100%;
  border-collapse:collapse;
  background:#FFFFFF;
  font-size:.96rem;
}

caption{
  caption-side:top;
  text-align:left;
  color:var(--muted);
  font-size:.85rem;
  padding-bottom:10px;
}

th,td{
  text-align:left;
  padding:12px 14px;
  border-bottom:1px solid var(--linea);
  vertical-align:top;
}

thead th{
  background:var(--gris);
  color:var(--azul);
  font-size:.8rem;
  font-weight:700;
  letter-spacing:.07em;
  text-transform:uppercase;
  border-bottom:2px solid var(--azul);
}

tbody tr:last-child td{border-bottom:1px solid var(--linea);}

.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;}

.fila-total td{background:var(--gris);color:var(--azul);font-weight:700;}

/* ---------- Avisos ---------- */

.aviso{
  border:1px solid var(--rojo);
  padding:22px 24px;
  margin:32px 0;
  background:#FFFFFF;
}

.aviso__titulo{
  display:block;
  color:var(--rojo);
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  margin-bottom:10px;
}

.aviso p{font-size:.98rem;}

.aviso--neutro{border-color:var(--azul);}
.aviso--neutro .aviso__titulo{color:var(--azul);}

/* ---------- Figuras ---------- */

.galeria{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:28px;
}

figure{margin:0;}

figure img{
  display:block;
  width:100%;
  height:auto;
  border:1px solid var(--linea);
}

figcaption{
  margin-top:10px;
  font-size:.88rem;
  color:var(--muted);
}

.pendiente{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:260px;
  border:1px dashed #B9B9B0;
  background:repeating-linear-gradient(135deg,#FAFAF7 0 10px,#F2F2EC 10px 20px);
  padding:24px;
  text-align:center;
  font-family:ui-monospace,SFMono-Regular,"Cascadia Mono",Consolas,monospace;
  font-size:.82rem;
  color:#6B6B66;
  line-height:1.5;
}

.destacado-medios{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:36px;
  align-items:center;
}

/* ---------- Flujo de recursos ---------- */

.flujo{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  border:1px solid var(--linea);
  background:#FFFFFF;
}

.flujo__paso{
  padding:22px 20px;
  border-right:1px solid var(--linea);
  position:relative;
}
.flujo__paso:last-child{border-right:0;}

.flujo__orden{
  display:block;
  color:var(--rojo);
  font-size:.75rem;
  font-weight:700;
  letter-spacing:.1em;
  margin-bottom:8px;
}

.flujo__nombre{color:var(--azul);font-weight:700;font-size:1rem;line-height:1.3;}

/* ---------- Territorio ---------- */

.territorio{
  display:flex;
  flex-wrap:wrap;
  gap:10px 28px;
  list-style:none;
  margin:0;
  padding:0;
}

.territorio li{
  color:var(--azul);
  font-weight:700;
  font-size:1.02rem;
}

/* ---------- Contacto ---------- */

.datos-contacto{
  display:grid;
  gap:0;
  list-style:none;
  margin:0 0 8px;
  padding:0;
  max-width:560px;
}

.datos-contacto li{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:16px;
  padding:14px 0;
  border-bottom:1px solid var(--linea);
}

.datos-contacto .rotulo{
  color:var(--muted);
  font-size:.82rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding-top:2px;
}

/* ---------- Pie ---------- */

.pie{
  background:var(--azul);
  color:#E9E9F2;
  padding:52px 0 40px;
  font-size:.94rem;
}

.pie h2{color:#FFFFFF;font-size:1.05rem;margin-bottom:.4em;}
.pie a{color:#FFFFFF;}
.pie a:hover{color:var(--amarillo);}

.pie__rejilla{
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr;
  gap:36px;
}

.pie__dato{margin:0 0 4px;}

.pie ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;}

.pie__legal{
  margin-top:36px;
  padding-top:22px;
  border-top:1px solid rgba(255,255,255,.22);
  font-size:.82rem;
  color:#BFBFD4;
  max-width:96ch;
}

/* ---------- Responsive ---------- */

@media (max-width:1120px){
  .nav ul{gap:20px;}
}

@media (max-width:1000px){
  .nav ul{gap:16px;}
  .marca__bajada{display:none;}
}

@media (max-width:940px){
  body{font-size:16px;}
  .encabezado__fila{padding:14px 20px;}
  .marca img{height:50px;}
  .marca__bajada{font-size:.72rem;}
  .nav-boton{display:inline-flex;}
  .nav{
    display:none;
    position:fixed;
    left:0;
    right:0;
    top:83px;
    bottom:0;
    background:#FFFFFF;
    border-top:1px solid var(--linea);
    overflow-y:auto;
    padding:8px 20px 32px;
    z-index:1;
  }
  .nav-toggle:checked ~ .nav{display:block;}
  .nav ul{flex-direction:column;gap:0;max-width:var(--ancho);margin:0 auto;}
  .nav li{border-bottom:1px solid var(--linea);}
  .nav a{
    display:flex;
    align-items:center;
    min-height:56px;
    padding:8px 0;
    border-bottom:0;
    border-left:4px solid transparent;
    padding-left:0;
    font-size:1.05rem;
  }
  .nav a.activo{color:var(--rojo);}
}

@media (max-width:1000px){
  .portada__rejilla{grid-template-columns:1fr;gap:32px;}
}

@media (max-width:900px){
  .portada__marca{padding:22px;}
  .portada__marca img{max-width:250px;}
  .cifras{grid-template-columns:repeat(2,1fr);}
  .destacado-medios{grid-template-columns:1fr;gap:24px;}
  .flujo{grid-template-columns:1fr;}
  .flujo__paso{border-right:0;border-bottom:1px solid var(--linea);}
  .flujo__paso:last-child{border-bottom:0;}
  .pie__rejilla{grid-template-columns:1fr 1fr;}
}

@media (max-width:680px){
  .seccion{padding:48px 0;}
  .contenedor{padding:0 20px;}
  .cifras{grid-template-columns:1fr;}
  .acciones{flex-direction:column;align-items:stretch;}
  .boton{text-align:center;}
  .datos-contacto li{grid-template-columns:1fr;gap:2px;}
  .pie__rejilla{grid-template-columns:1fr;gap:28px;}
}

@media print{
  .nav,.nav-boton,.acciones{display:none;}
  body{font-size:11pt;}
  .pie{background:#FFFFFF;color:#333333;}
  .pie h2,.pie a{color:#1B1464;}
}
