/* ═══ XO LOVE — Responsive ═══ */

/* ── Tablet (1024px) ── */
@media (max-width: 1024px) {
  .xo-model-grid { grid-template-columns: repeat(3, 1fr); }
  .xo-profile { grid-template-columns: 1fr; gap: 24px; }
  .xo-profile-gallery { position: static; }
  .xo-gallery-main { max-height: 550px; }
  .xo-rec-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ── Mobile (768px) ── */
@media (max-width: 768px) {
  /* Typography */
  h1 { font-size: 1.5rem; }
  h2 { font-size: 1.2rem; }
  .xo-container { padding: 0 16px; }
  .xo-section { padding: 40px 0; }

  /* Header */
  .xo-header-inner { height: 60px; }
  .xo-logo img { height: 32px; }
  .xo-mobile-menu { top: 60px; }

  /* Hero */
  .xo-hero { height: 80vh; min-height: 350px; margin-top: -60px; padding-top: 60px; }
  .xo-hero-title { font-size: 1.6rem; }
  .xo-hero-vid-desktop { display: none; }
  .xo-hero-vid-mobile { display: block; }

  /* Model grid */
  .xo-model-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .xo-card-info { padding: 10px 12px; }
  .xo-card-name { font-size: 0.85rem; }
  .xo-card-meta { font-size: 0.7rem; }

  /* Profile */
  .xo-profile-info h1 { font-size: 1.5rem; }
  .xo-profile-stats { grid-template-columns: repeat(2, 1fr); }
  .xo-profile-cta { flex-direction: column; }
  .xo-gallery-main { max-height: 450px; }
  .xo-gallery-thumb { width: 56px; height: 74px; }
  .xo-gallery-nav { width: 36px; height: 36px; }
  .xo-gallery-nav svg { width: 14px; height: 14px; }
  .xo-gallery-thumbs { max-width: calc(5 * 56px + 4 * 8px); }

  /* Filters — hidden behind toggle on mobile */
  .xo-filters-toggle { display: flex; }

  /* SEO content — proper padding on mobile */
  .xo-seo-content { padding: 30px 16px; }
  .xo-seo-content h2 { font-size: 1.1rem; }
  .xo-seo-content p { font-size: 0.9rem; line-height: 1.7; }

  /* FAQ — padding */
  .xo-faq-list { padding: 0; }
  .xo-faq-q { font-size: 0.85rem; padding: 14px 16px; }
  .xo-faq-a { font-size: 0.85rem; padding: 0 16px; }

  /* Blog */
  .xo-blog-grid { grid-template-columns: 1fr; }
  .xo-blog-item { grid-template-columns: 1fr; }
  .xo-blog-item-body { padding: 16px; }

  /* Contact */
  .xo-contact-grid { grid-template-columns: 1fr; }

  /* Footer */
  .xo-footer-top { flex-direction: column; gap: 20px; text-align: center; }
  .xo-footer-nav { justify-content: center; font-size: 0.85rem; }
  .xo-pills-group { flex-direction: column; gap: 8px; }
  .xo-cta-box { padding: 24px 16px; }
  .xo-cta-box h2 { font-size: 1.1rem; }
  .xo-footer-partners { flex-wrap: wrap; justify-content: center; }

  /* Crosslink related */
  .xo-crosslink-related .xo-tag { font-size: 0.72rem; padding: 4px 10px; }
}

/* ── Small mobile (480px) ── */
@media (max-width: 480px) {
  .xo-model-grid { gap: 6px; }
  .xo-card-info { padding: 8px 10px; }
  .xo-card-name { font-size: 0.8rem; }
  .xo-card-meta { gap: 4px; font-size: 0.65rem; }
  .xo-card-badge .xo-badge { font-size: 0.6rem; padding: 3px 8px; }
  .xo-profile-stats { grid-template-columns: 1fr 1fr; }
  .xo-profile-stat { padding: 10px 12px; }
  .xo-profile-stat-label { font-size: 0.65rem; }
  .xo-profile-stat-val { font-size: 0.85rem; }
  .xo-rates-tab { font-size: 0.75rem; padding: 8px; }
  .xo-hero-title { font-size: 1.3rem; }
  .xo-hero-sub { font-size: 0.9rem; }
}
