:root {

    --radius: .875rem;

    --emerald: oklch(72% .17 158);

    --emerald-deep: oklch(42% .12 158);

    --emerald-glow: oklch(72% .17 158 / .35);

    --background: oklch(16% .012 250);

    --foreground: oklch(96% .005 250);

    --surface: oklch(20% .014 250);

    --surface-elevated: oklch(23.5% .014 250);

    --hairline: oklch(100% 0 0 / .06);

    --primary: var(--emerald);

    --primary-foreground: oklch(16% .012 250);

    --shadow-glow: 0 0 60px -10px var(--emerald-glow);

}

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

body{

    font-family:'Poppins', sans-serif;

    background:var(--background);

    color:var(--foreground);

    overflow-x:hidden;

}

h1,h2,h3,h4,h5,h6{
    font-weight:700;
}

p{
    color:var(--text-gray);
    line-height:1.8;
}

a{
    text-decoration:none;
    transition:var(--transition);
}



section{
    padding:100px 0;
}
.container{
    max-width:1200px;
}

.custom-card{

    background: var(--card-bg);

    border:1px solid var(--border-color);

    border-radius:20px;

    backdrop-filter: blur(10px);

    transition:var(--transition);

}

.custom-card:hover{

    transform:translateY(-5px);

    box-shadow: var(--shadow-glow);

}
html{
    scroll-behavior:smooth;
}
/* =========================
   HERO SECTION
========================= */

.hero-section{

    min-height:100vh;

    display:flex;

    align-items:flex-start;

    justify-content:center;

    text-align:center;

    position:relative;

    overflow:hidden;

    padding-left:40px;

    padding-right:40px;

    padding-top:30px;

    background:var(--background);

}

/* Atmospheric Glow */

.hero-section::before{

    content:'';

    position:absolute;

    width:850px;

    height:850px;

    background:rgba(30,214,162,0.08);

    border-radius:50%;

    top:-350px;

    left:50%;

    transform:translateX(-50%);

    filter:blur(180px);

}

/* Hero Content */

.hero-content{

    position:relative;

    z-index:2;

    width:100%;

    max-width:1400px;

    margin:auto;

    padding-top:50px;

}

/* Main Heading */

.hero-section h1{

    font-size:4.7rem;

    line-height:1.12;

    font-weight:700;

    margin-bottom:35px;

    color:var(--foreground);

    max-width:1400px;

    margin-left:auto;

    margin-right:auto;

    letter-spacing:-3px;

}
.hero-logo{

    position:relative;

    display:inline-block;

    margin-bottom:12px;

}
.hero-logo::before{

    content:'';

    position:absolute;

    width:150px;

    height:150px;

    background:
    radial-gradient(
        circle,
        var(--emerald) 0%,
        transparent 70%
    );

    top:50%;

    left:50%;

    transform:translate(-50%, -50%);

    filter:blur(45px);

    z-index:-1;

}

.hero-logo img{

    width:115px;

    animation:floatLogo 4s ease-in-out infinite;

    position:relative;

    z-index:2;

}

/* Floating Animation */

@keyframes floatLogo{

    0%{
        transform:translateY(0px);
    }

    50%{
        transform:translateY(-12px);
    }

    100%{
        transform:translateY(0px);
    }

}

/* Subtitle */

.hero-subtitle{

    display:block;

    color:rgba(255,255,255,0.45);

    letter-spacing:2px;

    font-size:10px;

    margin-bottom:25px;

}

/* Main Heading */

.hero-section h1{

    font-size:4.5rem;

    line-height:1.08;

    font-weight:500;

    margin-bottom:35px;

    color:#fff;

    max-width:1400px;

    margin-left:auto;

    margin-right:auto;

    letter-spacing:-3px;

}

.hero-section h1 span{

    color:var(--emerald);

}

.hero-section p{

    max-width:560px;

    margin:auto;

    font-size:0.95rem;

    line-height:1.9;

    color:rgba(255,255,255,0.60);

}

/* Buttons */

.hero-buttons{

    margin-top:50px;

    display:flex;

    justify-content:center;

    align-items:center;

    gap:12px;

    flex-wrap:wrap;

}

