@charset "UTF-8";

/* Shared CustomerVoice component; existing LP styles remain scoped as before. */
.lpCustomerVoice {
    width: min(100%, 584px);
    margin: 56px auto 0;
    color: #80654b;
}
.lpCustomerVoice .lpCustomerVoiceTitle {
    margin: 0 0 24px;
    padding: 0;
    border: 0;
    font-family: Garamond, "EB Garamond", "Times New Roman", serif;
    font-size: 26px;
    font-weight: 400;
    font-style: normal;
    line-height: 1.4;
    letter-spacing: .04em;
    text-align: center;
}
.lpCustomerVoiceFrame { border: 1px solid #ddcfbf; background: #fff; }
.lpCustomerVoiceFrame + .lpCustomerVoiceFrame { margin-top: 24px; }
.lpCustomerVoiceFrame iframe { display: block; width: 100%; height: 670px; border: 0; }

/* Give the socks banner its own space between product and story/brand sections. */
.lpCustomerVoicePage .productBannerArea { margin-top: 80px; margin-bottom: 80px; scroll-margin-top: 260px; }

@media (max-width: 587px) {
    .lpCustomerVoice { margin-top: 34px; }
    .lpCustomerVoice .lpCustomerVoiceTitle { margin-bottom: 20px; font-size: 22px; }
    .lpCustomerVoiceFrame iframe { height: 520px; }
    .lpCustomerVoicePage .productBannerArea { margin-top: 60px; margin-bottom: 60px; scroll-margin-top: 220px; }
}