/* Alliante Group — comportamiento responsive
   ------------------------------------------------------------------
   Las páginas están maquetadas con estilos inline, que no admiten media
   queries: por eso cada regla selecciona por el patrón inline y usa !important.

   Cada selector se escribe en sus dos formas —sin espacio y con espacio— para
   tolerar cualquier normalización del inline style por parte del navegador o
   de un plugin de optimización.

   Breakpoints: 1080px · 900px · 640px · 420px
   ------------------------------------------------------------------ */

/* ---------- BASE ---------- */
html { -webkit-text-size-adjust: 100%; }
img, svg, iframe { max-width: 100%; }

/* Menú móvil (lo construye nav-mobile.js a partir del menú de escritorio) */
.al-burger {
  display: none;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  flex: none;
  padding: 0;
  border: 1.5px solid currentColor;
  border-radius: 12px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  opacity: 0.7;
}
.al-burger span {
  display: block;
  width: 17px;
  height: 1.8px;
  background: currentColor;
  border-radius: 2px;
  transition: transform 0.22s ease, opacity 0.18s ease;
}
.al-burger span + span { margin-top: 4px; }
.al-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(5.8px) rotate(45deg); }
.al-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.al-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-5.8px) rotate(-45deg); }

.al-mobile-menu { display: none; border-top: 1px solid rgba(128, 128, 128, 0.16); }
.al-mobile-menu[data-open="true"] { display: block; }
.al-mobile-menu nav {
  display: flex;
  flex-direction: column;
  max-width: 1320px;
  margin: 0 auto;
  padding: 6px 20px 16px;
}
.al-mobile-menu a {
  padding: 14px 2px;
  font-size: 17px;
  font-weight: 600;
  border-bottom: 1px solid rgba(128, 128, 128, 0.14);
}
.al-mobile-menu a:last-child { border-bottom: none; }


/* ================= ≤ 1080px — tablet grande ================= */
@media (max-width: 1080px) {
  /* Cuatro columnas de cifras y el pie pasan a dos */
  [style*="grid-template-columns:repeat(4,1fr);"],
  [style*="grid-template-columns: repeat(4, 1fr);"],
  [style*="grid-template-columns:1.6fr 1fr 1fr 1fr;"],
  [style*="grid-template-columns: 1.6fr 1fr 1fr 1fr;"] {
    grid-template-columns: 1fr 1fr !important;
    gap: 32px !important;
  }

  /* Márgenes laterales algo más ajustados */
  [style*="max-width:1320px"],
  [style*="max-width: 1320px"] {
    padding-left: 22px !important;
    padding-right: 22px !important;
  }
}


