/* A visual treatment only: original service copy, native disclosures. */
.service-flow{--card-light:#eaf6ff;--card-edge:#7dd3fc}
.service-flow .service-step{position:relative;min-height:400px;display:flex;align-items:center;padding:30px 0}
.service-flow .service-step:nth-child(2){--card-light:#edf5f2;--card-edge:#a5bfb5}
.service-flow .service-step:nth-child(3){--card-light:#f1eff7;--card-edge:#b4acc9}
.service-flow .service-step:nth-child(4){--card-light:#faf2e9;--card-edge:#ceb69d}
.service-flow .service-row{position:relative;width:100%;border:1px solid #0b1f3b18;border-radius:20px;padding:0 34px;background:radial-gradient(ellipse at 94% 10%,var(--card-light),transparent 58%),linear-gradient(125deg,#fff 30%,#f8fcff);transform:scale(calc(.94 + var(--focus,0)*.06));transform-origin:center;box-shadow:inset 0 1px 0 #fff,0 1px 3px #0b1f3b04,0 calc(var(--focus,0)*20px) calc(var(--focus,0)*60px) #0b1f3b0c;will-change:transform}
.service-flow .service-row::before{content:"";position:absolute;inset:0 24px auto;height:1px;background:linear-gradient(90deg,transparent,var(--card-edge),transparent);opacity:calc(.25 + var(--focus,0)*.6);pointer-events:none}
.service-flow .service-row summary{display:grid;grid-template-columns:minmax(0,1fr) 172px 34px;grid-template-rows:auto auto;gap:14px 24px;min-height:224px;padding:32px 0;position:relative}
.service-flow .service-heading{grid-column:1;grid-row:1;align-self:end}
.service-flow .service-row h3{font-size:clamp(28px,3vw,42px);font-weight:500;letter-spacing:-.025em;line-height:1.12;color:#0b1f3b}
.service-flow .service-row summary>p{grid-column:1;grid-row:2;align-self:start;font-size:16px;line-height:1.6;color:#42627d;max-width:460px}
.service-flow .service-row .weather-art{grid-column:2;grid-row:1/span 2;align-self:center;width:172px;height:140px;transform:scale(calc(1 + var(--focus,0)*.25));transform-origin:center;filter:drop-shadow(0 12px 10px #0b1f3b08)}
.service-flow .service-row .plus{grid-column:3;grid-row:1/span 2;align-self:center;border:1px solid #0b1f3b25;border-radius:50%;width:34px;height:34px;display:grid;place-items:center;font-size:22px;text-align:center;color:#007ead;background:#ffffff80}
.service-flow .service-depth{position:relative;border-top:1px solid #0b1f3b12;padding:25px 0 30px}
.service-flow .service-row .service-detail{padding:0;max-width:650px;font-size:16px;line-height:1.75;color:#334d64}
@supports(interpolate-size:allow-keywords){.service-flow .service-row{interpolate-size:allow-keywords}.service-flow .service-row::details-content{block-size:0;overflow:clip;transition:block-size .32s ease,content-visibility .32s allow-discrete}.service-flow .service-row[open]::details-content{block-size:auto}}
@media(max-width:850px){.service-flow .service-step{min-height:430px}.service-flow .service-row{padding:0 28px}.service-flow .service-row summary{grid-template-columns:minmax(0,1fr) 132px 32px;gap:12px 18px}.service-flow .service-row .weather-art{width:132px;height:120px}.service-flow .service-row h3{font-size:32px}}
@media(max-width:600px){.service-flow .service-step{min-height:0;padding:12px 0}.service-flow .service-row{padding:0 22px;border-radius:18px}.service-flow .service-row summary{grid-template-columns:minmax(0,1fr) 28px;grid-template-rows:auto 80px auto;min-height:0;gap:14px;padding:24px 0}.service-flow .service-heading{grid-column:1;grid-row:1}.service-flow .service-row h3{font-size:28px}.service-flow .service-row .plus{grid-column:2;grid-row:1;width:28px;height:28px;font-size:18px}.service-flow .service-row .weather-art{grid-column:1;grid-row:2;width:116px;height:80px}.service-flow .service-row summary>p{grid-column:1/span 2;grid-row:3;font-size:14px}.service-flow .service-depth{padding:22px 0}.service-flow .service-row .service-detail{font-size:14px;line-height:1.7}}
@media(prefers-reduced-motion:reduce){.service-flow .service-step{min-height:0;padding:12px 0}.service-flow .service-row,.service-flow .service-row .weather-art{transform:none;will-change:auto}.service-flow .service-row::details-content{transition:none}}
/* Owner preference: cloud artwork precedes the card text. */
.service-flow .service-row summary{grid-template-columns:172px minmax(0,1fr) 34px}
.service-flow .service-row .weather-art{grid-column:1;grid-row:1/span 2}
.service-flow .service-heading{grid-column:2;grid-row:1}
.service-flow .service-row summary>p{grid-column:2;grid-row:2}
@media(max-width:850px){.service-flow .service-row summary{grid-template-columns:132px minmax(0,1fr) 32px}}
@media(max-width:600px){.service-flow .service-row summary{grid-template-columns:66px minmax(0,1fr) 28px;grid-template-rows:auto auto;gap:14px 10px}.service-flow .service-row .weather-art{grid-column:1;grid-row:1/span 2;width:66px;height:80px;transform:scale(calc(1 + var(--focus,0)*.15))}.service-flow .service-heading{grid-column:2;grid-row:1}.service-flow .service-row h3{font-size:23px;overflow-wrap:anywhere}.service-flow .service-row summary>p{grid-column:2;grid-row:2}.service-flow .service-row .plus{grid-column:3;grid-row:1}}
@media(prefers-reduced-motion:reduce){.service-flow .service-row .weather-art{transform:none}}
@media(max-width:600px){.service-flow .service-row{padding-inline:16px}.service-flow .service-row summary{grid-template-columns:56px minmax(0,1fr) 28px}.service-flow .service-row .weather-art{width:56px}.service-flow .service-row h3{font-size:22px;overflow-wrap:normal}}
/* Smooth disclosure height on Safari as well as Chromium; retain native details. */
.service-flow-smooth .service-row{transition:transform .55s cubic-bezier(.22,.61,.36,1),box-shadow .55s ease}
.service-flow-smooth .service-row .weather-art{transition:transform .65s cubic-bezier(.22,.61,.36,1)}
.service-flow-smooth .service-row::details-content{block-size:auto;transition:none}
.service-flow-smooth .service-row.flow-animating{overflow:hidden}
@media(prefers-reduced-motion:reduce){.service-flow-smooth .service-row,.service-flow-smooth .service-row .weather-art{transition:none}}