:root {
    --am-navy:#203556;
    --am-blue:#31547d;
    --am-teal:#24bdb7;
    --am-bg:#edf2f7;
    --am-text:#17243b;
}

@media(max-width:700px) {
    }

.am-ecosystem {
    width:min(1180px,calc(100% - 24px));
    margin:32px auto;
    padding:24px;
    border-radius:22px;
    background:var(--am-navy);
    color:#fff;
}

.am-ecosystem-head > span {
    color:var(--am-teal);
    font-size:.7rem;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.am-ecosystem-head h2 {
    max-width:720px;
    margin:7px 0;
    color:#fff;
    font-size:clamp(1.6rem,5vw,2.5rem);
}

.am-ecosystem-head p {
    max-width:720px;
    color:rgba(255,255,255,.7);
}

.am-ecosystem-grid {
    display:grid;
    gap:10px;
    margin-top:22px;
}

.am-ecosystem-grid a {
    display:block;
    padding:16px;
    border:1px solid rgba(255,255,255,.1);
    border-radius:14px;
    background:rgba(255,255,255,.055);
    color:#fff;
    text-decoration:none;
}

.am-ecosystem-grid strong,
.am-ecosystem-grid span {
    display:block;
}

.am-ecosystem-grid strong {
    color:var(--am-teal);
}

.am-ecosystem-grid span {
    margin-top:5px;
    color:rgba(255,255,255,.67);
    font-size:.75rem;
    line-height:1.45;
}

@media(min-width:700px) {
    .am-ecosystem-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }
}

@media(min-width:1000px) {
    .am-ecosystem-grid {
        grid-template-columns:
            repeat(4,minmax(0,1fr));
    }
}