:root{
  --navy:#153B73;
  --navy-dark:#0E2A52;
  --blue:#1D4E8C;
  --ink:#182233;
  --muted:#667085;
  --line:#D9E0E8;
  --soft:#F5F7FA;
  --white:#FFFFFF;
  --shadow:0 12px 30px rgba(18,44,78,.12);
  --radius:18px;
  --header-h:86px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color:var(--ink);
  background:#fff;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
button{font:inherit}
img{max-width:100%;display:block}
svg{fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.section-shell{width:min(1180px,calc(100% - 48px));margin-inline:auto}
.skip-link{position:absolute;left:-9999px;top:12px;background:#fff;color:var(--navy);padding:10px 14px;border-radius:8px;z-index:999}
.skip-link:focus{left:12px}

.site-header{
  height:var(--header-h);
  background:rgba(14,42,82,.97);
  color:#fff;
  position:sticky;
  top:0;
  z-index:50;
  box-shadow:0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
}
.header-inner{
  height:100%;
  width:min(1220px,calc(100% - 40px));
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
}
.brand{display:flex;align-items:center;min-width:210px}
.brand img{width:220px;height:auto;filter:none}
.main-nav{display:flex;align-items:center;gap:8px}
.nav-link{
  color:#fff;
  min-height:44px;
  padding:0 16px;
  border:0;
  background:transparent;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  border-radius:11px;
  cursor:pointer;
  transition:.2s ease;
}
.nav-link:hover,
.nav-link:focus-visible{
  color:#fff;
  background:rgba(255,255,255,.12);
  box-shadow:inset 0 -2px 0 #fff, 0 8px 20px rgba(0,0,0,.12);
}
.dropdown-toggle svg{width:16px;height:16px}
.nav-dropdown{position:relative}
.dropdown-menu{
  position:absolute;
  top:calc(100% + 9px);
  left:0;
  min-width:250px;
  background:#fff;
  color:var(--ink);
  border-radius:14px;
  padding:8px;
  box-shadow:0 20px 45px rgba(10,35,70,.20);
  border:1px solid rgba(21,59,115,.10);
  opacity:0;
  visibility:hidden;
  transform:translateY(-6px);
  transition:.18s ease;
}
.dropdown-menu.is-open{opacity:1;visibility:visible;transform:translateY(0)}
.dropdown-menu a{
  display:block;padding:12px 14px;border-radius:10px;color:var(--navy);font-weight:600;transition:.18s ease
}
.dropdown-menu a:hover,
.dropdown-menu a:focus-visible{
  background:var(--navy);color:#fff;transform:translateX(2px)
}
.menu-toggle{display:none;background:transparent;border:0;color:#fff;width:44px;height:44px;padding:8px}
.menu-toggle span{display:block;height:2px;background:currentColor;margin:6px 0;border-radius:2px}

.hero{
  position:relative;
  height:510px;
  min-height:500px;
  max-height:520px;
  overflow:hidden;
  background:var(--navy-dark);
}
.hero-slide{
  position:absolute;inset:0;
  background-image:var(--bg);
  background-size:cover;
  background-position:center;
  opacity:0;
  transform:scale(1.015);
  transition:opacity .8s ease, transform 6s ease;
}
.hero-slide[data-slide="0"]{background-position:32% center}
.hero-slide[data-slide="1"]{background-position:30% center}
.hero-slide[data-slide="2"]{background-position:25% center}
.hero-slide.is-active{opacity:1;transform:scale(1)}
.hero-shade{
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(8,30,60,.72) 0%,rgba(8,30,60,.48) 34%,rgba(8,30,60,.12) 68%,rgba(8,30,60,0) 100%);
}
.hero-copy{
  position:relative;
  z-index:2;
  height:100%;
  display:flex;
  align-items:center;
  padding-left:clamp(24px,4vw,64px);
  padding-right:24px;
}
.hero-copy h1,.hero-copy h2{
  margin:0;
  color:#fff;
  font-weight:720;
  letter-spacing:-.02em;
  line-height:1.2;
  text-wrap:balance;
  text-shadow:0 10px 28px rgba(0,0,0,.28);
}
/* Safe text zone tuned per slide (measured against each photo's vehicle position) so the
   headline never overlaps the vehicle, at any viewport width. */
.hero-slide[data-slide="0"] .hero-copy h1{max-width:min(33vw,480px);font-size:clamp(30px,2.6vw,42px)}
.hero-slide[data-slide="1"] .hero-copy h2{max-width:min(26vw,400px);font-size:clamp(28px,2.2vw,38px)}
.hero-slide[data-slide="2"] .hero-copy h2{max-width:min(32vw,460px);font-size:clamp(28px,2.5vw,42px)}
.hero-arrow{
  position:absolute;top:50%;z-index:4;
  width:48px;height:48px;border-radius:50%;
  border:1px solid rgba(255,255,255,.45);
  background:rgba(6,28,56,.18);
  color:#fff;
  display:grid;place-items:center;
  cursor:pointer;
  transform:translateY(-50%);
  backdrop-filter:blur(7px);
  transition:.2s ease;
}
.hero-arrow:hover{background:rgba(21,59,115,.82);border-color:transparent;transform:translateY(-50%) scale(1.04)}
.hero-arrow svg{width:24px;height:24px}
.hero-prev{left:28px}.hero-next{right:28px}
.hero-pagination{
  position:absolute;z-index:4;left:50%;bottom:28px;transform:translateX(-50%);
  display:flex;align-items:flex-end;gap:9px;
  padding:8px 10px;border-radius:999px;
  background:rgba(6,28,56,.18);
  backdrop-filter:blur(8px);
}
.hero-dot{
  width:54px;height:34px;border:0;background:transparent;color:rgba(255,255,255,.62);
  cursor:pointer;position:relative;padding:0;transition:.2s ease
}
.hero-dot::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;background:rgba(255,255,255,.28)
}
.hero-dot.is-active{color:#fff}
.hero-dot.is-active::after{background:#fff;height:3px}
.hero-dot span{font-size:12px;font-weight:700;letter-spacing:.12em}

.business-lines{background:#fff;border-bottom:1px solid var(--line)}
.business-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.business-link{
  min-height:120px;
  display:grid;
  grid-template-columns:44px 1fr 28px;
  gap:18px;
  align-items:center;
  padding:28px 34px;
  border-right:1px solid var(--line);
  transition:.2s ease;
}
.business-link:last-child{border-right:0}
.business-link:hover,
.business-link:focus-visible{
  position:relative;
  z-index:1;
  background:var(--navy);
  color:#fff;
  box-shadow:0 16px 32px rgba(21,59,115,.22);
  transform:translateY(-3px);
}
.business-icon{
  width:52px;height:52px;border-radius:15px;
  display:grid;place-items:center;
  color:var(--navy);
  background:linear-gradient(145deg,#F7FAFE,#EAF1F8);
  border:1px solid rgba(21,59,115,.10);
  box-shadow:0 8px 20px rgba(21,59,115,.08);
  transition:.2s ease;
}
.business-link:hover .business-icon,
.business-link:focus-visible .business-icon{
  color:#fff;
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.28);
  box-shadow:none;
}
.business-icon svg{height:30px;width:auto}
.business-link>span:nth-child(2){font-weight:720;font-size:18px;letter-spacing:-.02em}
.link-arrow{width:22px;height:22px;color:#7B8797;transition:.2s ease}
.business-link:hover .link-arrow,
.business-link:focus-visible .link-arrow{
  transform:translateX(4px);
  color:#fff;
}

.why-coverans{padding:60px 0 62px;background:var(--soft)}
.eyebrow{
  margin:0 0 28px;
  color:var(--navy);
  font-weight:800;
  font-size:13px;
  letter-spacing:.16em;
}
.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.pillar{
  position:relative;
  min-height:225px;
  padding:28px 24px 24px;
  background:#fff;
  border:1px solid rgba(21,59,115,.10);
  border-radius:var(--radius);
  box-shadow:0 8px 22px rgba(28,58,93,.045);
  transition:.25s ease;
}
.pillar:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:rgba(21,59,115,.22)}
.pillar-number{
  position:absolute;right:20px;top:15px;
  font-size:38px;font-weight:800;color:rgba(21,59,115,.07);letter-spacing:-.05em
}
.pillar-icon{
  width:54px;height:54px;border-radius:14px;
  display:grid;place-items:center;
  background:#EEF3F9;color:var(--navy);
  margin-bottom:22px;
}
.pillar-icon svg{height:32px;width:auto}
.pillar h3{margin:0 0 9px;font-size:19px;letter-spacing:-.02em}
.pillar p{margin:0;color:#4A5870;font-weight:500;font-size:14px;line-height:1.55;max-width:24ch}

.closing-band{
  background:var(--navy-dark);
  color:#fff;
  min-height:90px;
  display:flex;
  align-items:center;
}
.closing-inner{display:flex;align-items:center;justify-content:space-between;gap:24px}
.closing-inner p{margin:0;font-size:18px;font-weight:650;letter-spacing:-.015em}
.socials{display:flex;align-items:center;gap:10px}
.socials a{
  width:40px;height:40px;border-radius:50%;
  display:grid;place-items:center;
  border:1px solid rgba(255,255,255,.28);
  color:#fff;
  transition:.2s ease;
}
.socials a:hover,.socials a:focus-visible{background:#fff;color:var(--navy-dark);transform:translateY(-2px)}
.socials svg{width:21px;height:21px;stroke-width:1.8}

.reveal{opacity:0;transform:translateY(14px)}
.reveal.is-visible{opacity:1;transform:translateY(0);transition:opacity .55s ease,transform .55s ease}

@media (max-width:920px){
  :root{--header-h:78px}
  .brand{min-width:0}.brand img{width:180px}
  .menu-toggle{display:block}
  .main-nav{
    position:absolute;top:100%;left:0;right:0;
    background:var(--navy-dark);
    padding:14px 20px 22px;
    display:none;flex-direction:column;align-items:stretch;
    box-shadow:0 20px 32px rgba(0,0,0,.18)
  }
  .main-nav.is-open{display:flex}
  .nav-link{justify-content:space-between;width:100%;padding-inline:14px}
  .nav-dropdown{width:100%}
  .dropdown-menu{position:static;min-width:0;margin-top:4px;box-shadow:none;border:0;background:rgba(255,255,255,.06);color:#fff;display:none;opacity:1;visibility:visible;transform:none}
  .dropdown-menu.is-open{display:block}
  .dropdown-menu a{color:rgba(255,255,255,.86)}
  .dropdown-menu a:hover{background:rgba(255,255,255,.08);color:#fff}
  .hero{height:430px;min-height:420px;max-height:440px}
  .hero-slide[data-slide="0"] .hero-copy h1{max-width:min(35vw,300px);font-size:clamp(26px,3.2vw,32px)}
  .hero-slide[data-slide="1"] .hero-copy h2{max-width:min(26vw,250px);font-size:clamp(23px,2.7vw,28px)}
  .hero-slide[data-slide="2"] .hero-copy h2{max-width:min(32vw,300px);font-size:clamp(23px,3vw,31px)}
  .hero-prev{left:16px}.hero-next{right:16px}
  .business-grid{grid-template-columns:1fr}
  .business-link{border-right:0;border-bottom:1px solid var(--line);min-height:92px;padding:20px 8px}
  .business-link:last-child{border-bottom:0}
  .pillars{grid-template-columns:repeat(2,1fr)}
  /* Ajuste específico Tablet: en el extremo más angosto (~601px) la posición de Desktop
     recortaba el borde derecho de la Sprinter/pasajeros. Se recalculó para esta franja. */
  .hero-slide[data-slide="2"]{background-position:60% center}
}
@media (max-width:600px){
  .section-shell{width:min(100% - 32px,1180px)}
  .header-inner{width:calc(100% - 28px)}
  .brand img{width:160px}
  .hero{
    min-height:380px;height:390px;max-height:400px;
  }
  /* Encuadre específico Mobile por lámina: en pantallas angostas y verticales, la posición
     de Desktop dejaba fuera gran parte del vehículo. Se recalculó el punto focal de cada
     foto para que el vehículo principal de cada línea de negocio quede completo o casi
     completo, sin estirar ni deformar la imagen (mismo background-size:cover). */
  .hero-slide[data-slide="0"]{background-position:53% center}
  .hero-slide[data-slide="1"]{background-position:42% center}
  .hero-slide[data-slide="2"]{background-position:74% center}
  .hero-shade{background:linear-gradient(90deg,rgba(8,30,60,.78),rgba(8,30,60,.3))}
  .hero-copy{align-items:flex-end;padding-bottom:64px;padding-left:20px}
  .hero-copy h1,.hero-copy h2{line-height:1.22;text-shadow:0 8px 22px rgba(0,0,0,.35)}
  .hero-slide[data-slide="0"] .hero-copy h1{max-width:min(40vw,230px);font-size:clamp(22px,5.6vw,26px)}
  .hero-slide[data-slide="1"] .hero-copy h2{max-width:min(30vw,190px);font-size:clamp(20px,4.6vw,23px)}
  .hero-slide[data-slide="2"] .hero-copy h2{max-width:min(38vw,220px);font-size:clamp(20px,4.8vw,24px)}
  .hero-arrow{width:42px;height:42px;top:auto;bottom:16px;transform:none}
  .hero-arrow:hover{transform:scale(1.04)}
  .hero-prev{left:16px}.hero-next{right:16px}
  .hero-pagination{bottom:18px}
  .business-link{grid-template-columns:40px 1fr 22px;gap:14px}
  .business-link>span:nth-child(2){font-size:17px}
  .why-coverans{padding:44px 0}
  .pillars{grid-template-columns:1fr}
  .pillar{min-height:0}
  .closing-band{padding:18px 0}
  .closing-inner{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}
