/* Ajustes compartidos del sitio: menú, contacto móvil y footer. */

/* El CTA no se comprime ni se parte mientras el menú todavía cabe completo. */
.pill .cta,
.pill .pay,
.pill .portal {
  flex-shrink: 0;
  white-space: nowrap;
}

/* Misma proporción de cierre que el menú de Propiedades. */
.pill { gap:20px; padding:0 10px 0 30px; }
.pill nav { gap:20px; font-size:.9rem; }
.pill .cta { display:inline-flex; align-items:center; gap:7px; padding:9px 18px; font-size:.86rem; }

@media (max-width: 1180px) and (min-width: 1041px) {
  .pill { gap: 12px; padding-left: 14px; }
  .pill nav { gap: 12px; font-size: .84rem; }
  .pill .pay, .pill .portal { padding-left: 10px; padding-right: 10px; font-size: .8rem; }
  .pill .cta { padding-left: 13px; padding-right: 13px; font-size: .84rem; }
}

/* En espacios estrechos pasa limpiamente a logo + hamburguesa. */
@media (max-width: 1040px) {
  .pill nav, .pill .pay, .pill .portal, .pill .cta { display: none; }
  .pill { width: 100%; justify-content: space-between; border-radius: 16px; padding: 10px 12px 10px 18px; }
  .burger { display: flex; }
}

/* La tarjeta de canales ocupa el ancho útil del teléfono sin quedar encajonada. */
@media (max-width: 1020px) {
  .chan-grid { width: 100%; max-width: 680px; }
  .chan { width: 100%; }
}

@media (max-width: 560px) {
  .chan { padding: 24px 18px 22px; }
  .chan .promise b { font-size: 1.48rem; }
}

/* Formulario de llamado: aprovecha el ancho útil del dispositivo. */
.cbform { width: 100%; max-width: 820px; }
@media (max-width: 560px) {
  .cbform { padding: 22px 18px; }
}

/* Footer: el logo gana presencia y cada columna queda visualmente contenida. */
.ft .legalbar img.logo { height: 50px; }
.ft .grid > .lk,
.ft .grid > div:last-child {
  min-height: 100%;
  padding: 20px 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fbfdfe;
}
.footer-more-contact { display:inline-flex; align-items:center; gap:8px; margin-top:4px; color:var(--accent); font-size:.9rem; font-weight:800; }
.footer-more-contact:hover { color:var(--deep); }
.ft .grid { align-items:stretch; }
.ft .ctabox { height:100%; }
.ft .contact-item .fa-whatsapp { color:#25D366; }
.footer-more-contact .ic { width:30px; height:30px; margin:0; border-radius:8px; background:#f2fafc; color:var(--accent); display:grid; place-items:center; flex-shrink:0; font-size:.82rem; }
.footer-more-contact { white-space:nowrap; }

/* Contraste del ícono grande de inicio en las rutas de diferenciadores.
   Algunas páginas no llevan la clase start, por eso apuntamos al bloque visual. */
.milestone .mm {
  background:linear-gradient(135deg,#eaf8fb,#cdeff5);
  color:#07566e;
}
.milestone .mm .fa-duotone {
  --fa-primary-color:#07566e;
  --fa-secondary-color:#62c5d8;
  --fa-primary-opacity:1;
  --fa-secondary-opacity:.55;
}

/* Los íconos numerados deben separarse visualmente del círculo blanco. */
.st .dot {
  background:#fff;
}
.st .dot .fa-duotone {
  --fa-primary-color:#07566e;
  --fa-secondary-color:#b9e9f3;
  --fa-primary-opacity:1;
  --fa-secondary-opacity:.5;
}

@media (max-width: 560px) {
  .ft .grid > .lk,
  .ft .grid > div:last-child { padding: 18px 16px; }
  .ft .legalbar img.logo { height: 46px; }
  /* El bloque azul queda como un borde estrecho y el formulario usa todo el ancho. */
  .cta-final { margin-left:-24px; margin-right:-24px; border-radius:0; padding-left:12px; padding-right:12px; }
}