/* ============================================================
   mind.allen87.com — Responsive
   Breakpoints: tablet 768px | mobile 480px
   ============================================================ */

/* ── Tablet (≤ 768px) ───────────────────────────────────────────────────────── */
@media (max-width: 768px) {

  /* Nav */
  .nav__links   { display: none; }
  .nav__burger  { display: flex; }
  .nav__mobile.open { display: flex; }

  /* Hero */
  .hero {
    padding-top: calc(var(--nav-height) + var(--sp-12));
    padding-bottom: var(--sp-12);
  }

  /* Card destaque vira vertical */
  .card--featured {
    flex-direction: column;
    min-height: unset;
  }

  .card--featured .card__cover {
    width: 100%;
    aspect-ratio: 16 / 9;
  }

  .card--featured .card__body {
    padding: var(--sp-6);
  }

  /* Grid de 2 colunas vira 1 */
  .cards-grid {
    grid-template-columns: 1fr;
  }

  /* Newsletter */
  .newsletter__form {
    flex-direction: column;
  }

  .newsletter__input,
  .btn {
    width: 100%;
  }

  /* Footer */
  .footer__inner {
    flex-direction: column;
    text-align: center;
    gap: var(--sp-4);
  }

  /* Share bar */
  .share-bar__inner {
    flex-wrap: wrap;
  }

  /* Post header meta */
  .post-header__meta {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--sp-4);
  }
}

/* ── Mobile (≤ 480px) ───────────────────────────────────────────────────────── */
@media (max-width: 480px) {

  .container,
  .container--prose {
    padding-inline: var(--sp-4);
  }

  /* Nav controls — oculta idioma no mobile pequeno */
  .lang-switcher { display: none; }

  /* Post cover — aspect ratio mais quadrado */
  .post-header__cover {
    aspect-ratio: 16 / 9;
    border-radius: var(--radius-lg);
  }

  /* TOC colapsável no mobile */
  .toc { padding: var(--sp-4); }

  /* Scroll top — menor */
  .scroll-top {
    bottom: var(--sp-4);
    right: var(--sp-4);
  }
}

/* ── Large (≥ 1400px) ───────────────────────────────────────────────────────── */
@media (min-width: 1400px) {
  .cards-grid {
    gap: var(--sp-8);
  }
}
