/**
 * JaiShreeKhatuShyam.com - Responsive Stylesheet v3.0
 * Complete mobile-first responsive design
 */

/* ============================================
   EXTRA LARGE (1400px+)
   ============================================ */
@media (min-width:1400px) {
    .hero-title-hindi { font-size:3.8rem; }
    .hero-title-en { font-size:2rem; }
    .gallery-grid { grid-template-columns:repeat(5, 1fr); }
    .rashifal-grid { grid-template-columns:repeat(6, 1fr); }
}

/* ============================================
   LARGE (992px - 1199px)
   ============================================ */
@media (max-width:1199px) {
    .hero-title-hindi { font-size:2.8rem; }
    .hero-title-en { font-size:1.6rem; }
    .hero-frame { max-width:370px; }
    .gallery-grid { grid-template-columns:repeat(3, 1fr); }
    .rashifal-grid { grid-template-columns:repeat(4, 1fr); }
    .intro-cards { gap:15px; }
    .divine-anim-left { padding:50px 30px 50px 40px; }
}

/* ============================================
   MEDIUM (768px - 991px)
   ============================================ */
@media (max-width:991px) {
    /* Nav */
    .main-navbar { padding:5px 0; }
    .navbar-collapse {
        background:rgba(255,255,255,0.98);
        border-radius:14px;
        margin-top:10px;
        padding:10px;
        box-shadow:0 10px 40px rgba(30,58,138,0.12);
        border:1px solid rgba(255,153,51,0.15);
    }
    .nav-link { padding:14px 15px !important; border-bottom:1px solid rgba(0,0,0,0.04); }
    .nav-link::after { display:none; }
    .btn-live-darshan { margin:10px 15px; }

    /* Hero */
    .hero-section { min-height:auto; padding:20px 0; }
    .hero-content { padding:50px 0 40px; }
    .hero-left { padding-right:0; text-align:center; margin-bottom:40px; }
    .hero-title-hindi { font-size:2.4rem; }
    .hero-title-en { font-size:1.4rem; }
    .hero-desc { max-width:100%; }
    .hero-buttons { justify-content:center; }
    .hero-badges { justify-content:center; }
    .hero-right { margin-top:0; }
    .hero-frame { max-width:340px; }

    /* Sections */
    .section-title { font-size:2rem; }
    .section-padding { padding:60px 0; }

    /* Intro */
    .intro-text-block { padding-right:0; margin-bottom:40px; text-align:center; }
    .intro-link { margin:0 auto; }
    .intro-cards { grid-template-columns:1fr 1fr; }

    /* Divine Anim */
    .divine-anim-section { min-height:auto; }
    .divine-anim-left { padding:40px 20px; min-height:auto; }
    .divine-story-scroll { height:280px; }
    .divine-anim-right { min-height:350px; }
    .baba-animation-container { width:200px; height:340px; }

    /* Aarti */
    .aarti-section { padding:60px 0; }

    /* Gallery */
    .gallery-grid { grid-template-columns:repeat(3, 1fr); }

    /* Reels */
    .reel-phone { width:155px; }

    /* Rashifal */
    .rashifal-grid { grid-template-columns:repeat(4, 1fr); }

    /* Bhajan Player */
    .player-main { flex-direction:column; text-align:center; }

    /* Suvichar */
    .suvichar-inner { flex-direction:column; text-align:center; }
    .suvichar-date { width:100%; }

    /* Footer */
    .footer-top { padding:45px 0 35px; }
    .footer-about { margin-bottom:30px; }
}

/* ============================================
   SMALL (576px - 767px)
   ============================================ */
@media (max-width:767px) {
    /* Live bar */
    .live-bar .col-md-3:last-child { display:none; }
    .aarti-countdown { font-size:0.78rem; flex-wrap:nowrap; gap:5px; }

    /* Nav */
    .brand-hindi { font-size:1rem; }
    .brand-tagline { display:none; }
    .nav-logo-img { height:42px; }

    /* Hero */
    .hero-title-hindi { font-size:2rem; }
    .hero-title-en { font-size:1.2rem; }
    .hero-desc { font-size:0.95rem; }
    .btn-hero { padding:12px 22px; font-size:0.85rem; }
    .hero-badge { font-size:0.75rem; padding:6px 12px; }
    .hero-frame { max-width:280px; }

    /* Sections */
    .section-title { font-size:1.75rem; }
    .section-padding { padding:50px 0; }
    .section-padding-sm { padding:40px 0; }

    /* Intro cards */
    .intro-cards { grid-template-columns:1fr 1fr; gap:12px; }
    .intro-heading { font-size:1.9rem; }

    /* Aarti */
    .aarti-card { padding:20px 15px; margin-bottom:15px; }

    /* Gallery */
    .gallery-grid { grid-template-columns:repeat(2, 1fr); gap:10px; }

    /* Rashifal */
    .rashifal-grid { grid-template-columns:repeat(3, 1fr); gap:10px; }

    /* Reels */
    .reel-phone { width:140px; }
    .reels-section { padding:50px 0; }

    /* Events */
    .event-card { flex-direction:column; gap:15px; }
    .event-date-box { width:55px; height:60px; }

    /* Newsletter */
    .newsletter-form { flex-direction:column; }
    .newsletter-input, .newsletter-btn { width:100%; }
    .newsletter-title { font-size:1.6rem; }

    /* Player */
    .player-card { padding:20px; }
    .player-controls { gap:12px; }

    /* Testimonials */
    .testimonial-card { padding:22px; }

    /* Bhajan section */
    .bhajan-section { padding:50px 0; }

    /* Divine anim */
    .divine-anim-right { display:none; }
    .divine-anim-left { padding:40px 20px; text-align:center; }
    .story-item { padding-left:20px; }

    /* Page hero */
    .page-hero-title { font-size:2rem; }
    .page-hero { padding:40px 0; }

    /* Suvichar */
    .suvichar-icon { width:60px; height:60px; font-size:1.8rem; }
    .suvichar-text { font-size:1.1rem; }

    /* Back to top */
    .back-to-top { bottom:20px; right:20px; width:42px; height:42px; }
    .whatsapp-float { bottom:72px; right:20px; }

    /* Ticker */
    .ticker-label { padding:0 12px; font-size:0.72rem; }
    .ticker-content { padding-left:120px; }
}

