/* hero */
.hero-section{padding:24px 0 0}
.breadcrumbs{display:flex;gap:9px;align-items:center;margin:0 2px 13px;color:#707a87;font-size:12px}
.breadcrumbs b{color:var(--ink)}
.hero{border:1px solid #d7dee6;border-radius:24px;background:linear-gradient(135deg,#fff 0%,#f7f9fb 100%);box-shadow:0 16px 38px rgba(35,46,65,.10);overflow:hidden}
.hero-copy{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:48px;padding:34px 42px 34px 48px}
.hero-text{min-width:0}
.hero h1{max-width:900px;margin:0 0 12px;color:var(--ink);text-transform: none;}
.hero h1 span{color:var(--red)}
.hero-copy p{max-width:760px;margin:0;color:#566171;font-size:15px;line-height:1.55}
.hero-actions{display:flex;align-items:center;justify-content:flex-end}
.hero-actions .button{min-height:44px;white-space:nowrap}

/* why */
.why-section{padding-bottom:56px}
.why-shell{padding:34px;border:1px solid #23324a;border-radius:28px;background:linear-gradient(145deg,#23324a 0%,#2d3d58 100%);box-shadow:var(--shadow)}
.why-shell .section-title{margin-bottom:24px;color:#fff}
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.why-card{position:relative;min-height:184px;padding:31px 27px 28px;border:1px solid #dfe5eb;border-radius:20px;background:linear-gradient(180deg,#ffffff 0%,#f7f9fb 100%)}
.why-card:before{content:"";display:block;width:32px;height:3px;margin-bottom:24px;border-radius:99px;background:var(--red)}
.why-card h3{margin:0 0 10px;color:var(--ink);font-size:20px;line-height:1.28}
.why-card p{margin:0;color:var(--muted);font-size:14px;line-height:1.55}

/* process */
.process-section{padding-top:0}
.process-wrap{border:1px solid #d7dee6;border-radius:28px;overflow:hidden;background:var(--white);;box-shadow:var(--soft-shadow)}
.process-top{padding:34px 40px 20px;background:#f7f9fb}
.process-top h2{margin:0;color:var(--ink);}
.steps{display:grid;grid-template-columns:repeat(3,1fr)}
.step{min-height:196px;padding:28px 30px}
.step+.step{border-left:1px solid var(--line)}
.step .step-no{display:flex;align-items:center;gap:10px;color:var(--red);font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.step .step-no:after{content:"";height:1px;flex:1;background:#e2e6eb}
.step h3{margin:29px 0 9px;color:var(--ink);}
.step p{margin:0;color:var(--muted);font-size:13px;line-height:1.55}

/* contact cta like акции */
.contact-section{padding-top:56px}
.contact-panel{display:grid;grid-template-columns:78px 1fr auto;align-items:center;gap:28px;padding:34px 34px 34px 28px;border-radius:26px;background:linear-gradient(145deg,#202b3e 0%,#2d3d58 100%);box-shadow:0 18px 42px rgba(35,46,65,.18);overflow:hidden;position:relative}
.contact-panel:before{content:"";position:absolute;right:14%;bottom:-110px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.08),rgba(255,255,255,0) 70%)}
.contact-mark{position:relative;z-index:1;display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--red);color:#fff;font-size:26px;font-weight:900;box-shadow:0 14px 28px rgba(215,34,37,.24)}
.contact-copy,.contact-actions{position:relative;z-index:1}
.contact-copy h2{margin:0 0 10px;color:var(--white);}
.contact-copy p{max-width:700px;margin:0;color:#ffffffb3;font-size:14px;line-height:1.6}
.contact-copy p a{color:var(--white);;font-weight:900}
.contact-actions{display:flex;align-items:center;gap:16px}
.contact-actions .button{min-height:40px;padding:0 18px;border-radius:10px;font-size:12px}
.contact-actions .messengers{display:flex;gap:5px;}
.contact-actions .messengers a{width:32px;height:32px;font-size:12px;box-shadow:none;display:block;}
.contact-actions .messengers a img{width:100%;height:100%}
@media (max-width: 900px) {
    .hero-copy {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 32px 36px;
    }
	.steps {
        grid-template-columns: 1fr;
    }
	.why-grid {
        grid-template-columns: 1fr;
    }
	.contact-panel {
		grid-template-columns: 1fr;
        align-items: flex-start;
	}
}

@media (max-width: 620px) {
	.hero-actions .btn {
		width: 100%
	}
	.hero-copy {
        padding: 26px 22px;
        gap: 18px;
    }
	.why-shell {
        padding: 26px 18px;
		border-radius: 23px;
    }
	.process-wrap {
		border-radius: 23px;
	}
	.process-top {
        padding: 28px 24px 16px;
    }
	.step {
        padding: 24px;
    }
    .contact-actions {
        flex-direction: column;
        align-items: flex-start;
    }
	.contact-actions .btn {
		width: 100%
	}
}