/* ==========================================================================
   Responsivo
   Desktop  >= 1200px (base de style.css)
   Notebook  992px – 1199px
   Tablet    768px – 991px
   Mobile    < 768px
   ========================================================================== */

/* ---------- Notebook ---------- */
@media (max-width: 1199px) {
  .nav { gap: 24px; }
  .nav__lista { gap: 20px; }
  .nav__link { font-size: 11px; letter-spacing: .12em; }
  .header__cta { padding: 10px 16px; }

  .hero__visual { width: min(100%, 410px); }
  .hero__miniatura { left: -44px; }
  .selo { width: 116px; height: 116px; right: -14px; }

  .card-servico__corpo { padding: 32px 28px 28px; }
  .rodape__grid { grid-template-columns: 1.3fr 1fr 1fr; }
  .rodape__grid > :first-child { grid-column: 1 / -1; justify-self: start; }
}

/* ---------- Tablet: menu vira painel ---------- */
@media (max-width: 991px) {
  :root { --header: 76px; }

  .nav__lista,
  .header__cta { display: none; }
  .menu-botao { display: block; }

  .hero { padding-top: calc(var(--header) + 40px); }
  .hero__grid { grid-template-columns: 1fr; gap: 72px; }
  .hero__texto { max-width: 640px; }
  .hero__visual { justify-self: center; width: min(78%, 420px); }
  .hero .onda--inf-dir { width: 70vw; }
  .rolar { display: none; }

  .sobre__grid { grid-template-columns: 1fr; }
  .sobre__foto { width: min(84%, 460px); margin: 0 auto 30px; }

  .secao__cabeca { flex-direction: column; align-items: flex-start; }

  .servicos__grade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .galeria { columns: 2; }

  /* stories viram carrossel deslizável */
  .stories {
    justify-content: flex-start;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    margin: 0 calc(var(--gutter) * -1);
    padding: 10px var(--gutter) 44px;
    scrollbar-width: none;
  }
  .stories::-webkit-scrollbar { display: none; }
  .story { flex: 0 0 34%; scroll-snap-align: center; box-shadow: 0 18px 28px -20px rgba(6, 43, 49, .6); }
  .story:nth-child(even) { margin-top: 0; }
  .story:hover, .story:focus-visible { transform: none; }

  .etapas { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px 32px; }
  .etapas::before { display: none; }

  .destaque__grid { grid-template-columns: 1fr; }
  .destaque__foto { width: min(70%, 380px); margin: 0 auto; }

  .contato__grid { grid-template-columns: 1fr; }

  .rodape__grid { grid-template-columns: 1fr 1fr; }
}

/* ---------- Mobile ---------- */
@media (max-width: 767px) {
  body { font-size: 15.5px; }

  .logo__nome { font-size: 23px; }
  .logo__sub { font-size: 7.5px; letter-spacing: .3em; }

  .hero { min-height: auto; padding-bottom: 72px; }
  .hero__titulo { font-size: clamp(2.3rem, 10.4vw, 3.4rem); }
  .hero__acoes { flex-direction: column; align-items: stretch; }
  .hero__acoes .btn { width: 100%; }
  .assinatura { margin-top: 40px; }
  .hero__visual { width: min(82%, 340px); margin-left: 9%; justify-self: start; }
  .hero__miniatura { left: -16%; bottom: 24px; width: 40%; border-width: 4px; }
  .selo { width: 92px; height: 92px; top: -18px; right: -14%; }
  .selo text { font-size: 10px; }
  .selo__centro { font-size: 17px; }
  .moldura { inset: -10px; }
  .hero .onda--sup-esq { width: 80vw; }

  .titulo { font-size: clamp(2rem, 8.6vw, 2.7rem); }

  .sobre__foto { width: 88%; margin-left: 0; }
  .sobre__foto .quadro,
  .sobre__foto .moldura { border-radius: 0 0 140px 0; }
  .sobre__foto .moldura { inset: -10px; border-radius: 0 0 150px 0; }
  .sobre__legenda { left: auto; right: -20px; bottom: 26px; font-size: 16px; padding: 12px 16px; }
  .atributos { grid-template-columns: 1fr; }
  .sobre__acoes { flex-direction: column; align-items: flex-start; }

  .servicos__grade { grid-template-columns: 1fr; gap: 18px; }
  .card-servico__numero { font-size: 2.8rem; }
  .card-servico__titulo { font-size: 1.55rem; }

  .story { flex-basis: 62%; }
  .stories__rodape { flex-direction: column; align-items: center; margin-top: 40px; }

  .galeria { column-gap: 12px; }
  .galeria__item { margin-bottom: 12px; }
  .galeria__rotulo { display: none; }

  .etapas { grid-template-columns: 1fr; gap: 0; padding-left: 0; }
  .etapa {
    display: grid;
    grid-template-columns: 56px 1fr;
    column-gap: 22px;
    padding-bottom: 38px;
  }
  .etapa::before {
    content: "";
    position: absolute;
    left: 28px;
    top: 56px;
    bottom: 0;
    width: 1px;
    background: rgba(185, 154, 112, .5);
  }
  .etapa:last-child::before { display: none; }
  .etapa__numero { grid-row: span 2; width: 56px; height: 56px; margin: 0; font-size: 1.35rem; }
  .etapa__titulo { font-size: 1.4rem; margin-top: 12px; }

  .destaque__foto { width: 78%; }
  .destaque .btn { width: 100%; }

  .formulario__linha { grid-template-columns: 1fr; gap: 0; }
  .formulario::before { inset: 8px; }

  .rodape__grid { grid-template-columns: 1fr; gap: 36px; }
  .rodape__grid > :first-child { justify-self: center; }
  .rodape__base { flex-direction: column; align-items: center; text-align: center; }

  .whats-flutuante { right: 16px; bottom: 16px; width: 54px; height: 54px; }

  .lightbox__nav { top: auto; bottom: -70px; transform: none; }
  .lightbox__palco { padding: 0 12px; }
  .lightbox__img { max-height: calc(100svh - 220px); }
  .lightbox__legenda { padding-top: 84px; }
}

@media (max-width: 380px) {
  .hero__acoes .btn { padding-left: 18px; padding-right: 18px; letter-spacing: .14em; }
  .galeria { columns: 1; }
}
