:root{
            --navy:#59585a;
            --navy2:#6d6d6d;
            --green:#b84706;
            --green-dark:#025a75;
            --orange:#af5002;
            --orange-dark:#bb6502;
            --white:#ffffff;
            --light:#f5f7fa;
            --light2:#eef2f6;
            --dark:#000205;
            --muted:#040811;
            --line:#1609018f;
            --success:#636463;
            --danger:#b45118;
            --shadow:0 10px 30px rgba(16,24,40,.08);
            --shadow-lg:0 20px 50px rgba(16,24,40,.14);
            --radius:16px;
        }

        *{
            margin:0;
            padding:0;
            box-sizing:border-box;
        }

        html{
            scroll-behavior:smooth;
        }
        .dropbtn img{
            height: 22px;
            width: 22px;
        }
        body{
            font-family:"Inter",sans-serif;
            background:var(--white);
            color:var(--dark);
            line-height:1.7;
        }

        img{
            max-width:100%;
            display:block;
        }

        a{
            text-decoration:none;
            color:inherit;
        }

        button,
        input,
        select,
        textarea{
            font:inherit;
        }

        .container{
            width:min(1180px,92%);
            margin:auto;
        }
        .sidebar-card img{
            height: 26px;
            width: 26px;
        }
      
     

        /* =========================================================
           TOP BAR
        ========================================================= */

        .topbar{
            background:var(--navy);
            color:#fff;
            font-size:14px;
        }

        .topbar-inner{
            min-height:42px;
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:20px;
        }

        .topbar-left,
        .topbar-right{
            display:flex;
            align-items:center;
            gap:20px;
            flex-wrap:wrap;
        }

        .topbar a{
            transition:.3s ease;
        }

        .topbar a:hover{
            color:var(--orange);
        }

        .topbar i{
            margin-right:6px;
            color:var(--orange);
        }

        /* =========================================================
           HEADER
        ========================================================= */

        header{
            position:sticky;
            top:0;
            z-index:1000;
            background:#fff;
            box-shadow:0 2px 15px rgba(0,0,0,.08);
        }

        .header-inner{
            min-height:82px;
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:30px;
        }

        .logo{
            display:flex;
            align-items:center;
            gap:12px;
            min-width:max-content;
        }

        .logo-mark{
            width:52px;
            height:52px;
            border-radius:14px;
            background:linear-gradient(135deg,var(--green),var(--navy));
            color:#fff;
            display:flex;
            align-items:center;
            justify-content:center;
            font-size:21px;
            font-weight:800;
        }

        .logo-text strong{
            display:block;
            font-family:"Poppins",sans-serif;
            font-size:20px;
            line-height:1.2;
            color:var(--navy);
        }

        .logo-text span{
            display:block;
            font-size:11px;
            color:var(--muted);
            margin-top:3px;
        }

        nav{
            display:flex;
            align-items:center;
            gap:24px;
        }

        nav > a,
        .dropbtn{
            font-weight:600;
            font-size:14px;
            color:#344054;
            transition:.3s ease;
        }

        nav > a:hover,
        .dropbtn:hover{
            color:var(--green);
        }

        .dropdown{
            position:relative;
        }

        .dropbtn{
            background:none;
            border:0;
            cursor:pointer;
            display:flex;
            align-items:center;
            gap:6px;
        }

        .dropdown-menu{
            position:absolute;
            top:calc(100% + 20px);
            left:0;
            width:230px;
            background:#fff;
            border:1px solid var(--line);
            border-radius:12px;
            box-shadow:var(--shadow-lg);
            padding:10px;
            opacity:0;
            visibility:hidden;
            transform:translateY(10px);
            transition:.25s ease;
        }

        .dropdown:hover .dropdown-menu{
            opacity:1;
            visibility:visible;
            transform:translateY(0);
        }

        .dropdown-menu a{
            display:block;
            padding:10px 12px;
            border-radius:8px;
            font-size:14px;
            color:#344054;
        }

        .dropdown-menu a:hover{
            background:var(--light);
            color:var(--green);
        }

        .header-apply{
            background:var(--orange);
            color:#111827;
            padding:12px 20px;
            border-radius:9px;
            font-weight:800;
            transition:.3s ease;
        }

        .header-apply:hover{
            background:var(--orange-dark);
            color:#fff;
            transform:translateY(-2px);
        }

        .menu-toggle{
            display:none;
            width:44px;
            height:44px;
            border:1px solid var(--line);
            background:#fff;
            border-radius:9px;
            cursor:pointer;
            font-size:20px;
        }

        /* =========================================================
           MOBILE NAV
        ========================================================= */

        .mobile-nav{
            display:none;
            background:#fff;
            border-top:1px solid var(--line);
            padding:15px 0 20px;
        }

        .mobile-nav.active{
            display:block;
        }

        .mobile-nav a{
            display:block;
            padding:11px 0;
            font-weight:600;
            color:#344054;
        }

        .mobile-nav .mobile-apply{
            display:inline-block;
            background:var(--orange);
            padding:11px 18px;
            border-radius:8px;
            margin-top:8px;
        }

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

        .course-hero{
            min-height:430px;
            position:relative;
            display:flex;
            align-items:center;
            overflow:hidden;
            background:
                linear-gradient(rgba(0, 4, 59, 0.432),rgba(7, 27, 58, 0.507)),
                url("images/oval\ logo.jfif") center/cover no-repeat;
            color:#ffffff;
        }

        .course-hero-content{
            width:min(900px,92%);
            margin:auto;
            text-align:center;
            padding:80px 0;
        }

        .breadcrumb{
            display:flex;
            justify-content:center;
            align-items:center;
            gap:9px;
            flex-wrap:wrap;
            font-size:14px;
            margin-bottom:20px;
            color:#fdfcfb;
        }

        .breadcrumb a:hover{
            color:var(--orange);
        }

        .course-category{
            display:inline-block;
            background:rgb(19, 0, 102);
            border:1px solid rgb(250, 248, 245);
            color:#fc7201;
            padding:7px 14px;
            border-radius:30px;
            font-size:13px;
            font-weight:700;
            margin-bottom:16px;
        }

        .course-hero h1{
            font-family:"Poppins",sans-serif;
            font-size:clamp(34px,5vw,58px);
            line-height:1.15;
            margin-bottom:18px;
        }

        .course-hero p{
            max-width:750px;
            margin:auto;
            color:#e4e7ec;
            font-size:17px;
        }

        /* =========================================================
           COURSE SUMMARY
        ========================================================= */

        .course-summary{
            margin-top:-50px;
            position:relative;
            z-index:5;
        }

        .summary-card{
            background:#fff;
            border-radius:18px;
            box-shadow:var(--shadow-lg);
            padding:25px;
            display:grid;
            grid-template-columns:repeat(4,1fr);
            gap:20px;
        }

        .summary-item{
            display:flex;
            align-items:center;
            gap:14px;
            padding:10px;
        }

        .summary-icon{
            width:50px;
            height:50px;
            border-radius:12px;
            background:#eaf7f1;
            color:var(--green);
            display:flex;
            align-items:center;
            justify-content:center;
            font-size:20px;
            flex-shrink:0;
        }

        .summary-item span{
            display:block;
            font-size:12px;
            color:var(--muted);
            text-transform:uppercase;
            letter-spacing:.5px;
        }

        .summary-item strong{
            display:block;
            margin-top:2px;
            font-size:15px;
            color:var(--dark);
        }

        /* =========================================================
           MAIN CONTENT
        ========================================================= */

        .main-section{
            padding:80px 0;
        }

        .course-layout{
            display:grid;
            grid-template-columns:minmax(0,1fr) 350px;
            gap:45px;
            align-items:start;
        }

        .section-title{
            font-family:"Poppins",sans-serif;
            font-size:30px;
            color:var(--navy);
            margin-bottom:16px;
        }

        .section-title.small{
            font-size:23px;
        }

        .course-description{
            color:#475467;
            margin-bottom:25px;
        }

        .course-image{
            border-radius:18px;
            overflow:hidden;
            margin-bottom:30px;
            box-shadow:var(--shadow);
        }

        .course-image img{
            width:100%;
            height:380px;
            object-fit:cover;
        }

        /* =========================================================
           OUTCOMES
        ========================================================= */

        .outcomes-grid{
            display:grid;
            grid-template-columns:repeat(2,1fr);
            gap:14px;
            margin:25px 0 50px;
        }

        .outcome{
            display:flex;
            align-items:flex-start;
            gap:10px;
            padding:14px;
            background:var(--light);
            border-radius:10px;
        }

        .outcome i{
            color:var(--green);
            margin-top:5px;
        }

        /* =========================================================
           ACCORDION
        ========================================================= */

        .accordion{
            border:1px solid var(--line);
            border-radius:14px;
            overflow:hidden;
            margin-bottom:45px;
        }

        .accordion-item + .accordion-item{
            border-top:1px solid var(--line);
        }

        .accordion-header{
            width:100%;
            border:0;
            background:#fff;
            cursor:pointer;
            display:flex;
            align-items:center;
            justify-content:space-between;
            text-align:left;
            padding:18px 20px;
            font-weight:700;
            color:var(--navy);
        }

        .accordion-header i{
            transition:.3s ease;
        }

        .accordion-item.active .accordion-header i{
            transform:rotate(180deg);
        }

        .accordion-content{
            max-height:0;
            overflow:hidden;
            transition:max-height .35s ease;
            background:#fafbfc;
        }

        .accordion-content-inner{
            padding:0 20px 20px;
        }

        .accordion-content ul{
            list-style:none;
            display:grid;
            gap:10px;
        }

        .accordion-content li{
            display:flex;
            gap:10px;
            align-items:flex-start;
        }

        .accordion-content li i{
            color:var(--green);
            margin-top:5px;
        }

        /* =========================================================
           REQUIREMENTS
        ========================================================= */

        .requirements{
            display:grid;
            grid-template-columns:repeat(2,1fr);
            gap:15px;
            margin-bottom:45px;
        }

        .requirement{
            border:1px solid var(--line);
            border-radius:12px;
            padding:18px;
            display:flex;
            gap:12px;
        }

        .requirement i{
            color:var(--orange-dark);
            margin-top:4px;
        }

        /* =========================================================
           CAREERS
        ========================================================= */

        .career-grid{
            display:grid;
            grid-template-columns:repeat(3,1fr);
            gap:15px;
            margin-bottom:50px;
        }

        .career{
            background:#fff;
            border:1px solid var(--line);
            padding:17px;
            border-radius:12px;
            font-weight:600;
            transition:.25s ease;
        }

        .career:hover{
            transform:translateY(-3px);
            border-color:#b8decf;
            box-shadow:var(--shadow);
        }

        .career i{
            color:var(--green);
            margin-right:7px;
        }

        /* =========================================================
           SIDEBAR
        ========================================================= */

        .sidebar{
            position:sticky;
            top:110px;
        }

        .sidebar-card{
            background:#fff;
            border:1px solid var(--line);
            border-radius:16px;
            box-shadow:var(--shadow);
            padding:25px;
            margin-bottom:20px;
        }

        .sidebar-card h3{
            font-family:"Poppins",sans-serif;
            color:var(--navy);
            margin-bottom:15px;
        }

        .sidebar-list{
            list-style:none;
            display:grid;
            gap:13px;
        }

        .sidebar-list li{
            display:flex;
            gap:10px;
            font-size:14px;
            color:#475467;
        }

        .sidebar-list i{
            color:var(--green);
            margin-top:5px;
        }

        .apply-course-btn{
            display:flex;
            width:100%;
            justify-content:center;
            align-items:center;
            gap:9px;
            background:var(--green);
            color:#fff;
            border:0;
            padding:15px 20px;
            border-radius:10px;
            font-weight:800;
            cursor:pointer;
            transition:.3s ease;
            margin-top:20px;
        }

        .apply-course-btn:hover{
            background:var(--green-dark);
            transform:translateY(-2px);
        }

        .contact-box{
            background:var(--navy);
            color:#fff;
            border-radius:16px;
            padding:25px;
        }

        .contact-box h3{
            margin-bottom:12px;
            font-family:"Poppins",sans-serif;
        }

        .contact-box p{
            color:#d0d5dd;
            font-size:14px;
            margin-bottom:10px;
        }

        .contact-box a{
            color:#fff;
        }

        .contact-box a:hover{
            color:var(--orange);
        }

        /* =========================================================
           APPLICATION FORM
        ========================================================= */

        .application-section{
            padding:90px 0;
            background:var(--light);
            scroll-margin-top:100px;
        }

        .application-header{
            text-align:center;
            max-width:700px;
            margin:0 auto 35px;
        }

        .application-header h2{
            font-family:"Poppins",sans-serif;
            font-size:34px;
            color:var(--navy);
            margin-bottom:10px;
        }

        .application-header p{
            color:var(--muted);
        }

        .application-card{
            width:min(850px,100%);
            margin:auto;
            background:#fff;
            padding:35px;
            border-radius:18px;
            box-shadow:var(--shadow-lg);
        }

        .selected-course-box{
            background:#eef8f3;
            border:1px solid #ccebdc;
            padding:15px 18px;
            border-radius:10px;
            margin-bottom:25px;
        }

        .selected-course-box span{
            display:block;
            color:var(--muted);
            font-size:12px;
            text-transform:uppercase;
            margin-bottom:4px;
        }

        .selected-course-box strong{
            color:var(--green-dark);
        }

        .form-grid{
            display:grid;
            grid-template-columns:repeat(2,1fr);
            gap:20px;
        }

        .form-group{
            margin-bottom:20px;
        }

        .form-group.full{
            grid-column:1/-1;
        }

        .form-group label{
            display:block;
            font-size:14px;
            font-weight:700;
            margin-bottom:7px;
            color:#344054;
        }

        .form-group label span{
            color:var(--danger);
        }

        .form-control{
            width:100%;
            border:1px solid #d0d5dd;
            border-radius:9px;
            padding:13px 14px;
            outline:none;
            background:#fff;
            color:var(--dark);
            transition:.2s ease;
        }

        .form-control:focus{
            border-color:var(--green);
            box-shadow:0 0 0 3px rgba(11,122,75,.1);
        }

        textarea.form-control{
            min-height:130px;
            resize:vertical;
        }

        .form-message{
            display:none;
            padding:13px 15px;
            border-radius:9px;
            margin-bottom:20px;
            font-size:14px;
            font-weight:600;
        }

        .form-message.error{
            background:#fef3f2;
            border:1px solid #fecdca;
            color:var(--danger);
        }

        .form-message.success{
            background:#ecfdf3;
            border:1px solid #abefc6;
            color:var(--success);
        }

        .whatsapp-submit{
            width:100%;
            border:0;
            background:#535353;
            color:#fff;
            padding:15px 20px;
            border-radius:10px;
            font-weight:800;
            cursor:pointer;
            display:flex;
            justify-content:center;
            align-items:center;
            gap:10px;
            transition:.3s ease;
        }

        .whatsapp-submit:hover{
            background:#001d0a;
            transform:translateY(-2px);
        }

        .form-note{
            text-align:center;
            color:var(--muted);
            font-size:12px;
            margin-top:13px;
        }

        /* =========================================================
           RELATED COURSES
        ========================================================= */

        .related-section{
            padding:90px 0;
        }

        .section-heading{
            text-align:center;
            margin-bottom:35px;
        }

        .section-heading h2{
            font-family:"Poppins",sans-serif;
            font-size:34px;
            color:var(--navy);
        }

        .related-grid{
            display:grid;
            grid-template-columns:repeat(3,1fr);
            gap:22px;
        }

        .related-card{
            border:1px solid var(--line);
            border-radius:15px;
            overflow:hidden;
            background:#fff;
            transition:.3s ease;
        }

        .related-card:hover{
            transform:translateY(-5px);
            box-shadow:var(--shadow);
        }

        .related-card img{
            width:100%;
            height:190px;
            object-fit:cover;
        }

        .related-content{
            padding:20px;
        }

        .related-content h3{
            font-family:"Poppins",sans-serif;
            font-size:18px;
            color:var(--navy);
            margin-bottom:8px;
        }

        .related-content p{
            color:var(--muted);
            font-size:14px;
            margin-bottom:15px;
        }

        .view-course{
            display:inline-flex;
            align-items:center;
            gap:7px;
            color:var(--green);
            font-weight:800;
            font-size:14px;
        }

        /* =========================================================
           CTA
        ========================================================= */

        .cta{
            background:
                linear-gradient(135deg,var(--navy),var(--navy2));
            color:#fff;
            padding:75px 0;
        }

        .cta-inner{
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:30px;
        }

        .cta h2{
            font-family:"Poppins",sans-serif;
            font-size:34px;
            margin-bottom:8px;
        }

        .cta p{
            color:#d0d5dd;
        }

        .cta-btn{
            background:var(--orange);
            color:#111827;
            padding:14px 24px;
            border-radius:9px;
            font-weight:800;
            white-space:nowrap;
        }

        .cta-btn:hover{
            background:var(--orange-dark);
            color:#fff;
        }

        /* =========================================================
           FOOTER
        ========================================================= */

        footer{
            background:#012333;
            color:#fff;
            padding-top:60px;
        }

        .footer-grid{
            display:grid;
            grid-template-columns:1.5fr 1fr 1fr 1fr;
            gap:40px;
            padding-bottom:45px;
        }

        .footer-brand p{
            color:#98a2b3;
            margin:18px 0 20px;
            font-size:14px;
            max-width:360px;
        }

        .footer-logo .logo-text strong{
            color:#fff;
        }

        .footer-logo .logo-text span{
            color:#98a2b3;
        }

        .socials{
            display:flex;
            gap:10px;
        }

        .socials a{
            width:38px;
            height:38px;
            border:1px solid rgba(255,255,255,.15);
            border-radius:8px;
            display:flex;
            align-items:center;
            justify-content:center;
            transition:.3s ease;
        }

        .socials a:hover{
            background:var(--green);
            border-color:var(--green);
        }

        .footer-col h3{
            font-family:"Poppins",sans-serif;
            font-size:17px;
            margin-bottom:17px;
        }

        .footer-col ul{
            list-style:none;
            display:grid;
            gap:10px;
        }

        .footer-col li,
        .footer-col a{
            color:#98a2b3;
            font-size:14px;
        }

        .footer-col a:hover{
            color:#fff;
        }

        .footer-contact li{
            display:flex;
            gap:9px;
            align-items:flex-start;
        }

        .footer-contact i{
            color:var(--orange);
            margin-top:5px;
        }

        .copyright{
            border-top:1px solid rgba(255,255,255,.1);
            padding:20px 0;
            color:#98a2b3;
            font-size:13px;
        }

        .copyright-inner{
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:20px;
        }

        .copyright-links{
            display:flex;
            gap:18px;
        }

        /* =========================================================
           FLOATING WHATSAPP
        ========================================================= */

        .floating-whatsapp{
            position:fixed;
            right:22px;
            bottom:22px;
            width:58px;
            height:58px;
            border-radius:50%;
            background:#013f25;
            color:#fff;
            display:flex;
            align-items:center;
            justify-content:center;
            font-size:28px;
            box-shadow:0 8px 25px rgba(37,211,102,.35);
            z-index:999;
            transition:.3s ease;
        }

        .floating-whatsapp:hover{
            transform:translateY(-4px) scale(1.04);
        }

        /* =========================================================
           BACK TO TOP
        ========================================================= */

        .back-top{
            position:fixed;
            right:22px;
            bottom:92px;
            width:42px;
            height:42px;
            border:0;
            border-radius:8px;
            background:var(--navy);
            color:#fff;
            display:flex;
            align-items:center;
            justify-content:center;
            cursor:pointer;
            opacity:0;
            visibility:hidden;
            transition:.3s ease;
            z-index:998;
        }

        .back-top.show{
            opacity:1;
            visibility:visible;
        }

        /* =========================================================
           NOT FOUND
        ========================================================= */

        .course-not-found{
            display:none;
            text-align:center;
            padding:100px 20px;
        }

        .course-not-found i{
            font-size:55px;
            color:var(--orange);
            margin-bottom:20px;
        }

        .course-not-found h2{
            font-family:"Poppins",sans-serif;
            color:var(--navy);
            margin-bottom:10px;
        }

        /* =========================================================
           RESPONSIVE
        ========================================================= */

        @media(max-width:1000px){

            nav{
                display:none;
            }

            .menu-toggle{
                display:block;
            }

            .header-apply{
                display:none;
            }

            .course-layout{
                grid-template-columns:1fr;
            }

            .sidebar{
                position:static;
            }

            .summary-card{
                grid-template-columns:repeat(2,1fr);
            }

            .footer-grid{
                grid-template-columns:repeat(2,1fr);
            }

        }

        @media(max-width:700px){

            .topbar-inner{
                justify-content:center;
                padding:8px 0;
            }

            .topbar-left,
            .topbar-right{
                justify-content:center;
                gap:10px 16px;
            }

            .logo-text strong{
                font-size:17px;
            }

            .logo-text span{
                font-size:9px;
            }

            .logo-mark{
                width:45px;
                height:45px;
            }

            .course-hero{
                min-height:390px;
            }

            .course-hero-content{
                padding:65px 0;
            }

            .course-hero h1{
                font-size:35px;
            }

            .summary-card{
                grid-template-columns:1fr;
            }

            .main-section,
            .related-section{
                padding:60px 0;
            }

            .course-image img{
                height:260px;
            }

            .outcomes-grid,
            .requirements{
                grid-template-columns:1fr;
            }

            .career-grid,
            .related-grid{
                grid-template-columns:1fr;
            }

            .application-section{
                padding:60px 0;
            }

            .application-card{
                padding:22px;
            }

            .form-grid{
                grid-template-columns:1fr;
                gap:0;
            }

            .form-group.full{
                grid-column:auto;
            }

            .cta-inner{
                flex-direction:column;
                align-items:flex-start;
            }

            .cta h2{
                font-size:28px;
            }

            .footer-grid{
                grid-template-columns:1fr;
            }

            .copyright-inner{
                flex-direction:column;
                align-items:flex-start;
            }

            .floating-whatsapp{
                right:15px;
                bottom:15px;
            }

            .back-top{
                right:15px;
                bottom:83px;
            }
        }