/* Relatable challenge-to-capability sections for the product pages. */
html,body {
    max-width:100%;
    overflow-x:clip;
}
body .story-band {
    padding:76px 0;
    background:#f7f8f7;
    border-top:1px solid #e0e6e7;
}
body .story-band-alt {
    background:#edf2f5;
}
body .story-row {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:72px;
    align-items:center;
}
body .story-challenge>span,body .story-answer>span {
    font-size:10px;
    line-height:1.4;
    letter-spacing:1.35px;
    font-weight:700;
    color:#4e6877;
}
body .story-challenge h2 {
    font:600 clamp(30px,3vw,40px)/1.16 var(--display);
    letter-spacing:-1.6px;
    color:#132a3d;
    margin:18px 0 13px;
}
body .story-challenge p,body .story-answer p {
    font-size:15px;
    line-height:1.8;
    color:#52616a;
    margin:0;
}
body .story-answer {
    border-left:2px solid #2a81a7;
    padding:9px 0 9px 39px;
}
body .story-answer>span {
    color:#267491;
}
body .story-answer h3 {
    font:700 22px/1.25 var(--display);
    letter-spacing:-.7px;
    color:#132a3d;
    margin:15px 0 10px;
}
body .story-answer ul {
    list-style:none;
    padding:0;
    margin:16px 0 0;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px 16px;
}
body .story-answer li {
    font-size:12px;
    line-height:1.55;
    color:#344e5b;
    padding-left:16px;
    position:relative;
}
body .story-answer li:before {
    content:"";
    position:absolute;
    left:0;
    top:7px;
    width:6px;
    height:6px;
    border-radius:50%;
    background:#2784a5;
}
body .site-footer {
    background:#f0f2f1;
    color:#536168;
}
body .footer-brand img {
    filter:none;
    opacity:1;
}
body .footer-brand p {
    color:#66757a;
}
body .footer-col b {
    color:#172e3e;
}
body .footer-col a {
    color:#53636a;
}
body .footer-col a:hover {
    color:#176c91;
}
body .footer-contact>span {
    color:#61767d;
}
body .footer-contact>a {
    color:#142f40;
}
body .footer-contact b {
    color:#197995;
}
body .footer-bottom {
    border-color:#cfd8d8;
    color:#69777b;
}
body .footer-bottom a {
    color:#415b64;
}
@media(max-width:680px) {
    body .story-band {
        padding:54px 0;
    }
    body .story-row {
        grid-template-columns:1fr;
        gap:24px;
    }
    body .story-challenge h2 {
        font-size:30px;
    }
    body .story-challenge p,body .story-answer p {
        font-size:14px;
    }
    body .story-answer {
        border-left:0;
        border-top:2px solid #2a81a7;
        padding:22px 0 0;
    }
    body .story-answer h3 {
        font-size:20px;
    }
    body .story-answer ul {
        grid-template-columns:1fr;
        gap:7px;
    }
    body .site-footer .footer-main {
        padding-top:44px;
    }
}
