/* =====================================================================
   QUBIC TRAVELS — RESPONSIVE BREAKPOINTS
   ===================================================================== */

/* ---- 1200px and below ---- */
@media (max-width: 1200px) {
    .pkg-grid { grid-template-columns: repeat(2, 1fr); }
    .exp-grid { grid-template-columns: repeat(3, 1fr); }
    .blog-grid { grid-template-columns: repeat(3, 1fr); }
    .social-grid { grid-template-columns: repeat(4, 1fr); }
    .dash-cards { grid-template-columns: repeat(2, 1fr); }
    .search-panel { grid-template-columns: repeat(3, 1fr); }
    .search-submit { grid-column: span 3; }
}

/* ---- 1024px and below (tablet) ---- */
@media (max-width: 1024px) {
    .main-nav { display: none; }
    .hamburger { display: flex; }
    .story-grid { grid-template-columns: 1fr; gap: 50px; }
    .story-media .float-img { left: 0; }
    .pin-row { grid-template-columns: 1fr; }
    .pin-image { position: static; height: 340px; margin-bottom: 30px; }
    .why-grid { grid-template-columns: repeat(2, 1fr); }
    .exp-grid { grid-template-columns: repeat(2, 1fr); }
    .detail-layout { grid-template-columns: 1fr; }
    .booking-card { position: static; margin-top: 30px; }
    .auth-wrap { grid-template-columns: 1fr; }
    .auth-media { display: none; }
    .dash-layout { grid-template-columns: 1fr; }
    .dash-sidebar { display: flex; overflow-x: auto; border-right: none; border-bottom: 1px solid var(--color-ivory-dim); }
    .dash-sidebar a { white-space: nowrap; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
}

/* ---- 768px (tablet portrait / small tablet) ---- */
@media (max-width: 768px) {
    .section { padding: 70px 0; }
    .section-sm { padding: 50px 0; }
    .pkg-grid { grid-template-columns: 1fr; }
    .blog-grid { grid-template-columns: repeat(2, 1fr); }
    .social-grid { grid-template-columns: repeat(3, 1fr); }
    .exp-grid { grid-template-columns: 1fr 1fr; }
    .stats-row { grid-template-columns: repeat(2, 1fr); gap: 30px 20px; }
    .search-panel { grid-template-columns: 1fr 1fr; padding: 24px; }
    .search-submit { grid-column: span 2; }
    .journey-panel { grid-template-columns: 1fr; gap: 24px; }
    .journey-panel img { height: 240px; }
    .newsletter { flex-direction: column; text-align: center; padding: 46px 30px; }
    .newsletter-form { max-width: 100%; }
    .option-grid { grid-template-columns: repeat(2, 1fr); }
    .form-row { grid-template-columns: 1fr; }
    .pkg-gallery { grid-template-columns: 1fr; height: auto; }
    .pkg-gallery .thumbs { grid-template-columns: 1fr 1fr; grid-template-rows: none; }
    .pkg-gallery .thumbs img { height: 160px; }
    .itinerary-day-editorial .day-image img { height: 220px; }
    .service-strip { gap: 26px; }
    .dash-cards { grid-template-columns: 1fr 1fr; }
    .checkout-card, .checkout-summary-card { padding: 24px; }
    .checkout-pkg img { width: 76px; height: 76px; }
    .checkout-pkg h3 { font-size: 18px; }
    .gateway-card { padding: 34px 26px; }
    .pkg-price-actions { gap: 12px; }
}

/* ---- 480px (mobile) ---- */
@media (max-width: 480px) {
    .container { padding: 0 18px; }
    .hero-actions { flex-direction: column; align-items: stretch; }
    .hero-actions .btn { justify-content: center; }
    .dest-card { flex: 0 0 260px; height: 360px; }
    .why-grid { grid-template-columns: 1fr; }
    .exp-grid { grid-template-columns: 1fr; }
    .blog-grid { grid-template-columns: 1fr; }
    .social-grid { grid-template-columns: repeat(2, 1fr); }
    .search-panel { grid-template-columns: 1fr; }
    .search-submit { grid-column: span 1; }
    .stats-row { grid-template-columns: 1fr 1fr; }
    .footer-grid { grid-template-columns: 1fr; }
    .footer-bottom { flex-direction: column; text-align: center; }
    .option-grid { grid-template-columns: 1fr 1fr; }
    .planner-wrap { padding: 30px 22px; }
    .auth-form-wrap { padding: 40px 22px; }
    .dash-content { padding: 22px; }
    .dash-cards { grid-template-columns: 1fr; }
    .error-page .code { font-size: 90px; }
    .story-media .main-img img { height: 380px; }
    .story-media .float-img { display: none; }
    .checkout-detail-grid { grid-template-columns: 1fr; }
    .checkout-line.total .amount { font-size: 22px; }
    .gateway-wrap { padding: 120px 14px 40px; }
    .gateway-card { padding: 28px 20px; }
    .gateway-amount { font-size: 24px; }
    .gateway-detail-row span:last-child { max-width: 55%; }
    .pkg-save-btn { width: 34px; height: 34px; font-size: 13px; bottom: 14px; right: 14px; }
    .btn-save-detail { padding: 10px 16px; font-size: 12.5px; }
    .pkg-price-actions { width: 100%; justify-content: space-between; }
    .table-scroll .data-table { min-width: 640px; }
}

/* ---- 390px / 360px (small phones) ---- */
@media (max-width: 390px) {
    .hero-title { font-size: 38px; }
    .section-heading { font-size: 30px; }
    .pkg-body, .blog-body { padding: 18px; }
    .whatsapp-float { width: 50px; height: 50px; bottom: 18px; right: 18px; }
    .checkout-card h2 { font-size: 22px; }
    .checkout-pkg { flex-direction: column; align-items: flex-start; }
    .checkout-pkg img { width: 100%; height: 150px; }
    .gateway-amount { font-size: 21px; }
    .gateway-card h1 { font-size: 21px; }
    .btn-save-detail .save-label { display: none; }
    .btn-save-detail { padding: 10px 14px; }
    .password-field .toggle-password { top: 40px; right: 10px; }
}
