:root{
  --verde-bosque:   #0B3D2E;
  --verde-bosque-2: #0F4D3A;
  --verde-vivo:     #16A34A;
  --verde-suave:    #E8F5EC;
  --arena:          #F7F3EC;
  --carbon:         #1B1F1D;
  --carbon-suave:   #4B534E;
  --bronce:         #B8905B;
  --bronce-suave:   #E7D9C1;
  --blanco:         #FFFFFF;
  --linea:          rgba(11,61,46,0.12);

  --fuente-display: 'Inter', -apple-system, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --fuente-cuerpo:  'Inter', -apple-system, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --fuente-mono:    'Inter', -apple-system, 'Helvetica Neue', Helvetica, Arial, sans-serif;

  --fs-eyebrow: clamp(0.72rem, 0.68rem + 0.2vw, 0.8rem);
  --fs-h1:      clamp(2.4rem, 1.7rem + 3.2vw, 4.6rem);
  --fs-h2:      clamp(1.7rem, 1.4rem + 1.4vw, 2.6rem);
  --fs-h3:      clamp(1.2rem, 1.05rem + 0.6vw, 1.5rem);
  --fs-body:    clamp(1rem, 0.96rem + 0.15vw, 1.08rem);
  --fs-small:   0.9rem;

  --espacio-seccion: clamp(3.5rem, 3rem + 3vw, 7rem);
  --radio: 14px;
  --radio-chico: 8px;
  --sombra: 0 20px 45px -20px rgba(11,61,46,0.35);
}

*, *::before, *::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
html, body{ overflow-x: hidden; max-width: 100%; }
body{
  margin:0;
  font-family: var(--fuente-cuerpo);
  font-size: var(--fs-body);
  color: var(--carbon);
  background: var(--blanco);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration:none; }
ul{ list-style:none; margin:0; padding:0; }
button{ font-family: inherit; cursor:pointer; }
h1, h2, h3{ font-family: var(--fuente-display); font-weight: 800; letter-spacing: -0.015em; line-height:1.12; margin:0; color: var(--verde-bosque); }
p{ margin:0; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline: 3px solid var(--bronce);
  outline-offset: 3px;
}

.contenedor{
  width:100%;
  max-width: 1180px;
  margin:0 auto;
  padding: 0 clamp(1.25rem, 4vw, 2.5rem);
}

.eyebrow{
  font-family: var(--fuente-mono);
  font-size: var(--fs-eyebrow);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--bronce);
  font-weight: 700;
  display:inline-block;
}

.boton{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0.6em;
  padding: 0.95em 1.8em;
  border-radius: 999px;
  font-weight:700;
  font-size: 0.98rem;
  border: 1.5px solid transparent;
  transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease, color 0.25s ease;
  white-space: nowrap;
}
.boton-primario{
  background: var(--verde-vivo);
  color: var(--blanco);
  box-shadow: 0 12px 28px -12px rgba(22,163,74,0.55);
}
.boton-primario:hover{ transform: translateY(-3px); box-shadow: 0 18px 34px -14px rgba(22,163,74,0.6); }
.boton-secundario{
  background: transparent;
  border-color: rgba(255,255,255,0.5);
  color: var(--blanco);
}
.boton-secundario:hover{ background: rgba(255,255,255,0.12); border-color: var(--blanco); }
.boton-oscuro{
  background: var(--verde-bosque);
  color: var(--blanco);
}
.boton-oscuro:hover{ background: var(--verde-bosque-2); transform: translateY(-3px); }

.nav{
  position: sticky;
  top:0;
  z-index: 500;
  background: rgba(255,255,255,0.94);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--linea);
}
.nav-interior{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: clamp(0.8rem, 2vw, 2rem);
  padding-top: 0.85rem;
  padding-bottom: 0.85rem;
}
.nav-marca{
  display:flex;
  align-items:center;
  gap:0.7rem;
  font-family: var(--fuente-display);
  font-weight:800;
  font-size:1.2rem;
  color: var(--verde-bosque);
  white-space: nowrap;
}
.nav-marca img{ width:32px; height:32px; }

