:root {
  --navy: #071426;
  --navy-2: #0b213d;
  --blue: #1167e8;
  --orange: #ff6b18;
  --ink: #0a1b31;
  --muted: #64758a;
  --line: #dfe6ee;
  --paper: #f4f7fa;
  --radius-control: 7px;
  --radius-card: 11px;
  --radius-media: 12px;
}

/* WordPress integration */
.wp-site-blocks { padding: 0; }
.wp-admin-bar-showing .site-header { top: 32px; }
.brand img { width: 210px; height: auto; display: block; }
.site-header .dizoil-logo-image { width: 220px; }
.footer-brand .dizoil-logo-image { width: 265px; }
.site-header .nav { position: relative; }
.site-header .site-nav .menu { display: flex; align-items: center; gap: 16px; list-style: none; margin: 0; padding: 0; }
.site-header .site-nav .menu-item { margin: 0; }
.site-header .site-nav .current-menu-item > a,
.site-header .site-nav .current_page_item > a { color: #fff; }
.site-header .site-nav .current-menu-item > a::after,
.site-header .site-nav .current_page_item > a::after { right: 0; }
.site-main { min-height: 60vh; }
.wp-content > *:first-child { margin-top: 0; }
.wp-content > *:last-child { margin-bottom: 0; }
.wp-content h2 { font-size: clamp(28px, 4vw, 54px); line-height: 1.05; margin: 0 0 24px; }
.wp-content h3 { font-size: 24px; margin: 0 0 12px; }
.wp-content p { color: var(--muted); font-size: 18px; line-height: 1.7; }
.wp-content ul { color: var(--muted); font-size: 17px; line-height: 1.7; }
.wp-content .section-dark p { color: #b7c4d4; }
.wp-content img { max-width: 100%; height: auto; border-radius: var(--radius-media); }
.site-nav .menu { display: flex; align-items: center; gap: 26px; list-style: none; margin: 0; padding: 0; }
.site-nav .current-menu-item > a { color: var(--orange); }
.wp-order-form { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.wp-order-form .full { grid-column: 1 / -1; }
.wp-order-form input,
.wp-order-form select,
.wp-order-form textarea { width: 100%; min-height: 52px; border: 1px solid #d8e0e9; padding: 13px 15px; background: #fff; border-radius: var(--radius-control); }
.wp-order-form textarea { min-height: 86px; resize: vertical; }
.wp-order-form .btn { border: 0; cursor: pointer; justify-content: center; }
.form-status { grid-column: 1 / -1; min-height: 22px; font-size: 14px; }
.form-status.success { color: #12834a; }
.form-status.error { color: #c3362b; }
.fuel-meta-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--radius-card); overflow: hidden; margin: 28px 0; }
.fuel-meta-grid > div { background: #fff; padding: 22px; }
.fuel-meta-grid span { display: block; color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .1em; margin-bottom: 8px; }
.fuel-meta-grid b { font-size: 20px; }
.content-card { border: 1px solid var(--line); border-radius: var(--radius-card); background: #fff; padding: clamp(24px, 4vw, 48px); }
.editable-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.editable-grid > article { border: 1px solid var(--line); border-radius: var(--radius-card); padding: 28px; background: #fff; }
.editable-grid .number { color: var(--orange); font-weight: 800; letter-spacing: .08em; }
.wp-quick-card { position: relative; z-index: 2; }
.wp-quick-card .wp-order-form { grid-template-columns: 1fr; }
.wp-quick-card .wp-order-form .full { grid-column: auto; }
.callback-modal[hidden] { display: none; }
.callback-modal { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 20px; }
.callback-modal-backdrop { position: absolute; inset: 0; background: rgba(3, 13, 29, .78); backdrop-filter: blur(5px); }
.callback-modal-card { position: relative; z-index: 1; width: min(620px, 100%); max-height: calc(100vh - 40px); overflow: auto; padding: 32px; background: #fff; border-radius: var(--radius-card); box-shadow: 0 28px 80px rgba(0,0,0,.35); }
.callback-modal-card h2 { margin: 0 0 8px; font-size: 34px; }
.callback-modal-card > p { color: var(--muted); margin: 0 0 22px; }
.callback-close { position: absolute; top: 14px; right: 14px; width: 40px; height: 40px; border: 0; background: var(--paper); cursor: pointer; border-radius: 50%; font-size: 24px; }
.wp-price-table { border: 1px solid var(--line); border-radius: var(--radius-card); overflow: hidden; }
.wp-price-row { display: grid; grid-template-columns: 1.4fr 1.3fr .8fr .8fr; gap: 16px; align-items: center; padding: 18px 22px; border-bottom: 1px solid var(--line); }
.wp-price-row:last-child { border-bottom: 0; }
.wp-price-head { background: var(--navy); color: #fff; font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.wp-review-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.wp-review-grid article { border: 1px solid var(--line); border-radius: var(--radius-card); padding: 28px; }
.wp-review-grid p { color: var(--ink); font-size: 19px; }
.faq-list details { border-radius: var(--radius-card); overflow: hidden; }

@media (max-width: 900px) {
  .site-header .site-nav .menu { display: block; }
  .editable-grid, .wp-review-grid, .fuel-meta-grid { grid-template-columns: 1fr; }
  .wp-price-row { grid-template-columns: 1fr 1fr; }
  .wp-price-head { display: none; }
}

@media (max-width: 640px) {
  .wp-admin-bar-showing .site-header { top: 46px; }
  .brand img { width: 178px; }
  .wp-order-form { grid-template-columns: 1fr; }
  .wp-order-form .full { grid-column: auto; }
  .wp-price-row { grid-template-columns: 1fr; gap: 6px; }
  .callback-modal-card { padding: 26px 18px 20px; }
}

@media (max-width: 1100px) {
  .site-header .site-nav { top: 114px; }
  .site-header .site-nav .menu { width: 100%; }
  .site-header .site-nav .menu a { display: block; }
}

@media (max-width: 760px) {
  .site-header .site-nav { top: 100px; }
  .site-header .dizoil-logo-image { width: 152px; }
}

@media (max-width: 430px) {
  .site-header .dizoil-logo-image { width: 136px; }
  .site-header .nav-order { padding-inline: 9px; }
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: #fff; color: var(--ink); font-family: Arial, Helvetica, sans-serif; }
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
.container { width: min(1240px, calc(100% - 48px)); margin: 0 auto; }

/* A restrained radius system keeps the industrial identity while softening the UI. */
.btn,
.nav-order,
.location-button,
.catalog-details-btn,
.doc-list article button,
.doc-download,
.install-banner button,
.notify-button,
.refresh-button,
.admin-tabs,
.admin-tabs button,
.admin-search input,
.order-detail-head select,
.order-actions button,
.account-switch,
.account-switch button,
.modal-close,
.delivery-cities span {
  border-radius: var(--radius-control);
}

.calculator-card input:not([type="range"]),
.calculator-card select,
.contact-form input,
.contact-form textarea,
.profile-card input,
.lead-form input,
.admin-login-card input,
.admin-settings-card input {
  border-radius: var(--radius-control);
}

.fuel-card,
.case-card,
.calculator-card,
.classic-quick-card,
.classic-product,
.classic-application-grid article,
.classic-delivery-photo,
.classic-about-image,
.product-row,
.notice,
.docs-layout aside,
.doc-list article,
.legal-card,
.contact-form,
.dashboard-cards article,
.profile-card,
.cabinet-empty,
.admin-login-card,
.admin-summary,
.push-panel,
.orders-workspace,
.order-map-preview,
.admin-settings-card,
.admin-security-note,
.price-table,
.faq-aside,
.reviews-grid article,
.product-summary,
.product-fast-form,
.product-copy-grid > aside,
.delivery-steps {
  border-radius: var(--radius-card);
}

.fuel-card,
.case-card,
.classic-product,
.classic-application-grid article,
.classic-delivery-photo,
.classic-about-image,
.product-row,
.notice,
.docs-layout aside,
.legal-card,
.admin-summary,
.orders-workspace,
.price-table,
.product-summary,
.delivery-steps {
  overflow: hidden;
}

.case-image,
.quality-image,
.visual-band-image,
.classic-product-image {
  border-radius: var(--radius-media);
}

.callback-dialog {
  border-radius: var(--radius-card);
  overflow: hidden;
}

.header { position: absolute; z-index: 20; top: 0; left: 0; right: 0; color: #fff; border-bottom: 1px solid rgba(255,255,255,.16); background: rgba(5,18,35,.72); backdrop-filter: blur(16px); }
.nav { height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.brand-mark { width: 38px; height: 38px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; transform: skew(-14deg); }
.brand-mark i { display: block; background: var(--blue); }
.brand-mark i:nth-child(2) { background: var(--orange); transform: translateY(-5px); }
.brand-mark i:nth-child(3) { transform: translateY(-10px); }
.brand-name { display: flex; align-items: baseline; font-size: 17px; letter-spacing: -.7px; font-style: normal; position: relative; padding-bottom: 12px; white-space: nowrap; }
.brand-name b { font-weight: 900; }
.brand-name em { color: var(--orange); font-style: normal; font-weight: 900; }
.brand-name small { position: absolute; bottom: 0; left: 0; font-size: 6.5px; letter-spacing: 1.9px; color: #aebed0; }
.nav-links { display: flex; gap: 25px; align-items: center; font-size: 13px; font-weight: 700; }
.nav-links a { position: relative; padding: 31px 0; color: #d8e1ec; transition: .2s; }
.nav-links a:hover { color: #fff; }
.nav-links a:after { content: ""; position: absolute; left: 0; right: 100%; bottom: 0; height: 3px; background: var(--orange); transition: .2s; }
.nav-links a:hover:after { right: 0; }
.nav-actions { display: flex; align-items: center; gap: 12px; }
.phone { font-size: 13px; font-weight: 800; white-space: nowrap; }
.phone small { color: #64d59b; margin-right: 4px; font-size: 9px; }
.account { border-left: 1px solid rgba(255,255,255,.18); padding-left: 14px; font-size: 12px; font-weight: 700; white-space: nowrap; }
.nav-order { background: var(--orange); padding: 13px 18px; font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .6px; }
.menu-btn { display: none; background: none; color: #fff; border: 0; font-size: 24px; }

.hero { min-height: 820px; position: relative; color: #fff; overflow: hidden; display: flex; align-items: center; }
.hero-image { position: absolute; inset: 0; background: url("/visuals-v2/hero-dizoil-v3.jpg") center/cover no-repeat; transform: scale(1.015); }
.hero-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(2,13,27,.97) 0%, rgba(4,19,37,.89) 37%, rgba(4,19,37,.22) 68%, rgba(4,19,37,.08) 100%); }
.hero-grid { position: relative; z-index: 2; display: grid; grid-template-columns: 1.15fr .65fr; align-items: end; gap: 60px; padding-top: 120px; }
.hero-copy { max-width: 690px; }
.eyebrow, .kicker { display: inline-flex; align-items: center; gap: 10px; color: var(--blue); font-size: 11px; font-weight: 900; letter-spacing: 1.8px; }
.eyebrow { color: #d6e5f8; }
.pulse { width: 7px; height: 7px; border-radius: 50%; background: #54db94; box-shadow: 0 0 0 6px rgba(84,219,148,.13); }
.hero h1 { font-size: clamp(52px, 6vw, 86px); letter-spacing: -4.8px; line-height: .94; margin: 24px 0; font-weight: 900; text-transform: uppercase; }
.hero h1 em { color: var(--orange); font-style: normal; }
.hero-lead { font-size: 18px; line-height: 1.65; color: #c4d0de; max-width: 620px; margin: 0 0 32px; }
.hero-actions { display: flex; gap: 12px; }
.btn { min-height: 54px; padding: 0 25px; display: inline-flex; align-items: center; justify-content: center; gap: 20px; border: 0; cursor: pointer; font-weight: 900; font-size: 13px; text-transform: uppercase; letter-spacing: .6px; transition: transform .2s, background .2s; }
.btn:hover { transform: translateY(-2px); }
.btn-orange { background: var(--orange); color: #fff; box-shadow: 0 12px 30px rgba(255,107,24,.24); }
.btn-orange:hover { background: #ff7c31; }
.btn-glass { background: rgba(255,255,255,.08); color: #fff; border: 1px solid rgba(255,255,255,.3); }
.hero-proof { display: flex; margin-top: 54px; border-top: 1px solid rgba(255,255,255,.17); padding-top: 24px; gap: 0; }
.hero-proof div { padding: 0 32px; border-right: 1px solid rgba(255,255,255,.15); }
.hero-proof div:first-child { padding-left: 0; }
.hero-proof div:last-child { border: 0; }
.hero-proof strong { font-size: 23px; display: block; }
.hero-proof span { color: #9eb0c3; font-size: 10px; text-transform: uppercase; letter-spacing: .9px; }
.hero-offer { justify-self: end; width: 340px; background: rgba(5,19,37,.82); border: 1px solid rgba(255,255,255,.2); border-top: 4px solid var(--orange); backdrop-filter: blur(18px); padding: 30px; margin-bottom: 44px; box-shadow: 0 30px 70px rgba(0,0,0,.22); }
.offer-label { color: #a8b8ca; font-size: 9px; font-weight: 900; letter-spacing: 1.5px; }
.hero-offer > b { display: block; color: #fff; font-size: 82px; line-height: .9; letter-spacing: -6px; margin-top: 24px; }
.hero-offer > strong { display: block; color: var(--orange); font-size: 20px; text-transform: uppercase; letter-spacing: -.3px; margin-top: 8px; }
.hero-offer p { color: #aebdd0; font-size: 13px; line-height: 1.65; margin: 24px 0; }
.hero-offer a { border-top: 1px solid rgba(255,255,255,.14); padding-top: 19px; display: flex; justify-content: space-between; color: #fff; font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .8px; }
.hero-offer a i { color: var(--orange); font-style: normal; }
.hero-status { justify-self: end; width: 330px; background: rgba(5,19,37,.78); border: 1px solid rgba(255,255,255,.18); backdrop-filter: blur(15px); padding: 24px; margin-bottom: 46px; }
.status-top { display: flex; align-items: center; justify-content: space-between; font-size: 11px; text-transform: uppercase; color: #a9b7c7; letter-spacing: .7px; }
.status-top b { color: #66e2a2; }
.route-line { display: flex; align-items: center; padding: 23px 0 10px; color: var(--orange); }
.route-line span { height: 2px; flex: 1; margin: 0 6px; background: repeating-linear-gradient(90deg, var(--orange) 0 5px, transparent 5px 10px); }
.route-line i { font-style: normal; }
.route-row { display: flex; justify-content: space-between; color: #8fa0b5; font-size: 10px; line-height: 1.5; }
.route-row span:last-child { text-align: right; }
.route-row b { color: #fff; font-size: 13px; }
.status-bottom { display: flex; gap: 14px; border-top: 1px solid rgba(255,255,255,.12); margin-top: 22px; padding-top: 18px; }
.truck-icon { color: var(--orange); font-size: 26px; }
.status-bottom b { display: block; font-size: 12px; }
.status-bottom small { display: block; color: #8fa0b5; margin-top: 4px; }
.hero-edge { position: absolute; z-index: 2; bottom: 22px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 14px; color: #8293a8; font-size: 9px; text-transform: uppercase; letter-spacing: 1.6px; }
.hero-edge i { color: var(--orange); font-size: 18px; font-style: normal; }

.trust-strip { border-bottom: 1px solid var(--line); background: #fff; }
.trust-grid { min-height: 92px; display: grid; grid-template-columns: 1.3fr repeat(4, 1fr); align-items: center; gap: 24px; }
.trust-grid span { font-size: 10px; color: #8a96a6; text-transform: uppercase; letter-spacing: 1.1px; }
.trust-grid b { font-size: 14px; color: #7b8796; filter: grayscale(1); text-align: center; letter-spacing: -.3px; }
.advantage-strip { background: #fff; border-bottom: 1px solid var(--line); box-shadow: 0 12px 35px rgba(8,24,44,.05); }
.advantage-grid { min-height: 106px; display: grid; grid-template-columns: repeat(4, 1fr); }
.advantage-grid > div { display: flex; align-items: center; gap: 16px; padding: 22px 24px; border-right: 1px solid var(--line); }
.advantage-grid > div:last-child { border: 0; }
.advantage-grid > div > b { color: var(--orange); font-size: 10px; }
.advantage-grid span { color: #7d8b9c; font-size: 10px; line-height: 1.45; }
.advantage-grid strong { display: block; color: var(--ink); font-size: 13px; margin-bottom: 4px; }
.section { padding: 105px 0; }
.section-head { display: grid; grid-template-columns: 1.35fr .65fr; align-items: end; gap: 70px; margin-bottom: 50px; }
.section h2, .quality h2, .inner-hero h1, .cta h2 { margin: 12px 0 0; font-size: clamp(36px, 4.2vw, 58px); letter-spacing: -2.7px; line-height: 1.02; }
.section-head p { color: var(--muted); line-height: 1.7; margin: 0; font-size: 15px; }
.fuel-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.fuel-card { min-height: 385px; border: 1px solid var(--line); padding: 24px; display: flex; flex-direction: column; position: relative; overflow: hidden; transition: .25s; background: #fff; }
.fuel-card:hover { transform: translateY(-7px); border-color: #a5b4c5; box-shadow: 0 25px 60px rgba(20,39,66,.11); }
.fuel-card:before { content: ""; position: absolute; inset: auto -50px -100px; height: 230px; background: radial-gradient(circle, color-mix(in srgb, var(--accent) 22%, transparent) 0%, transparent 68%); }
.fuel-card.blue { --accent: #1167e8; } .fuel-card.orange { --accent: #ff6b18; } .fuel-card.violet { --accent: #6b47e8; } .fuel-card.cyan { --accent: #00a7c6; }
.fuel-card-top { display: flex; justify-content: space-between; align-items: center; }
.fuel-card-top span { background: color-mix(in srgb, var(--accent) 12%, white); color: var(--accent); padding: 7px 9px; font-size: 8px; font-weight: 900; letter-spacing: 1px; }
.fuel-card-top i { font-style: normal; color: #ccd4de; font-size: 12px; }
.fuel-technical { margin: 34px 0 28px; min-height: 114px; padding: 17px 18px; position: relative; overflow: hidden; border: 1px solid color-mix(in srgb, var(--accent) 30%, #d6dee8); border-left: 5px solid var(--accent); background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 7%, white), #fff 72%); }
.fuel-technical:after { content: ""; position: absolute; right: -26px; top: -28px; width: 105px; height: 150px; transform: skew(-18deg); border-left: 1px solid color-mix(in srgb, var(--accent) 20%, white); background: repeating-linear-gradient(0deg, transparent 0 10px, color-mix(in srgb, var(--accent) 8%, white) 10px 11px); }
.fuel-technical > span, .fuel-technical > small { display: block; position: relative; z-index: 1; color: #8492a3; font-size: 7px; font-weight: 900; letter-spacing: 1.4px; }
.fuel-technical > b { display: block; position: relative; z-index: 1; color: var(--accent); font-size: 25px; letter-spacing: -1px; margin: 10px 0 13px; }
.fuel-technical > div { display: flex; position: relative; z-index: 1; gap: 4px; margin-bottom: 8px; }
.fuel-technical > div i { display: block; height: 4px; background: var(--accent); }
.fuel-technical > div i:nth-child(1) { width: 62px; }
.fuel-technical > div i:nth-child(2) { width: 27px; opacity: .58; }
.fuel-technical > div i:nth-child(3) { width: 10px; opacity: .25; }
.fuel-card h3 { font-size: 20px; margin: 0 0 8px; letter-spacing: -.5px; }
.fuel-card p { color: var(--muted); font-size: 12px; margin: 0; }
.fuel-spec { border-top: 1px solid var(--line); display: flex; justify-content: space-between; margin-top: auto; padding-top: 18px; font-size: 9px; }
.fuel-spec span { color: #7e8c9e; }
.fuel-spec b { color: var(--accent); }
.diesel-catalog { background: linear-gradient(180deg, #fff 0%, #f6f9fc 100%); }
.fuel-card > .product-code { margin-bottom: 7px; }

.visual-band { background: var(--navy); color: #fff; padding: 0; overflow: hidden; }
.visual-band-grid { width: 100%; max-width: 1440px; display: grid; grid-template-columns: 1.2fr .8fr; min-height: 590px; }
.visual-band-image { background: linear-gradient(90deg, transparent 72%, var(--navy)), url("/visuals-v2/warehouse-logistics.jpg") center/cover no-repeat; min-height: 590px; }
.visual-band-copy { padding: 90px 70px 70px; align-self: center; max-width: 600px; }
.visual-band-copy h2 { font-size: clamp(40px, 4.2vw, 61px); line-height: .98; letter-spacing: -3px; margin: 16px 0 25px; }
.visual-band-copy > p { color: #aebdce; line-height: 1.72; font-size: 15px; }
.mini-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 32px 0; }
.mini-stats div { border-top: 1px solid #31445b; padding-top: 14px; }
.mini-stats b { display: block; color: #fff; font-size: 21px; }
.mini-stats span { color: #7f92a8; font-size: 9px; text-transform: uppercase; letter-spacing: .8px; }

.use-cases { background: #fff; }
.case-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.case-card { background: #fff; border: 1px solid var(--line); transition: .25s; overflow: hidden; }
.case-card:hover { transform: translateY(-6px); box-shadow: 0 25px 60px rgba(20,39,66,.12); }
.case-image { min-height: 265px; background-position: center; background-size: cover; position: relative; }
.case-image:after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(5,16,30,.55)); }
.case-image span { position: absolute; z-index: 1; left: 20px; bottom: 18px; width: 35px; height: 35px; display: grid; place-items: center; background: var(--orange); color: #fff; font-size: 10px; font-weight: 900; }
.case-card > div:last-child { padding: 25px; }
.case-card h3 { margin: 0 0 10px; font-size: 25px; letter-spacing: -1px; }
.case-card p { color: var(--muted); min-height: 42px; line-height: 1.6; font-size: 12px; }
.case-card a { color: var(--blue); font-size: 10px; font-weight: 900; text-transform: uppercase; }
.application-row { margin-top: 16px; display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--line); }
.application-row span { min-height: 68px; display: grid; place-items: center; border-right: 1px solid var(--line); color: #6d7d90; font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .8px; }
.application-row span:last-child { border: 0; }

.calculator-section { padding: 105px 0; background: var(--navy); color: #fff; position: relative; overflow: hidden; }
.calculator-section:before { content: ""; position: absolute; width: 600px; height: 600px; background: radial-gradient(circle, rgba(17,103,232,.3), transparent 65%); left: -250px; top: -250px; }
.calculator-shell { position: relative; display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; align-items: center; }
.kicker.light { color: #74aaf7; }
.calculator-copy h2 { font-size: clamp(38px, 4vw, 58px); line-height: 1.02; letter-spacing: -2.5px; margin: 15px 0 24px; }
.calculator-copy > p { color: #aab9ca; line-height: 1.7; }
.calculator-copy ul { padding: 0; margin: 30px 0 0; list-style: none; display: grid; gap: 14px; }
.calculator-copy li { font-size: 13px; color: #d5deea; }
.calculator-copy li b { color: #59d699; margin-right: 10px; }
.calculator-card { background: #fff; color: var(--ink); padding: 34px; display: grid; gap: 22px; box-shadow: 0 35px 80px rgba(0,0,0,.25); }
.calculator-card label, .profile-card label { font-size: 10px; color: #66758a; font-weight: 900; text-transform: uppercase; letter-spacing: .8px; }
.calculator-card label > strong { float: right; color: var(--ink); font-size: 14px; }
.calculator-card select, .calculator-card input, .contact-form input, .contact-form textarea, .profile-card input { width: 100%; border: 1px solid #d7dfe8; background: #f8fafc; min-height: 52px; padding: 0 15px; color: var(--ink); outline: none; margin-top: 8px; text-transform: none; letter-spacing: 0; font-weight: 500; font-size: 14px; }
.calculator-card select:focus, .calculator-card input:focus, .contact-form input:focus, .contact-form textarea:focus, .profile-card input:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(17,103,232,.09); }
.calculator-card input[type="range"] { padding: 0; min-height: 20px; border: 0; background: transparent; accent-color: var(--orange); }
.range-labels { display: flex; justify-content: space-between; color: #9ca8b7; }
.estimate { background: #edf4ff; border-left: 4px solid var(--blue); padding: 18px; display: flex; align-items: center; justify-content: space-between; }
.estimate span { font-size: 11px; font-weight: 800; }
.estimate small { display: block; color: #7d8ea4; margin-top: 3px; font-weight: 400; }
.estimate b { font-size: 24px; color: var(--blue); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.calculator-card .btn { width: 100%; }
.privacy { text-align: center; color: #909aaa; font-size: 9px; }
.calculator-card.success, .contact-form.success { min-height: 390px; text-align: center; place-content: center; }
.success > span { width: 64px; height: 64px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #24b878; font-size: 26px; margin: 0 auto; }
.success h3 { font-size: 28px; margin: 10px 0 0; }
.success p { color: var(--muted); line-height: 1.6; }
.success button { color: var(--blue); border: 0; background: none; font-weight: 800; cursor: pointer; }
.order-form { gap: 17px; }
.order-form-head { display: flex; align-items: start; justify-content: space-between; border-bottom: 1px solid var(--line); padding-bottom: 17px; }
.order-form-head span { color: var(--orange); font-size: 9px; font-weight: 900; letter-spacing: 1.2px; }
.order-form-head h3 { margin: 6px 0 0; font-size: 25px; letter-spacing: -1px; }
.order-form-head > b { color: #d7dee7; font-size: 30px; }
.account-switch.compact { width: 100%; }
.account-switch.compact button { flex: 1; }
.address-field { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 10px; }
.location-button { min-height: 52px; border: 1px solid #cbd7e4; background: #fff; color: var(--blue); padding: 0 14px; font-size: 10px; font-weight: 900; cursor: pointer; white-space: nowrap; }
.location-button.ready { border-color: #69c99b; color: #168957; background: #effbf5; }
.location-button.error { color: #b64a3f; }
.estimate.no-price b { font-size: 15px; text-align: right; max-width: 170px; }
.honeypot { position: absolute !important; left: -10000px !important; opacity: 0 !important; pointer-events: none !important; }
.form-error { color: #c64034; background: #fff0ef; margin: 0; padding: 10px 13px; font-size: 11px; }
.order-success > small { color: var(--orange); font-weight: 900; letter-spacing: 1px; margin-top: 5px; }
.order-success > a { color: var(--blue); font-weight: 900; font-size: 13px; }

.process { background: var(--paper); }
.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: #ccd6e1; border: 1px solid #ccd6e1; }
.step { background: var(--paper); padding: 34px; min-height: 250px; position: relative; }
.step:after { content: "→"; position: absolute; top: 31px; right: -10px; z-index: 1; width: 20px; height: 20px; display: grid; place-items: center; color: var(--orange); background: var(--paper); }
.step:last-child:after { display: none; }
.step > b { color: var(--orange); font-size: 12px; }
.step h3 { font-size: 22px; margin: 55px 0 10px; }
.step p { color: var(--muted); line-height: 1.6; font-size: 13px; }
.quality { padding: 110px 0; background: #0a1b31; color: #fff; }
.quality-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 90px; align-items: center; }
.quality-art { min-height: 450px; display: grid; place-items: center; background: radial-gradient(circle, rgba(17,103,232,.48), transparent 57%), repeating-linear-gradient(0deg, transparent 0 35px, rgba(255,255,255,.03) 35px 36px), repeating-linear-gradient(90deg, transparent 0 35px, rgba(255,255,255,.03) 35px 36px); }
.quality-image { min-height: 480px; background: linear-gradient(90deg, transparent 65%, rgba(10,27,49,.75)), url("/visuals-v2/catalog-euro5.jpg") center/cover no-repeat; border: 1px solid rgba(255,255,255,.08); }
.quality-ring { width: 245px; height: 245px; border: 2px solid #4f8ee9; border-radius: 50%; display: grid; place-content: center; text-align: center; box-shadow: 0 0 0 25px rgba(17,103,232,.11), 0 0 0 52px rgba(17,103,232,.05); }
.quality-ring b { font-size: 82px; letter-spacing: -6px; }
.quality-ring span { color: var(--orange); font-weight: 900; letter-spacing: 4px; }
.quality-copy > p { color: #aebdcd; line-height: 1.7; max-width: 680px; }
.quality-points { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin: 35px 0; }
.quality-points > div { border-top: 1px solid #31445b; padding-top: 15px; display: flex; gap: 13px; }
.quality-points > div > b { color: var(--orange); font-size: 10px; }
.quality-points span { color: #8395aa; font-size: 10px; line-height: 1.5; }
.quality-points strong { color: #fff; display: block; font-size: 12px; margin-bottom: 4px; }
.text-link { color: var(--orange); font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .8px; }
.winter-feature { min-height: 580px; display: flex; align-items: center; background: linear-gradient(90deg, rgba(5,18,35,.97) 0%, rgba(5,18,35,.84) 42%, rgba(5,18,35,.12) 72%), url("/visuals-v2/catalog-winter.jpg") center/cover no-repeat; color: #fff; }
.winter-grid { display: grid; grid-template-columns: .55fr .45fr; }
.winter-grid > div { padding: 35px 0; }
.winter-grid h2 { font-size: clamp(40px, 4.5vw, 64px); line-height: 1; letter-spacing: -3px; margin: 16px 0 24px; }
.winter-grid p { color: #bdc9d8; max-width: 590px; line-height: 1.7; margin-bottom: 30px; }
.faq-section { background: var(--paper); }
.faq-grid { display: grid; grid-template-columns: .55fr 1fr; gap: 100px; }
.faq-grid h2 { margin-bottom: 20px; }
.faq-grid > div:first-child > p { color: var(--muted); line-height: 1.7; }
.footer-phone.dark { display: inline-block; color: var(--ink); margin-top: 15px; }
.faq-list { border-top: 1px solid #ccd5df; }
.faq-list details { border-bottom: 1px solid #ccd5df; padding: 22px 0; }
.faq-list summary { cursor: pointer; list-style: none; font-size: 17px; font-weight: 900; display: flex; justify-content: space-between; gap: 20px; }
.faq-list summary:after { content: "+"; color: var(--orange); font-size: 22px; font-weight: 400; }
.faq-list details[open] summary:after { content: "−"; }
.faq-list p { color: var(--muted); line-height: 1.65; font-size: 13px; max-width: 730px; margin: 15px 35px 0 0; }
.cta-section { padding-top: 60px; }
.cta { background: var(--blue); color: #fff; padding: 54px 60px; display: flex; justify-content: space-between; align-items: center; position: relative; overflow: hidden; }
.cta:after { content: "ДО"; position: absolute; right: 25%; font-size: 180px; font-weight: 900; color: rgba(255,255,255,.04); }
.cta > * { position: relative; z-index: 1; }
.cta > div > span { font-size: 10px; letter-spacing: 1.8px; font-weight: 900; color: #b9d5ff; }
.cta h2 { font-size: 40px; }

.footer { background: #050f1d; color: #91a1b5; padding: 70px 0 25px; }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: 60px; }
.footer-brand { color: #fff; margin-bottom: 20px; }
.footer-grid > div { display: flex; flex-direction: column; gap: 12px; font-size: 12px; }
.footer-grid > div:first-child p { max-width: 270px; line-height: 1.6; }
.footer-grid > div > b { color: #fff; font-size: 10px; letter-spacing: 1.5px; margin-bottom: 8px; }
.footer-grid a:hover { color: #fff; }
.footer-phone { color: #fff; font-size: 17px; font-weight: 900; }
.footer-bottom { border-top: 1px solid #1d2a3b; margin-top: 45px; padding-top: 22px; display: flex; justify-content: space-between; font-size: 9px; }

.inner-hero { background: radial-gradient(circle at 80% 20%, #173f70, transparent 35%), var(--navy); color: #fff; padding: 175px 0 75px; min-height: 405px; display: flex; align-items: end; position: relative; overflow: hidden; }
.inner-hero:after { content: none; }
.inner-brand-watermark { position: absolute; right: 18px; bottom: -28px; width: 360px; height: 255px; overflow: hidden; opacity: .045; pointer-events: none; }
.inner-brand-watermark img { display: block; height: 255px; width: auto; max-width: none; filter: grayscale(1) brightness(2.8); }
.inner-hero .container { position: relative; z-index: 1; }
.inner-hero h1 { font-size: clamp(48px, 6vw, 78px); max-width: 900px; text-transform: uppercase; }

/* Variant 2: structure inspired by the previous company site, with Dizoil branding. */
.classic-hero { min-height: 760px; padding: 165px 0 72px; position: relative; color: #fff; background: #071a33 url("/visuals-v2/hero-dizoil-v3.jpg") center/cover no-repeat; overflow: hidden; }
.classic-hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(3,15,31,.97) 0%, rgba(3,15,31,.85) 43%, rgba(3,15,31,.12) 73%), linear-gradient(0deg, rgba(3,15,31,.48), transparent 50%); }
.classic-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0,1fr) 410px; gap: 65px; align-items: center; }
.classic-hero-copy { max-width: 725px; }
.classic-chip { display: inline-flex; border-left: 3px solid var(--orange); background: rgba(255,255,255,.08); padding: 9px 13px; font-size: 10px; font-weight: 900; letter-spacing: 1.3px; }
.classic-hero h1 { margin: 24px 0; font-size: clamp(46px,5.2vw,76px); line-height: .98; letter-spacing: -4px; text-transform: uppercase; }
.classic-hero h1 em { color: #fff; font-style: normal; }
.classic-hero-copy > p { max-width: 670px; color: #c6d1df; font-size: 16px; line-height: 1.7; }
.classic-hero-copy > .hero-actions { margin-top: 8px; }
.classic-hero-stats { display: grid; grid-template-columns: repeat(3,1fr); max-width: 690px; margin-top: 42px; border-top: 1px solid rgba(255,255,255,.2); }
.classic-hero-stats div { padding: 18px 18px 0 0; }
.classic-hero-stats b { display: block; font-size: 22px; }
.classic-hero-stats span { display: block; color: #91a3b9; margin-top: 5px; font-size: 10px; text-transform: uppercase; }
.classic-quick-card { align-self: end; background: #fff; color: var(--ink); padding: 34px; box-shadow: 0 35px 90px rgba(0,0,0,.36); border-top: 5px solid var(--orange); }
.classic-quick-card > span { color: var(--orange); font-size: 9px; font-weight: 900; letter-spacing: 1.3px; }
.classic-quick-card h2 { margin: 8px 0 5px; font-size: 31px; letter-spacing: -1.5px; }
.classic-quick-card > p { color: var(--muted); font-size: 12px; line-height: 1.55; margin: 0 0 18px; }
.classic-quick-card .lead-form { display: grid; grid-template-columns: 1fr; }
.classic-quick-card .lead-form label { width: 100%; }
.classic-quick-card .lead-form label span { color: #66758a; }
.classic-quick-card .lead-form input { border: 1px solid #d9e0e8; background: #f7f9fb; color: var(--ink); }
.classic-quick-card .lead-form .btn { width: 100%; }
.classic-quick-card .lead-form small { color: #8491a0; }

.classic-benefits { background: #fff; border-bottom: 1px solid var(--line); box-shadow: 0 14px 35px rgba(8,24,44,.06); }
.classic-benefit-grid { display: grid; grid-template-columns: repeat(4,1fr); }
.classic-benefit-grid article { min-height: 135px; display: flex; gap: 16px; align-items: center; padding: 26px 22px; border-right: 1px solid var(--line); }
.classic-benefit-grid article:last-child { border-right: 0; }
.classic-benefit-grid article > b { color: var(--orange); font-size: 11px; }
.classic-benefit-grid h3 { margin: 0 0 6px; font-size: 15px; }
.classic-benefit-grid p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.classic-section-head { display: grid; grid-template-columns: 1.2fr .8fr; align-items: end; gap: 80px; margin-bottom: 45px; }
.classic-section-head h2 { margin: 12px 0 0; font-size: clamp(38px,4.3vw,60px); line-height: 1; letter-spacing: -3px; }
.classic-section-head > p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.75; }
.classic-product-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 20px; }
.classic-product { display: grid; grid-template-columns: .9fr 1.1fr; min-height: 370px; background: #fff; border: 1px solid var(--line); transition: .25s; }
.classic-product:hover { transform: translateY(-5px); box-shadow: 0 25px 55px rgba(9,29,53,.12); }
.classic-product-image { padding: 24px; color: #fff; display: flex; flex-direction: column; justify-content: space-between; background-size: cover; background-position: center; }
.classic-product-image > span { align-self: start; background: var(--orange); padding: 7px 9px; font-size: 8px; font-weight: 900; letter-spacing: 1px; }
.classic-product-image h3 { margin: 0; font-size: 28px; line-height: 1.05; letter-spacing: -1.4px; }
.classic-product-body { padding: 28px; display: flex; flex-direction: column; }
.classic-product-body > p { color: var(--muted); font-size: 12px; line-height: 1.65; }
.classic-product-body ul { padding: 0; list-style: none; display: grid; gap: 9px; font-size: 11px; }
.classic-product-body li:before { content: "✓"; color: var(--orange); margin-right: 8px; font-weight: 900; }
.classic-product-body > div { margin-top: auto; display: flex; justify-content: space-between; padding-top: 18px; border-top: 1px solid var(--line); }
.classic-product-body a { color: var(--blue); font-size: 10px; font-weight: 900; text-transform: uppercase; }
.classic-product-body a:last-child { color: var(--orange); }
.classic-price { background: #f4f7fb; }
.classic-price-note { display: flex; justify-content: space-between; align-items: center; margin-top: 22px; color: var(--muted); font-size: 11px; }
.classic-price-note a { color: var(--blue); font-weight: 900; text-transform: uppercase; }
.classic-application-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.classic-application-grid article { min-height: 330px; position: relative; overflow: hidden; background: var(--navy); color: #fff; }
.classic-application-grid article > div { position: absolute; inset: 0; background-size: cover; background-position: center; transition: .4s; opacity: .72; }
.classic-application-grid article:after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(4,16,32,.96),rgba(4,16,32,.05) 75%); }
.classic-application-grid article:hover > div { transform: scale(1.04); }
.classic-application-grid article > span { position: absolute; z-index: 1; left: 25px; right: 25px; bottom: 22px; }
.classic-application-grid h3 { margin: 0 0 7px; font-size: 22px; }
.classic-application-grid p { margin: 0; color: #bcc8d6; font-size: 11px; line-height: 1.55; }
.classic-delivery { padding: 0; background: var(--navy); color: #fff; }
.classic-delivery-grid { width: 100%; max-width: 1440px; display: grid; grid-template-columns: 1.1fr .9fr; min-height: 670px; }
.classic-delivery-photo { position: relative; overflow: hidden; background: linear-gradient(90deg,transparent 72%,var(--navy)),url("/visuals-v2/moscow-region-map.jpg") center/cover no-repeat; }
.map-brand-mark { position: absolute; left: 42px; bottom: 38px; width: 220px; height: 150px; overflow: hidden; opacity: .82; }
.map-brand-mark img { display: block; height: 150px; width: auto; max-width: none; filter: drop-shadow(0 10px 25px rgba(0,0,0,.28)); }
.classic-delivery-grid > div:last-child { padding: 75px 65px; align-self: center; }
.classic-delivery h2 { font-size: clamp(40px,4.2vw,60px); letter-spacing: -3px; line-height: 1; margin: 14px 0 22px; }
.classic-delivery p { color: #afbdcd; font-size: 13px; line-height: 1.7; }
.classic-timing { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin: 28px 0 32px; }
.classic-timing div { border-top: 1px solid #31445b; padding-top: 13px; }
.classic-timing b,.classic-timing span { display: block; }
.classic-timing span { color: #8da0b6; font-size: 10px; margin-top: 5px; }
.classic-delivery h3 { margin: 0 0 10px; }
.classic-delivery ol { color: #bdc8d5; padding-left: 20px; font-size: 12px; line-height: 2; margin-bottom: 28px; }
.classic-proof { background: #fff; }
.classic-proof-grid { display: grid; grid-template-columns: repeat(4,1fr); border: 1px solid var(--line); border-radius: var(--radius-card); overflow: hidden; background: #fff; }
.classic-proof-grid article { padding: 30px; min-height: 235px; border-right: 1px solid var(--line); }
.classic-proof-grid article:last-child { border-right: 0; }
.classic-proof-grid > article > b { color: var(--orange); font-size: 10px; }
.classic-proof-grid h3 { margin: 50px 0 10px; font-size: 20px; }
.classic-proof-grid p { color: var(--muted); font-size: 12px; line-height: 1.65; }
.classic-reviews { padding: 100px 0; background: #071a32; color: #fff; }
.classic-section-head.light a { color: var(--orange); font-size: 11px; font-weight: 900; text-transform: uppercase; }
.classic-review-carousel { min-width: 0; }
.classic-review-grid { display: flex; gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: #36506e transparent; overscroll-behavior-inline: contain; padding-bottom: 10px; }
.classic-review-grid blockquote { flex: 0 0 calc((100% - 36px) / 3); scroll-snap-align: start; margin: 0; min-height: 235px; padding: 30px; border: 1px solid #263b53; border-radius: var(--radius-card); color: #d5deea; font-size: 14px; line-height: 1.75; }
.classic-review-grid cite { display: block; margin-top: 28px; color: #7e94ad; font-size: 11px; font-style: normal; }
.classic-review-controls { margin-top: 18px; display: flex; align-items: center; justify-content: flex-end; gap: 12px; }
.classic-review-controls button { width: 44px; height: 44px; border: 1px solid #304760; border-radius: var(--radius-control); background: #0d2642; color: #fff; cursor: pointer; font-size: 18px; transition: .2s; }
.classic-review-controls button:hover { border-color: var(--orange); background: var(--orange); }
.classic-review-controls span { color: #7188a1; font-size: 9px; font-weight: 900; text-transform: uppercase; letter-spacing: .8px; }
.classic-about-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 80px; align-items: center; }
.classic-about-grid h2 { font-size: clamp(40px,4.2vw,58px); line-height: 1; letter-spacing: -3px; margin: 15px 0 25px; }
.classic-about-grid p { color: var(--muted); font-size: 14px; line-height: 1.8; margin-bottom: 28px; }
.classic-about-image { min-height: 500px; background: linear-gradient(0deg,rgba(6,24,47,.18),rgba(6,24,47,.02)),url("/visuals-v2/about-dispatch.jpg") center/cover no-repeat; box-shadow: 28px 28px 0 #f0f4f8; }
.classic-faq { background: #f4f7fb; }
.classic-faq-grid { display: grid; grid-template-columns: .55fr 1fr; gap: 90px; }
.classic-faq-grid h2 { font-size: 48px; letter-spacing: -2.5px; margin: 14px 0; }
.classic-faq-grid > div:first-child p { color: var(--muted); }
.classic-faq-grid > div:first-child a { display: inline-block; margin-top: 20px; color: var(--ink); font-size: 21px; font-weight: 900; }
.classic-final { padding: 65px 0; background: #0f67dd; color: #fff; }
.classic-final .container { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.classic-final span { color: #b9d6ff; font-size: 9px; font-weight: 900; letter-spacing: 1.4px; }
.classic-final h2 { font-size: 43px; margin: 8px 0 5px; letter-spacing: -2px; }
.classic-final p { margin: 0; color: #d4e5fb; }

@media (max-width: 1050px) {
  .classic-hero-grid { grid-template-columns: 1fr; }
  .classic-quick-card { max-width: 700px; align-self: auto; }
  .classic-product-grid { grid-template-columns: 1fr; }
  .classic-delivery-grid { grid-template-columns: 1fr; }
  .classic-delivery-photo { min-height: 470px; background-image: linear-gradient(0deg,var(--navy),transparent 38%),url("/visuals-v2/moscow-region-map.jpg"); }
  .classic-benefit-grid,.classic-proof-grid { grid-template-columns: repeat(2,1fr); }
  .classic-application-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 720px) {
  .classic-hero { padding-top: 120px; background-position: 64% center; }
  .classic-hero-shade { background: linear-gradient(90deg,rgba(3,15,31,.97),rgba(3,15,31,.68)),linear-gradient(0deg,rgba(3,15,31,.7),transparent); }
  .classic-hero-grid { gap: 35px; }
  .classic-hero h1 { font-size: 43px; letter-spacing: -2.6px; }
  .classic-hero-stats { grid-template-columns: 1fr; }
  .classic-quick-card { padding: 25px 20px; }
  .classic-benefit-grid,.classic-proof-grid,.classic-application-grid { grid-template-columns: 1fr; }
  .classic-review-grid blockquote { flex-basis: 86%; }
  .classic-review-controls { justify-content: space-between; }
  .classic-benefit-grid article,.classic-proof-grid article { border-right: 0; border-bottom: 1px solid var(--line); }
  .classic-proof-grid article:last-child { border-bottom: 0; }
  .classic-section-head,.classic-about-grid,.classic-faq-grid { grid-template-columns: 1fr; gap: 25px; }
  .classic-product { grid-template-columns: 1fr; }
  .classic-product-image { min-height: 290px; }
  .classic-price-note,.classic-final .container { align-items: flex-start; flex-direction: column; }
  .classic-delivery-grid > div:last-child { padding: 55px 22px; }
  .classic-delivery-photo { min-height: 340px; }
  .classic-timing { grid-template-columns: 1fr; }
  .classic-about-image { min-height: 330px; box-shadow: 12px 12px 0 #f0f4f8; }
  .inner-brand-watermark { right: 14px; bottom: -18px; width: 265px; height: 175px; }
  .inner-brand-watermark img { height: 175px; }
  .map-brand-mark { left: 20px; bottom: 20px; width: 150px; height: 100px; }
  .map-brand-mark img { height: 100px; }
}
.inner-hero p { max-width: 720px; color: #b3c1d0; line-height: 1.65; font-size: 17px; }
.catalog-toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 25px; font-size: 12px; color: var(--muted); }
.product-list { border-top: 1px solid var(--line); }
.product-row { display: grid; grid-template-columns: 50px 1.5fr 1fr .7fr; gap: 30px; align-items: center; min-height: 190px; border-bottom: 1px solid var(--line); transition: .2s; }
.product-row:hover { padding-left: 14px; background: #f8fafc; }
.product-no { color: #aeb8c5; font-size: 11px; }
.product-code { color: var(--blue); font-size: 9px; font-weight: 900; letter-spacing: 1.1px; }
.product-row.orange .product-code { color: var(--orange); } .product-row.violet .product-code { color: #6b47e8; } .product-row.cyan .product-code { color: #009ab8; }
.product-row h2 { font-size: 27px; margin: 8px 0; letter-spacing: -1px; }
.product-row p { color: var(--muted); font-size: 12px; margin: 0; }
.product-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.product-meta span { color: #8996a6; font-size: 9px; text-transform: uppercase; }
.product-meta b { display: block; color: var(--ink); font-size: 12px; margin-top: 7px; text-transform: none; }
.product-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 13px; font-size: 10px; font-weight: 800; }
.catalog-details-btn { min-width: 128px; min-height: 46px; padding: 0 16px; display: inline-flex; align-items: center; justify-content: space-between; gap: 16px; color: #fff; background: var(--blue); border: 1px solid var(--blue); font-size: 10px; font-weight: 900; text-transform: uppercase; letter-spacing: .65px; transition: .2s; }
.catalog-details-btn:hover { background: #0754bd; border-color: #0754bd; transform: translateX(3px); }
.catalog-details-btn span { color: #cfe2ff; font-size: 15px; }
.notice { margin-top: 40px; background: var(--navy); color: #fff; padding: 30px 35px; display: grid; grid-template-columns: .7fr 1.5fr .5fr; align-items: center; gap: 30px; }
.notice span { color: #a7b6c7; font-size: 12px; }
.notice a { color: var(--orange); font-weight: 900; font-size: 11px; text-transform: uppercase; text-align: right; }
.notice-callback-button { border: 0; background: none; color: var(--orange); font-weight: 900; font-size: 11px; text-transform: uppercase; text-align: right; cursor: pointer; }
.feature-grid, .values { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); border-radius: var(--radius-card); overflow: hidden; background: #fff; }
.feature-grid article, .values article { padding: 35px; min-height: 245px; border-right: 1px solid var(--line); }
.feature-grid article:last-child, .values article:last-child { border-right: 0; }
.feature-grid span, .values span { color: var(--orange); font-size: 11px; font-weight: 900; }
.feature-grid h3, .values h3 { font-size: 23px; margin: 60px 0 12px; }
.feature-grid p, .values p { color: var(--muted); line-height: 1.6; font-size: 13px; }
.delivery-map { margin-top: 60px; background: var(--paper); display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; padding: 55px; }
.delivery-equipment-photo { min-height: 430px; border-radius: var(--radius-media); background: linear-gradient(0deg, rgba(5,20,38,.08), rgba(5,20,38,0)), url("/visuals-v2/tanker-equipment-v1.png") center/cover no-repeat; box-shadow: 0 22px 50px rgba(9,31,55,.12); }
.radar { min-height: 430px; position: relative; display: grid; place-items: center; overflow: hidden; background: #0a1d36; }
.radar i { position: absolute; border: 1px solid rgba(68,140,236,.5); border-radius: 50%; }
.radar i:nth-child(1) { width: 130px; height: 130px; } .radar i:nth-child(2) { width: 270px; height: 270px; } .radar i:nth-child(3) { width: 430px; height: 430px; }
.radar:after, .radar:before { content: ""; position: absolute; background: rgba(68,140,236,.25); }
.radar:after { width: 100%; height: 1px; } .radar:before { width: 1px; height: 100%; }
.radar b { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: var(--orange); z-index: 1; }
.delivery-map h2 { font-size: 44px; letter-spacing: -2px; }
.delivery-map ul { list-style: none; padding: 0; margin: 25px 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; color: var(--muted); font-size: 12px; }
.delivery-map li:before { content: "✓"; color: #20ae72; margin-right: 9px; font-weight: 900; }
.payment-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 20px; }
.payment-grid > div { padding: 35px; border: 1px solid var(--line); }
.payment-grid span { color: var(--blue); font-size: 9px; font-weight: 900; letter-spacing: 1px; }
.payment-grid h3 { font-size: 24px; }
.payment-grid p { color: var(--muted); line-height: 1.6; font-size: 13px; }
.docs-layout { display: grid; grid-template-columns: 230px 1fr; gap: 60px; }
.docs-layout aside { display: flex; flex-direction: column; gap: 16px; padding-right: 30px; border-right: 1px solid var(--line); font-size: 12px; color: var(--muted); }
.docs-layout aside b { color: var(--ink); font-size: 10px; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 5px; }
.docs-layout aside a:hover { color: var(--blue); }
.doc-list article { display: grid; grid-template-columns: 58px 1fr 44px; align-items: center; gap: 20px; border-bottom: 1px solid var(--line); padding: 22px 0; }
.doc-icon { width: 50px; height: 58px; display: grid; place-items: center; background: #eef4fc; color: var(--blue); font-size: 10px; font-weight: 900; border-top: 4px solid var(--blue); }
.doc-list article span { font-size: 8px; color: var(--blue); font-weight: 900; text-transform: uppercase; }
.doc-list article h3 { margin: 5px 0; font-size: 16px; }
.doc-list article small { color: #8d99a8; font-size: 9px; }
.doc-list article button, .doc-download { width: 42px; height: 42px; border: 1px solid var(--line); background: #fff; color: var(--blue); cursor: pointer; display: grid; place-items: center; }
.legal-card { background: var(--navy); color: #fff; margin-top: 50px; padding: 40px; }
.legal-card h2 { font-size: 30px; }
.legal-card > div { display: grid; grid-template-columns: 1fr 1fr; color: #a9b8c8; line-height: 1.6; font-size: 12px; }
.legal-card > small { display: block; border-top: 1px solid #2d3b4f; margin-top: 20px; padding-top: 15px; color: #6f8196; }
.big-stats { display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 1px solid var(--line); padding-bottom: 65px; }
.big-stats div { border-right: 1px solid var(--line); text-align: center; }
.big-stats div:last-child { border: 0; }
.big-stats b { display: block; font-size: 48px; letter-spacing: -2px; color: var(--blue); }
.big-stats span { color: var(--muted); font-size: 10px; text-transform: uppercase; }
.story { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; padding: 80px 0; }
.story h2 { font-size: 42px; }
.story p { color: var(--muted); line-height: 1.75; }
.contact-grid { display: grid; grid-template-columns: .65fr 1.35fr; gap: 80px; }
.contact-list { display: grid; gap: 35px; align-content: start; }
.contact-list > div { border-bottom: 1px solid var(--line); padding-bottom: 28px; display: flex; flex-direction: column; gap: 9px; }
.contact-list span { color: var(--blue); font-size: 9px; font-weight: 900; letter-spacing: 1.3px; }
.contact-list a:first-of-type { font-size: 25px; font-weight: 900; }
.contact-list p { color: var(--muted); line-height: 1.7; }
.messenger-row { display: flex; gap: 9px; margin-top: 5px; }
.messenger-row a { min-height: 46px; padding: 0 17px 0 8px; display: inline-flex; align-items: center; gap: 9px; color: var(--ink); background: #fff; border: 1px solid var(--line); font-size: 11px !important; font-weight: 900; box-shadow: 0 8px 24px rgba(7,20,38,.06); }
.messenger-row a > img { width: 30px; height: 30px; }
.messenger-row a.max i { width: 30px; height: 30px; display: block; overflow: hidden; border-radius: 50%; background: #0d001a; padding: 6px; }
.messenger-row a.max i img { display: block; width: 74px; height: auto; max-width: none; }
.contact-form { background: var(--paper); padding: 45px; display: grid; gap: 16px; }
.contact-form h2 { margin: 5px 0 18px; }
.contact-form textarea { min-height: 130px; padding-top: 15px; resize: vertical; }
.contact-form small { color: #8a96a5; text-align: center; font-size: 9px; }

.cabinet-page { background: var(--paper); min-height: 100vh; }
.cabinet-page .header { position: relative; background: var(--navy); }
.cabinet-head { background: var(--navy); color: #fff; padding: 65px 0 55px; }
.cabinet-head .container { display: flex; align-items: end; justify-content: space-between; }
.cabinet-head span { color: #74aaf7; font-size: 9px; font-weight: 900; letter-spacing: 1.5px; }
.cabinet-head h1 { margin: 10px 0; font-size: 40px; }
.cabinet-head p { color: #9fb0c3; margin: 0; }
.cabinet-head a { font-size: 11px; color: #b8c5d4; }
.cabinet-head .cabinet-demo-badge { padding: 10px 14px; border: 1px solid rgba(255,255,255,.22); color: #ff8a47; font-size: 9px; font-weight: 900; letter-spacing: 1.1px; }
.cabinet-head-actions { display: flex; align-items: center; gap: 20px; }
.cabinet-section { min-height: 650px; }
.cabinet-layout { display: grid; grid-template-columns: 245px 1fr; gap: 35px; align-items: start; }
.cabinet-nav { display: flex; flex-direction: column; background: #fff; height: fit-content; border: 1px solid var(--line); }
.cabinet-nav-title { padding: 19px 20px; background: var(--navy); color: #fff; }
.cabinet-nav-title span, .cabinet-nav-title b { display: block; }
.cabinet-nav-title span { color: #7faef2; font-size: 8px; font-weight: 900; letter-spacing: 1.2px; }
.cabinet-nav-title b { margin-top: 6px; font-size: 10px; overflow: hidden; text-overflow: ellipsis; }
.cabinet-nav button { min-height: 55px; padding: 0 18px; display: grid; grid-template-columns: 26px 1fr auto; align-items: center; gap: 7px; border: 0; border-bottom: 1px solid var(--line); border-left: 3px solid transparent; background: #fff; color: #526276; text-align: left; font-size: 12px; cursor: pointer; transition: .18s; }
.cabinet-nav button:hover { background: #f5f8fc; color: var(--ink); }
.cabinet-nav button.active { color: var(--blue); font-weight: 900; border-left-color: var(--blue); background: #f1f6fd; }
.cabinet-nav button > i { color: #a6b2c1; font-size: 8px; font-style: normal; }
.cabinet-nav button > small { min-width: 20px; height: 20px; display: grid; place-items: center; background: #edf2f7; color: #7e8c9d; font-size: 8px; border-radius: 50%; }
.cabinet-main { display: grid; gap: 20px; }
.dashboard-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.dashboard-cards article { background: #fff; border: 1px solid var(--line); padding: 25px; }
.dashboard-cards span, .profile-title span { display: block; color: var(--blue); font-size: 8px; font-weight: 900; letter-spacing: 1.1px; }
.dashboard-cards b { display: block; font-size: 22px; margin: 15px 0 6px; }
.dashboard-cards p { margin: 0 0 12px; }
.dashboard-cards small { color: var(--muted); }
.profile-card { background: #fff; border: 1px solid var(--line); padding: 32px; display: grid; gap: 20px; }
.cabinet-demo-note { margin: -4px 0 2px; padding: 14px 16px; border-left: 3px solid var(--orange); background: #fff4ed; color: #667488; font-size: 12px; line-height: 1.55; }
.profile-title { display: flex; justify-content: space-between; align-items: start; border-bottom: 1px solid var(--line); padding-bottom: 22px; }
.profile-title h2 { margin: 8px 0 0; font-size: 25px; }
.profile-title small { color: var(--muted); }
.account-switch { display: flex; gap: 5px; background: var(--paper); padding: 5px; width: fit-content; }
.account-switch button { border: 0; background: transparent; color: var(--muted); padding: 11px 16px; cursor: pointer; font-size: 11px; }
.account-switch button.active { background: #fff; color: var(--blue); box-shadow: 0 3px 10px rgba(20,40,60,.09); font-weight: 900; }
.profile-actions { display: flex; align-items: center; gap: 20px; }
.profile-actions span { color: #18a567; font-size: 11px; font-weight: 900; }
.profile-actions span.error { color: #d84232; }
.cabinet-panel { display: grid; gap: 20px; }
.cabinet-panel-head { min-height: 82px; padding: 20px 24px; display: flex; align-items: center; justify-content: space-between; background: #fff; border: 1px solid var(--line); }
.cabinet-panel-head span { color: var(--blue); font-size: 8px; font-weight: 900; letter-spacing: 1.2px; }
.cabinet-panel-head h2 { margin: 5px 0 0; font-size: 26px; letter-spacing: -1px; }
.dashboard-cards article > a { color: var(--blue); font-size: 10px; font-weight: 900; }
.cabinet-quick-grid { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); background: #fff; }
.cabinet-quick-grid > * { min-height: 155px; padding: 22px; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; border: 0; border-right: 1px solid var(--line); background: #fff; color: var(--ink); text-align: left; cursor: pointer; }
.cabinet-quick-grid > *:last-child { border-right: 0; }
.cabinet-quick-grid > *:hover { background: #f5f8fc; }
.cabinet-quick-grid span { color: var(--orange); font-size: 9px; font-weight: 900; margin-bottom: auto; }
.cabinet-quick-grid b { font-size: 15px; margin-bottom: 6px; }
.cabinet-quick-grid small { color: var(--muted); line-height: 1.45; }
.cabinet-empty { min-height: 390px; display: grid; place-content: center; justify-items: center; text-align: center; background: #fff; border: 1px solid var(--line); padding: 35px; }
.cabinet-empty:before { content: "0"; width: 70px; height: 70px; display: grid; place-items: center; border: 1px solid #bfd0e4; color: var(--blue); font-size: 24px; font-weight: 900; margin-bottom: 20px; }
.cabinet-empty b { font-size: 24px; }
.cabinet-empty p { max-width: 470px; color: var(--muted); line-height: 1.65; }
.cabinet-empty a { color: var(--orange); font-size: 11px; font-weight: 900; text-transform: uppercase; }
.cabinet-docs { background: #fff; border: 1px solid var(--line); }
.cabinet-docs > a { min-height: 92px; padding: 18px 22px; display: grid; grid-template-columns: 52px 1fr 30px; align-items: center; gap: 18px; border-bottom: 1px solid var(--line); }
.cabinet-docs > a:last-child { border: 0; }
.cabinet-docs > a:hover { background: #f6f9fc; }
.cabinet-docs > a > span { width: 48px; height: 54px; display: grid; place-items: center; background: #eef4fc; color: var(--blue); border-top: 3px solid var(--blue); font-size: 8px; font-weight: 900; }
.cabinet-docs b, .cabinet-docs small { display: block; }
.cabinet-docs small { color: var(--muted); margin-top: 6px; }
.cabinet-docs i { color: var(--orange); font-style: normal; font-size: 20px; }
.settings-list { background: #fff; border: 1px solid var(--line); }
.settings-list > div { min-height: 90px; padding: 20px 24px; display: grid; grid-template-columns: .45fr 1fr; align-items: center; gap: 30px; border-bottom: 1px solid var(--line); }
.settings-list > div:last-child { border: 0; }
.settings-list span { color: var(--blue); font-size: 9px; font-weight: 900; text-transform: uppercase; letter-spacing: .8px; }
.settings-list b { font-size: 12px; line-height: 1.55; }

.quick-contact { position: fixed; z-index: 60; right: 22px; bottom: 24px; display: grid; gap: 10px; }
.quick-link { width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center; position: relative; box-shadow: 0 12px 32px rgba(7,20,38,.24); transition: transform .2s, box-shadow .2s; }
.quick-link:hover { transform: translateY(-3px) scale(1.04); box-shadow: 0 17px 38px rgba(7,20,38,.3); }
.quick-link.telegram { background: #fff; }
.quick-link.telegram > img { width: 48px; height: 48px; }
.quick-link.max { background: #0d001a; border: 1px solid rgba(255,255,255,.15); }
.max-icon { width: 38px; height: 38px; display: block; overflow: hidden; }
.max-icon img { width: 106px; height: auto; max-width: none; display: block; }
.quick-label { position: absolute; right: 68px; top: 50%; transform: translateY(-50%) translateX(5px); padding: 7px 10px; background: rgba(7,20,38,.94); color: #fff; font-size: 9px; font-weight: 800; white-space: nowrap; opacity: 0; pointer-events: none; transition: .2s; }
.quick-link:hover .quick-label { opacity: 1; transform: translateY(-50%) translateX(0); }

.install-banner { position: fixed; z-index: 75; left: 20px; bottom: 20px; width: min(430px, calc(100% - 40px)); display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 14px; padding: 16px 17px; color: #fff; background: rgba(7,20,38,.96); border: 1px solid rgba(255,255,255,.15); border-radius: 10px; box-shadow: 0 18px 50px rgba(0,0,0,.3); backdrop-filter: blur(15px); }
.install-banner[hidden], .install-guide-backdrop[hidden] { display: none !important; }
.install-banner b, .install-banner span { display: block; }
.install-banner b { font-size: 12px; }
.install-banner span { color: #9fb0c3; font-size: 10px; line-height: 1.4; margin-top: 3px; }
.install-banner button { border: 0; background: var(--orange); color: #fff; min-height: 38px; padding: 0 13px; font-size: 9px; font-weight: 900; text-transform: uppercase; cursor: pointer; }
.install-banner .install-close { background: transparent; color: #8da0b6; padding: 0; min-width: 20px; font-size: 20px; }
.install-guide-backdrop { position: fixed; z-index: 120; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(2,12,25,.72); backdrop-filter: blur(9px); }
.install-guide { position: relative; width: min(440px, 100%); max-height: calc(100dvh - 40px); overflow: auto; padding: 30px; color: #0b1d3a; background: #fff; border-radius: 16px; box-shadow: 0 28px 80px rgba(0,0,0,.34); }
.install-guide-close { position: absolute; top: 12px; right: 14px; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; color: #6c7a8d; background: #eef3f8; font-size: 24px; cursor: pointer; }
.install-guide-mark { width: 62px; height: 62px; display: grid; place-items: center; margin-bottom: 18px; overflow: hidden; border-radius: 14px; background: #071a36; box-shadow: 0 10px 28px rgba(6,25,55,.2); }
.install-guide-mark img { width: 100%; height: 100%; object-fit: cover; }
.install-guide-kicker { display: block; color: var(--orange); font-size: 10px; font-weight: 900; letter-spacing: .14em; }
.install-guide h2 { margin: 7px 0 10px; font-size: clamp(24px, 6vw, 34px); line-height: 1.02; letter-spacing: -.035em; }
.install-guide > p { margin: 0; color: #64748a; font-size: 13px; line-height: 1.55; }
.install-guide ol { display: grid; gap: 9px; margin: 22px 0; padding: 0; list-style: none; }
.install-guide li { position: relative; display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 11px; min-height: 72px; padding: 12px 14px; border: 1px solid #dfe7f0; border-radius: 11px; background: #f8fafc; }
.install-guide li i { width: 30px; height: 30px; display: grid; place-items: center; color: #fff; background: var(--orange); border-radius: 9px; font-size: 11px; font-style: normal; font-weight: 900; }
.install-guide li b, .install-guide li span { display: block; }
.install-guide li b { font-size: 12px; }
.install-guide li span { margin-top: 3px; color: #708096; font-size: 10px; line-height: 1.4; }
.install-guide li strong { color: var(--orange); font-size: 24px; }
.install-guide-done { width: 100%; min-height: 48px; border: 0; border-radius: 10px; color: #fff; background: var(--orange); font-size: 11px; font-weight: 900; text-transform: uppercase; cursor: pointer; }
.install-guide small { display: block; margin-top: 12px; color: #8a98aa; font-size: 9px; line-height: 1.45; text-align: center; }

.admin-page { min-height: 100vh; background: #eef2f6; }
.admin-login-page { min-height: 100vh; display: grid; place-items: center; padding: 30px 15px; background: radial-gradient(circle at 75% 12%, #184679, transparent 30%), linear-gradient(145deg, #061325, #0b2747); }
.admin-login-card { width: min(100%, 460px); padding: 42px; background: #fff; box-shadow: 0 30px 80px rgba(0,0,0,.3); }
.admin-login-brand { display: flex; align-items: center; gap: 13px; padding-bottom: 25px; margin-bottom: 28px; border-bottom: 1px solid var(--line); }
.admin-login-brand img { width: 58px; height: 58px; border-radius: 14px; }
.admin-login-brand b, .admin-login-brand span { display: block; }
.admin-login-brand b { font-size: 20px; }
.admin-login-brand span { color: var(--muted); font-size: 10px; margin-top: 3px; }
.admin-login-card h1 { margin: 10px 0; font-size: 34px; letter-spacing: -1.6px; }
.admin-login-card > p { color: var(--muted); font-size: 12px; line-height: 1.6; }
.admin-login-card form, .admin-settings-card form { display: grid; gap: 15px; margin-top: 25px; }
.admin-login-card label, .admin-settings-card label { display: grid; gap: 7px; }
.admin-login-card label span, .admin-settings-card label span { color: #7e8b9b; font-size: 9px; font-weight: 900; text-transform: uppercase; letter-spacing: .7px; }
.admin-login-card input, .admin-settings-card input { width: 100%; min-height: 48px; padding: 0 14px; border: 1px solid #cdd7e2; background: #f8fafc; color: var(--ink); font: inherit; }
.admin-login-card form small { color: #c23d3d; font-size: 10px; }
.admin-page .header { position: relative; background: var(--navy); }
.admin-head { background: radial-gradient(circle at 85% 10%, #174679, transparent 30%), var(--navy); color: #fff; padding: 48px 0; }
.admin-head .container { display: flex; justify-content: space-between; align-items: end; }
.admin-head span, .admin-toolbar span { color: #74aaf7; font-size: 9px; font-weight: 900; letter-spacing: 1.4px; }
.admin-head h1 { margin: 8px 0; font-size: 42px; letter-spacing: -2px; }
.admin-head p { color: #9fb0c3; margin: 0; }
.admin-user { text-align: right; display: grid; gap: 7px; }
.admin-user b { font-size: 12px; }
.admin-user a { color: #9fb0c3; font-size: 10px; }
.admin-content { padding: 45px 0 80px; }
.admin-app { display: grid; gap: 20px; }
.admin-toolbar { display: flex; justify-content: space-between; align-items: end; }
.admin-toolbar h2 { margin: 7px 0 0; font-size: 31px; letter-spacing: -1.3px; }
.admin-toolbar-actions { display: flex; gap: 8px; }
.notify-button, .refresh-button { min-height: 42px; padding: 0 14px; border: 1px solid #ccd6e1; background: #fff; color: var(--ink); font-size: 10px; font-weight: 900; cursor: pointer; }
.notify-button:disabled { color: #168957; background: #edfaf4; border-color: #b8e4d0; }
.admin-toolbar-actions .active { color: #fff; background: var(--blue); border-color: var(--blue); }
.admin-toolbar-actions .logout { color: #9b3b3b; }
.admin-summary { display: grid; grid-template-columns: repeat(4, 1fr); background: #fff; border: 1px solid var(--line); }
.admin-summary div { padding: 22px 26px; border-right: 1px solid var(--line); }
.admin-summary div:last-child { border: 0; }
.admin-summary b { display: block; font-size: 28px; }
.admin-summary span { color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .8px; }
.admin-summary .accent b { color: var(--orange); }
.admin-controls { display: grid; grid-template-columns: auto 1fr auto; align-items: end; gap: 12px; }
.admin-tabs { display: flex; background: #fff; border: 1px solid var(--line); }
.admin-tabs button { min-height: 46px; padding: 0 16px; border: 0; border-right: 1px solid var(--line); background: #fff; color: #718092; font-size: 10px; font-weight: 800; cursor: pointer; }
.admin-tabs button:last-child { border-right: 0; }
.admin-tabs button.active { color: #fff; background: var(--navy); }
.admin-tabs b { margin-left: 5px; color: var(--orange); }
.admin-search { display: grid; gap: 5px; }
.admin-search span { color: #8c99a8; font-size: 8px; font-weight: 900; text-transform: uppercase; }
.admin-search input { min-height: 46px; padding: 0 14px; border: 1px solid var(--line); background: #fff; font: inherit; }
.push-panel { display: flex; align-items: center; justify-content: space-between; gap: 25px; padding: 18px 20px; background: #e9f3ff; border: 1px solid #bfd8f5; }
.push-panel b, .push-panel span { display: block; }
.push-panel b { color: #1264bf; font-size: 12px; }
.push-panel span { color: #65768a; font-size: 10px; line-height: 1.5; margin-top: 4px; }
.orders-workspace { display: grid; grid-template-columns: .75fr 1.25fr; min-height: 660px; background: #fff; border: 1px solid var(--line); }
.orders-list { border-right: 1px solid var(--line); max-height: 760px; overflow-y: auto; }
.order-list-item { width: 100%; border: 0; border-bottom: 1px solid var(--line); background: #fff; text-align: left; padding: 20px; display: grid; grid-template-columns: 10px 1fr auto; gap: 13px; cursor: pointer; transition: .2s; }
.order-list-item:hover, .order-list-item.active { background: #f2f7fd; }
.order-list-item.active { box-shadow: inset 3px 0 var(--blue); }
.status-dot { width: 8px; height: 8px; margin-top: 4px; border-radius: 50%; background: #9aa7b5; }
.status-dot.new { background: var(--orange); box-shadow: 0 0 0 5px rgba(255,107,24,.12); }
.status-dot.accepted, .status-dot.planned { background: var(--blue); }
.status-dot.working, .status-dot.enroute { background: var(--blue); }
.status-dot.completed { background: #22b777; }
.status-dot.archived { background: #9aa7b5; }
.order-list-item div { min-width: 0; }
.order-list-item b, .order-list-item strong, .order-list-item small { display: block; }
.order-list-item b { font-size: 10px; color: var(--blue); }
.order-list-item strong { font-size: 13px; margin: 6px 0; }
.order-list-item small { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.order-list-item time { color: #8b98a8; font-size: 9px; white-space: nowrap; }
.order-detail { padding: 35px; }
.order-detail-head { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); padding-bottom: 20px; }
.order-detail-head span { color: var(--blue); font-size: 8px; font-weight: 900; letter-spacing: 1px; }
.order-detail-head h3 { margin: 5px 0 0; font-size: 25px; }
.order-detail-head select { border: 1px solid var(--line); background: #f7f9fb; min-height: 42px; padding: 0 13px; font-size: 11px; font-weight: 800; }
.order-main-number { padding: 28px 0; display: flex; align-items: baseline; gap: 15px; }
.order-main-number b { font-size: 47px; letter-spacing: -2.5px; }
.order-main-number span { color: var(--orange); font-weight: 900; }
.order-data-grid { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--line); }
.order-data-grid > div { min-height: 110px; padding: 18px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.order-data-grid > div:nth-child(even) { border-right: 0; }
.order-data-grid > div.wide { grid-column: 1 / -1; border-right: 0; }
.order-data-grid span, .order-data-grid b, .order-data-grid small { display: block; }
.order-data-grid span { color: #8b98a8; font-size: 8px; font-weight: 900; text-transform: uppercase; letter-spacing: .9px; }
.order-data-grid b, .order-data-grid a { display: block; color: var(--ink); font-size: 13px; margin-top: 9px; font-weight: 900; }
.order-data-grid a { color: var(--blue); }
.order-data-grid small { color: var(--muted); margin-top: 5px; }
.order-map-preview { min-height: 150px; margin-top: 18px; padding: 20px; position: relative; overflow: hidden; background: repeating-linear-gradient(0deg, transparent 0 30px, rgba(255,255,255,.04) 30px 31px), repeating-linear-gradient(90deg, transparent 0 30px, rgba(255,255,255,.04) 30px 31px), #0b213d; color: #fff; display: flex; align-items: end; justify-content: space-between; }
.map-rings { position: absolute; inset: 0; display: grid; place-items: center; }
.map-rings i { position: absolute; border: 1px solid rgba(71,144,240,.35); border-radius: 50%; width: 90px; height: 90px; }
.map-rings i:nth-child(2) { width: 180px; height: 180px; }
.map-rings b { z-index: 1; padding: 8px 11px; background: var(--orange); font-size: 9px; }
.order-map-preview > span { position: relative; z-index: 2; max-width: 75%; font-size: 10px; color: #bdc9d7; }
.order-actions { display: flex; gap: 10px; margin-top: 18px; }
.order-actions button { border: 0; cursor: pointer; }
.btn-call { background: #edf3fa; color: var(--blue); }
.btn-archive { background: #edf0f4; color: #536275; }
.btn-delete { background: #fff0f0; color: #ad3232; }
.empty-orders { min-height: 300px; display: grid; place-content: center; text-align: center; color: var(--muted); }
.empty-orders b, .empty-orders span { display: block; }
.empty-orders b { color: var(--ink); font-size: 18px; margin-bottom: 7px; }
.admin-note { color: #7d8b9c; font-size: 10px; line-height: 1.6; margin: 0; }
.admin-settings-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 20px; }
.admin-settings-card, .admin-security-note { padding: 34px; background: #fff; border: 1px solid var(--line); }
.admin-settings-card h3 { margin: 9px 0; font-size: 26px; }
.admin-settings-card > p, .admin-security-note p { color: var(--muted); font-size: 11px; line-height: 1.65; }
.admin-settings-card form small { font-size: 10px; line-height: 1.5; }
.settings-success { color: #138456; }
.settings-error { color: #b33d3d; }
.admin-security-note { align-self: start; color: #fff; background: var(--navy); border-color: var(--navy); }
.admin-security-note b { font-size: 18px; }
.admin-security-note p { color: #aebed0; margin: 15px 0 25px; }
.admin-security-note span { display: block; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.13); color: #8497ac; font-size: 10px; line-height: 1.6; }

@media (max-width: 1100px) {
  .nav-links { display: none; position: absolute; top: 82px; left: 0; right: 0; background: #071426; padding: 18px 24px; flex-direction: column; align-items: stretch; }
  .nav-links.open { display: flex; }
  .nav-links a { padding: 10px 0; }
  .menu-btn { display: block; }
  .account { display: none; }
  .hero-grid { grid-template-columns: 1fr; }
  .hero-status, .hero-offer { display: none; }
  .hero-copy { max-width: 720px; }
  .fuel-grid { grid-template-columns: 1fr 1fr; }
  .calculator-shell { gap: 40px; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .product-row { grid-template-columns: 40px 1.3fr 1fr; }
  .product-actions { grid-column: 2 / -1; flex-direction: row; align-items: center; padding-bottom: 25px; }
  .visual-band-grid { grid-template-columns: 1fr 1fr; }
  .visual-band-copy { padding: 70px 40px; }
}

@media (max-width: 760px) {
  .container { width: min(100% - 30px, 1240px); }
  .nav { height: 70px; }
  .brand-name { font-size: 12px; }
  .brand-mark { width: 31px; height: 31px; }
  .phone { display: none; }
  .nav-order { padding: 11px 13px; font-size: 10px; }
  .nav-links { top: 70px; }
  .hero { min-height: 760px; align-items: end; padding-bottom: 80px; }
  .hero-image { background-position: 62% center; }
  .hero-overlay { background: linear-gradient(0deg, rgba(2,13,27,.99), rgba(2,13,27,.55)); }
  .hero-grid { padding-top: 110px; }
  .hero h1 { font-size: 45px; letter-spacing: -2.5px; }
  .hero-lead { font-size: 15px; }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .hero-proof { gap: 14px; justify-content: space-between; }
  .hero-proof div { padding: 0 10px; }
  .hero-proof strong { font-size: 18px; }
  .hero-proof span { font-size: 7px; }
  .trust-grid { grid-template-columns: 1fr 1fr; padding: 25px 0; }
  .trust-grid span { grid-column: 1 / -1; }
  .advantage-grid { grid-template-columns: 1fr 1fr; padding: 10px 0; }
  .advantage-grid > div:nth-child(2) { border-right: 0; }
  .advantage-grid > div { border-bottom: 1px solid var(--line); }
  .advantage-grid > div:nth-child(3), .advantage-grid > div:nth-child(4) { border-bottom: 0; }
  .section { padding: 70px 0; }
  .section-head { grid-template-columns: 1fr; gap: 20px; }
  .section h2, .quality h2, .inner-hero h1 { font-size: 38px; letter-spacing: -1.8px; }
  .fuel-grid, .calculator-shell, .quality-grid, .footer-grid, .delivery-map, .payment-grid, .docs-layout, .story, .contact-grid, .cabinet-layout, .visual-band-grid, .case-grid, .faq-grid { grid-template-columns: 1fr; }
  .fuel-card { min-height: 340px; }
  .calculator-card { padding: 23px; }
  .form-row, .quality-points, .product-meta, .delivery-map ul, .dashboard-cards { grid-template-columns: 1fr; }
  .steps, .big-stats { grid-template-columns: 1fr 1fr; }
  .feature-grid, .values { grid-template-columns: 1fr; }
  .feature-grid article, .values article { min-height: 190px; border-right: 0; border-bottom: 1px solid var(--line); }
  .feature-grid article:last-child, .values article:last-child { border-bottom: 0; }
  .step:after { display: none; }
  .quality-art { min-height: 340px; }
  .quality-image { min-height: 360px; background-position: 58% center; }
  .visual-band-image { min-height: 390px; background: linear-gradient(0deg, var(--navy), transparent 35%), url("/visuals-v2/warehouse-logistics.jpg") center/cover no-repeat; }
  .visual-band-copy { padding: 10px 15px 65px; }
  .visual-band-copy h2 { font-size: 41px; letter-spacing: -2px; }
  .case-image { min-height: 240px; }
  .application-row { grid-template-columns: 1fr 1fr; }
  .application-row span:nth-child(2) { border-right: 0; }
  .application-row span:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .winter-feature { min-height: 650px; align-items: end; background: linear-gradient(0deg, rgba(5,18,35,.98) 0%, rgba(5,18,35,.72) 58%, rgba(5,18,35,.08) 100%), url("/visuals-v2/catalog-winter.jpg") 60% center/cover no-repeat; }
  .winter-grid { grid-template-columns: 1fr; padding-bottom: 25px; }
  .winter-grid h2 { font-size: 42px; letter-spacing: -2px; }
  .faq-grid { gap: 45px; }
  .cta { padding: 35px 25px; flex-direction: column; align-items: flex-start; gap: 30px; }
  .cta h2 { font-size: 32px; }
  .footer-grid { gap: 35px; }
  .footer-bottom { flex-direction: column; gap: 8px; }
  .inner-hero { padding: 135px 0 55px; min-height: 350px; }
  .inner-hero p { font-size: 14px; }
  .product-row { grid-template-columns: 30px 1fr; padding: 25px 0; gap: 15px; }
  .product-meta, .product-actions { grid-column: 2; }
  .notice { grid-template-columns: 1fr; }
  .notice a { text-align: left; }
  .delivery-map { padding: 20px; }
  .delivery-equipment-photo { min-height: 310px; }
  .radar { min-height: 310px; }
  .docs-layout aside { flex-direction: row; flex-wrap: wrap; border: 0; padding: 0; }
  .big-stats div { padding: 20px 8px; }
  .big-stats b { font-size: 36px; }
  .contact-form { padding: 25px; }
  .cabinet-section { padding-top: 30px; }
  .cabinet-nav { display: grid; grid-template-columns: repeat(5, minmax(120px, 1fr)); overflow-x: auto; }
  .cabinet-nav-title { display: none; }
  .cabinet-nav button { min-width: 120px; min-height: 52px; grid-template-columns: 1fr auto; border-left: 0; border-bottom: 3px solid transparent; text-align: center; justify-content: center; }
  .cabinet-nav button.active { border-left: 0; border-bottom-color: var(--blue); }
  .cabinet-nav button > i { display: none; }
  .cabinet-quick-grid { grid-template-columns: 1fr; }
  .cabinet-quick-grid > * { min-height: 120px; border-right: 0; border-bottom: 1px solid var(--line); }
  .cabinet-panel-head { align-items: flex-start; flex-direction: column; gap: 18px; }
  .settings-list > div { grid-template-columns: 1fr; gap: 8px; }
  .cabinet-head .container { align-items: start; flex-direction: column; gap: 20px; }
  .profile-title { flex-direction: column; gap: 8px; }
  .account-switch { width: 100%; flex-direction: column; }
  .address-field { grid-template-columns: 1fr; }
  .location-button { width: 100%; }
  .install-banner { left: 12px; bottom: 80px; width: calc(100% - 24px); }
  .install-banner { grid-template-columns: 1fr auto; gap: 10px; padding: 14px; }
  .install-banner > div { grid-column: 1 / -1; padding-right: 24px; }
  .install-banner > button:not(.install-close) { justify-self: start; min-height: 42px; padding-inline: 17px; border-radius: 8px; }
  .install-banner .install-close { position: absolute; top: 8px; right: 10px; }
  .install-guide-backdrop { align-items: end; padding: 10px; }
  .install-guide { width: 100%; max-height: calc(100dvh - 20px); padding: 24px 18px 20px; border-radius: 16px 16px 12px 12px; }
  .admin-head .container, .admin-toolbar { flex-direction: column; align-items: flex-start; gap: 22px; }
  .admin-user { text-align: left; }
  .admin-toolbar-actions { width: 100%; }
  .admin-toolbar-actions button { flex: 1; }
  .admin-summary { grid-template-columns: 1fr 1fr; }
  .admin-summary div { padding: 17px 12px; }
  .admin-summary div:nth-child(2) { border-right: 0; }
  .admin-controls { grid-template-columns: 1fr; align-items: stretch; }
  .admin-tabs { overflow-x: auto; }
  .admin-tabs button { flex: 1; white-space: nowrap; }
  .push-panel { align-items: stretch; flex-direction: column; }
  .orders-workspace { grid-template-columns: 1fr; }
  .orders-list { max-height: 380px; border-right: 0; border-bottom: 1px solid var(--line); }
  .order-detail { padding: 22px; }
  .order-main-number b { font-size: 39px; }
  .order-actions { flex-direction: column; }
  .admin-settings-grid { grid-template-columns: 1fr; }
  .admin-login-card { padding: 30px 24px; }
  .quick-contact { right: 14px; bottom: 14px; grid-template-columns: 54px 54px; gap: 8px; }
  .quick-link { width: 54px; height: 54px; }
  .quick-link.telegram > img { width: 46px; height: 46px; }
  .quick-label { display: none; }
  .max-icon { width: 35px; height: 35px; }
}

@media (max-width: 480px) {
  .steps, .big-stats { grid-template-columns: 1fr; }
  .big-stats div { border-right: 0; border-bottom: 1px solid var(--line); }
  .hero h1 { font-size: 39px; }
}

/* ДизОйл brand system */
.header { background: rgba(5,18,35,.86); }
.header-top { border-bottom: 1px solid rgba(255,255,255,.11); background: rgba(3,13,27,.5); }
.header-top-inner { min-height: 32px; display: flex; align-items: center; justify-content: space-between; gap: 20px; color: #b7c6d7; font-size: 10px; }
.header-top-inner > div { display: flex; gap: 22px; align-items: center; }
.header-top-inner a { transition: color .2s; }
.header-top-inner a:hover { color: #fff; }
.header-region { color: #e5edf6; font-weight: 800; letter-spacing: .35px; }
.header-region::first-letter { color: var(--orange); }
.nav { gap: 18px; }
.nav-links { gap: 16px; font-size: 12px; }
.nav-links a { white-space: nowrap; }
.nav-order { border: 0; color: #fff; cursor: pointer; white-space: nowrap; }
.account { padding-left: 0; border-left: 0; }

.dizoil-brand { position: relative; display: inline-flex; align-items: center; color: #fff; padding-bottom: 13px; }
.dizoil-logo-image { display: block; width: 220px; height: auto; object-fit: contain; }
.dizoil-tagline { position: absolute; left: 69px; bottom: 0; color: #a9b7c7; font-size: 6px; font-weight: 900; letter-spacing: 1.25px; white-space: nowrap; }
.footer-brand .dizoil-logo-image { width: 265px; }
.footer-brand .dizoil-tagline { left: 84px; font-size: 7px; }
.dizoil-mark { width: 48px; height: 42px; flex: 0 0 auto; overflow: visible; }
.mark-d { fill: #fff; }
.mark-o { fill: var(--orange); }
.mark-swoosh-light { fill: #fff; }
.mark-swoosh { fill: #0b1d3a; }
.dizoil-word { display: grid; line-height: 1; }
.dizoil-word > span { display: flex; align-items: baseline; font-size: 22px; font-weight: 950; letter-spacing: -1.2px; font-style: italic; }
.dizoil-word b { font-weight: 950; }
.dizoil-word em { color: var(--orange); font-style: inherit; font-weight: 950; }
.dizoil-word small { margin-top: 5px; color: #9fb0c3; font-size: 6px; letter-spacing: 1.15px; font-weight: 900; }
.footer-brand .dizoil-mark { width: 55px; height: 48px; }
.footer-brand .dizoil-word > span { font-size: 26px; }

.hero { min-height: 790px; }
.hero-image { background-image: url("/hero-dizoil-night-v2.png"); background-position: center; transform: none; }
.hero-overlay { background: linear-gradient(90deg, rgba(2,13,27,.96) 0%, rgba(4,19,37,.82) 34%, rgba(4,19,37,.20) 57%, rgba(4,19,37,.05) 100%); }
.hero-grid { padding-top: 145px; grid-template-columns: minmax(0, 660px) 1fr; gap: 42px; align-items: center; }
.hero-copy { max-width: 660px; }
.hero h1 { font-size: clamp(45px, 5vw, 68px); }
.quick-application { width: 360px; margin-bottom: 25px; padding: 26px; }
.quick-application h2 { margin: 9px 0 0; font-size: 29px; letter-spacing: -1.2px; }
.quick-application > p { margin: 12px 0 18px; }
.lead-form { display: grid; gap: 10px; }
.lead-form label { display: grid; gap: 5px; color: #b8c7d8; font-size: 8px; font-weight: 900; text-transform: uppercase; letter-spacing: .8px; }
.lead-form input, .lead-form select { width: 100%; min-height: 44px; border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.08); color: #fff; padding: 0 12px; outline: none; font-size: 12px; text-transform: none; }
.lead-form input::placeholder { color: #8395a9; }
.lead-form input:focus, .lead-form select:focus { border-color: var(--orange); }
.lead-order-row { display: grid; grid-template-columns: minmax(92px, .7fr) minmax(145px, 1.3fr); gap: 8px; }
.lead-address > small, .field-hint { display: block; margin-top: 6px; color: #8a99aa; font-size: 8px; line-height: 1.45; letter-spacing: 0; text-transform: none; font-weight: 500; }
.lead-address > small a, .field-hint a { text-decoration: underline; }
.delivery-address-field { position: relative; display: block; width: 100%; min-width: 0; }
.delivery-address-field > span { display: block; }
.delivery-address-field > input[name="deliveryAddress"] { position: relative; z-index: 1; width: 100%; }
.address-suggestions { position: fixed; z-index: 1000; display: grid; overflow-x: hidden; overflow-y: scroll; overscroll-behavior: contain; scrollbar-gutter: stable; -webkit-overflow-scrolling: touch; touch-action: pan-y; pointer-events: auto; contain: layout paint; border: 1px solid #cbd7e4; border-radius: var(--radius-control); background: #fff; box-shadow: 0 18px 45px rgba(8,29,55,.24); }
.address-suggestions::-webkit-scrollbar { width: 10px; }
.address-suggestions::-webkit-scrollbar-thumb { border: 2px solid #fff; border-radius: 8px; background: #aab8c8; }
.address-suggestions button { width: 100%; border: 0; border-bottom: 1px solid #e5ebf1; background: #fff; color: var(--ink); padding: 11px 13px; text-align: left; font-size: 11px; line-height: 1.35; cursor: pointer; text-transform: none; }
.address-suggestions button:hover, .address-suggestions button:focus { background: #edf4ff; color: var(--blue); outline: none; }
.address-suggestions a { padding: 7px 13px; background: #f6f8fb; color: #8a97a7; text-align: right; font-size: 8px; font-weight: 700; }
.address-suggestions-space { display: block; min-height: 48px; background: linear-gradient(180deg, #f6f8fb, #fff); }
.address-status { display: block; margin-top: 6px; color: #8a99aa; font-size: 8px; line-height: 1.45; letter-spacing: 0; text-transform: none; font-weight: 500; }
.address-status.confirmed { color: #28a96b; font-weight: 800; }
.contact-form .delivery-address-field { width: 100%; }
.contact-form .address-status { text-align: left; }
.lead-form .btn { width: 100%; min-height: 48px; margin-top: 3px; }
.lead-form .btn i { font-style: normal; }
.lead-form > small { color: #778a9f; font-size: 8px; line-height: 1.45; text-align: center; }
.quick-lead-section { position: relative; z-index: 3; background: #fff; border-bottom: 1px solid var(--line); box-shadow: 0 14px 45px rgba(7,20,38,.08); }
.quick-lead-grid { min-height: 180px; display: grid; grid-template-columns: 260px 1fr; align-items: center; gap: 36px; padding-top: 25px; padding-bottom: 25px; }
.quick-lead-copy { padding-right: 25px; border-right: 1px solid var(--line); }
.quick-lead-copy h2 { margin: 0 0 10px; color: var(--ink); font-size: 23px; line-height: 1; letter-spacing: -.55px; white-space: nowrap; }
.quick-lead-copy h2::first-letter { color: var(--orange); }
.quick-lead-copy p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.quick-lead-section .lead-form.quick { grid-template-columns: .72fr .86fr 1.2fr minmax(280px, 1.8fr) auto; align-items: end; gap: 10px; }
.quick-lead-section .lead-form label { color: #617187; }
.quick-lead-section .lead-form input, .quick-lead-section .lead-form select { min-height: 47px; border-color: #d7e0e9; background: #f6f8fb; color: var(--ink); }
.quick-lead-section .lead-form .btn { min-height: 47px; white-space: nowrap; padding: 0 18px; }
.quick-lead-section .lead-form > small, .quick-lead-section .form-error { grid-column: 1 / -1; margin: 0; }
.lead-success { min-height: 210px; display: grid; place-content: center; text-align: center; }
.lead-success b { color: #57d895; font-size: 18px; }
.lead-success span { color: var(--orange); margin-top: 8px; font-size: 11px; }
.lead-success p { margin: 13px 0 0; }

.callback-modal { position: fixed; z-index: 150; inset: 0; display: grid; place-items: center; padding: 20px; color: var(--ink); }
.modal-backdrop { position: absolute; inset: 0; border: 0; background: rgba(2,10,20,.78); backdrop-filter: blur(8px); cursor: pointer; }
.callback-dialog,
.callback-modal-card { position: relative; z-index: 1; width: min(620px, 100%); max-height: calc(100dvh - 40px); overflow-y: auto; overscroll-behavior: contain; background: #fff; padding: 38px; border-top: 5px solid var(--orange); border-radius: var(--radius-card); box-shadow: 0 35px 100px rgba(0,0,0,.4); }
.callback-dialog h2,
.callback-modal-card h2 { margin: 10px 0 8px; font-size: 34px; letter-spacing: -1.5px; }
.callback-dialog > p,
.callback-modal-card > p { color: var(--muted); line-height: 1.6; margin: 0 0 22px; }
.callback-dialog .lead-form label,
.callback-modal-card .lead-form label { color: #63748a; }
.callback-dialog .lead-form input,
.callback-dialog .lead-form select,
.callback-modal-card .lead-form input,
.callback-modal-card .lead-form select { min-height: 48px; background: #f5f8fb; border: 1px solid #d8e0e9; color: var(--ink); }
.callback-dialog .lead-form input::placeholder,
.callback-modal-card .lead-form input::placeholder { color: #8799ad; opacity: 1; }
.callback-dialog .lead-form > small,
.callback-modal-card .lead-form > small { color: #8b98a8; }
.callback-dialog .lead-form.callback,
.callback-modal-card .lead-form.callback { grid-template-columns: 1fr 1fr; gap: 12px; }
.callback-dialog .lead-form.callback > .lead-order-row,
.callback-dialog .lead-form.callback > .lead-address,
.callback-dialog .lead-form.callback > .btn,
.callback-dialog .lead-form.callback > .form-error,
.callback-dialog .lead-form.callback > small,
.callback-modal-card .lead-form.callback > .lead-order-row,
.callback-modal-card .lead-form.callback > .lead-address,
.callback-modal-card .lead-form.callback > .btn,
.callback-modal-card .lead-form.callback > .form-error,
.callback-modal-card .lead-form.callback > small { grid-column: 1 / -1; }
.modal-close { position: absolute; top: 12px; right: 14px; width: 38px; height: 38px; border: 0; background: #f1f4f7; color: #5f6e80; font-size: 25px; cursor: pointer; }
.callback-modal-card .callback-close { border-radius: var(--radius-control); color: #5f6e80; }
.route-actions { flex: 1; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.route-actions > span { width: 100%; color: #7c8b9e; font-size: 9px; font-weight: 900; text-transform: uppercase; letter-spacing: .7px; }
.btn-route { border: 1px solid #cdd8e5; background: #fff; color: var(--ink); }

.price-section { background: #f5f8fb; }
.price-table { border: 1px solid var(--line); background: #fff; }
.price-table.standalone { margin-bottom: 28px; }
.price-row { min-height: 75px; display: grid; grid-template-columns: 1.35fr 1fr .72fr .72fr .55fr; align-items: center; gap: 18px; padding: 12px 22px; border-bottom: 1px solid var(--line); }
.price-row:last-child { border-bottom: 0; }
.price-row > * { min-width: 0; }
.price-row b { font-size: 14px; }
.price-row span { color: var(--muted); font-size: 12px; }
.price-row strong { color: var(--orange); font-size: 17px; }
.price-row a, .price-order-button { color: var(--blue); text-align: right; font-size: 10px; font-weight: 900; text-transform: uppercase; }
.price-order-button { border: 0; background: none; padding: 12px 0; cursor: pointer; }
.price-order-button:hover { color: var(--orange); }
.price-row.price-head { min-height: 48px; background: var(--navy); color: #fff; }
.price-row.price-head span { color: #aab9ca; font-size: 8px; font-weight: 900; text-transform: uppercase; letter-spacing: .8px; }
.price-note { color: #8492a3; font-size: 10px; line-height: 1.55; margin: 15px 0 0; }
.price-notice { margin-top: 0; }
.product-meta small { display: block; color: #8996a6; margin-top: 5px; font-size: 8px; }
.product-row.furnace { --accent: #9b651e; }

.faq-page-grid { display: grid; grid-template-columns: 1.15fr .55fr; gap: 40px; align-items: start; }
.faq-aside { position: sticky; top: 30px; padding: 34px; background: var(--navy); color: #fff; }
.faq-aside h2 { font-size: 32px; letter-spacing: -1.3px; }
.faq-aside p { color: #9fb0c3; line-height: 1.65; margin-bottom: 24px; }
.reviews-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 28px; }
.reviews-grid article { min-height: 260px; display: flex; flex-direction: column; padding: 28px; border: 1px solid var(--line); background: #fff; }
.reviews-grid article > span { color: var(--orange); font-size: 10px; font-weight: 900; }
.reviews-grid p { color: #3f4d60; line-height: 1.75; font-size: 14px; margin: 34px 0; }
.reviews-grid b { margin-top: auto; font-size: 11px; }
.legal-copy { max-width: 840px; }
.legal-copy h2 { font-size: 34px; }
.legal-copy p { color: var(--muted); font-size: 15px; line-height: 1.8; }
.application-row { grid-template-columns: repeat(5, 1fr); }
.cta:after { content: "ДО"; }
.product-detail-section { background: #f4f7fa; }
.product-detail-hero { display: grid; grid-template-columns: 1fr 420px; gap: 28px; align-items: stretch; }
.product-summary { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--line); background: #fff; }
.product-summary > div { min-height: 185px; padding: 30px; border-right: 1px solid var(--line); }
.product-summary > div > span, .product-summary small { display: block; color: #8997a7; font-size: 9px; text-transform: uppercase; letter-spacing: .8px; }
.product-summary > div > b { display: block; color: var(--orange); font-size: 35px; margin: 20px 0 8px; letter-spacing: -1.5px; }
.product-summary ul { grid-column: 1 / -1; padding: 0; margin: 0; list-style: none; }
.product-summary li { min-height: 72px; padding: 15px 22px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; border-top: 1px solid var(--line); }
.product-summary li span { color: var(--muted); font-size: 11px; }
.product-summary li b { text-align: right; font-size: 13px; }
.product-fast-form { background: var(--navy); color: #fff; padding: 30px; }
.product-fast-form h2 { font-size: 30px; margin: 10px 0 22px; letter-spacing: -1.3px; }
.product-copy-section { background: #fff; }
.product-copy-grid { display: grid; grid-template-columns: 1fr 360px; gap: 80px; align-items: start; }
.product-copy-grid > div h2 { font-size: 45px; margin: 15px 0 26px; }
.product-copy-grid > div p { color: var(--muted); font-size: 15px; line-height: 1.8; }
.product-copy-grid > aside { padding: 28px; background: #f4f7fa; border-top: 4px solid var(--orange); }
.product-copy-grid > aside > b { display: block; font-size: 17px; margin-bottom: 20px; }
.product-copy-grid > aside > div { min-height: 55px; display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--line); font-size: 11px; }
.product-copy-grid > aside span { color: var(--muted); }
.product-copy-grid > aside a { display: block; margin-top: 22px; color: var(--blue); font-weight: 900; }
.product-uses { background: #f4f7fa; }
.delivery-steps { display: grid; grid-template-columns: repeat(4, 1fr); margin: 28px 0; border: 1px solid var(--line); }
.delivery-steps article { min-height: 170px; padding: 24px; border-right: 1px solid var(--line); }
.delivery-steps article:last-child { border-right: 0; }
.delivery-steps span { color: var(--orange); font-size: 9px; font-weight: 900; }
.delivery-steps b { display: block; margin: 28px 0 9px; font-size: 17px; }
.delivery-steps p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.delivery-cities { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 8px; }
.delivery-cities span { padding: 10px 14px; background: #f0f4f8; color: #5f7187; font-size: 10px; font-weight: 800; }

@media (max-width: 1180px) {
  .nav-links { gap: 12px; font-size: 11px; }
  .nav-actions .account { display: none; }
}

@media (max-width: 1100px) {
  .nav-links { top: 114px; }
  .header-top-inner > div a:first-child { display: none; }
  .hero { min-height: 790px; }
  .hero-grid { grid-template-columns: minmax(0, 650px) 1fr; padding-top: 145px; padding-bottom: 70px; }
  .hero-copy { max-width: 760px; }
  .quick-lead-grid { grid-template-columns: 1fr; gap: 22px; padding-top: 30px; padding-bottom: 30px; }
  .quick-lead-copy { padding: 0; border: 0; }
  .quick-lead-section .lead-form.quick { grid-template-columns: 1fr 1fr 1fr; }
  .quick-lead-section .lead-form.quick > .lead-address { grid-column: 1 / 3; }
}

@media (max-width: 760px) {
  .header-top-inner { min-height: 30px; }
  .header-top-inner > div { width: 100%; justify-content: space-between; gap: 10px; }
  .header-region { display: none; }
  .nav-links { top: 100px; }
  .dizoil-logo-image { width: 152px; }
  .dizoil-tagline { display: none; }
  .dizoil-brand { padding-bottom: 0; }
  .nav-order { font-size: 8px; padding: 10px; }
  .hero { min-height: 730px; align-items: stretch; padding: 130px 0 65px; }
  .hero-grid { grid-template-columns: minmax(0, 1fr); padding: 0; gap: 38px; }
  .hero-copy { width: 100%; max-width: none; }
  .hero-image { background-position: 40% center; }
  .hero h1 { font-size: 37px; }
  .quick-lead-grid { display: block; padding-top: 32px; padding-bottom: 32px; }
  .quick-lead-copy { margin-bottom: 23px; }
  .quick-lead-section .lead-form.quick { grid-template-columns: 1fr; }
  .quick-lead-section .lead-form.quick > .lead-address, .quick-lead-section .lead-form .btn, .quick-lead-section .lead-form > small { grid-column: 1; }
  .price-row { grid-template-columns: 1fr auto; gap: 5px 16px; padding: 18px; }
  .price-row.price-head { display: none; }
  .price-row span:nth-child(2), .price-row span:nth-child(4) { grid-column: 1; }
  .price-row strong, .price-row a, .price-row .price-order-button { grid-column: 2; grid-row: 1; }
  .price-row a, .price-row .price-order-button { grid-row: 2 / span 2; align-self: end; }
  .faq-page-grid, .reviews-grid { grid-template-columns: 1fr; }
  .faq-aside { position: static; }
  .product-detail-hero, .product-copy-grid { grid-template-columns: 1fr; }
  .delivery-steps { grid-template-columns: 1fr 1fr; }
  .delivery-steps article:nth-child(2) { border-right: 0; }
  .delivery-steps article:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .product-copy-grid { gap: 28px; }
  .application-row { grid-template-columns: 1fr 1fr; }
  .application-row span:last-child { grid-column: 1 / -1; }
  .callback-dialog, .callback-modal-card { max-height: calc(100dvh - 28px); padding: 30px 22px 24px; }
  .callback-dialog h2, .callback-modal-card h2 { font-size: 29px; }
  .callback-dialog .lead-form.callback, .callback-modal-card .lead-form.callback { grid-template-columns: 1fr; }
}

@media (max-width: 430px) {
  .header-top-inner > div { font-size: 9px; }
  .hero h1 { font-size: 34px; }
  .hero-proof span { letter-spacing: .2px; }
  .product-summary { grid-template-columns: 1fr; }
  .product-summary > div { border-right: 0; border-bottom: 1px solid var(--line); }
  .product-summary ul { grid-column: 1; }
  .delivery-steps { grid-template-columns: 1fr; }
  .delivery-steps article { border-right: 0; border-bottom: 1px solid var(--line); }
}
