/* ==========================================================================
   🔧 TEACHER PAGE REDESIGN SIZING & OVERLAP OVERRIDES (Page-specific)
   ========================================================================== */

/* 1. Prevent absolute positioning & fixed heights on section wrappers */
#comp-laq2vet0,
#comp-l7zszcpf,
#comp-l8tz78cb {
    position: relative !important;
    height: auto !important;
    min-height: auto !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    margin: 0 auto !important;
    width: 100% !important;
}

/* 2. Testimonial Section Adjustments & Refinements */
.premium-testimonials {
    padding: 90px 24px !important;
    position: relative !important;
    background-color: var(--bg-primary) !important;
}

.premium-testimonials__header {
    margin-bottom: 60px !important;
    text-align: center !important;
}

.premium-testimonials__slider-frame {
    max-width: 1060px !important;
    /* Wider to accommodate arrows outside the card */
    margin: 0 auto !important;
    padding: 0 90px !important;
    /* Space for outside navigation arrows */
    position: relative !important;
    overflow: hidden !important;
    /* Allow absolute arrows to overflow frame */
}

main#PAGES_CONTAINER #comp-laq2vet0,
#SITE_CONTAINER #comp-laq2vet0 {
    box-sizing: border-box !important;
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

main#PAGES_CONTAINER #comp-laq2vet0 .LzcnsT,
#SITE_CONTAINER #comp-laq2vet0 .LzcnsT {
    position: absolute !important;
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

main#PAGES_CONTAINER #comp-laq2vet0 .testimonial-slide,
#SITE_CONTAINER #comp-laq2vet0 .testimonial-slide {
    display: flex !important;
    align-items: center !important;
    /* Centered testimonial content vertically */
    justify-content: center !important;
    min-height: auto !important;
    height: 100% !important;
    box-sizing: border-box !important;
    background: transparent !important;
    background-color: transparent !important;
}

main#PAGES_CONTAINER #comp-laq2vf82 img,
#SITE_CONTAINER #comp-laq2vf82 img {
    filter: brightness(0) invert(1) opacity(0.85) !important;
}

#comp-laq2vet0 .testimonial-grid-container,
#comp-laq2vet0 .gpDCD5 {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: auto !important;
}

main#PAGES_CONTAINER #comp-laq2vet0 .custom-testimonial-card,
#SITE_CONTAINER #comp-laq2vet0 .custom-testimonial-card {
    background: rgba(18, 18, 20, 0.85) !important;
    /* Dark premium style */
    background-color: rgba(18, 18, 20, 0.85) !important;
    border: 1px solid rgba(230, 0, 35, 0.15) !important;
    border-radius: 16px !important;
    padding: 45px 50px !important;
    /* Improved inner spacing */
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    max-width: 860px !important;
    /* Increased content area width */
    width: 100% !important;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    display: flex !important;
    align-items: center !important;
    /* Vertical centering */
    justify-content: center !important;
    margin: 0 auto !important;
}

#comp-laq2vet0 .custom-testimonial-content {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    gap: 20px !important;
    width: 100% !important;
}

/* Typography styles for dark theme card readability */
main#PAGES_CONTAINER #comp-laq2vet0 .custom-black-text,
#SITE_CONTAINER #comp-laq2vet0 .custom-black-text {
    color: #e4e4e7 !important;
    /* Premium light text color */
    font-family: var(--font-body) !important;
    font-size: 16px !important;
    font-style: italic !important;
    line-height: 1.8 !important;
    /* Better line-height for readability */
    margin: 0 0 15px 0 !important;
    /* Better paragraph spacing */
    text-align: center !important;
}

main#PAGES_CONTAINER #comp-laq2vet0 .custom-black-text:last-child,
#SITE_CONTAINER #comp-laq2vet0 .custom-black-text:last-child {
    margin-bottom: 0 !important;
}

main#PAGES_CONTAINER #comp-laq2vet0 .custom-red-text,
#SITE_CONTAINER #comp-laq2vet0 .custom-red-text {
    color: var(--primary) !important;
    /* Premium red color */
    font-family: var(--font-heading) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
    margin: 0 0 10px 0 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

/* Position testimonial arrows outside card on large screens */
#comp-laq2vet0 button.eranmg {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 1000 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

#comp-laq2vet0 button[data-testid="prevButton"] {
    left: -65px !important;
    /* Safely outside content area */
    right: auto !important;
}

