body{
            background:#efe7db;
            font-family: Arial, sans-serif;
            margin:0;
        }
        header {
            background: #efe7db;
            padding: 20px 5%;
            display: flex;
            align-items: center;
            justify-content: space-between;
            flex-wrap: wrap;
        }
        .brand img{
            height:185px;
            width:auto;
        }
        .school-name{
            font-family:'Playfair Display', serif;
            font-size:3.2rem;
            color:#b97d6b;
            line-height:1.1;
            font-weight:500;
        }
        .language-switcher{
            position:absolute;
            top:30px;
            right:40px;
            font-family:Georgia, serif;
            font-size:16px;
        }
        .language-switcher a{
            color:#5d4a7a;
            text-decoration:none;
            margin:0 4px;
        }
        nav {
            margin-left: auto;
            display: flex;
            align-items: center;
            gap: 35px;
        }
        nav a{
            font-family:'Playfair Display', serif;
            color:#b97d6b;
            font-size:1.25rem;
            margin-left: 0px;
            text-decoration: none;
        }
        nav a:hover {
    font-weight:600;
}

nav a.active {
    font-weight:600;
}

.language-switcher a:hover {
    font-weight:600;
}

.language-switcher a.active {
    font-weight:600;
}
        .background-slogan{
            position:absolute;
            left:50%;
            top:36%;
            transform:translate(-50%,-50%);
            font-size:clamp(2.2rem,5.5vw,4.2rem);
            font-weight:700;
            color:rgba(185,125,107,0.15);
            filter:blur(2px);
            text-align:center;
            pointer-events:none;
            white-space:nowrap;
        }
        @media (max-width: 768px) {

    header{
        flex-direction:column;
        align-items:center;
        padding:5px 20px 10px;
    }

    .brand{
        display:flex;
        flex-direction:column;
        align-items:center;
        text-align:center;
    }

    .brand img{
        height:120px;
    }

    .school-name{
        font-size:2.2rem;
        text-align:center;
    }

    .language-switcher{
        position:static;
        margin-top:15px;
        text-align:center;
    }

    nav{
        margin:25px 0 0;
        flex-wrap:wrap;
        justify-content:center;
        gap:20px;
    }

    nav a{
        font-size:1.1rem;
    }

    .background-slogan{
        font-size:2rem;
        top:320px;
        white-space:normal;
        width:90%;
    }
}
.intro-text,
.intro-image {
    flex: 1;
}

.intro-section {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 15px;
    flex-wrap: wrap;
    max-width: 1300px;
    margin: 40px auto;
    padding: 0 40px;
}

.intro-text {
    flex: 1;
    max-width: 500px;
    text-align: center;
    margin-left: 60px;
}

.intro-image {
    flex: 1;
    text-align: right;
}

.intro-image img {
    width: 450px;
    max-width: 100%;
    border-radius: 20px;
}

.language-label {
    display: block;
    margin-bottom: 12px;
    text-align: center;
    font-family: Georgia, serif;
    font-size: 28px;
    font-weight: 500;
    color: #b97d6b;
}

.certificates-section{
    max-width:1200px;
    margin:80px auto;
    padding:0 20px;
}

.certificates-title{
    text-align:center;
    font-family:Georgia, serif;
    font-size:32px;
    font-weight:500;
    color:#b97d6b;
    margin-bottom:40px;
}

.asu-row{
    display:flex;
    justify-content:center;
    gap:22px;
}

.asu-row img{
    width:300px;
    border-radius:14px;
    box-shadow:0 8px 18px rgba(0,0,0,.12);
    transition:.3s;
}

.asu-row img:hover{
    transform:translateY(-6px);
    box-shadow:0 14px 28px rgba(0,0,0,.18);
}

.tefl-row{
    display:flex;
    justify-content:center;
    margin-top:30px;
}

.tefl-row img{
    width:230px;
    border-radius:14px;
    box-shadow:0 8px 18px rgba(0,0,0,.12);
    transition:.3s;
}

.tefl-row img:hover{
    transform:translateY(-6px);
    box-shadow:0 14px 28px rgba(0,0,0,.18);
}

.image-modal{
    display:none;
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.85);
    justify-content:center;
    align-items:center;
    z-index:9999;
}

.image-modal img{
    max-width:90%;
    max-height:90%;
    border-radius:10px;
    box-shadow:0 10px 30px rgba(0,0,0,.4);
}

.close-modal{
    position:absolute;
    top:20px;
    right:35px;
    font-size:48px;
    color:#fff;
    cursor:pointer;
    user-select:none;
}

.icon-card{
    width:180px;
    height:180px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#f4eee5;
    border:1px solid #d8c9b8;
    border-radius:18px;
    box-shadow:0 4px 10px rgba(0,0,0,.05);
    text-decoration:none;
    transition:.25s;
    cursor:pointer;
}

