:root{
    --about-gold:#e8b65b;
    --about-blue:#4879c9;
    --about-soft:#f7f5ef;
}

.about-hero{
    position:relative;
    overflow:hidden;
    padding:155px 0 95px;
    background:linear-gradient(135deg,#061326 0%,#0a2140 55%,#243a5f 100%);
    color:#fff;
}
.about-grid-lines{
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
    background-size:36px 36px;
    mask-image:linear-gradient(to bottom,#000 35%,transparent);
}
.about-orb{
    position:absolute;
    border-radius:50%;
    filter:blur(20px);
}
.about-orb-one{
    width:360px;
    height:360px;
    right:3%;
    top:8%;
    background:rgba(232,182,91,.17);
}
.about-orb-two{
    width:430px;
    height:430px;
    left:-13%;
    bottom:-25%;
    background:rgba(72,121,201,.18);
}
.about-hero-grid{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
    align-items:center;
}
.about-hero-copy h1{
    font-size:clamp(2.9rem,5vw,5rem);
    line-height:1.02;
    letter-spacing:-.05em;
    margin:0 0 24px;
}
.about-hero-copy h1 span{color:#f2c978}
.about-hero-copy p{
    max-width:660px;
    margin:0 0 32px;
    color:#dce3ed;
    font-size:1.13rem;
}
.about-trust{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:30px;
}
.about-trust span{
    position:relative;
    padding:8px 12px 8px 28px;
    border:1px solid rgba(255,255,255,.13);
    background:rgba(255,255,255,.055);
    border-radius:999px;
    color:#e6e9ef;
    font-size:.84rem;
}
.about-trust span:before{
    content:"";
    position:absolute;
    left:11px;
    top:50%;
    width:7px;
    height:7px;
    border-radius:50%;
    background:#f2c978;
    transform:translateY(-50%);
}
.about-hero-visual img{
    width:100%;
    filter:drop-shadow(0 40px 55px rgba(0,0,0,.4));
    animation:aboutFloat 6s ease-in-out infinite;
}
@keyframes aboutFloat{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-10px)}
}

.about-message{
    padding:58px 0;
    border-bottom:1px solid var(--line);
    background:#fff;
}
.about-message-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:50px;
    align-items:center;
}
.about-message h2{
    font-size:clamp(2rem,4vw,3rem);
    line-height:1.08;
    letter-spacing:-.04em;
    margin:0;
}
.about-message p{
    margin:0;
    color:var(--muted);
    font-size:1.04rem;
}

