.mg-btl { --btl-ink: #0b1a3c; --btl-navy: #0b3d9e; --btl-red: #c8102e; --btl-green: #1f6b35; }

.mg-btl-hero { position: relative; overflow: hidden; min-height: 462px; background: linear-gradient(115deg, #0b3fa8 0%, #0b3d9e 45%, #0a3590 100%); }
.mg-btl-art { position: absolute; top: 0; bottom: 0; left: 44%; right: 0; clip-path: polygon(57% 0, 100% 0, 100% 100%, 14% 100%); }
.mg-btl-art img { width: 100%; height: 100%; object-fit: cover; object-position: 30% 35%; }
.mg-btl-haze { position: absolute; inset: 0; background: linear-gradient(225deg, rgba(255, 255, 255, .95) 0%, rgba(255, 255, 255, .55) 100%); clip-path: polygon(63.3% 53.7%, 44.4% 100%, 52.5% 100%); }
.mg-btl-red { position: absolute; inset: 0; background: linear-gradient(200deg, #d0112f, #c20f2b); clip-path: polygon(100% 15%, 100% 100%, 69.6% 100%); }

.mg-btl-in { position: relative; z-index: 1; padding: 42px 0 40px; }
.mg-btl-crumbs { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; font-size: 20px; line-height: 1.3; color: #fff; }
.mg-btl-crumbs a { color: #fff; }
.mg-btl-crumbs svg { width: 17px; height: 17px; fill: none; stroke: #ec2a44; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.mg-btl-title { margin: 0; font-size: 79px; line-height: 1.2; font-weight: 700; letter-spacing: -.02em; color: #fff; }
.mg-btl-title span { color: #e8112f; }
.mg-btl-rule { display: block; width: 100px; height: 4px; margin: 26px 0 30px; background: #e8112f; border-radius: 2px; }
.mg-btl-lead { margin: 0; max-width: 490px; font-size: 23px; line-height: 1.55; color: #fff; }
.mg-btl-promise { display: flex; align-items: center; gap: 22px; margin: 30px 0 0; font-size: 23px; font-weight: 700; color: #fff; }
.mg-btl-promise svg { width: 50px; height: 50px; flex: none; fill: none; stroke: #fff; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }

.mg-btl-main { background: #f7f8fa; padding: 24px 0 22px; }
.mg-btl-h2 { margin: 0; text-align: center; font-size: 33px; line-height: 1.2; font-weight: 700; letter-spacing: -.01em; color: var(--btl-ink); }
.mg-btl-bar { display: block; width: 76px; height: 4px; margin: 14px auto 0; background: var(--btl-red); border-radius: 2px; }

.mg-btl-calc { background: #fff; border-radius: 10px; padding: 30px 38px 22px; box-shadow: 0 4px 18px rgba(11, 26, 60, .08); }
.mg-btl-cols { display: grid; grid-template-columns: 190fr 196fr 218fr; gap: 46px; margin-top: 22px; }
.mg-btl-col { display: flex; flex-direction: column; }
.mg-btl-lab { margin-bottom: 14px; font-size: 21px; font-weight: 600; color: var(--btl-ink); }
.mg-btl-input { position: relative; display: block; }
.mg-btl .mg-btl-input input,
.mg-btl .mg-btl-col select { width: 100%; height: 66px; padding: 0 20px; border: 1.5px solid #c9d0db; border-radius: 6px; background-color: #fff; font: inherit; font-size: 27px; font-weight: 600; color: var(--btl-ink); }
.mg-btl-input svg { position: absolute; right: 18px; top: 50%; width: 32px; height: 32px; transform: translateY(-50%); fill: none; stroke: #e0566b; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.mg-btl .mg-btl-col select {
    appearance: none; -webkit-appearance: none; cursor: pointer; padding-right: 56px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b1a3c' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 18px center; background-size: 26px;
}
.mg-btl-help { margin-top: 14px; font-size: 19px; color: #4a5263; }

.mg-btl-result { display: flex; align-items: center; gap: 22px; min-height: 113px; padding: 14px 20px; background: #eef7ef; border: 1.5px solid #c3e1c9; border-radius: 6px; }
.mg-btl-result svg { width: 50px; height: 50px; flex: none; fill: none; stroke: var(--btl-green); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.mg-btl-result strong { display: block; font-size: 24px; line-height: 1.3; font-weight: 700; color: var(--btl-green); }
.mg-btl-result p { margin: 4px 0 0; font-size: 19px; line-height: 1.45; color: #2c3446; }
.mg-btl-result .no { display: none; }
.mg-btl-result.fail { background: #fdeef0; border-color: #f2c2ca; }
.mg-btl-result.fail svg { stroke: var(--btl-red); }
.mg-btl-result.fail strong { color: var(--btl-red); }
.mg-btl-result.fail .ok { display: none; }
.mg-btl-result.fail .no { display: block; }

.mg-btl-info { display: flex; align-items: center; gap: 12px; margin: 26px 0 0; font-size: 18px; color: #3d4556; }
.mg-btl-info svg { width: 24px; height: 24px; flex: none; fill: none; stroke: #3d4556; stroke-width: 1.6; stroke-linecap: round; }

.mg-btl-why { margin-top: 46px; font-size: 31px; }

.mg-btl-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; max-width: 1086px; margin: 34px auto 0; }
.mg-btl-card { background: #fff; border-radius: 8px; padding: 26px 26px 30px; box-shadow: 0 4px 16px rgba(11, 26, 60, .07); }
.mg-btl-card svg { width: 58px; height: 58px; fill: none; stroke: var(--btl-red); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.mg-btl-card h3 { margin: 18px 0 10px; font-size: 26px; line-height: 1.25; font-weight: 700; color: var(--btl-ink); }
.mg-btl-card p { margin: 0; font-size: 20px; line-height: 1.7; color: #2c3446; }

.mg-btl-cta { margin-top: 26px; text-align: center; }
.mg-btl-cta .cp-btn { height: 70px; padding: 0 74px; gap: 24px; border-radius: 6px; font-size: 27px; font-weight: 600; }
.mg-btl-cta .cp-btn svg { width: 32px; height: 32px; }

@media (max-width: 900px) {
    .mg-btl-art { left: 0; opacity: .25; clip-path: none; }
    .mg-btl-haze, .mg-btl-red { display: none; }
    .mg-btl-title { font-size: 46px; }
    .mg-btl-lead, .mg-btl-promise { font-size: 18px; }
    .mg-btl-calc { padding: 24px 18px; }
    .mg-btl-cols, .mg-btl-cards { grid-template-columns: minmax(0, 1fr); gap: 22px; }
    .mg-btl-br { display: none; }
    .mg-btl-h2 { font-size: 26px; }
    .mg-btl-cta .cp-btn { height: 60px; padding: 0 28px; font-size: 20px; }
}
