/* ============================================================
 * AEREDIUM mobile layer
 *
 * EVERY rule in this file lives inside a media query. Nothing here
 * can reach a desktop viewport. Loaded last on each page so it wins
 * ties against the page's own styles without needing !important.
 *
 * Written from a measured audit at 390x844, not from guesswork:
 * each block below names the pages and elements it was written for.
 * ============================================================ */

@media (max-width: 700px) {

  /* ---------- 1. Type that was sized for a desktop column ----------
     The audit found body copy down to 10px on the denser pages, which
     is unreadable on a phone. Nothing here changes the type hierarchy,
     it only lifts the smallest sizes to a legible floor. */

  /* airdrops */
  .desc, .catnote, .note, .rowlabel { font-size: 15px !important; line-height: 1.55; }
  .s1 { font-size: 13px !important; }

  /* institutional, technology */
  .level-section-body, .process-step-body { font-size: 15px !important; line-height: 1.55; }
  .level-effort, .process-step-time, .usecase-sector, .usecase-primitives { font-size: 13px !important; }

  /* wallet */
  .hero-eyebrow, .section-label, .ribbon-label, .hero-feature-badge, .feature-highlight { font-size: 14px !important; }

  /* contact */
  .channel-value, .ambassador-note { font-size: 15px !important; line-height: 1.55; }
  .entity-detail, .response-badge { font-size: 13px !important; }

  /* press */
  .press-card-meta, .press-stat { font-size: 13px !important; }

  /* technology */
  .arch-layer-desc, .thesis-audio-sub { font-size: 15px !important; line-height: 1.55; }
  .thesis-audio-eyebrow, .stat-sub { font-size: 13px !important; }

  /* white paper */
  .patent-card-sub { font-size: 13px !important; }

  /* footers, site-wide */
  .footer-meta, .ae-footer-meta, .footer-meta div, .ae-footer-meta div { font-size: 12px !important; letter-spacing: .06em; }
  .footer-brand-tagline { font-size: 13px !important; }

  /* generic floor for anything still carrying sentences at label size */
  .lede, .stat-label, .info-card p, .link-card-desc { font-size: 15px; }

  /* ---------- 2. Touch targets ----------
     Controls under roughly 44px are hard to hit accurately. This
     applies to actual controls only - inline links inside a sentence
     are deliberately left alone, since padding them out would break
     the line they sit in. */
  .footer-social a, .ae-footer-social a, .social-link, .aemenu-close,
  .nav-hamburger, .ae-mobile-nav-btn {
    min-width: 44px; min-height: 44px;
    display: inline-flex; align-items: center; justify-content: center;
  }
  .aemenu-panel a.aemenu-link { padding-top: .7rem; padding-bottom: .7rem; }

  /* ---------- 3. Boxes whose contents did not fit ----------
     Each of these was measured overflowing its own container. */

  /* developers: the parameter table's label column was 280px in a 344px box */
  .params dl { grid-template-columns: 1fr; }
  .params dd { border-left: none; }

  /* institutional, technology: fixed-count 2px waveform bars ran past
     the card edge. They are decoration, so clip rather than reflow. */
  .dialogue-wave, .thesis-audio-wave { overflow: hidden; }

  /* long unbroken strings - addresses, URLs, hashes - inside cards */
  .waitlist-card, .dialogue-card, .info-card, .link-card, .level, .stat-card {
    overflow-wrap: anywhere;
  }

  /* footers: three social icons plus their gap exceeded the column,
     and a flex child would not shrink below its content width */
  .footer-social, .ae-footer-social, .frow, .footer-inner { flex-wrap: wrap; }
  .frow > *, .footer-inner > * { min-width: 0; }

  /* ---------- 4. Reading comfort ----------
     Slightly tighter page gutters buy back horizontal space for text
     on a 390px screen without changing any layout structure. */
  .wrap, .nav-inner { padding-left: 20px; padding-right: 20px; }
}

/* Very narrow phones (iPhone SE and similar) */
@media (max-width: 380px) {
  .wrap, .nav-inner { padding-left: 16px; padding-right: 16px; }
  .footer-meta, .ae-footer-meta { text-align: left; }
}