.icon-card:hover{
    transform: translateY(-6px) scale(1.05);
    background:#f8f2eb;
    border:1px solid #b97d6b;
    box-shadow:0 12px 24px rgba(0,0,0,.12);
    }

.slot-btn{
    display:block;
    width:100%;
    margin:12px 0;
    padding:14px;
    border:none;
    border-radius:14px;
    background:#efe7db;
    color:#666;
    font-family:Georgia, serif;
    font-size:18px;
    cursor:pointer;
    transition:.3s;
    box-shadow:0 4px 10px rgba(0,0,0,.05);
    }

.slot-btn:hover{
    background:#d7a08f;
    color:white;
    transform:translateY(-2px);
    }

.slot-btn.selected{
    background:#b97d6b;
    color:white;
    }

    .crypto-grid{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:18px;
    margin:20px auto 50px;
    max-width:1200px;
}

.payment-logo{
    width:85px;
    height:85px;
    object-fit:contain;
}

.contact-logo{
    width:75px;
    height:75px;
    object-fit:contain;
}

.crypto-card{
    width:180px;
    height:180px;
    background:#f4eee5;
    border:1px solid #d8c9b8;
    border-radius:18px;
    box-shadow:0 4px 10px rgba(0,0,0,.05);
    text-decoration:none;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    transition:.25s;
    cursor:pointer;
}

.crypto-card:hover{
    transform:translateY(-4px);
    box-shadow:0 8px 18px rgba(0,0,0,.10);
    border-color:#b97d6b;
}

.crypto-card img{
    width:70px;
    height:70px;
    margin-bottom:10px;
}

.crypto-card h3{
    margin:0;
    font-family:Georgia, serif;
    font-size:18px;
    font-weight:500;
    color:#b97d6b;
}

.crypto-card p{
    margin-top:5px;
    font-family:Georgia, serif;
    font-size:13px;
    color:#8d7b68;
}

.social-icon{
    display:inline-block;
    font-size:38px;
    transition:0.3s;
}

.social-icon:hover{
    transform:translateY(-4px) scale(1.15);
}

.book-btn{
    transition:0.3s;
}

.book-btn:hover{
    background:#b97d6b;
    transform:translateY(-3px);
    box-shadow:0 10px 20px rgba(0,0,0,.15);
}

.social-logo{
    width:38px;
    height:38px;
    object-fit:contain;
    transition:.3s;
}

.gmail-logo{
    transform:scale(1.38) translateY(3px);
    transform-origin:center;
}

.social-icon:hover .gmail-logo{
    transform:scale(1.58) translateY(3px);
}

@media (max-width: 768px) {

.intro-section{
        flex-direction: column;
        align-items: center;
    }

.contact-container{
    padding-top:100px !important;
    }

.contact-container h3:first-child{
    margin-top:60px !important;
    }

.courses-container{
    padding-top:120px !important;
    }

    .intro-text,
    .intro-image{
        width: 100% !important;
        max-width: 100% !important;
        text-align: center !important;
    }

    .intro-image img{
        width: 90% !important;
        max-width: 450px !important;
    }
    
    .intro-text {
    margin-left: 0 !important;
    }
    
    .language-switcher{
    position: absolute;
    top: 8px;
    right: 12px;
    font-size: 0.95rem;
    margin: 0;
    padding: 0;
    text-align: right;
    z-index: 1000;
    }

    .why-section{
    flex-direction: column !important;
    gap: 40px !important;
    align-items: center !important;
    }

    .why-left,
    .why-right{
    width: 100% !important;
    max-width: 500px !important;
    margin-right: 0 !important;
    transform: none !important;
    }

    .student-success-section{
    margin:40px auto !important;
    padding:0 20px !important;
    }

    .ready-section{
    min-height:auto !important;
    padding:40px 20px !important;
    }

    .contact-section{
    padding:40px 20px !important;
    }

    #reviews{
    gap: 0 !important;
    } 

    #reviews > div{
    min-width: 100% !important;
    max-width: 100% !important;
    }

    #prevReview,
    #nextReview{
    top: 150px !important;
    }

    #reviews > div{
    width:100% !important;
    min-width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    }

    .hero-content{
    padding-top:120px !important;
    }

    .certificates-title{
    font-size:28px;
    }

    .asu-row{
    flex-direction:column;
    align-items:center;
    }

    .asu-row img{
    width:90%;
    max-width:330px;
    }

    .tefl-row img{
    width:220px;
    }

    .icon-card{
    width:90px;
    height:90px;
    }

    .icon-card i{
    font-size:42px;
}

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

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

    .crypto-grid{
    display:grid;
    grid-template-columns:repeat(2, 90px);
    justify-content:center;
    gap:35px;
    margin:-20px auto 30px !important;
}

    .crypto-card{
    width:90px;
    height:90px;
    font-size:42px;
    }

.crypto-card img{
    width:48px;
    height:48px;
   }

}