@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

:root {
    --primary-color: #BF6420;
    --secondary-color: #ddaa84;
    --accent-blue: #64b5f6;
    --accent-orange: #c56e2e;
    --dark-color: #1a1a1a;
    --light-color: #fff;
}


* {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }           
           
          body {
           font-family: Poppins, sans-serif !important;  
           font-weight: 400 !important;
           font-style: normal !important;
            }


           .logo img{
            max-height:100px;
           }

        nav a:hover {
            color: #0F465B;
        }
        
        .btn-bg {
            background-color:#BF6420 !important;
        }

        .custom-btn-text{
            font-size: 13px !important;
        }


        .hero-section {
        background: url('../images/neon-design-elements-lights-glow-and-flash-technol-2025-01-09-15-33-19-utc.webp');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        }
                
/* Hero Cards */
       .glass-card {
          background: #ffffff1f;
          backdrop-filter: blur(12px);
          transition: transform 0.3s ease, border-color 0.3s ease;
        }

         .stat-blue {
          color: #64b5f6;
          text-shadow: 0 0 25px #64b5f680;
          }

/* About */
        .about-image{
            height:600px;
        }

        

/* Membership */
        .card-number {
            width: 60px;
            height: 60px;
            background: #0F465B;
        }
        
        .card-content h3 {
            color: #1f2937;
            line-height: 1.4;
        }

        .member-card{
            background-color: #ececec;
        }
        
        .member-card:hover{
            background: #d9d9d9;
            transform: translateY(-5px);
        }

        
   
/* Documents Required */
        .doc-item {
            transition: transform 0.3s ease;
        }

        .doc-item:hover {
            transform: translateY(-5px);
        }

        .icon-circle {
            width: 120px;
            height: 120px;
            background-color: #1e4a5f;
            transition: background-color 0.3s ease;
        }

        .doc-item:hover .icon-circle {
            background-color: white;
            border: solid 7px #BF6420;
        }

        .icon-circle i {         
            color: white;
        }

        .doc-item:hover .icon-circle i{
        color: #BF6420;
        }


        .doc-text {
            max-width: 200px;
            transition: color 0.3s ease;
        }

        .doc-item:hover .doc-text {
            color: #c85a28;
        }

                /* Services Section */
        
        .service-cards {
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            height: 400px;
        }

        .service-cards:hover {
            transform: translateY(-5px);
            box-shadow: 0 8px 15px #0003;
        }

        .cards-image {
            transition: opacity 0.3s ease;
        }

        .cards-content {
            background: linear-gradient(to top, #000000e6, transparent);
            transition: all 0.3s ease;
        }

        .cards-description {
            max-height: 0;
            transition: all 0.3s ease;
        }

        .service-cards:hover .cards-description {
            max-height: 80px;
        }

        .service-cards:hover .cards-content {
            background: linear-gradient(to top, #082632, #00000086);
        }
       
        /* services mobile */
        
        .service-cards-mobile {
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            height: 300px;
        }

        .cards-image {
            transition: opacity 0.3s ease;
        }

        .cards-content {
           background: linear-gradient(to top, #082632, #00000086);
       }

        .cards-description {
            max-height: 0;
            transition: all 0.3s ease;
        }

       /* Contact Section */
       .contact-section {
        background-image: url('../images/a-young-african-couple-engaged-in-a-serious-discus-2025-03-10-22-25-12-utc.webp');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        }