/* Ajustes exclusivos feitos apos a separacao do site do gerador. */

/* WhatsApp flutuante: centralizado e com uma chamada visual continua. */
.floating-whatsapp {
  --whatsapp-bright: #25d366;
  --whatsapp-mid: #128c7e;
  --whatsapp-deep: #075e54;
  right: auto;
  left: 50%;
  bottom: 18px;
  background: linear-gradient(
    120deg,
    var(--whatsapp-deep) 0%,
    var(--whatsapp-mid) 27%,
    var(--whatsapp-bright) 50%,
    var(--whatsapp-mid) 73%,
    var(--whatsapp-deep) 100%
  );
  background-size: 280% 280%;
  box-shadow: 0 14px 32px rgba(7, 94, 84, 0.38);
  transform: translateX(-50%);
  animation:
    whatsapp-center-colors 4.8s ease-in-out infinite,
    whatsapp-center-pulse 2.2s ease-in-out infinite;
}

.floating-whatsapp::before {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(110deg, transparent 20%, rgba(255, 255, 255, 0.42) 48%, transparent 76%);
  content: "";
  pointer-events: none;
  transform: translateX(-130%);
  animation: whatsapp-center-shine 3.8s ease-in-out infinite;
}

.floating-whatsapp > * {
  position: relative;
  z-index: 1;
}

.floating-whatsapp:hover,
.floating-whatsapp:focus-visible {
  box-shadow: 0 21px 44px rgba(7, 94, 84, 0.48);
  transform: translateX(-50%) translateY(-4px) scale(1.02);
}

.floating-whatsapp__icon {
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.2);
}

.floating-whatsapp__icon svg {
  transform-origin: center;
  animation: whatsapp-center-icon 3.2s ease-in-out infinite;
}

.floating-whatsapp__icon::after,
.floating-whatsapp.is-compact .floating-whatsapp__icon::after {
  animation: whatsapp-center-ring 2s ease-out infinite;
}

@keyframes whatsapp-center-colors {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

@keyframes whatsapp-center-pulse {
  0%, 100% { box-shadow: 0 14px 32px rgba(7, 94, 84, 0.36), 0 0 0 0 rgba(37, 211, 102, 0.3); }
  50% { box-shadow: 0 18px 40px rgba(7, 94, 84, 0.48), 0 0 0 10px rgba(37, 211, 102, 0); }
}

@keyframes whatsapp-center-shine {
  0%, 58% { transform: translateX(-130%); }
  78%, 100% { transform: translateX(130%); }
}

@keyframes whatsapp-center-icon {
  0%, 55%, 100% { transform: rotate(0) scale(1); }
  62% { transform: rotate(-9deg) scale(1.08); }
  69% { transform: rotate(8deg) scale(1.12); }
  76% { transform: rotate(-5deg) scale(1.06); }
  83% { transform: rotate(0) scale(1); }
}

@keyframes whatsapp-center-ring {
  0% { opacity: 0.72; transform: scale(0.82); }
  70%, 100% { opacity: 0; transform: scale(1.48); }
}

/* Home: chamada compacta para produtos que nao aparecem nos cards principais. */
.other-insurance-cta {
  position: relative;
  width: 100%;
  height: clamp(176px, 16vw, 200px);
  max-height: 200px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 24px;
  background: #071f3b;
  box-shadow: 0 20px 46px rgba(7, 31, 59, 0.2);
  isolation: isolate;
}

.other-insurance-cta::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, rgba(7, 31, 59, 1) 0%, rgba(7, 31, 59, 0.98) 42%, rgba(7, 31, 59, 0.7) 60%, rgba(7, 31, 59, 0.05) 100%);
  content: "";
  pointer-events: none;
}

.other-insurance-cta__media {
  position: absolute;
  inset: 0;
  z-index: -2;
}

.other-insurance-cta__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right top;
  transform-origin: right top;
  transition: transform 600ms cubic-bezier(0.22, 1, 0.36, 1), filter 240ms ease;
}

@media (min-width: 681px) {
  .other-insurance-cta__media {
    right: 0;
    left: auto;
    width: 72%;
  }
}

.other-insurance-cta:hover .other-insurance-cta__media img {
  filter: saturate(1.05);
  transform: scale(1.025);
}

.other-insurance-cta__content {
  display: grid;
  width: min(62%, 650px);
  height: 100%;
  align-content: center;
  justify-items: start;
  gap: 7px;
  padding: 18px clamp(20px, 3vw, 38px);
  color: #fff;
}

