.hfp-service-scenarios { background-color:var(--brand-green); background-image:none; }
.hfp-service-scenarios__layout { display:grid; grid-template-columns:minmax(250px,30%) minmax(0,70%); gap:clamp(36px,6vw,112px); align-items:center; }
.hfp-service-scenarios__meta h2 { color:var(--white); }
.hfp-service-scenarios__meta > p:not(.hfp-eyebrow) { max-width:260px; color:var(--white); }
.hfp-service-scenarios__meta > .hfp-eyebrow { color:var(--white); }
.hfp-service-scenarios__counter { display:flex; align-items:baseline; gap:3px; margin:52px 0 14px; color:var(--white); }
.hfp-service-scenarios__counter strong { color:var(--white); font-family:"Manrope",Arial,sans-serif; font-size:40px; font-weight:500; }
.hfp-service-scenarios__counter span { font-size:16px; }
.hfp-service-scenarios__controls { display:flex; gap:10px; margin-top:38px; }
.hfp-service-scenarios__controls button { display:grid; width:46px; height:46px; place-items:center; border:1px solid #d6d6d6; border-radius:50%; background:var(--white); color:var(--brand-green); cursor:pointer; }
.hfp-service-scenarios__controls button:hover { border-color:var(--brand-green); background:var(--brand-green); color:var(--white); }
.hfp-service-scenarios__viewport { width:100%; min-width:0; overflow:hidden; }
.hfp-service-scenarios__viewport { overflow:hidden; }
.hfp-service-scenarios .hfp-service-scenarios__card { position:relative; display:block; height:482px; min-height:482px; overflow:hidden; border-radius:5px; background-color:var(--gray-300); background-image:var(--scenario-image,none); background-position:center; background-size:cover; background-repeat:no-repeat; color:var(--white); }
.hfp-service-scenarios__card::before { position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,0) 44%,rgba(0,0,0,.06) 58%,rgba(0,0,0,.74) 100%); content:""; }
.hfp-service-scenarios .hfp-service-scenarios__card > div { position:absolute; right:0; bottom:0; left:0; z-index:1; padding:28px 32px 31px; }
.hfp-service-scenarios__card h3 { margin:0 0 10px; color:var(--white); font-size:30px; line-height:1.2; }
.hfp-service-scenarios__card p { margin:0; color:rgba(255,255,255,.86); line-height:1.6; }
@media(max-width:768px){.hfp-service-scenarios__layout{grid-template-columns:1fr}.hfp-service-scenarios__counter{margin-top:32px}.hfp-service-scenarios__counter strong{font-size:36px}.hfp-service-scenarios__meta>p:not(.hfp-eyebrow){max-width:none}.hfp-service-scenarios .hfp-service-scenarios__card{height:420px;min-height:420px}.hfp-service-scenarios__card h3{font-size:24px}}