/* ================================================================
   RESPONSIVE (responsive.css)
   ================================================================ */

/* ── 1280px ───────────────────────────────────────────────────── */
@media (max-width: 1280px) {
  .nkro-container { padding-inline: var(--sp-5); }
  .nkro-memories-grid { grid-template-columns: repeat(3,1fr); gap: var(--sp-5); }
}

/* ── 1024px ───────────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .nkro-memories-grid { grid-template-columns: repeat(2,1fr); }
  .nkro-card--featured { grid-column: span 2; }
  .nkro-card--wide { grid-column: span 2; }
  .nkro-letter { padding: var(--sp-8) var(--sp-10); }
}

/* ── 768px — Tablet ──────────────────────────────────────────── */
@media (max-width: 768px) {
  :root { --nkro-header-h: 56px; }

  /* Header */
  .nkro-nav { display: none; }
  .nkro-hamburger { display: flex; }
  .nkro-header__actions .nkro-btn--ghost { display: none; }

  /* Hero */
  .nkro-hero { min-height: 60vh; }
  .nkro-name { font-size: clamp(2rem, 10vw, 3rem); }
  .nkro-hero__tagline { font-size: var(--nkro-fs-base); }
  .nkro-counter-number { font-size: clamp(3rem, 15vw, 5rem); }
  .nkro-orbit-ring--2 { display: none; }

  /* Grid */
  .nkro-memories-grid { grid-template-columns: repeat(2,1fr); gap: var(--sp-4); }
  .nkro-card--wide { grid-column: span 2; }
  .nkro-card--featured { grid-column: span 2; }
  .nkro-card--tall { grid-row: span 1; }

  /* Stats */
  .nkro-stats__grid { grid-template-columns: repeat(3,1fr); gap: var(--sp-4); }

  /* Section header */
  .nkro-section-header { flex-direction: column; align-items: flex-start; }
  .nkro-view-tabs { align-self: flex-start; }

  /* Filter */
  .nkro-filter-bar { padding: var(--sp-3) var(--sp-4); gap: var(--sp-2); }
  .nkro-filter-search { min-width: 100%; order: 5; }

  /* Letter */
  .nkro-letter { padding: var(--sp-6) var(--sp-6); }
  .nkro-letter::before { font-size: 4rem; }

  /* Footer */
  .nkro-footer-names { font-size: var(--nkro-fs-2xl); }
}

/* ── 480px — Mobile ──────────────────────────────────────────── */
@media (max-width: 480px) {
  .nkro-memories-grid { grid-template-columns: 1fr; }
  .nkro-card--wide, .nkro-card--featured { grid-column: span 1; }
  .nkro-card--tall { grid-row: span 1; }

  .nkro-stats__grid { grid-template-columns: repeat(2,1fr); }

  .nkro-filter-bar {
    flex-direction: column;
    align-items: stretch;
  }
  .nkro-filter-bar select { width: 100%; }

  .nkro-section-title { font-size: var(--nkro-fs-xl); }
  .nkro-section { padding-block: var(--sp-10); }

  .nkro-hero__cta { flex-direction: column; align-items: center; }
  .nkro-hero__cta .nkro-btn { width: 100%; max-width: 260px; justify-content: center; }

  .nkro-view-tabs { gap: 2px; }
  .nkro-view-tab { padding: var(--sp-2); font-size: var(--nkro-fs-xs); }
  .nkro-view-tab span:not([aria-hidden]) { display: none; }

  .nkro-letter-content { font-size: 1.1rem; }

  #nkro-toast-container { bottom: var(--sp-4); right: var(--sp-4); left: var(--sp-4); }
  .nkro-toast { max-width: 100%; }
}

/* ── 360px — Small mobile ────────────────────────────────────── */
@media (max-width: 360px) {
  .nkro-container { padding-inline: var(--sp-4); }
  .nkro-logo-sub { display: none; }
  .nkro-stats__grid { grid-template-columns: repeat(2,1fr); }
}

/* ── Large screens ────────────────────────────────────────────── */
@media (min-width: 1440px) {
  :root { --nkro-max-w: 1320px; }
  .nkro-memories-grid { grid-template-columns: repeat(4,1fr); }
}