/* Shared editorial treatments for Services and Use cases. */
.offerings-page{
background:#edf2f0}
.offerings-page img{
display:block;
width:100%;
height:100%;
object-fit:cover}
.offerings-page figure{
margin:0}
.offerings-page figcaption{
margin-top:8px;
font:10px/1.3 Mono,monospace;
letter-spacing:.08em;
text-transform:uppercase;
color:var(--cyan-deep)}

.offer-hero,.use-hero{
display:grid;
grid-template-columns:minmax(0,1.08fr) minmax(290px,.92fr);
gap:52px;
align-items:center;
padding:50px 0 42px}
.offer-hero h1,.use-hero h1{
font:700 clamp(48px,6vw,80px)/.91 Barlow,Impact,sans-serif;
letter-spacing:-.035em;
margin:10px 0 18px;
max-width:720px}
.offer-hero>div>p:not(.kicker),.use-hero>div>p:not(.kicker){
max-width:580px;
margin:0 0 24px;
font-size:18px;
color:var(--muted)}
.offer-hero-image{
height:350px;
border:1px solid var(--line);
background:#dce7e4}
.offer-hero-image img{
object-position:center}
.offerings-intro{
border-top:1px solid var(--line);
background:#dce7e4}
.offerings-intro p{
max-width:700px;
margin:0;
padding:25px 0;
font-size:20px;
line-height:1.38}
.service-panels{
padding:28px 0}
.service-panel{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(0,1fr);
gap:58px;
align-items:center;
padding:48px 0;
border-bottom:1px solid var(--line)}
.service-panel-reverse figure{
order:2}
.service-panel figure{
min-height:310px}
.service-panel figure img{
min-height:310px}
.image-contain{
object-fit:contain!important;
background:#dce7e4}
.service-panel h2,.use-story h2,.service-chooser h2,.compact-cta h2{
font:700 clamp(34px,4vw,54px)/.95 Barlow,Impact,sans-serif;
letter-spacing:-.025em;
margin:8px 0 16px}
.service-panel-copy>p:not(.kicker){
font-size:18px;
color:var(--muted);
margin:0 0 20px}
.service-panel h3,.use-story h3{
font:11px/1.3 Mono,monospace;
letter-spacing:.09em;
text-transform:uppercase;
color:var(--cyan-deep);
margin:22px 0 8px}
.service-panel ul,.use-story ol{
margin:0 0 20px;
padding-left:20px}
.service-panel li,.use-story li{
padding:3px 0}
.service-chooser{
background:var(--dark);
color:#eff;
border:0}
.service-chooser .kicker{
color:var(--cyan)}
.service-chooser h2{
max-width:600px}
.service-chooser>div{
display:grid;
grid-template-columns:1.15fr 1fr 1fr 1fr;
gap:25px;
align-items:end}
.service-chooser>div>p:first-of-type{
grid-row:2;
margin:0;
color:#b6c8c5}
.service-chooser>div>div{
border-top:1px solid #506064;
padding-top:13px}
.service-chooser p{
margin:0 0 13px;
font-size:15px;
line-height:1.35}
.service-chooser a{
color:#fff;
font:12px Mono,monospace;
text-decoration-color:var(--cyan);
text-underline-offset:5px}
.use-hero{
padding-bottom:34px}
.use-hero figure{
height:275px;
border:1px solid var(--line)}
.use-case-stories{
border-top:1px solid var(--line)}
.use-story{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(0,1fr);
gap:58px;
align-items:center;
padding:50px 0;
border-bottom:1px solid var(--line)}
.use-story-reverse figure{
order:2}
.use-story figure{
height:330px}
.use-story p{
max-width:590px}
.use-story strong{
color:var(--ink)}
.story-links{
display:flex;
flex-wrap:wrap;
gap:12px 22px;
margin:23px 0 0}
.story-links a{
color:var(--cyan-deep);
font:12px Mono,monospace;
text-decoration:none;
border-bottom:1px solid currentColor;
padding-bottom:3px}
.compact-cta{
border:0;
background:#dce7e4}
.compact-cta p:not(.kicker){
max-width:560px;
font-size:18px}
.offerings-page .button{
margin-top:4px}

@media (hover:hover) and (prefers-reduced-motion:no-preference){
.offerings-page figure img{
transition:transform .35s ease,filter .35s ease}
.offerings-page figure:hover img{
transform:translateY(-5px) scale(1.015);
filter:saturate(1.04)}
html.is-paused .offerings-page figure img,body.motion-paused .offerings-page figure img{
transition:none!important;
transform:none!important}
}

@media(max-width:760px){
.offer-hero,.use-hero,.service-panel,.use-story{
grid-template-columns:1fr;
gap:24px;
padding-top:34px;
padding-bottom:34px}
.offer-hero h1,.use-hero h1{
font-size:clamp(45px,13vw,62px)}
.offer-hero-image,.use-hero figure{
height:235px}
.service-panel figure,.service-panel figure img,.use-story figure{
min-height:0;
height:250px}
.service-panel-reverse figure,.use-story-reverse figure{
order:0}
.offerings-intro p{
font-size:18px}
.service-chooser>div{
grid-template-columns:1fr;
gap:18px}
.service-chooser>div>p:first-of-type{
grid-row:auto}
.service-chooser{
padding:42px 0}
.use-story{
padding:38px 0}
.story-links{
display:grid;
gap:12px}
.offerings-page figcaption{
margin-top:6px}
}


.offerings-page .service-chooser .chooser-heading {
 border:0;
 padding:0;
 }
.offerings-page .service-chooser>div {
 grid-template-columns:1.15fr 1fr 1fr 1fr;
 align-items:center;
 }
.service-chooser .chooser-heading .kicker {
 margin-bottom:12px;
 }
.scenario-jumps {
 display:flex;
 flex-wrap:wrap;
 gap:8px;
 margin-top:18px;
 }
.scenario-jumps a {
 padding:9px 12px;
 border:1px solid var(--cyan-deep);
 color:var(--cyan-deep);
 font-size:13px;
 text-decoration:none;
 }
.scenario-jumps a:hover {
 background:#d5e8e5;
 }
.use-story[id] {
 scroll-margin-top:calc(var(--header-height,65px) + 20px);
 }
.offerings-page .service-panel h2 {
 max-width:18ch;
 }

@media(max-width:760px) {
 .offerings-page .service-chooser>div {
 grid-template-columns:1fr;
 }
.scenario-jumps {
 margin-bottom:4px;
 }
.use-hero figure {
 height:180px;
 }
.service-panel h2 {
 font-size:38px;
 }
 }


.example-note { font-size:13px; color:var(--muted); padding-top:20px; margin-bottom:0; }

/* Keep scenario titles first in reading order, with the existing alternating desktop layout. */
.service-panel[id] { scroll-margin-top:calc(var(--header-height,65px) + 20px); }
.use-hero .workflow-hero-image { height:auto; border:0; }
.use-hero .workflow-hero-image img { height:auto; aspect-ratio:3/2; object-fit:contain; }
.use-story { column-gap:58px; row-gap:0; }
.use-story .story-heading { grid-column:2; grid-row:1; align-self:end; }
.use-story .story-copy { grid-column:2; grid-row:2; align-self:start; }
.use-story figure { grid-column:1; grid-row:1 / span 2; }
.use-story-reverse .story-heading,.use-story-reverse .story-copy { grid-column:1; }
.use-story-reverse figure { grid-column:2; }
@media(max-width:760px) {
 .use-story { gap:20px; }
 .use-story .story-heading,.use-story .story-copy,.use-story figure { grid-column:1; grid-row:auto; }
 .use-story figure { order:0; margin-bottom:12px; }
 .use-story .story-heading h2 { margin-bottom:0; }
 .use-story .story-copy>p:first-child { margin-top:0; }
}

/* Show the complete generated workflow compositions at every width. */
.offerings-page img.generated-workflow { object-fit:contain; min-height:0; background:#edf2f0; }
.service-panel figure:has(.generated-workflow) { min-height:0; }
.service-panel img.generated-workflow { height:auto; aspect-ratio:3/2; }