/* Responsive */

@media(max-width:991px){

    .hero-section h1{

        font-size:4.5rem;

    }

}

@media(max-width:768px){

    .hero-section h1{

        font-size:3.2rem;

    }

    .hero-section p{

        font-size:1rem;

    }

}
/* =========================
   PRIMARY BUTTON
========================= */

.btn-custom{

    background:var(--emerald);

    color:var(--primary-foreground);

    padding:10px 22px;

    border-radius:9999px;

    border:none;

    font-size:0.82rem;

    font-weight:500;

    transition:all 0.3s ease;

    box-shadow:
    0 0 24px -4px var(--emerald-glow);

}

.btn-custom:hover{

    opacity:0.90;

}

.btn-custom:hover{

    transform:translateY(-2px);

    background:var(--emerald);

}

.btn-outline-custom{

    border:1px solid rgba(255,255,255,0.10);

    color:var(--foreground);

    padding:10px 22px;

    border-radius:9999px;

    font-size:0.82rem;

    font-weight:500;

    transition:all 0.3s ease;

    background:transparent;

}

.btn-outline-custom:hover{

    border-color:var(--emerald);

    color:var(--emerald);

}


/* =========================
   PREMIUM NAVBAR
========================= */




.logo-text{

    font-size:1.35rem;

    font-weight:700;

    color:var(--foreground);

    letter-spacing:-1px;

}

.logo-text span{

    color:var(--emerald);

}

/* =========================
   PREMIUM NAVBAR
========================= */

.custom-navbar{

    padding:28px 0;

    background:rgba(7,17,31,0.65);

    backdrop-filter:blur(12px);

    transition:var(--transition);

    border-bottom:1px solid rgba(255,255,255,0.05);

}
/* Logo */

.logo-text{

    font-size:1.45rem;

    font-weight:700;

    color:var(--foreground);

    letter-spacing:-1px;

}

.logo-text span{

    color:var(--emerald);

}

/* Navbar Menu */

.navbar-nav{

    gap:10px;

}

/* Nav Links */

.navbar-nav .nav-link{

    color:rgba(255,255,255,0.68);

    font-size:0.82rem;

    font-weight:400;

    transition:all 0.3s ease;

    padding:6px 12px !important;

    border-radius:999px;

}

/* Active Link */

.navbar-nav .nav-link.active{

    color:var(--foreground);

    background:rgba(255,255,255,0.04);

}

/* Hover */

.navbar-nav .nav-link:hover{

    color:var(--foreground);

}

/* Remove old underline animation */

.navbar-nav .nav-link::after{

    display:none;

}
.navbar-toggler{

    border:none;

    box-shadow:none !important;

}
.navbar-toggler-icon{

    filter:invert(1);

}

/* Mobile */

@media(max-width:991px){

    .navbar-collapse{

        background:var(--surface);

        padding:20px;

        margin-top:20px;

        border-radius:20px;

    }

    .navbar-nav{

        gap:6px;

    }

}

.dashboard-card{

    overflow:hidden;

    border-radius:28px;

}
.dashboard-preview{

    margin-top:-120px;

}
.dashboard-card img{
    height:auto;

    max-height:720px;

    object-fit:cover;
}
/* =========================
   SERVICES SECTION
========================= */

.services-section{

    padding:120px 0;

}

/* Top Area */

.services-top{

    display:flex;

    justify-content:space-between;

    align-items:end;

    margin-bottom:40px;

    gap:20px;

    flex-wrap:wrap;

}

/* Label */

.section-label{

    font-size:0.62rem;

    letter-spacing:2px;

    color:rgba(255,255,255,0.45);

    display:block;

    margin-bottom:12px;

}

/* Title */

.section-title{

    font-size:2.4rem;

    line-height:1.15;

    letter-spacing:-1px;

    font-weight:500;

    color:var(--foreground);

    max-width:520px;

}

/* Link */

.services-link{

    color:var(--emerald);

    font-size:0.82rem;

    transition:all 0.3s ease;

}

.services-link:hover{

    opacity:0.8;

}

/* Service Card */

