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

.about{
    padding:120px 0;
}

.about-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:80px;
    align-items:center;
}

.about-content .badge{
    margin-bottom:24px;
}

.about-features{
    display:grid;
    gap:18px;
}

.feature{
    display:flex;
    align-items:flex-start;
    gap:12px;
    font-size:1.05rem;
    line-height:1.6;
}

.feature .feature-check{
    margin-top:2px;
}

.about-cards{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:24px;
}

.about-card{
    min-height:190px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:36px;
    text-align:center;
    background:var(--surface);
    border:1px solid rgba(255,255,255,.08);
    border-radius:18px;
    transition:transform .35s ease,
               border-color .35s ease,
               box-shadow .35s ease;
}

.about-card:hover{
    transform:translateY(-8px);
    border-color:var(--primary);
    box-shadow:0 20px 45px rgba(0,0,0,.22);
}

.about-card span{
    display:block;
    margin-bottom:10px;
    color:var(--primary);
    font-size:clamp(1.6rem,3vw,2.5rem);
    font-weight:800;
    line-height:1.1;
}

.about-card small{
    color:var(--text-muted);
    line-height:1.6;
}


/* =====================================================
   SOLUTIONS
===================================================== */

.solutions{
    padding:120px 0;
    background:rgba(255,255,255,.015);
}

.solutions-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:30px;
}

.solution-card{
    min-height:320px;
    padding:40px 32px;
    background:var(--surface);
    border:1px solid rgba(255,255,255,.08);
    border-radius:20px;
    transition:transform .35s ease,
               border-color .35s ease,
               box-shadow .35s ease;
}

.solution-card:hover{
    transform:translateY(-10px);
    border-color:var(--primary);
    box-shadow:0 20px 45px rgba(0,0,0,.25);
}

.solution-icon{
    width:70px;
    height:70px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:24px;
    border:1px solid rgba(87,196,106,.16);
    border-radius:16px;
    background:rgba(87,196,106,.10);
    color:var(--primary);
    font-size:2rem;
    font-weight:800;
}

.solution-card h3{
    margin-bottom:18px;
    font-size:1.4rem;
}

.solution-card p{
    color:var(--text-muted);
    line-height:1.7;
}


/* =====================================================
   ADVANTAGES / SPECIALTIES
===================================================== */

.advantages{
    padding:120px 0;
    background:rgba(255,255,255,.025);
}

.advantages-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:32px;
}

.advantage-card{
    min-height:280px;
    padding:42px;
    background:var(--surface);
    border:1px solid rgba(255,255,255,.08);
    border-radius:22px;
    transition:transform .35s ease,
               border-color .35s ease,
               box-shadow .35s ease;
}

.advantage-card:hover{
    transform:translateY(-8px);
    border-color:var(--primary);
    box-shadow:0 20px 40px rgba(0,0,0,.25);
}

.advantage-icon{
    width:72px;
    height:72px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:26px;
    border:1px solid rgba(87,196,106,.16);
    border-radius:18px;
    background:rgba(87,196,106,.10);
    color:var(--primary);
    font-size:1.15rem;
    font-weight:800;
}

.advantage-card h3{
    margin-bottom:18px;
    font-size:1.45rem;
}

.advantage-card p{
    color:var(--text-muted);
    line-height:1.8;
}


/* =====================================================
   ARCHITECTURE
===================================================== */

.architecture{
    padding:120px 0;
}

.architecture-flow{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    flex-wrap:nowrap;
}

.flow-item{
    flex:1 1 0;
    min-width:0;
    min-height:180px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:30px 20px;
    text-align:center;
    background:var(--surface);
    border:1px solid rgba(255,255,255,.08);
    border-radius:20px;
    transition:transform .35s ease,
               border-color .35s ease,
               box-shadow .35s ease;
}

.flow-item:hover{
    transform:translateY(-8px);
    border-color:var(--primary);
    box-shadow:0 18px 40px rgba(0,0,0,.25);
}

