/* ===================================================================
   BERA ELÉCTRICA — Hoja de estilos nativa
   Línea gráfica corporativa: Azul Marino + Dorado sobre fondos claros.
   Tipografía: Montserrat (ExtraBold / Bold para títulos).
   =================================================================== */

:root{
  /* Marca oficial (Manual de Marca): Negro Antracita, Gris Cemento, Azul LED */
  --navy:#111111;         /* Negro Antracita — cabecera, footer, bloques clave */
  --navy-2:#1f1f1f;        /* Antracita claro — acentos sobre fondo oscuro */
  --navy-deep:#0a0a0a;     /* Antracita profundo — overlays de imagen */
  --antracita:#111111;    /* Negro Antracita del manual de marca */
  --azul-marca:#007BFF;   /* Azul LED del manual de marca */
  --gold:#007BFF;          /* Azul LED — CTAs, acentos (sustituye al dorado) */
  --gold-light:#4DA3FF;    /* Azul LED claro — hover */
  --gold-deep:#0062CC;     /* Azul LED oscuro — texto/enlaces sobre blanco (contraste AA) */
  --gold-10:rgba(0,123,255,.12);
  --gold-25:rgba(0,123,255,.28);

  /* Neutros */
  --blanco:#FFFFFF;
  --cemento:#F5F5F7;
  --gris-claro:#F8F9FA;
  --gris-borde:#E7E9EE;
  --gris-borde-2:#DCE0E6;
  --texto:#1C2530;
  --texto-suave:#5B6472;
  --texto-tenue:#8A93A0;

  /* Servicios externos */
  --whatsapp:#25D366;
  --google:#4285F4;
  --wallapop:#13C1AC;
  --alerta:#E8442C;

  --radio:16px;
  --radio-sm:10px;
  --sombra: 0 12px 34px -14px rgba(17,17,17,.18);
  --sombra-lg: 0 24px 60px -20px rgba(17,17,17,.28);
  --maxw:1200px;
  --ease: cubic-bezier(.4,0,.2,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important;}
}

body{
  margin:0;
  background:var(--blanco);
  color:var(--texto-suave);
  font-family:'Montserrat', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,p{margin:0}
/* El padding lateral coincide exactamente con el de la cabecera flotante
   (margen del header + padding del header-inner) en cada breakpoint, para
   que todo el texto alineado a la izquierda quede en línea con el logo. */
.container{max-width:var(--maxw);margin:0 auto;padding-left:20px;padding-right:20px}
@media(min-width:640px){.container{padding-left:42px;padding-right:42px}}
@media(min-width:1024px){.container{padding-left:72px;padding-right:72px}}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-999px;top:0;background:var(--gold);color:#fff;padding:12px 18px;z-index:200;border-radius:0 0 8px 0;font-weight:800;font-size:13px}
.skip-link:focus{left:0}

/* ---------- Utilidades tipográficas ---------- */
.eyebrow{
  display:flex;align-items:center;gap:10px;
  font-size:11px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--texto-tenue);
}
.eyebrow span{color:var(--gold-deep);font-weight:800}
h2.titulo{
  margin-top:16px;max-width:780px;
  font-size:clamp(1.9rem,4.2vw,2.7rem);
  font-weight:800;line-height:1.14;letter-spacing:-.01em;text-transform:uppercase;color:var(--navy);
}
h2.titulo.tc{text-transform:none;line-height:1.22}
.subtitulo{margin-top:16px;max-width:640px;font-size:1.02rem;font-weight:400;line-height:1.75;color:var(--texto-suave)}

