body { box-sizing: border-box; }
        * { margin:0; padding:0; box-sizing:border-box; }
        :root{
            --primary-color:#0d47a1;
            --secondary-color:#ffffff;
            --accent-color:#ff2d20;
            --text-dark:#333333;
            --text-light:#666666;
            --bg-light:#f8f9fa;
        }
        body{font-family:'Poppins',sans-serif;color:var(--text-dark);overflow-x:hidden;}
        /* ==== NAVBAR ==== */
      
        /* ==== HERO ==== */
        .hero-section{background:linear-gradient(135deg,#0d47a1 0%,#1976d2 100%);padding:100px 0;color:var(--secondary-color);position:relative;overflow:hidden;}
        .hero-section::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320"><path fill="%23ffffff" fill-opacity="0.1" d="M0,96L48,112C96,128,192,160,288,160C384,160,480,128,576,122.7C672,117,768,139,864,138.7C960,139,1056,117,1152,106.7C1248,96,1344,96,1392,96L1440,96L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>') no-repeat bottom;background-size:cover;}
        .hero-content{position:relative;z-index:2;}
        .hero-section h1{font-size:3rem;font-weight:700;margin-bottom:1.5rem;line-height:1.2;}
        .hero-section p{font-size:1.1rem;margin-bottom:2rem;opacity:.9;}
                
            /* KILL ALL UNDERLINES */
a { text-decoration: none !important; outline: none !important; }
#send:hover{
    background-color: #e02618;
    color: black;
}
/* HERO BUTTONS – RED GUARANTEED */
.btn-explore, .btn-contact {
    display: inline-block !important;
    /* padding: 0.9rem 2.6rem !important; */
    border-radius: 50px !important;
   font-weight: 700;
  font-size: 18px;
    text-align: center;
    cursor: pointer;
    /* transition: all 0.35s ease !important; */
    margin-right: 1rem !important;
}

/* SEND MESSAGE – SOLID RED */
.btn-explore {
    background: #e02618 !important;
    color: white !important;
    border: 3px solid #e02618 !important;
    /* box-shadow: 0 12px 35px rgba(255,45,32,0.5) !important; */
    text-decoration: none;
}

.btn-explore:hover {
    background: #e02618 !important;
    color: black !important;
    /* transform: translateY(-6px) !important; */
    /* box-shadow: 0 22px 50px rgba(255,45,32,0.7) !important; */
}

/* CALL NOW – WHITE OUTLINE */
.btn-contact {
    background: #e02618 !important;
    /* color: white !important; */
    border: 3px solid #e02618 !important;
    /* box-shadow: 0 12px 35px rgba(255,255,255,0.3) !important; */
}

.btn-contact:hover {
    background: #e02618 !important;
    color: black !important;
    /* transform: translateY(-6px) !important; */
    /* box-shadow: 0 22px 50px rgba(255,255,255,0.5) !important; */
}
        .counter-box {
    background: var(--accent-color);
    padding: 1.5rem;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    text-align: center;
    position: absolute;
}

.counter-box.students {
    top: 20%;
    right: -10%;
}
.counter-box.courses {
    bottom: 20%;
    left: -10%;
}

.counter-box h3 {
    color: var(--primary-color);
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.counter-box p {
    color: white;
    margin: 0;
    font-size: 0.9rem;
}
#submit1:hover{
background-color: #e02618;
color: black;
}
        /* ==== SECTION TITLE ==== */
        .section-title{font-size:2.5rem;font-weight:700;color:var(--primary-color);margin-bottom:1rem;position:relative;display:inline-block;}
        .section-title::after{content:'';display:block;width:80px;height:4px;background:var(--accent-color);margin-top:.8rem;}
        /* ==== CONTACT INFO ==== */
        .contact-info{padding:100px 0;background:var(--bg-light);}
        .contact-card{background:var(--secondary-color);padding:2rem;border-radius:20px;box-shadow:0 10px 30px rgba(0,0,0,.08);text-align:center;transition:all .3s ease;height:100%;}
        .contact-card:hover{transform:translateY(-10px);box-shadow:0 20px 50px rgba(13,71,161,.15);}
        .contact-icon{width:80px;height:80px;background:linear-gradient(135deg,var(--primary-color),#1976d2);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem;color:white;font-size:1.8rem;}
        .contact-card h5{color:var(--primary-color);font-weight:600;margin-bottom:1rem;}
        .contact-card p{color:var(--text-light);margin:0;line-height:1.7;}
        .contact-card a{color:var(--accent-color);text-decoration:none;font-weight:500;}
        .contact-card a:hover{text-decoration:underline;}
        /* ==== CONTACT FORM ==== */
        .contact-form-section{padding:100px 0;background:var(--secondary-color);}
        .form-control{border-radius:12px;padding:.75rem 1rem;border:1px solid #ddd;font-size:1rem;}
        .form-control:focus{border-color:var(--primary-color);box-shadow:0 0 0 .2rem rgba(13,71,161,.15);}
        .btn-submit{background:var(--accent-color);color:white;padding:.8rem 2.5rem;border-radius:50px;font-weight:600;border:none;transition:all .3s ease;}
        .btn-submit:hover{background:#e02618;transform:translateY(-3px);box-shadow:0 10px 25px rgba(255,45,32,.4);}
        .working-hours{background:var(--primary-color);color:white;padding:2rem;border-radius:15px;margin-top:2rem;}
        .working-hours h5{color:white;margin-bottom:1rem;}
        .working-hours ul{list-style:none;padding:0;margin:0;}
        .working-hours li{padding:.4rem 0;display:flex;justify-content:space-between;}
        .working-hours .closed{color:#ffcccc;}
        /* ==== MAP ==== */
        .contact-map{padding:100px 0;background:var(--bg-light);}
        .map-container{border-radius:20px;overflow:hidden;box-shadow:0 15px 40px rgba(0,0,0,.1);height:450px;}
        .map-container iframe{width:100%;height:100%;border:0;}
        
        /* ==== RESPONSIVE ==== */
        @media(max-width:991px){
              .hero-section{background:linear-gradient(135deg,#0d47a1 0%,#1976d2 100%);padding:100px 0;color:var(--secondary-color);position:relative;overflow:hidden;}
            .hero-section h1{font-size:2.2rem;}
            .timeline::after{left:31px;}
            .timeline-item{width:100%;padding-left:70px;padding-right:25px;}
            .timeline-item::before{left:60px;border:medium solid var(--primary-color);border-width:10px 10px 10px 0;border-color:transparent var(--primary-color) transparent transparent;}
            .left::after,.right::after{left:15px;}
            .right{left:0%;}

            /* Adjust contact form and working hours layout on medium screens */
            .contact-container {
                flex-direction: column;
                gap: 30px;
            }
            .contact-form-wrapper,
            .working-hours-col {
                flex: 1 1 100%; /* Make them take full width */
                min-width: unset;
            }
            .working-hours-col {
                margin-top: 30px; /* Add some spacing between form and working hours */
            }
        }
        @media(max-width:768px){
            .hero-section{padding:60px 0; width: 100%;}
            .hero-section h1{font-size:1.8rem;}
            .section-title{font-size:2rem;}
            .story-section,.vision-mission-section,.core-values-section,.journey-section,.leadership-section,.contact-info,.contact-form-section,.contact-map{padding:60px 0;}
            
            /* Center hero buttons on mobile */
            .hero-content {
                text-align: center !important;
            }
            .hero-content .btn-explore,
            .hero-content .btn-contact {
                display: block !important;
                margin: 0.5rem auto !important;
                width: fit-content !important;
                min-width: 274px;
            }
            
            /* Move counter boxes below image on mobile */
            .counter-box {
                position: relative !important;
                top: auto !important;
                right: auto !important;
                bottom: auto !important;
                left: auto !important;
                margin: 1rem auto !important;
                max-width: 250px !important;
            }
            
            /* Adjust hero image on mobile */
            .hero-image {
                text-align: center;
            }
            .hero-image img {
                margin-top: 2rem !important;
                margin-left: 2px !important;
            }

            .contact-form-wrapper h2 {
                font-size: 28px;
                text-align: center;
            }

            .contact-form-wrapper .divider {
                margin: 10px auto 25px;
            }
            .working-hours-col h2 {
                font-size: 28px;
            }
            .working-hours-col .divider {
                margin: 10px auto 25px;
            }
            form#contact-form .form-grid {
                flex-direction: column;
            }

            form#contact-form input,
            form#contact-form select,
            form#contact-form textarea {
                flex: 1 1 100%;
                width: 100%;
            }

            #contact-form button {
                display: block;
                width: 100%;
                padding: 14px;
                border-radius: 10px;
            }
            .working-hours-card {
                margin-left: 0 !important; /* Override original inline margin-left */
                width: 100% !important; /* Override original inline width */
                padding: 20px !important;
            }
        }

/* ===== Custom styles for refactored Working Hours section ===== */


.working-hours-col h2 {
    font-size: 36px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 10px;
}

.working-hours-col .divider {
    width: 60px;
    height: 3px;
    background: var(--accent-color);
    margin: 0 auto 30px auto;
}

/* Flex container for the cards */
.contact-cards-row {
    display: flex;
    flex-wrap: wrap; /* Allow items to wrap to the next line on small screens */
    justify-content: center; /* Center the cards horizontally */
    gap: 20px; /* Space between cards */
    margin-top: 30px; /* Space from the divider */
}

.working-hours-card,
.contact-additional-card {
    border-radius: 20px;
    padding: 25px 30px;
    box-shadow: 0 0 15px rgba(0,0,0,.1);
    text-align: center;
    transition: all 0.3s ease;
    flex: 1 1 30%; /* Allow cards to grow/shrink and take about 30% width */
    max-width: 380px; /* Max width for each card */
}

.working-hours-card {
    background: var(--primary-color);
    color: var(--secondary-color);
}

.working-hours-card h5 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 20px;
}

.working-hours-list {
    list-style: none;
    padding: 0;
    margin: 0;
    line-height: 1.8;
}

.working-hours-list li {
    display: flex;
    justify-content: space-between;
}

.working-hours-list .text-closed {
    color: #ffcccc;
}

.contact-additional-card {
    background: var(--secondary-color); /* White background for contrast */
    color: var(--text-dark); /* Dark text for readability */
    box-shadow: 0 0 15px rgba(0,0,0,.05); /* Lighter shadow than primary card */
}

.contact-additional-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 20px rgba(0,0,0,.1);
}

.contact-additional-card h5 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 15px;
    color: var(--primary-color); /* Primary color for headings */
}

.contact-additional-card p {
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 0;
}

.contact-additional-card a {
    color: var(--accent-color); /* Accent color for links */
    text-decoration: none;
    font-weight: 500;
}

.contact-additional-card a:hover {
    text-decoration: underline;
}

/* Adjustments for the specific card margins, let gap handle spacing */
.contact-additional-card.mt-4,
.contact-additional-card.mt-3 {
    margin-top: 0 !important;
}

/* Further responsive adjustments for the contact section */
@media (max-width: 991px) {
    .contact-container {
        flex-direction: column;
        gap: 30px;
    }
    .contact-form-wrapper,
    .working-hours-col {
        flex: 1 1 100%; /* Make them take full width */
        min-width: unset;
    }
    .working-hours-col {
        text-align: center; /* Center content within the column */
        margin-top: 30px; /* Add some spacing between form and working hours */
    }
    .contact-cards-row {
        flex-direction: column; /* Stack cards vertically on smaller screens */
        align-items: center; /* Center stacked cards */
    }
    .working-hours-card,
    .contact-additional-card {
        width: 100%; /* Full width when stacked */
        max-width: 400px; /* Max width for stacked cards */
    }
}

@media (max-width: 768px) {
    .working-hours-col h2 {
        font-size: 28px;
    }
    .working-hours-col .divider {
        margin: 10px auto 25px;
    }
    .working-hours-card,
    .contact-additional-card {
        padding: 20px !important;
    }
}

@media (max-width: 480px) {
    .working-hours-col h2 {
        font-size: 24px;
    }
}