#comp-laq2vet0 button[data-testid="nextButton"] {
    right: -65px !important;
    /* Safely outside content area */
    left: auto !important;
}

/* Dots wrapper margin adjust */
.testimonial-dots-container {
    margin-top: 35px !important;
}

/* Responsive adjustment for testimonial arrows */
@media (max-width: 900px) {
    .premium-testimonials__slider-frame {
        padding: 0 65px !important;
    }

    #comp-laq2vet0 button[data-testid="prevButton"] {
        left: -45px !important;
    }

    #comp-laq2vet0 button[data-testid="nextButton"] {
        right: -45px !important;
    }
}

@media (max-width: 600px) {
    #comp-laq2vet0 .custom-testimonial-card {
        padding: 30px 25px !important;
    }

    .premium-testimonials__slider-frame {
        padding: 0 !important;
    }

    #comp-laq2vet0 button.eranmg {
        position: relative !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
        display: inline-flex !important;
        margin: 15px 10px !important;
        z-index: 100 !important;
    }
}

/* 3. 3 Simple Steps Section Adjustments */
.premium-steps {
    padding: 80px 24px 100px 24px !important;
    position: relative !important;
    height: auto !important;
}

.premium-step-card {
    min-height: 280px !important;
    /* Force steps cards to be taller for teacher page content */
    height: auto !important;
}

.premium-step-card__number {
    z-index: 1 !important;
    pointer-events: none !important;
}

.premium-step-card__title,
.premium-step-card__text,
.premium-step-card__icon {
    position: relative !important;
    z-index: 2 !important;
}

/* 4. Pricing & Features Section Adjustments */
.premium-pricing {
    padding: 80px 24px !important;
    position: relative !important;
    height: auto !important;
}

.pricing-card {
    height: auto !important;
    min-height: 700px !important;
    /* Force cards to grow naturally */
    display: flex !important;
    flex-direction: column !important;
}

.premium-pricing__grid {
    height: auto !important;
}

/* ==========================================================================
   📱 COMPREHENSIVE RESPONSIVE DESIGN ADJUSTMENTS FOR TEACHER PAGE
   ========================================================================== */

/* Universal Overrides for Cards (Applies to all screens <= 1024px) */
@media (max-width: 1024px) {

    .premium-step-card,
    .pricing-card,
    .benefit-card,
    .info-card,
    .cta-box,
    .custom-testimonial-card {
        height: auto !important;
        min-height: auto !important;
        max-height: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Allow testimonial container and arrows to be visible without clipping */
    main#PAGES_CONTAINER #comp-laq2vet0,
    #SITE_CONTAINER #comp-laq2vet0 {
        overflow: visible !important;
    }
}

/* Tablet Breakpoint (768px - 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {

    /* Hero Section */
    .premium-hero {
        margin-top: 80px !important;
        height: calc(60vh - 80px) !important;
        min-height: 450px !important;
        max-height: 550px !important;
    }

    /* Two Ways to Teach */
    .premium-info-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 24px !important;
        padding: 0 24px !important;
    }

    /* Why Teach With Aeyons */
    .premium-benefits__grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 24px !important;
    }

    /* 3 Simple Steps */
    .premium-steps__grid {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 20px !important;
    }

    .premium-step-card {
        padding: 24px 20px !important;
    }

    .premium-step-card__number {
        font-size: 54px !important;
        top: 15px !important;
        right: 15px !important;
        opacity: 0.08 !important;
        z-index: 1 !important;
    }

    .premium-step-card__title {
        font-size: 18px !important;
        z-index: 2 !important;
    }

    .premium-step-card__text {
        font-size: 14px !important;
        z-index: 2 !important;
    }

    /* Testimonials */
    .premium-testimonials__slider-frame {
        max-width: 100% !important;
        padding: 0 80px !important;
        box-sizing: border-box !important;
    }

    #comp-laq2vet0 .custom-testimonial-card {
        max-width: 100% !important;
        padding: 35px 30px !important;
    }

    #comp-laq2vet0 button[data-testid="prevButton"] {
        left: -55px !important;
    }

    #comp-laq2vet0 button[data-testid="nextButton"] {
        right: -55px !important;
    }

    /* Pricing & Features */
    #comp-l7zszcpf .premium-pricing__grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 24px !important;
        max-width: 100% !important;
        padding: 0 24px !important;
    }

    #comp-l7zszcpf .premium-pricing__grid> :last-child {
        grid-column: span 2 !important;
        max-width: 500px !important;
        margin: 0 auto !important;
        width: 100% !important;
    }

    /* Compare CTA */
    [data-mesh-id="comp-keceeepzinlineContent-gridContainer"],
    #comp-keceeepzinlineContent-gridContainer {
        display: grid !important;
        grid-template-columns: 1fr auto !important;
        align-items: center !important;
        gap: 30px !important;
        padding: 40px 24px !important;
    }

    #comp-lbbmpv3w {
        grid-column: 1 !important;
        width: 100% !important;
        margin: 0 !important;
    }

    #comp-lbbmrcfh {
        grid-column: 2 !important;
        justify-self: end !important;
        min-width: 180px !important;
        margin: 0 !important;
        flex-shrink: 0 !important;
    }
}

