/* ============================================
   ShivBodh Trust — Full Responsive System
   Desktop (1200+) | Tablet (769-1199) | Mobile (≤768) | Small (≤480)
   ============================================ */

/* ---- ACCESSIBILITY ---- */
.sb-skip-link {
    position: absolute;
    top: -100%;
    left: 50%;
    transform: translateX(-50%);
    background: var(--sb-saffron);
    color: var(--sb-white);
    padding: 0.75rem 1.5rem;
    border-radius: 0 0 var(--sb-radius-md) var(--sb-radius-md);
    z-index: 9999;
    font-weight: 600;
    text-decoration: none;
    transition: top var(--sb-transition-fast);
}
.sb-skip-link:focus { top: 0; color: var(--sb-white); }

.sb-btn:focus-visible,
.sb-nav-link:focus-visible,
.sb-mobile-nav-link:focus-visible,
.sb-theme-toggle:focus-visible,
.sb-scroll-top:focus-visible,
.sb-footer-social-link:focus-visible,
.sb-peetham-card:focus-visible,
.sb-article-card:focus-visible {
    outline: 2px solid var(--sb-saffron);
    outline-offset: 2px;
}

/* ============================================
   TABLET (769px – 1024px)
   ============================================ */
@media (min-width: 769px) and (max-width: 1024px) {

    /* Container */
    .sb-container { max-width: 720px; }

    /* Header */
    .sb-header-inner { padding: 0 var(--sb-space-lg); }
    .sb-logo img { height: 42px; }
    .sb-header.scrolled .sb-logo img { height: 36px; }
    .sb-logo-text { display: none; }
    .sb-nav { gap: var(--sb-space-xs); }
    .sb-nav-link { padding: 0.5rem 0.6rem; font-size: var(--sb-text-sm); }

    /* Hero */
    .sb-hero { min-height: auto; padding: calc(var(--sb-header-height, 72px) + var(--sb-space-xl)) 0 var(--sb-space-xl); }
    .sb-hero-grid { grid-template-columns: 1fr; gap: var(--sb-space-2xl); text-align: center; }
    .sb-hero-badge { justify-content: center; }
    .sb-hero-title { font-size: var(--sb-text-4xl); }
    .sb-hero-subtitle { max-width: 600px; margin: 0 auto; }
    .sb-hero-actions { justify-content: center; }
    .sb-hero-chips { justify-content: center; }
    .sb-hero-media { max-width: 400px; margin: 0 auto; }
    .sb-hero-quote { max-width: 500px; margin: var(--sb-space-lg) auto 0; }

    /* Stats */
    .sb-stats-grid { grid-template-columns: repeat(4, 1fr); gap: var(--sb-space-md); }
    .sb-stat-number { font-size: var(--sb-text-3xl); }

    /* Peetham Cards */
    .sb-peetham-grid { grid-template-columns: repeat(2, 1fr); gap: var(--sb-space-lg); }

    /* About */
    .sb-about-grid { grid-template-columns: 1fr; gap: var(--sb-space-2xl); text-align: center; }
    .sb-about-image { max-width: 480px; margin: 0 auto; }
    .sb-about-content { text-align: left; }
    .sb-about-features { grid-template-columns: repeat(2, 1fr); }

    /* Steps */
    .sb-steps-grid { grid-template-columns: repeat(4, 1fr); gap: var(--sb-space-md); }

    /* Articles */
    .sb-articles-grid { grid-template-columns: repeat(2, 1fr); gap: var(--sb-space-lg); }

    /* CTA */
    .sb-cta-title { font-size: var(--sb-text-4xl); }

    /* Footer */
    .sb-footer-grid { grid-template-columns: repeat(2, 1fr); gap: var(--sb-space-xl); }
    .sb-footer-brand { grid-column: span 2; max-width: 100%; }
    .sb-footer-bottom { flex-direction: row; text-align: left; }

    /* Service pages */
    .sb-booking-box { position: static; }
    .sb-related-grid { grid-template-columns: repeat(2, 1fr); }

    /* Sidebar */
    .sb-content-layout { grid-template-columns: 1fr; }
    .sb-sidebar { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sb-space-md); position: static; }
    .sb-sidebar-widget { margin-bottom: 0; }

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