.flow-icon{
    width:72px;
    height:72px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto 20px;
    border:1px solid rgba(87,196,106,.16);
    border-radius:18px;
    background:rgba(87,196,106,.10);
    color:var(--primary);
    font-size:2rem;
}

.flow-item h3{
    font-size:1.15rem;
    line-height:1.35;
}

.flow-line{
    flex:0 0 40px;
    height:3px;
    border-radius:999px;
    background:linear-gradient(
        90deg,
        var(--primary),
        var(--secondary)
    );
}


/* =====================================================
   STATS
===================================================== */

.stats{
    padding:40px 0 120px;
}

.stats-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:22px;
}

.stat-card{
    min-height:170px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:30px;
    background:rgba(255,255,255,.025);
    border:1px solid rgba(255,255,255,.07);
    border-radius:18px;
}

.stat-card strong{
    margin-bottom:12px;
    color:var(--text);
    font-size:1.15rem;
    line-height:1.4;
}

.stat-card span{
    color:var(--text-muted);
    line-height:1.65;
}


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

.cta-section{
    padding:0 0 120px;
}

.cta-box{
    position:relative;
    overflow:hidden;
    padding:72px;
    background:
        radial-gradient(
            circle at top right,
            rgba(53,167,255,.18),
            transparent 36%
        ),
        linear-gradient(
            135deg,
            rgba(87,196,106,.13),
            rgba(53,167,255,.08)
        ),
        var(--surface);
    border:1px solid rgba(255,255,255,.10);
    border-radius:28px;
    box-shadow:0 30px 70px rgba(0,0,0,.22);
}

.cta-box::after{
    content:"";
    position:absolute;
    right:-100px;
    bottom:-100px;
    width:280px;
    height:280px;
    border-radius:50%;
    background:rgba(87,196,106,.08);
    filter:blur(12px);
    pointer-events:none;
}

.cta-content{
    position:relative;
    z-index:1;
    max-width:820px;
}

.cta-content .badge{
    margin-bottom:24px;
}

.cta-content h2{
    margin-bottom:24px;
    font-size:clamp(2rem,4vw,3.2rem);
    line-height:1.15;
}

.cta-content p{
    max-width:760px;
    color:var(--text-muted);
    font-size:1.05rem;
    line-height:1.8;
}

.cta-actions{
    position:relative;
    z-index:1;
    display:flex;
    flex-wrap:wrap;
    gap:16px;
    margin-top:38px;
}

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

.footer{
    padding:72px 0 28px;
    background:rgba(3,8,13,.72);
    border-top:1px solid rgba(255,255,255,.07);
}

.footer-grid{
    display:grid;
    grid-template-columns:1.5fr repeat(3,1fr);
    gap:48px;
}

.footer-brand{
    max-width:340px;
}

.footer-brand .logo{
    display:inline-flex;
    margin-bottom:22px;
}

.footer-brand .logo img{
    max-width:190px;
    height:auto;
}

.footer-brand p{
    color:var(--text-muted);
    line-height:1.75;
}

.footer-links{
    display:flex;
    flex-direction:column;
    gap:13px;
}

.footer-links h3{
    margin-bottom:8px;
    font-size:1rem;
}

.footer-links a{
    color:var(--text-muted);
    font-size:.95rem;
    transition:color .25s ease,
               transform .25s ease;
}

.footer-links a:hover{
    color:var(--primary);
    transform:translateX(3px);
}

.footer-bottom{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    margin-top:58px;
    padding-top:24px;
    border-top:1px solid rgba(255,255,255,.07);
}

.footer-bottom p,
.footer-bottom a{
    color:var(--text-muted);
    font-size:.9rem;
}

.footer-bottom a{
    transition:color .25s ease;
}

.footer-bottom a:hover{
    color:var(--primary);
}

/* =====================================================
   ACCESSIBILITY
===================================================== */

.solution-card:focus-within,
.about-card:focus-within,
.advantage-card:focus-within,
.flow-item:focus-within,
.stat-card:focus-within{
    border-color:var(--primary);
}