/* zeadmin.ru template layer (release 2026-10-21). Loaded last on every page.
   The prototype approved by the owner on 2026-10-20 (site-local/prototype-20261021): same Inter and brand colours,
   light glass header, soft ground, white rounded cards, pill buttons, heavy tight headings, dark feature tiles,
   bento hero with the founder's photo and the SLA card, calculator, mosaic cases. */
:root {
  --zt-ink: #0b1626; --zt-text: #22324a; --zt-muted: #4a5a70; --zt-line: #e3e9f1; --zt-line2: #cfd8e5;
  --zt-ground: #f5f7fb; --zt-card: #fff; --zt-navy: #0b1626; --zt-navy2: #13233a;
  --zt-accent: #1d4ed8; --zt-accent2: #1740b0; --zt-sky: #e8efff; --zt-onnavy: #b4c3d8; --zt-link-navy: #9ec0ff;
  --zt-r: 22px; --zt-r-lg: 28px; --zt-r-sm: 14px; --zt-ease: cubic-bezier(.16, 1, .3, 1);
  --zd-tint: #f5f7fb; --zd-tint-2: #eaeff6; --zd-ground: #fff; --zd-navy: #0b1626; --zd-radius-btn: 999px; --zd-radius-card: 22px;
}

/* ---------- Ground and type ---------- */
html body { background: var(--zt-ground) !important; color: var(--zt-text); }
html body main :is(h1, h2) { color: var(--zt-ink); font-weight: 760 !important; letter-spacing: -0.035em !important; text-wrap: balance; }
html body main h1 { font-size: clamp(36px, 4.4vw, 60px) !important; line-height: 1.04 !important; letter-spacing: -0.042em !important; }
html body main h2 { font-size: clamp(28px, 3vw, 44px) !important; line-height: 1.08 !important; }
html body main :is(.za-card, .zp5-case, aside, .za-hero-card, .zr-request__panel, .zr-contact-panel, .zc-article-toc, .zhd-portal__feature, .zt-sla) h2 { font-size: clamp(20px, 1.7vw, 24px) !important; letter-spacing: -0.02em !important; }
html body main h3 { color: var(--zt-ink); letter-spacing: -0.02em; font-weight: 700; }
html body :is(.za-eyebrow, .zhp-kicker, .zc-eyebrow, .zr-request__eyebrow, .zhd-portal__eyebrow) { color: var(--zt-accent) !important; font-weight: 650 !important; font-size: 15px !important; }