/* ================= ≤ 900px — tablet y móvil ================= */
@media (max-width: 900px) {
  /* --- Todo layout de dos columnas se apila --- */
  [style*="grid-template-columns:0.9fr 1.1fr;"],  [style*="grid-template-columns: 0.9fr 1.1fr;"],
  [style*="grid-template-columns:1.1fr 0.9fr;"],  [style*="grid-template-columns: 1.1fr 0.9fr;"],
  [style*="grid-template-columns:1.15fr 0.85fr;"],[style*="grid-template-columns: 1.15fr 0.85fr;"],
  [style*="grid-template-columns:0.85fr 1.15fr;"],[style*="grid-template-columns: 0.85fr 1.15fr;"],
  [style*="grid-template-columns:0.8fr 1.2fr;"],  [style*="grid-template-columns: 0.8fr 1.2fr;"],
  [style*="grid-template-columns:1.2fr 1fr;"],    [style*="grid-template-columns: 1.2fr 1fr;"],
  [style*="grid-template-columns:1.4fr 1fr;"],    [style*="grid-template-columns: 1.4fr 1fr;"],
  [style*="grid-template-columns:1fr 1fr;"],      [style*="grid-template-columns: 1fr 1fr;"],
  [style*="grid-template-columns:1fr 1fr 1fr;"],  [style*="grid-template-columns: 1fr 1fr 1fr;"] {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }

  /* Tres columnas de tarjetas pasan a dos */
  [style*="grid-template-columns:repeat(3,1fr);"],
  [style*="grid-template-columns: repeat(3, 1fr);"] {
    grid-template-columns: 1fr 1fr !important;
  }

  /* Una columna fija deja de tener sentido cuando el bloque se apila */
  [style*="top:110px"], [style*="top: 110px"] { position: static !important; }

  /* Imágenes verticales: menos altas al ocupar todo el ancho */
  [style*="aspect-ratio:4/5"],  [style*="aspect-ratio: 4 / 5"]  { aspect-ratio: 4 / 3 !important; }
  [style*="aspect-ratio:21/7"], [style*="aspect-ratio: 21 / 7"],
  [style*="aspect-ratio:21/9"], [style*="aspect-ratio: 21 / 9"],
  [style*="aspect-ratio:21/8"], [style*="aspect-ratio: 21 / 8"] { aspect-ratio: 16 / 9 !important; }
  [style*="min-height:420px"],  [style*="min-height: 420px"] { min-height: 260px !important; }
  [style*="min-height:400px"],  [style*="min-height: 400px"] { min-height: 240px !important; }
  [style*="min-height:320px"],  [style*="min-height: 320px"] { min-height: 220px !important; }

  /* Menos aire vertical */
  [style*="padding:96px 28px"], [style*="padding: 96px 28px"],
  [style*="padding:100px 0"],   [style*="padding: 100px 0"],
  [style*="padding:96px 0"],    [style*="padding: 96px 0"] {
    padding-top: 64px !important;
    padding-bottom: 64px !important;
  }
  [style*="padding:80px 28px"], [style*="padding: 80px 28px"] { padding-top: 56px !important; }
  [style*="margin:96px auto"],  [style*="margin: 96px auto"] { margin-top: 64px !important; margin-bottom: 64px !important; }
  [style*="margin:0 auto 96px"],[style*="margin: 0px auto 96px"] { margin-bottom: 64px !important; }

  /* Navegación: enlaces de escritorio fuera, hamburguesa dentro */
  .al-desktop-nav { display: none !important; }
  .al-burger { display: inline-flex; flex-direction: column; }
  nav [style*="gap:34px"], nav [style*="gap: 34px"] { gap: 12px !important; }
  nav [style*="gap:18px"], nav [style*="gap: 18px"] { gap: 12px !important; }

  /* El pie se mantiene en dos columnas hasta el móvil */
  [style*="grid-template-columns:1.6fr 1fr 1fr 1fr;"],
  [style*="grid-template-columns: 1.6fr 1fr 1fr 1fr;"] {
    grid-template-columns: 1fr 1fr !important;
  }
}


