.how-page .how-hero{min-height:450px;background:linear-gradient(120deg,#f2f8fa,#e3f1f7)}
.how-page .how-hero-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);align-items:center;gap:42px}
.how-page .how-hero .hero-copy{max-width:690px}
.how-page .how-hero .sector-title{font-size:clamp(40px,4.5vw,60px)}
.how-page .how-hero-visual{height:260px;position:relative;border-radius:18px;background:linear-gradient(140deg,#e2f0f7,#f9fcfd);border:1px solid #cbdfe8;overflow:hidden}
.how-page .how-hero-visual:after{content:"";position:absolute;left:10%;right:10%;bottom:23px;border-bottom:2px dashed #a1bdcb}
.how-page .how-outline-building{position:absolute;bottom:25px;display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:17px;border:3px solid #8faab8;background:#f6fbfd;border-radius:8px 8px 0 0}
.how-page .how-outline-building span{border:2px solid #aac3d0;border-radius:3px;background:#e4f2f8}
.how-page .how-outline-building.tall{left:9%;height:190px;width:41%}
.how-page .how-outline-building.short{right:9%;height:135px;width:34%}
.how-page .how-hero-device{position:absolute;z-index:2;display:grid;place-items:center;width:75px;height:75px;border-radius:50%;background:#fff;box-shadow:0 8px 22px #315b722e}
.how-page .how-hero-device .icon{width:62px;height:62px}
.how-page .how-hero-device.extinguisher{left:38%;bottom:27px}
.how-page .how-hero-device.alarm{right:6%;top:17px}
.how-page .how-process{background:#fff}
.how-page .how-timeline{position:relative;list-style:none;padding:0;margin:28px 0 0}
.how-page .how-timeline:before{content:"";position:absolute;left:calc(50% - 1px);top:20px;bottom:30px;width:2px;background:#cfdfe6}
.how-page .how-step{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 72px minmax(0,1fr);align-items:center;min-height:166px}
.how-page .how-step-number{grid-column:2;grid-row:1;justify-self:center;z-index:1;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--red);color:#fff;font-size:20px;font-weight:900;box-shadow:0 0 0 7px #fff}
.how-page .how-step:nth-child(3n+2) .how-step-number{background:var(--blue)}
.how-page .how-step:nth-child(3n) .how-step-number{background:var(--green)}
.how-page .how-step-card{display:flex;align-items:center;gap:19px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 9px 28px #153b480b;padding:17px;min-height:144px}
.how-page .how-step:nth-child(odd) .how-step-card{grid-column:1;grid-row:1;margin-right:10px}
.how-page .how-step:nth-child(even) .how-step-card{grid-column:3;grid-row:1;margin-left:10px}
.how-page .how-step-illustration{flex:0 0 130px;width:130px;line-height:0}
.how-page .how-scene{display:block;width:100%;height:auto;border-radius:12px}
.how-page .how-step-copy{min-width:0}
.how-page .how-step h3{font-size:21px;margin:0 0 8px}
.how-page .how-step p{font-size:15px;line-height:1.45;color:var(--muted);margin:0}
.how-page .how-optional{display:inline-block;margin-top:9px;background:#e8f4fa;border-radius:5px;color:#126c96;padding:4px 8px;font-size:12px;font-weight:800}
@media(max-width:1000px){.how-page .how-hero-layout{grid-template-columns:1fr .7fr;gap:22px}.how-page .how-step-card{gap:12px}.how-page .how-step-illustration{flex-basis:98px;width:98px}.how-page .how-step h3{font-size:19px}.how-page .how-step p{font-size:14px}}
@media(max-width:760px){.how-page .how-hero-layout{display:block}.how-page .how-hero-visual{height:175px;max-width:490px;margin-top:25px}.how-page .how-hero .wrap{padding-top:44px;padding-bottom:42px}.how-page .how-outline-building.tall{height:135px}.how-page .how-outline-building.short{height:105px}.how-page .how-timeline:before{left:21px}.how-page .how-step{grid-template-columns:44px minmax(0,1fr);gap:12px;margin-bottom:14px;min-height:0}.how-page .how-step-number{grid-column:1;grid-row:1;width:38px;height:38px;font-size:18px}.how-page .how-step:nth-child(n) .how-step-card{grid-column:2;grid-row:1;margin:0;min-height:0}.how-page .how-step-illustration{flex-basis:105px;width:105px}}
@media(max-width:480px){.how-page .how-step{grid-template-columns:37px minmax(0,1fr);gap:8px}.how-page .how-timeline:before{left:18px}.how-page .how-step-number{width:35px;height:35px;font-size:16px;box-shadow:0 0 0 4px #fff}.how-page .how-step-card{padding:12px;gap:10px}.how-page .how-step-illustration{flex-basis:77px;width:77px}.how-page .how-step h3{font-size:17px}.how-page .how-step p{font-size:13px}.how-page .how-optional{font-size:11px}}
@media(max-width:355px){.how-page .how-step-card{display:block}.how-page .how-step-illustration{width:76px;float:right;margin:0 0 5px 8px}.how-page .how-step-card:after{content:"";display:block;clear:both}}