/* Specific Tablet adjustments for width: 820px to 950px */
@media (min-width: 768px) and (max-width: 950px) {

    /* Stack steps to 2 columns on smaller tablets to prevent overlap */
    .premium-steps__grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .premium-steps__grid> :last-child {
        grid-column: span 2 !important;
        max-width: 500px !important;
        margin: 0 auto !important;
    }
}

/* Mobile Breakpoint (< 768px) */
@media (max-width: 767px) {

    /* Hero Section */
    .premium-hero {
        margin-top: 80px !important;
        height: calc(45vh - 80px) !important;
        min-height: 320px !important;
        max-height: 420px !important;
    }

    /* Two Ways to Teach */
    .premium-info-grid {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
        padding: 0 16px !important;
    }

    .info-card {
        padding: 24px 16px !important;
    }

    .info-card__title {
        font-size: 20px !important;
    }

    /* Why Teach With Aeyons */
    .premium-benefits {
        padding: 60px 16px !important;
    }

    .premium-benefits__grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    .benefit-card {
        padding: 24px 20px !important;
    }

    .premium-benefits__title {
        font-size: 26px !important;
    }

    /* 3 Simple Steps */
    .premium-steps {
        padding: 60px 16px 80px 16px !important;
    }

    .premium-steps__grid {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }

    .premium-step-card {
        padding: 30px 20px !important;
    }

    .premium-step-card__number {
        font-size: 60px !important;
        opacity: 0.08 !important;
        top: 10px !important;
        right: 15px !important;
        left: auto !important;
        transform: none !important;
        z-index: 1 !important;
    }

    /* Testimonials */
    .premium-testimonials__slider-frame {
        padding: 0 !important;
    }

    #comp-laq2vet0 .custom-testimonial-card {
        padding: 24px 20px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
    }

    .testimonial-slide {
        padding-bottom: 75px !important;
    }

    .testimonial-dots-container {
        bottom: 45px !important;
    }

    #comp-laq2vet0 button.eranmg {
        bottom: 8px !important;
    }

    /* Pricing & Features */
    .premium-pricing {
        padding: 60px 16px !important;
    }

    .premium-pricing__title {
        font-size: 26px !important;
    }

    #comp-l7zszcpf .premium-pricing__grid {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
        padding: 0 16px !important;
    }

    .pricing-card {
        padding: 30px 20px !important;
    }

    /* Need More Info */
    .premium-cta-section {
        padding: 60px 16px !important;
    }

    .premium-cta-section__title {
        font-size: 26px !important;
        margin-bottom: 30px !important;
    }

    .premium-cta-section__grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    .cta-box {
        padding: 24px 20px !important;
    }

    /* Compare CTA */
    [data-mesh-id="comp-keceeepzinlineContent-gridContainer"],
    #comp-keceeepzinlineContent-gridContainer {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        gap: 20px !important;
        padding: 30px 16px !important;
    }

    #comp-lbbmpv3w {
        width: 100% !important;
    }

    #comp-lbbmpv3w h4 {
        text-align: center !important;
    }

    #comp-lbbmrcfh {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        margin: 0 auto !important;
    }

    #comp-lbbmrcfh a {
        width: 100% !important;
        max-width: 280px !important;
    }
}

/* Small Screen Mobile Breakpoint (320px - 425px) */
@media (max-width: 425px) {
    .premium-welcome__tagline {
        font-size: 20px !important;
    }

    .premium-welcome__subtitle {
        font-size: 14px !important;
    }

    .premium-hero__logo {
        width: 90px !important;
    }

    .pricing-card__price {
        font-size: 36px !important;
    }
}
