/* ═══════════════════════════════════════════════════
   Case Studies Archive — 1:1 还原 verytechnology.com
   断点: 1200 / 1024 / 576
   ═══════════════════════════════════════════════════ */

/* ── Hero Row ── */
.cs-hero-row {
    position: relative;
    overflow: visible;
}
.cs-hero-row > .fl-row-content-wrap,
.cs-hero-row > .fl-row-content-wrap > .fl-row-content {
    background: transparent !important;
}

.cs-hero-bg-layer {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    z-index: 0;
    pointer-events: none;
}
.cs-hero-bg-color {
    position: absolute;
    top: 0; left: 0;
    width: 66%;
    height: 100%;
    background-color: #FFF3DF;
    border-bottom: 50px solid #fff;
}

.cs-hero-main {
    position: relative;
    z-index: 1;
    max-width: 1220px;
    margin: 0 auto;
}
.cs-hero-cols {
    display: flex;
    align-items: center;
    margin-top: 129px;
}

.cs-hero-left {
    flex: 0 0 61%;
    padding: 0 132px 0 40px;
}

.cs-hero-eyebrow-wrap { margin-bottom: 24px; }
.cs-hero-eyebrow {
    display: inline-block;
    padding: 8px 20px;
    border: 1px solid #272f31;
    font-family: "PolySans-SlimMono", monospace, sans-serif;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: #272f31;
    line-height: 1;
    text-decoration: none;
    cursor: default;
}

.cs-hero-title {
    font-family: "PolySans-Median", sans-serif;
    font-size: 54px;
    line-height: 1.15;
    font-weight: 400;
    color: #272f31;
    margin: 0 0 20px;
}

.cs-hero-desc p {
    font-family: "PolySans-Slim", sans-serif;
    font-size: 18px;
    line-height: 1.67;
    letter-spacing: .72px;
    color: #272f31;
    margin: 0;
}

.cs-hero-right {
    flex: 0 0 38%;
    padding-right: 40px;
}

.cs-hero-separator {
    display: block;
    width: 54px; height: 54px;
    border: none;
    background-color: #272f31;
    margin: 0 0 20px;
}

.cs-hero-photo { display: block; }
.cs-hero-photo img {
    display: block;
    width: 100%; height: auto;
    border-top-right-radius: 40px;
    border-bottom-left-radius: 40px;
    object-fit: cover;
}

/* ── Case Study Grid Section ── */
.cs-list-row > .fl-row-content-wrap {
    margin: 20px 50px 100px;
    padding: 0;
}
.cs-list-row .fl-row-content {
    max-width: 1140px;
}

.cs-section-title {
    font-family: "PolySans-Median", sans-serif;
    font-size: 32px;
    font-weight: 400;
    color: #272f31;
    margin: 40px 0;
    line-height: 1.4;
}

.cs-list-row .fl-post-grid {
    margin: 0 -30px;
    overflow: hidden;
}
.cs-list-row .fl-post-grid::after {
    content: "";
    display: table;
    clear: both;
}
.cs-list-row .fl-post-column {
    float: left;
    width: 33.3333%;
    padding: 0 30px 60px;
    box-sizing: border-box;
}
.cs-list-row .fl-post-column:nth-child(3n+1) {
    clear: both;
}

.cs-list-row .fl-post-grid-post {
    background: #fff;
    border: 1px solid #e6e6e6;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.cs-list-row .fl-post-grid-text {
    padding: 20px;
    padding-bottom: 7px;
}
.cs-list-row .fl-post-grid-title {
    font-family: "PolySans-Median", sans-serif;
    font-size: 20px;
    line-height: 26px;
    font-weight: 400;
    color: #272f31;
    margin: 0;
}
.cs-list-row .fl-post-grid-title a {
    color: inherit;
    text-decoration: none;
}
.cs-list-row .fl-post-grid-title a:hover {
    color: #ff6d45;
}