.about-history-grid{
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:50px;
    align-items:center;
}
.about-history-copy h2{
    font-size:clamp(2rem,4vw,3.2rem);
    line-height:1.08;
    letter-spacing:-.04em;
    margin:0 0 22px;
}
.about-history-copy p{
    color:var(--muted);
    margin:0 0 17px;
}
.about-history-card{
    padding:38px;
    border-radius:28px;
    background:linear-gradient(135deg,#0b2946,#283b5d);
    color:#fff;
    box-shadow:0 22px 55px rgba(7,22,43,.17);
}
.history-label{
    display:inline-flex;
    padding:8px 12px;
    border-radius:999px;
    background:rgba(232,182,91,.16);
    color:#f2c978;
    font-weight:900;
}
.about-history-card blockquote{
    margin:22px 0 18px;
    font-size:1.7rem;
    line-height:1.25;
    font-weight:800;
}
.about-history-card p{
    color:#d5deea;
    margin:0;
}

.about-pillars-section{
    background:linear-gradient(135deg,#f7f9fc,#f7f5ef);
}
.about-pillars-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:22px;
}
.about-pillar-card{
    padding:30px;
    border:1px solid var(--line);
    border-radius:24px;
    background:#fff;
    box-shadow:0 12px 34px rgba(7,22,43,.055);
}
.about-pillar-card span{
    display:flex;
    width:50px;
    height:50px;
    align-items:center;
    justify-content:center;
    border-radius:15px;
    background:linear-gradient(145deg,#0a2340,#344d76);
    color:#f2c978;
    font-weight:900;
}
.about-pillar-card h3{
    margin:20px 0 9px;
    font-size:1.3rem;
}
.about-pillar-card p{
    margin:0;
    color:var(--muted);
}

.about-values-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
}
.about-values-grid div{
    padding:22px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:17px;
    background:rgba(255,255,255,.05);
}
.about-values-grid strong{
    display:block;
    margin-bottom:6px;
    color:#f2c978;
}
.about-values-grid span{
    color:#cbd5e4;
    font-size:.92rem;
}

.about-process{
    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:16px;
    position:relative;
}
.about-process:before{
    content:"";
    position:absolute;
    top:27px;
    left:8%;
    right:8%;
    height:2px;
    background:linear-gradient(90deg,var(--about-gold),var(--about-blue));
}
.about-step{
    position:relative;
    text-align:center;
    padding:0 8px;
}
.about-step span{
    position:relative;
    z-index:2;
    display:flex;
    width:56px;
    height:56px;
    align-items:center;
    justify-content:center;
    margin:0 auto 18px;
    border-radius:50%;
    background:linear-gradient(135deg,var(--about-gold),var(--about-blue));
    color:#fff;
    font-weight:900;
    box-shadow:0 12px 28px rgba(72,121,201,.18);
}
.about-step h3{
    margin:0 0 8px;
    font-size:1.03rem;
}
.about-step p{
    margin:0;
    color:var(--muted);
    font-size:.88rem;
}

.about-solutions-section{
    background:linear-gradient(135deg,#f8fafc,#fff);
}
.about-solutions-grid{
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:50px;
    align-items:center;
}
.about-solutions-grid h2{
    font-size:clamp(2rem,4vw,3.2rem);
    line-height:1.08;
    letter-spacing:-.04em;
    margin:0 0 18px;
}
.about-solutions-grid p{
    color:var(--muted);
    margin:0;
}
.about-solution-list{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
}
.about-solution-list a{
    padding:20px;
    border:1px solid var(--line);
    border-radius:17px;
    background:#fff;
    box-shadow:0 10px 28px rgba(7,22,43,.05);
    transition:.22s;
}
.about-solution-list a:hover{
    transform:translateY(-4px);
    border-color:rgba(232,182,91,.55);
}
.about-solution-list strong{
    display:block;
    color:#2f4770;
    margin-bottom:5px;
}
.about-solution-list span{
    color:var(--muted);
    font-size:.9rem;
}

.about-evolution-section{
    background:#fff;
}
.about-timeline{
    position:relative;
    max-width:850px;
    margin:0 auto;
}
.about-timeline:before{
    content:"";
    position:absolute;
    top:0;
    bottom:0;
    left:16px;
    width:2px;
    background:linear-gradient(var(--about-gold),var(--about-blue));
}
.timeline-item{
    position:relative;
    padding:0 0 30px 55px;
}
.timeline-item > span{
    position:absolute;
    left:5px;
    top:3px;
    width:24px;
    height:24px;
    border-radius:50%;
    border:5px solid #fff;
    background:linear-gradient(135deg,var(--about-gold),var(--about-blue));
    box-shadow:0 4px 15px rgba(72,121,201,.2);
}
.timeline-item strong{
    display:block;
    font-size:1.12rem;
    margin-bottom:5px;
}
.timeline-item p{
    margin:0;
    color:var(--muted);
}

.about-cta{padding-top:30px}
.about-cta-box{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    padding:48px;
    border-radius:28px;
    background:linear-gradient(135deg,#dca64a,#557fc2);
    color:#fff;
    box-shadow:0 22px 55px rgba(72,121,201,.22);
}
.about-cta-box .eyebrow{color:#fff4d8}
.about-cta-box h2{
    margin:0 0 12px;
    font-size:clamp(2rem,4vw,3.2rem);
    line-height:1.08;
    letter-spacing:-.04em;
}
.about-cta-box p{
    margin:0;
    color:#f3f5f9;
}

@media(max-width:980px){
    .about-hero-grid,
    .about-message-grid,
    .about-history-grid,
    .about-solutions-grid{
        grid-template-columns:1fr;
    }
    .about-hero-copy{text-align:center}
    .about-hero-copy p{margin-left:auto;margin-right:auto}
    .about-hero-copy .hero-actions,
    .about-trust{justify-content:center}
    .about-hero-visual{max-width:720px;margin:auto}
    .about-pillars-grid{grid-template-columns:1fr}
    .about-process{grid-template-columns:repeat(3,1fr)}
    .about-process:before{display:none}
}
@media(max-width:680px){
    .about-hero{padding:120px 0 70px}
    .about-hero-copy h1{font-size:2.55rem}
    .about-message{padding:48px 0}
    .about-values-grid,
    .about-process,
    .about-solution-list{
        grid-template-columns:1fr;
    }
    .about-history-card{padding:30px}
    .about-cta-box{
        flex-direction:column;
        align-items:flex-start;
        padding:31px;
    }
    .about-cta-box .btn{width:100%}
}