/* ============================================================
   responsive.css — breakpoints
   ============================================================ */

@media (max-width:1024px){
  .areas-grid{grid-template-columns:repeat(2,1fr);gap:28px}
  .about-block--split,
  .about-block--split.reverse{grid-template-columns:1fr}
  .about-block--split.reverse .about-block__media{order:0}
  .cal-wrap{grid-template-columns:1fr}
}

@media (max-width:860px){
  .nav__toggle{display:flex;position:relative;z-index:2}
  /* o botao da direita e substituido pelo item dentro do drawer */
  .nav__actions .nav__cta{display:none}

  /* quando o menu abre, o header inteiro sobe acima de tudo;
     assim o drawer (que vive dentro do header) fica no topo,
     sem precisar de qualquer overlay/transparencia */
  .site-header{backdrop-filter:none;background:var(--white)}
  body.nav-open .site-header{z-index:1000}

  /* drawer lateral mobile - 100% opaco, sem transparencias */
  .nav__menu{
    position:fixed;top:0;right:0;bottom:0;
    width:min(330px,86%);height:100vh;
    background:#ffffff;
    display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;
    gap:.25rem;padding:5.5rem 1.4rem 2rem;
    box-shadow:-12px 0 40px rgba(14,42,51,.18);
    transform:translateX(100%);
    transition:transform var(--t);
    z-index:1001;overflow-y:auto;
  }
  .nav__menu.is-open{transform:translateX(0)}
  .nav__menu li{width:100%;list-style:none}
  .nav__menu a{display:block;width:100%;padding:.95rem 1rem;font-size:1.05rem;border-radius:10px;color:var(--ink)}
  .nav__menu a::after{display:none}
  .nav__menu a:hover,.nav__menu a.is-active{background:var(--cream)}

  /* Area do Aluno dentro do drawer, destacada */
  .nav__menu-cta{display:block;margin-top:.6rem;border-top:1px solid var(--line);padding-top:.8rem}
  .nav__menu-cta a{background:var(--gold);color:var(--ink);font-weight:600;text-align:center}
  .nav__menu-cta a:hover{background:var(--gold-soft)}

  /* esconder o WhatsApp flutuante enquanto o menu esta aberto */
  body.nav-open .wa-float{opacity:0;visibility:hidden}
}

@media (max-width:640px){
  body{font-size:16px}
  .topbar__phone span{display:none}
  .hero__motto{font-size:.95rem;gap:.5rem 1rem}
  .footer-bottom{flex-direction:column;align-items:flex-start;text-align:left}
  .breath span{max-width:80px}
  .cookie{padding:1rem;bottom:10px}
  .cookie__actions{width:100%}
  .cookie__actions .btn{flex:1;justify-content:center}
}

@media (max-width:420px){
  .areas-grid{grid-template-columns:1fr}
  .brand img{height:40px}
}

/* motion preference */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
}

/* print */
@media print{
  .topbar,.site-header,.cookie,.wa-float,.share-row,.gallery__nav,.cal__nav{display:none}
  .hero,.page-hero,.section--ink,.site-footer{background:#fff;color:#000}
}
