/* =====================================================
   RESOCOM — QUI SOMMES-NOUS
===================================================== */

:root{
    --about-orange:#F6903D;
    --about-terracotta:#BE3F23;
    --about-blue-light:#62A3C4;
    --about-blue:#16486B;
    --about-blue-dark:#0F2F46;
    --about-black:#010A1F;
    --about-grey:#F3F3F3;
    --about-beige:#F7EBDD;
    --about-white:#ffffff;
    --about-text-soft:#475467;
    --about-border:rgba(1,10,31,.08);
    --about-container:1240px;
}

.resocom-about-page,
.resocom-about-page *{
    box-sizing:border-box;
}

.resocom-about-page{
    width:100%;
    max-width:100vw;
    margin:0;
    padding:0;
    overflow-x:hidden;
    color:var(--about-black);
    background:var(--about-white);
    font-family:inherit;
}

.resocom-about-page a{
    text-decoration:none;
}

.resocom-about-page img{
    display:block;
    max-width:100%;
}

.about-container{
    position:relative;
    z-index:2;
    width:100%;
    max-width:var(--about-container);
    margin:0 auto;
}

.about-eyebrow{
    display:inline-flex;
    align-items:center;
    margin-bottom:18px;
    padding:8px 15px;
    border-radius:999px;
    background:rgba(22,72,107,.08);
    color:var(--about-blue);
    font-size:13px;
    line-height:1.35;
    font-weight:850;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.about-eyebrow--light{
    border:1px solid rgba(255,255,255,.16);
    background:rgba(255,255,255,.1);
    color:var(--about-white);
}

.about-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:54px;
    padding:16px 28px;
    border:1px solid transparent;
    border-radius:999px;
    color:var(--about-white);
    font-size:16px;
    line-height:1;
    font-weight:850;
    transition:transform .25s ease,background .25s ease,box-shadow .25s ease;
}

.about-button:hover{
    transform:translateY(-2px);
    color:var(--about-white);
}

.about-button:focus-visible,
.about-needs__links a:focus-visible{
    outline:3px solid var(--about-orange);
    outline-offset:4px;
}

.about-button--primary{
    background:var(--about-orange);
    box-shadow:0 18px 38px rgba(246,144,61,.28);
}

.about-button--primary:hover{
    background:var(--about-terracotta);
}

.about-button--ghost{
    border-color:rgba(255,255,255,.28);
    background:rgba(255,255,255,.1);
}

.about-button--ghost:hover{
    background:rgba(255,255,255,.18);
}

.about-section-heading h2,
.about-commitments__intro h2,
.about-needs__content h2{
    margin:0;
    font-size:clamp(34px,4.2vw,56px);
    line-height:1.06;
    letter-spacing:-.045em;
    font-weight:900;
}

.about-section-heading--center{
    max-width:900px;
    margin:0 auto 58px;
    text-align:center;
}

.about-section-heading--center p{
    max-width:740px;
    margin:24px auto 0;
    font-size:18px;
    line-height:1.7;
}

.about-section-heading--light,
.about-section-heading--light h2{
    color:var(--about-white);
}

.about-section-heading--light p{
    color:rgba(255,255,255,.76);
}

/* Hero */
.about-hero{
    position:relative;
    min-height:720px;
    padding:110px 24px;
    overflow:hidden;
    background:
        radial-gradient(circle at 12% 18%,rgba(98,163,196,.22),transparent 32%),
        linear-gradient(135deg,var(--about-black),var(--about-blue-dark) 58%,var(--about-blue));
}

.about-hero::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;
    background:radial-gradient(420px circle at 82% 78%,rgba(246,144,61,.13),transparent 68%);
}

.about-hero__glow{
    position:absolute;
    right:-180px;
    bottom:-260px;
    width:620px;
    height:620px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(246,144,61,.22),transparent 68%);
}

.about-hero__layout{
    display:grid;
    grid-template-columns:minmax(0,1.12fr) minmax(380px,.88fr);
    gap:72px;
    align-items:center;
}

.about-hero__content h1{
    max-width:780px;
    margin:0 0 26px;
    color:var(--about-white);
    font-size:clamp(44px,5.6vw,72px);
    line-height:1.01;
    letter-spacing:-.055em;
    font-weight:900;
}

