/* ─────────────────────────────────────────────────────────────────────
 * Wonderland · Adaptación de lectura en móvil
 *
 * Aplica bumps de tamaño y line-height solo en pantallas ≤ 700px.
 * La fuente principal IM Fell English es condensada y necesita más
 * cuerpo en móvil para que la lectura no se sienta apretada.
 *
 * Diseño base de la web = desktop-first. Aquí solo "ajustamos lo que
 * se ve apretado" sin romper el resto de la estética.
 * ───────────────────────────────────────────────────────────────────── */

@media (max-width: 700px) {

  /* Cuerpo de texto general · 17px es el mínimo cómodo para fuentes
   * serif con remates en pantalla pequeña. */
  body {
    font-size: 17px;
    line-height: 1.8;
  }

  /* Párrafos de los capítulos · son el corazón de la lectura. */
  p,
  .chapter-content p,
  .capitulo-content p,
  .content p,
  article p {
    font-size: 1.05rem;
    line-height: 1.95;
  }

  /* Texto de cards · destellos, nimbos, naipes, etc. */
  .card p,
  .nimbo-texto,
  .nimbo-card .nimbo-texto,
  .story-excerpt,
  .card-excerpt {
    font-size: 1rem;
    line-height: 1.75;
  }

  /* Chat de los personajes · burbujas del personaje */
  .message.cat .bubble,
  .message.user .bubble {
    font-size: 1.05rem;
    line-height: 1.85;
  }

  /* Manifiesto, citas, intro de personajes */
  .hero-text,
  .hero-subtitle,
  .manifesto-text,
  .mirror-quote,
  .persona-role {
    font-size: 1.05rem;
    line-height: 1.85;
  }

  /* Frases de destellos · placeholders y notas */
  .nimbos-placeholder,
  .refugio-nimbo-extracto {
    font-size: 0.95rem;
    line-height: 1.7;
  }

  /* Footer y elementos secundarios · subir solo un poquito */
  footer,
  footer p,
  .footer-text,
  .crumb,
  .crumb a {
    font-size: 0.92rem;
  }

  /* Los labels Cinzel se mantienen pequeños (estética grabado) pero
   * con suficiente cuerpo para que sigan siendo legibles en móvil.
   * Antes los agrupábamos a 0.7rem; uppercase + Cinzel + 0.7rem era ilegible. */
  .section-label,
  .persona-tag,
  .card-num,
  .collection-type {
    font-size: 0.78rem;
    letter-spacing: 0.22em;
  }
  /* persona-name y persona-tier eran 0.7rem y 0.5rem en uppercase: ilegibles. */
  .persona-name {
    font-size: 0.85rem;
    letter-spacing: 0.2em;
  }
  .persona-tier {
    font-size: 0.72rem;
    letter-spacing: 0.18em;
  }
  /* collection-name es Cormorant 1.15rem, NO Cinzel uppercase. Antes el
   * agrupado anterior lo aplastaba a 0.7rem por error. */
  .collection-name {
    font-size: 1.25rem;
  }
  /* Cards de capítulos y destellos: subir título y excerpt para card de 220px. */
  .card-title {
    font-size: 1.1rem;
    line-height: 1.4;
  }
  /* Barra de navegación bajo personajes */
  .seccion-nav a {
    font-size: 0.7rem;
    letter-spacing: 0.22em;
    padding: 0.7rem 1.1rem;
  }

  /* Inputs y formularios · subir tamaño para escribir cómodo */
  input[type="text"],
  input[type="email"],
  textarea,
  .input-field {
    font-size: 16px; /* 16px evita el zoom automático de iOS */
  }
}

/* En móviles muy pequeños (≤ 400px), un poco menos extremo para que
 * los títulos no rompan la maqueta. */
@media (max-width: 400px) {
  body { font-size: 16.5px; }
  p, .content p, article p { font-size: 1rem; line-height: 1.85; }
}
