/* ==========================================================================
   Main Stylesheet (Imports & Global Tweaks)
   ========================================================================== */

/* Hide scrollbar for Lenis smooth scrolling (custom scrollbar can be added if needed) */
::-webkit-scrollbar {
    width: 0;
    background: transparent;
}

/* Ensure smooth scrolling structure */
html.lenis {
    height: auto;
}
.lenis.lenis-smooth {
    scroll-behavior: auto;
}
.lenis.lenis-smooth [data-lenis-prevent] {
    overscroll-behavior: contain;
}
.lenis.lenis-stopped {
    overflow: hidden;
}

/* Base structural fixes */
#smooth-wrapper {
    overflow: clip; /* Changed from hidden to clip to preserve native sticky positioning */
    position: relative;
    width: 100%;
}

#smooth-content {
    width: 100%;
}

/* Utility overrides for Bootstrap */
.bg-black {
    background-color: var(--color-black) !important;
}

.text-white {
    color: var(--color-white) !important;
}

/* Blurred price digits */
.price-blur-x {
    display: inline-block;
    filter: blur(0.12em);
    padding: 0 0.05em;
    letter-spacing: 0.04em;
    user-select: none;
    -webkit-user-select: none;
    vertical-align: baseline;
    font-weight: inherit;
}

/* Rupee symbol positioning - 0.7mm to the left */
.rupee-symbol {
    display: inline-block;
    position: relative;
    left: -0.7mm;
    vertical-align: baseline;
}


/* ==========================================================================
   TAB VIEW & MOBILE BROWSER DESKTOP MODE (740px to 1024px)
   Renders the exact 1440x900 Desktop Screen Ratio and Layout
   Each section looks identical to desktop screen size on tabs
   Does not touch Mobile (< 740px) or Desktop (>= 1025px)
   ========================================================================== */
@media screen and (min-width: 740px) and (max-width: 1024px) {
    html {
        width: 1440px !important;
        zoom: calc(100vw / 1440) !important;
        -webkit-text-size-adjust: 100% !important;
        text-size-adjust: 100% !important;
    }

    body {
        width: 1440px !important;
        min-width: 1440px !important;
        overflow-x: hidden !important;
    }

    .desktop-header {
        width: 1440px !important;
        max-width: 1440px !important;
        padding: 1.25rem 3rem !important;
    }

    /* Bootstrap Grid Desktop Columns at full 1440px proportions */
    .row > .col-lg-1 { flex: 0 0 auto; width: 8.33333333% !important; }
    .row > .col-lg-2 { flex: 0 0 auto; width: 16.66666667% !important; }
    .row > .col-lg-3 { flex: 0 0 auto; width: 25% !important; }
    .row > .col-lg-4 { flex: 0 0 auto; width: 33.33333333% !important; }
    .row > .col-lg-5 { flex: 0 0 auto; width: 41.66666667% !important; }
    .row > .col-lg-6 { flex: 0 0 auto; width: 50% !important; }
    .row > .col-lg-7 { flex: 0 0 auto; width: 58.33333333% !important; }
    .row > .col-lg-8 { flex: 0 0 auto; width: 66.66666667% !important; }
    .row > .col-lg-9 { flex: 0 0 auto; width: 75% !important; }
    .row > .col-lg-10 { flex: 0 0 auto; width: 83.33333333% !important; }
    .row > .col-lg-11 { flex: 0 0 auto; width: 91.66666667% !important; }
    .row > .col-lg-12 { flex: 0 0 auto; width: 100% !important; }

    .row > .offset-lg-1 { margin-left: 8.33333333% !important; }
    .row > .offset-lg-2 { margin-left: 16.66666667% !important; }
    .row > .offset-lg-3 { margin-left: 25% !important; }
    .row > .offset-lg-4 { margin-left: 33.33333333% !important; }
    .row > .offset-lg-5 { margin-left: 41.66666667% !important; }
    .row > .offset-lg-6 { margin-left: 50% !important; }

    /* Bootstrap Desktop Display Utilities */
    .d-lg-none { display: none !important; }
    .d-block.d-lg-none { display: none !important; }
    .d-flex.d-lg-none { display: none !important; }
    .d-inline.d-lg-none { display: none !important; }
    .d-inline-flex.d-lg-none { display: none !important; }
    .d-inline-block.d-lg-none { display: none !important; }

    .d-none.d-lg-block { display: block !important; }
    .d-none.d-lg-flex { display: flex !important; }
    .d-none.d-lg-inline { display: inline !important; }
    .d-none.d-lg-inline-flex { display: inline-flex !important; }
    .d-none.d-lg-inline-block { display: inline-block !important; }
    .d-none.d-lg-grid { display: grid !important; }
}


/* ==========================================================================
   BROWSER DESKTOP MODE OF MOBILE VIEW ONLY
   Crop bottom empty space like the studio page without altering
   Mobile view, Desktop view, or Tab view
   ========================================================================== */
html.mobile-desktop-mode,
html.mobile-desktop-mode body {
    min-height: 100% !important;
}

html.mobile-desktop-mode body {
    display: flex !important;
    flex-direction: column !important;
    overflow-x: hidden !important;
}

html.mobile-desktop-mode main,
html.mobile-desktop-mode #smooth-wrapper,
html.mobile-desktop-mode .training-page-wrapper,
html.mobile-desktop-mode .studio-page-wrapper,
html.mobile-desktop-mode .manjunath-page-wrapper,
html.mobile-desktop-mode .rt-tool-main,
html.mobile-desktop-mode .legal-page main {
    flex: 1 0 auto !important;
    min-height: auto !important;
}

html.mobile-desktop-mode .site-footer {
    margin-top: auto !important;
    flex-shrink: 0 !important;
}