:root{
  --azul-noche:#173E6B;
  --azul:#1F5A99;
  --azul-claro:#5B8FC7;
  --azul-banda:#1D4877;
  --gris-logo:#8D8B86;
  --fondo:#F3F5F7;
  --tinta:#14202E;
  --texto:#3D4855;
  --texto-suave:#5A6470;
  --linea:#DDE3EA;
  --pie:#14202E;
  --display:'Archivo','Arial Narrow',sans-serif;
  --cuerpo:'Source Sans 3','Segoe UI',system-ui,sans-serif;
  --margen:clamp(20px,5.5vw,80px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--fondo);color:var(--tinta);font-family:var(--cuerpo);font-size:18px;line-height:1.55}
img{max-width:100%;height:auto}
a{color:var(--azul)}a:hover{color:var(--azul-noche)}
:focus-visible{outline:3px solid #F2A541;outline-offset:3px}
h1,h2,h3{font-family:var(--display);margin:0}
p{margin:0}
.contenedor{max-width:1440px;margin:0 auto;padding-left:var(--margen);padding-right:var(--margen)}
.saltar{position:absolute;left:-999px;top:8px;background:#fff;padding:10px 16px;z-index:10}
.saltar:focus{left:8px}

/* Botones */
.boton{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 28px;border-radius:4px;font-weight:700;text-decoration:none;border:2px solid transparent;font-size:17px;cursor:pointer;font-family:var(--cuerpo)}
.boton-primario{background:var(--azul);color:#fff}
.boton-primario:hover{background:var(--azul-noche);color:#fff}
.boton-contorno{border-color:var(--azul-noche);color:var(--azul-noche)}
.boton-contorno:hover{background:var(--azul-noche);color:#fff}
.boton-blanco{background:#fff;color:var(--azul-noche)}
.boton-blanco:hover{background:#E6EEF7;color:var(--azul-noche)}

/* Encabezado */
.encabezado{background:#fff;border-bottom:1px solid var(--linea);position:sticky;top:0;z-index:5}
.encabezado .contenedor{display:flex;align-items:center;justify-content:space-between;min-height:84px;gap:24px}
.marca{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--tinta)}
.marca img{height:58px;width:auto}
.marca-texto{display:flex;flex-direction:column;line-height:1.1}
.marca-nombre{font-family:var(--display);font-stretch:125%;font-weight:800;font-size:25px;color:var(--azul);letter-spacing:.02em}
.marca-sub{font-size:14px;color:var(--texto-suave)}
.menu{display:flex;align-items:center;gap:32px;font-weight:600;font-size:17px}
.menu a{color:var(--tinta);text-decoration:none}
.menu a:hover{color:var(--azul)}
.menu .boton{color:#fff}
.boton-menu{display:none;width:48px;height:48px;align-items:center;justify-content:center;border:1px solid var(--linea);border-radius:4px;background:#fff;color:var(--azul-noche);cursor:pointer}

/* Portada */
.portada{position:relative;background:#fff;overflow:hidden}
.portada-cuerpo{position:relative;min-height:560px;padding-top:88px;padding-bottom:72px}
.portada-texto{position:relative;z-index:2;max-width:720px;display:flex;flex-direction:column;gap:26px}
.portada h1{font-stretch:112%;font-weight:800;font-size:clamp(38px,5vw,66px);line-height:1.04;letter-spacing:-.01em;color:var(--azul-noche)}
.portada-texto p{font-size:21px;color:var(--texto);max-width:600px}
.acciones{display:flex;gap:16px;flex-wrap:wrap}
.bandas{position:absolute;right:-60px;top:56px;width:min(44vw,620px);height:420px;z-index:1}
.banda{position:absolute;left:0;right:0;height:120px;transform:skewY(-9deg);display:flex;align-items:center;justify-content:center;color:#fff}
.banda svg{width:84px;height:84px}
.banda-1{top:0;background:var(--azul-claro)}
.banda-2{top:140px;background:var(--azul)}
.banda-3{top:280px;background:var(--azul-claro)}
.banda svg{transform:skewY(9deg)}
.banda-2 svg{transform:skewY(9deg) rotate(-9deg) scaleX(-1)}
.banda-3 svg{transform:skewY(9deg) rotate(-9deg)}
.franja{background:var(--azul-noche);color:#fff}
.franja ul{list-style:none;margin:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr))}
.franja li{border-right:1px solid #2D5584}
.franja li:last-child{border-right:0}
.franja a{display:flex;flex-direction:column;justify-content:center;gap:2px;min-height:120px;padding:0 20px;color:#fff;text-decoration:none}
.franja li:first-child a{padding-left:0}
.franja a:hover{background:#1B4678}
.franja strong{font-family:var(--display);font-weight:700;font-size:20px}
.franja span{font-size:15px;color:#C9D8EA}

/* Secciones */
.seccion{padding-top:112px;padding-bottom:112px}
.seccion h2{font-stretch:112%;font-weight:800;font-size:clamp(30px,3.4vw,46px);line-height:1.1;color:var(--azul-noche)}
.seccion-cabeza{display:flex;justify-content:space-between;align-items:flex-end;gap:40px 80px;margin-bottom:56px;flex-wrap:wrap}
.seccion-cabeza h2{max-width:620px}
.seccion-cabeza p{max-width:540px;color:var(--texto)}

/* Servicios */
.servicios{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;background:var(--linea);border:2px solid var(--linea)}
.servicio{background:#fff;padding:40px 36px;display:flex;flex-direction:column;gap:14px}
.servicio h3{font-weight:700;font-size:24px}
.servicio p{color:var(--texto)}

/* Aduanas */
.aduanas{background:var(--azul-noche);color:#fff}
.aduanas h2{color:#fff}
.aduanas .seccion-cabeza p{color:#C9D8EA}
.fichas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.ficha{background:#fff;color:var(--tinta);padding:36px 32px;display:flex;flex-direction:column;gap:16px;border-top:8px solid var(--azul-claro)}
.ficha.terrestre{border-top-color:var(--gris-logo)}
.ficha.aerea{border-top-color:var(--azul)}
.ficha h3{font-weight:800;font-size:26px;line-height:1.15;color:var(--azul-noche)}
.ficha .estado{font-size:16px;color:var(--texto-suave)}
.ficha p{font-size:17px;color:var(--texto)}
.ficha .cotizar{margin-top:auto;padding-top:16px;border-top:1px solid var(--linea);font-size:17px;font-weight:700}
.cobertura{margin-top:24px;display:flex;align-items:center;gap:32px;padding:36px 40px;border:1px solid #3F6896;background:var(--azul-banda)}
.cobertura svg{flex-shrink:0}
.cobertura div{flex-grow:1;display:flex;flex-direction:column;gap:6px}
.cobertura h3{font-weight:800;font-size:26px;color:#fff}
.cobertura p{color:#C9D8EA;max-width:760px}
.cobertura .boton{flex-shrink:0}

/* Proceso */
.pasos{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px}
.pasos li{display:flex;flex-direction:column;gap:12px;padding-top:24px;border-top:3px solid var(--azul)}
.pasos .numero{font-family:var(--display);font-weight:800;font-size:40px;color:var(--azul-claro);line-height:1}
.pasos h3{font-weight:700;font-size:22px}
.pasos p{color:var(--texto)}

/* Nosotros */
.nosotros{background:#fff}
.nosotros .contenedor{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:80px;align-items:center}
.nosotros-logo{display:flex;justify-content:center;align-items:center;background:var(--fondo);min-height:440px;padding:40px}
.nosotros-logo img{width:360px}
.nosotros-texto{display:flex;flex-direction:column;gap:22px}
.nosotros-texto p{color:var(--texto)}
.datos{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;padding-top:16px;border-top:1px solid var(--linea)}
.datos dt{font-size:15px;color:var(--texto-suave)}
.datos dd{margin:0;font-weight:700;font-size:20px}

/* Contacto */
.contacto .contenedor{display:grid;grid-template-columns:5fr 7fr;gap:80px}
.contacto-info{display:flex;flex-direction:column;gap:24px}
.contacto-info p{color:var(--texto)}
.medios{display:flex;flex-direction:column;gap:16px;font-size:20px;font-weight:600}
.medio{display:flex;gap:14px;align-items:flex-start}
.medio svg{flex-shrink:0;margin-top:3px}
.medio a{color:var(--tinta);text-decoration:none}
.medio a:hover{color:var(--azul)}
.medio a.correo{color:var(--azul);text-decoration:underline}
.medio .direccion{font-size:18px;font-weight:400;color:var(--texto)}
.formulario{background:#fff;padding:48px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;border:1px solid var(--linea)}
.formulario label.campo{display:flex;flex-direction:column;gap:8px;font-weight:600;font-size:16px}
.formulario input,.formulario select,.formulario textarea{font:inherit;font-weight:400;font-size:17px;min-height:52px;padding:0 14px;border:1px solid #9AA5B1;border-radius:4px;background:#fff;color:var(--tinta);width:100%}
.formulario textarea{padding:12px 14px;min-height:120px;resize:vertical}
.formulario .ancho{grid-column:1 / -1}
.acepto{display:flex;gap:12px;align-items:flex-start;font-size:16px;color:var(--texto)}
.acepto input{width:22px;height:22px;min-height:0;margin:2px 0 0;flex-shrink:0}
.formulario .boton{justify-self:start;min-height:56px;padding:0 36px;font-size:18px;border:0}
.oculto{position:absolute;left:-5000px}

/* Pie */
.pie{background:var(--pie);color:#C9D2DC;font-size:16px}
.pie .contenedor{padding-top:56px;padding-bottom:56px;display:flex;justify-content:space-between;align-items:flex-start;gap:40px;flex-wrap:wrap}
.pie-col{display:flex;flex-direction:column;gap:6px}
.pie-col strong{color:#fff}
.pie a{color:#C9D2DC}
.pie a:hover{color:#fff}
.pie .marca-nombre{color:#fff;font-size:24px}

/* Aviso de privacidad */
.aviso-cabeza{background:#fff;border-bottom:1px solid var(--linea);padding-top:72px;padding-bottom:56px}
.lectura{max-width:820px;margin:0 auto}
.aviso-cabeza h1{font-stretch:112%;font-weight:800;font-size:clamp(34px,4vw,52px);line-height:1.08;color:var(--azul-noche)}
.aviso-cabeza p{color:var(--texto-suave);margin-top:12px}
.aviso{padding-top:64px;padding-bottom:96px;line-height:1.6}
.aviso .lectura{display:flex;flex-direction:column;gap:44px}
.aviso .intro{font-size:20px;color:var(--texto)}
.aviso section{display:flex;flex-direction:column;gap:12px}
.aviso h2{font-weight:700;font-size:26px;color:var(--azul-noche)}
.aviso p,.aviso li{color:var(--texto)}
.aviso ul{margin:0;padding-left:24px;display:flex;flex-direction:column;gap:6px}

/* Página de gracias */
.gracias{min-height:60vh;display:flex;align-items:center;padding-top:96px;padding-bottom:96px}
.gracias .lectura{display:flex;flex-direction:column;gap:20px;align-items:flex-start}
.gracias h1{font-stretch:112%;font-weight:800;font-size:clamp(34px,4vw,52px);color:var(--azul-noche)}
.gracias p{color:var(--texto);font-size:20px}

/* Tableta */
@media (max-width:1100px){
  .bandas{opacity:.35;width:52vw}
  .franja ul{grid-template-columns:repeat(3,minmax(0,1fr))}
  .franja li:nth-child(3){border-right:0}
  .franja li:nth-child(-n+3){border-bottom:1px solid #2D5584}
  .franja li:nth-child(4) a{padding-left:0}
  .servicios,.fichas{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pasos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .contacto .contenedor,.nosotros .contenedor{grid-template-columns:1fr;gap:48px}
  .nosotros-logo{min-height:300px}
  .nosotros-logo img{width:260px}
}
/* Celular */
@media (max-width:760px){
  body{font-size:17px}
  .encabezado .contenedor{min-height:72px}
  .marca img{height:46px}
  .marca-sub{display:none}
  .boton-menu{display:inline-flex}
  .menu{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;gap:0;border-bottom:1px solid var(--linea);padding:8px var(--margen) 20px}
  .menu.abierto{display:flex}
  .menu a{padding:14px 0;border-bottom:1px solid var(--linea)}
  .menu .boton{margin-top:12px;border-bottom:0}
  .portada-cuerpo{padding-top:0;min-height:0;padding-bottom:40px}
  .bandas{position:relative;right:auto;top:auto;width:auto;height:200px;margin:0 calc(-1 * var(--margen)) 8px;opacity:1}
  .banda{height:48px;transform:skewY(-7deg)}
  .banda-1{top:24px}.banda-2{top:82px}.banda-3{top:140px}
  .banda svg{display:none}
  .portada-texto{gap:20px}
  .portada-texto p{font-size:18px}
  .acciones .boton{width:100%}
  .franja ul{grid-template-columns:repeat(2,minmax(0,1fr))}
  .franja li{border-right:1px solid #2D5584;border-bottom:1px solid #2D5584}
  .franja li:nth-child(2n){border-right:0}
  .franja li:nth-child(n+5){border-bottom:0}
  .franja a,.franja li:first-child a,.franja li:nth-child(4) a{padding:16px 20px;min-height:0}
  .franja strong{font-size:18px}
  .franja span{font-size:14px}
  .seccion{padding-top:56px;padding-bottom:56px}
  .seccion-cabeza{margin-bottom:28px;gap:16px}
  .servicios,.fichas,.pasos{grid-template-columns:1fr}
  .servicio{padding:24px 20px}
  .ficha{padding:24px 20px;gap:10px;border-top-width:6px}
  .ficha svg{display:none}
  .ficha h3{font-size:22px}
  .ficha .cotizar{border-top:0;padding-top:4px}
  .cobertura{flex-direction:column;align-items:stretch;gap:12px;padding:24px 20px}
  .cobertura .boton{width:100%}
  .pasos{gap:24px}
  .datos{grid-template-columns:1fr}
  .formulario{grid-template-columns:1fr;padding:24px 20px;gap:18px}
  .formulario .boton{width:100%}
  .medios{font-size:18px}
  .pie .contenedor{flex-direction:column;gap:24px;padding-top:40px;padding-bottom:40px}
}