.nav-enlaces-rapidos{
  display:flex;
  align-items:center;
  gap: 1.6rem;
  margin-right: auto;
  margin-left: 1.4rem;
}
.nav-enlaces-rapidos a{
  font-weight:700;
  font-size:0.95rem;
  color: var(--carbon);
  padding: 0.4rem 0;
  border-bottom: 2px solid transparent;
  transition: border-color 0.2s ease, color 0.2s ease;
}
.nav-enlaces-rapidos a:hover{ border-color: var(--bronce); color: var(--verde-bosque); }

.nav-cta{ display:flex; align-items:center; gap:0.7rem; flex-shrink:0; }
.nav-cta .boton{ padding: 0.7em 1.3em; font-size:0.9rem; }
.boton-whatsapp{
  background: #25D366;
  color: var(--blanco);
}
.boton-whatsapp:hover{ background: #1fb955; transform: translateY(-2px); }

.nav-boton-menu{
  display:flex;
  background: var(--verde-suave);
  border:none;
  border-radius: 50%;
  width: 44px; height:44px;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  flex-shrink:0;
  transition: background 0.25s ease;
}
.nav-boton-menu:hover{ background: var(--bronce-suave); }
.nav-boton-menu span{
  width: 20px; height: 2.5px;
  background: var(--verde-bosque);
  border-radius: 2px;
  transition: transform 0.3s ease, opacity 0.3s ease;
}
.nav-boton-menu.activo span:nth-child(1){ transform: translateY(7.5px) rotate(45deg); }
.nav-boton-menu.activo span:nth-child(2){ opacity:0; }
.nav-boton-menu.activo span:nth-child(3){ transform: translateY(-7.5px) rotate(-45deg); }

.menu-overlay{
  position: fixed;
  inset: 0;
  background: rgba(11,61,46,0.55);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.35s ease;
  z-index: 600;
}
.menu-overlay.activo{ opacity:1; pointer-events:all; }

.panel-menu{
  position: fixed;
  top: 0;
  right: 0;
  height: 100%;
  width: min(400px, 88vw);
  background: var(--blanco);
  z-index: 601;
  transform: translateX(100%);
  transition: transform 0.45s cubic-bezier(.2,.9,.25,1);
  padding: 2.2rem 2rem;
  overflow-y: auto;
  box-shadow: -30px 0 60px rgba(11,61,46,0.2);
}
.panel-menu.activo{ transform: translateX(0); }

.panel-menu-cabecera{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom: 2rem;
}
.panel-menu-cerrar{
  width: 38px; height:38px;
  border-radius:50%;
  border:none;
  background: var(--arena);
  display:flex; align-items:center; justify-content:center;
  color: var(--verde-bosque);
  flex-shrink:0;
}
.panel-menu-cerrar:hover{ background: var(--bronce-suave); }

.panel-menu-grupo{ display:flex; flex-direction:column; margin-bottom: 2.2rem; }
.panel-menu-titulo{
  font-size:0.75rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color: var(--bronce);
  font-weight:800;
  margin-bottom: 0.9rem;
}
.panel-menu-grupo a{
  display:flex;
  flex-direction:column;
  padding: 0.95rem 0.2rem;
  border-bottom: 1px solid var(--linea);
  font-family: var(--fuente-display);
  font-weight:800;
  font-size:1.15rem;
  color: var(--verde-bosque);
  transition: color 0.2s ease, padding-left 0.25s ease;
}
.panel-menu-grupo a small{
  font-family: var(--fuente-cuerpo);
  font-weight:500;
  font-size:0.82rem;
  color: var(--carbon-suave);
  margin-top:0.25rem;
}
.panel-menu-grupo a:hover{ color: var(--verde-vivo); padding-left: 0.5rem; }

.panel-menu-pie{
  display:flex;
  flex-direction:column;
  gap:0.7rem;
  padding-top: 1.2rem;
  border-top: 1px solid var(--linea);
}
.panel-menu-pie a{ font-weight:700; color: var(--carbon-suave); font-size:0.95rem; }
.panel-menu-pie a:hover{ color: var(--verde-bosque); }

body.menu-abierto{ overflow: hidden; }

.hero{
  position: relative;
  background:
    linear-gradient(160deg, rgba(11,61,46,0.92) 10%, rgba(11,61,46,0.72) 55%, rgba(11,61,46,0.55) 100%),
    url('../imagenes/pexels-damir-20693394.jpg');
  background-size: cover;
  background-position: center;
  color: var(--blanco);
  padding: clamp(4rem, 6vw, 7rem) 0 clamp(5rem, 8vw, 9rem);
  overflow: hidden;
}
.hero.con-video{ background: none; }
.hero.con-video::before{
  content:"";
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, rgba(11,61,46,0.92) 10%, rgba(11,61,46,0.72) 55%, rgba(11,61,46,0.55) 100%);
  z-index: 1;
}
.video-fondo{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.hero-grid{
  display:grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.9fr);
  gap: clamp(2rem, 4vw, 4rem);
  align-items:center;
}
.hero.con-video .hero-grid{
  position: relative;
  z-index: 2;
}
.hero-eyebrow{ color: var(--bronce-suave); }
.hero-eyebrow::before{ background: var(--bronce-suave); }
.hero h1{
  color: var(--blanco);
  font-size: var(--fs-h1);
  margin-top: 0.7rem;
  letter-spacing: -0.01em;
}
.hero h1 em{
  font-style: normal;
  color: var(--bronce-suave);
}
.hero-sub{
  margin-top:1.3rem;
  max-width: 42ch;
  font-size: clamp(1.02rem, 0.95rem + 0.3vw, 1.2rem);
  color: rgba(255,255,255,0.86);
}
.hero-acciones{
  margin-top: 2.1rem;
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
}
.hero-datos{
  margin-top: 2.6rem;
  display:flex;
  flex-wrap:wrap;
  gap: clamp(1.4rem, 3vw, 2.6rem);
}
.hero-dato{ }
.hero-dato strong{
  display:block;
  font-family: var(--fuente-display);
  font-size: 1.5rem;
  color: var(--blanco);
}
.hero-dato span{
  font-family: var(--fuente-mono);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.65);
}