.about-hero__content > p{
    max-width:700px;
    margin:0;
    color:rgba(255,255,255,.8);
    font-size:19px;
    line-height:1.7;
}

.about-hero__actions{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin-top:34px;
}

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

.about-proof-card{
    position:relative;
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:150px;
    padding:30px 27px 26px;
    overflow:hidden;
    border:1px solid rgba(246,144,61,.18);
    border-radius:24px;
    background:var(--about-beige);
    box-shadow:0 22px 50px rgba(1,10,31,.18);
    height:100%;
}

.about-proof-float{
    animation:about-proof-float 5s ease-in-out infinite;
}

.about-proof-float:nth-child(2){animation-delay:.45s;}
.about-proof-float:nth-child(3){animation-delay:.9s;}
.about-proof-float:nth-child(4){animation-delay:1.35s;}

.about-proof-card__inner{
    position:relative;
    z-index:2;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.about-proof-card::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:5px;
    background:linear-gradient(90deg,var(--proof-accent),var(--about-orange),var(--proof-accent));
    background-size:200% 100%;
    z-index:1;
    animation:about-proof-shimmer 4.5s linear infinite;
}

.about-proof-card--orange{--proof-accent:var(--about-orange);}
.about-proof-card--blue{--proof-accent:var(--about-blue-light);}
.about-proof-card--terracotta{--proof-accent:var(--about-terracotta);}
.about-proof-card--mist{--proof-accent:var(--about-blue);}

.about-proof-card strong{
    position:relative;
    z-index:2;
    display:block;
    margin-bottom:10px;
    color:var(--proof-accent);
    font-size:clamp(27px,3vw,40px);
    line-height:1;
    font-weight:950;
    opacity:1;
    filter:none;
    mix-blend-mode:normal;
}

.about-proof-card__inner > span{
    position:relative;
    z-index:2;
    color:var(--about-blue-dark);
    font-size:15px;
    line-height:1.4;
    font-weight:800;
    opacity:1;
    filter:none;
    mix-blend-mode:normal;
}

@keyframes about-proof-shimmer{
    to{background-position:200% 0;}
}

@keyframes about-proof-float{
    0%,100%{translate:0 0;}
    50%{translate:0 -7px;}
}

.resocom-about-js .resocom-about-page:not(.is-ready) .about-hero__content,
.resocom-about-js .resocom-about-page:not(.is-ready) .about-proof-card{
    opacity:0;
    transform:translateY(24px);
}

.resocom-about-js .resocom-about-page.is-ready .about-hero__content{
    animation:about-hero-in .9s cubic-bezier(.22,1,.36,1) .08s backwards;
}

.resocom-about-js .resocom-about-page.is-ready .about-proof-card{
    animation:about-hero-in .8s cubic-bezier(.22,1,.36,1) backwards;
}

.resocom-about-js .resocom-about-page.is-ready .about-proof-float:nth-child(1) .about-proof-card{animation-delay:.18s;}
.resocom-about-js .resocom-about-page.is-ready .about-proof-float:nth-child(2) .about-proof-card{animation-delay:.26s;}
.resocom-about-js .resocom-about-page.is-ready .about-proof-float:nth-child(3) .about-proof-card{animation-delay:.34s;}
.resocom-about-js .resocom-about-page.is-ready .about-proof-float:nth-child(4) .about-proof-card{animation-delay:.42s;}

