:root {
    --mh-navy: #061226;
    --mh-card: #0b1d38;
    --mh-blue: #1689ff;
    --mh-cyan: #43d7ff;
    --mh-text: #eff7ff;
    --mh-muted: #9eb1c9;
    --mh-border: rgba(74, 174, 255, .22);
}

.mh-order-hero {
    padding: 44px 0 34px;
    color: var(--mh-text);
    background:
        radial-gradient(circle at 75% 25%, rgba(26, 137, 255, .22), transparent 33%),
        linear-gradient(120deg, #061226, #071a39);
}
.mh-order-hero__inner { display:flex; align-items:center; justify-content:space-between; gap:30px; }
.mh-order-hero h1 { margin:8px 0; color:#fff; font-size:clamp(30px, 4vw, 50px); }
.mh-order-hero p { max-width:760px; margin:0; color:#afc1d8; font-size:17px; }
.mh-order-eyebrow { color:var(--mh-cyan); font-size:12px; font-weight:800; letter-spacing:.14em; }
.mh-order-hero__icon { width:96px; height:96px; display:grid; place-items:center; border:1px solid var(--mh-border); border-radius:26px; background:rgba(17,54,102,.55); font-size:42px; color:var(--mh-cyan); }

.mh-service-tabs { background:#07162d; border-top:1px solid var(--mh-border); border-bottom:1px solid var(--mh-border); }
.mh-service-tabs__scroll { display:flex; gap:8px; overflow:auto; padding-top:12px; padding-bottom:12px; scrollbar-width:none; }
.mh-service-tabs a { flex:0 0 auto; padding:10px 16px; border:1px solid transparent; border-radius:999px; color:#afc1d8; font-weight:700; }
.mh-service-tabs a:hover,.mh-service-tabs a.is-active { color:#fff; border-color:#238cff; background:rgba(30,126,255,.18); }

.mh-order-page { padding:34px 0 70px; background:#f3f7fc; }
.mh-order-grid { display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:24px; align-items:start; }
.mh-order-main { display:grid; gap:20px; }
.mh-order-card,.mh-summary-card { background:#fff; border:1px solid #dce6f2; border-radius:22px; box-shadow:0 18px 48px rgba(24,53,85,.08); }
.mh-order-card { padding:25px; }
.mh-order-card__head { display:flex; align-items:flex-start; gap:14px; margin-bottom:22px; }
.mh-order-card__head h2 { margin:0 0 5px; color:#13243c; font-size:22px; }
.mh-order-card__head p { margin:0; color:#71829a; }
.mh-step { flex:0 0 40px; height:40px; display:grid; place-items:center; border-radius:13px; color:#fff; background:linear-gradient(135deg,var(--mh-blue),#315fff); font-weight:900; }

.mh-target-box label { display:block; margin-bottom:8px; color:#1a2a42; font-weight:800; }
.mh-target-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; }
.mh-target-row input { width:100%; min-height:58px; padding:0 17px; border:1px solid #cfdaea; border-radius:14px; font-size:16px; outline:none; transition:.2s; }
.mh-target-row input:focus { border-color:var(--mh-blue); box-shadow:0 0 0 4px rgba(22,137,255,.1); }
.mh-target-row button,.mh-add-cart { border:0; border-radius:14px; color:#fff; background:linear-gradient(135deg,#1689ff,#315fff); font-weight:800; }
.mh-target-row button { min-width:145px; padding:0 20px; }
.mh-target-row button:disabled,.mh-add-cart:disabled { cursor:not-allowed; opacity:.48; }
.mh-target-status { min-height:24px; margin-top:10px; color:#657890; font-weight:700; }
.mh-target-status.is-ok { color:#0f9768; }
.mh-target-status.is-warning { color:#a66500; }
.mh-target-status.is-error { color:#d73454; }
.mh-target-preview { margin-top:14px; display:flex; gap:14px; align-items:center; padding:14px; border:1px solid #d7e4f3; border-radius:16px; background:#f8fbff; }
.mh-target-preview[hidden] { display:none; }
.mh-target-preview__media { position:relative; width:76px; height:76px; flex:0 0 76px; overflow:hidden; border:1px solid #d5e2f0; border-radius:15px; background:#eaf1f8; }
.mh-target-preview img { position:relative; z-index:2; width:100%; height:100%; object-fit:cover; background:#eaf1f8; }
.mh-preview-fallback { position:absolute; inset:0; z-index:1; display:grid; place-items:center; background:linear-gradient(145deg,#152a54,#087eea 55%,#58d8ff); }
.mh-preview-fallback svg { width:38px; height:38px; fill:none; stroke:#fff; stroke-width:1.6; filter:drop-shadow(0 5px 12px rgba(0,0,0,.22)); }
.mh-preview-fallback[hidden] { display:none; }
.mh-target-preview div { min-width:0; display:grid; gap:4px; }
.mh-target-preview strong,.mh-target-preview span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mh-target-preview strong { color:#162942; }
.mh-target-preview span,.mh-target-preview small { color:#6d7f96; }

.mh-package-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.mh-package-option { position:relative; min-height:132px; padding:16px; text-align:left; border:1px solid #d6e0ec; border-radius:16px; background:#fff; color:#1b2c44; transition:.18s; }
.mh-package-option:hover,.mh-package-option.is-selected { transform:translateY(-2px); border-color:var(--mh-blue); box-shadow:0 12px 25px rgba(22,137,255,.12); }
.mh-package-option strong,.mh-package-option span,.mh-package-option b { display:block; }
.mh-package-option strong { font-size:24px; }
.mh-package-option span { margin:4px 0 10px; color:#6c7d94; font-size:13px; }
.mh-package-option b { color:#1689ff; font-size:17px; }
.mh-package-option em { position:absolute; top:11px; right:11px; padding:4px 7px; border-radius:999px; color:#087b58; background:#ddf8ee; font-size:10px; font-style:normal; font-weight:900; }

.mh-order-summary { position:sticky; top:20px; }
.mh-summary-card { overflow:hidden; padding:25px; color:var(--mh-text); background:
    radial-gradient(circle at 100% 0,rgba(35,145,255,.28),transparent 36%),
    linear-gradient(145deg,#071327,#0b2142); border-color:var(--mh-border); }
.mh-summary-badge { display:inline-block; padding:7px 10px; border-radius:999px; color:var(--mh-cyan); background:rgba(67,215,255,.1); font-size:12px; font-weight:900; }
.mh-summary-card h2 { margin:14px 0 18px; color:#fff; font-size:24px; }
.mh-summary-card ul { display:grid; gap:11px; padding:0; margin:0 0 20px; list-style:none; }
.mh-summary-card li { display:flex; gap:9px; align-items:flex-start; color:#bfcee0; }
.mh-summary-card li i { color:var(--mh-cyan); font-size:18px; }
.mh-summary-price { display:grid; grid-template-columns:1fr auto; gap:4px 12px; padding:16px 0; border-top:1px solid var(--mh-border); border-bottom:1px solid var(--mh-border); }
.mh-summary-price span { grid-column:1/-1; color:#8ea4bf; font-size:12px; }
.mh-summary-price strong { color:#fff; font-size:18px; }
.mh-summary-price b { color:var(--mh-cyan); font-size:22px; }
.mh-add-cart { width:100%; min-height:58px; margin-top:18px; font-size:17px; }
.mh-add-note { margin:10px 0 0; color:#8da1ba; font-size:12px; text-align:center; }

.mh-trust-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.mh-trust-grid div { padding:18px; border:1px solid #dce6f2; border-radius:17px; background:#fff; }
.mh-trust-grid i,.mh-trust-grid strong,.mh-trust-grid span { display:block; }
.mh-trust-grid i { color:#1689ff; font-size:25px; }
.mh-trust-grid strong { margin:8px 0 4px; color:#172a43; }
.mh-trust-grid span { color:#71829a; font-size:12px; }

.mh-cart-overlay { position:fixed; inset:0; z-index:100000; visibility:hidden; opacity:0; background:rgba(0,8,22,.67); transition:.2s; }
.mh-cart-overlay.is-open { visibility:visible; opacity:1; }
.mh-cart-drawer { position:absolute; top:0; right:0; width:min(440px,100%); height:100%; display:flex; flex-direction:column; padding:22px; color:#eef6ff; background:#07152b; transform:translateX(100%); transition:.26s ease; }
.mh-cart-overlay.is-open .mh-cart-drawer { transform:none; }
.mh-cart-drawer__head { display:flex; align-items:center; justify-content:space-between; padding-bottom:18px; border-bottom:1px solid var(--mh-border); }
.mh-cart-drawer__head h2 { margin:0; color:#fff; }
.mh-cart-close { width:40px; height:40px; border:1px solid var(--mh-border); border-radius:12px; color:#fff; background:transparent; }
.mh-cart-drawer__items { flex:1; overflow:auto; padding:14px 0; }
.mh-cart-drawer__item { display:grid; grid-template-columns:1fr auto; gap:10px; padding:15px 0; border-bottom:1px solid var(--mh-border); }
.mh-cart-drawer__item strong,.mh-cart-drawer__item span,.mh-cart-drawer__item small { display:block; }
.mh-cart-drawer__item span,.mh-cart-drawer__item small { color:#9cafc6; }
.mh-cart-drawer__item small { max-width:270px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mh-cart-drawer__remove { border:0; color:#ff7891; background:transparent; }
.mh-cart-drawer__foot { padding-top:16px; border-top:1px solid var(--mh-border); }
.mh-cart-drawer__total { display:flex; justify-content:space-between; margin-bottom:14px; font-size:20px; font-weight:900; }
.mh-cart-drawer__actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.mh-cart-drawer__actions a,.mh-cart-drawer__actions button { min-height:50px; display:grid; place-items:center; border:1px solid var(--mh-blue); border-radius:13px; color:#fff; background:transparent; font-weight:800; }
.mh-cart-drawer__actions a { background:var(--mh-blue); }
.mh-cart-empty { padding:50px 15px; color:#9eb1c9; text-align:center; }
.mh-payment-continue { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; padding:14px 18px; border:1px solid #d8e4f1; border-radius:16px; background:#fff; }
.mh-payment-continue strong { color:#172a43; }
.mh-payment-continue a { padding:10px 14px; border-radius:11px; color:#fff; background:#1689ff; font-weight:800; }

@media(max-width:991px) {
    .mh-order-grid { grid-template-columns:1fr; }
    .mh-order-summary { position:static; }
}
@media(max-width:680px) {
    .mh-order-hero { padding:30px 0; }
    .mh-order-hero__icon { display:none; }
    .mh-order-page { padding-top:18px; }
    .mh-order-card,.mh-summary-card { border-radius:17px; }
    .mh-order-card { padding:18px; }
    .mh-target-row { grid-template-columns:1fr; }
    .mh-target-row button { min-height:50px; }
    .mh-package-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .mh-package-option { min-height:120px; padding:13px; }
    .mh-trust-grid { grid-template-columns:1fr; }
    .mh-cart-drawer__actions { grid-template-columns:1fr; }
}