.hero-sello-zona{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height: 280px;
}
.sello{
  width: 230px;
  height: 230px;
  border-radius:50%;
  border: 2.5px dashed var(--bronce-suave);
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  animation: sello-caida 900ms cubic-bezier(.2,1.4,.4,1) 300ms both;
  background: rgba(255,255,255,0.04);
}
.sello-interior{
  width: 188px;
  height: 188px;
  border-radius:50%;
  border: 1.5px solid var(--bronce-suave);
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding: 1.2rem;
}
.sello-texto-superior, .sello-texto-inferior{
  position:absolute;
  font-family: var(--fuente-mono);
  font-size: 0.62rem;
  letter-spacing: 0.16em;
  color: var(--bronce-suave);
}
.sello-central{
  font-family: var(--fuente-display);
  font-weight: 700;
  font-size: 1rem;
  line-height:1.35;
  color: var(--blanco);
}
.sello-central small{
  display:block;
  font-family: var(--fuente-mono);
  font-size: 0.6rem;
  letter-spacing: 0.1em;
  color: var(--bronce-suave);
  margin-top:0.4rem;
}
@keyframes sello-caida{
  0%{ transform: scale(2.4) rotate(-14deg); opacity:0; }
  70%{ transform: scale(0.94) rotate(-14deg); opacity:1; }
  100%{ transform: scale(1) rotate(-14deg); opacity:1; }
}

.seccion{
  padding: var(--espacio-seccion) 0;
}
.seccion-arena{ background: var(--arena); }
.seccion-oscura{
  background: var(--verde-bosque);
  color: var(--blanco);
}
.seccion-oscura h2, .seccion-oscura h3{ color: var(--blanco); }
.seccion-cabecera{
  max-width: 640px;
  margin-bottom: clamp(2.4rem, 4vw, 3.5rem);
}
.seccion-cabecera h2{ margin-top:0.6rem; }
.seccion-cabecera p{
  margin-top: 1rem;
  color: var(--carbon-suave);
  font-size: 1.05rem;
}
.seccion-oscura .seccion-cabecera p{ color: rgba(255,255,255,0.78); }

