/* LOCKED case-study grid — lifted verbatim from page-builds/20261004_1812-case-studies/04-page-build/wireframe.html.
   Only change: section root padding-block clamp(72px,7vw,120px) -> var(--section-padding-y) (canonical 120px rule). */
.case-study-showcase-05-one-two-three-four-library {
  box-sizing: border-box;
  width: 100%;
  --cs-card-title: #d4af37;
  --cs-card-fg: #ffffff;
  --cs-card-body: #c4cdc8;
  --cs-card-rule: rgba(255,255,255,.2);
  --cs-card-link: #f3cd29;
  padding-block: var(--section-padding-y);
  background: #ffffff;
  color: #0d5630;
  font-family: var(--body);
  scroll-margin-top: 138px;
}
.case-study-showcase-05-one-two-three-four-library,
.case-study-showcase-05-one-two-three-four-library * { box-sizing: border-box; }
.case-study-showcase-05-one-two-three-four-showcase__in { width: min(1200px, calc(100% - 80px)); margin: 0 auto; }
.case-study-showcase-05-one-two-three-four-rows { display: flex; flex-direction: column; gap: 48px; }
.case-study-showcase-05-one-two-three-four-row { display: grid; align-items: stretch; }
.case-study-showcase-05-one-two-three-four-row--4 { --card-pad: 20px; --card-well: 220px; --card-kicker: 10px; --card-title: 18px; --card-kicker-gap: 8px; --card-title-gap: 12px; --card-rule-gap: 20px; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.case-study-showcase-05-one-two-three-four-row--3 { --card-pad: 24px; --card-well: 300px; --card-kicker: 12px; --card-title: 22px; --card-kicker-gap: 10px; --card-title-gap: 16px; --card-rule-gap: 24px; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.case-study-showcase-05-one-two-three-four-row--2 { --card-pad: 32px; --card-well: 370px; --card-kicker: 13px; --card-title: 34px; --card-kicker-gap: 12px; --card-title-gap: 20px; --card-rule-gap: 24px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px; }
.case-study-showcase-05-one-two-three-four-row--1 { grid-template-columns: minmax(0, 1fr); gap: 32px; }
.case-study-showcase-05-one-two-three-four-card { min-width: 0; background: var(--cs-card-bg); color: var(--cs-card-fg); transition: transform .16s ease; }
.case-study-showcase-05-one-two-three-four-card:hover { transform: translateY(-2px); }
.case-study-showcase-05-one-two-three-four-card:focus-visible { outline: 3px solid var(--cs-card-link); outline-offset: 4px; }
.case-study-showcase-05-one-two-three-four-card--stack { display: flex; flex-direction: column; padding: var(--card-pad); }
.case-study-showcase-05-one-two-three-four-theme--forest { --cs-card-bg: #0d5630; --cs-card-foot-bg: #e7efe8; }
.case-study-showcase-05-one-two-three-four-theme--sage { --cs-card-bg: #2b3410; --cs-card-foot-bg: #e7efe8; }
.case-study-showcase-05-one-two-three-four-theme--walnut { --cs-card-bg: #57473a; --cs-card-foot-bg: #e6dfd4; }
.case-study-showcase-05-one-two-three-four-theme--petrol { --cs-card-bg: #14403f; --cs-card-foot-bg: #e7efe8; }
.case-study-showcase-05-one-two-three-four-theme--burgundy { --cs-card-bg: #6e1e2e; --cs-card-foot-bg: #e6dfd4; }
.case-study-showcase-05-one-two-three-four-theme--plum { --cs-card-bg: #3b2440; --cs-card-foot-bg: #ffffff; }
.case-study-showcase-05-one-two-three-four-theme--slate { --cs-card-bg: #2b4a64; --cs-card-foot-bg: #ffffff; }
.case-study-showcase-05-one-two-three-four-card__kicker { display: block; font-size: var(--card-kicker); font-weight: 700; line-height: 1.5; letter-spacing: .1em; text-transform: uppercase; color: var(--cs-card-body); }
.case-study-showcase-05-one-two-three-four-card__art { display: flex; height: var(--card-well); margin-top: var(--card-kicker-gap); align-items: center; justify-content: center; }
.case-study-showcase-05-one-two-three-four-card__art img { width: auto; max-width: 100%; max-height: 100%; object-fit: contain; }
.case-study-showcase-05-one-two-three-four-card__art-mark { display: grid; width: min(100%, 260px); aspect-ratio: 1.35; place-items: center; border: 1px solid var(--cs-card-rule); color: var(--cs-card-title); background: linear-gradient(135deg, transparent 0 48%, var(--cs-card-rule) 48% 52%, transparent 52% 100%), rgba(255,255,255,.04); }
.case-study-showcase-05-one-two-three-four-card__title { display: block; margin-top: var(--card-title-gap); color: var(--cs-card-title); font-family: var(--display); font-size: var(--card-title); font-weight: 400; line-height: 1.2; letter-spacing: 0; text-wrap: balance; }
.case-study-showcase-05-one-two-three-four-card__lede { display: block; margin-top: 16px; color: var(--cs-card-body); font-size: 17px; font-weight: 300; line-height: 1.6; }
.case-study-showcase-05-one-two-three-four-card__read { display: block; margin-top: auto; padding-top: var(--card-rule-gap); }
.case-study-showcase-05-one-two-three-four-card__read-label { display: block; padding-top: 16px; border-top: 1px solid var(--cs-card-rule); color: var(--cs-card-link); font-size: 13px; font-weight: 700; line-height: 1.5; letter-spacing: .08em; text-transform: uppercase; }
.case-study-showcase-05-one-two-three-four-card--row { display: grid; grid-template-columns: minmax(0, 1fr) 320px; }
.case-study-showcase-05-one-two-three-four-card__row-copy { display: block; min-width: 0; padding: 40px; }
.case-study-showcase-05-one-two-three-four-card--row .case-study-showcase-05-one-two-three-four-card__kicker { --card-kicker: 13px; }
.case-study-showcase-05-one-two-three-four-card--row .case-study-showcase-05-one-two-three-four-card__title { --card-title: 34px; --card-title-gap: 28px; }
.case-study-showcase-05-one-two-three-four-card--row .case-study-showcase-05-one-two-three-four-card__lede { clear: right; margin-top: 28px; }
.case-study-showcase-05-one-two-three-four-card--row .case-study-showcase-05-one-two-three-four-card__read { clear: both; padding-top: 40px; }
.case-study-showcase-05-one-two-three-four-card__float-art { float: right; width: 280px; max-height: 320px; margin: 0 0 32px 32px; object-fit: contain; }
.case-study-showcase-05-one-two-three-four-card__float-art.case-study-showcase-05-one-two-three-four-card__art-mark { height: 210px; max-height: 320px; }
.case-study-showcase-05-one-two-three-four-card__kpis { display: flex; flex-direction: column; border-left: 1px solid var(--cs-card-rule); }
.case-study-showcase-05-one-two-three-four-card__kpi { display: flex; flex: 1; flex-direction: column; justify-content: center; gap: 8px; padding: 32px; }
.case-study-showcase-05-one-two-three-four-card__kpi + .case-study-showcase-05-one-two-three-four-card__kpi { border-top: 1px solid var(--cs-card-rule); }
.case-study-showcase-05-one-two-three-four-card__kpi-value { color: var(--cs-card-title); font-family: var(--display); font-size: 58px; font-weight: 400; line-height: 1.15; }
.case-study-showcase-05-one-two-three-four-card__kpi-label { color: var(--cs-card-body); font-size: 14px; line-height: 1.4; }
.empty { display: none; width: min(1200px, calc(100% - 80px)); margin: 0 auto; padding: 70px 24px; border-top: 4px solid var(--cream); color: var(--grey-mid); text-align: center; font-size: 18px; line-height: 1.4; }
@media (max-width: 1279px) { .case-study-showcase-05-one-two-three-four-row--4 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1109px) {
  .case-study-showcase-05-one-two-three-four-card--row { grid-template-columns: minmax(0, 1fr); }
  .case-study-showcase-05-one-two-three-four-card__kpis { border-top: 1px solid var(--cs-card-rule); border-left: 0; }
}
@media (max-width: 1001px) { .case-study-showcase-05-one-two-three-four-row--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 985px) { .case-study-showcase-05-one-two-three-four-row--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 789px) { .case-study-showcase-05-one-two-three-four-card__float-art { float: none; margin: 0 0 32px; } }
@media (max-width: 715px) { .case-study-showcase-05-one-two-three-four-row--2 { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 699px) { .case-study-showcase-05-one-two-three-four-row--3 { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 691px) { .case-study-showcase-05-one-two-three-four-row--4 { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 600px) { .case-study-showcase-05-one-two-three-four-showcase__in, .empty { width: min(1200px, calc(100% - 44px)); } }
@media (max-width: 507px) {
  .case-study-showcase-05-one-two-three-four-rows { gap: 24px; }
  .case-study-showcase-05-one-two-three-four-row--4,
  .case-study-showcase-05-one-two-three-four-row--3,
  .case-study-showcase-05-one-two-three-four-row--2 { --card-pad: 20px; --card-well: 220px; --card-kicker: 11px; --card-title: 22px; --card-kicker-gap: 10px; --card-title-gap: 14px; --card-rule-gap: 24px; gap: 24px; }
  .case-study-showcase-05-one-two-three-four-card__art { height: auto; max-height: var(--card-well); }
  .case-study-showcase-05-one-two-three-four-card__row-copy,
  .case-study-showcase-05-one-two-three-four-card__kpi { padding: 20px; }
  .case-study-showcase-05-one-two-three-four-card--row .case-study-showcase-05-one-two-three-four-card__title { --card-title: 22px; --card-title-gap: 16px; }
  .case-study-showcase-05-one-two-three-four-card--row .case-study-showcase-05-one-two-three-four-card__lede { margin-top: 16px; font-size: 16px; }
  .case-study-showcase-05-one-two-three-four-card--row .case-study-showcase-05-one-two-three-four-card__read { padding-top: 24px; }
  .case-study-showcase-05-one-two-three-four-card__kpi-value { font-size: 48px; }
}