/* ---------- Header: light glass ---------- */
html body .zs-header { background: rgba(245, 247, 251, .88) !important; backdrop-filter: saturate(1.4) blur(14px) !important; -webkit-backdrop-filter: saturate(1.4) blur(14px) !important; border-bottom: 1px solid var(--zt-line) !important; box-shadow: none !important; color: var(--zt-ink); }
html body .zs-header .zs-logo { color: var(--zt-ink) !important; font-weight: 750; letter-spacing: -0.01em; }
html body .zs-logo__mark::before { background: linear-gradient(145deg, #4c8dff, #1d4ed8) !important; box-shadow: none !important; }
html body .zs-header .zs-logo__mark::after { background: rgba(255, 255, 255, .35) !important; border-color: rgba(255, 255, 255, .8) !important; }
html body .zs-nav a { color: var(--zt-text) !important; font-weight: 550 !important; padding: 8px 12px !important; border-radius: 999px; transition: background-color .2s var(--zt-ease); }
html body .zs-nav a:hover { background: #e7edf6; color: var(--zt-ink) !important; }
html body .zs-nav a[aria-current="page"] { color: var(--zt-ink) !important; background: #e7edf6; }
html body .zs-nav a[aria-current="page"]::after { display: none !important; }
html body .zs-header__phone { color: var(--zt-ink) !important; }
html body .zs-header__cta { border-radius: 999px !important; min-height: 44px !important; padding: 0 20px !important; }
html body .zs-menu { color: var(--zt-ink) !important; border-color: var(--zt-line2) !important; border-radius: 12px !important; }
@media (max-width: 1080px) {
  html body .zs-nav { background: #fff !important; border: 1px solid var(--zt-line) !important; border-radius: 20px !important; box-shadow: 0 24px 60px -24px rgba(11, 22, 38, .35) !important; }
  html body .zs-nav a { color: var(--zt-ink) !important; border-radius: 12px; }
  html body .zs-nav .zs-nav__action { background: var(--zt-accent) !important; color: #fff !important; border-radius: 999px; }
  html body .zs-mobile-actions { background: rgba(245, 247, 251, .94) !important; border-top: 1px solid var(--zt-line) !important; backdrop-filter: blur(14px) !important; }
  html body .zs-mobile-actions a { border-radius: 999px !important; color: var(--zt-ink) !important; border-color: var(--zt-line2) !important; background: #fff; }
  html body .zs-mobile-actions a:last-child { background: var(--zt-accent) !important; border-color: var(--zt-accent) !important; color: #fff !important; }
}

/* ---------- Buttons: pills ---------- */
html body :is(.za-btn, .zhp-button, .zc-button, .cs-button, .zb-button, .zab-button, .zr-form button[type="submit"], .zrv-submit, .zhd-portal__action, .za-cookie-consent__button) {
  border-radius: 999px !important; min-height: 50px; padding: 0 24px !important; font-weight: 650 !important; font-size: 15.5px !important;
}
html body .zs-header__cta { font-size: 15px !important; }
html body :is(.za-btn--primary, .zhp-button:not(.zhp-button--light), .cs-button, .zc-button, .zr-form button[type="submit"], .zrv-submit) { background: var(--zt-accent) !important; border-color: var(--zt-accent) !important; }
html body :is(.za-btn--light, .za-btn--ghost, .zhp-button--light) { background: #fff !important; border: 1px solid var(--zt-line2) !important; color: var(--zt-ink) !important; }
html body main :is(.zn-link-button, .zc-quick-nav a, .zp-jump a) { border-radius: 999px !important; }

/* ---------- Surfaces: white rounded cards on the soft ground ---------- */
html body main :is(.za-section, .zc-section, .zr-editorial, .zv-tone-white, .za-section--white, .zv-tone-blue, .zv-tone-soft, .zp5-cases, .zhp-person, .zr-request, .zhp-stats) { background: transparent !important; background-image: none !important; }
html body main :is(.za-card, a.za-card.zc-link-card, .zc-scope-card, .zc-case-card, .zrv-card, .zp-dev-card, .zp-terms > article, .zp-stat, .zc-directory, .cs-facts, .zp-calc, .zv-summary-strip__inner) {
  background: var(--zt-card) !important; border: 1px solid var(--zt-line) !important; border-radius: var(--zt-r) !important; box-shadow: none !important;
}
html body main :is(.zv-tone-white, .za-section--white, .zc-article) :is(.za-card, .zc-scope-card) { background: var(--zt-card) !important; border-color: var(--zt-line) !important; }
html body main :is(.za-card, .zc-link-card, .zc-scope-card) { padding: 28px !important; }
html body main :is(.za-card, .zc-link-card) h3 { font-size: 20px !important; line-height: 1.25 !important; }
html body main :is(a.za-card.zc-link-card, a.zc-case-card, a.zp5-case, a.zp-dev-card, a.cs-project) { transition: transform .3s var(--zt-ease), box-shadow .3s var(--zt-ease), border-color .3s !important; }
@media (hover: hover) and (pointer: fine) {
  html body main :is(a.za-card.zc-link-card, a.zc-case-card, a.zp5-case, a.zp-dev-card, a.cs-project):hover { transform: translateY(-4px) !important; box-shadow: 0 22px 44px -26px rgba(11, 22, 38, .35) !important; border-color: var(--zt-line2) !important; }
}
html body main details:is(.zc-faq, .zr-technical, .cs-checks) { border-radius: 16px !important; background: #fff !important; border: 1px solid var(--zt-line) !important; }

/* Inner heroes: one white rounded panel on the ground */
html body main section.za-hero, html body main .zc-hero, html body main .zab-hero { background: transparent !important; background-image: none !important; padding-block: 24px 8px !important; }
html body main section.za-hero > .za-container, html body main .zc-hero > :is(.zc-container, .za-container), html body main .zab-hero > .za-container {
  background: var(--zt-card); border: 1px solid var(--zt-line); border-radius: var(--zt-r-lg); padding: clamp(28px, 4vw, 52px) !important;
}
html body main .za-hero .za-hero-card { background: var(--zt-ground) !important; border: 0 !important; box-shadow: none !important; border-radius: var(--zt-r) !important; }
html body main .za-hero .za-hero-card :is(li, a):not(.za-btn) { background: #fff !important; border-radius: 12px !important; }
html body main .zc-breadcrumb { background: transparent !important; border: 0 !important; }
html body main .zv-summary-strip { background: transparent !important; }
html body main .zc-quick-nav { background: transparent !important; border: 0 !important; }

/* Dark blocks: navy rounded panels */
html body main :is(.zhd-portal, section.za-section.zc-request, .zc-mid-cta, .zc-section--dark, .za-section--dark) { background: transparent !important; padding-block: 24px !important; }
html body main :is(.zhd-portal, section.za-section.zc-request, .zc-mid-cta, .zc-section--dark, .za-section--dark) > :is(.zhp-shell, .za-container, .zc-container) {
  background: var(--zt-navy); border-radius: 32px; padding: clamp(32px, 5vw, 64px) !important; color: #e6edf7;
}
html body main .case-story .cs-result { border-radius: var(--zt-r-lg) !important; background: var(--zt-navy) !important; }
html body main .case-story .cs-result :is(h2, h3, p, li, span, strong) { color: #e6edf7 !important; }
html body main .case-story .cs-result .cs-kicker { color: var(--zt-link-navy) !important; }

/* ================= Home ================= */
html body .zhp-hero { background: transparent !important; padding: 28px 0 8px !important; min-height: 0 !important; }
html body .zhp-hero__grid { display: grid !important; grid-template-columns: 1.08fr .92fr !important; grid-template-rows: 1fr auto; grid-template-areas: "main photo" "main sla"; gap: 24px !important; align-items: stretch !important; padding: 0 !important; }
html body .zhp-hero__content { grid-area: main; background: var(--zt-card); border: 1px solid var(--zt-line); border-radius: var(--zt-r-lg); padding: clamp(28px, 4vw, 48px) !important; display: flex; flex-direction: column; max-width: none !important; }
html body .zhp-hero .zhp-kicker { align-self: flex-start; display: inline-flex !important; align-items: center; gap: 8px; padding: 7px 14px 7px 10px !important; border-radius: 999px !important; background: #eaf7f1 !important; color: #0b6b4a !important; font-size: 14px !important; }
html body .zhp-hero .zhp-kicker::before { content: "" !important; display: block !important; width: 8px; height: 8px; border-radius: 50%; background: #10b981; box-shadow: 0 0 0 4px rgba(16, 185, 129, .18); }
html body .zhp-hero h1 { font-size: clamp(40px, 4.6vw, 64px) !important; letter-spacing: -0.045em !important; line-height: 1.02 !important; margin: 22px 0 20px !important; max-width: none !important; }
html body .zhp-hero h1 .zt-accent { font-style: normal; color: var(--zt-accent); }
html body .zhp-hero__lead { font-size: 18px !important; line-height: 1.6 !important; color: var(--zt-muted) !important; max-width: 580px; }
html body .zhp-hero .zhp-offer { margin-top: 24px !important; border-radius: 18px !important; background: var(--zt-ground) !important; border: 0 !important; }
html body .zhp-hero .zhp-offer li + li { border-left-color: #fff !important; }
html body .zhp-hero .zhp-actions { margin-top: 24px !important; }
html body .zt-facts { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--zt-line); margin-top: auto; padding-top: 4px; }
html body .zhp-hero .zhp-actions + .zt-facts { margin-top: 28px; }
html body .zt-facts div { padding: 18px 14px 0 0; }
html body .zt-facts b { display: block; font-size: 25px; letter-spacing: -0.03em; color: var(--zt-ink); font-weight: 760; line-height: 1.1; }
html body .zt-facts span { font-size: 14px; color: var(--zt-muted); line-height: 1.4; display: block; margin-top: 6px; }
html body .zhp-hero .zhp-offer__more { margin-top: 20px !important; align-self: flex-start; font-weight: 600; }
/* the facts row now carries the trust list; the duplicate list and the location meta stay in the markup only */
html body .zhp-hero :is(.zhp-trust, .zhp-hero__meta) { display: none !important; }
html body .zhp-hero__visual { grid-area: photo; border-radius: var(--zt-r-lg) !important; background: linear-gradient(165deg, #dbe6fb 0%, #c9d8f4 100%) !important; border: 0 !important; min-height: 460px; box-shadow: none !important; margin: 0 !important; }
html body .zt-sla { grid-area: sla; background: var(--zt-navy); border-radius: var(--zt-r-lg); padding: 24px 28px; color: #e6edf7; }
html body .zt-sla__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 10px; }
html body .zt-sla__head strong { color: #fff; font-size: 17px; }
html body .zt-sla__head a { color: var(--zt-link-navy); font-size: 14px; text-decoration: none; white-space: nowrap; }
html body .zt-sla__row { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; padding: 11px 0; border-top: 1px solid rgba(255, 255, 255, .1); font-size: 14.5px; }
html body .zt-sla__row span { color: var(--zt-onnavy); }
html body .zt-sla__row b { color: #fff; font-size: 15.5px; white-space: nowrap; }
html body .zt-sla__p { font-weight: 700; font-size: 12.5px !important; padding: 4px 9px; border-radius: 999px; background: rgba(255, 255, 255, .08); color: #cfe0ff !important; }
html body .zt-sla__p--1 { background: #e5484d; color: #fff !important; }

/* Task tiles: bento with prices; the first one is the dark feature tile */
html body #services .za-grid-3 { grid-template-columns: repeat(12, 1fr) !important; gap: 20px !important; }
html body #services .za-grid-3 > a { grid-column: span 3; }
html body #services .za-grid-3 > a:first-child { grid-column: span 6; background: var(--zt-navy) !important; border-color: var(--zt-navy) !important; padding: 36px !important; }
html body #services .za-grid-3 > a:first-child h3 { color: #fff !important; font-size: clamp(24px, 2.4vw, 32px) !important; }
html body #services .za-grid-3 > a:first-child p { color: var(--zt-onnavy) !important; font-size: 17px !important; }
html body #services .za-grid-3 > a:first-child > span:last-child { color: var(--zt-link-navy) !important; }
html body #services .za-grid-3 > a:first-child .zt-price { color: #fff; font-size: 28px; border-color: rgba(255, 255, 255, .14); }
html body .zt-price { display: block; margin-top: auto; padding-top: 16px; border-top: 1px solid var(--zt-line); color: var(--zt-ink); font-size: 20px; letter-spacing: -0.02em; font-weight: 740; width: 100%; }
html body main .za-card > span:last-child { margin-top: auto; }
html body main .za-card .zt-price + span:last-child { margin-top: 10px !important; padding-top: 0 !important; }

/* Calculator */
html body .zt-calc { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin: 28px 0 8px; }
html body .zt-calc__panel { background: var(--zt-card); border: 1px solid var(--zt-line); border-radius: var(--zt-r-lg); padding: 32px; }
html body .zt-field + .zt-field { margin-top: 26px; }
html body .zt-field__top { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 12px; }
html body .zt-field__top label { font-weight: 650; color: var(--zt-ink); font-size: 17px; }
html body .zt-field__top output { font-weight: 760; font-size: 26px; color: var(--zt-ink); letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
html body .zt-calc input[type=range] { width: 100%; appearance: none; -webkit-appearance: none; height: 8px; border-radius: 99px; background: linear-gradient(90deg, var(--zt-accent) var(--p, 30%), #dfe6f0 var(--p, 30%)); margin: 8px 0; }
html body .zt-calc input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 28px; height: 28px; border-radius: 50%; background: #fff; border: 2px solid var(--zt-accent); box-shadow: 0 4px 10px rgba(11, 22, 38, .2); cursor: grab; }
html body .zt-calc input[type=range]::-moz-range-thumb { width: 26px; height: 26px; border-radius: 50%; background: #fff; border: 2px solid var(--zt-accent); cursor: grab; }
html body .zt-field small { display: block; color: var(--zt-muted); font-size: 14.5px; margin-top: 8px; }
html body .zt-calc__result { background: var(--zt-accent); color: #fff; border-radius: var(--zt-r-lg); padding: 32px; display: flex; flex-direction: column; }
html body .zt-calc__result small { color: #d6e1ff; font-size: 16px; }
html body .zt-calc__sum { font-size: clamp(48px, 5.4vw, 80px); font-weight: 780; letter-spacing: -0.05em; line-height: 1; margin: 12px 0 8px; font-variant-numeric: tabular-nums; color: #fff; }
html body .zt-calc__sum span { font-size: .36em; font-weight: 650; opacity: .85; letter-spacing: 0; }
html body .zt-calc__formula { color: #dfe7ff; font-size: 15.5px; font-variant-numeric: tabular-nums; }
html body .zt-calc__note { margin-top: auto !important; padding-top: 20px; color: #dfe7ff !important; font-size: 14.5px !important; }

/* Stats strip and cases mosaic */
html body .zhp-stats__grid { border-radius: var(--zt-r) !important; border: 1px solid var(--zt-line) !important; background: #fff !important; }
html body .zp5-cases__grid { display: grid !important; grid-template-columns: repeat(12, 1fr) !important; gap: 20px !important; }
html body .zp5-cases__grid > .zp5-case { grid-column: span 6 !important; grid-row: auto !important; border-radius: var(--zt-r) !important; }
html body .zp5-cases__grid > .zp5-case:first-child { grid-column: span 7 !important; }
html body .zp5-cases__grid > .zp5-case[href*="stroy-kom"] { grid-column: span 5 !important; order: -1; background: var(--zt-navy) !important; border-color: var(--zt-navy) !important; }
html body .zp5-case[href*="stroy-kom"] .zp5-case__visual { display: none !important; }
html body .zp5-case[href*="stroy-kom"] .zp5-case__body { background: transparent !important; justify-content: flex-end; padding: 36px !important; height: 100%; }
html body .zt-big { font-size: clamp(56px, 6vw, 88px); font-weight: 780; letter-spacing: -0.05em; color: #fff; line-height: .95; margin: 8px 0 14px; }
html body .zp5-case[href*="stroy-kom"] :is(h3, p) { color: #e6edf7 !important; }
html body .zp5-case[href*="stroy-kom"] .zp5-case__meta span, html body .zp5-case[href*="stroy-kom"] p { color: var(--zt-onnavy) !important; }
html body .zp5-case[href*="stroy-kom"] :is(.zp5-case__meta b, .zp5-case__link) { color: var(--zt-link-navy) !important; }
html body .zp5-cases__footer { border-radius: var(--zt-r) !important; }

/* Portal, person, request */
html body .zhd-portal__feature { border-radius: 18px !important; }
html body .zhd-portal__screen, html body .zhd-portal__phone { border-radius: 16px !important; }
html body .zhp-person__photo { border-radius: var(--zt-r-lg) !important; overflow: hidden; }
html body .zhp-person__grid { background: var(--zt-card); border: 1px solid var(--zt-line); border-radius: var(--zt-r-lg); padding: clamp(20px, 3vw, 32px); }
html body .zr-request__panel { border-radius: var(--zt-r-lg) !important; border: 1px solid var(--zt-line) !important; box-shadow: none !important; }
html body .zr-request .zr-contacts { border-radius: 32px; margin: 0 auto; width: min(calc(100% - 48px), 1200px); }
html body :is(.zr-form, .za-form) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), textarea, select) { border-radius: 14px !important; }

/* Footer */
html body .zs-footer { border-top: 0 !important; }

/* ---------- Phone ---------- */
@media (max-width: 1080px) {
  html body .zhp-hero__grid { grid-template-columns: 1fr !important; grid-template-rows: none; grid-template-areas: "main" "photo" "sla"; }
  html body #services .za-grid-3 > a, html body #services .za-grid-3 > a:first-child { grid-column: span 12; }
  html body .zt-calc { grid-template-columns: 1fr; }
  html body .zp5-cases__grid > .zp5-case, html body .zp5-cases__grid > .zp5-case:first-child, html body .zp5-cases__grid > .zp5-case[href*="stroy-kom"] { grid-column: span 12 !important; }
}
@media (max-width: 760px) {
  html body .zhp-hero { padding-top: 14px !important; }
  html body .zhp-hero__content { padding: 26px 20px !important; border-radius: 24px; }
  html body .zhp-hero h1 { font-size: clamp(34px, 10.2vw, 44px) !important; }
  html body .zt-facts { grid-template-columns: 1fr; }
  html body .zt-facts div { padding: 12px 0; border-bottom: 1px solid var(--zt-line); display: flex; gap: 14px; align-items: baseline; }
  html body .zt-facts b { font-size: 21px; min-width: 120px; }
  html body .zt-facts span { margin: 0; }
  html body .zhp-hero__visual { min-height: 400px; }
  html body .zhp-founder__facts { display: none !important; }
  html body .zhp-founder { left: auto !important; right: 12px !important; bottom: 12px !important; max-width: 230px !important; padding: 12px 14px !important; }
  html body .zt-sla { padding: 20px; }
  html body .zt-sla__row { grid-template-columns: auto 1fr; }
  html body .zt-sla__row b { grid-column: 2; }
  html body main section.za-hero > .za-container, html body main .zc-hero > :is(.zc-container, .za-container), html body main .zab-hero > .za-container { border-radius: 22px; padding: 24px 18px !important; }
  html body main :is(.zhd-portal, section.za-section.zc-request, .zc-mid-cta, .zc-section--dark, .za-section--dark) > :is(.zhp-shell, .za-container, .zc-container) { border-radius: 24px; padding: 28px 18px !important; }
  html body main :is(.za-card, .zc-link-card, .zc-scope-card) { padding: 22px !important; }
  html body .zt-calc__panel, html body .zt-calc__result { padding: 24px 20px; border-radius: 24px; }
  html body .zhp-person__grid { padding: 14px; }
  html body .zr-request .zr-contacts { width: calc(100% - 24px); border-radius: 24px; }
}
@media (prefers-reduced-motion: reduce) { html body * { transition-duration: .01ms !important; animation: none !important; } }

