/* R231. All 8 categories / 12 original samples stay open. No media is cropped. */
#service-delivery.r231-sample-layout>.r224-section-heading{display:block;margin-bottom:25px}
#service-delivery.r231-sample-layout>.r224-section-heading h2{font-size:clamp(28px,3vw,38px);line-height:1.35;margin-top:10px}
#service-delivery.r231-sample-layout>.r224-section-heading>p{max-width:none;margin-top:15px;font-size:15px;line-height:1.8}
#service-delivery.r231-sample-layout .r225-delivery-grid{gap:24px;align-items:start}
#service-delivery.r231-sample-layout .r225-type-group{border-color:#ded7e5;border-radius:13px;background:#fff;box-shadow:0 5px 22px #3c284b04}
#service-delivery.r231-sample-layout .r225-type-heading{gap:13px;padding:21px 23px 20px;background:#fff;border-bottom:1px solid #ebe5ef}
#service-delivery.r231-sample-layout .r225-type-heading h3{font-size:25px;line-height:1.4;color:#392b47;margin:0 0 4px}
#service-delivery.r231-sample-layout .r225-type-heading .r224-label{font-size:12px;line-height:1.7;color:#96839f}
#service-delivery.r231-sample-layout .r225-type-number{padding-top:5px;color:#a88cbd}
#service-delivery.r231-sample-layout .r225-type-samples,#service-delivery.r231-sample-layout .r225-direct-sample,#service-delivery.r231-sample-layout .r224-specimen{background:#fff}
#service-delivery.r231-sample-layout .r224-specimen{padding:21px 22px 18px;border:0;border-radius:0}
#service-delivery.r231-sample-layout .r224-specimen-caption{padding-top:12px}
#service-delivery.r231-sample-layout .r224-specimen-caption strong{font-size:14px;line-height:1.7;color:#564361}
#service-delivery.r231-sample-layout .r224-specimen-caption p{font-size:12px;line-height:1.8;margin-top:5px;color:#93809f}
#service-delivery.r231-sample-layout .r224-video-frame{background:transparent;justify-content:flex-start}
#service-delivery.r231-sample-layout .r224-video-frame video{display:block;width:100%;max-width:100%;height:auto;max-height:none;aspect-ratio:var(--video-ratio);object-fit:contain;border-radius:8px;background:transparent}
#service-delivery.r231-sample-layout .r225-type-brief{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:22px;padding:20px 23px 24px;background:#fff;border-top:1px solid #ebe5ef}
#service-delivery.r231-sample-layout .r225-type-brief .r224-pain{font-size:17px;line-height:1.75;color:#584266}
#service-delivery.r231-sample-layout .r225-type-brief .r224-solution{font-size:14px;line-height:1.9;margin-top:9px;color:#8a7796}
#service-delivery.r231-sample-layout .r225-type-brief .r224-delivery{display:block;align-self:start;border-top:0;border-left:1px solid #ebe5ef;margin:0;padding:0 0 0 20px}
#service-delivery.r231-sample-layout .r225-type-brief .r224-delivery>p{font-size:11px;line-height:1.8;color:#a089ad;margin-bottom:9px}
#service-delivery.r231-sample-layout .r225-type-brief .r224-delivery ul{display:grid;gap:7px;margin:0}
#service-delivery.r231-sample-layout .r225-type-brief .r224-delivery li{font-size:13px;line-height:1.75;color:#7c628d}
/* Portrait story: the explanation occupies the former empty side panel. */
#service-delivery.r231-sample-layout [data-r225-service-kind=video-long]{display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);column-gap:22px}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-long]>.r225-type-heading{grid-column:1/-1}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-long]>.r225-type-samples{padding:22px 0 24px 23px}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-long] .r224-specimen{padding:0}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-long] .r224-video-frame{justify-content:center}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-long] .r224-video-frame video{width:min(100%,calc(395px * var(--video-ratio)))}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-long]>.r225-type-brief{display:block;border-top:0;padding:25px 23px 24px 0}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-long] .r224-delivery{border-left:0;border-top:1px solid #ebe5ef;padding:18px 0 0;margin-top:21px}
/* Mixed formats: landscape + explanation on the left, portrait on the right. */
#service-delivery.r231-sample-layout [data-r225-service-kind=video-short]{display:grid;grid-template-columns:minmax(0,1.13fr) minmax(0,.87fr);column-gap:19px;align-content:start}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-short]>.r225-type-heading{grid-column:1/-1}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-short]>.r225-type-samples{display:contents}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r225-direct-sample:first-child{grid-column:1;grid-row:2;padding:22px 0 0 23px}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r225-direct-sample:nth-child(2){grid-column:2;grid-row:2/4;padding:22px 23px 24px 0}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r224-specimen{padding:0}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-short]>.r225-type-brief{display:block;grid-column:1;grid-row:3;border-top:0;padding:17px 0 24px 23px}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r224-pain{font-size:16px;line-height:1.75}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r224-solution{font-size:13px;line-height:1.8}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r224-delivery{border-left:0;border-top:1px solid #ebe5ef;padding:14px 0 0;margin-top:16px}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r224-delivery ul{gap:5px}
#service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r224-video-frame video{width:100%}
/* Four original visual stories form one browsable row on wider screens. */
#service-delivery.r231-sample-layout [data-r225-service-kind=graphic]>.r225-type-samples{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;padding:22px 23px}
#service-delivery.r231-sample-layout [data-r225-service-kind=graphic] .r224-specimen{padding:0;border:0;border-radius:0;background:#fff}
#service-delivery.r231-sample-layout .r224-image-carousel{align-items:flex-start;gap:10px;padding:1px 1px 9px;scrollbar-color:#d4c5df transparent}
#service-delivery.r231-sample-layout .r224-image-slide{width:calc(235px * var(--image-ratio));max-width:100%;border-color:#e1d7e9;border-radius:5px}
#service-delivery.r231-sample-layout [data-r225-service-kind=graphic] .r224-carousel-tools{margin-bottom:10px}
#service-delivery.r231-sample-layout .r224-carousel-tools button{width:30px;height:29px;font-size:15px;background:#fff;border-color:#ddcfe8}
#service-delivery.r231-sample-layout .r224-carousel-tools>span{font-size:11px}
#service-delivery.r231-sample-layout [data-r225-service-kind=graphic]>.r225-type-brief{grid-template-columns:1.2fr 1fr;gap:32px}
/* Article specimens stay readable and paired with their original images. */
#service-delivery.r231-sample-layout .r224-document-preview{padding:22px;border:1px solid #e4dce9;border-radius:7px;background:#fbf9fc;box-shadow:none}
#service-delivery.r231-sample-layout .r224-document-preview strong{font-size:21px;line-height:1.6;margin:14px 0}
#service-delivery.r231-sample-layout .r224-document-preview p{font-size:14px;line-height:1.9}
#service-delivery.r231-sample-layout .r224-document-preview small{margin-top:16px;font-size:12px}
#service-delivery.r231-sample-layout [data-r225-service-kind=long-copy] .r224-image-slide{width:calc(230px * var(--image-ratio))}
/* Physical materials: a native-ratio rail beside a concise specification. */
#service-delivery.r231-sample-layout [data-r225-service-kind=materials]{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);column-gap:30px}
#service-delivery.r231-sample-layout [data-r225-service-kind=materials]>.r225-type-heading{grid-column:1/-1}
#service-delivery.r231-sample-layout [data-r225-service-kind=materials]>.r225-type-brief{display:block;border-top:0;padding:26px 26px 25px 0}
#service-delivery.r231-sample-layout [data-r225-service-kind=materials] .r224-delivery{border-left:0;border-top:1px solid #ebe5ef;padding:18px 0 0;margin-top:23px}
#service-delivery.r231-sample-layout [data-r225-service-kind=materials] .r224-image-slide{width:calc(265px * var(--image-ratio))}
/* Open readers retain full-width space and all native controls. */
#service-delivery.r231-sample-layout .r225-type-group:has(.r225-direct-sample[data-r224-open=true]){grid-column:1/-1}
#service-delivery.r231-sample-layout [data-r225-service-kind=materials]:has(.r225-direct-sample[data-r224-open=true]){display:block}
#service-delivery.r231-sample-layout [data-r225-service-kind=materials]:has(.r225-direct-sample[data-r224-open=true])>.r225-type-brief{padding:24px 26px;border-top:1px solid #ebe5ef}
#service-delivery.r231-sample-layout .r225-direct-sample[data-r224-open=true]{grid-column:1/-1}
#service-delivery.r231-sample-layout .r224-sample-reading{padding:26px;background:#fbf9fc;border-top:1px solid #dfd2e8}
@media(max-width:1180px){
 #service-delivery.r231-sample-layout .r225-delivery-grid{gap:20px}
 #service-delivery.r231-sample-layout .r225-type-heading{padding:20px}
 #service-delivery.r231-sample-layout .r225-type-brief{gap:17px;padding:20px}
 #service-delivery.r231-sample-layout .r225-type-brief .r224-delivery{padding-left:16px}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-long]{column-gap:18px;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-long]>.r225-type-samples{padding-left:20px}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-long]>.r225-type-brief{padding-right:20px}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-short]{column-gap:16px;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r225-direct-sample:first-child,#service-delivery.r231-sample-layout [data-r225-service-kind=video-short]>.r225-type-brief{padding-left:20px}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r225-direct-sample:nth-child(2){padding-right:20px}
 #service-delivery.r231-sample-layout [data-r225-service-kind=graphic]>.r225-type-samples{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;padding:22px}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-long] .r224-delivery,#service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r224-delivery,#service-delivery.r231-sample-layout [data-r225-service-kind=materials] .r224-delivery{padding-left:0}
}
@media(max-width:1000px) and (min-width:701px){
 #service-delivery.r231-sample-layout .r225-delivery-grid{grid-template-columns:1fr}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-long]{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);column-gap:28px}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-long]>.r225-type-brief{align-self:center;padding:25px 28px 25px 0}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-long] .r224-specimen{max-width:245px;margin:auto}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-short]{grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);column-gap:25px}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r224-video-frame{justify-content:center}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r225-direct-sample:nth-child(2) .r224-video-frame video{width:min(100%,calc(425px * var(--video-ratio)))}
 #service-delivery.r231-sample-layout .r225-type-brief .r224-pain{font-size:18px}
}
@media(max-width:700px){
 #service-delivery.r231-sample-layout>.r224-section-heading{margin-bottom:23px}
 #service-delivery.r231-sample-layout>.r224-section-heading>p{font-size:14px;line-height:1.85;margin-top:13px}
 #service-delivery.r231-sample-layout .r225-delivery-grid{grid-template-columns:1fr;gap:23px}
 #service-delivery.r231-sample-layout .r225-type-heading{padding:20px 19px}
 #service-delivery.r231-sample-layout .r225-type-heading h3{font-size:24px}
 #service-delivery.r231-sample-layout .r224-specimen{padding:19px}
 #service-delivery.r231-sample-layout .r225-type-brief{display:block;padding:20px 19px 23px}
 #service-delivery.r231-sample-layout .r225-type-brief .r224-pain{font-size:17px}
 #service-delivery.r231-sample-layout .r225-type-brief .r224-delivery{border-left:0;border-top:1px solid #ebe5ef;padding:15px 0 0;margin-top:17px}
 #service-delivery.r231-sample-layout .r225-type-brief .r224-delivery ul{display:flex;flex-wrap:wrap;gap:6px 16px}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-long],#service-delivery.r231-sample-layout [data-r225-service-kind=video-short],#service-delivery.r231-sample-layout [data-r225-service-kind=materials]{display:block}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-long]>.r225-type-samples{padding:20px 19px 17px}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-long] .r224-specimen{max-width:250px;margin:auto}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-long] .r224-video-frame video{width:min(100%,calc(385px * var(--video-ratio)))}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-long]>.r225-type-brief{padding:20px 19px 23px;border-top:1px solid #ebe5ef}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-short]>.r225-type-samples{display:grid;grid-template-columns:minmax(0,1fr);gap:22px;padding:19px}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r225-direct-sample:first-child,#service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r225-direct-sample:nth-child(2){grid-column:auto;grid-row:auto;padding:0}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r225-direct-sample:nth-child(2) .r224-specimen{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:16px;align-items:center}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r225-direct-sample:nth-child(2) .r224-specimen-caption{padding:0}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-short]>.r225-type-brief{padding:20px 19px 23px;border-top:1px solid #ebe5ef}
 #service-delivery.r231-sample-layout [data-r225-service-kind=graphic]>.r225-type-samples{grid-template-columns:1fr;gap:24px;padding:20px 19px}
 #service-delivery.r231-sample-layout [data-r225-service-kind=graphic] .r225-direct-sample+.r225-direct-sample{border-top:1px solid #ebe5ef;padding-top:21px}
 #service-delivery.r231-sample-layout [data-r225-service-kind=graphic]>.r225-type-brief{display:block}
 #service-delivery.r231-sample-layout .r224-image-slide,#service-delivery.r231-sample-layout [data-r225-service-kind=long-copy] .r224-image-slide,#service-delivery.r231-sample-layout [data-r225-service-kind=materials] .r224-image-slide{width:calc(var(--sample-image-height,245px) * var(--image-ratio))}
 #service-delivery.r231-sample-layout [data-r225-service-kind=materials]>.r225-type-brief{padding:20px 19px 23px;border-top:1px solid #ebe5ef}
 #service-delivery.r231-sample-layout .r224-document-preview{padding:21px 19px}
 #service-delivery.r231-sample-layout .r224-document-preview strong{font-size:21px}
 #service-delivery.r231-sample-layout .r224-sample-reading{padding:21px 18px}
}
@media(max-width:350px){
 #service-delivery.r231-sample-layout .r225-type-heading{padding:18px 16px}
 #service-delivery.r231-sample-layout .r224-specimen{padding:16px}
 #service-delivery.r231-sample-layout .r225-type-brief,#service-delivery.r231-sample-layout [data-r225-service-kind=video-long]>.r225-type-brief,#service-delivery.r231-sample-layout [data-r225-service-kind=video-short]>.r225-type-brief,#service-delivery.r231-sample-layout [data-r225-service-kind=materials]>.r225-type-brief{padding:18px 16px 21px}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-short]>.r225-type-samples,#service-delivery.r231-sample-layout [data-r225-service-kind=graphic]>.r225-type-samples{padding:17px 16px}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r225-direct-sample:nth-child(2) .r224-specimen{grid-template-columns:1.15fr .85fr;gap:12px}
 #service-delivery.r231-sample-layout [data-r225-service-kind=video-short] .r225-direct-sample:nth-child(2) .r224-specimen-caption strong{font-size:13px}
}