.grid-servicios{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.6rem;
}
.tarjeta-servicio{
  background: var(--blanco);
  border: 1px solid var(--linea);
  border-radius: var(--radio);
  padding: 1.9rem 1.7rem;
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.tarjeta-servicio:hover{
  transform: translateY(-6px);
  box-shadow: var(--sombra);
  border-color: transparent;
}
.tarjeta-servicio .icono{
  width: 48px; height:48px;
  border-radius: var(--radio-chico);
  background: var(--verde-suave);
  display:flex; align-items:center; justify-content:center;
  color: var(--verde-bosque);
  margin-bottom: 1.2rem;
}
.tarjeta-servicio h3{ margin-bottom:0.6rem; }
.tarjeta-servicio p{ color: var(--carbon-suave); font-size:0.98rem; }
.tarjeta-servicio .enlace-servicio{
  display:inline-flex;
  align-items:center;
  gap:0.4em;
  margin-top:1.1rem;
  font-weight:700;
  font-size:0.9rem;
  color: var(--verde-vivo);
}
.tarjeta-servicio .enlace-servicio svg{ transition: transform 0.25s ease; }
.tarjeta-servicio:hover .enlace-servicio svg{ transform: translateX(4px); }

.grid-diferenciales{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.4rem;
}
.diferencial{
  padding: 1.6rem 1.4rem;
  border-radius: var(--radio);
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.14);
}
.diferencial .num{
  font-family: var(--fuente-mono);
  font-size:0.78rem;
  color: var(--bronce-suave);
  letter-spacing:0.1em;
}
.diferencial h3{ margin-top:0.5rem; font-size:1.15rem; }
.diferencial p{ margin-top:0.5rem; color: rgba(255,255,255,0.78); font-size:0.95rem; }

.franja-red{
  display:grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(2rem, 5vw, 4rem);
  align-items:center;
}
.mapa-red{
  position:relative;
  aspect-ratio: 4/3;
  border-radius: var(--radio);
  background: var(--verde-suave);
  overflow:hidden;
  border: 1px solid var(--linea);
}
.mapa-red svg{ width:100%; height:100%; }
.punto-red{
  fill: var(--bronce);
}
.linea-red{
  stroke: var(--verde-vivo);
  stroke-width:1.4;
  stroke-dasharray: 4 4;
  opacity:0.55;
}

.franja-contacto{
  display:grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: clamp(2rem, 4vw, 3.5rem);
}

#formulario-valoracion .franja-contacto{
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
}
.contacto-info h2{ margin-top:0.6rem; }
.contacto-info p{ margin-top:1rem; color: var(--carbon-suave); }
.contacto-lista{ margin-top: 1.8rem; display:flex; flex-direction:column; gap:1rem; }
.contacto-item{ display:flex; gap:0.9rem; align-items:flex-start; }
.contacto-item .icono-chico{
  width:38px; height:38px; flex-shrink:0;
  border-radius:999px;
  background: var(--verde-suave);
  color: var(--verde-bosque);
  display:flex; align-items:center; justify-content:center;
}
.contacto-item strong{ display:block; font-size:0.95rem; }
.contacto-item span{ font-size:0.9rem; color: var(--carbon-suave); }