.service-card{

    background:rgba(255,255,255,0.02);

    border:1px solid rgba(255,255,255,0.05);

    border-radius:28px;

    padding:28px;

    height:100%;

    display:flex;

    flex-direction:column;

    justify-content:flex-start;

    transition:all 0.3s ease;

    backdrop-filter:blur(12px);

}

.service-card:hover{

    transform:translateY(-5px);

    border-color:rgba(255,255,255,0.10);

    background:rgba(255,255,255,0.03);

}

/* Large Card */

.service-card-large{

    min-height:100%;

}

/* Icon */

.service-icon{

    width:42px;

    height:42px;

    border-radius:14px;

    background:rgba(62,230,176,0.08);

    display:flex;

    align-items:center;

    justify-content:center;

    color:var(--emerald);

    font-size:0.9rem;

    margin-bottom:20px;

}

/* Card Heading */

.service-card h3{

    font-size:1rem;

    font-weight:600;

    color:var(--foreground);

    margin-bottom:14px;

    line-height:1.4;

}

/* Card Paragraph */

.service-card p{

    font-size:0.82rem;

    line-height:1.8;

    color:rgba(255,255,255,0.62);

    margin-bottom:0;

}

/* List */

.service-card ul{

    margin-top:18px;

    padding-left:18px;

}

.service-card ul li{

    color:rgba(255,255,255,0.58);

    margin-bottom:10px;

    font-size:0.78rem;

    line-height:1.7;

}
.service-list{

    list-style:none;

    padding:0;

    margin-top:20px;

}

.service-list li{

    display:flex;

    align-items:center;

    gap:10px;

    color:rgba(255,255,255,0.62);

    font-size:0.78rem;

    margin-bottom:14px;

}

.service-list li i{

    color:var(--emerald);

    font-size:0.72rem;

}
/* =========================
   ICON HOVER EFFECT
========================= */

.service-icon{

    width:42px;

    height:42px;

    border-radius:14px;

    background:rgba(62,230,176,0.08);

    display:flex;

    align-items:center;

    justify-content:center;

    color:var(--emerald);

    font-size:0.9rem;

    margin-bottom:20px;

    transition:all 0.35s ease;

}

/* Hover Effect */

.service-card:hover .service-icon{

    background:rgba(62,230,176,0.16);

    transform:translateY(-3px);

    box-shadow:
    0 0 30px -8px rgba(62,230,176,0.45);

    transform:scale(1.08);


}
.service-icon i{

    transition:all 0.35s ease;

}

/* Responsive */

@media(max-width:991px){

    .section-title{

        font-size:2rem;

    }

    .services-top{

        align-items:flex-start;

    }

}

@media(max-width:768px){

    .services-section{

        padding:90px 0;

    }

    .section-title{

        font-size:1.7rem;

    }

    .service-card{

        padding:24px;

    }

}
/* =========================
   WHY SECTION
========================= */

.why-section{

    padding:90px 0;

}

/* Left Text */

.why-text{

    max-width:500px;

    font-size:0.82rem;

    line-height:1.9;

    color:rgba(255,255,255,0.58);

    margin-top:22px;

}

/* Grid Cards */

.why-card{

    background:rgba(255,255,255,0.02);

    border:1px solid rgba(255,255,255,0.05);

    border-radius:22px;

    padding:22px;

    height:100%;

    transition:all 0.3s ease;

    backdrop-filter:blur(10px);

}

.why-card:hover{

    transform:translateY(-4px);

    border-color:rgba(25,230,178,0.14);

    background:rgba(255,255,255,0.03);

}

/* Icon */

.why-icon{

    width:38px;

    height:38px;

    border-radius:12px;

    background:rgba(25,230,178,0.08);

    display:flex;

    align-items:center;

    justify-content:center;

    color:var(--emerald);

    font-size:0.78rem;

    margin-bottom:16px;

    transition:all 0.3s ease;

}

.why-card:hover .why-icon{

    transform:translateY(-2px);

    background:rgba(25,230,178,0.14);

    box-shadow:
    0 0 24px -10px rgba(25,230,178,0.45);

}

/* Card Title */

.why-card h3{

    font-size:0.88rem;

    font-weight:600;

    color:var(--foreground);

    margin-bottom:10px;

}