.cs-list-row .fl-post-grid-excerpt {
    font-family: "PolySans-Slim", sans-serif;
    font-size: 14px;
    line-height: 22px;
    color: #676d6e;
    margin: 10px 0 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.cs-list-row .fl-post-grid-image {
    margin-top: auto;
    overflow: hidden;
}
.cs-list-row .fl-post-grid-image a {
    display: block;
}
.cs-list-row .fl-post-grid-image img {
    display: block;
    width: 100%;
    height: 200px !important;
    object-fit: cover;
}

/* ── CTA Section ── */
.cs-cta-row > .fl-row-content-wrap {
    background-color: #F4F4F4;
    padding: 0;
}
.cs-cta-row .fl-row-content {
    max-width: 1140px;
}
.cs-cta-cols {
    display: flex;
    align-items: center;
}

.cs-cta-left { flex: 0 0 58%; }
.cs-cta-title {
    font-family: "PolySans-Median", sans-serif;
    font-size: 54px;
    line-height: 1.3;
    font-weight: 400;
    color: #272f31;
    margin: 40px 0 0 40px;
}
.cs-cta-desc { margin: 10px 0 0 40px; }
.cs-cta-desc p {
    font-family: "PolySans-Slim", sans-serif;
    font-size: 18px;
    line-height: 1.67;
    letter-spacing: .72px;
    color: #272f31;
    margin: 0;
}
.cs-cta-btn-wrap { margin: 15px 0 80px 43px; }
.cs-cta-btn {
    display: inline-block;
    background-color: #272F31;
    border: 1px solid #1b2325;
    color: #fff;
    font-family: "PolySans-Median", sans-serif;
    font-size: 16px;
    font-weight: 400;
    padding: 14px 40px;
    text-decoration: none;
    transition: all .2s;
}
.cs-cta-btn:hover {
    background-color: #ff6d45;
    border-color: #ff6d45;
    color: #fff;
}

.cs-cta-right {
    flex: 0 0 41%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px;
}
.cs-cta-right img {
    max-width: 100%;
    height: auto;
}

/* page-level overflow prevention */
.fl-builder-content[data-type="case_study"] { overflow-x: hidden; }

/* ── Responsive ── */
/* 断点精确匹配对标站: 1199 / 991 / 768 / 575 */

/* ≤ 1199px */
@media (max-width: 1199px) {
    .cs-hero-left { padding: 0 80px 0 40px; }
    .cs-hero-title { font-size: 44px; }
    .cs-cta-title { font-size: 44px; }
}

/* ≤ 991px (tablet — 2 columns) */
@media (max-width: 991px) {
    .cs-hero-row { background-color: #FFF3DF !important; }
    .cs-hero-bg-layer { display: none !important; }
    .cs-hero-cols {
        flex-direction: column;
        margin-top: 0;
        padding: 120px 0 40px;
    }
    .cs-hero-left {
        flex: none;
        width: 100%;
        padding: 0 20px;
    }
    .cs-hero-right { display: none !important; }
    .cs-hero-title { font-size: 36px; margin-bottom: 16px; }

    .cs-list-row > .fl-row-content-wrap { margin: 20px 30px 60px; }
    .cs-list-row .fl-post-column {
        width: 50%;
    }
    .cs-list-row .fl-post-column:nth-child(3n+1) { clear: none; }
    .cs-list-row .fl-post-column:nth-child(2n+1) { clear: both; }

    .cs-cta-title { font-size: 36px; }
    .cs-cta-cols { flex-direction: column; }
    .cs-cta-left { flex: none; width: 100%; }
    .cs-cta-right { padding: 20px; }
}

/* ≤ 768px (mobile — single column) */
@media (max-width: 768px) {
    .cs-hero-cols { padding-top: 100px; }
    .cs-hero-left { padding: 0 20px; }
    .cs-hero-title { font-size: 32px; }
    .cs-hero-desc p { font-size: 15px; line-height: 1.5; }

    .cs-list-row > .fl-row-content-wrap { margin: 20px 20px 40px; }
    .cs-list-row .fl-post-grid { margin: 0 -10px; }
    .cs-list-row .fl-post-column {
        float: none;
        width: 100% !important;
        padding: 0 10px 24px;
    }
    .cs-list-row .fl-post-column:nth-child(3n+1),
    .cs-list-row .fl-post-column:nth-child(2n+1) { clear: none; }
    .cs-list-row .fl-post-grid-image img { height: 260px !important; }
    .cs-section-title { margin: 20px 0; font-size: 24px; }

    .cs-cta-title { font-size: 28px; margin: 24px 0 0 20px; }
    .cs-cta-desc { margin: 8px 0 0 20px; }
    .cs-cta-btn-wrap { margin: 15px 0 30px 20px; }
    .cs-cta-right { display: none; }
}

/* ≤ 575px (小屏手机) */
@media (max-width: 575px) {
    .cs-hero-cols { padding-top: 90px; }
    .cs-hero-left { padding: 0 16px; }
    .cs-hero-title { font-size: 28px; }
    .cs-hero-eyebrow { padding: 6px 14px; font-size: 11px; }

    .cs-list-row > .fl-row-content-wrap { margin: 20px 16px 40px; }
    .cs-list-row .fl-post-grid { margin: 0; }
    .cs-list-row .fl-post-column { padding: 0 0 24px; }
    .cs-list-row .fl-post-grid-image img { height: 220px !important; }

    .cs-cta-title { font-size: 24px; margin: 20px 0 0 16px; }
    .cs-cta-desc { margin: 8px 0 0 16px; }
    .cs-cta-btn-wrap { margin: 12px 0 24px 16px; }
    .cs-cta-bar, .blog-cta-bar { padding: 24px 16px; }
}
