/* ==========================================================
   HEXA BOOK PUBLISHERS | RESPONSIVE STYLES
   ========================================================== */

/* ---------- Large desktop (1400+) ---------- */
@media (min-width: 1400px) {
  .home-hero { padding: 80px 0 90px; }
}

/* ---------- Desktop nav: open Services on hover ---------- */
@media (min-width: 1200px) {
  .main-nav .dropdown:hover > .mega-menu { display: block; }
  .main-nav .dropdown > .mega-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px; }
}

/* ---------- Laptop (below 1200) ---------- */
@media (max-width: 1199.98px) {
  .site-header .navbar-collapse { max-height: calc(100vh - 80px); overflow-y: auto; padding: 10px 0 20px; }
  .main-nav { margin: 10px 0 !important; }
  .main-nav .nav-link { padding: 12px 4px !important; border-bottom: 1px solid #eef0f5; }
  .main-nav .nav-link::after { display: none; }
  .main-nav .dropdown-toggle::after { display: inline-block; transition: transform .3s ease; }
  .main-nav .dropdown-toggle.show::after { transform: rotate(180deg); }
  .main-nav .dropdown-toggle { display: flex !important; justify-content: space-between; align-items: center; }
  .mega-menu { width: 100%; transform: none; box-shadow: none; padding: 6px 0; margin: 0 !important; background: #f6f8fc; }
  .header-actions { flex-wrap: wrap; }

  .home-hero h1 { font-size: 50px; }
  .hero-books img { width: 180px; }
  .sec-title, .why-content h2 { font-size: 36px; }
  .page-hero h1 { font-size: 44px; }
  .genre-card { width: calc((100% - 96px) / 5); }
  .money-badge { width: 200px; }
}

/* ---------- Tablet (below 992) ---------- */
@media (max-width: 991.98px) {
  .sec { padding: 70px 0; }
  .sec-head { margin-bottom: 40px; }
  .sec-title, .why-content h2, .split-content h2 { font-size: 32px; }

  .home-hero { padding: 60px 0; }
  .home-hero h1 { font-size: 42px; }
  .hero-books { flex-wrap: wrap; gap: 16px; }
  .hero-books img { width: calc(25% - 12px); }

  .why-choose { padding-bottom: 70px; }
  .why-media { max-width: 340px; margin-bottom: 30px; }
  .connect-panel { margin-left: 0; border-radius: 20px; padding-right: 30px; }
  .connect-panel::after { display: none; }

  .products { padding-top: 70px; }
  .bestseller-row { flex-wrap: wrap; justify-content: center; }
  .bestseller-item { flex: 0 0 calc(33.333% - 14px); }
  .bestseller-item .book { height: 280px; }

  .offer h2 span { font-size: 32px; }
  .genre-card { width: calc((100% - 72px) / 4); }
  .team-member { flex-direction: column; text-align: center; gap: 14px; }
  .team-member h3 { font-size: 21px; }

  .page-hero { padding: 60px 0; }
  .page-hero h1 { font-size: 38px; }
  .hero-visual { margin-top: 40px; }
  .hero-visual img { max-height: 340px; }
  .steps-row::before { display: none; }
  .tab-panel { padding: 30px; }
  .lead-box { flex-direction: column; }
  .lead-box .lead-info { flex: auto; }
  .popup-form { padding: 36px 26px; }
  .cta-flag h2 { font-size: 32px; }
  .quote-band blockquote { font-size: 22px; }
}

/* ---------- Small tablet (below 768) ---------- */
@media (max-width: 767.98px) {
  body { font-size: 14.5px; }
  .sec { padding: 60px 0; }
  .sec-title, .why-content h2, .split-content h2 { font-size: 28px; }
  .topbar { font-size: 12px; }

  .home-hero h1 { font-size: 34px; }
  .hero-books img { width: calc(50% - 8px); max-width: 180px; }

  .logo-strip { padding: 18px 0; }
  .ribbon-title { font-size: 17px; left: 24px; padding: 7px 20px; }
  .connect-panel { padding: 40px 20px 20px 24px; }
  .royalty-badge strong { font-size: 32px; }

  .product-card img { height: 130px; }
  .doodle { width: 300px; }

  .bestseller-row .bestseller-item .book { height: 300px; }
  .offer { padding: 50px 0; }
  .offer h2 span { font-size: 28px; }
  .badge-yellow { font-size: 20px; }

  .genre-grid { gap: 20px 16px; }
  .genre-card { width: calc((100% - 32px) / 3); }
  .cta-yellow { padding-bottom: 60px; }
  .cta-yellow-box { background-size: auto 100%; background-position: center; padding: 34px 18px; }
  .cta-yellow-box::before { content: ""; position: absolute; inset: 0; border-radius: 6px; background: rgba(253, 229, 143, .82); }
  .cta-yellow-box > * { position: relative; }
  .cta-yellow-box h2 { font-size: 24px; }

  .team-grid { grid-template-columns: 1fr; }
  .team-member, .team-member:nth-child(odd) { border-right: 0; border-bottom: 1px solid #dfe3ec; flex-direction: row; text-align: left; justify-content: flex-start; padding: 24px 0; }
  .team-member:nth-last-child(2) { border-bottom: 1px solid #dfe3ec; }
  .team-photo img { width: 100px; height: 100px; }

  .locations h2 { font-size: 30px; }
  .location-item { border: 0; margin: 0; padding: 0; width: 100%; }

  .page-hero h1 { font-size: 32px; }
  .timeline::before { left: 21px; }
  .timeline-item, .timeline-item:nth-child(even) { width: 100%; margin-left: 0; padding: 0 0 30px 64px; text-align: left; }
  .timeline-dot, .timeline-item:nth-child(even) .timeline-dot { left: 0; right: auto; }
  .zigzag-row + .zigzag-row { margin-top: 50px; }
  .zigzag-row h3 { font-size: 24px; }
  .blue-panel { padding: 50px 24px 26px; }
  .blue-panel .ribbon-title { left: 24px; }
  .cta-flag { padding: 55px 0; }
  .cta-flag h2 { font-size: 27px; }
  .quote-band { padding: 55px 0; }
  .quote-band blockquote { font-size: 19px; }
  .lead-box .lead-info, .lead-box form { padding: 34px 24px; }
  .legal-toc ol { columns: 1; }
  .status-page { padding: 80px 0; }
  .status-page .big-code { font-size: 110px; }
  .status-page h1 { font-size: 30px; }

  /* mobile slider rows */
  .mobile-slider.slick-initialized { margin: 0 -12px; }
  .bestseller-row.slick-initialized .bestseller-item { padding: 0 8px; }
}

/* ---------- Mobile (below 576) ---------- */
@media (max-width: 575.98px) {
  .home-hero { padding: 46px 0 50px; }
  .home-hero h1 { font-size: 29px; }
  .home-hero p { font-size: 14px; }
  .sub-title { font-size: 13.5px; }
  .sec-title, .why-content h2, .split-content h2 { font-size: 25px; }
  .btn-main { padding: 12px 22px; font-size: 14px; }
  .header-actions { width: 100%; }
  .header-actions > * { flex: 1 1 100%; text-align: center; justify-content: center; }

  .offer-form .input-wrap { flex-direction: column; }
  .genre-card { width: calc((100% - 16px) / 2); }
  .team-member h3 { font-size: 18px; }
  .review-card { padding: 24px 20px; }
  .review-top h4 { font-size: 19px; }
  .review-card p { font-size: 14.5px; }
  .footer-contact b { font-size: 15px; }
  .footer-bottom .container { justify-content: center !important; text-align: center; }

  .page-hero h1 { font-size: 28px; }
  .book-fan img { width: 110px; margin: 0 -14px; }
  .book-fan img:nth-child(2) { width: 130px; }
  .icon-card, .num-card { padding: 26px 22px; }
  .tab-panel { padding: 22px 18px; }
  .service-tabs .nav-link { padding: 8px 16px; font-size: 13.5px; }
  .popup { padding: 10px; }
  .popup-form { padding: 50px 18px 24px; }
  .price-card { padding: 32px 22px; }
}

/* ---------- Small mobile (below 375) ---------- */
@media (max-width: 374.98px) {
  .logo span { font-size: 18px; }
  .logo i { font-size: 24px; }
  .home-hero h1 { font-size: 25px; }
  .sec-title, .why-content h2, .split-content h2, .page-hero h1 { font-size: 23px; }
  .royalty-badge { padding: 8px 12px; }
  .royalty-badge strong { font-size: 26px; }
  .ribbon-title { font-size: 15px; }
  .team-member { flex-direction: column; text-align: center; justify-content: center; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