@keyframes about-hero-in{
    from{
        opacity:0;
        transform:translateY(24px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

/* Notre histoire */
.about-history{
    scroll-margin-top:110px;
    padding:120px 24px;
    background:var(--about-white);
}

.about-history__layout{
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
    gap:90px;
    align-items:start;
}

.about-history .about-section-heading{
    position:relative;
}

.about-history__content > p{
    margin:0 0 22px;
    color:var(--about-text-soft);
    font-size:18px;
    line-height:1.75;
}

.about-history__content .about-lead{
    color:var(--about-blue-dark);
    font-size:22px;
    line-height:1.6;
    font-weight:750;
}

.about-history__timeline{
    display:grid;
    gap:16px;
    margin-top:42px;
}

.about-history__timeline > div{
    display:grid;
    grid-template-columns:120px 1fr;
    gap:24px;
    align-items:start;
    padding:24px;
    border:1px solid var(--about-border);
    border-radius:20px;
    background:var(--about-grey);
}

.about-history__timeline span{
    color:var(--about-blue);
    font-size:20px;
    line-height:1.2;
    font-weight:900;
}

.about-history__timeline p{
    margin:0;
    color:var(--about-text-soft);
    font-size:15px;
    line-height:1.6;
}

/* Mission */
.about-mission{
    position:relative;
    padding:120px 24px;
    overflow:hidden;
    background:linear-gradient(135deg,var(--about-black),var(--about-blue-dark));
}

.about-mission__framework{
    display:grid;
    grid-template-columns:minmax(230px,1fr) minmax(300px,.9fr) minmax(230px,1fr);
    grid-template-areas:
        "verify core secure"
        "verify core human";
    gap:26px 44px;
    align-items:center;
    margin-top:62px;
}

.about-mission-pillar{
    position:relative;
    padding:10px 0 10px 24px;
    border-left:3px solid var(--mission-accent);
}

.about-mission-pillar--verify{grid-area:verify;--mission-accent:var(--about-orange);}
.about-mission-pillar--secure{grid-area:secure;--mission-accent:#3c9cff;}
.about-mission-pillar--human{grid-area:human;--mission-accent:#9160ff;}

.about-mission-pillar__icon{
    display:flex;
    align-items:center;
    justify-content:center;
    width:70px;
    height:70px;
    margin-bottom:22px;
    border:1px solid var(--mission-accent);
    border-radius:50%;
    background:rgba(255,255,255,.06);
    box-shadow:0 0 34px rgba(98,163,196,.12);
    color:var(--mission-accent);
}

.about-mission-pillar__icon svg{
    width:40px;
    height:40px;
}

.about-mission-pillar h3{
    margin:0 0 16px;
    color:var(--about-white);
    font-size:clamp(22px,2vw,28px);
    line-height:1.16;
    font-weight:900;
}

.about-mission-pillar h3 span{
    color:var(--mission-accent);
}

.about-mission-pillar p{
    margin:0;
    color:rgba(255,255,255,.74);
    font-size:15px;
    line-height:1.65;
}

.about-mission-core{
    grid-area:core;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:420px;
}

.about-mission-core__orbit{
    position:absolute;
    border:1px solid rgba(98,163,196,.3);
    border-radius:50%;
    animation:about-mission-orbit 18s linear infinite;
}

.about-mission-core__orbit::before{
    content:"";
    position:absolute;
    top:10%;
    left:8%;
    width:10px;
    height:10px;
    border-radius:50%;
    background:var(--about-orange);
    box-shadow:0 0 18px rgba(246,144,61,.8);
}

.about-mission-core__orbit--one{width:330px;height:330px;}
.about-mission-core__orbit--two{width:270px;height:270px;animation-direction:reverse;animation-duration:14s;}

.about-mission-core__circle{
    position:relative;
    z-index:2;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    width:230px;
    height:230px;
    padding:34px;
    border:7px solid rgba(255,255,255,.16);
    border-radius:50%;
    background:linear-gradient(145deg,#fff,#edf4f8);
    box-shadow:0 28px 70px rgba(0,0,0,.3),0 0 50px rgba(98,163,196,.16);
}

.about-mission-core__circle img{
    width:165px;
    height:auto;
    margin-bottom:14px;
}

.about-mission-core__circle span{
    color:var(--about-blue-dark);
    font-size:10px;
    line-height:1.45;
    font-weight:850;
    text-align:center;
    text-transform:uppercase;
    letter-spacing:.2em;
}

@keyframes about-mission-orbit{to{transform:rotate(360deg);}}

.about-mission-solutions{
    margin-top:70px;
    padding-top:28px;
    border-top:1px solid rgba(255,255,255,.24);
}

.about-mission-solutions > p{
    margin:0 0 24px;
    color:rgba(255,255,255,.68);
    font-size:12px;
    line-height:1.4;
    font-weight:850;
    text-align:center;
    text-transform:uppercase;
    letter-spacing:.2em;
}

.about-mission-solutions__grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    max-width:880px;
    margin:0 auto;
}

.about-mission-solution{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:13px;
    min-height:90px;
    padding:16px 30px;
    border-right:1px solid rgba(255,255,255,.22);
    color:var(--about-white);
    transition:background-color .25s ease,transform .25s ease;
}

.about-mission-solution:last-child{border-right:0;}

.about-mission-solution img{
    width:auto;
    max-width:175px;
    max-height:58px;
    object-fit:contain;
}

.about-mission-solution--portail img{width:52px;}

.about-mission-solution strong{
    color:var(--about-white);
    font-size:18px;
    font-weight:900;
    text-transform:uppercase;
}

.about-mission-solution > span{
    color:var(--about-orange);
    font-size:24px;
    transition:transform .25s ease;
}

.about-mission-solution:hover{
    transform:translateY(-4px);
    background:rgba(255,255,255,.06);
}

.about-mission-solution:hover > span{transform:translateX(4px);}

.about-mission-solution:focus-visible{
    outline:3px solid var(--about-orange);
    outline-offset:4px;
}

/* Engagements */
.about-commitments{
    padding:120px 24px;
    background:var(--about-grey);
}

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

.about-commitments__intro > p{
    margin:26px 0 0;
    color:var(--about-text-soft);
    font-size:18px;
    line-height:1.75;
}

.about-button--rse{
    gap:10px;
    margin-top:28px;
    border-color:var(--about-blue);
    background:var(--about-blue);
    color:var(--about-white);
    box-shadow:0 14px 30px rgba(22,72,107,.2);
}

.about-button--rse span{
    font-size:20px;
    transition:transform .25s ease;
}

.about-button--rse:hover span{
    transform:translateX(4px);
}

.about-button--rse:hover{
    border-color:var(--about-orange);
    background:var(--about-orange);
    color:var(--about-white);
}

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

.about-commitment-card{
    min-height:210px;
    padding:28px;
    border:1px solid var(--about-border);
    border-radius:24px;
    background:var(--about-white);
    box-shadow:0 16px 42px rgba(1,10,31,.05);
}

.about-commitment-card::before{
    content:"";
    display:block;
    width:42px;
    height:5px;
    margin-bottom:30px;
    border-radius:999px;
    background:linear-gradient(90deg,var(--about-orange),var(--about-blue-light));
}

.about-commitment-card h3{
    margin:0 0 12px;
    color:var(--about-black);
    font-size:20px;
    line-height:1.25;
    font-weight:900;
}

.about-commitment-card p{
    margin:0;
    color:var(--about-text-soft);
    font-size:15px;
    line-height:1.6;
}

.about-labels{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:18px;
    align-items:center;
    margin-top:64px;
    padding:34px;
    border:1px solid var(--about-border);
    border-radius:26px;
    background:var(--about-white);
}

.about-labels > div{
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:0;
    height:124px;
    padding:10px;
}

.about-labels img{
    width:auto;
    height:auto;
    max-width:150px;
    max-height:104px;
    object-fit:contain;
}

/* Notre vision */
.about-vision{
    padding:120px 24px;
    background:var(--about-white);
}

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

.about-vision__content h2{
    max-width:720px;
    margin:0 0 28px;
    color:var(--about-black);
    font-size:clamp(38px,4.3vw,60px);
    line-height:1.06;
    letter-spacing:-.045em;
    font-weight:900;
}

.about-vision__content p{
    max-width:720px;
    margin:0 0 20px;
    color:var(--about-text-soft);
    font-size:18px;
    line-height:1.75;
}

.about-vision__content p:last-child{margin-bottom:0;}

.about-vision__content strong{
    color:var(--about-blue-dark);
    font-weight:850;
}

.about-vision__quote{
    position:relative;
    margin:0;
    padding:48px;
    overflow:hidden;
    border-radius:32px;
    background:
        radial-gradient(circle at 100% 0,rgba(246,144,61,.2),transparent 38%),
        linear-gradient(145deg,var(--about-black),var(--about-blue-dark));
    box-shadow:0 28px 70px rgba(1,10,31,.18);
}

.about-vision__quote::before{
    content:"“";
    position:absolute;
    top:10px;
    right:30px;
    color:rgba(255,255,255,.08);
    font-family:Georgia,serif;
    font-size:150px;
    line-height:1;
}

.about-vision__quote blockquote{
    position:relative;
    z-index:1;
    margin:0;
    color:var(--about-white);
    font-size:clamp(27px,3vw,40px);
    line-height:1.25;
    letter-spacing:-.025em;
    font-weight:850;
}

.about-vision__quote figcaption{
    position:relative;
    z-index:1;
    display:flex;
    align-items:center;
    gap:16px;
    margin-top:36px;
}

.about-vision__quote img{
    width:68px;
    height:68px;
    border:2px solid rgba(255,255,255,.34);
    border-radius:50%;
    object-fit:cover;
}

.about-vision__quote figcaption span{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.about-vision__quote strong{
    color:var(--about-white);
    font-size:16px;
    font-weight:900;
}

.about-vision__quote small{
    color:rgba(255,255,255,.68);
    font-size:13px;
}

/* Vos besoins */
.about-needs{
    padding:0 24px 120px;
    background:var(--about-grey);
}

.about-needs__panel{
    display:grid;
    grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr);
    gap:64px;
    align-items:center;
    padding:72px clamp(28px,7vw,88px);
    border-radius:36px;
    background:
        radial-gradient(circle at 90% 10%,rgba(246,144,61,.18),transparent 32%),
        linear-gradient(135deg,var(--about-black),var(--about-blue-dark));
    box-shadow:0 32px 90px rgba(1,10,31,.2);
}

.about-needs__content h2{
    color:var(--about-white);
}

.about-needs__intro{
    margin:24px 0 32px;
}

.about-needs__intro p{
    margin:0 0 16px;
    color:rgba(255,255,255,.76);
    font-size:18px;
    line-height:1.7;
}

.about-needs__intro p:last-child{margin-bottom:0;}

.about-needs__links{
    display:flex;
    flex-wrap:wrap;
    gap:12px 26px;
    margin-top:26px;
}

.about-needs__links a{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:rgba(255,255,255,.78);
    font-size:14px;
    line-height:1.4;
    font-style:italic;
    font-weight:750;
    transition:color .2s ease;
}

.about-needs__links a span{
    color:var(--about-orange);
    font-size:18px;
    font-style:normal;
    transition:transform .2s ease;
}

.about-needs__links a:hover{color:var(--about-white);}
.about-needs__links a:hover span{transform:translateX(4px);}

.about-needs__list{
    display:grid;
    gap:12px;
    margin:0;
    padding:0;
    list-style:none;
}

.about-needs__list li{
    position:relative;
    padding:18px 20px 18px 52px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:16px;
    background:rgba(255,255,255,.08);
    color:var(--about-white);
    font-size:15px;
    line-height:1.45;
    font-weight:750;
}

.about-needs__list li::before{
    content:"✓";
    position:absolute;
    left:20px;
    top:18px;
    color:var(--about-orange);
    font-weight:900;
}

/* Survols colorés — effets CSS légers, sans impact sur le scroll */
@media(hover:hover) and (pointer:fine){
    .about-history__timeline > div,
    .about-commitment-card,
    .about-labels > div,
    .about-needs__list li{
        transition:
            transform .3s cubic-bezier(.22,1,.36,1),
            border-color .3s ease,
            background-color .3s ease,
            box-shadow .3s ease;
    }

    .about-history__timeline > div:hover{
        transform:translateX(6px);
        border-color:rgba(98,163,196,.45);
        background:linear-gradient(110deg,rgba(98,163,196,.13),rgba(246,144,61,.08));
        box-shadow:0 16px 36px rgba(22,72,107,.1);
    }

    .about-history__timeline > div:hover span{
        color:var(--about-orange);
    }

    .about-commitment-card:hover{
        transform:translateY(-6px);
        border-color:rgba(246,144,61,.38);
        background:linear-gradient(145deg,var(--about-white),rgba(246,144,61,.08));
        box-shadow:0 24px 52px rgba(22,72,107,.13);
    }

    .about-commitment-card:hover::before{
        width:72px;
    }

    .about-commitment-card::before,
    .about-history__timeline span,
    .about-labels img{
        transition:width .3s ease,color .3s ease,background-color .3s ease,transform .3s ease,filter .3s ease;
    }

    .about-labels > div:hover{
        transform:translateY(-4px);
        border-radius:16px;
        background:linear-gradient(145deg,rgba(98,163,196,.09),rgba(246,144,61,.08));
    }

    .about-labels > div:hover img{
        transform:scale(1.06);
        filter:saturate(1.08);
    }

    .about-needs__list li:hover{
        transform:translateX(6px);
        border-color:rgba(246,144,61,.48);
        background:linear-gradient(100deg,rgba(246,144,61,.16),rgba(98,163,196,.11));
        box-shadow:0 14px 30px rgba(1,10,31,.18);
    }

    /* Conserve les survols après l'animation d'apparition. */
    .resocom-about-js .about-reveal.is-visible .about-mission-solution.about-reveal-item:hover{
        transform:translateY(-4px);
    }

    .resocom-about-js .about-reveal.is-visible .about-commitment-card.about-reveal-item:hover{
        transform:translateY(-6px);
    }

    .resocom-about-js .about-reveal.is-visible .about-labels > div.about-reveal-item:hover{
        transform:translateY(-4px);
    }

    .resocom-about-js .about-reveal.is-visible .about-needs__list li.about-reveal-item:hover{
        transform:translateX(6px);
    }
}

/* Animations progressives */
.resocom-about-js .about-reveal{
    opacity:0;
    transform:translateY(28px);
    transition:opacity .7s ease,transform .7s cubic-bezier(.22,1,.36,1);
}

.resocom-about-js .about-reveal .about-reveal-item{
    opacity:0;
    transform:translateY(22px);
    transition:
        opacity .72s ease var(--reveal-delay,0ms),
        transform .82s cubic-bezier(.22,1,.36,1) var(--reveal-delay,0ms);
}

.resocom-about-js .about-reveal.is-visible .about-reveal-item{
    opacity:1;
    transform:none;
}

.resocom-about-js .about-reveal.is-visible{
    opacity:1;
    transform:none;
}

@media(max-width:1024px){
    .about-hero__layout,
    .about-history__layout,
    .about-commitments__layout,
    .about-vision__layout,
    .about-needs__panel{
        grid-template-columns:1fr;
    }

    .about-hero{
        min-height:auto;
    }

    .about-hero__proofs{
        max-width:760px;
    }

    .about-history .about-section-heading{
        position:static;
    }

    .about-mission__framework{
        grid-template-columns:repeat(2,minmax(0,1fr));
        grid-template-areas:
            "core core"
            "verify secure"
            "human human";
        gap:38px;
    }

    .about-mission-core{
        min-height:360px;
    }

    .about-mission-pillar--human{
        max-width:620px;
        margin:0 auto;
    }

    .about-vision__layout{
        gap:52px;
    }

    .about-labels{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media(max-width:700px){
    .about-hero,
    .about-history,
    .about-mission,
    .about-commitments,
    .about-vision{
        padding:78px 22px;
    }

    .about-hero__layout,
    .about-history__layout,
    .about-commitments__layout{
        gap:46px;
    }

    .about-hero__content h1{
        font-size:36px;
    }

    .about-hero__content > p,
    .about-history__content > p,
    .about-commitments__intro > p,
    .about-vision__content p,
    .about-needs__intro p{
        font-size:16px;
    }

    .about-hero__actions,
    .about-button{
        width:100%;
    }

    .about-hero__proofs,
    .about-commitments__grid{
        grid-template-columns:1fr;
    }

    .about-proof-card,
    .about-commitment-card{
        min-height:auto;
    }

    .about-section-heading h2,
    .about-commitments__intro h2,
    .about-vision__content h2,
    .about-needs__content h2{
        font-size:34px;
    }

    .about-history__content .about-lead{
        font-size:19px;
    }

    .about-history__timeline > div{
        grid-template-columns:1fr;
        gap:10px;
    }

    .about-commitment-card{
        padding:24px;
    }

    .about-mission__framework{
        grid-template-columns:1fr;
        grid-template-areas:
            "core"
            "verify"
            "secure"
            "human";
        gap:34px;
        margin-top:42px;
    }

    .about-mission-core{
        min-height:330px;
    }

    .about-mission-core__orbit--one{width:290px;height:290px;}
    .about-mission-core__orbit--two{width:235px;height:235px;}

    .about-mission-core__circle{
        width:205px;
        height:205px;
        padding:28px;
    }

    .about-mission-core__circle img{width:145px;}

    .about-mission-pillar,
    .about-mission-pillar--human{
        width:100%;
        max-width:none;
    }

    .about-mission-solutions{
        margin-top:54px;
    }

    .about-mission-solutions__grid{
        grid-template-columns:1fr;
    }

    .about-mission-solution{
        min-height:86px;
        border-right:0;
        border-bottom:1px solid rgba(255,255,255,.18);
    }

    .about-mission-solution:last-child{border-bottom:0;}

    .about-labels{
        grid-template-columns:repeat(2,minmax(0,1fr));
        padding:20px;
    }

    .about-labels > div{
        height:108px;
    }

    .about-labels img{
        max-width:130px;
        max-height:90px;
    }

    .about-needs{
        padding:0 15px 78px;
    }

    .about-needs__panel{
        gap:42px;
        padding:52px 22px;
        border-radius:28px;
    }

    .about-needs__links{
        flex-direction:column;
        align-items:flex-start;
    }
}

@media(max-width:480px){
    .about-hero,
    .about-history,
    .about-mission,
    .about-commitments,
    .about-vision{
        padding-right:18px;
        padding-left:18px;
    }

    .about-hero__content h1{
        font-size:32px;
        letter-spacing:-.04em;
    }

    .about-section-heading h2,
    .about-commitments__intro h2,
    .about-needs__content h2,
    .about-vision__content h2{
        font-size:29px;
    }

    .about-proof-card,
    .about-commitment-card{
        padding:22px;
    }

    .about-mission-core{
        min-height:290px;
    }

    .about-mission-core__orbit--one{width:250px;height:250px;}
    .about-mission-core__orbit--two{width:205px;height:205px;}

    .about-mission-core__circle{
        width:180px;
        height:180px;
        padding:24px;
    }

    .about-mission-core__circle img{
        width:125px;
        margin-bottom:10px;
    }

    .about-mission-core__circle span{
        font-size:8px;
    }

    .about-mission-pillar{
        padding-left:18px;
    }

    .about-mission-pillar__icon{
        width:62px;
        height:62px;
    }

    .about-mission-solutions > p{
        letter-spacing:.13em;
    }

    .about-labels{
        grid-template-columns:1fr;
        gap:10px;
    }

    .about-labels > div{
        grid-column:auto;
        height:124px;
    }

    .about-labels img{
        max-width:160px;
        max-height:104px;
    }

    .about-needs{
        padding-right:12px;
        padding-left:12px;
    }

    .about-needs__panel{
        padding:22px 18px;
    }

    .about-vision__quote{
        padding:34px 24px;
        border-radius:26px;
    }

    .about-vision__quote blockquote{
        font-size:27px;
    }
}

@media(prefers-reduced-motion:reduce){
    .resocom-about-js .about-reveal,
    .resocom-about-js .about-reveal .about-reveal-item{
        opacity:1;
        transform:none;
        transition:none;
    }

    .about-button{
        transition:none;
    }

    .about-proof-card::before{
        animation:none;
    }

    .about-proof-float{
        translate:none;
        animation:none;
    }

    .about-proof-card,
    .about-history__timeline > div,
    .about-mission-solution,
    .about-commitment-card,
    .about-labels > div,
    .about-labels img,
    .about-needs__list li{
        transition:none;
    }

    .about-mission-core__orbit{
        animation:none;
    }

    .resocom-about-js .resocom-about-page .about-hero__content,
    .resocom-about-js .resocom-about-page .about-proof-card{
        opacity:1;
        transform:none;
        transition:none;
        animation:none;
    }
}
