.mnav.is-open{display:block}
.dir{border:1px solid #e0e6f2;border-radius:16px;padding:22px;background:#fff;transition:border-color .18s,box-shadow .18s}
.dir:hover{border-color:var(--accent);box-shadow:0 10px 30px rgba(18,22,28,.09)}
.dir__top{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.dir__ico{width:46px;height:46px;flex:0 0 46px;border-radius:12px;background:#0a0f1e;display:grid;place-items:center;color:var(--accent)}
.dir__ico svg{width:24px;height:24px}
.dir h3{font-size:20px;margin:0}
.dir__cnt{font-size:12.5px;font-weight:700;color:#6c7893;letter-spacing:.04em}
.dir__items{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 18px}
.dir__items li{font-size:13.5px;padding:7px 12px;border-radius:8px;background:#f6f8fc;color:#333b46;font-weight:600}
.calc{background:#0a0f1e;color:#fff}
.calc .sec__h{color:#fff}
.calc .sec__lead{color:#9fb3d9}
.calc__box{margin-top:24px;background:linear-gradient(165deg,rgba(255,255,255,.08),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:20px}
.calc__grid{display:grid;gap:16px}
.fld label,.calc__lbl{font-family:var(--d);font-size:12.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:#93a5c9}
.fld select,.fld input{width:100%;padding:13px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.2);background:#131b30;color:#fff;font-size:15.5px;font-family:inherit;appearance:none}
.fld select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff7a18' stroke-width='2.4'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:18px;padding-right:40px}
.fld input:focus,.fld select:focus{border-color:var(--accent);outline:none}
.segs{display:flex;flex-wrap:wrap;gap:8px}
.segs button{flex:1 1 150px;padding:11px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.2);background:transparent;color:#d3dae4;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer}
.segs button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:#ffffff}
.calc__mode{margin-bottom:16px}
.calc__out{margin-top:18px;display:grid;gap:14px;padding:18px;border-radius:12px;background:rgba(29,78,216,.10);border:1px solid rgba(29,78,216,.35)}
.calc__row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:14.5px;color:#dbe6fb}
.calc__row b{font-family:var(--m);font-size:17.5px;color:#fff;font-weight:600;font-variant-numeric:tabular-nums}
.calc__sum b{font-family:var(--d);font-size:clamp(27px,5.6vw,38px);color:var(--accent);font-weight:700;letter-spacing:.01em;font-variant-numeric:tabular-nums}
.calc__note{margin:14px 0 0;font-size:13px;color:#93a5c9}
.calc__cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.why{display:grid;gap:16px;margin-top:26px}
.why li{border-left:3px solid var(--accent);padding:4px 0 4px 16px}
.why h3{font-size:17px;margin-bottom:4px}
.why p{margin:0;color:#5c6b8c;font-size:14.5px}
.steps{counter-reset:s;display:grid;gap:16px;margin-top:26px}
.steps li{counter-increment:s;position:relative;background:#f6f8fc;border-radius:14px;padding:20px 20px 20px 66px}
.steps li::before{content:"0" counter(s);position:absolute;left:18px;top:16px;font-size:22px;font-weight:900;color:var(--accent);letter-spacing:-.03em}
.steps h3{font-size:17px;margin-bottom:4px}
.steps p{margin:0;color:#5c6b8c;font-size:14.5px}
.lead{background:#f6f8fc}
.lead__grid{display:grid;gap:26px}
.form{background:#fff;border:1px solid #e0e6f2;border-radius:16px;padding:22px}
.form .fld{margin-bottom:16px}
.form .fld label{color:#333e59}
.form input,.form textarea{width:100%;padding:13px 14px;border-radius:10px;border:1px solid #dbe3f4;background:#fff;color:#0a0f1e;font-size:16px;font-family:inherit}
.form input:focus,.form textarea:focus{border-color:var(--accent);outline:none}
.form .err{display:none;color:#c62828;font-size:13px;font-weight:600}
.fld.is-bad input,.fld.is-bad textarea{border-color:#c62828;background:#fff6f6}
.fld.is-bad .err{display:block}
.form .btn{width:100%}
.form__ok{display:none;margin-top:14px;padding:14px;border-radius:10px;background:#e8f6ec;border:1px solid #b6e0c2;color:#1d6b33;font-weight:700}
.form__ok.is-on{display:block}
.form__priv{margin:12px 0 0;font-size:12.5px;color:#79828f}
.ftr{background:#070b16;color:#a7b1bf;padding:44px 0 26px;font-size:14.5px}
.ftr__grid{display:grid;gap:26px}
.ftr h3{color:#fff;font-size:14px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:12px}
.ftr a:hover{color:var(--accent)}
.ftr li{padding:5px 0}
.ftr .logo__name{color:#fff}
.ftr__about{max-width:38ch;margin-top:14px;color:#8f99a7;font-size:14px}
.ftr__by a{color:#9aa4b2;text-decoration:none;border-bottom:1px dotted rgba(255,255,255,.25)}
.ftr__by a:hover,.ftr__by a:focus-visible{color:var(--accent);border-bottom-color:var(--accent)}
.ftr__btm{margin-top:28px;padding-top:18px;border-top:1px solid rgba(255,255,255,.1);display:flex;flex-wrap:wrap;gap:10px 18px;justify-content:space-between;font-size:13px;color:#6c7893}
.card__na{display:inline-block;padding:2px 8px;border-radius:999px;background:#3b2b2b;color:#ffb4b4;font-size:12px;margin-left:8px;vertical-align:middle}
.tag.card__price{color:var(--accent);font-weight:700}
.card{border:1px solid #e0e6f2;border-radius:16px;padding:22px;background:#fff;display:flex;flex-direction:column;transition:border-color .18s,box-shadow .18s;scroll-margin-top:90px}
.card:hover{border-color:var(--accent);box-shadow:0 10px 30px rgba(18,22,28,.09)}
.card__ico{width:48px;height:48px;border-radius:12px;background:#0a0f1e;display:grid;place-items:center;color:var(--accent);margin-bottom:14px}
.card__ico svg{width:26px;height:26px}
.card h2{font-size:20px;margin-bottom:8px}
.card__desc{color:#5c6b8c;font-size:14.8px;margin-bottom:14px}
.specs{margin:0 0 16px;border-top:1px solid #edf1f9}
.specs li{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid #edf1f9;font-size:14px}
.specs li span{color:#6c7893}
.specs li b{font-weight:700;text-align:right}
.card__foot{margin-top:auto;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.tag{font-size:12.5px;font-weight:700;color:#8d5a12;background:#fdf0dd;border-radius:999px;padding:6px 12px}
.cta{background:#f6f8fc}
.cta__box .btn{width:100%}
.faq{background:#f6f8fc}
.faq__list{margin-top:22px;display:grid;gap:12px}
.faq details{background:#fff;border:1px solid #e0e6f2;border-radius:12px;padding:16px 18px}
.faq details[open]{border-color:var(--accent)}
.faq summary{font-weight:700;cursor:pointer;font-size:16px;list-style:none;display:flex;gap:12px;align-items:flex-start}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"+";color:var(--accent);font-weight:900;font-size:20px;line-height:1.2}
.faq details[open] summary::before{content:"–"}
.faq p{margin:12px 0 0;color:#5c6b8c;font-size:15px}
.grid3{display:grid;gap:18px;margin-top:26px}
.tile{border:1px solid #e0e6f2;border-radius:16px;padding:22px;background:#fff}
.tile__ico{width:46px;height:46px;border-radius:12px;background:#0a0f1e;display:grid;place-items:center;color:var(--accent);margin-bottom:14px}
.tile__ico svg{width:24px;height:24px}
.tile h3{font-size:18px;margin-bottom:8px}
.tile p{margin:0;color:#5c6b8c;font-size:14.8px}
.note{margin-top:26px;border-left:3px solid var(--accent);background:#fdf6ec;border-radius:0 12px 12px 0;padding:18px 20px}
.note p{margin:0;color:#5a4a30;font-size:15px}
.two{display:grid;gap:28px;align-items:start}
.txt p{color:#3f4753;font-size:16px}
.txt p strong{color:#0a0f1e}
.panel{border:1px solid #e0e6f2;border-radius:16px;padding:22px;background:#f7f9fb}
.panel h2{font-size:18px;margin-bottom:14px}
.panel li{display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-bottom:1px dashed #dde3ea;font-size:15px;color:#3f4753}
.panel li:last-child{border-bottom:0}
.vals{display:grid;gap:16px;margin-top:26px}
.vals li{border-left:3px solid var(--accent);padding:4px 0 4px 16px}
.vals h3{font-size:17px;margin-bottom:4px}
.vals p{margin:0;color:#5c6b8c;font-size:14.5px}
.sig{background:#0a0f1e;color:#fff}
.sig .sec__h{color:#fff}
.sig .sec__lead{color:#9fb3d9}
.sig__mark{display:grid;gap:22px;align-items:center;margin-top:26px}
.sig__logo{background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:28px;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.sig__logo svg{width:104px;height:104px}
.sig__word{font-size:30px;font-weight:900;letter-spacing:.2em;background:linear-gradient(120deg,#e8e8ea,#9a9aa2 52%,#d5d5db);-webkit-background-clip:text;background-clip:text;color:transparent}
.sig__slog{font-size:13.5px;color:#a9b3c1;letter-spacing:.03em}
.sig__note li{padding:9px 0;border-bottom:1px dashed rgba(255,255,255,.14);color:#cbd3de;font-size:15px;display:flex;gap:10px}
.sig__note li:last-child{border-bottom:0}
.ccard__ico{width:40px;height:40px;flex:0 0 40px;border-radius:10px;background:#0a0f1e;display:grid;place-items:center;color:var(--accent)}
.ccard__ico svg{width:20px;height:20px}
.ccard small{display:block;color:#6c7893;font-size:13.5px;margin-top:4px}
.fld label{font-size:12.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:#333e59}
.map{margin-top:26px;border:1px solid #e0e6f2;border-radius:16px;overflow:hidden;background:#edf1f9}
.map__ph{position:relative;min-height:220px;display:grid;place-items:center;text-align:center;padding:26px;background:
 repeating-linear-gradient(90deg,#e6eaef 0 1px,transparent 1px 46px),
 repeating-linear-gradient(0deg,#e6eaef 0 1px,transparent 1px 46px),#f4f6f9}
.map__pin{width:44px;height:44px;border-radius:50%;background:var(--accent);display:grid;place-items:center;color:#ffffff;margin:0 auto 12px}
.map__pin svg{width:22px;height:22px}
.map__ph b{display:block;font-size:17px}
.map__ph small{color:#6c7893;font-size:13.5px}
.sitemap{background:#f6f8fc}
.sitemap__grid{display:grid;gap:22px;margin-top:22px}
.sitemap h3{font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:#6c7893;margin-bottom:10px}
.sitemap li{padding:5px 0;font-size:15px}
.sitemap li a:hover{color:#b26512}
@media (min-width:640px){.contacts{grid-template-columns:1fr 1fr}.why{grid-template-columns:1fr 1fr}.calc__grid{grid-template-columns:1fr 1fr}.grid3{grid-template-columns:1fr 1fr}.vals{grid-template-columns:1fr 1fr}.sitemap__grid{grid-template-columns:repeat(3,1fr)}}
@media (min-width:900px){.steps{grid-template-columns:repeat(4,1fr)}.lead__grid{grid-template-columns:1fr 1fr;align-items:start;gap:44px}.ftr__grid{grid-template-columns:1.4fr 1fr 1fr 1fr}.cta__box{grid-template-columns:1.6fr auto}.cta__box .btn{width:auto}.grid3{grid-template-columns:repeat(3,1fr)}.two{grid-template-columns:1.35fr .9fr;gap:44px}.sig__mark{grid-template-columns:.85fr 1.15fr;gap:38px}}
.fld[hidden],[hidden]{display:none!important}@media(max-width:640px){.fab{top:auto;bottom:14px;transform:none}.fab__list{gap:7px}.fab__item,.fab__ico{height:40px}.fab__ico{width:40px;flex:0 0 40px}.fab__item{max-width:40px;border-radius:20px}.fab.is-open .fab__item{max-width:220px}}
@media(max-width:640px){.calc__box,.form,.lmod .form{padding-right:54px}.calc__cta .btn,.form .btn{width:100%}}

/* №322: підказка під полем і мобільні розміри калькулятора */
.fld__hint{display:block;font-size:12.5px;font-weight:600;letter-spacing:0;text-transform:none;color:#8f9aa8}
.calc__cta button.btn{cursor:pointer}
@media(max-width:640px){.calc__box .fld input,.calc__box .fld select{font-size:16.5px;padding:15px 14px}.calc__box .segs button{flex:1 1 30%;padding:14px 10px;font-size:14.5px}.calc__out{padding:16px 14px}.calc__row{flex-direction:column;align-items:flex-start;gap:3px;font-size:14px}.calc__row b{font-size:18px}.calc__sum{flex-direction:row;align-items:baseline;justify-content:space-between}}