.other-insurance-cta__eyebrow {
  color: #9fe1d4;
  font-size: 0.67rem;
  font-weight: 800;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.other-insurance-cta h3 {
  margin: 0;
  color: #fff;
  font-size: clamp(1.2rem, 2vw, 1.68rem);
  letter-spacing: -0.035em;
  line-height: 1.12;
}

.other-insurance-cta p {
  margin: 0;
  color: rgba(255, 255, 255, 0.8);
  font-size: clamp(0.72rem, 0.9vw, 0.86rem);
  line-height: 1.45;
}

.other-insurance-cta__button {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  gap: 8px;
  margin-top: 3px;
  border-radius: 999px;
  background: linear-gradient(135deg, #25d366, #128c7e);
  box-shadow: 0 9px 22px rgba(18, 140, 126, 0.32);
  color: #fff;
  font-size: 0.78rem;
  font-weight: 800;
  padding: 0 16px;
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.other-insurance-cta__button svg {
  width: 16px;
  height: 16px;
  transition: transform 180ms ease;
}

.other-insurance-cta__button:hover,
.other-insurance-cta__button:focus-visible {
  box-shadow: 0 12px 26px rgba(18, 140, 126, 0.44);
  color: #fff;
  outline: 2px solid rgba(255, 255, 255, 0.88);
  outline-offset: 3px;
  transform: translateY(-2px);
}

.other-insurance-cta__button:hover svg,
.other-insurance-cta__button:focus-visible svg {
  transform: translateX(3px);
}

/* CTA de WhatsApp exibido no hero das paginas de produto. */
body.product-page .product-hero__actions .button.button--secondary.whatsapp-link {
  border-color: rgba(255, 255, 255, 0.34);
  background: linear-gradient(135deg, #25d366 0%, #20bd67 34%, #128c7e 72%, #075e54 100%);
  background-position: 0 50%;
  background-size: 180% 180%;
  box-shadow: 0 14px 30px rgba(7, 94, 84, 0.3);
  color: #fff;
  text-shadow: 0 1px 2px rgba(3, 55, 48, 0.22);
  transition: background-position 260ms ease, border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

body.product-page .product-hero__actions .button.button--secondary.whatsapp-link:hover,
body.product-page .product-hero__actions .button.button--secondary.whatsapp-link:focus-visible {
  border-color: rgba(255, 255, 255, 0.68);
  background: linear-gradient(135deg, #25d366 0%, #20bd67 34%, #128c7e 72%, #075e54 100%);
  background-position: 100% 50%;
  background-size: 180% 180%;
  box-shadow: 0 18px 36px rgba(7, 94, 84, 0.38);
  color: #fff;
}

body.product-page .product-hero__actions .button.button--secondary.whatsapp-link svg {
  color: #fff;
}

/* Auditoria visual: preserva contraste nos paineis que receberam fundo escuro. */
body.product-page :is(.business-profile__core, .portable-devices__center) h3 {
  color: #fff;
}

body.product-page :is(.business-profile__core, .portable-devices__center) p {
  color: rgba(255, 255, 255, 0.78);
}

body.product-page :is(.business-profile__core, .portable-devices__center) li {
  color: rgba(255, 255, 255, 0.9);
}

body.product-page :is(.business-profile__core, .portable-devices__center) li svg {
  color: #9fe1d4;
}

/* Textos informativos e numeracoes que estavam pequenos demais para leitura. */
body.product-page :is(
  .consortium-balance small,
  .dental-member-card li,
  .dental-quote-card__status small,
  .dental-quote-card__items span,
  .tracker-device__status small,
  .tracker-quote-card > div > span,
  .accident-journey__questions small,
  .accident-quote-card > div small,
  .accident-quote-card > div strong,
  .guarantee-roles__core > span,
  .residential-map__home > small,
  .residential-map__home > span,
  .capitalization-link__core > span,
  .capitalization-flow__track article > span
) {
  font-size: 0.68rem;
}

body.product-page :is(
  .condo-renewal__steps,
  .business-plan__steps,
  .equipment-underwriting__steps,
  .portable-claim__steps,
  .product-flow-steps
) li > span {
  font-size: 0.7rem;
}

body.product-page :is(
  .condo-renewal__modes > p,
  .business-plan__warning,
  .equipment-underwriting__alert,
  .portable-claim__reality > p
) > span {
  font-size: 0.72rem;
  line-height: 1.55;
}

body.product-page .accident-quote-card > div strong {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}

@media (max-width: 680px) {
  .floating-whatsapp {
    right: auto;
    left: 50%;
    bottom: 12px;
  }

  .other-insurance-cta {
    height: 188px;
    border-radius: 20px;
  }

  .other-insurance-cta::after {
    background: linear-gradient(90deg, rgba(7, 31, 59, 1) 0%, rgba(7, 31, 59, 0.98) 56%, rgba(7, 31, 59, 0.65) 78%, rgba(7, 31, 59, 0.1) 100%);
  }

  .other-insurance-cta__content {
    width: 76%;
    gap: 8px;
    padding: 16px 18px;
  }

  .other-insurance-cta p {
    display: none;
  }

  /* Evita corte dos rotulos longos nos botoes finais dos produtos. */
  body.product-page .auto-quote-cta__actions .button {
    width: 100%;
    height: auto;
    min-width: 0;
    padding: 12px 14px;
    gap: 10px;
    white-space: normal;
  }

  body.product-page .auto-quote-cta__actions .button > span {
    min-width: 0;
    max-width: calc(100% - 32px);
    white-space: normal;
  }

  body.product-page .auto-quote-cta__actions .button :is(strong, small) {
    overflow-wrap: anywhere;
    white-space: normal;
  }

  /* Os tres indicadores odontologicos nao cabiam legiveis em colunas estreitas. */
  body.product-page .dental-quote-card__items {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.product-page .dental-quote-card__items span {
    min-width: 0;
  }

  body.product-page .dental-quote-card__items span:last-child {
    grid-column: 1 / -1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .floating-whatsapp,
  .floating-whatsapp::before,
  .floating-whatsapp__icon svg,
  .floating-whatsapp__icon::after,
  .floating-whatsapp.is-compact .floating-whatsapp__icon::after {
    animation: none !important;
  }
}
