/* ========================================================================== 
   CAMADA DE NAVEGACAO E CONSENTIMENTO
   Define prioridades claras no viewport: consentimento, menu e CTA mobile.
   ======================================================================= */

@media (max-width: 39.99rem) {
  /* No celular, o consentimento vira uma decisao inicial em modal para nao
     disputar o rodape com a barra fixa de agendamento. Acima deste breakpoint,
     continuam valendo as regras da barra desktop em consentimento.css. */
  .consent {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: grid;
    place-items: center;
    padding:
      max(1rem, env(safe-area-inset-top))
      max(1rem, env(safe-area-inset-right))
      max(1rem, env(safe-area-inset-bottom))
      max(1rem, env(safe-area-inset-left));
    overflow-y: auto;
    background: rgba(2, 16, 31, 0.68);
    -webkit-backdrop-filter: blur(10px) saturate(105%);
    backdrop-filter: blur(10px) saturate(105%);
    opacity: 0;
    visibility: hidden;
    transition: opacity 220ms ease, visibility 220ms ease;
  }

  .consent[hidden] {
    display: none;
  }

  .consent.is-visible {
    opacity: 1;
    visibility: visible;
  }

  .consent__caixa {
    width: min(100%, 34rem);
    max-width: none;
    margin: auto;
    padding: clamp(1.4rem, 5vw, 2rem);
    display: grid;
    gap: 1.35rem;
    border: 1px solid rgba(132, 190, 231, 0.28);
    border-radius: 1.75rem;
    background:
      radial-gradient(circle at 85% 0%, rgba(29, 111, 168, 0.2), transparent 42%),
      rgba(3, 24, 46, 0.97);
    box-shadow: 0 2rem 6rem rgba(0, 9, 22, 0.48);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    transform: translateY(1rem) scale(0.98);
    animation: none;
    transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
  }

  .consent.is-visible .consent__caixa {
    transform: none;
  }

  .consent__conteudo {
    display: grid;
    gap: 0.7rem;
  }

  .consent__titulo {
    color: #8cc8f4;
    font-size: clamp(1.15rem, 5vw, 1.45rem);
    font-weight: 750;
    line-height: 1.1;
    white-space: normal;
  }

  .consent__texto {
    max-width: 39ch;
    color: #e2edf7;
    font-size: clamp(0.98rem, 4.15vw, 1.1rem);
    line-height: 1.55;
  }

  .consent__acoes {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
  }

  .consent__btn {
    min-height: 3.25rem;
    border-radius: 999px;
    font-size: 0.98rem;
    font-weight: 750;
  }

  .consent__btn.btn--primary {
    color: #032d26;
    background: linear-gradient(115deg, #46e886, #27d96f);
  }

  body.consent-modal-open {
    overflow: hidden;
    touch-action: none;
  }

  body.consent-modal-open .mobile-global-cta {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }

  body {
    padding-bottom: calc(3.5rem + env(safe-area-inset-bottom));
  }

  /* Faixa funcional colada ao limite inferior, sem o volume de um segundo
     cartao flutuante sobre a pagina. */
  .mobile-global-cta.site-cta {
    inset: auto 0 0 0 !important;
    width: 100% !important;
    min-height: calc(3.5rem + env(safe-area-inset-bottom)) !important;
    padding: 0.85rem 1rem calc(0.85rem + env(safe-area-inset-bottom)) !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: 0 -0.55rem 1.7rem rgba(0, 82, 60, 0.2) !important;
    font-size: clamp(1rem, 4.5vw, 1.15rem) !important;
    letter-spacing: -0.02em;
    transition: opacity 180ms ease, visibility 180ms ease;
  }

  /* Depois da primeira leitura da Hero, a barra de marca recolhe e deixa um
     unico acionador circular sempre acessivel no canto superior direito. */
  .medic-nav {
    transition:
      width 220ms cubic-bezier(0.22, 1, 0.36, 1),
      height 220ms cubic-bezier(0.22, 1, 0.36, 1),
      padding 220ms ease,
      border-radius 220ms ease,
      background 220ms ease,
      box-shadow 220ms ease;
  }

  body.mobile-nav-compact > .medic-nav:not(.is-open) {
    position: fixed !important;
    z-index: 950 !important;
    top: max(0.75rem, env(safe-area-inset-top));
    left: auto;
    right: max(0.75rem, env(safe-area-inset-right));
    width: 3.5rem;
    height: 3.5rem;
    padding: 0;
    border-radius: 50%;
    background: rgba(240, 253, 253, 0.94);
    box-shadow:
      0 0.8rem 2rem rgba(3, 50, 69, 0.2),
      inset 0 1px 0 rgba(255, 255, 255, 0.95);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  body.mobile-nav-compact > .medic-nav:not(.is-open) .medic-nav__brand {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }

  body.mobile-nav-compact > .medic-nav:not(.is-open) .medic-nav__menu {
    width: 100%;
    height: 100%;
    border-radius: 50%;
  }

  body.mobile-nav-compact > .medic-nav:not(.is-open) .medic-nav__menu svg {
    width: 1.75rem;
    height: 1.75rem;
  }
}

@media (max-width: 24rem) {
  .consent__acoes {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .consent,
  .consent__caixa,
  .mobile-global-cta.site-cta,
  .medic-nav {
    transition-duration: 0.01ms !important;
  }
}