/* ============================================
   EXTRA SMALL (< 576px)
   ============================================ */
@media (max-width:575px) {
    html { font-size:15px; }

    .container { padding-left:15px; padding-right:15px; }

    /* Live bar */
    .live-bar { padding:6px 0; }
    .aarti-countdown { font-size:0.72rem; }

    /* Nav */
    .nav-logo-img { height:38px; }
    .navbar-brand { gap:8px; }

    /* Hero */
    .hero-section { min-height:auto; }
    .hero-content { padding:40px 0 30px; }
    .hero-title-hindi { font-size:1.75rem; }
    .hero-title-en { font-size:1.05rem; }
    .hero-desc { font-size:0.88rem; }
    .hero-buttons { flex-direction:column; gap:10px; }
    .btn-hero { width:100%; justify-content:center; }
    .hero-frame { max-width:240px; }
    .hero-badge { font-size:0.72rem; }

    /* Section */
    .section-title { font-size:1.55rem; }
    .section-padding { padding:40px 0; }

    /* Intro */
    .intro-cards { grid-template-columns:1fr 1fr; gap:10px; }
    .intro-card { padding:18px 14px; }
    .intro-card-num { font-size:1.7rem; }
    .intro-heading { font-size:1.6rem; }

    /* Gallery */
    .gallery-grid { grid-template-columns:repeat(2, 1fr); gap:8px; }
    .gallery-filters { gap:7px; }
    .filter-btn { padding:7px 14px; font-size:0.78rem; }

    /* Rashifal */
    .rashifal-grid { grid-template-columns:repeat(3, 1fr); gap:8px; }
    .rashifal-card { padding:14px 10px; }
    .rashifal-symbol { font-size:1.6rem; }
    .rashifal-name { font-size:0.82rem; }

    /* Reels */
    .reel-phone { width:130px; }

    /* News card */
    .news-card-img-wrap { height:160px; }

    /* Events */
    .event-card { padding:18px; }

    /* Footer */
    .footer-top { padding:35px 0 25px; }
    .footer-logo-text { font-size:1.3rem; }
    .footer-title { font-size:0.95rem; }
    .footer-links a, .footer-contact-list li { font-size:0.83rem; }
    .social-link { width:34px; height:34px; font-size:0.9rem; }

    /* Suvichar */
    .suvichar-section { padding:35px 0; }
    .suvichar-text { font-size:0.97rem; }
    .suvichar-inner { gap:20px; }

    /* Page hero */
    .page-hero-title { font-size:1.7rem; }
    .page-hero { padding:30px 0; }

    /* Aarti card mobile */
    .aarti-card { margin-bottom:12px; }
    .aarti-card-time { font-size:1.5rem; }

    /* History card */
    .history-card-img { height:160px; }

    /* Testimonial */
    .testimonial-card { padding:18px; }
    .testimonial-card::before { font-size:3rem; }

    /* Video card */
    .video-card-body { padding:14px; }

    /* Newsletter */
    .newsletter-section { padding:40px 0; }

    /* Ticker */
    .ticker-bar { display:none; }
}

/* ============================================
   PRINT STYLES
   ============================================ */
@media print {
    .live-bar, .main-navbar, .back-to-top, .whatsapp-float,
    .newsletter-section, .ticker-bar, .reels-section { display:none !important; }
    body { background:#fff; color:#000; }
    .hero-section { min-height:auto; padding:20px 0; }
    .hero-overlay, .hero-bg-image, .hero-bg-video { display:none; }
}

/* ============================================
   DARK MODE (respects system preference)
   ============================================ */
@media (prefers-color-scheme: dark) {
    /* Only applied if user hasn't toggled dark mode manually */
    /* Future: add .dark-mode class support */
}

/* ============================================
   REDUCED MOTION
   ============================================ */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration:0.01ms !important;
        animation-iteration-count:1 !important;
        transition-duration:0.01ms !important;
    }
}

/* ============================================
   HIGH CONTRAST
   ============================================ */
@media (prefers-contrast: high) {
    :root {
        --clr-saffron: #D45F00;
        --clr-blue: #00008B;
    }
}

/* ============================================
   LANDSCAPE MOBILE
   ============================================ */
@media (max-height:500px) and (orientation:landscape) {
    .hero-section { min-height:auto; padding:30px 0; }
    .hero-content { padding:30px 0 20px; }
    .hero-title-hindi { font-size:1.8rem; }
}