/* Card Paragraph */

.why-card p{

    font-size:0.74rem;

    line-height:1.8;

    color:rgba(255,255,255,0.56);

    margin:0;

}

/* Green Word */

.section-title span{

    color:var(--emerald);

}

/* Responsive */

@media(max-width:991px){

    .why-section{

        padding:70px 0;

    }

}

/* =========================
   PROCESS SECTION
========================= */

.process-section{

    padding:90px 0;

}

/* Top */

.process-top{

    margin-bottom:60px;

}

/* Grid */

.process-grid{

    position:relative;

}

/* Timeline Line */

.process-grid::before{

    content:'';

    position:absolute;

    top:18px;

    left:0;

    width:100%;

    height:1px;

    background:rgba(255,255,255,0.06);

}

/* Item */

.process-item{

    position:relative;

    padding-top:45px;

}

/* Number */

.process-number{

    display:inline-block;

    font-size:0.7rem;

    color:rgba(255,255,255,0.35);

    margin-bottom:18px;

    letter-spacing:1px;

}

/* Dot */

.process-item::before{

    content:'';

    position:absolute;

    top:14px;

    left:0;

    width:9px;

    height:9px;

    border-radius:50%;

    background:var(--emerald);

    box-shadow:
    0 0 18px rgba(25,230,178,0.55);

}

/* Heading */

.process-item h3{

    font-size:0.92rem;

    font-weight:600;

    margin-bottom:14px;

    color:var(--foreground);

}

/* Text */

.process-item p{

    font-size:0.76rem;

    line-height:1.9;

    color:rgba(255,255,255,0.56);

    max-width:220px;

}

/* Responsive */

@media(max-width:991px){

    .process-grid::before{

        display:none;

    }

    .process-item{

        margin-bottom:40px;

    }

}
/* =========================
   PORTFOLIO SECTION
========================= */

.portfolio-section{

    padding:90px 0;

}

/* Top */

.portfolio-top{

    display:flex;

    justify-content:space-between;

    align-items:end;

    gap:20px;

    margin-bottom:40px;

    flex-wrap:wrap;

}

/* Card */

.portfolio-card{

    background:rgba(255,255,255,0.02);

    border:1px solid rgba(255,255,255,0.05);

    border-radius:24px;

    overflow:hidden;

    transition:all 0.35s ease;

}

.portfolio-card:hover{

    transform:translateY(-5px);

    border-color:rgba(25,230,178,0.14);

}

/* Image */

.portfolio-image{

    overflow:hidden;

}

.portfolio-image img{

    width:100%;

    display:block;

    transition:all 0.45s ease;

}

.portfolio-card:hover .portfolio-image img{

    transform:scale(1.03);

}

/* Content */

.portfolio-content{

    padding:20px;

    display:flex;

    justify-content:space-between;

    align-items:center;

}

/* Heading */

.portfolio-content h3{

    font-size:0.9rem;

    font-weight:600;

    margin-bottom:6px;

    color:var(--foreground);

}

/* Paragraph */

.portfolio-content p{

    font-size:0.72rem;

    color:rgba(255,255,255,0.56);

    margin:0;

}

/* Arrow */

.portfolio-content span{

    color:var(--emerald);

    font-size:1rem;

}

/* Responsive */

@media(max-width:991px){

    .portfolio-section{

        padding:70px 0;

    }

}
/* =========================
   TECH STACK SECTION
========================= */

.stack-section{

    padding:90px 0;

}

/* Main Box */

.stack-box{

    background:rgba(255,255,255,0.02);

    border:1px solid rgba(255,255,255,0.05);

    border-radius:30px;

    padding:70px 50px;

    text-align:center;

    position:relative;

    overflow:hidden;

}

/* Soft Glow */

.stack-box::before{

    content:'';

    position:absolute;

    top:-120px;

    left:50%;

    transform:translateX(-50%);

    width:400px;

    height:400px;

    background:rgba(25,230,178,0.08);

    filter:blur(120px);

    pointer-events:none;

}

/* Title */

.stack-title{

    font-size:2rem;

    font-weight:500;

    letter-spacing:-1px;

    margin-top:12px;

    margin-bottom:18px;

    color:var(--foreground);

}

