/* Pagina de acceso para clientes - estilo empresarial */
*{box-sizing:border-box}
html,body{margin:0}
body{min-height:100vh;display:flex;flex-direction:column;background:#eef1f5;color:#1f2a37;
  font-family:"Segoe UI",Arial,Helvetica,sans-serif}
main{flex:1}

/* Cabecera */
.cab{background:#fff;border-bottom:4px solid #c8102e;box-shadow:0 1px 4px rgba(0,0,0,.15)}
.cab-in{max-width:1100px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;
  justify-content:space-between;gap:16px}
.cab img{display:block;height:42px;width:auto}
.cab-t{font-size:13px;letter-spacing:.6px;text-transform:uppercase;color:#52606f;text-align:right}

/* Banner */
.hero{padding:56px 20px 96px;text-align:center;color:#fff;
  background:linear-gradient(rgba(8,28,52,.70),rgba(8,28,52,.70)),url(img/icarobg.jpg) center/cover no-repeat #0b2a4a}
.hero h1{margin:0 0 10px;font-size:clamp(26px,4vw,38px);font-weight:600}
.hero p{margin:0 auto;max-width:560px;font-size:17px;color:#cfd9e6}

/* Accesos por pais */
.paises{position:relative;max-width:820px;margin:-60px auto 0;padding:0 20px;
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.pais{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:26px 24px;
  background:#fff;border-radius:12px;border-top:4px solid #c8102e;color:#1f2a37;text-decoration:none;
  box-shadow:0 8px 24px rgba(15,35,60,.18);transition:transform .18s ease,box-shadow .18s ease}
.pais:hover,.pais:focus-visible{transform:translateY(-3px);box-shadow:0 12px 28px rgba(15,35,60,.26)}
.pais:focus-visible{outline:3px solid #6495ed;outline-offset:3px}
.pais .ico{display:flex;align-items:center;justify-content:center;width:46px;height:46px;
  border-radius:50%;background:#eef2f7;color:#c8102e}
.pais .tit{font-size:21px;font-weight:700;color:#0b2a4a}
.pais .sub{font-size:14px;color:#52606f}
.pais .ir{margin-top:6px;padding:8px 20px;border-radius:6px;background:#0b2a4a;color:#fff;font-size:14px;font-weight:600}
.pais:hover .ir{background:#c8102e}

/* Pie de pagina */
.pie{margin-top:56px;background:#0b2a4a;color:#cfd9e6;border-top:4px solid #c8102e}
.pie-in{max-width:1100px;margin:0 auto;padding:28px 20px;display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;font-size:14px;line-height:1.7}
.pie h2{margin:0 0 6px;font-size:15px;color:#fff}
.pie a{color:#fff}

@media (max-width:640px){
  .paises,.pie-in{grid-template-columns:1fr}
  .cab-t{font-size:11px}
  .hero{padding:40px 16px 88px}
}
