/* ==========================================================================
   Superfonik for Schools — tablet styles
   ========================================================================== */
@media (min-width: 768px) {

    /* HERO — header / top bar -------------------------------------------- */
    .superfonik-school-hero-section .superfonik-school-header-content {
        justify-content: space-between;
        padding: 27px 22px;
    }

    .superfonik-school-hero-section .superfonik-school-header-content .superfonik-button-container {
        display: block;
        margin: 0;
    }

    .superfonik-school-hero-section .superfonik-school-logo-lockup {
        flex-direction: row;
        align-items: center;
        gap: 10px;
    }

    .superfonik-school-hero-section .superfonik-school-logo {
        width: 148.5px;
        display: block;
    }

    .superfonik-school-hero-section .superfonik-school-for-schools-label {
        margin-left: 0;
        font-size: 20.57px;
        line-height: 30px;
    }

    /* HERO — content ----------------------------------------------------- */
    .superfonik-school-hero-section .superfonik-school-hero-content {
        max-width: 734px;
        margin-top: 70px;
        margin-bottom: 55px;
    }

    .superfonik-school-hero-section .superfonik-school-hero-character {
        width: 250px;
        margin-bottom: 16px;
    }

    .superfonik-school-hero-section .superfonik-school-hero-content h1 {
        font-size: 37px;
        line-height: 100%;
    }

    .superfonik-school-hero-section .superfonik-school-hero-content .superfonik-school-hero-content-text {
        font-size: 16.46px;
        line-height: 24px;
        max-width: 505px;
        margin: auto;
        margin-bottom: 25px;
    }

    .superfonik-school-hero-section .superfonik-school-hero-moon {
        width: 2822px;
        height: 225px;
    }

    /* HERO — gameboard / video ------------------------------------------- */
    .superfonik-school-hero-tilted-video .mobile-only { display: none; }
    .superfonik-school-hero-tilted-video .tablet-only { display: block; }

    .superfonik-school-hero-tilted-video {
        margin-top: -145px;
        max-width: 768px;
    }

    .superfonik-school-gameboard-tablet {
        width: 710px;
    }

    .superfonik-school-video,
    .superfonik-school-video-cover {
        width: 600px;
        height: 430px;
        left: 49%;
        top: 47%;
        border-radius: 30px;
    }

    .superfonik-school-video-stat {
        width: 389px;
        right: -15px;
        bottom: -85px;
    }

    /* SETUP — 3 columns -------------------------------------------------- */
    .superfonik-school-setup-section {
        max-width: 720px;
        margin-top: 150px;
    }

    .superfonik-school-setup-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 34px;
    }

    .superfonik-school-setup-title {
        font-size: 37.05px;
        margin-bottom: 34px;
    }

    .superfonik-school-setup-item {
        max-width: 200px;
    }

    .superfonik-school-setup-item.superfonik-school-larger-col {
        max-width: 210px;
    }

    .superfonik-school-setup-item-image {
        height: 142px;
    }

    .superfonik-school-setup-item-image img {
        width: auto;
        max-width: 100%;
        max-height: 142px;
    }

    .superfonik-school-setup-item h3 {
        font-size: 20px;
        margin-bottom: 10px;
    }

    .superfonik-school-setup-item p {
        font-size: 13.72px;
        line-height: 24.01px;
        max-width: 100%;
    }

    /* PROGRESS ----------------------------------------------------------- */
    .superfonik-school-progress-section {
        max-width: 650px;
        margin: 170px auto 0;
    }

    .superfonik-school-progress-image {
        width: 646.58px;
    }

    .superfonik-school-progress-section .superfonik-school-progress-title {
        margin-top: 45px;
        margin-bottom: 20px;
        font-size: 37px;
        max-width: initial;
    }

    .superfonik-school-progress-text {
        max-width: initial;
        font-size: 16px;
        line-height: 24px;
    }

    /* TUTORIAL — side by side -------------------------------------------- */
    .superfonik-school-tutorial-section {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 20px;
        max-width: 720px;
        margin: auto;
        margin-top: 170px;
    }

    .superfonik-school-tutorial-image {
        flex: 0 0 auto;
    }

    .superfonik-school-tutorial-image img {
        width: 320px;
        margin: 0;
    }

    .superfonik-school-tutorial-content {
        flex: 1 1 auto;
        max-width: 356px;
    }

    .superfonik-school-tutorial-content .superfonik-school-tutorial-title {
        font-size: 37px;
    }

    .superfonik-school-tutorial-text {
        font-size: 16px;
        line-height: 24px;
    }

    /* TESTIMONIALS ------------------------------------------------------- */
    .superfonik-school-testimonials-title {
        font-size: 54px;
        max-width: initial;
        margin-bottom: 40px;
    }

    .superfonik-school-testimonial-item {
        width: 350px;
        margin: 25px;
    }

    .superfonik-school-testimonial-item-content {
        min-height: 356px;
    }

    /* EXPERTS — row ------------------------------------------------------ */
    .superfonik-school-experts-section {
        max-width: 720px;
        margin-top: 155px;
    }

    .superfonik-school-experts-text-container {
        flex-direction: row;
        justify-content: center;
        gap: 15px;
    }

    .superfonik-school-experts-text {
        font-size: 22px;
        line-height: 35px;
    }

    .superfonik-school-experts-logos {
        flex-direction: row;
        gap: 10px;
        margin-top: 25px;
    }

    .superfonik-school-expert-plus {
        font-size: 24px;
    }

    /* FORM BUTTON OVERWRITES */

    .superfonik-form-section .superfonik-custom-button span {
        font-size: 20.58px;
    }

    
    .superfonik-form-section .superfonik-custom-button .button-shine {
            width: 21px;
            left: 7px;
    }

    
    .superfonik-form-section .superfonik-custom-button {
        padding: 9px 30px;
    }

}
