/* small — max-width: 540px */

/* ══════════════════════════════════════
   RESPONSIVE — MOBILE
   Figma frame: 375px → breakpoint ≤ 540px
   ══════════════════════════════════════ */
@media (max-width: 540px) {

  /* ── ANNOUNCEMENT BAR: 89px, vertical layout ── */
  .ann-bar { height: 89px; align-items: flex-start; }
  .ann-inner {
    flex-wrap: wrap;
    padding: 10px 16px;
    gap: 0;
    align-items: flex-start;
  }
  /* Unwrap ann-content so badge + close sit on same row */
  .ann-content { display: contents; }
  .ann-badge   { order: 0; flex-shrink: 0; }
  .ann-close   { order: 1; margin-left: auto; align-self: center; }
  /* Text group goes to second row, full width */
  .ann-text-group {
    order: 2;
    flex: 0 0 100%;
    margin-top: 5px;
    flex-wrap: wrap;
  }
  .ann-time { color: #A3A3A3; }

  /* ── NAV BAR: hide SIGN IN, gap 12px ── */
  .nav-inner  { padding: 0 20px; }
  .nav-actions { gap: 12px; }
  .nav-signin-btn { display: none; }

  /* ── NEWSWIRE: column layout (logo on top, cards below) ── */
  .nw-inner {
    flex-direction: column;
    align-items: center;
    padding: 16px 20px;
    height: 174px;
    gap: 14px;
  }
  .nw-scroll-wrap {
    flex: none;
    width: 100%;
    height: 100px;
  }
  .nw-track-outer  { padding: 0 32px; height: 100px; }
  .nw-track        { height: 100px; }
  .nw-fade-left    { width: 32px; }
  .nw-fade-right   { width: 31px; }

  /* Ticker fades: too wide at mobile, reduce */
  .ticker-fade { width: 60px; }

  /* ── Hero: tighter padding ── */
  .hero-inner { padding: 48px 20px; }

  /* ── Tagline: 14px at mobile (vs 16px) ── */
  .tagline { font-size: 14px; }

  /* ── Filter chips: 44px tall at mobile (vs 32px) ── */
  .chip      { height: 44px; border-radius: 8px; }
  .chip-icon { width: 44px; height: 44px; }

  /* ── Featured image: 335×188 ≈ 16:9 ── */
  .featured-img { aspect-ratio: 335 / 188; }

  /* ── Sub-articles: horizontal scroll row, show all 3 ── */
  .side-articles {
    display: flex;
    flex-direction: row;
    overflow-x: auto;
    gap: 12px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .side-articles::-webkit-scrollbar { display: none; }

  /* Show 3rd card in the scroll row */
  .side-card:nth-child(3) { display: flex; }

  /* Fixed-width cards, never shrink */
  .side-card {
    flex-shrink: 0;
    width: 152px;
    flex-direction: column;
    gap: 8px;
  }

  /* Sub-article image: 152×86 ≈ 16:9 */
  .side-card-img { aspect-ratio: 152 / 86; width: 152px; }

  /* ── Reduce grid vertical gap ── */
  .main-grid { row-gap: 16px; }

  /* ── Newsletter: column + tighter padding at mobile ── */
  .newsletter-section {
    flex-direction: column;
    gap: 20px;
    padding: 24px 20px;
  }
  .newsletter-section .newsletter-copy,
  .newsletter-section .newsletter-form {
    flex: none;
    width: 100%;
  }
  .newsletter-title { font-size: 22px; }

  /* ── Bottom cards: horizontal scroll row (no wrap) ── */
  .bottom-cards {
    display: flex;
    flex-direction: row;
    overflow-x: auto;
    gap: 12px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .bottom-cards::-webkit-scrollbar { display: none; }

  /* Fixed-width cards so they never shrink or wrap */
  .news-card {
    width: 200px;
    flex-shrink: 0;
    flex-direction: column;
  }
}