.formulario{
  background: var(--blanco);
  border: 1px solid var(--linea);
  border-radius: var(--radio);
  padding: clamp(1.6rem, 3vw, 2.4rem);
  box-shadow: var(--sombra);
}
.campo{ margin-bottom: 1.1rem; }
.campo label{
  display:block;
  font-size:0.85rem;
  font-weight:700;
  margin-bottom:0.4rem;
  color: var(--verde-bosque);
}
.campo input, .campo select, .campo textarea{
  width:100%;
  padding: 0.75em 0.9em;
  border-radius: var(--radio-chico);
  border: 1.4px solid var(--linea);
  font-family: var(--fuente-cuerpo);
  font-size: 0.98rem;
  background: var(--blanco);
  color: var(--carbon);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.campo input:focus, .campo select:focus, .campo textarea:focus{
  border-color: var(--verde-vivo);
  box-shadow: 0 0 0 3px rgba(22,163,74,0.15);
  outline:none;
}
.campo-dos{
  display:grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 1rem;
}
.campo-check{
  display:flex;
  gap:0.6rem;
  align-items:flex-start;
  font-size:0.85rem;
  color: var(--carbon-suave);
  margin-bottom: 1.3rem;
}
.campo-check input{ margin-top:0.2rem; }
.campo-check a{ color: var(--verde-vivo); font-weight:600; text-decoration: underline; }
.formulario .boton-primario{ width:100%; }
.mensaje-envio{
  margin-top:1rem;
  padding: 0.9rem 1rem;
  border-radius: var(--radio-chico);
  background: var(--verde-suave);
  color: var(--verde-bosque);
  font-size:0.92rem;
  font-weight:600;
  display:none;
}
.mensaje-envio.visible{ display:block; }
.mensaje-envio.error{
  background: #FBEAEA;
  color: #B3261E;
}

.campo-trampa{
  position:absolute !important;
  left:-9999px !important;
  width:1px; height:1px;
  overflow:hidden;
}

.footer{
  background: var(--carbon);
  color: rgba(255,255,255,0.75);
  padding: clamp(3rem, 5vw, 4.5rem) 0 2rem;
}
.footer-grid{
  display:grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  gap: 2.4rem;
}
.footer-marca{
  display:flex; align-items:center; gap:0.6rem;
  font-family: var(--fuente-display);
  font-size:1.2rem;
  color: var(--blanco);
  margin-bottom:0.9rem;
}
.footer-marca img{ width:28px; height:28px; }
.footer p{ font-size:0.92rem; line-height:1.7; }
.footer h4{
  font-family: var(--fuente-mono);
  font-size:0.75rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color: var(--bronce-suave);
  margin-bottom:1rem;
}
.footer ul{ display:flex; flex-direction:column; gap:0.65rem; }
.footer ul a{ font-size:0.92rem; transition: color 0.2s ease; }
.footer ul a:hover{ color: var(--blanco); }
.footer-linea{
  margin-top: 2.8rem;
  padding-top: 1.6rem;
  border-top: 1px solid rgba(255,255,255,0.12);
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
  justify-content:space-between;
  font-size:0.82rem;
}

.whatsapp-flotante{
  position: fixed;
  right: clamp(1rem, 3vw, 1.8rem);
  bottom: clamp(1rem, 3vw, 1.8rem);
  z-index: 800;
  display:flex;
  align-items:center;
  gap:0.7rem;
  background: #25D366;
  color: #ffffff;
  padding: 0.85rem 1.1rem;
  border-radius: 999px;
  box-shadow: 0 14px 30px -10px rgba(0,0,0,0.35);
  font-weight:700;
  font-size:0.92rem;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.whatsapp-flotante:hover{ transform: translateY(-4px) scale(1.03); box-shadow: 0 18px 36px -10px rgba(0,0,0,0.4); }
.whatsapp-flotante svg{ width:24px; height:24px; flex-shrink:0; }
.whatsapp-texto{ display:inline; }

.cookies-banner{
  position: fixed;
  left:1rem; right:1rem; bottom:1rem;
  max-width: 620px;
  margin: 0 auto;
  background: var(--carbon);
  color: rgba(255,255,255,0.9);
  border-radius: var(--radio);
  padding: 1.2rem 1.4rem;
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
  align-items:center;
  justify-content:space-between;
  box-shadow: 0 20px 45px -15px rgba(0,0,0,0.5);
  z-index: 900;
  transform: translateY(140%);
  transition: transform 0.5s ease;
}
.cookies-banner.visible{ transform: translateY(0); }
.cookies-banner p{ font-size:0.88rem; flex:1 1 280px; }
.cookies-banner a{ color: var(--bronce-suave); text-decoration: underline; }
.cookies-acciones{ display:flex; gap:0.7rem; flex-wrap:wrap; }
.cookies-acciones button{
  padding: 0.55em 1.1em;
  border-radius:999px;
  font-size:0.85rem;
  font-weight:700;
  border: 1.4px solid rgba(255,255,255,0.3);
  background: transparent;
  color: var(--blanco);
}
.cookies-acciones .aceptar{
  background: var(--verde-vivo);
  border-color: var(--verde-vivo);
}

.reveal{ opacity:0; transform: translateY(28px); transition: opacity 0.7s ease, transform 0.7s ease; }
.reveal.visible{ opacity:1; transform:none; }

.hero-interior{
  position: relative;
  background: linear-gradient(160deg, rgba(11,61,46,0.94) 20%, rgba(11,61,46,0.8) 100%);
  color: var(--blanco);
  padding: clamp(3rem, 5vw, 5rem) 0 clamp(3.5rem, 5vw, 5.5rem);
  overflow: hidden;
}
.hero-interior.con-imagen{
  background:
    linear-gradient(160deg, rgba(11,61,46,0.92) 20%, rgba(11,61,46,0.72) 100%),
    var(--imagen-hero) center / cover no-repeat;
}
.hero-interior.con-video::before{
  content:"";
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, rgba(11,61,46,0.92) 20%, rgba(11,61,46,0.72) 100%);
  z-index: 1;
}
.hero-interior.con-video > .contenedor{
  position: relative;
  z-index: 2;
}
.hero-interior h1{
  color: var(--blanco);
  font-size: var(--fs-h1);
  margin-top: 0.7rem;
  max-width: 18ch;
}
.hero-interior .hero-sub{ color: rgba(255,255,255,0.86); }
.migas{
  font-family: var(--fuente-mono);
  font-size: 0.78rem;
  letter-spacing: 0.05em;
  color: rgba(255,255,255,0.65);
  margin-bottom: 1rem;
}
.migas a{ color: rgba(255,255,255,0.9); }
.migas a:hover{ text-decoration: underline; }

.grid-dos{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.6rem;
}
.grid-dos.alineado-arriba{ align-items: start; }

.lista-pasos{
  display:flex;
  flex-direction:column;
  gap: 1.6rem;
  counter-reset: paso;
}
.paso{
  display:grid;
  grid-template-columns: 56px 1fr;
  gap: 1.2rem;
  align-items:flex-start;
}
.paso-num{
  width: 56px; height: 56px;
  border-radius:50%;
  background: var(--verde-suave);
  color: var(--verde-bosque);
  font-family: var(--fuente-display);
  font-size: 1.4rem;
  display:flex; align-items:center; justify-content:center;
}
.seccion-oscura .paso-num{
  background: rgba(255,255,255,0.1);
  color: var(--bronce-suave);
}
.paso h3{ margin-bottom:0.35rem; }
.paso p{ color: var(--carbon-suave); font-size:0.98rem; }
.seccion-oscura .paso p{ color: rgba(255,255,255,0.78); }

.tarjeta-comparativa{
  background: var(--blanco);
  border: 1px solid var(--linea);
  border-radius: var(--radio);
  padding: 2rem 1.8rem;
  height:100%;
}
.tarjeta-comparativa.destacada{
  border-color: var(--verde-vivo);
  box-shadow: var(--sombra);
}
.tarjeta-comparativa .etiqueta{
  display:inline-block;
  font-family: var(--fuente-mono);
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--bronce);
  background: var(--bronce-suave);
  padding: 0.25em 0.7em;
  border-radius: 999px;
  margin-bottom: 0.9rem;
}
.tarjeta-comparativa h3{ margin-bottom: 0.8rem; }
.tarjeta-comparativa ul{ display:flex; flex-direction:column; gap:0.7rem; margin-top:1.2rem; }
.tarjeta-comparativa li{
  display:flex;
  gap:0.6rem;
  align-items:flex-start;
  font-size:0.95rem;
  color: var(--carbon-suave);
}
.tarjeta-comparativa li .marca{
  width:20px; height:20px; flex-shrink:0;
  border-radius:50%;
  background: var(--verde-suave);
  color: var(--verde-bosque);
  display:flex; align-items:center; justify-content:center;
  margin-top:0.1rem;
}