/* ============================================
   MOBILE (≤ 768px)
   ============================================ */
@media (max-width: 768px) {

    /* ---- GLOBAL ---- */
    .sb-container { padding: 0 var(--sb-space-md); }
    html { font-size: 15px; -webkit-text-size-adjust: 100%; }

    /* ---- HEADER ---- */
    .sb-header-inner { padding: 0 var(--sb-space-md); height: 60px; }
    .sb-logo img { height: 36px; }
    .sb-header.scrolled .sb-logo img { height: 32px; }
    .sb-logo-text { display: none; }
    .sb-nav { display: none; }
    .sb-header-actions { gap: var(--sb-space-sm); }

    /* Mobile toggle */
    .sb-mobile-toggle { display: flex; width: 40px; height: 40px; }
    .sb-mobile-toggle span { width: 22px; height: 2px; }

    /* Mobile nav overlay */
    .sb-mobile-nav {
        display: block; /* override style.css display:none */
        position: fixed; top: 60px; left: 0; right: 0; bottom: 0;
        background: var(--sb-white);
        padding: var(--sb-space-md);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        z-index: var(--sb-z-overlay);
        transform: translateX(100%);
        transition: transform var(--sb-transition-base);
    }
    .sb-mobile-nav.active { transform: translateX(0); }
    .sb-mobile-nav-list { list-style: none; padding: 0; margin: 0; }
    .sb-mobile-nav-link {
        display: flex; align-items: center; justify-content: space-between;
        padding: var(--sb-space-md); font-size: var(--sb-text-base);
        color: var(--sb-gray-800); text-decoration: none;
        border-bottom: 1px solid var(--sb-gray-100);
        font-weight: 500;
    }
    .sb-mobile-nav-link:active { background: var(--sb-cream); }
    .sb-mobile-submenu { display: none; padding-left: var(--sb-space-lg); }
    .sb-mobile-submenu.active { display: block; }
    .sb-mobile-submenu a {
        display: block; padding: var(--sb-space-sm) var(--sb-space-md);
        font-size: var(--sb-text-sm); color: var(--sb-gray-600);
        text-decoration: none; border-bottom: 1px solid var(--sb-gray-100);
    }

    /* ---- HERO ---- */
    .sb-hero {
        min-height: auto;
        padding: calc(60px + var(--sb-space-lg)) 0 var(--sb-space-xl);
    }
    .sb-hero-grid { grid-template-columns: 1fr; gap: var(--sb-space-xl); text-align: center; }
    .sb-hero-badge { justify-content: center; font-size: var(--sb-text-xs); }
    .sb-hero-title { font-size: var(--sb-text-3xl); line-height: 1.15; }
    .sb-hero-subtitle { font-size: var(--sb-text-sm); line-height: 1.6; }
    .sb-hero-actions { flex-direction: column; gap: var(--sb-space-sm); }
    .sb-hero-actions .sb-btn { width: 100%; text-align: center; }
    .sb-hero-chips { flex-wrap: wrap; justify-content: center; gap: var(--sb-space-xs); }
    .sb-hero-chip { font-size: 0.65rem; padding: 0.3rem 0.6rem; }
    .sb-hero-media { max-width: 280px; margin: 0 auto; }
    .sb-hero-media img { width: 100%; height: auto; border-radius: var(--sb-radius-lg); }
    .sb-hero-quote { padding: var(--sb-space-md); margin-top: var(--sb-space-md); }
    .sb-hero-quote-text { font-size: var(--sb-text-lg); }
    .sb-hero-quote-translation { font-size: var(--sb-text-xs); }
    .sb-scroll-indicator { display: none; }

    /* ---- STATS ---- */
    .sb-stats { padding: var(--sb-space-xl) 0; }
    .sb-stats-grid { grid-template-columns: repeat(2, 1fr); gap: var(--sb-space-sm); }
    .sb-stat-item { padding: var(--sb-space-md) var(--sb-space-sm); }
    .sb-stat-number { font-size: var(--sb-text-2xl); }
    .sb-stat-label { font-size: var(--sb-text-xs); }

    /* ---- SECTIONS ---- */
    .sb-section { padding: var(--sb-space-2xl) 0; }
    .sb-section-header { margin-bottom: var(--sb-space-xl); }
    .sb-section-title { font-size: var(--sb-text-2xl); line-height: 1.2; }
    .sb-section-desc { font-size: var(--sb-text-sm); line-height: 1.6; }
    .sb-section-label { font-size: 0.65rem; margin-bottom: var(--sb-space-xs); }

    /* ---- PEETHAM CARDS ---- */
    .sb-peetham-grid { grid-template-columns: 1fr; gap: var(--sb-space-md); }
    .sb-peetham-card { border-radius: var(--sb-radius-lg); overflow: hidden; }
    .sb-peetham-card-image { height: 160px; }
    .sb-peetham-card-body { padding: var(--sb-space-md); }
    .sb-peetham-card-title { font-size: var(--sb-text-lg); }
    .sb-peetham-card-mahavakya { font-size: var(--sb-text-xs); }

    /* ---- ABOUT ---- */
    .sb-about-grid { grid-template-columns: 1fr; gap: var(--sb-space-xl); text-align: center; }
    .sb-about-image { max-width: 100%; }
    .sb-about-image img { width: 100%; height: auto; border-radius: var(--sb-radius-lg); }
    .sb-about-content { text-align: left; }
    .sb-about-content h2 { font-size: var(--sb-text-2xl); }
    .sb-about-features { grid-template-columns: 1fr; gap: var(--sb-space-sm); }
    .sb-about-feature { padding: var(--sb-space-sm); gap: var(--sb-space-sm); }
    .sb-about-feature-icon { width: 36px; height: 36px; font-size: 1.1rem; flex-shrink: 0; }
    .sb-about-feature-text h4 { font-size: var(--sb-text-sm); }
    .sb-about-feature-text p { font-size: var(--sb-text-xs); }
    .sb-about-image-badge { bottom: var(--sb-space-sm); left: var(--sb-space-sm); padding: var(--sb-space-xs) var(--sb-space-sm); }
    .sb-about-image-badge-number { font-size: var(--sb-text-xl); }
    .sb-about-image-badge-label { font-size: 0.6rem; }

    /* ---- STEPS ---- */
    .sb-steps-grid { grid-template-columns: repeat(2, 1fr); gap: var(--sb-space-sm); }
    .sb-step-card { padding: var(--sb-space-md); text-align: center; }
    .sb-step-card h3 { font-size: var(--sb-text-sm); }
    .sb-step-card p { font-size: var(--sb-text-xs); }

    /* ---- ARTICLES ---- */
    .sb-articles-grid { grid-template-columns: 1fr; gap: var(--sb-space-md); }
    .sb-article-card { border-radius: var(--sb-radius-lg); }
    .sb-article-card-image { height: 180px; }
    .sb-article-card-body { padding: var(--sb-space-md); }
    .sb-article-card-title { font-size: var(--sb-text-base); }
    .sb-article-card-excerpt { font-size: var(--sb-text-xs); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

    /* ---- CTA ---- */
    .sb-cta { padding: var(--sb-space-2xl) 0; }
    .sb-cta-title { font-size: var(--sb-text-2xl); }
    .sb-cta-text { font-size: var(--sb-text-sm); }
    .sb-cta-content > div:last-child { flex-direction: column; align-items: stretch; }
    .sb-cta-content .sb-btn { width: 100%; text-align: center; }

    /* ---- FOOTER ---- */
    .sb-footer { padding-top: var(--sb-space-2xl); }
    .sb-footer-grid { grid-template-columns: 1fr; gap: var(--sb-space-xl); }
    .sb-footer-brand { grid-column: span 1; text-align: center; }
    .sb-footer-brand .sb-footer-logo { justify-content: center; }
    .sb-footer-desc { text-align: center; }
    .sb-footer-social { justify-content: center; }
    .sb-footer-heading { font-size: var(--sb-text-sm); text-align: center; }
    .sb-footer-links { text-align: center; }
    .sb-footer-links a { font-size: var(--sb-text-sm); padding: var(--sb-space-xs) 0; display: block; }
    .sb-footer-sanskrit { font-size: var(--sb-text-sm); text-align: center; padding: var(--sb-space-md) 0; }
    .sb-footer-bottom { flex-direction: column; gap: var(--sb-space-sm); text-align: center; }
    .sb-footer-bottom-links { flex-wrap: wrap; justify-content: center; gap: var(--sb-space-sm); }
    .sb-footer-newsletter { text-align: center; }
    .sb-newsletter-form { flex-direction: column; gap: var(--sb-space-sm); }
    .sb-newsletter-input { width: 100%; }
    .sb-newsletter-btn { width: 100%; }

    /* ---- PAGE HEADER ---- */
    .sb-page-header { padding: calc(60px + var(--sb-space-lg)) 0 var(--sb-space-lg); }
    .sb-page-header h1 { font-size: var(--sb-text-2xl); line-height: 1.2; }
    .sb-page-header p { font-size: var(--sb-text-sm); }
    .sb-breadcrumb { font-size: var(--sb-text-xs); margin-bottom: var(--sb-space-sm); }

    /* ---- ARTICLE CONTENT ---- */
    .sb-article-content { font-size: var(--sb-text-base); line-height: 1.7; }
    .sb-article-content h2 { font-size: var(--sb-text-xl); margin-top: var(--sb-space-xl); }
    .sb-article-content h3 { font-size: var(--sb-text-lg); }
    .sb-article-content p { margin-bottom: var(--sb-space-md); }
    .sb-article-content img { max-width: 100%; height: auto; border-radius: var(--sb-radius-md); }
    .sb-article-content blockquote { padding: var(--sb-space-md); margin: var(--sb-space-lg) 0; border-left-width: 3px; }
    .sb-article-content ul, .sb-article-content ol { padding-left: var(--sb-space-xl); margin-bottom: var(--sb-space-md); }

    /* ---- SERVICE / PUJA PAGES ---- */
    .sb-puja-hero { min-height: auto; padding: calc(60px + var(--sb-space-lg)) 0 var(--sb-space-lg); }
    .sb-booking-box { position: static; margin-top: var(--sb-space-xl); padding: var(--sb-space-lg); }
    .sb-related-grid { grid-template-columns: 1fr; gap: var(--sb-space-md); }

    /* ---- PEETHAM PAGES ---- */
    .sb-peetham-hero { min-height: auto; padding: calc(60px + var(--sb-space-lg)) 0 var(--sb-space-lg); }

    /* ---- BUTTONS ---- */
    .sb-btn { padding: 0.75rem 1.25rem; font-size: var(--sb-text-sm); border-radius: var(--sb-radius-md); }
    .sb-btn-sm { padding: 0.5rem 0.875rem; font-size: var(--sb-text-xs); }
    .sb-btn-lg { padding: 0.875rem 1.5rem; font-size: var(--sb-text-base); }

    /* ---- FORMS ---- */
    .sb-form-input, .sb-form-textarea, .sb-form-select {
        padding: 0.75rem; font-size: var(--sb-text-sm); width: 100%;
        border-radius: var(--sb-radius-md);
    }
    .sb-form-textarea { min-height: 120px; }

    /* ---- FAQ ---- */
    .sb-faq-question { font-size: var(--sb-text-sm); padding: var(--sb-space-md); }
    .sb-faq-answer-content { padding: 0 var(--sb-space-md) var(--sb-space-md); font-size: var(--sb-text-sm); }

    /* ---- CONTACT ---- */
    .sb-contact-grid { grid-template-columns: 1fr; gap: var(--sb-space-xl); }
    .sb-contact-info-card { padding: var(--sb-space-md); }
    .sb-contact-info-icon { width: 40px; height: 40px; font-size: 1rem; }

    /* ---- SIDEBAR ---- */
    .sb-sidebar { display: block; }
    .sb-sidebar-widget { margin-bottom: var(--sb-space-lg); }

    /* ---- THEME TOGGLE ---- */
    .sb-theme-toggle { width: 36px; height: 36px; font-size: 1rem; }

    /* ---- SCROLL TOP ---- */
    .sb-scroll-top { width: 40px; height: 40px; bottom: var(--sb-space-md); right: var(--sb-space-md); font-size: 1rem; }

    /* ---- TICKER ---- */
    .sb-ticker { font-size: var(--sb-text-sm) !important; }

    /* ---- GITA GRID ---- */
    .sb-gita-grid { grid-template-columns: repeat(2, 1fr); gap: var(--sb-space-sm); }
    .sb-gita-card { padding: var(--sb-space-sm); }
    .sb-gita-card-number { width: 36px; height: 36px; font-size: var(--sb-text-sm); }
    .sb-gita-card-title { font-size: var(--sb-text-xs); }
}

/* ============================================
   SMALL MOBILE (≤ 480px)
   ============================================ */
@media (max-width: 480px) {
    .sb-container { padding: 0 var(--sb-space-sm); }
    html { font-size: 14px; }

    .sb-hero-title { font-size: var(--sb-text-2xl); }
    .sb-hero-subtitle { font-size: var(--sb-text-xs); }
    .sb-hero-media { max-width: 220px; }
    .sb-hero-quote-text { font-size: var(--sb-text-base); }

    .sb-stats-grid { gap: var(--sb-space-xs); }
    .sb-stat-item { padding: var(--sb-space-sm); }
    .sb-stat-number { font-size: var(--sb-text-xl); }
    .sb-stat-label { font-size: 0.6rem; }

    .sb-section-title { font-size: var(--sb-text-xl); }
    .sb-step-card { padding: var(--sb-space-sm); }

    .sb-footer-heading { font-size: var(--sb-text-xs); }
    .sb-footer-links a { font-size: var(--sb-text-xs); }

    .sb-gita-grid { grid-template-columns: 1fr 1fr; gap: var(--sb-space-xs); }
    .sb-gita-card { padding: var(--sb-space-xs); }
    .sb-gita-card-number { width: 32px; height: 32px; font-size: var(--sb-text-xs); }

    .sb-peetham-card-image { height: 140px; }
    .sb-article-card-image { height: 160px; }

    .sb-mobile-nav-link { padding: var(--sb-space-sm) var(--sb-space-md); font-size: var(--sb-text-sm); }
    .sb-mobile-submenu a { padding: var(--sb-space-xs) var(--sb-space-md); font-size: var(--sb-text-xs); }
}

/* ============================================
   LANDSCAPE MOBILE
   ============================================ */
@media (max-height: 500px) and (orientation: landscape) {
    .sb-hero { min-height: auto; padding-top: calc(60px + var(--sb-space-md)); padding-bottom: var(--sb-space-md); }
    .sb-hero-grid { gap: var(--sb-space-md); }
    .sb-hero-media { display: none; }
    .sb-page-header { padding: calc(60px + var(--sb-space-md)) 0 var(--sb-space-md); }
}

/* ============================================
   RETINA / HIGH DPI
   ============================================ */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .sb-header { border-bottom-width: 0.5px; }
    .sb-peetham-card, .sb-article-card, .sb-faq-item, .sb-sidebar-widget { border-width: 0.5px; }
}

/* ============================================
   REDUCED MOTION
   ============================================ */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    .sb-fade-in { opacity: 1; transform: none; }
    .sb-scroll-indicator { animation: none; }
}

/* ============================================
   PRINT
   ============================================ */
@media print {
    .sb-header, .sb-footer, .sb-scroll-top, .sb-mobile-nav, .sb-mobile-toggle,
    .sb-theme-toggle, .sb-hero, .sb-stats, .sb-cta, .sb-sidebar { display: none !important; }
    body { font-size: 11pt; color: #000; background: #fff; line-height: 1.5; }
    .sb-container { max-width: 100%; padding: 0; }
    .sb-article-content { font-size: 11pt; }
    a { color: #000; text-decoration: underline; }
    a[href]::after { content: " (" attr(href) ")"; font-size: 9pt; color: #666; }
}