/* ================= ≤ 640px — móvil ================= */
@media (max-width: 640px) {
  /* Ya no caben dos tarjetas por fila */
  [style*="grid-template-columns:repeat(3,1fr);"],  [style*="grid-template-columns: repeat(3, 1fr);"],
  [style*="grid-template-columns:repeat(4,1fr);"],  [style*="grid-template-columns: repeat(4, 1fr);"],
  [style*="grid-template-columns:1.6fr 1fr 1fr 1fr;"], [style*="grid-template-columns: 1.6fr 1fr 1fr 1fr;"],
  [style*="minmax(280px,1fr)"], [style*="minmax(280px, 1fr)"] {
    grid-template-columns: 1fr !important;
  }

  /* Márgenes laterales de móvil */
  [style*="max-width:1320px"], [style*="max-width: 1320px"],
  [style*="max-width:1040px"], [style*="max-width: 1040px"],
  [style*="max-width:820px"],  [style*="max-width: 820px"],
  [style*="max-width:720px"],  [style*="max-width: 720px"] {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  /* Texto de apoyo (los títulos ya usan clamp) */
  [style*="font-size:21px"], [style*="font-size: 21px"],
  [style*="font-size:20px"], [style*="font-size: 20px"],
  [style*="font-size:19px"], [style*="font-size: 19px"],
  [style*="font-size:18.5px"], [style*="font-size: 18.5px"] { font-size: 17px !important; }
  [style*="font-size:17px;line-height:1.6"], [style*="font-size: 17px; line-height: 1.6"] { font-size: 16px !important; }

  /* Tarjetas: menos relleno, más ancho de lectura */
  [style*="padding:44px"],      [style*="padding: 44px"]        { padding: 26px !important; }
  [style*="padding:32px"],      [style*="padding: 32px"]        { padding: 24px !important; }
  [style*="padding:34px 30px"], [style*="padding: 34px 30px"]   { padding: 26px 22px !important; }
  [style*="padding:30px 26px"], [style*="padding: 30px 26px"]   { padding: 24px 20px !important; }
  [style*="padding:26px 24px"], [style*="padding: 26px 24px"]   { padding: 22px 20px !important; }

  /* Tarjetas de división: menos altas en una sola columna */
  [style*="aspect-ratio:3/4"],  [style*="aspect-ratio: 3 / 4"]  { aspect-ratio: 4 / 3.8 !important; }
  [style*="aspect-ratio:16/8"], [style*="aspect-ratio: 16 / 8"],
  [style*="aspect-ratio:21/8"], [style*="aspect-ratio: 21 / 8"] { aspect-ratio: 4 / 3 !important; }

  /* Filas de cifras y de botones */
  [style*="gap:40px"], [style*="gap: 40px"] { flex-wrap: wrap !important; gap: 20px !important; }
  [style*="flex-wrap:wrap;gap:14px"] > a,
  [style*="flex-wrap: wrap; gap: 14px"] > a { flex: 1 1 100% !important; justify-content: center !important; }

  /* Botones anchos del CTA: que el correo no se salga */
  [style*="justify-content:space-between"][href^="mailto"],
  [style*="justify-content: space-between"][href^="mailto"] { font-size: 15px !important; padding: 15px 20px !important; }

  /* La tira de cifras se ve mejor en 2×2 que apilada */
  .al-stats { grid-template-columns: 1fr 1fr !important; gap: 26px 20px !important; }

  /* Rótulo de división junto al logo (Abogados / Inmobiliarios / Acero):
     en teléfono se oculta para que el header respire igual en todo el sitio */
  nav [style*="gap:18px"] > span,
  nav [style*="gap: 18px"] > span { display: none !important; }

  /* Letra capital de los artículos */
  [style*="font-size:52px"][style*="float:left"],
  [style*="font-size: 52px"][style*="float: left"] { font-size: 40px !important; margin-right: 10px !important; }

  blockquote { padding-left: 18px !important; }
}


/* ================= ≤ 640px — cabecera de teléfono =================
   En un teléfono no caben cuatro cosas en la barra: logo, selector de idioma,
   botón "Hablemos" y hamburguesa. El botón se oculta —nav-mobile.js ya lo
   copia dentro del menú desplegable, así que no se pierde— y así el logo
   recupera el sitio que necesita para leerse. */
@media (max-width: 640px) {
  nav[style*="padding:16px 28px"], nav[style*="padding: 16px 28px"] { padding: 12px 18px !important; }
  header > nav a.al-cta { display: none !important; }
  [data-al-lang] { padding: 6px 10px !important; }
}

/* ================= ≤ 420px — pantallas muy angostas ================= */
@media (max-width: 420px) {
  nav img[src*="alliante_logo"], nav img.al-logo { height: 26px !important; }
  [data-al-lang] { padding: 6px 9px !important; font-size: 12px !important; }
  .al-burger { width: 38px; height: 38px; }
}