.mapa-contacto{
  border-radius: var(--radio);
  overflow:hidden;
  border: 1px solid var(--linea);
  height: 340px;
}
.mapa-contacto iframe{ width:100%; height:100%; border:0; display:block; }
.mapa-aviso{
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:0.8rem;
  padding: 1.6rem;
  background: var(--arena);
  color: var(--verde-bosque);
}
.mapa-aviso p{
  max-width: 32ch;
  font-size:0.9rem;
  color: var(--carbon-suave);
}

.bloque-cita{
  border-left: 3px solid var(--bronce);
  padding-left: 1.4rem;
  margin: 1.6rem 0;
}
.bloque-cita p{
  font-family: var(--fuente-display);
  font-size: 1.15rem;
  color: var(--verde-bosque);
  font-style: italic;
}
.seccion-oscura .bloque-cita p{ color: var(--blanco); }

.aviso-borrador{
  background: var(--bronce-suave);
  border: 1px solid var(--bronce);
  border-radius: var(--radio);
  padding: 1.3rem 1.5rem;
  margin-bottom: 2.5rem;
  font-size:0.92rem;
  color: var(--carbon);
}
.aviso-borrador strong{ color: var(--verde-bosque); }
.contenido-legal{ max-width: 760px; }
.contenido-legal h2{ font-size:1.4rem; margin-top:2.2rem; margin-bottom:0.8rem; }
.contenido-legal h2:first-of-type{ margin-top:0; }
.contenido-legal p, .contenido-legal li{ color: var(--carbon-suave); margin-bottom:0.8rem; }
.contenido-legal ul{ padding-left:1.3rem; list-style: disc; }
.contenido-legal a{ color: var(--verde-vivo); font-weight:600; }
.contenido-legal .marcador{
  background: var(--verde-suave);
  color: var(--verde-bosque);
  padding: 0.1em 0.4em;
  border-radius: 4px;
  font-family: var(--fuente-mono);
  font-size: 0.88em;
}

