.cs-page,.cs-page * {box-sizing: border-box} .cs-page {background: #ffffff;color: #000000;font-family: Helvetica,Arial,sans-serif} .cs-section {padding: 48px 0;background: #ffffff} .cs-section-tight {padding-top: 36px;padding-bottom: 42px} .cs-section-muted {background: #f6f7f4} .cs-image-break-section {padding-top: 26px;padding-bottom: 34px} .cs-container {width: 1170px;max-width: 1170px;margin: 0 auto} .grid-row .cs-container {width: 100%;max-width: 100%} .cs-frame {background: #ffffff;border-radius: 10px;box-shadow: 12px 14px 0 #e8edf7} .cs-frame-strong {border: 4px solid #000000} .cs-frame-medium {border: 3px solid #000000} .cs-frame-soft {border: 2px solid #000000;border-radius: 10px;box-shadow: 10px 12px 0 #e8edf7;overflow: hidden} .cs-kicker {display: block;margin-bottom: 18px;color: #0f89c8;font-size: 13px;line-height: 1.2;font-weight: 700;letter-spacing: 1px;text-transform: uppercase} .cs-section-heading {max-width: 920px;margin: 0 auto 34px;text-align: center} .cs-section-heading h2 {margin: 0;color: #000000;font-size: 34px;line-height: 1.22;font-weight: 900;letter-spacing: 1px} .cs-section-heading p {max-width: 760px;margin: 18px auto 0;color: #333333;font-size: 17px;line-height: 1.55} .cs-page h1,.cs-page h2,.cs-page h3,.cs-page p,.cs-page a,.cs-page li,.cs-page td,.cs-page th,.cs-page dd,.cs-page dt,.cs-page small,.cs-page span {-webkit-font-smoothing: antialiased} .cs-hero-section {padding-top: 58px} .cs-hero {display: grid;grid-template-columns: 1.04fr 0.96fr;gap: 54px;align-items: center;padding: 54px;background: linear-gradient(90deg,#ffffff 0%,#ffffff 62%,#f8f3df 62%,#f8f3df 100%)} .cs-hero__content h1 {max-width: 710px;margin: 0 0 22px;color: #000000;font-size: 30px;line-height: 1.16;font-weight: 900;letter-spacing: 1px;text-transform: uppercase} .cs-lead {max-width: 660px;margin: 0 0 22px;color: #000000;font-size: 18px;line-height: 1.62} .cs-tags {display: flex;flex-wrap: wrap;gap: 10px;margin: 22px 0 28px} .cs-tags span {display: inline-flex;align-items: center;min-height: 34px;padding: 7px 16px;border: 2px solid #000000;border-radius: 999px;background: #fff9e5;color: #000000;font-size: 13px;line-height: 1.2;font-weight: 900} .cs-check-list {margin: 0 0 30px;padding: 0;list-style: none} .cs-check-list li {position: relative;margin: 0 0 14px;padding-left: 30px;color: #000000;font-size: 16px;line-height: 1.45} .cs-check-list li::before {content: "✓";position: absolute;left: 0;top: -1px;color: #16a085;font-size: 23px;line-height: 1;font-weight: 900} .cs-check-list strong {font-weight: 900} .cs-actions {display: flex;align-items: center;flex-wrap: wrap;gap: 20px} .cs-actions-center {justify-content: center} .cs-btn {display: inline-block;min-width: 250px;padding: 14px 26px;border-radius: 999px;text-align: center;text-decoration: none;font-size: 15px;line-height: 1.2;font-weight: 700} .cs-btn-primary {background: #ffd318;color: #000000} .cs-btn-primary:hover {background: #f5c900;color: #000000} .cs-link {color: #005da8;font-size: 15px;line-height: 1.4;font-weight: 900;text-decoration: underline} .cs-link:hover {color: #000000} .cs-hero__media {position: relative;min-height: 520px} .cs-photo-card {position: relative;margin: 0;height: 520px;border: 4px solid #000000;border-radius: 12px;overflow: hidden;background: #f2f2f2;box-shadow: 12px 14px 0 rgba(0,0,0,0.08)} .cs-photo-card img {display: block;width: 100%;height: 100%;object-fit: cover} .cs-photo-card::after {content: "";position: absolute;inset: 0;background: linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,0.42) 100%);pointer-events: none} .cs-photo-card figcaption {position: absolute;z-index: 2;left: 24px;right: 24px;bottom: 22px;color: #ffffff;font-size: 15px;line-height: 1.45;font-weight: 700} .cs-floating-kpi {position: absolute;z-index: 3;width: 168px;padding: 18px 18px 16px;border: 3px solid #000000;border-radius: 10px;background: #ffffff;box-shadow: 8px 9px 0 rgba(232,237,247,0.95);text-align: center} .cs-floating-kpi strong {display: block;color: #000000;font-size: 36px;line-height: 1;font-weight: 900} .cs-floating-kpi span {display: block;margin-top: 7px;color: #000000;font-size: 13px;line-height: 1.25;font-weight: 700} .cs-floating-kpi--left {left: -30px;top: 42px} .cs-floating-kpi--right {right: -28px;bottom: 54px;background: #fff6d9} .cs-summary-grid {display: grid;grid-template-columns: repeat(3,1fr);gap: 34px} .cs-summary-card {min-height: 350px;padding: 34px 32px 30px;border: 3px solid #000000;border-radius: 10px;background: #ffffff;box-shadow: 10px 12px 0 #e8edf7;text-align: center} .cs-square-icon {display: flex;align-items: center;justify-content: center;width: 80px;height: 80px;margin: 0 auto 24px;border: 3px solid #000000;border-radius: 12px;background: #ffa21a;color: #000000;font-size: 38px;line-height: 1;font-weight: 900} .cs-summary-card h3 {margin: 0 0 16px;color: #000000;font-size: 22px;line-height: 1.25;font-weight: 900} .cs-summary-card p {margin: 0 0 18px;color: #000000;font-size: 16px;line-height: 1.5} .cs-mini-metric {display: inline-block;margin-top: 6px;padding: 7px 12px;border-radius: 999px;background: #fff6d9;color: #000000;font-size: 13px;line-height: 1.2;font-weight: 900} .cs-wide-image {margin: 0;position: relative;height: 430px;background: #eeeeee} .cs-wide-image img {display: block;width: 100%;height: 100%;object-fit: cover} .cs-wide-image::after {content: "";position: absolute;inset: 0;background: linear-gradient(90deg,rgba(0,0,0,0.42) 0%,rgba(0,0,0,0.08) 58%,rgba(0,0,0,0) 100%)} .cs-wide-image figcaption {position: absolute;z-index: 2;left: 42px;bottom: 36px;max-width: 560px;padding: 18px 22px;border-left: 6px solid #ffa21a;background: rgba(255,255,255,0.93);color: #000000;font-size: 18px;line-height: 1.5;font-weight: 700} .cs-background {display: grid;grid-template-columns: 1fr 340px;gap: 34px;align-items: stretch;padding: 42px;background: #ffffff} .cs-background__text {padding: 38px;border-radius: 10px;background: #f6f6f4} .cs-background__text h2 {max-width: 760px;margin: 0 0 22px;color: #000000;font-size: 28px;line-height: 1.2;font-weight: 900;letter-spacing: 1px;text-transform: uppercase} .cs-background__text p {margin: 0 0 22px;color: #000000;font-size: 17px;line-height: 1.62} .cs-background__text p:last-child {margin-bottom: 0} .cs-snapshot-card {padding: 34px 30px;border: 3px solid #000000;border-radius: 10px;background: #fff6d9} .cs-snapshot-card h3 {margin: 0 0 24px;color: #000000;font-size: 24px;line-height: 1.25;font-weight: 900;text-align: center} .cs-snapshot-card dl,.cs-snapshot-card div,.cs-snapshot-card dt,.cs-snapshot-card dd {margin: 0;padding: 0} .cs-snapshot-card div {padding: 14px 0;border-bottom: 1px solid rgba(0,0,0,0.18)} .cs-snapshot-card div:first-of-type {padding-top: 0} .cs-snapshot-card div:last-child {border-bottom: 0;padding-bottom: 0} .cs-snapshot-card dt {margin-bottom: 5px;color: #000000;font-size: 12px;line-height: 1.2;font-weight: 900;text-transform: uppercase;letter-spacing: 1px} .cs-snapshot-card dd {color: #000000;font-size: 15px;line-height: 1.35} .cs-challenge-grid {display: grid;grid-template-columns: repeat(4,1fr);gap: 24px} .cs-challenge-card {min-height: 290px;padding: 30px 26px;border: 3px solid #000000;border-radius: 10px;background: #ffffff;box-shadow: 9px 11px 0 #e8edf7} .cs-number {display: block;margin-bottom: 22px;color: #ffa21a;-webkit-text-stroke: 1px #000000;text-shadow: 1px 1px 0 #000000;font-size: 38px;line-height: 1;font-weight: 900;letter-spacing: 2px} .cs-challenge-card h3 {margin: 0 0 16px;color: #000000;font-size: 20px;line-height: 1.18;font-weight: 900} .cs-challenge-card p {margin: 0;color: #000000;font-size: 15px;line-height: 1.5} .cs-toolkit-block {padding: 48px} .cs-toolkit-grid {display: grid;grid-template-columns: repeat(4,1fr);gap: 24px} .cs-toolkit-card {min-height: 330px;padding: 28px 24px;border: 3px solid #000000;border-radius: 10px;background: #ffffff;box-shadow: 8px 10px 0 #e8edf7;text-align: center} .cs-circle-icon {display: flex;align-items: center;justify-content: center;width: 92px;height: 92px;margin: 0 auto 24px;border: 3px solid #000000;border-radius: 50%;background: #ffd85a;color: #000000;font-size: 34px;line-height: 1;font-weight: 900} .cs-toolkit-card h3 {margin: 0 0 16px;color: #000000;font-size: 20px;line-height: 1.22;font-weight: 900} .cs-toolkit-card p {margin: 0;color: #000000;font-size: 15px;line-height: 1.5} .cs-mini-gallery {display: grid;grid-template-columns: repeat(3,1fr);gap: 22px;margin-top: 38px} .cs-mini-gallery figure {position: relative;height: 220px;margin: 0;border: 2px solid #000000;border-radius: 10px;overflow: hidden;background: #eeeeee} .cs-mini-gallery img {display: block;width: 100%;height: 100%;object-fit: cover} .cs-mini-gallery figcaption {position: absolute;left: 14px;bottom: 14px;padding: 8px 12px;border-radius: 999px;background: rgba(255,255,255,0.94);color: #000000;font-size: 13px;line-height: 1.2;font-weight: 900} .cs-roadmap-section {background: #ffffff} .cs-roadmap-line {width: 0%;height: 0px;margin: 10 auto -24px;background: #000000} .cs-roadmap-grid {position: relative;display: grid;grid-template-columns: repeat(3,1fr);gap: 30px;margin-top: 40px} .cs-roadmap-card {position: relative;min-height: 210px;padding: 32px 28px 28px;border: 3px solid #000000;border-radius: 10px;background: #f6f6f4;box-shadow: 9px 11px 0 #e8edf7} .cs-roadmap-badge {position: absolute;top: -28px;right: 26px;display: flex;align-items: center;justify-content: center;width: 64px;height: 64px;border: 3px solid #000000;border-radius: 50%;background: #ffa21a;color: #000000;font-size: 22px;line-height: 1;font-weight: 900} .cs-roadmap-card small {display: block;margin-bottom: 14px;color: #0f89c8;font-size: 13px;line-height: 1.2;font-weight: 900;text-transform: uppercase;letter-spacing: 1px} .cs-roadmap-card h3 {margin: 0 0 16px;color: #000000;font-size: 20px;line-height: 1.2;font-weight: 900} .cs-roadmap-card p {margin: 0;color: #000000;font-size: 15px;line-height: 1.5} .cs-results-frame {padding: 48px} .cs-kpi-grid {display: grid;grid-template-columns: repeat(4,1fr);gap: 24px;margin-bottom: 34px} .cs-kpi-card {min-height: 220px;padding: 30px 24px;border: 3px solid #000000;border-radius: 10px;background: #ffffff;text-align: center} .cs-kpi-card-featured {background: #fff6d9} .cs-kpi-card strong {display: block;margin-bottom: 12px;color: #000000;font-size: 42px;line-height: 1;font-weight: 900} .cs-kpi-card h3 {margin: 0 0 12px;color: #000000;font-size: 15px;line-height: 1.25;font-weight: 900} .cs-kpi-card p {margin: 0;color: #000000;font-size: 14px;line-height: 1.45} .cs-chart-card {padding: 26px 30px 32px;border: 3px solid #000000;border-radius: 10px;background: #f6f6f4} .cs-chart-legend {display: flex;justify-content: flex-end;gap: 22px;margin-bottom: 24px} .cs-chart-legend span {display: inline-flex;align-items: center;gap: 8px;color: #000000;font-size: 13px;line-height: 1.2;font-weight: 900} .cs-chart-legend i {display: inline-block;width: 18px;height: 14px;border: 2px solid #000000;border-radius: 4px} .cs-legend-before {background: #d9d9d9} .cs-legend-after {background: #ffa21a} .cs-bar-chart {display: grid;grid-template-columns: repeat(4,1fr);gap: 26px;min-height: 300px;padding: 20px 24px 0;border-left: 3px solid #000000;border-bottom: 3px solid #000000} .cs-chart-group {display: flex;flex-direction: column;align-items: center;justify-content: flex-end;min-height: 260px;text-align: center} .cs-bars {display: flex;align-items: flex-end;justify-content: center;gap: 12px;width: 100%;height: 200px;margin-bottom: 20px} .cs-bar {display: block;width: 34px;min-height: 18px;border: 3px solid #000000;border-bottom: 0;border-radius: 7px 7px 0 0} .cs-bar-before {background: #d9d9d9} .cs-bar-after {background: #ffa21a} .cs-chart-group strong {display: block;margin-bottom: 5px;color: #000000;font-size: 13px;line-height: 1.2;font-weight: 900} .cs-chart-group small {display: block;color: #444444;font-size: 12px;line-height: 1.2} .cs-table-wrap {background: #ffffff} .cs-comparison-table {width: 100%;border-collapse: collapse;color: #000000} .cs-comparison-table th {padding: 22px 20px;border: 2px solid #000000;background: #ffa21a;color: #000000;font-size: 14px;line-height: 1.25;font-weight: 900;text-align: left;text-transform: uppercase;letter-spacing: 1px} .cs-comparison-table td {padding: 22px 20px;border: 2px solid #000000;color: #000000;font-size: 15px;line-height: 1.45;vertical-align: top} .cs-comparison-table tbody tr:nth-child(odd) td:first-child {background: #fff6d9} .cs-comparison-table tbody tr:nth-child(even) td:first-child {background: #fbf0cf} .cs-comparison-table strong {font-weight: 900} .cs-quote-section {background: #f6f7f4} .cs-quote {position: relative;max-width: 940px;margin: 0 auto;padding: 34px 48px 38px 118px;border-left: 8px solid #ffa21a;background: #ffffff;box-shadow: 10px 12px 0 #e8edf7} .cs-quote-mark {position: absolute;left: 36px;top: 14px;color: #ffa21a;font-size: 90px;line-height: 1;font-weight: 900} .cs-quote p {margin: 0 0 20px;color: #000000;font-size: 26px;line-height: 1.38;font-weight: 900} .cs-quote footer {color: #000000;font-size: 15px;line-height: 1.4;font-style: normal} .cs-cta {display: grid;grid-template-columns: 1fr 360px;gap: 34px;align-items: center;padding: 38px 42px;background: #fff6d9} .cs-cta__content {text-align: center} .cs-cta h2 {margin: 0 0 18px;color: #000000;font-size: 30px;line-height: 1.22;font-weight: 900;letter-spacing: 1px;text-transform: uppercase} .cs-cta p {max-width: 720px;margin: 0 auto 26px;color: #000000;font-size: 17px;line-height: 1.55} .cs-cta__image {height: 250px;border: 3px solid #000000;border-radius: 10px;overflow: hidden;background: #eeeeee} .cs-cta__image img {display: block;width: 100%;height: 100%;object-fit: cover} .cs-related-section {padding-bottom: 70px} .cs-related-grid {display: grid;grid-template-columns: repeat(3,1fr);gap: 28px} .cs-related-card {display: block;min-height: 245px;padding: 30px 28px;border: 3px solid #000000;border-radius: 10px;background: #ffffff;box-shadow: 9px 11px 0 #e8edf7;color: #000000;text-decoration: none} .cs-related-card:hover {background: #fff6d9;color: #000000} .cs-related-card span {display: block;margin-bottom: 16px;color: #0f89c8;font-size: 12px;line-height: 1.2;font-weight: 900;letter-spacing: 1px;text-transform: uppercase} .cs-related-card h3 {margin: 0 0 14px;color: #000000;font-size: 19px;line-height: 1.28;font-weight: 900} .cs-related-card p {margin: 0;color: #000000;font-size: 14px;line-height: 1.5} @media screen and (max-width:1190px) {.cs-container {width: 940px;max-width: 940px} .cs-hero {gap: 38px;padding: 42px} .cs-hero__content h1 {font-size: 26px} .cs-photo-card,.cs-hero__media {min-height: 470px;height: 470px} .cs-section-heading h2,.cs-background__text h2,.cs-cta h2 {font-size: 28px} .cs-summary-grid,.cs-roadmap-grid,.cs-related-grid {gap: 24px} .cs-challenge-grid,.cs-toolkit-grid,.cs-kpi-grid {grid-template-columns: repeat(2,1fr)}} @media screen and (max-width:980px) {.cs-container {width: 738px;max-width: 738px} .cs-hero,.cs-background,.cs-cta {grid-template-columns: 1fr} .cs-hero {background: #ffffff} .cs-hero__media {min-height: 440px;height: auto} .cs-photo-card {height: 440px} .cs-floating-kpi--left {left: 18px;top: 18px} .cs-floating-kpi--right {right: 18px;bottom: 18px} .cs-summary-grid,.cs-roadmap-grid,.cs-related-grid {grid-template-columns: 1fr} .cs-summary-card {min-height: auto} .cs-roadmap-line {display: none} .cs-mini-gallery {grid-template-columns: 1fr} .cs-mini-gallery figure {height: 260px} .cs-cta__image {height: 330px}} @media screen and (max-width:767px) {.cs-section {padding: 34px 0} .cs-container {width: auto;max-width: none;margin: 0 18px} .cs-frame,.cs-summary-card,.cs-challenge-card,.cs-toolkit-card,.cs-roadmap-card,.cs-kpi-card,.cs-related-card {box-shadow: 6px 8px 0 #e8edf7} .cs-frame-strong {border-width: 3px} .cs-hero,.cs-toolkit-block,.cs-results-frame,.cs-background,.cs-cta {padding: 26px} .cs-hero__content h1 {font-size: 22px;letter-spacing: 1.5px} .cs-lead,.cs-background__text p,.cs-cta p,.cs-section-heading p {font-size: 16px;line-height: 1.55} .cs-section-heading h2,.cs-background__text h2,.cs-cta h2 {font-size: 26px;letter-spacing: 1px} .cs-photo-card,.cs-hero__media,.cs-wide-image {height: 340px;min-height: 340px} .cs-floating-kpi {width: 138px;padding: 14px 12px} .cs-floating-kpi strong {font-size: 28px} .cs-wide-image figcaption {left: 18px;right: 18px;bottom: 18px;font-size: 15px} .cs-background__text {padding: 24px} .cs-challenge-grid,.cs-toolkit-grid,.cs-kpi-grid {grid-template-columns: 1fr} .cs-chart-legend {justify-content: flex-start;flex-wrap: wrap} .cs-bar-chart {grid-template-columns: 1fr 1fr;min-height: auto} .cs-table-wrap {overflow-x: auto} .cs-comparison-table {min-width: 760px} .cs-quote {padding: 32px 26px 34px} .cs-quote-mark {position: static;display: block;margin-bottom: -12px;font-size: 70px} .cs-quote p {font-size: 22px} .cs-actions,.cs-actions-center {align-items: stretch;justify-content: center} .cs-btn {width: 100%;min-width: 0}} @media screen and (max-width:479px) {.cs-hero,.cs-toolkit-block,.cs-results-frame,.cs-background,.cs-cta {padding: 20px} .cs-hero__content h1 {font-size: 20px} .cs-section-heading h2,.cs-background__text h2,.cs-cta h2 {font-size: 23px} .cs-tags span {width: 100%;justify-content: center} .cs-photo-card,.cs-hero__media,.cs-wide-image,.cs-cta__image {height: 280px;min-height: 280px} .cs-floating-kpi {position: static;width: 100%;margin-top: 14px} .cs-bar-chart {grid-template-columns: 1fr}} .page-case-study .page-title .page-title-heading {float: left;margin: 0;padding: 0;color: #fff;font-size: 24px;line-height: 28px;font-weight: 400;text-transform: uppercase} @media screen and (max-width: 980px) {.page-case-study .page-title .page-title-heading {float: none;padding-bottom: 10px}} .ss-page,.ss-page * {box-sizing: border-box} .ss-page {background: #ffffff;color: #000000;font-family: Lato,Helvetica,Arial,sans-serif;overflow: hidden} .ss-page .grid-row {padding-top: 0} .ss-section {padding: 58px 0;background: #ffffff} .ss-section-tight {padding: 42px 0} .ss-section-muted {background: #f6f7f4} .ss-frame {border: 4px solid #000000;border-radius: 10px;background: #ffffff;box-shadow: 12px 14px 0 #e8edf7;overflow: hidden} .ss-frame-soft {border: 3px solid #000000;border-radius: 10px;background: #ffffff;box-shadow: 9px 11px 0 #e8edf7} .ss-kicker {display: block;margin-bottom: 18px;color: #0f89c8;font-size: 13px;line-height: 1.2;font-weight: 900;letter-spacing: 2px;text-transform: uppercase} .ss-heading {max-width: 920px;margin: 0 auto 38px;text-align: center} .ss-heading h2 {margin: 0;color: #000000;font-size: 34px;line-height: 1.22;font-weight: 900;letter-spacing: 1px} .ss-heading p {max-width: 780px;margin: 18px auto 0;color: #333333;font-size: 17px;line-height: 1.6} .ss-hero {display: grid;grid-template-columns: 1.04fr 0.96fr;gap: 48px;align-items: center;padding: 54px;background: linear-gradient(90deg,#ffffff 0%,#ffffff 62%,#f8f3df 62%,#f8f3df 100%)} .ss-hero-content h1 {max-width: 760px;margin: 0 0 22px;color: #000000;font-size: 42px;line-height: 1.15;font-weight: 900;letter-spacing: 3px;text-transform: uppercase} .ss-lead {max-width: 700px;margin: 0 0 24px;color: #000000;font-size: 18px;line-height: 1.62} .ss-tags {display: flex;flex-wrap: wrap;gap: 10px;margin: 24px 0 30px} .ss-tags span {display: inline-flex;align-items: center;min-height: 34px;padding: 7px 16px;border: 2px solid #000000;border-radius: 999px;background: #fff9e5;color: #000000;font-size: 13px;line-height: 1.2;font-weight: 900} .ss-actions {display: flex;flex-wrap: wrap;gap: 18px} .ss-btn {display: inline-block;min-width: 230px;padding: 14px 24px;border: 3px solid #000000;border-radius: 999px;background: #ffd318;color: #000000 !important;text-align: center;text-decoration: none;font-size: 15px;line-height: 1.2;font-weight: 900} .ss-btn:hover {background: #f5c900;color: #000000 !important} .ss-btn-secondary {background: #ffffff} .ss-btn-secondary:hover {background: #fff6d9} .ss-hero-media {min-width: 0} .ss-photo-card {position: relative;margin: 0;border: 4px solid #000000;border-radius: 12px;overflow: hidden;background: #f2f2f2;box-shadow: 12px 14px 0 rgba(0,0,0,0.08)} .ss-photo-card img {display: block;width: 100%;height: 420px;object-fit: cover;object-position: top center} .ss-photo-card figcaption {padding: 16px 20px;background: #ffffff;color: #000000;font-size: 14px;line-height: 1.45;font-weight: 700} .ss-hero-stats {display: grid;grid-template-columns: repeat(2,1fr);gap: 14px;margin-top: 18px} .ss-stat-box {padding: 18px 14px;border: 3px solid #000000;border-radius: 10px;background: #ffffff;text-align: center} .ss-stat-box strong {display: block;margin-bottom: 6px;font-size: 34px;line-height: 1;font-weight: 900} .ss-stat-box span {display: block;font-size: 13px;line-height: 1.25;font-weight: 800} .ss-summary-grid {display: grid;grid-template-columns: repeat(3,1fr);gap: 30px} .ss-summary-card {min-height: 310px;padding: 34px 30px;border: 3px solid #000000;border-radius: 10px;background: #ffffff;box-shadow: 10px 12px 0 #e8edf7;text-align: center} .ss-icon {display: flex;align-items: center;justify-content: center;width: 78px;height: 78px;margin: 0 auto 24px;border: 3px solid #000000;border-radius: 14px;background: #ffa21a;color: #000000} .ss-icon svg {display: block;width: 36px;height: 36px} .ss-summary-card h3,.ss-case-card h3,.ss-step-card h3,.ss-faq-item h3,.ss-resource-card h3 {margin: 0 0 14px;color: #000000;font-weight: 900} .ss-summary-card h3 {font-size: 22px;line-height: 1.25} .ss-summary-card p {margin: 0;color: #000000;font-size: 16px;line-height: 1.55} .ss-wide-image {position: relative;margin: 0;height: 430px;border: 4px solid #000000;border-radius: 10px;overflow: hidden;background: #eeeeee;box-shadow: 12px 14px 0 #e8edf7} .ss-wide-image img {display: block;width: 100%;height: 100%;object-fit: cover;object-position: top center} .ss-wide-image:after {content: "";position: absolute;inset: 0;background: linear-gradient(90deg,rgba(0,0,0,0.48) 0%,rgba(0,0,0,0.12) 58%,rgba(0,0,0,0) 100%)} .ss-wide-image figcaption {position: absolute;z-index: 2;left: 42px;bottom: 36px;max-width: 600px;padding: 18px 22px;border-left: 6px solid #ffa21a;background: rgba(255,255,255,0.94);color: #000000;font-size: 18px;line-height: 1.5;font-weight: 800} .ss-case-grid {display: grid;grid-template-columns: repeat(3,1fr);gap: 26px} .ss-case-card {display: flex;flex-direction: column;min-height: 560px;border: 3px solid #000000;border-radius: 10px;overflow: hidden;background: #ffffff;box-shadow: 10px 12px 0 #e8edf7} .ss-case-image {position: relative;height: 210px;overflow: hidden;background: #eeeeee} .ss-case-image img {display: block;width: 100%;height: 100%;object-fit: cover;object-position: top center} .ss-case-label {position: absolute;left: 14px;bottom: 14px;display: inline-block;padding: 7px 12px;border-radius: 999px;background: rgba(255,255,255,0.95);color: #000000;font-size: 12px;line-height: 1.2;font-weight: 900} .ss-case-body {display: flex;flex-direction: column;flex: 1;padding: 24px} .ss-case-card h3 {font-size: 22px;line-height: 1.22} .ss-case-card p {margin: 0 0 16px;color: #000000;font-size: 15px;line-height: 1.55} .ss-standards {display: flex;flex-wrap: wrap;gap: 6px;margin: 0 0 16px} .ss-standards span {display: inline-block;padding: 5px 9px;border: 1px solid #000000;border-radius: 999px;background: #fff6d9;color: #000000;font-size: 11px;line-height: 1.2;font-weight: 900} .ss-outcome {margin: auto 0 18px;padding: 10px 12px;border-left: 5px solid #ffa21a;background: #f6f7f4;color: #000000;font-size: 13px;line-height: 1.4;font-weight: 900} .ss-card-link {display: block;padding: 12px 16px;border: 2px solid #000000;border-radius: 999px;background: #0f89c8;color: #ffffff !important;text-align: center;text-transform: uppercase;font-size: 13px;line-height: 1.2;font-weight: 900;text-decoration: none} .ss-card-link:hover {background: #006699;color: #ffffff !important} .ss-kpi-grid {display: grid;grid-template-columns: repeat(4,1fr);gap: 24px} .ss-kpi-card {min-height: 230px;padding: 30px 22px;border: 3px solid #000000;border-radius: 10px;background: #ffffff;text-align: center} .ss-kpi-card-featured {background: #fff6d9} .ss-kpi-card strong {display: block;margin-bottom: 12px;color: #000000;font-size: 42px;line-height: 1;font-weight: 900} .ss-kpi-card h3 {margin: 0 0 12px;color: #000000;font-size: 16px;line-height: 1.25;font-weight: 900} .ss-kpi-card p {margin: 0;color: #000000;font-size: 14px;line-height: 1.45} .ss-split {display: grid;grid-template-columns: 0.92fr 1.08fr;gap: 34px;align-items: stretch} .ss-split-media {min-width: 0} .ss-split-media img {display: block;width: 100%;height: 100%;min-height: 460px;border: 3px solid #000000;border-radius: 10px;object-fit: cover;object-position: top center;box-shadow: 10px 12px 0 #e8edf7} .ss-step-list {display: grid;gap: 18px} .ss-step-card {position: relative;padding: 26px 28px 26px 92px;border: 3px solid #000000;border-radius: 10px;background: #ffffff;box-shadow: 8px 10px 0 #e8edf7} .ss-step-number {position: absolute;top: 24px;left: 24px;display: flex;align-items: center;justify-content: center;width: 48px;height: 48px;border: 3px solid #000000;border-radius: 50%;background: #ffa21a;color: #000000;font-size: 20px;line-height: 1;font-weight: 900} .ss-step-card h3 {font-size: 21px;line-height: 1.25} .ss-step-card p {margin: 0;font-size: 15px;line-height: 1.55} .ss-bundle-box {display: grid;grid-template-columns: 1fr 360px;gap: 34px;align-items: center;padding: 44px;background: #fff6d9} .ss-bundle-content h2 {margin: 0 0 18px;color: #000000;font-size: 34px;line-height: 1.2;font-weight: 900;text-transform: uppercase;letter-spacing: 1px} .ss-bundle-content p {margin: 0 0 24px;color: #000000;font-size: 17px;line-height: 1.62} .ss-bundle-media img {display: block;width: 100%;height: 270px;border: 3px solid #000000;border-radius: 10px;object-fit: cover;object-position: top center} .ss-faq {max-width: 980px;margin: 0 auto} .ss-faq-item {padding: 24px 28px;margin-bottom: 16px} .ss-faq-item h3 {font-size: 20px;line-height: 1.3} .ss-faq-item p {margin: 0;font-size: 15px;line-height: 1.65} .ss-resource-grid {display: grid;grid-template-columns: repeat(3,1fr);gap: 26px} .ss-resource-card {min-height: 230px;padding: 30px 28px;border: 3px solid #000000;border-radius: 10px;background: #ffffff;box-shadow: 9px 11px 0 #e8edf7} .ss-resource-card h3 {font-size: 22px;line-height: 1.25} .ss-resource-card p {margin: 0 0 18px;font-size: 15px;line-height: 1.55} .ss-resource-card a {color: #005da8;font-weight: 900;text-decoration: underline} @media screen and (max-width: 1190px) {.ss-hero h1 {font-size: 38px} .ss-case-grid {grid-template-columns: repeat(2,1fr)} .ss-kpi-grid,.ss-feature-grid {grid-template-columns: repeat(2,1fr)}} @media screen and (max-width: 980px) {.ss-hero,.ss-split,.ss-bundle-box {grid-template-columns: 1fr} .ss-summary-grid,.ss-kpi-grid,.ss-resource-grid {grid-template-columns: 1fr} .ss-hero {background: linear-gradient(180deg,#ffffff 0%,#ffffff 58%,#f8f3df 58%,#f8f3df 100%)} .ss-split-media img {height: 360px;min-height: 360px}} @media screen and (max-width: 767px) {.ss-section {padding: 38px 0} .ss-section-tight {padding: 30px 0} .ss-frame,.ss-frame-soft,.ss-photo-card,.ss-wide-image,.ss-summary-card,.ss-case-card,.ss-kpi-card,.ss-step-card,.ss-faq-item,.ss-resource-card {border-width: 2px;box-shadow: none} .ss-hero {padding: 28px 20px;gap: 26px} .ss-hero-content h1 {font-size: 30px;line-height: 1.18;letter-spacing: 1.5px} .ss-lead,.ss-heading p,.ss-bundle-content p {font-size: 15px;line-height: 1.6} .ss-heading {margin-bottom: 28px} .ss-heading h2,.ss-bundle-content h2 {font-size: 27px;line-height: 1.25} .ss-kicker {font-size: 11px;letter-spacing: 1.5px} .ss-tags span {font-size: 12px;padding: 7px 12px} .ss-actions {flex-direction: column} .ss-btn {width: 100%;min-width: 0} .ss-photo-card img,.ss-wide-image {height: 260px} .ss-photo-card figcaption,.ss-wide-image figcaption {font-size: 13px;line-height: 1.45} .ss-wide-image figcaption {left: 18px;right: 18px;bottom: 18px;padding: 14px 16px} .ss-hero-stats,.ss-case-grid {grid-template-columns: 1fr} .ss-summary-card,.ss-feature-card,.ss-kpi-card {min-height: auto} .ss-case-card {min-height: auto} .ss-case-image {height: 190px} .ss-case-body {padding: 20px} .ss-step-card {padding: 24px 20px} .ss-step-number {position: static;margin-bottom: 16px} .ss-split-media img {height: 260px;min-height: 260px;box-shadow: none} .ss-bundle-box {padding: 26px 20px} .ss-bundle-media img {height: 220px}}