/* Text */

.stack-text{

    max-width:620px;

    margin:auto;

    font-size:0.82rem;

    line-height:1.9;

    color:rgba(255,255,255,0.58);

}

/* Stack Items */

.stack-items{

    display:flex;

    justify-content:center;

    flex-wrap:wrap;

    gap:14px;

    margin-top:40px;

}

/* Single Item */

.stack-items span{

    padding:10px 18px;

    border-radius:999px;

    background:rgba(255,255,255,0.03);

    border:1px solid rgba(255,255,255,0.05);

    color:rgba(255,255,255,0.72);

    font-size:0.75rem;

    transition:all 0.3s ease;

}

/* Hover */

.stack-items span:hover{

    border-color:rgba(25,230,178,0.22);

    color:var(--emerald);

    transform:translateY(-2px);

}

/* Responsive */

@media(max-width:768px){

    .stack-box{

        padding:50px 28px;

    }

    .stack-title{

        font-size:1.6rem;

    }

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

.cta-section{

    padding:90px 0 120px;

}

/* Box */

.cta-box{

    position:relative;

    overflow:hidden;

    background:rgba(255,255,255,0.02);

    border:1px solid rgba(255,255,255,0.05);

    border-radius:32px;

    padding:90px 40px;

    text-align:center;

}

/* Emerald Glow */

.cta-box::before{

    content:'';

    position:absolute;

    top:-120px;

    left:50%;

    transform:translateX(-50%);

    width:420px;

    height:420px;

    background:rgba(25,230,178,0.10);

    filter:blur(140px);

    pointer-events:none;

}

/* Title */

.cta-title{

    position:relative;

    z-index:2;

    font-size:3rem;

    line-height:1.08;

    letter-spacing:-2px;

    font-weight:600;

    color:var(--foreground);

    margin-top:14px;

    margin-bottom:32px;

}

/* Buttons */

.cta-buttons{

    position:relative;

    z-index:2;

    display:flex;

    justify-content:center;

    align-items:center;

    gap:22px;

    flex-wrap:wrap;

}

/* Email */

.cta-email{

    color:rgba(255,255,255,0.72);

    font-size:0.88rem;

    transition:all 0.3s ease;

}

.cta-email:hover{

    color:var(--emerald);

}

/* Responsive */

@media(max-width:768px){

    .cta-box{

        padding:70px 24px;

    }

    .cta-title{

        font-size:2rem;

        line-height:1.2;

    }

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

.footer-section{

    padding:100px 0 40px;

    border-top:1px solid rgba(255,255,255,0.05);

}

/* Logo */

.footer-logo{

    font-size:2rem;

    font-weight:700;

    color:#fff;

    display:inline-block;

    margin-bottom:20px;

}

.footer-logo span{

    color:var(--emerald);

}

/* Text */

.footer-text{

    max-width:320px;

    font-size:0.8rem;

    line-height:1.9;

    color:rgba(255,255,255,0.58);

}

/* Socials */

.footer-socials{

    display:flex;

    gap:14px;

    margin-top:24px;

}

.footer-socials a{

    width:38px;

    height:38px;

    border-radius:50%;

    background:rgba(255,255,255,0.03);

    border:1px solid rgba(255,255,255,0.05);

    display:flex;

    align-items:center;

    justify-content:center;

    color:rgba(255,255,255,0.72);

    transition:all 0.3s ease;

}

.footer-socials a:hover{

    color:var(--emerald);

    border-color:rgba(25,230,178,0.18);

    transform:translateY(-2px);

}

/* Heading */

.footer-heading{

    font-size:0.9rem;

    font-weight:600;

    margin-bottom:20px;

    color:#fff;

}

/* Links */

.footer-links{

    list-style:none;

    padding:0;

    margin:0;

}

.footer-links li{

    margin-bottom:14px;

    font-size:0.78rem;

    color:rgba(255,255,255,0.58);

}

.footer-links a{

    color:rgba(255,255,255,0.58);

    transition:all 0.3s ease;

}

.footer-links a:hover{

    color:var(--emerald);

}

/* Icons */

.footer-links i{

    color:var(--emerald);

    margin-right:10px;

}

/* Bottom */

.footer-bottom{

    margin-top:70px;

    padding-top:24px;

    border-top:1px solid rgba(255,255,255,0.05);

    display:flex;

    justify-content:space-between;

    align-items:center;

    flex-wrap:wrap;

    gap:12px;

}

.footer-bottom p,
.footer-bottom span{

    font-size:0.74rem;

    color:rgba(255,255,255,0.42);

    margin:0;

}

/* Responsive */

@media(max-width:768px){

    .footer-section{

        padding:80px 0 30px;

    }

    .footer-bottom{

        margin-top:50px;

    }

}

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

.about-hero{

    min-height:100vh;

    display:flex;

    align-items:center;

    text-align:center;

    padding-top:180px;

    padding-bottom:140px;

}

.about-hero-content{

    max-width:900px;

    margin:auto;

}

.about-hero h1{

    font-size: 6rem;

    line-height:1;

    font-weight:700;

    margin:25px 0;

    letter-spacing: -4px;


}

.about-hero h1 span{

    color:var(--emerald);

}

.about-hero p{

    max-width:700px;

    margin:auto;

    font-size:1rem;

    line-height:1.9;

    color:rgba(255,255,255,0.65);

}
/* =========================
   STORY SECTION
========================= */

.story-section{

    padding:90px 0;

}

.story-text{

    font-size:0.9rem;

    line-height:2;

    color:rgba(255,255,255,0.62);

    max-width:700px;

}

/* Stats */

.stat-card{

    background:rgba(255,255,255,0.02);

    border:1px solid rgba(255,255,255,0.05);

    border-radius:24px;

    padding:28px;

    text-align:center;

    transition:all 0.3s ease;

}

.stat-card:hover{

    transform:translateY(-4px);

    border-color:rgba(25,230,178,0.18);

}

.stat-card h3{

    color:var(--emerald);

    font-size:2rem;

    font-weight:600;

    margin-bottom:8px;

}

.stat-card p{

    color:rgba(255,255,255,0.55);

    font-size:0.75rem;

    margin:0;

    letter-spacing:1px;

}
.story-section .col-lg-5{
    padding-right:50px;
}

.story-section h2{
    font-size:4rem;
    line-height:1;
    letter-spacing:-3px;
}


.value-card{
    padding:28px;
    min-height:220px;
}
.stat-card{

    background:rgba(255,255,255,0.03);

    border:1px solid rgba(255,255,255,0.05);

    border-radius:20px;

    padding:24px;

    min-height:100px;

    display:flex;

    flex-direction:column;

    justify-content:center;

    text-align:left;

    transition:all .3s ease;

}

.stat-card h3{

    color:var(--emerald);

    font-size:2rem;

    font-weight:700;

    margin-bottom:6px;

    line-height:1;

}

.stat-card p{

    margin:0;

    font-size:.75rem;

    color:rgba(255,255,255,.55);

}
/* =========================
   STORY SECTION
========================= */

.story-section{

    padding:120px 0;

}

.story-title{

    font-size:4.5rem;

    line-height:0.95;

    letter-spacing:-3px;

    font-weight:600;

    color:#fff;

    max-width:500px;

}

.story-content{

    max-width:700px;

}

.story-content p{

    color:rgba(255,255,255,.65);

    font-size:.95rem;

    line-height:2;

    margin-bottom:20px;

}

/* Stats */

.stat-card{

    background:rgba(255,255,255,.025);

    border:1px solid rgba(255,255,255,.05);

    border-radius:20px;

    padding:24px;

    transition:.3s;

    height:100%;

}

.stat-card:hover{

    border-color:rgba(0,255,180,.15);

    transform:translateY(-3px);

}

.stat-card h3{

    color:var(--emerald);

    font-size:2rem;

    font-weight:700;

    margin-bottom:6px;

    line-height:1;

}

.stat-card p{

    margin:0;

    font-size:.72rem;

    letter-spacing:1px;

    color:rgba(255,255,255,.55);

}

/* Mobile */

@media(max-width:991px){

    .story-title{

        font-size:3rem;

    }

}

/* =========================
   CORE VALUES
========================= */

.values-section{

    padding:120px 0;

}

.values-header{

    margin-bottom:60px;

}

.values-title{

    max-width:700px;

    margin:auto;

    font-size:3.8rem;

    line-height:1.05;

    letter-spacing:-2px;

    font-weight:600;

}

/* Card */

.value-card{

    background:rgba(255,255,255,.025);

    border:1px solid rgba(255,255,255,.05);

    border-radius:24px;

    padding:32px;

    height:100%;

    transition:.35s;

}

.value-card:hover{

    transform:translateY(-5px);

    border-color:rgba(0,255,180,.18);

}

/* Icon */

.value-icon{

    width:46px;

    height:46px;

    border-radius:50%;

    background:rgba(0,255,180,.08);

    display:flex;

    align-items:center;

    justify-content:center;

    color:var(--emerald);

    margin-bottom:22px;

}

/* Title */

.value-card h3{

    font-size:1rem;

    font-weight:600;

    margin-bottom:14px;

}

/* Text */

.value-card p{

    color:rgba(255,255,255,.58);

    line-height:1.8;

    font-size:.85rem;

}

/* =========================
   WHY SECTION
========================= */

.why-section{

    padding:120px 0;

}

.why-top{

    display:flex;

    justify-content:space-between;

    align-items:end;

    margin-top:15px;

    margin-bottom:60px;

    flex-wrap:wrap;

    gap:20px;

}

.why-title{

    font-size:4rem;

    font-weight:600;

    letter-spacing:-3px;

    margin:0;

}

.why-link{

    color:var(--emerald);

    font-size:.85rem;

}

/* Grid */

.why-grid{

    border-top:1px solid rgba(255,255,255,.05);

    border-left:1px solid rgba(255,255,255,.05);

}

.why-item{

    padding:45px;

    border-right:1px solid rgba(255,255,255,.05);

    border-bottom:1px solid rgba(255,255,255,.05);

    min-height:240px;

}

.why-number{

    display:block;

    font-size:.7rem;

    color:rgba(255,255,255,.35);

    margin-bottom:25px;

}

.why-item h3{

    font-size:1.5rem;

    line-height:1.2;

    margin-bottom:16px;

}

.why-item p{

    color:rgba(255,255,255,.55);

    line-height:1.8;

}

/* Trust Cards */

.trust-card{

    background:rgba(255,255,255,.02);

    border:1px solid rgba(255,255,255,.05);

    border-radius:20px;

    padding:22px;

    display:flex;

    gap:15px;

    align-items:flex-start;

}

.trust-card i{

    color:var(--emerald);

    margin-top:4px;

}

.trust-card h4{

    font-size:.9rem;

    margin-bottom:5px;

}

.trust-card p{

    margin:0;

    font-size:.75rem;

    color:rgba(255,255,255,.55);

}

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

.about-cta-section{

    padding:120px 0;

}

.about-cta-box{

    position:relative;

    overflow:hidden;

    text-align:center;

    padding:100px 50px;

    border-radius:32px;

    background:rgba(255,255,255,.02);

    border:1px solid rgba(255,255,255,.05);

}

/* Glow */

.about-cta-box::before{

    content:'';

    position:absolute;

    top:-150px;

    left:50%;

    transform:translateX(-50%);

    width:500px;

    height:500px;

    background:rgba(0,255,180,.08);

    filter:blur(140px);

    pointer-events:none;

}

.about-cta-title{

    position:relative;

    z-index:2;

    font-size:3.5rem;

    line-height:1.05;

    letter-spacing:-3px;

    font-weight:600;

    margin-top:18px;

    margin-bottom:20px;

}

.about-cta-text{

    position:relative;

    z-index:2;

    max-width:650px;

    margin:auto;

    color:rgba(255,255,255,.6);

    line-height:1.9;

}

.about-cta-buttons{

    position:relative;

    z-index:2;

    display:flex;

    justify-content:center;

    align-items:center;

    gap:20px;

    margin-top:35px;

    flex-wrap:wrap;

}

.cta-email{

    color:rgba(255,255,255,.7);

    transition:.3s;

}

.cta-email:hover{

    color:var(--emerald);

}