.cta-media{
  background: var(--verde-suave);
  padding: clamp(1.8rem, 3vw, 2.6rem) 0;
}
.cta-caja{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 1.6rem;
  flex-wrap:wrap;
}
.cta-caja h3{ font-size: 1.3rem; }
.cta-caja p{ margin-top:0.3rem; color: var(--carbon-suave); }
.cta-caja-botones{ display:flex; gap:0.9rem; flex-wrap:wrap; }

.aviso-whatsapp{
  display:flex;
  flex-wrap: wrap;
  align-items:center;
  gap:0.7rem;
  font-size:0.92rem;
  color: var(--carbon-suave);
  margin-top: 1.2rem;
}
.aviso-whatsapp a{
  font-weight:700;
  color: #1fb955;
  display:inline-flex;
  align-items:center;
  gap:0.4rem;
}
.aviso-whatsapp svg{ width:18px; height:18px; flex-shrink:0; }

@media (max-width: 1024px){
  .grid-servicios{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid-diferenciales{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-grid{ grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr); }
}

@media (max-width: 900px){
  .nav-enlaces-rapidos{ display:none; }
}

/* en movil no cargamos el video, mostramos la imagen de fondo en su lugar */
@media (max-width: 768px){
  .hero.con-video .video-fondo{ display:none; }
  .hero.con-video{
    background:
      linear-gradient(160deg, rgba(11,61,46,0.92) 10%, rgba(11,61,46,0.72) 55%, rgba(11,61,46,0.55) 100%),
      var(--imagen-hero, url('../imagenes/pexels-damir-20693394.jpg')) center / cover no-repeat;
  }
  .hero-interior.con-video .video-fondo{ display:none; }
  .hero-interior.con-video{
    background:
      linear-gradient(160deg, rgba(11,61,46,0.92) 20%, rgba(11,61,46,0.72) 100%),
      var(--imagen-hero) center / cover no-repeat;
  }
}

@media (max-width: 860px){
  .hero-grid{ grid-template-columns: 1fr; text-align:left; }
  .hero-sello-zona{ order:-1; min-height:auto; margin-bottom: 1rem; }
  .sello{ width:170px; height:170px; }
  .sello-interior{ width:138px; height:138px; }
  .hero-datos{ gap:1.4rem; }


  .franja-red{ grid-template-columns: 1fr; }
  .franja-contacto{ grid-template-columns: 1fr; }
  .grid-dos{ grid-template-columns: 1fr; }
  .paso{ grid-template-columns: 48px 1fr; }
  .paso-num{ width:48px; height:48px; font-size:1.15rem; }

  .footer-grid{ grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .footer-grid .footer-col-marca{ grid-column: span 2; }
}

@media (max-width: 560px){
  .grid-servicios{ grid-template-columns: 1fr; }
  .grid-diferenciales{ grid-template-columns: 1fr; }
  .campo-dos{ grid-template-columns: 1fr; }
  .footer-grid{ grid-template-columns: 1fr; }
  .footer-grid > div{ grid-column: span 1 !important; }
  .whatsapp-texto{ display:none; }
  .whatsapp-flotante{ padding: 0.85rem; }
  .hero-acciones{ flex-direction:column; align-items:stretch; margin-bottom: 90px; }
  .hero-acciones .boton{ width:100%; }
  .nav-boton-valoracion{ display:none; }
  .nav-cta .boton-whatsapp{ display:none; }
  .nav-cta{ gap:0.5rem; }
  .cta-caja{ flex-direction:column; align-items:stretch; text-align:center; }
  .cta-caja-botones{ justify-content:center; }
}