/* Imagen a sangre completa (rompe el padding de la sección/contenedor) */
.full-bleed{width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:14px 28px;min-height:48px;border-radius:10px;font-size:.85rem;font-weight:700;
  letter-spacing:.02em;border:2px solid transparent;transition:all .25s var(--ease);
  white-space:nowrap;text-transform:uppercase;
}
.btn svg{width:17px;height:17px;fill:currentColor;flex-shrink:0}
.btn-azul{background:var(--gold);color:#fff;box-shadow:0 14px 30px -10px var(--gold-25)}
.btn-azul:hover{background:var(--gold-light);transform:translateY(-2px)}
.btn-ghost{border-color:var(--navy);color:var(--navy);background:transparent}
.btn-ghost:hover{background:var(--navy);color:#fff}
.btn-whatsapp{background:var(--whatsapp);color:#06301c}
.btn-whatsapp:hover{background:#33e07a;transform:translateY(-2px)}
.btn-urgente{background:var(--gold);color:#fff;box-shadow:0 16px 36px -10px rgba(0,123,255,.45);font-size:.92rem}
.btn-urgente:hover{background:var(--gold-light);transform:translateY(-2px)}
.btn-block{width:100%}

/* ===================== HEADER ===================== */
/* Barra flotante tipo "pill" sobre el fondo de la página */
.header{
  position:fixed;top:14px;left:14px;right:14px;z-index:100;
  max-width:var(--maxw);margin-left:auto;margin-right:auto;
  background:var(--cemento);
  border-radius:22px;
  box-shadow:0 16px 36px rgba(17,17,17,.3);
  transition:box-shadow .3s var(--ease), top .3s var(--ease);
}
@media(min-width:640px){.header{top:18px;left:22px;right:22px}}
@media(min-width:1024px){.header{left:32px;right:32px;border-radius:26px}}
.header.scrolled{box-shadow:0 10px 26px rgba(17,17,17,.4)}
/* Cuando el menú móvil está abierto, la cabecera pierde el redondeo inferior
   y la sombra para fundirse en una única pastilla junto con el desplegable */
.header.nav-open{border-bottom-left-radius:0;border-bottom-right-radius:0;box-shadow:none}
.header-inner{
  height:70px;display:flex;align-items:center;justify-content:space-between;gap:20px;
  max-width:var(--maxw);margin:0 auto;padding:12px 20px;
}
@media(min-width:1024px){.header-inner{padding:16px 40px;height:76px}}
.logo{display:flex;align-items:center;flex-shrink:0}
.logo img,.logo svg{height:24px;width:auto}
/* El menú de categorías solo se muestra al abrir la hamburguesa, en todos los tamaños */
.nav-desktop{display:none}
.nav-desktop a{
  font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--texto-suave);
  transition:color .2s;position:relative;padding:6px 0;
}
.nav-desktop a:hover{color:var(--navy)}
.nav-desktop a.nav-urgente{color:var(--gold-deep)}
.nav-desktop a.nav-urgente:hover{color:var(--navy)}
.header-actions{display:flex;align-items:center;gap:14px}
.header-cta{display:none}
@media(min-width:560px){.header-cta{display:inline-flex;padding:11px 20px;font-size:11px}}

.burger{
  display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;
  width:42px;height:42px;background:transparent;border:1px solid var(--gris-borde-2);border-radius:9px;flex-shrink:0;
}
.burger span{display:block;width:18px;height:2px;background:var(--navy);border-radius:2px;transition:transform .3s var(--ease),opacity .2s var(--ease)}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.mnav{
  /* Pegado justo debajo de la cabecera (0 hueco) para formar una única pastilla */
  position:fixed;inset:84px 14px auto 14px;z-index:99;
  max-width:var(--maxw);margin-left:auto;margin-right:auto;
  max-height:calc(100vh - 104px);
  background:var(--cemento);
  border-radius:0 0 22px 22px;
  box-shadow:0 16px 36px rgba(17,17,17,.16);
  border:1px solid var(--gris-borde);
  border-top:none;
  transform:translateY(-8px);opacity:0;pointer-events:none;
  transition:opacity .25s var(--ease), transform .25s var(--ease);
  overflow-y:auto;
}
@media(min-width:640px){.mnav{inset:88px 22px auto 22px}}
@media(min-width:1024px){.mnav{inset:94px 32px auto 32px;border-radius:0 0 26px 26px}}
.mnav.open{opacity:1;transform:translateY(0);pointer-events:auto}
.mnav-inner{padding:8px 20px 28px}
.mnav a{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 4px;border-bottom:1px solid var(--gris-borde);
  font-size:.95rem;font-weight:500;letter-spacing:.005em;color:var(--texto);text-transform:none;
}
.mnav a.mnav-urgente{color:var(--azul-marca)}
.mnav a.mnav-urgente .badge-live{
  display:inline-flex;align-items:center;gap:6px;font-size:10px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;background:rgba(17,17,17,.06);border:1px solid rgba(17,17,17,.14);
  padding:5px 10px;border-radius:999px;color:var(--texto-suave);transition:all .2s;
}
.mnav a.mnav-urgente .badge-live::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--texto-suave);animation:pulse-dot 1.4s infinite;flex-shrink:0}
.mnav a.mnav-urgente .badge-live.is-disponible{background:rgba(37,211,102,.12);border-color:rgba(37,211,102,.35);color:#1a8a4a}
.mnav a.mnav-urgente .badge-live.is-disponible::before{background:var(--whatsapp)}
.mnav a.mnav-urgente .badge-live.is-ocupado{background:rgba(232,68,44,.1);border-color:rgba(232,68,44,.3);color:var(--alerta)}
.mnav a.mnav-urgente .badge-live.is-ocupado::before{background:var(--alerta)}
.mnav-cta{margin-top:18px;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mnav a.mnav-call,
.mnav a.mnav-whatsapp{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border-bottom:none;border-radius:999px;padding:14px 12px;width:100%;font-size:.78rem;
}
.mnav a.mnav-call{color:#fff}
.mnav a.mnav-whatsapp{color:#06301c}

@keyframes pulse-dot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(1.3)}}

/* ===================== HERO ===================== */
.hero{position:relative;padding-bottom:0;background:var(--blanco)}

/* Franja fotográfica con tintado antracita al 70% */
.hero-photo{position:relative;isolation:isolate;overflow:hidden;padding-top:170px;padding-bottom:64px}
.hero-photo-bg{position:absolute;inset:0;z-index:-2}
.hero-photo-bg img{width:100%;height:100%;object-fit:cover}
.hero-photo-bg::after{content:"";position:absolute;inset:0;background:rgba(17,17,17,.7)}

.hero-content{text-align:left}
.hero-text{max-width:980px}
.hero h1{
  font-size:clamp(1.9rem,5vw,3.2rem);font-weight:800;line-height:1.22;
  letter-spacing:-.01em;text-transform:none;color:#fff;
}
.hero p.lead{margin:24px 0 0;max-width:700px;font-size:1.05rem;font-weight:300;line-height:1.7;color:#E7EAEF}
/* Los CTA se centran en el ancho total de la página, no en el de los textos */
.hero-ctas{margin:34px auto 0;display:grid;grid-template-columns:1fr;gap:12px;max-width:320px}
@media(min-width:560px){.hero-ctas{grid-template-columns:1fr 1fr;max-width:520px}}
.btn-hero{background:transparent;border:1.5px solid rgba(255,255,255,.85);color:#fff;border-radius:var(--radio);padding:12px 24px;font-size:.78rem;min-height:44px;width:100%}
.btn-hero:hover{background:#fff;color:var(--navy);border-color:#fff}

/* Experiencia y Oficio — bloque bajo el hero */
.experiencia{padding:clamp(40px,6vw,80px) 20px;background:var(--blanco)}
.exp-titulo{
  max-width:680px;font-size:clamp(1.8rem,4.4vw,2.5rem);font-weight:800;line-height:1.22;
  letter-spacing:-.01em;text-transform:none;color:var(--navy);
}
.experiencia-grid{margin-top:56px;display:grid;grid-template-columns:1fr;gap:52px}
@media(min-width:860px){.experiencia-grid{grid-template-columns:repeat(3,1fr);gap:36px}}
.experiencia-item{text-align:center;display:flex;flex-direction:column;align-items:center}
.exp-num{font-size:clamp(1.7rem,4vw,2.2rem);font-weight:800;color:var(--navy);letter-spacing:-.01em}
.exp-logo{height:38px;width:auto}
.exp-desc{margin-top:16px;font-size:1rem;font-weight:400;line-height:1.65;color:var(--texto-suave);max-width:280px}

/* ===================== SECCIONES GENERALES ===================== */
section{border-top:1px solid var(--gris-borde)}
/* El padding horizontal lo aporta .container (alineado con la cabecera);
   .seccion solo controla el espaciado vertical. */
.seccion{padding:clamp(40px,6vw,80px) 0;background:var(--blanco)}
.seccion.alt{background:var(--gris-claro)}

.grid-cards{margin-top:52px;display:grid;grid-template-columns:1fr;gap:20px}
@media(min-width:680px){.grid-cards.cols-2{grid-template-columns:1fr 1fr}}
@media(min-width:900px){.grid-cards.cols-3{grid-template-columns:repeat(3,1fr)}
  .grid-cards.cols-4{grid-template-columns:repeat(4,1fr)}}

.card{
  border:1px solid var(--gris-borde);background:var(--blanco);border-radius:var(--radio);padding:24px;
  box-shadow:var(--sombra);
  transition:border-color .25s var(--ease), transform .25s var(--ease), box-shadow .25s var(--ease);
}
.card:hover{border-color:var(--gold-25);transform:translateY(-4px);box-shadow:var(--sombra-lg)}
.card .num{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:34px;height:34px;padding:0 4px;border-radius:999px;
  background:var(--navy);color:var(--gold);font-size:12px;font-weight:800;letter-spacing:.04em;
}
.card .icon{width:52px;height:52px;margin-bottom:18px;border-radius:50%;background:var(--navy);display:flex;align-items:center;justify-content:center;padding:13px}
.card .icon img{width:100%;height:100%;object-fit:contain;filter:brightness(0) invert(1)}
.card .icon svg{width:100%;height:100%;fill:#fff}
.card h3{margin-top:16px;font-size:1.05rem;font-weight:800;text-transform:uppercase;letter-spacing:-.01em;color:var(--navy);line-height:1.35}
.card p{margin-top:10px;font-size:.9rem;font-weight:400;line-height:1.7;color:var(--texto-suave)}

/* Garantías (trust) */
.trust{margin-top:52px;display:grid;grid-template-columns:1fr;gap:18px}
@media(min-width:768px){.trust{grid-template-columns:repeat(3,1fr)}}
.trust > div{background:var(--blanco);border:1px solid var(--gris-borde);border-radius:var(--radio);padding:24px;box-shadow:var(--sombra);text-align:left}
.trust .icon{width:52px;height:52px;border-radius:50%;background:var(--navy);display:flex;align-items:center;justify-content:center;padding:13px}
.trust .icon svg{width:100%;height:100%;fill:#fff}
.trust .icon img{width:100%;height:100%;object-fit:contain;filter:brightness(0) invert(1)}
.trust h3{margin-top:20px;font-size:1.2rem;font-weight:800;color:var(--navy);text-transform:uppercase;letter-spacing:-.01em}
.trust p{margin-top:8px;font-size:.9rem;font-weight:400;color:var(--texto-suave);line-height:1.65}

/* Imagen tratada: fotografía real con tintado sutil de marca */
.figure-tinted{position:relative;overflow:hidden;border-radius:var(--radio);border:1px solid var(--gris-borde);box-shadow:var(--sombra)}
.figure-tinted img{width:100%;height:100%;object-fit:cover;filter:saturate(1.05) contrast(1.04);transition:transform .5s var(--ease)}
.figure-tinted::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(200deg, rgba(17,17,17,.16), rgba(17,17,17,0) 55%);
  mix-blend-mode:multiply;
}
.figure-tinted:hover img{transform:scale(1.04)}

/* ===================== CARGADORES V2C ===================== */
.v2c-seccion{padding-top:0}
.v2c-hero-figure{margin:0 0 48px;aspect-ratio:16/10}
.v2c-hero-figure img{width:100%;height:100%;object-fit:cover;display:block}
@media(min-width:768px){.v2c-hero-figure{aspect-ratio:21/9}}

/* Iconos apilados: Sin Sorpresas / Ahorro Inteligente / Control Total */
.feat-stack{margin-top:48px;display:flex;flex-direction:column;gap:44px;max-width:340px;margin-left:auto;margin-right:auto}
@media(min-width:768px){.feat-stack{max-width:none;flex-direction:row;gap:32px}}
.feat-stack-item{text-align:center;flex:1}
.feat-icon{width:44px;height:44px;margin:0 auto 18px}
.feat-icon img{width:100%;height:100%;object-fit:contain}
.feat-stack-item h3{font-size:1.05rem;font-weight:800;color:var(--navy)}
.feat-stack-item p{margin-top:8px;font-size:.92rem;font-weight:400;line-height:1.6;color:var(--texto-suave)}

/* ===================== SERVICIOS ELÉCTRICOS ===================== */
.servicios-seccion{padding-top:0}
.servicios-list{margin:48px auto 0;max-width:420px;display:flex;flex-direction:column}
.servicios-list li{text-align:center;padding:32px 0}
.servicios-list li:first-child{padding-top:0}
.servicios-list li:not(:last-child){border-bottom:1px solid var(--gris-borde-2)}
.servicios-list h3{font-size:1.05rem;font-weight:800;color:var(--navy)}
.servicios-list p{margin-top:10px;font-size:.92rem;font-weight:400;line-height:1.65;color:var(--texto-suave)}

/* Carrusel V2C */
.v2c-carousel{margin-top:80px}
.v2c-carousel-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap}
.v2c-carousel-head h3{font-size:1.4rem;font-weight:800;color:var(--navy);text-transform:uppercase}
.carousel-nav{display:flex;gap:10px}
.carousel-btn{
  width:44px;height:44px;border-radius:50%;border:2px solid var(--navy);background:var(--blanco);color:var(--navy);
  display:flex;align-items:center;justify-content:center;font-size:1.2rem;transition:all .2s;
}
.carousel-btn:hover{border-color:var(--gold);background:var(--gold);color:#fff}
.carousel-btn:disabled{opacity:.3;pointer-events:none}

.v2c-track-wrap{margin-top:28px;overflow:hidden}
.v2c-track{display:flex;gap:20px;transition:transform .45s var(--ease)}
.v2c-slide{flex:0 0 100%;max-width:100%}
@media(min-width:680px){.v2c-slide{flex:0 0 calc(50% - 10px);max-width:calc(50% - 10px)}}
@media(min-width:1024px){.v2c-slide{flex:0 0 calc(33.333% - 14px);max-width:calc(33.333% - 14px)}}

.v2c-card{border:1px solid var(--gris-borde);background:var(--blanco);border-radius:var(--radio);overflow:hidden;height:100%;display:flex;flex-direction:column;box-shadow:var(--sombra)}
.v2c-card .figure-tinted{aspect-ratio:4/3;border-radius:0;border:none;box-shadow:none}
.v2c-card .body{padding:24px;display:flex;flex-direction:column;flex:1}
.v2c-card .tag{font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);padding-bottom:12px;border-bottom:1px solid var(--gris-borde)}
.v2c-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:12px;border-bottom:1px solid var(--gris-borde)}
.v2c-card-head .tag{padding-bottom:0;border-bottom:none}
.v2c-badge{flex-shrink:0;font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:var(--gold);padding:5px 10px;border-radius:999px}
.v2c-card h4{margin-top:16px;font-size:1.4rem;font-weight:800;color:var(--navy);text-transform:uppercase;letter-spacing:-.01em}
.v2c-card p{margin-top:8px;font-size:.88rem;font-weight:400;line-height:1.65;color:var(--texto-suave);flex:1}
.v2c-card ul{margin-top:14px;display:grid;gap:8px}
.v2c-card ul li{font-size:.82rem;color:var(--texto-suave);display:flex;gap:8px;padding-top:8px;border-top:1px solid var(--gris-borde)}
.v2c-card ul li::before{content:"▸";color:var(--gold-deep);font-weight:800}
.v2c-card .btn{margin-top:20px;align-self:flex-start}
.dots{margin-top:24px;display:flex;justify-content:center;gap:8px}
.dots button{width:8px;height:8px;border-radius:50%;background:var(--gris-borde-2);border:none;padding:0;transition:all .25s}
.dots button.active{background:var(--gold);width:22px;border-radius:5px}

/* Proceso 4 pasos — una única "masa" con reveal escalonado */
.proceso-box{
  margin-top:52px;background:var(--gris-claro);border-radius:28px;
  padding:clamp(36px,6vw,64px) clamp(24px,5vw,56px);
}
.proceso-titulo{
  max-width:520px;margin:0 auto;text-align:center;
  font-size:clamp(1.2rem,2.6vw,1.5rem);font-weight:800;line-height:1.4;color:var(--navy);
}
.proceso{margin-top:56px;display:flex;flex-direction:column;gap:52px;max-width:420px;margin-inline:auto}
.paso{text-align:center;opacity:0;transform:translateY(22px);transition:opacity .55s var(--ease), transform .55s var(--ease)}
.proceso-box.visible .paso{opacity:1;transform:translateY(0)}
.proceso-box.visible .paso:nth-child(1){transition-delay:0ms}
.proceso-box.visible .paso:nth-child(2){transition-delay:180ms}
.proceso-box.visible .paso:nth-child(3){transition-delay:360ms}
.proceso-box.visible .paso:nth-child(4){transition-delay:540ms}
.paso-num{
  display:block;font-size:2.6rem;font-weight:800;line-height:1;color:var(--navy);letter-spacing:-.02em;
}
.paso h4{margin-top:8px;font-size:1.05rem;font-weight:800;color:var(--navy)}
.paso p{margin-top:10px;font-size:.92rem;font-weight:400;line-height:1.65;color:var(--texto-suave)}

/* ===================== CTA CONCERTAR CITA ===================== */
.cita-cta{padding:clamp(32px,5vw,56px) 0;background:var(--blanco);text-align:center}
.cita-btn{padding:16px 36px;font-size:.95rem}

/* ===================== BANNER URGENCIAS ===================== */
.urgencias{position:relative;isolation:isolate;overflow:hidden;padding-block:76px;background:var(--navy);border-top:none}
.urgencias-bg{position:absolute;inset:0;z-index:-2}
.urgencias-bg img{width:100%;height:100%;object-fit:cover;filter:grayscale(.3) contrast(1.05) brightness(.75)}
.urgencias-bg::after{
  content:"";position:absolute;inset:0;
  background:rgba(0,123,255,.72);
}
.urgencias-inner{max-width:900px}
.urgencias-status{
  display:inline-flex;align-items:center;gap:9px;margin-bottom:18px;
  padding:8px 16px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);
  color:#fff;font-size:.76rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
}
.urgencias-status .dot{width:8px;height:8px;border-radius:50%;background:#fff;animation:pulse-dot 1.4s infinite;flex-shrink:0}
.urgencias-status.is-disponible .dot{background:var(--whatsapp)}
.urgencias-status.is-ocupado .dot{background:var(--alerta)}
.urgencias-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;flex-wrap:wrap}
.urgencias h2{
  max-width:640px;font-size:clamp(1.7rem,3.8vw,2.3rem);font-weight:800;color:#fff;
  text-transform:none;line-height:1.25;
}
.urgencias-24h{display:none;font-size:2.6rem;font-weight:800;color:#fff;letter-spacing:-.01em}
@media(min-width:768px){.urgencias-24h{display:block}}
.urgencias p.desc{margin-top:20px;max-width:640px;font-size:.98rem;font-weight:400;color:#EAF0FA;line-height:1.75}
.urgencias .ctas{margin-top:32px;display:flex;flex-wrap:wrap;gap:16px;justify-content:center;text-align:center}
.urgencias .btn-urgente{font-size:1rem;background:#fff;color:var(--navy);box-shadow:0 16px 36px -12px rgba(0,0,0,.35)}
.urgencias .btn-urgente:hover{background:var(--gris-claro)}

/* ===================== SOBRE BENJA ============================= */
.benja-figure{margin:48px 0;aspect-ratio:4/5}
.benja-quote{
  max-width:640px;margin:28px auto 0;text-align:center;
  font-size:clamp(1.1rem,2.4vw,1.3rem);font-weight:700;font-style:italic;color:var(--navy);line-height:1.6;
}

/* Desktop: texto a la izquierda, foto a la derecha en 2 columnas.
   Todo el bloque se activa solo si la foto (.benja-figure) está presente en el
   DOM, así que mientras esté retirada temporalmente el texto ocupa el ancho
   completo automáticamente, y en cuanto se restaure la imagen vuelve a las
   2 columnas sin tocar CSS. */
@media(min-width:960px){
  .benja-seccion:has(.benja-figure){display:grid;grid-template-columns:1fr 1fr;column-gap:64px;align-items:center}
  .benja-seccion:has(.benja-figure) .container{max-width:none;padding-left:0;padding-right:0;grid-row:1;grid-column:1}
  .benja-seccion:has(.benja-figure) .titulo,
  .benja-seccion:has(.benja-figure) .subtitulo,
  .benja-seccion:has(.benja-figure) .benja-quote{text-align:left;margin-left:0;max-width:none}
  .benja-seccion:has(.benja-figure) .benja-quote{margin-top:28px}
  .benja-seccion .benja-figure.full-bleed{
    width:100%;margin:0;grid-row:1;grid-column:2;
    aspect-ratio:3/4;border-radius:var(--radio);overflow:hidden;box-shadow:var(--sombra-lg);
  }
}

/* ===================== TESTIMONIOS ===================== */
.resenas-grid{margin-top:52px;display:grid;grid-template-columns:1fr;gap:20px}
@media(min-width:960px){.resenas-grid{grid-template-columns:1fr 1fr}}
.resena-block{border:1px solid var(--gris-borde);background:var(--blanco);border-radius:var(--radio);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--sombra)}
.resena-top-bar{height:4px}
.resena-top-bar.google{background:var(--google)}
.resena-top-bar.wallapop{background:var(--wallapop)}
.resena-head{display:flex;align-items:center;gap:14px;padding:22px 24px;border-bottom:1px solid var(--gris-borde);flex-wrap:wrap}
.resena-head .logo-mark{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.1rem;color:#fff;flex-shrink:0}
.logo-mark.google{background:var(--google)}
.logo-mark.wallapop{background:var(--wallapop);color:#062622}
.resena-head h3{font-size:1rem;font-weight:800;color:var(--navy)}
.resena-head .sub{display:block;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--texto-tenue)}
.resena-score{margin-left:auto;font-size:11px;font-weight:800;padding:8px 14px;border-radius:8px;background:var(--gold-10);color:var(--gold-deep);border:1px solid var(--gold-25)}

.resena-track-wrap{overflow:hidden;flex:1}
.resena-track{display:flex;transition:transform .4s var(--ease)}
.resena-slide{flex:0 0 100%;max-width:100%;padding:26px 24px}
.stars{color:var(--gold);letter-spacing:3px;font-size:.95rem}
.resena-slide p{margin-top:14px;font-size:.9rem;font-weight:400;line-height:1.7;color:var(--texto-suave)}
.resena-slide cite{display:block;margin-top:20px;font-size:.9rem;font-weight:800;font-style:normal;color:var(--navy)}
.resena-slide .meta{display:block;margin-top:2px;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--texto-tenue)}
.resena-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 24px;border-top:1px solid var(--gris-borde)}
.resena-foot .foot-link{font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-deep)}
.resena-foot .mini-nav{display:flex;gap:8px}
.resena-foot button{width:36px;height:36px;border-radius:8px;border:1px solid var(--gris-borde-2);background:transparent;color:var(--navy)}
.resena-foot button:hover{border-color:var(--gold);background:var(--gold)}
.resenas-cta{margin-top:32px;display:flex;flex-wrap:wrap;gap:14px}

/* ===================== FAQ ===================== */
.faq-seccion{background:var(--antracita)}
.faq-seccion .eyebrow{color:#8A93A0}
.faq-seccion .eyebrow span{color:var(--gold)}
.faq-seccion .titulo{color:#fff}
.faq-list{margin-top:52px;max-width:840px;border-top:1px solid rgba(255,255,255,.14)}
.faq-item{border-bottom:1px solid rgba(255,255,255,.14)}
.faq-q{
  width:100%;display:flex;align-items:flex-start;justify-content:space-between;gap:20px;
  background:none;border:none;text-align:left;padding:18px 20px;color:#fff;
  font-size:1.02rem;font-weight:700;letter-spacing:-.005em;
}
.faq-q:hover{color:var(--gold)}
.faq-icon{position:relative;flex-shrink:0;width:22px;height:22px;margin-top:3px;border-radius:50%;background:#fff}
.faq-icon::before,.faq-icon::after{content:"";position:absolute;background:var(--gold);border-radius:2px}
.faq-icon::before{left:50%;top:50%;width:10px;height:2px;translate:-50% -50%}
.faq-icon::after{left:50%;top:50%;width:2px;height:10px;translate:-50% -50%;transition:opacity .2s}
.faq-q[aria-expanded="true"] .faq-icon::after{opacity:0}
.faq-a{max-height:0;overflow:hidden;transition:max-height .35s var(--ease)}
.faq-a p{padding:0 20px 20px 20px;font-size:.94rem;font-weight:400;line-height:1.75;color:#B7BEC8}

/* ===================== COBERTURA ===================== */
.cobertura-grid{
  margin-top:44px;display:grid;grid-template-columns:repeat(2,1fr);gap:12px;
}
@media(min-width:640px){.cobertura-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:960px){.cobertura-grid{grid-template-columns:repeat(4,1fr)}}
.pill{
  display:flex;align-items:center;gap:10px;
  border:1px solid var(--gris-borde-2);background:var(--blanco);border-radius:999px;
  padding:8px 16px;font-size:.85rem;font-weight:600;color:var(--texto);
  transition:border-color .2s,background .2s,color .2s,box-shadow .2s;
}
.pill:hover{border-color:var(--gold);box-shadow:var(--sombra)}
.pill .pill-dot{width:6px;height:6px;border-radius:50%;background:var(--navy);flex-shrink:0}
.pill.pill-base{background:var(--navy);border-color:var(--navy);color:#fff}
.pill.pill-base .pill-dot{background:var(--gold)}
.pill.pill-base .tag-base{margin-left:auto;font-size:9px;font-weight:800;letter-spacing:.12em;color:var(--gold)}

/* ===================== CONTACTO ===================== */
.contacto-grid{margin-top:52px;display:grid;grid-template-columns:1fr;gap:44px}
@media(min-width:960px){.contacto-grid{grid-template-columns:.85fr 1.15fr}}
.contacto-info{background:var(--antracita);border-radius:var(--radio);padding:40px;color:#fff}
.contacto-titulo{font-size:2rem;font-weight:800;line-height:1.2}
.contacto-sub{margin-top:14px;font-size:1.05rem;font-weight:600;line-height:1.5;color:#fff}
.contacto-info .contacto-links{margin-top:32px;display:grid;gap:18px}
.contacto-info .contacto-links a{display:flex;align-items:center;gap:12px;font-size:1rem;font-weight:700;transition:color .2s}
.contacto-info .contacto-links a:hover{color:var(--gold-light)}
.contacto-info .contacto-links svg{width:19px;height:19px;fill:var(--gold);flex-shrink:0}

/* Formulario estilo línea: sin cajas, solo subrayado */
.form{display:grid;gap:32px}
.field{display:grid;gap:10px}
.field label{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--texto-tenue)}
.field input,.field select{
  width:100%;background:transparent;border:none;border-bottom:1px solid var(--gris-borde-2);border-radius:0;
  padding:8px 0 12px;font-size:1rem;color:var(--texto);font-family:inherit;transition:border-color .2s;
}
.field select{appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%235B6472'%3E%3Cpath d='M5.25 7.5l4.75 5 4.75-5H5.25z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 4px center;padding-right:30px;
}
.field input:focus,.field select:focus{outline:none;border-color:var(--gold)}
.field input::placeholder{color:var(--texto-tenue)}
.form-note{font-size:.78rem;font-weight:400;color:var(--texto-tenue);margin-top:-4px}
.form-status{font-size:.85rem;font-weight:700;padding:12px 16px;border-radius:9px;display:none}
.form-status.show{display:block}
.form-status.ok{background:rgba(37,211,102,.1);border:1px solid rgba(37,211,102,.35);color:#1a9c50}

/* Casilla de aceptación de la Política de Privacidad */
.field-check{gap:0}
.check-label{display:flex;align-items:flex-start;gap:12px;cursor:pointer}
.check-label input[type="checkbox"]{
  appearance:none;-webkit-appearance:none;width:20px;height:20px;flex-shrink:0;margin-top:2px;
  border:2px solid var(--gris-borde-2);border-radius:5px;background:#fff;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;transition:all .2s;
}
.check-label input[type="checkbox"]:checked{background:var(--gold);border-color:var(--gold)}
.check-label input[type="checkbox"]:checked::after{
  content:"";width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;
  transform:rotate(45deg) translate(-1px,-1px);
}
.check-label input[type="checkbox"]:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.check-label span{font-size:.85rem;line-height:1.6;color:var(--texto-suave)}
.check-label span a{color:var(--gold-deep);font-weight:700;text-decoration:underline}

/* ===================== FOOTER ===================== */
.footer{background:var(--navy);padding-block:56px 28px}
.footer-grid{display:grid;grid-template-columns:1fr;gap:36px}
@media(min-width:768px){.footer-grid{grid-template-columns:1.3fr 1fr 1fr 1fr}}
.footer-brand p{margin-top:0;font-size:.85rem;font-weight:400;line-height:1.65;color:#A9B5C6;max-width:280px}
.footer-social{margin-top:20px;display:flex;gap:10px}
.footer-social a{width:38px;height:38px;border-radius:9px;border:1px solid rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;color:#C9D3E0;transition:all .2s}
.footer-social a:hover{border-color:var(--gold);color:var(--gold);background:var(--gold-10)}
.footer-social svg{width:17px;height:17px;fill:currentColor}
.footer h4{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.footer ul{margin-top:18px;display:grid;gap:12px}
.footer ul a{font-size:.87rem;font-weight:400;color:#A9B5C6;transition:color .2s}
.footer ul a:hover{color:var(--gold-light)}
.footer-bottom{margin-top:46px;padding-top:22px;border-top:1px solid rgba(255,255,255,.14);display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;font-size:.78rem;font-weight:400;color:#8899AD}
.footer-bottom a{color:#8899AD}
.footer-bottom a:hover{color:var(--gold-light)}
.footer-legal{margin-top:14px;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:.78rem;font-weight:400;color:#8899AD}
.footer-legal a{color:#8899AD;transition:color .2s}
.footer-legal a:hover{color:var(--gold-light)}

/* ===================== BANNER DE COOKIES ===================== */
.cookie-banner{
  position:fixed;left:14px;right:14px;bottom:14px;z-index:999;
  background:var(--navy);color:#fff;border-radius:var(--radio);
  padding:22px 24px;box-shadow:var(--sombra-lg);
  display:flex;flex-direction:column;gap:16px;
  transform:translateY(140%);opacity:0;transition:transform .4s var(--ease),opacity .4s var(--ease);
  pointer-events:none;
}
.cookie-banner.show{transform:translateY(0);opacity:1;pointer-events:auto}
@media(min-width:640px){.cookie-banner{left:22px;right:22px;bottom:22px;max-width:600px;margin:0 auto}}
@media(min-width:1024px){.cookie-banner{left:auto;right:32px;bottom:32px;max-width:420px}}
.cookie-banner p{font-size:.85rem;line-height:1.65;color:#D7DEE8}
.cookie-banner p a{color:#fff;text-decoration:underline;font-weight:700}
.cookie-banner-actions{display:flex;flex-wrap:wrap;gap:10px}
.cookie-banner-actions .btn{flex:1;min-width:110px;padding:11px 14px;font-size:.7rem}
.cookie-banner-actions .btn-ghost-dark{border-color:rgba(255,255,255,.35);color:#fff;background:transparent}
.cookie-banner-actions .btn-ghost-dark:hover{background:rgba(255,255,255,.12)}

/* ===================== PÁGINAS LEGALES ===================== */
.legal-content{padding:clamp(40px,6vw,72px) 0 clamp(64px,8vw,96px)}
.legal-header{margin-bottom:36px;border-bottom:1px solid var(--gris-borde);padding-bottom:28px}
.legal-header h1{font-size:clamp(1.7rem,4vw,2.3rem);font-weight:800;color:var(--navy);line-height:1.2}
.legal-updated{margin-top:10px;font-size:.85rem;font-weight:700;color:var(--texto-tenue)}
.legal-content h2{margin-top:40px;font-size:1.2rem;font-weight:800;color:var(--navy)}
.legal-content h3{margin-top:22px;font-size:1rem;font-weight:700;color:var(--navy)}
.legal-content p{margin-top:14px;font-size:.98rem;line-height:1.75;color:var(--texto-suave);max-width:760px}
.legal-content ul,.legal-content ol{margin-top:14px;display:grid;gap:10px;padding-left:22px;max-width:760px}
.legal-content ul{list-style:disc}
.legal-content ol{list-style:decimal}
.legal-content li{font-size:.98rem;line-height:1.7;color:var(--texto-suave)}
.legal-content a{color:var(--gold-deep);font-weight:700;text-decoration:underline}
.legal-content a:hover{color:var(--gold)}
.legal-content strong{color:var(--navy)}
.legal-datos{margin-top:20px;background:var(--gris-claro);border-radius:var(--radio-sm);padding:24px 28px;display:grid;gap:6px;max-width:520px}
.legal-datos dt{font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--texto-tenue);margin-top:10px}
.legal-datos dt:first-child{margin-top:0}
.legal-datos dd{font-size:.95rem;font-weight:700;color:var(--navy)}

/* ===================== FLOTANTES CTA ===================== */
.fab-whatsapp{
  position:fixed;right:20px;bottom:20px;z-index:90;
  width:60px;height:60px;border-radius:50%;background:var(--whatsapp);
  display:flex;align-items:center;justify-content:center;box-shadow:0 14px 30px -8px rgba(37,211,102,.55);
  transition:transform .25s var(--ease);
}
.fab-whatsapp:hover{transform:scale(1.08)}
.fab-whatsapp svg{width:30px;height:30px;fill:#06301c}
.fab-whatsapp .ring{position:absolute;inset:0;border-radius:50%;border:2px solid var(--whatsapp);animation:ring-pulse 2.2s infinite}
@keyframes ring-pulse{0%{opacity:.7;scale:1}100%{opacity:0;scale:1.6}}

/* Reveal on scroll */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease), transform .7s var(--ease)}
.reveal.visible{opacity:1;transform:translateY(0)}

/* Loading state para imágenes */
img[loading="lazy"]{background:var(--gris-claro)}