.hero inner-wrapper{padding-block:var(--sp-120)}.hero h1{grid-column:1 / -1}.hero img{grid-column:3 / span 10;margin-block-start:var(--sp-48)}.services inner-wrapper{padding-block:var(--sp-48) var(--sp-120)}.services h2{grid-column:span 6}.services p{grid-column:span 5}.services :is(ol,ol>li,details,summary){grid-column:1 / -1;display:grid;grid-template-columns:subgrid}.services ol{margin-block-start:var(--sp-120);border-block-end:var(--sp-1) solid var(--white-shade-12)}.services ol>li{border-block-start:var(--sp-1) solid var(--white-shade-12)}.services details{padding-block:var(--sp-16) var(--sp-32)}.services details::details-content{grid-column:7 / span 5;grid-row:1}.services summary{grid-row:1}.services h3{grid-column:3 / span 4}.services svg{grid-column:-2;justify-self:end;margin-block-start:var(--sp-4)}.services svg>:first-child{transform-box:fill-box;transform-origin:center}.services details[open] svg>:first-child{rotate:90deg}@media(prefers-reduced-motion:no-preference){.services svg>:first-child{transition:rotate var(--dur-600) var(--ease-out-expo)}}.services ul{display:grid;row-gap:var(--sp-4)}.process>inner-wrapper{padding-block:var(--sp-120)}.process h2{grid-column:1 / -1;text-align:center}.process>inner-wrapper>p{grid-column:7 / span 5;margin-block-start:var(--sp-240)}.process ol>li{--step-bg: var(--white);--step-number: var(--black-tint-46);--step-rule: var(--white-shade-12);position:sticky;inset-block-start:var(--sp-56);background-color:var(--step-bg)}.process ol>li:is(:nth-child(2),:nth-child(6)){--step-bg: var(--white-shade-12);--step-number: var(--black-tint-35);--step-rule: var(--white-shade-23)}.process ol>li:is(:nth-child(3),:nth-child(5)){--step-bg: var(--black-tint-35);--step-number: var(--white-shade-12);--step-rule: var(--black-tint-46);color:var(--white)}.process ol>li:nth-child(4){--step-bg: var(--black);--step-number: var(--white);--step-rule: var(--black-tint-35);color:var(--white)}.process ol inner-wrapper{grid-template-areas:"title title title title title title title title .     number number number" "rule  rule  rule  rule  rule  rule  rule  rule  rule  rule   rule   rule" "image image image image .     .     text  text  text  text   .      .";grid-template-rows:auto minmax(var(--sp-24),1fr) auto;min-block-size:calc(100dvh - var(--sp-56));padding-block:var(--sp-24)}.process ol inner-wrapper:before{content:"";grid-area:rule;align-self:end;border-block-start:var(--sp-1) solid var(--step-rule)}.process h3{grid-area:title}.process span[aria-hidden]{grid-area:number;justify-self:end;color:var(--step-number)}.process img{grid-area:image;inline-size:min(100%,calc(100dvh - var(--sp-56) - 4 * var(--sp-24) - var(--sp-1) - 2 * var(--lh-80) * var(--fs-160-48)));margin-block-start:var(--sp-24)}.process step-text{grid-area:text;margin-block-start:var(--sp-24)}.process step-text ul{margin-block-start:var(--sp-16);border-block-end:var(--sp-1) solid var(--step-rule)}.process step-text ul li{padding-block:var(--sp-4);border-block-start:var(--sp-1) solid var(--step-rule)}@media only screen and not (min-width:64rem){.hero inner-wrapper{padding-block:var(--sp-48)}.hero img{grid-column:1 / -1}.services inner-wrapper{row-gap:var(--sp-24);padding-block:var(--sp-48)}.services h2,.services p{grid-column:1 / -1}.services ol{margin-block-start:var(--sp-24)}.services details{row-gap:var(--sp-16)}.services details::details-content{grid-column:1 / -1;grid-row:2}.services summary{row-gap:var(--sp-16)}.services h3{grid-row:2;grid-column:1 / -1}.services svg{grid-row:1}.process>inner-wrapper{padding-block:var(--sp-48)}.process>inner-wrapper>p{grid-column:1 / -1;margin-block-start:var(--sp-96)}.process ol>li{position:static}.process ol inner-wrapper{grid-template-areas:"number number number number" "title title title title" "rule rule rule rule" "image image image image" "text text text text";grid-template-rows:auto auto var(--sp-48) auto auto;min-block-size:auto}.process span[aria-hidden]{justify-self:start;margin-block-end:var(--sp-16)}.process img{inline-size:100%}}@media(prefers-reduced-motion:no-preference){:root[data-reveal] .hero inner-wrapper>img{scale:var(--reveal-zoom);clip-path:inset(calc((1 - 1 / var(--reveal-zoom)) * 50%));animation:reveal-settle var(--dur-900) var(--ease-out-expo) var(--dur-800) backwards,reveal-fade var(--dur-900) var(--ease-in-out-soft) var(--dur-800) backwards}:root[data-reveal] .services:not([data-seen]) :is(h2,inner-wrapper>p,ol>li),:root[data-reveal] .process:not([data-seen])>inner-wrapper>*{opacity:0}:root[data-reveal] .services[data-seen] h2{animation:reveal-rise var(--dur-600) var(--ease-out-expo) backwards}:root[data-reveal] .services[data-seen] inner-wrapper>p{animation:reveal-fade var(--dur-600) var(--ease-in-out-soft) var(--dur-100) backwards,reveal-up var(--dur-600) var(--ease-out-expo) var(--dur-100) backwards}:root[data-reveal] .services[data-seen] ol>li{animation:reveal-rise var(--dur-600) var(--ease-out-expo) calc(var(--step, 0) * var(--dur-100) / 2 + 2 * var(--dur-100)) backwards}:root[data-reveal] .services[data-seen] ol>li:nth-child(2){--step: 1}:root[data-reveal] .services[data-seen] ol>li:nth-child(3){--step: 2}:root[data-reveal] .services[data-seen] ol>li:nth-child(4){--step: 3}:root[data-reveal] .process[data-seen]>inner-wrapper h2{animation:reveal-fade var(--dur-900) var(--ease-in-out-soft) backwards,reveal-up-far var(--dur-900) var(--ease-out-expo) backwards}:root[data-reveal] .process[data-seen]>inner-wrapper p{animation:reveal-fade var(--dur-600) var(--ease-in-out-soft) var(--dur-600) backwards,reveal-up var(--dur-600) var(--ease-out-expo) var(--dur-600) backwards}}
