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

        .about-hero{
            min-height:90vh;
            position:relative;
            display:flex;
            align-items:center;
            justify-content:center;
            text-align:center;
            overflow:hidden;
            color:#fff;

            background:
            linear-gradient(rgba(4,10,25,0.84), rgba(4,10,25,0.92)),
            url('https://images.unsplash.com/photo-1524178232363-1fb2b075b655?q=80&w=1600&auto=format&fit=crop')
            center/cover no-repeat;
        }

        .about-hero::before{
            content:'';
            position:absolute;
            width:700px;
            height:700px;
            background:rgba(13,110,253,0.14);
            border-radius:50%;
            top:-250px;
            left:-150px;
            filter:blur(80px);
            animation:float 8s infinite ease-in-out;
        }

        .about-hero::after{
            content:'';
            position:absolute;
            width:500px;
            height:500px;
            background:rgba(102,16,242,0.18);
            border-radius:50%;
            bottom:-180px;
            right:-120px;
            filter:blur(80px);
            animation:float 10s infinite ease-in-out;
        }

        @keyframes float{
            0%{
                transform:translateY(0px);
            }
            50%{
                transform:translateY(25px);
            }
            100%{
                transform:translateY(0px);
            }
        }

        .hero-content{
            position:relative;
            z-index:2;
        }

        .hero-content h1{
            font-size:4.5rem;
            font-weight:800;
            line-height:1.2;
        }

        .highlight{
            color:#67b3ff;
        }

        .hero-content p{
            max-width:850px;
            margin:auto;
            margin-top:28px;
            color:#d6dfeb;
            line-height:2;
            font-size:1.08rem;
        }

        /* =========================
           SECTION TITLE
        ========================== */

        .section-title{
            text-align:center;
            margin-bottom:80px;
        }

        .section-title h2{
            font-size:3rem;
            font-weight:800;
            margin-bottom:18px;
        }

        .section-title p{
            max-width:800px;
            margin:auto;
            color:var(--text);
            line-height:1.9;
        }

        /* =========================
           TREE SECTION
        ========================== */

        .tree-section{
            padding:120px 0;
            background:linear-gradient(to bottom, #f5f7fb, #ffffff);
            position:relative;
            overflow:hidden;
        }

        .tree-container{
            position:relative;
            max-width:1200px;
            margin:auto;
            padding:80px 0;
        }

        /* Tree Trunk */

        .tree-trunk{
            position:absolute;
            left:50%;
            top:0;
            transform:translateX(-50%);
            width:16px;
            height:100%;
            border-radius:20px;

            background:
            linear-gradient(to bottom,
            #5b3b1f,
            #8b5a2b,
            #5b3b1f);
        }

        /* Branch */

        .achievement{
            position:relative;
            width:50%;
            padding:40px 60px;
        }

        .achievement.left{
            left:0;
            text-align:right;
        }

        .achievement.right{
            left:50%;
        }

        .achievement::before{
            content:'';
            position:absolute;
            top:70px;
            width:90px;
            height:6px;
            background:#8b5a2b;
            border-radius:20px;
        }

        .achievement.left::before{
            right:-45px;
        }

        .achievement.right::before{
            left:-45px;
        }

        /* Leaf Circle */

        .leaf{
            position:absolute;
            top:48px;
            width:46px;
            height:46px;
            border-radius:50%;
            background:linear-gradient(135deg, #28c76f, #1e9e5a);
            border:5px solid #fff;
            box-shadow:0 8px 20px rgba(0,0,0,0.15);
            z-index:2;
        }

        .achievement.left .leaf{
            right:-23px;
        }

        .achievement.right .leaf{
            left:-23px;
        }

        /* Achievement Card */

        .achievement-card{
            background:#fff;
            border-radius:28px;
            padding:35px;
            box-shadow:0 15px 45px rgba(0,0,0,0.08);
            transition:0.5s;
            position:relative;
            overflow:hidden;
        }

        .achievement-card::before{
            content:'';
            position:absolute;
            width:220px;
            height:220px;
            background:rgba(13,110,253,0.08);
            border-radius:50%;
            top:-120px;
            right:-100px;
        }

        .achievement-card:hover{
            transform:translateY(-12px) scale(1.02);
            box-shadow:0 20px 55px rgba(0,0,0,0.14);
        }

        .achievement-card h3{
            font-size:2rem;
            color:var(--primary);
            font-weight:800;
            margin-bottom:18px;
        }

        .achievement-card h5{
            font-size:1.3rem;
            font-weight:700;
            margin-bottom:15px;
        }

        .achievement-card p{
            color:var(--text);
            line-height:1.9;
        }

        /* =========================
           VALUES SECTION
        ========================== */

        .values-section{
            padding:120px 0;
            background:#081120;
            color:#fff;
            text-align:center;
        }

        .values-section h2{
            font-size:3rem;
            font-weight:800;
            margin-bottom:25px;
        }

        .values-section p{
            max-width:850px;
            margin:auto;
            color:#d7deea;
            line-height:2;
        }

        .value-card{
            margin-top:50px;
            background:rgba(255,255,255,0.06);
            border:1px solid rgba(255,255,255,0.08);
            border-radius:30px;
            padding:40px 30px;
            transition:0.5s;
            height:100%;
        }

        .value-card:hover{
            transform:translateY(-10px);
            background:rgba(255,255,255,0.09);
        }

        .value-icon{
            width:90px;
            height:90px;
            margin:auto;
            margin-bottom:25px;
            border-radius:24px;

            background:
            linear-gradient(135deg,
            #0d6efd,
            #6610f2);

            display:flex;
            align-items:center;
            justify-content:center;
            font-size:38px;
        }

        .value-card h4{
            font-weight:700;
            margin-bottom:15px;
        }

        .value-card p{
            color:#d6deea;
            line-height:1.9;
        }

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

        .cta-section{
            padding:110px 0;
            text-align:center;
            background:#fff;
        }

        .cta-box{
            background:
            linear-gradient(135deg,
            #0d6efd,
            #6610f2);

            border-radius:35px;
            padding:80px 50px;
            color:#fff;
            position:relative;
            overflow:hidden;
        }

        .cta-box::before{
            content:'';
            position:absolute;
            width:350px;
            height:350px;
            background:rgba(255,255,255,0.08);
            border-radius:50%;
            top:-150px;
            right:-120px;
        }

        .cta-box h2{
            font-size:3rem;
            font-weight:800;
            position:relative;
            z-index:2;
        }

        .cta-box p{
            max-width:800px;
            margin:auto;
            margin-top:25px;
            line-height:2;
            position:relative;
            z-index:2;
        }

        .cta-btn{
            margin-top:40px;
            padding:16px 38px;
            border:none;
            border-radius:50px;
            background:#fff;
            color:#0d6efd;
            font-weight:700;
            transition:0.4s;
            position:relative;
            z-index:2;
        }

        .cta-btn:hover{
            transform:translateY(-5px);
        }

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

        @media(max-width:991px){

            .hero-content h1{
                font-size:3rem;
            }

            .section-title h2,
            .values-section h2,
            .cta-box h2{
                font-size:2.2rem;
            }

            .tree-trunk{
                left:25px;
            }

            .achievement{
                width:100%;
                padding-left:90px;
                padding-right:20px;
                text-align:left !important;
                left:0 !important;
            }

            .achievement::before{
                left:25px !important;
                width:40px;
            }

            .leaf{
                left:5px !important;
            }
        }

        @media(max-width:768px){

            .about-hero{
                min-height:80vh;
                padding:120px 0;
            }

            .hero-content h1{
                font-size:2.3rem;
            }

            .hero-content p{
                font-size:1rem;
            }

            .section-title h2,
            .values-section h2,
            .cta-box h2{
                font-size:1.9rem;
            }

            .achievement-card{
                padding:28px;
            }

            .cta-box{
                padding:60px 25px;
            }
        }