/* =========================================================
   TABLET RESPONSIVE
   768px - 1024px
========================================================= */

@media (min-width: 767px) and (max-width: 1024px) {


    /* =====================================================
       NAVBAR
    ===================================================== */

    .navbar {
        height: 72px;
    }

    .navbar-container {
        padding: 0 4%;
    }

    .brand {
        gap: 9px;
    }

    .logo-icon {
        width: 42px;
        height: 42px;
    }

    .brand-name {
        font-size: 21px;
    }

    .nav-links {
        gap: 25px;
        font-size: 14px;
    }

    .nav-links a {
        padding: 27px 0;
    }


    /* =====================================================
       HERO
    ===================================================== */

    .bca-hero {
        min-height: 405px;

        padding: 45px 4% 45px;

        align-items: flex-start;
    }


    /* =====================================================
       HERO CONTENT
    ===================================================== */

    .bca-hero-content {
        max-width: 760px;
    }


    /* =====================================================
       HERO HEADING
    ===================================================== */

    .bca-hero h1 {
        font-size: 44px;

        line-height: 1.06;

        letter-spacing: -1.5px;

        margin-bottom: 9px;
    }


    .bca-hero h2 {
        font-size: 25px;

        line-height: 1.2;

        margin-bottom: 16px;
    }


    /* =====================================================
       DESCRIPTION
    ===================================================== */

    .hero-description {
        max-width: 620px;

        font-size: 14px;

        line-height: 1.6;
    }


    /* =====================================================
       SIDE NOTES
    ===================================================== */

    .hero-decoration {
        font-size: 15px;

        line-height: 1.35;
    }

    .hero-decoration-left {
        left: 2.5%;
        top: 220px;
    }

    .hero-decoration-right {
        right: 2.5%;
        top: 75px;
    }

    .decoration-line {
        width: 75px;
        height: 2px;
    }


    /* =====================================================
       TOP LEFT BACKGROUND
    ===================================================== */

    .bg-blob-left {
        width: 280px;
        height: 260px;

        left: -125px;
        top: -105px;
    }

    .bg-dots-left {
        width: 105px;
        height: 125px;

        background-size: 19px 19px;
    }

    .bg-curve-left {
        left: -80px;
        top: 145px;

        width: 300px;
        height: 110px;
    }


    /* =====================================================
       PAPER PLANE
    ===================================================== */

    .bg-paper-plane {
        left: 18%;
        top: 52px;

        font-size: 32px;
    }

    .bg-paper-plane::after {
        width: 55px;
        height: 30px;

        left: -34px;
        top: 25px;
    }


    /* =====================================================
       TOP RIGHT DOTS
    ===================================================== */

    .bg-dots-top-right {
        width: 115px;
        height: 105px;

        background-size: 19px 19px;
    }


    /* =====================================================
       GRADUATION CAP
    ===================================================== */

    .bg-graduation {
        right: 12%;
        top: 42px;

        font-size: 38px;
    }


    /* =====================================================
       TOP RIGHT SPARKS
    ===================================================== */

    .bg-spark {
        right: 3%;
        top: 75px;

        transform: scale(0.85);
    }


    /* =====================================================
       BOOK IMAGE
    ===================================================== */

    .bg-books {
        left: 25px;
        bottom: 6px;

        width: 155px;
        height: 145px;
    }

    .bg-books img {
        width: 100%;
        height: 100%;
    }


    /* =====================================================
       BOTTOM LEFT DOTS
    ===================================================== */

    .bg-dots-bottom-left {
        left: 0;
        bottom: 8px;

        width: 115px;
        height: 100px;

        background-size: 19px 19px;
    }


    /* =====================================================
       BOTTOM RIGHT BACKGROUND
    ===================================================== */

    .bg-blob-right {
        right: -170px;
        bottom: -220px;

        width: 480px;
        height: 380px;
    }

    .bg-curve-right {
        right: -125px;
        bottom: -30px;

        width: 420px;
        height: 195px;
    }

    .bg-dots-right {
        width: 115px;
        height: 95px;

        background-size: 19px 19px;
    }

    .bg-code {
        right: 3%;
        bottom: 125px;

        font-size: 29px;
    }


    /* =====================================================
       SELECTORS
    ===================================================== */

    .selection-area {
        gap: 18px;

        margin-top: 24px;
    }

    .selection-area .select-box {
        width: 320px;

        flex: 0 0 320px;
    }

    .selection-area .select-box input {
        height: 50px;

        font-size: 14px;
    }

    .selection-area .select-box input::placeholder {
        font-size: 13px;
    }

    .selection-area .select-icon {
        left: 15px;

        font-size: 17px;
    }


    /* =====================================================
       EXPLORE BUTTON
    ===================================================== */

    .explore-btn {
        width: 190px;

        height: 50px;

        margin-top: 18px;

        font-size: 15px;
    }


    /* =====================================================
       ABOUT BCA SECTION
    ===================================================== */

    .about-bca-section {
        padding: 5px 4% 20px;
    }


    .about-bca-card {
        max-width: 900px;

        min-height: 290px;

        padding: 25px 30px;

        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr);

        gap: 30px;
    }


    /* =====================================================
       ABOUT LEFT CONTENT
    ===================================================== */

    .about-bca-content {
        max-width: 390px;
    }

    .about-bca-content h2 {
        font-size: 27px;

        letter-spacing: -0.5px;
    }

    .about-bca-content p {
        font-size: 13px;

        line-height: 1.6;
    }


    /* =====================================================
       ABOUT RIGHT DETAILS
    ===================================================== */

    .about-bca-details {
        max-width: 400px;

        padding-left: 25px;
    }

    .detail-item {
        gap: 18px;

        max-width: 350px;

        margin: 0 auto 16px;
    }

    .detail-icon {
        width: 52px;
        height: 52px;

        flex: 0 0 52px;
    }

    .detail-icon img {
        width: 62px;
        height: 62px;
    }

    .detail-item h3 {
        font-size: 14px;
    }

    .detail-item p {
        font-size: 11px;
    }


    /* =====================================================
       SYLLABUS SECTION
    ===================================================== */

    .syllabus-section {
        padding: 5px 4% 20px;
    }

    .syllabus-card {
        max-width: 900px;

        padding: 28px 30px;
    }

    .syllabus-heading {
        font-size: 26px;

        letter-spacing: -0.5px;

        margin-bottom: 11px;
    }

    .syllabus-intro {
        font-size: 13.5px;

        line-height: 1.6;

        margin-bottom: 26px;
    }

    .syllabus-years {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr);

        gap: 18px;

        margin-bottom: 26px;
    }

    .syllabus-year {
        padding: 22px 18px;
    }

    .syllabus-year:last-child {
        grid-column: 1 / -1;
    }

    .syllabus-year-label {
        font-size: 11px;

        padding: 4px 12px;

        margin-bottom: 11px;
    }

    .syllabus-year h3 {
        font-size: 16px;

        margin-bottom: 11px;
    }

    .syllabus-year li {
        font-size: 13px;
    }

    .syllabus-note {
        font-size: 13px;

        line-height: 1.65;

        margin-bottom: 15px;
    }


    /* =====================================================
       STATS
    ===================================================== */

    .stats-section {
        max-width: 900px;

        padding: 25px 15px 30px;
    }

    .stat-icon {
        width: 52px;
        height: 52px;
    }

    .stat-icon img {
        width: 78px;
        height: 68px;
    }

    .stat-number {
        font-size: 22px;
    }

    .stat-text-stat {
        font-size: 17px;
    }

    .stat-title {
        font-size: 12px;
    }

    .stat-item p {
        font-size: 10px;

        line-height: 1.5;
    }

    .stat-divider {
        height: 100px;
    }


    /* =====================================================
       JOURNEY SECTION
    ===================================================== */

    .journey-section {
        padding: 0 4% 45px;
    }

    .journey-card {
        max-width: 900px;

        min-height: 115px;

        padding: 20px 25px;
    }


    /* =====================================================
       JOURNEY ICON
    ===================================================== */

    .journey-icon {
        width: 52px;
        height: 52px;

        flex: 0 0 52px;
    }

    .journey-icon img {
        width: 57px;
        height: 53px;
    }


    /* =====================================================
       JOURNEY DIVIDER
    ===================================================== */

    .journey-divider {
        height: 55px;

        margin: 0 18px;
    }


    /* =====================================================
       JOURNEY CONTENT
    ===================================================== */

    .journey-content h2 {
        font-size: 15px;

        margin-bottom: 6px;
    }

    .journey-content p {
        font-size: 11px;

        line-height: 1.55;

        max-width: 580px;
    }


    /* =====================================================
       JOURNEY NOTE
    ===================================================== */

    .journey-note {
        font-size: 13px;

        margin-left: 18px;
    }

    .journey-note div {
        width: 85px;

        height: 2px;
    }

    /* =====================================================
   HIDE TABLET-ONLY DECORATIONS
===================================================== */

/* Remove aeroplane */
.bg-paper-plane {
    display: none;
}

/* Remove both handwritten side notes */
.hero-decoration-left,
.hero-decoration-right {
    display: none;
}

/* Remove aeroplane */
.bg-paper-plane {
    display: none;
}

/* Remove both handwritten side notes */
.hero-decoration-left,
.hero-decoration-right {
    display: none;
}

/* Remove code mark */
.bg-code {
    display: none;
}

/* Remove decorative lines / curves */
.bg-curve-left,
.bg-curve-right {
    display: none;
}

/* Remove spark/line decoration */
.bg-spark {
    display: none;
}
}   

@media (min-width: 1024px) and (max-width: 1427px) {
     .bg-books{
        display: none;
     }
}