:root {
  --yellow: #ffc107;
  --yellow-2: #ffda57;
  --black: #151515;
  --black-2: #202020;
  --blue: #1976d2;
  --blue-2: #0f5fb8;
  --paper: #f5f5f3;
  --white: #ffffff;
  --muted: #686868;
  --line: rgba(21, 21, 21, .11);
  --shadow: 0 24px 70px rgba(15, 22, 33, .12);
  --radius: 28px;
  --container: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body {
  margin: 0;
  color: var(--black);
  background: var(--white);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  line-height: 1.55;
  overflow-x: hidden;
}
body.menu-open { overflow: hidden; }
a { color: inherit; }
img { max-width: 100%; display: block; }
button, input { font: inherit; }
button { cursor: pointer; }
::selection { background: var(--yellow); color: var(--black); }

.skip-link {
  position: fixed; left: 12px; top: -70px; z-index: 9999;
  padding: 12px 16px; border-radius: 12px; background: var(--yellow); color: var(--black);
  font-weight: 900; transition: top .2s;
}
.skip-link:focus { top: 12px; }

.container { width: min(var(--container), calc(100% - 40px)); margin-inline: auto; }
.section { position: relative; padding: 105px 0; }
.section-soft { background: var(--paper); }
.section-dark { color: var(--white); background: var(--black); overflow: hidden; }
.section-dark::before {
  content: ""; position: absolute; width: 520px; height: 520px; right: -160px; top: -220px;
  border-radius: 50%; background: radial-gradient(circle, rgba(255,193,7,.26), transparent 67%);
}
.eyebrow {
  display: inline-flex; align-items: center; gap: 9px; margin-bottom: 16px;
  color: var(--blue); font-size: 13px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase;
}
.eyebrow::before { content: ""; width: 34px; height: 4px; border-radius: 99px; background: var(--yellow); }
.section-dark .eyebrow { color: var(--yellow); }
.title {
  margin: 0; max-width: 900px; font-size: clamp(34px, 5.7vw, 68px); line-height: .98;
  letter-spacing: -.045em; font-weight: 950;
}
.title .accent, .accent { color: var(--yellow); }
.lead { max-width: 750px; margin: 22px 0 0; font-size: clamp(18px, 2.1vw, 22px); color: var(--muted); }
.section-dark .lead { color: rgba(255,255,255,.7); }
.section-head { display: flex; justify-content: space-between; align-items: end; gap: 28px; margin-bottom: 50px; }
.section-head .lead { max-width: 520px; margin: 0; }

.site-header {
  position: fixed; inset: 0 0 auto; z-index: 1000; height: 78px;
  transition: background .25s, box-shadow .25s, transform .25s;
}
.site-header.scrolled { background: rgba(255,255,255,.92); box-shadow: 0 8px 35px rgba(0,0,0,.08); backdrop-filter: blur(15px); }
.header-inner { height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 26px; }
.brand { display: flex; align-items: center; flex: 0 0 auto; text-decoration: none; }
.brand img { width: 195px; height: 64px; object-fit: contain; object-position: left center; }
.nav { display: flex; align-items: center; gap: 25px; }
.nav a { text-decoration: none; font-size: 14px; font-weight: 800; position: relative; }
.nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -7px; height: 3px; background: var(--yellow); transition: right .25s; }
.nav a:hover::after, .nav a:focus-visible::after { right: 0; }
.header-actions { display: flex; align-items: center; gap: 10px; }
.menu-btn { display: none; width: 46px; height: 46px; border: 0; border-radius: 14px; background: var(--paper); }
.menu-btn span { display: block; width: 22px; height: 2px; margin: 5px auto; background: var(--black); transition: transform .25s, opacity .25s; }
.menu-btn.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-btn.active span:nth-child(2) { opacity: 0; }
.menu-btn.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px;
  padding: 0 22px; border: 1px solid transparent; border-radius: 16px; text-decoration: none;
  font-weight: 900; transition: transform .22s, box-shadow .22s, filter .22s, background .22s;
}
.btn:hover { transform: translateY(-3px); }
.btn:active { transform: translateY(0); }
.btn-yellow { color: var(--black); background: var(--yellow); box-shadow: 0 12px 30px rgba(255,193,7,.28); }
.btn-yellow:hover { box-shadow: 0 18px 36px rgba(255,193,7,.38); }
.btn-blue { color: var(--white); background: var(--blue); box-shadow: 0 12px 30px rgba(25,118,210,.22); }
.btn-max { color: var(--white); background: #6f4bff; box-shadow: 0 12px 30px rgba(111,75,255,.25); }
.btn-dark { color: var(--white); background: var(--black); }
.btn-ghost { border-color: rgba(255,255,255,.22); color: var(--white); background: rgba(255,255,255,.07); backdrop-filter: blur(10px); }
.btn-sm { min-height: 44px; padding: 0 16px; border-radius: 14px; font-size: 13px; }
.btn-icon { width: 22px; height: 22px; flex: 0 0 auto; }

.hero {
  min-height: 760px; padding: 130px 0 70px; color: var(--white); background:
    radial-gradient(circle at 14% 30%, rgba(255,193,7,.18), transparent 28%),
    radial-gradient(circle at 90% 80%, rgba(25,118,210,.16), transparent 26%),
    var(--black);
  overflow: hidden;
}
.hero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .13;
  background-image: linear-gradient(rgba(255,255,255,.18) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.18) 1px, transparent 1px);
  background-size: 58px 58px; mask-image: linear-gradient(to bottom, black, transparent 85%);
}
.hero-grid { position: relative; display: grid; grid-template-columns: .92fr 1.08fr; align-items: center; gap: 48px; }
.hero-copy { position: relative; z-index: 2; }
.hero-kicker {
  display: inline-flex; align-items: center; gap: 10px; padding: 8px 13px; border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px; background: rgba(255,255,255,.07); color: var(--yellow); font-size: 13px; font-weight: 900;
}
.hero h1 { margin: 23px 0 22px; font-size: clamp(48px, 6vw, 82px); line-height: .92; letter-spacing: -.055em; font-weight: 950; }
.hero h1 span { display: block; color: var(--yellow); }
.hero-sub { max-width: 600px; margin: 0; color: rgba(255,255,255,.78); font-size: clamp(18px, 2vw, 23px); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.hero-proof { display: flex; flex-wrap: wrap; gap: 12px 18px; margin-top: 28px; color: rgba(255,255,255,.74); font-size: 14px; font-weight: 750; }
.hero-proof span { display: inline-flex; align-items: center; gap: 8px; }
.hero-proof span::before { content: "✓"; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; color: var(--black); background: var(--yellow); font-weight: 950; }
.hero-visual { position: relative; z-index: 1; }
.hero-card {
  position: relative; overflow: hidden; border: 1px solid rgba(255,255,255,.16); border-radius: 34px;
  background: #050505; box-shadow: 0 42px 100px rgba(0,0,0,.45); transform: rotate(1.2deg);
}
.hero-card img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.hero-card::after { content: ""; position: absolute; inset: 0; box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); border-radius: inherit; pointer-events: none; }
.floating-note {
  position: absolute; z-index: 3; right: -22px; bottom: 36px; width: 225px; padding: 17px 18px;
  border-radius: 20px; color: var(--black); background: var(--yellow); box-shadow: var(--shadow); transform: rotate(-3deg);
  animation: float 4.6s ease-in-out infinite;
}
.floating-note strong { display: block; font-size: 18px; line-height: 1.05; }
.floating-note small { display: block; margin-top: 6px; font-weight: 750; }
@keyframes float { 50% { transform: translateY(-10px) rotate(-2deg); } }

.trust-strip { margin-top: -32px; position: relative; z-index: 4; }
.trust-grid {
  display: grid; grid-template-columns: repeat(4,1fr); overflow: hidden; border: 1px solid var(--line); border-radius: 24px;
  background: var(--white); box-shadow: var(--shadow);
}
.trust-item { display: flex; align-items: center; gap: 14px; padding: 22px; border-right: 1px solid var(--line); }
.trust-item:last-child { border-right: 0; }
.icon-box { display: grid; place-items: center; width: 47px; height: 47px; border-radius: 15px; background: #fff4c5; color: var(--black); font-size: 22px; flex: 0 0 auto; }
.trust-item strong { display: block; line-height: 1.15; }
.trust-item small { color: var(--muted); }

.benefits-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.benefit-card {
  position: relative; min-height: 250px; padding: 29px; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--white); transition: transform .3s, box-shadow .3s, border-color .3s;
}
.benefit-card:hover { transform: translateY(-8px); box-shadow: var(--shadow); border-color: rgba(255,193,7,.75); }
.benefit-card .num { position: absolute; right: 22px; top: 17px; color: rgba(21,21,21,.07); font-size: 74px; font-weight: 950; line-height: 1; }
.benefit-card .icon-box { margin-bottom: 35px; background: var(--yellow); }
.benefit-card h3 { margin: 0 0 10px; font-size: 23px; line-height: 1.08; }
.benefit-card p { margin: 0; color: var(--muted); }

.tariff-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: 26px; align-items: stretch; }
.tariff-list { display: grid; gap: 16px; }
.tariff-card { position: relative; padding: 28px; border: 1px solid rgba(255,255,255,.12); border-radius: var(--radius); background: rgba(255,255,255,.06); }
.tariff-card.popular { border-color: var(--yellow); background: rgba(255,193,7,.1); }
.tariff-label { display: inline-block; margin-bottom: 14px; color: var(--yellow); font-size: 13px; font-weight: 950; text-transform: uppercase; letter-spacing: .1em; }
.tariff-price { margin: 0; font-size: 48px; line-height: 1; font-weight: 950; }
.tariff-price small { font-size: 16px; color: rgba(255,255,255,.62); font-weight: 700; }
.tariff-card p { margin: 10px 0 0; color: rgba(255,255,255,.68); }
.calc {
  position: relative; padding: 36px; border-radius: 34px; color: var(--black); background: var(--white); box-shadow: 0 35px 90px rgba(0,0,0,.3);
}
.calc h3 { margin: 0 0 6px; font-size: 30px; line-height: 1.05; }
.calc-sub { margin: 0 0 30px; color: var(--muted); }
.range-top { display: flex; justify-content: space-between; gap: 18px; margin-bottom: 10px; font-weight: 900; }
.range-value { color: var(--blue); }
input[type="range"] { width: 100%; accent-color: var(--yellow); }
.range-marks { display: flex; justify-content: space-between; color: #8a8a8a; font-size: 11px; }
.delivery-toggle { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin: 28px 0; padding: 18px; border-radius: 18px; background: var(--paper); }
.switch { position: relative; width: 54px; height: 31px; flex: 0 0 auto; }
.switch input { position: absolute; opacity: 0; }
.switch span { position: absolute; inset: 0; border-radius: 999px; background: #c8c8c8; transition: .25s; }
.switch span::after { content: ""; position: absolute; width: 23px; height: 23px; left: 4px; top: 4px; border-radius: 50%; background: var(--white); transition: .25s; box-shadow: 0 2px 5px rgba(0,0,0,.22); }
.switch input:checked + span { background: var(--yellow); }
.switch input:checked + span::after { transform: translateX(23px); }
.calc-results { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.calc-result { padding: 19px; border: 1px solid var(--line); border-radius: 18px; }
.calc-result.highlight { grid-column: 1/-1; color: var(--white); background: var(--black); border-color: var(--black); }
.calc-result span { display: block; color: var(--muted); font-size: 13px; }
.calc-result.highlight span { color: rgba(255,255,255,.65); }
.calc-result strong { display: block; margin-top: 4px; font-size: 26px; line-height: 1; }
.calc-note { margin: 16px 0 0; color: var(--muted); font-size: 12px; }

.steps { counter-reset: steps; display: grid; grid-template-columns: repeat(5,1fr); gap: 16px; }
.step { position: relative; padding: 24px 20px; border-radius: 22px; border: 1px solid var(--line); background: var(--white); }
.step::before { counter-increment: steps; content: counter(steps); display: grid; place-items: center; width: 42px; height: 42px; border-radius: 14px; background: var(--yellow); font-weight: 950; }
.step::after { content: ""; position: absolute; left: calc(100% + 3px); top: 44px; width: 10px; height: 2px; background: var(--yellow); }
.step:last-child::after { display: none; }
.step h3 { margin: 25px 0 8px; font-size: 18px; line-height: 1.1; }
.step p { margin: 0; color: var(--muted); font-size: 14px; }

.showcase { display: grid; grid-template-columns: 1.02fr .98fr; gap: 30px; align-items: center; }
.showcase-photo { position: relative; overflow: hidden; border-radius: 34px; box-shadow: var(--shadow); }
.showcase-photo img { width: 100%; min-height: 590px; object-fit: cover; }
.photo-tag { position: absolute; left: 22px; bottom: 22px; padding: 12px 16px; border-radius: 14px; background: rgba(255,255,255,.92); backdrop-filter: blur(8px); font-weight: 900; }
.machine-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 30px; }
.machine-card { padding: 22px; border-radius: 22px; background: var(--paper); border: 1px solid transparent; transition: .25s; }
.machine-card:hover { border-color: var(--yellow); transform: translateY(-4px); }
.machine-card strong { display: block; font-size: 18px; }
.machine-card span { color: var(--muted); font-size: 14px; }

.characters { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: stretch; }
.character-card { position: relative; overflow: hidden; min-height: 520px; border-radius: 34px; background: var(--white); color: var(--black); }
.character-card img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.character-copy { padding: 38px; display: flex; flex-direction: column; justify-content: center; }
.character-copy h3 { margin: 0 0 14px; font-size: 42px; line-height: .98; }
.character-copy p { color: var(--muted); font-size: 18px; }
.sam-quote { margin: 26px 0 0; padding: 21px; border-radius: 0 22px 22px 22px; background: #fff4c5; font-weight: 850; font-size: 19px; }
.character-work { margin-top: 24px; border-radius: 24px; overflow: hidden; border: 1px solid var(--line); }
.character-work img { width: 100%; height: auto; }

.faq-list { max-width: 900px; margin: 0 auto; border-top: 1px solid var(--line); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-button { width: 100%; padding: 24px 0; display: flex; justify-content: space-between; align-items: center; gap: 18px; border: 0; background: transparent; text-align: left; font-size: 19px; font-weight: 900; }
.faq-plus { width: 36px; height: 36px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 12px; background: var(--yellow); transition: transform .25s; }
.faq-item.open .faq-plus { transform: rotate(45deg); }
.faq-answer { max-height: 0; overflow: hidden; transition: max-height .35s ease; }
.faq-answer p { margin: 0; padding: 0 56px 24px 0; color: var(--muted); }

.cta-panel {
  position: relative; overflow: hidden; padding: 60px; border-radius: 38px; color: var(--white);
  background: linear-gradient(120deg, #171717, #272727); box-shadow: var(--shadow);
}
.cta-panel::before { content: ""; position: absolute; width: 380px; height: 380px; right: -80px; top: -150px; border-radius: 50%; background: var(--yellow); opacity: .14; filter: blur(5px); }
.cta-panel h2 { position: relative; margin: 0; max-width: 780px; font-size: clamp(36px,5vw,64px); line-height: .96; letter-spacing: -.04em; }
.cta-panel p { position: relative; max-width: 650px; color: rgba(255,255,255,.72); font-size: 19px; }
.cta-panel .hero-actions { position: relative; }

.footer { padding: 65px 0 25px; color: rgba(255,255,255,.7); background: #0d0d0d; }
.footer-top { display: grid; grid-template-columns: 1.2fr .8fr .8fr; gap: 40px; }
.footer-brand img { width: 225px; filter: brightness(0) invert(1); }
.footer-brand p { max-width: 470px; }
.footer h3 { margin: 0 0 14px; color: var(--white); font-size: 16px; }
.footer-links { display: grid; gap: 10px; }
.footer-links a { text-decoration: none; }
.footer-links a:hover { color: var(--yellow); }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; margin-top: 42px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.1); font-size: 12px; }

.floating-bots { position: fixed; z-index: 900; right: 18px; bottom: 20px; display: grid; gap: 10px; }
.float-btn { display: flex; align-items: center; gap: 10px; min-width: 162px; padding: 13px 16px; border-radius: 17px; color: var(--white); text-decoration: none; font-weight: 900; box-shadow: 0 16px 38px rgba(0,0,0,.23); transition: transform .22s; }
.float-btn:hover { transform: translateX(-5px); }
.float-btn.tg { background: var(--blue); }
.float-btn.max { background: #6f4bff; }

.reveal { opacity: 0; transform: translateY(28px); transition: opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity: 1; transform: none; }
.delay-1 { transition-delay: .08s; }
.delay-2 { transition-delay: .16s; }
.delay-3 { transition-delay: .24s; }

@media (max-width: 1040px) {
  .nav { position: fixed; inset: 78px 0 auto; display: grid; gap: 0; padding: 12px 20px 25px; background: rgba(255,255,255,.97); box-shadow: 0 25px 45px rgba(0,0,0,.12); transform: translateY(-140%); transition: transform .28s; }
  .nav.open { transform: translateY(0); }
  .nav a { padding: 15px 0; border-bottom: 1px solid var(--line); }
  .menu-btn { display: block; }
  .header-actions .btn { display: none; }
  .hero-grid, .tariff-layout, .showcase { grid-template-columns: 1fr; }
  .hero { padding-top: 120px; }
  .hero-visual { max-width: 860px; }
  .trust-grid { grid-template-columns: 1fr 1fr; }
  .trust-item:nth-child(2) { border-right: 0; }
  .trust-item:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .benefits-grid { grid-template-columns: 1fr 1fr; }
  .steps { grid-template-columns: 1fr 1fr; }
  .step::after { display: none; }
}

@media (max-width: 720px) {
  .container { width: min(100% - 28px, var(--container)); }
  .section { padding: 78px 0; }
  .site-header, .header-inner { height: 70px; }
  .nav { inset: 70px 0 auto; }
  .brand img { width: 155px; height: 54px; }
  .hero { min-height: auto; padding: 105px 0 70px; }
  .hero-grid { gap: 34px; }
  .hero h1 { font-size: clamp(43px, 14vw, 66px); }
  .hero-card { border-radius: 24px; transform: none; }
  .hero-card img { aspect-ratio: 4/3; object-position: 54% center; }
  .floating-note { position: static; width: auto; margin: -5px 14px 0; transform: rotate(-1deg); }
  .trust-strip { margin-top: -24px; }
  .trust-grid { grid-template-columns: 1fr; border-radius: 20px; }
  .trust-item { border-right: 0; border-bottom: 1px solid var(--line); }
  .trust-item:last-child { border-bottom: 0; }
  .benefits-grid, .steps, .characters, .footer-top { grid-template-columns: 1fr; }
  .section-head { display: block; }
  .section-head .lead { margin-top: 18px; }
  .tariff-card, .calc { padding: 25px; }
  .calc-results { grid-template-columns: 1fr; }
  .calc-result.highlight { grid-column: auto; }
  .showcase-photo img { min-height: 440px; }
  .machine-cards { grid-template-columns: 1fr; }
  .character-card { min-height: 420px; }
  .character-copy { padding: 30px; }
  .cta-panel { padding: 38px 26px; border-radius: 28px; }
  .footer-bottom { display: grid; }
  .floating-bots { right: 10px; bottom: 10px; }
  .float-btn { min-width: 0; width: 54px; height: 54px; padding: 0; justify-content: center; border-radius: 17px; }
  .float-btn span { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}


/* ===== СВОЙ МАСТЕР v2.2 — современный визуал и анимации ===== */
.header-contact {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  margin-left: auto;
  line-height: 1.1;
}
.header-phone {
  color: var(--black);
  text-decoration: none;
  font-size: 15px;
  font-weight: 950;
  letter-spacing: -.02em;
}
.header-order-note {
  margin-top: 4px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
  white-space: nowrap;
}

.hero {
  min-height: 720px;
  padding-top: 122px;
  background:
    radial-gradient(circle at 18% 24%, rgba(255,193,7,.21), transparent 25%),
    radial-gradient(circle at 82% 75%, rgba(25,118,210,.18), transparent 25%),
    linear-gradient(135deg, #111 0%, #191919 55%, #0c0c0c 100%);
}
.hero-grid {
  grid-template-columns: 1.08fr .92fr;
  gap: clamp(34px, 5vw, 72px);
}
.hero h1 {
  max-width: 730px;
  font-size: clamp(46px, 5.55vw, 78px);
}
.hero h1 > span {
  display: block;
}
.hero h1 .hero-line-white {
  color: #fff;
}
.hero h1 .hero-city {
  margin-top: .12em;
  color: #fff;
  font-size: .58em;
  letter-spacing: -.035em;
}
.hero-kicker {
  box-shadow: inset 0 0 0 1px rgba(255,193,7,.08);
}
.hero-animated-line {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  width: fit-content;
  max-width: 100%;
  margin-top: 22px;
  padding: 10px 15px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 15px;
  background: rgba(255,255,255,.055);
  backdrop-filter: blur(12px);
  overflow: hidden;
}
.hero-animated-label {
  color: rgba(255,255,255,.68);
  font-size: 14px;
  font-weight: 800;
  white-space: nowrap;
}
.word-rotator {
  position: relative;
  display: inline-grid;
  min-width: 250px;
  color: var(--yellow);
  font-size: 15px;
  font-weight: 950;
}
.word {
  grid-area: 1 / 1;
  opacity: 0;
  transform: translateY(14px);
  filter: blur(5px);
  transition: opacity .45s ease, transform .45s ease, filter .45s ease;
  pointer-events: none;
}
.word.active {
  opacity: 1;
  transform: translateY(0);
  filter: blur(0);
}
.hero-visual {
  width: min(100%, 570px);
  margin-left: auto;
  isolation: isolate;
}
.hero-card {
  max-width: 570px;
  border-radius: 30px;
  transform: rotate(.35deg);
  box-shadow:
    0 42px 100px rgba(0,0,0,.48),
    0 0 0 1px rgba(255,193,7,.08);
  animation: heroBreath 6s ease-in-out infinite;
}
.hero-card img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: center;
  transform: scale(1.015);
  transition: transform 1.1s cubic-bezier(.2,.8,.2,1);
}
.hero-card:hover img {
  transform: scale(1.055);
}
.hero-image-shine {
  position: absolute;
  inset: -60% auto -60% -45%;
  width: 28%;
  transform: rotate(18deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.14), transparent);
  animation: imageShine 7s ease-in-out infinite;
  pointer-events: none;
}
.visual-chip {
  position: absolute;
  z-index: 4;
  min-width: 178px;
  padding: 12px 15px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 17px;
  color: #fff;
  background: rgba(17,17,17,.84);
  box-shadow: 0 18px 46px rgba(0,0,0,.32);
  backdrop-filter: blur(16px);
  animation: chipFloat 4.8s ease-in-out infinite;
}
.visual-chip strong,
.visual-chip span { display: block; }
.visual-chip strong { color: var(--yellow); font-size: 14px; }
.visual-chip span { margin-top: 2px; color: rgba(255,255,255,.65); font-size: 11px; font-weight: 750; }
.chip-top { top: 30px; left: -40px; }
.chip-bottom { right: -28px; bottom: 108px; animation-delay: -2.2s; }
.floating-note {
  right: -10px;
  bottom: 18px;
  width: 215px;
}

/* Главные карточки выглядят легче и современнее */
.benefit-card,
.step,
.faq-item,
.machine-card {
  box-shadow: 0 12px 38px rgba(15,22,33,.055);
}
.benefit-card::after {
  content: "";
  position: absolute;
  inset: auto -40px -70px auto;
  width: 130px;
  height: 130px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,193,7,.18), transparent 70%);
  transition: transform .35s ease;
}
.benefit-card:hover::after { transform: scale(1.35); }

/* Персонажи: изображение меньше, чётче, без агрессивного кадрирования */
.characters {
  grid-template-columns: minmax(330px, .82fr) minmax(0, 1.18fr);
  align-items: center;
}
.character-card {
  min-height: 0;
}
.characters > .character-card:first-child {
  max-width: 520px;
  width: 100%;
  margin-inline: auto;
  padding: 22px;
  border: 1px solid rgba(255,255,255,.11);
  background:
    radial-gradient(circle at 50% 18%, rgba(255,193,7,.17), transparent 38%),
    #f8f8f6;
  box-shadow: 0 30px 85px rgba(0,0,0,.34);
}
.characters > .character-card:first-child img {
  width: 100%;
  height: auto;
  max-height: 510px;
  object-fit: contain;
  object-position: center bottom;
  border-radius: 22px;
  filter: contrast(1.035) saturate(1.025);
  transform: translateZ(0);
  transition: transform .7s cubic-bezier(.2,.8,.2,1), filter .7s;
}
.characters > .character-card:first-child:hover img {
  transform: scale(1.025);
  filter: contrast(1.06) saturate(1.05);
}
.character-copy {
  background: linear-gradient(145deg, #fff 0%, #f5f5f3 100%);
}
.character-work img {
  object-fit: contain;
  background: #fff;
}

/* Плавное появление с лёгким масштабом */
.reveal {
  opacity: 0;
  transform: translateY(24px) scale(.985);
  filter: blur(4px);
  transition:
    opacity .8s cubic-bezier(.2,.75,.2,1),
    transform .8s cubic-bezier(.2,.75,.2,1),
    filter .8s ease;
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0) scale(1);
  filter: blur(0);
}

@keyframes heroBreath {
  0%, 100% { transform: translateY(0) rotate(.35deg); }
  50% { transform: translateY(-7px) rotate(0deg); }
}
@keyframes imageShine {
  0%, 18% { left: -45%; opacity: 0; }
  30% { opacity: 1; }
  48%, 100% { left: 125%; opacity: 0; }
}
@keyframes chipFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

@media (max-width: 1180px) {
  .header-order-note { display: none; }
  .header-contact { margin-left: 0; }
}
@media (max-width: 1040px) {
  .hero-grid { grid-template-columns: 1fr 1fr; }
  .hero-visual { width: min(100%, 500px); }
  .visual-chip { display: none; }
  .header-contact { display: none; }
}
@media (max-width: 820px) {
  .hero {
    min-height: auto;
    padding-top: 112px;
  }
  .hero-grid { grid-template-columns: 1fr; }
  .hero-copy { text-align: center; }
  .hero h1, .hero-sub { margin-inline: auto; }
  .hero-actions, .hero-proof { justify-content: center; }
  .hero-animated-line { margin-inline: auto; }
  .hero-visual { width: min(92%, 540px); margin: 18px auto 0; }
  .hero-card { animation-duration: 7s; }
  .characters { grid-template-columns: 1fr; }
  .characters > .character-card:first-child { max-width: 480px; }
}
@media (max-width: 560px) {
  .hero h1 { font-size: clamp(40px, 12vw, 56px); }
  .hero h1 .hero-city { font-size: .5em; line-height: 1.15; }
  .hero-animated-line {
    display: block;
    width: 100%;
    text-align: left;
  }
  .hero-animated-label { display: block; margin-bottom: 3px; }
  .word-rotator { min-width: 0; width: 100%; min-height: 24px; }
  .hero-visual { width: 100%; }
  .floating-note { right: 10px; width: 190px; }
  .characters > .character-card:first-child { padding: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-card,
  .visual-chip,
  .hero-image-shine { animation: none !important; }
  .word { transition: none; }
}

/* ===== PREMIUM VISUAL UPGRADE 3.0 ===== */
:root{
  --gold:#ffc107;
  --gold-soft:#ffe07a;
  --ink:#090909;
  --glass:rgba(255,255,255,.075);
}
body{background:#fff;}
.page-noise{position:fixed;inset:0;z-index:9998;pointer-events:none;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E")}
.cursor-glow{position:fixed;z-index:1;width:420px;height:420px;border-radius:50%;pointer-events:none;left:0;top:0;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(255,193,7,.10),rgba(255,193,7,0) 68%);filter:blur(7px);opacity:0;transition:opacity .25s}
@media(pointer:fine){body:hover .cursor-glow{opacity:1}}
.site-header{border-bottom:1px solid transparent}
.site-header.scrolled{background:rgba(10,10,10,.78)!important;border-bottom-color:rgba(255,255,255,.09);box-shadow:0 16px 50px rgba(0,0,0,.22)}
.site-header.scrolled .nav a,.site-header.scrolled .header-phone{color:#fff}.site-header.scrolled .header-order-note{color:rgba(255,255,255,.65)}
.site-header.scrolled .brand img{filter:brightness(0) invert(1)}
.premium-hero{min-height:850px;padding:125px 0 85px;background:radial-gradient(circle at 8% 35%,rgba(255,193,7,.21),transparent 25%),radial-gradient(circle at 82% 25%,rgba(255,193,7,.13),transparent 22%),linear-gradient(135deg,#070707 0%,#121212 55%,#050505 100%)}
.premium-hero::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 28%,rgba(255,255,255,.045) 44%,transparent 58%);transform:translateX(-100%);animation:heroSweep 9s ease-in-out infinite}
@keyframes heroSweep{0%,55%{transform:translateX(-110%)}80%,100%{transform:translateX(110%)}}
.hero-orb{position:absolute;border-radius:50%;filter:blur(2px);opacity:.7;pointer-events:none}
.orb-one{width:220px;height:220px;right:8%;top:16%;border:1px solid rgba(255,193,7,.25);animation:orbFloat 8s ease-in-out infinite}
.orb-two{width:90px;height:90px;left:4%;bottom:12%;background:radial-gradient(circle,rgba(25,118,210,.35),transparent 70%);animation:orbFloat 6s ease-in-out infinite reverse}
.orb-three{width:14px;height:14px;right:44%;top:22%;background:var(--yellow);box-shadow:0 0 25px var(--yellow);animation:pulseDot 2.3s ease-in-out infinite}
@keyframes orbFloat{50%{transform:translate3d(0,-18px,0) rotate(12deg)}}@keyframes pulseDot{50%{transform:scale(1.7);opacity:.35}}
.hero-grid{grid-template-columns:minmax(0,1.15fr) minmax(370px,.78fr);gap:68px}
.hero h1{font-size:clamp(54px,6.2vw,94px);text-shadow:0 14px 45px rgba(0,0,0,.35)}
.hero h1 .hero-line-white{color:#fff}.hero h1 .hero-city{color:transparent;-webkit-text-stroke:1.5px var(--yellow);text-shadow:0 0 26px rgba(255,193,7,.22)}
.headline-animate>span{opacity:0;transform:translateY(36px);filter:blur(8px);animation:headlineIn .9s cubic-bezier(.18,.8,.2,1) forwards}.headline-animate>span:nth-child(2){animation-delay:.14s}.headline-animate>span:nth-child(3){animation-delay:.28s}
@keyframes headlineIn{to{opacity:1;transform:none;filter:blur(0)}}
.hero-kicker{box-shadow:inset 0 0 0 1px rgba(255,193,7,.10),0 8px 30px rgba(0,0,0,.18);backdrop-filter:blur(18px)}
.hero-animated-line{margin-top:22px;padding:13px 16px;border-left:3px solid var(--yellow);background:linear-gradient(90deg,rgba(255,193,7,.10),transparent);border-radius:0 16px 16px 0}
.word-rotator{min-width:330px}.word{color:var(--yellow);text-shadow:0 0 18px rgba(255,193,7,.28)}
.hero-actions .btn{position:relative;overflow:hidden;isolation:isolate;min-height:58px;padding-inline:26px;border-radius:18px}
.hero-actions .btn::after{content:"";position:absolute;inset:-2px;z-index:-1;background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.35),transparent 75%);transform:translateX(-120%);transition:transform .65s}.hero-actions .btn:hover::after{transform:translateX(120%)}
.hero-visual{max-width:510px;justify-self:end;transform-style:preserve-3d;perspective:1200px}
.hero-card{border-radius:42px;transform:rotate(0);box-shadow:0 45px 120px rgba(0,0,0,.56),0 0 0 1px rgba(255,193,7,.13)}
.hero-card img{aspect-ratio:4/5;object-position:center;transform:scale(1.01);transition:transform 1.1s cubic-bezier(.2,.7,.2,1),filter .8s;filter:saturate(1.06) contrast(1.04)}
.hero-card:hover img{transform:scale(1.055)}
.hero-image-shine{position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.16) 48%,transparent 60%);transform:translateX(-120%);animation:imageShine 7.5s ease-in-out infinite}@keyframes imageShine{0%,60%{transform:translateX(-120%)}85%,100%{transform:translateX(120%)}}
.visual-chip{backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.13);box-shadow:0 15px 45px rgba(0,0,0,.26);animation:chipFloat 5s ease-in-out infinite}.chip-bottom{animation-delay:-2.4s}@keyframes chipFloat{50%{transform:translateY(-9px)}}
.floating-note{right:-35px;bottom:28px;background:linear-gradient(135deg,var(--yellow),#ffe07a);box-shadow:0 22px 60px rgba(255,193,7,.28)}
.brand-marquee{position:relative;overflow:hidden;padding:14px 0;background:#090909;border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,193,7,.18)}
.marquee-track{display:flex;width:max-content;align-items:center;gap:24px;color:#fff;font-size:13px;font-weight:950;letter-spacing:.11em;animation:marquee 28s linear infinite}.marquee-track i{width:7px;height:7px;border-radius:50%;background:var(--yellow);box-shadow:0 0 14px rgba(255,193,7,.7)}@keyframes marquee{to{transform:translateX(-50%)}}
.trust-strip{margin-top:28px}.trust-grid{border-color:rgba(0,0,0,.08);box-shadow:0 28px 80px rgba(18,20,28,.10)}
.benefit-card,.tariff-card,.machine-card,.step{transform-style:preserve-3d;will-change:transform}.tilt-card{transition:transform .22s ease,box-shadow .3s,border-color .3s}
.benefit-card::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(280px circle at var(--mx,50%) var(--my,50%),rgba(255,193,7,.13),transparent 58%);opacity:0;transition:opacity .25s}.benefit-card:hover::after{opacity:1}
.section-dark{background:linear-gradient(140deg,#090909,#171717)}
.tariff-card.popular{box-shadow:0 0 50px rgba(255,193,7,.09)}
.calc{border:1px solid rgba(255,255,255,.65);box-shadow:0 45px 110px rgba(0,0,0,.42)}
.cta-panel{background:radial-gradient(circle at 88% 18%,rgba(255,193,7,.22),transparent 25%),linear-gradient(135deg,#080808,#242424);border:1px solid rgba(255,255,255,.09)}
.reveal{transform:translateY(38px) scale(.985);filter:blur(4px);transition:opacity .85s cubic-bezier(.2,.7,.2,1),transform .85s cubic-bezier(.2,.7,.2,1),filter .85s}.reveal.visible{transform:none;filter:blur(0)}
@media(max-width:1040px){.hero-grid{grid-template-columns:1fr}.hero-visual{justify-self:center;max-width:620px}.premium-hero{padding-top:120px}.site-header.scrolled .brand img{filter:none}}
@media(max-width:720px){.premium-hero{min-height:auto;padding:110px 0 65px}.hero-grid{gap:42px}.hero h1{font-size:clamp(43px,13.5vw,68px)}.hero-visual{max-width:390px}.hero-card{border-radius:28px}.floating-note{right:5px;bottom:18px;width:190px}.visual-chip{display:none}.word-rotator{min-width:0}.cursor-glow{display:none}.marquee-track{font-size:11px;gap:16px}.site-header.scrolled{background:rgba(255,255,255,.94)!important}.site-header.scrolled .nav a,.site-header.scrolled .header-phone{color:var(--black)}}
@media(prefers-reduced-motion:reduce){.premium-hero::after,.hero-orb,.marquee-track,.hero-image-shine,.visual-chip,.headline-animate>span{animation:none!important}.headline-animate>span{opacity:1;transform:none;filter:none}.cursor-glow{display:none}}

/* v3.1 — hero exactly in the approved premium concept */
.site-header{background:rgba(5,5,5,.88);border-bottom:1px solid rgba(255,193,7,.14);backdrop-filter:blur(18px)}
.site-header .nav a,.header-phone{color:#fff}.header-order-note{color:rgba(255,255,255,.66)}
.site-header .brand img{filter:none}.site-header.scrolled{background:rgba(5,5,5,.96)}
.hero-showcase{position:relative;overflow:hidden;padding:96px 0 34px;background:#050505;color:#fff;isolation:isolate}
.hero-showcase:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 28% 30%,rgba(255,193,7,.13),transparent 34%),radial-gradient(circle at 78% 45%,rgba(111,75,255,.09),transparent 26%),linear-gradient(180deg,#050505,#090805);z-index:-2}
.hero-showcase:after{content:"";position:absolute;inset:0;opacity:.16;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:42px 42px;z-index:-1;mask-image:linear-gradient(to bottom,#000,transparent 90%)}
.hero-showcase-inner{position:relative}
.hero-poster{position:relative;overflow:hidden;border-radius:30px;border:1px solid rgba(255,193,7,.24);background:#080808;box-shadow:0 45px 120px rgba(0,0,0,.64),0 0 70px rgba(255,193,7,.08);transform:translateZ(0);animation:posterArrive .95s cubic-bezier(.2,.75,.25,1) both}
.hero-poster img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1),filter .6s ease;filter:saturate(1.03) contrast(1.03)}
.hero-poster:hover img{transform:scale(1.012);filter:saturate(1.08) contrast(1.05)}
.hero-poster-sheen{position:absolute;inset:-40% auto -40% -35%;width:22%;transform:rotate(14deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent);filter:blur(5px);animation:posterSheen 7s ease-in-out infinite;pointer-events:none}
.poster-hotspot{position:absolute;z-index:4;border-radius:18px;transition:.25s ease}
.poster-hotspot:hover{background:rgba(255,255,255,.08);box-shadow:0 0 34px rgba(255,255,255,.16);transform:translateY(-2px)}
.poster-tg{left:39.1%;top:62.1%;width:18.8%;height:8.9%}.poster-max{left:59.8%;top:62.1%;width:19.4%;height:8.9%}
.premium-trustbar{position:relative;z-index:5;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin:-84px 18px 0;padding:20px;border:1px solid rgba(255,193,7,.22);border-radius:26px;background:linear-gradient(180deg,rgba(34,28,12,.94),rgba(16,15,11,.95));box-shadow:0 28px 70px rgba(0,0,0,.45);backdrop-filter:blur(18px)}
.premium-trustbar>div{display:grid;grid-template-columns:54px 1fr;column-gap:14px;padding:12px 20px;border-right:1px solid rgba(255,255,255,.10)}
.premium-trustbar>div:last-child{border-right:0}.premium-trustbar span{grid-row:1/3;display:grid;place-items:center;width:50px;height:50px;border:1px solid rgba(255,193,7,.45);border-radius:16px;color:var(--yellow);font-size:25px;box-shadow:inset 0 0 22px rgba(255,193,7,.08)}
.premium-trustbar strong{align-self:end;font-size:15px}.premium-trustbar small{align-self:start;margin-top:4px;color:rgba(255,255,255,.62);line-height:1.35}
.mobile-hero-copy{display:none}
@keyframes posterArrive{from{opacity:0;transform:translateY(22px) scale(.985)}to{opacity:1;transform:none}}
@keyframes posterSheen{0%,63%{left:-35%;opacity:0}72%{opacity:1}88%,100%{left:120%;opacity:0}}
@media(max-width:1050px){.premium-trustbar{grid-template-columns:1fr 1fr;margin-top:-45px}.premium-trustbar>div:nth-child(2){border-right:0}.premium-trustbar>div{border-bottom:1px solid rgba(255,255,255,.08)}.premium-trustbar>div:nth-child(n+3){border-bottom:0}}
@media(max-width:760px){.hero-showcase{padding-top:78px}.hero-poster{display:none}.mobile-hero-copy{display:block;padding:54px 22px 34px;border:1px solid rgba(255,193,7,.18);border-radius:28px;background:radial-gradient(circle at 50% 0,rgba(255,193,7,.18),transparent 42%),linear-gradient(145deg,#111,#050505);text-align:center;box-shadow:0 30px 80px rgba(0,0,0,.5)}.mobile-hero-copy h1{margin:18px 0;font-size:clamp(40px,12vw,68px);line-height:.88;letter-spacing:-.055em}.mobile-hero-copy h1 span,.mobile-hero-copy h1 strong,.mobile-hero-copy h1 em{display:block}.mobile-hero-copy h1 span{color:#fff}.mobile-hero-copy h1 strong{margin-top:12px;color:var(--yellow);font-size:.72em}.mobile-hero-copy h1 em{margin-top:12px;color:transparent;-webkit-text-stroke:1.4px var(--yellow);font-style:normal;font-size:.60em}.mobile-hero-copy p{color:rgba(255,255,255,.72);font-size:16px}.mobile-hero-actions{display:grid;gap:12px;margin-top:25px}.mobile-hero-actions .btn{justify-content:center}.premium-trustbar{grid-template-columns:1fr;margin:18px 0 0;padding:10px}.premium-trustbar>div{border-right:0;border-bottom:1px solid rgba(255,255,255,.08)!important}.premium-trustbar>div:last-child{border-bottom:0!important}.brand-marquee{margin-top:0}}

/* v3.3 — утверждённый макет с настоящими кликабельными зонами */
.exact-hero{background:#050505;padding:0;margin:0;overflow:hidden}
.exact-hero-wrap{position:relative;width:100%;max-width:1733px;margin:0 auto;background:#050505;line-height:0}
.exact-hero-wrap>img{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none;pointer-events:none}
.exact-hotspot{position:absolute;z-index:30;display:block;border-radius:22px;cursor:pointer;line-height:normal;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.exact-hotspot::after{content:"";position:absolute;inset:0;border-radius:inherit;opacity:0;transition:opacity .22s ease,box-shadow .22s ease,transform .22s ease}
.exact-hotspot:hover::after,.exact-hotspot:focus-visible::after{opacity:1;box-shadow:0 0 0 2px rgba(255,255,255,.7),0 0 34px rgba(0,170,255,.55);transform:scale(1.025)}
.exact-hotspot:focus-visible{outline:3px solid #ffc107;outline-offset:4px}
/* Меню и телефон на утверждённом изображении */
.nav-benefits{left:21.3%;top:5.4%;width:9.6%;height:8.5%}
.nav-prices{left:31.1%;top:5.4%;width:5.3%;height:8.5%}
.nav-how{left:37.0%;top:5.4%;width:8.3%;height:8.5%}
.nav-machines{left:45.5%;top:5.4%;width:6.7%;height:8.5%}
.nav-faq{left:52.5%;top:5.4%;width:6.8%;height:8.5%}
.phone-link{left:60.4%;top:1.7%;width:20.5%;height:11.5%}
/* Реальные ссылки поверх нарисованных кнопок */
.tg-link{left:43.25%;top:76.4%;width:21.85%;height:16.0%;border-radius:22px}
.max-link{left:66.65%;top:76.4%;width:22.65%;height:16.0%;border-radius:22px}
.tg-link:hover::after,.tg-link:focus-visible::after{box-shadow:0 0 0 2px rgba(255,255,255,.8),0 0 42px rgba(0,153,255,.95)}
.max-link:hover::after,.max-link:focus-visible::after{box-shadow:0 0 0 2px rgba(255,255,255,.8),0 0 42px rgba(168,58,255,.95)}
.mobile-quick-actions{display:none}
@media(max-width:760px){
  .exact-hero-wrap{width:100%;overflow:hidden}
  .exact-hero-wrap>img{width:180%;max-width:none;transform:translateX(-21%)}
  .exact-hotspot{display:none}
  .mobile-quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px;background:#090909;position:sticky;top:0;z-index:50}
  .mobile-quick-actions a{display:flex;align-items:center;justify-content:center;min-height:50px;border-radius:14px;font-weight:900;text-decoration:none;color:#fff;background:#161616;border:1px solid rgba(255,255,255,.13)}
  .mobile-quick-actions a:first-child{background:#168de2}.mobile-quick-actions a:nth-child(2){background:#7c2bc5}.mobile-quick-actions a:last-child{display:none}
}

/* v3.4: fixed hero proportions and real clickable Telegram/MAX buttons */
.exact-hero {
  background:#050505;
  overflow:hidden;
}
.exact-hero-wrap {
  position:relative;
  width:min(100%,1733px);
  max-width:1733px;
  aspect-ratio:1733 / 686;
  margin:0 auto;
  background:#050505;
  line-height:0;
  overflow:hidden;
}
.exact-hero-wrap > img {
  display:block;
  width:100% !important;
  height:100% !important;
  max-width:100%;
  object-fit:contain;
  object-position:center center;
  transform:none !important;
}
.hero-real-actions {
  position:absolute;
  z-index:60;
  left:43.2%;
  top:76.2%;
  width:46.2%;
  height:16.3%;
  display:grid;
  grid-template-columns:1fr 1.04fr;
  gap:3.2%;
  line-height:normal;
}
.hero-real-btn {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5.5%;
  width:100%;
  height:100%;
  padding:0 7%;
  border-radius:21px;
  color:#fff;
  text-decoration:none;
  font-family:inherit;
  box-sizing:border-box;
  overflow:hidden;
  isolation:isolate;
  transform:translateZ(0);
  transition:transform .22s ease, filter .22s ease, box-shadow .22s ease;
}
.hero-real-btn::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  border-radius:inherit;
}
.hero-real-btn::after {
  content:"";
  position:absolute;
  top:-120%;
  left:-35%;
  width:24%;
  height:330%;
  z-index:-1;
  transform:rotate(24deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.48),transparent);
  transition:left .6s ease;
}
.hero-real-btn:hover::after,
.hero-real-btn:focus-visible::after { left:120%; }
.hero-real-btn:hover,
.hero-real-btn:focus-visible { transform:translateY(-3px) scale(1.015); filter:brightness(1.08); }
.hero-real-btn:focus-visible { outline:3px solid #fff; outline-offset:4px; }
.hero-real-btn-tg {
  border:2px solid rgba(106,210,255,.85);
  box-shadow:inset 0 0 22px rgba(255,255,255,.2),0 0 18px rgba(0,154,255,.95),0 0 38px rgba(0,154,255,.38);
}
.hero-real-btn-tg::before { background:linear-gradient(135deg,#169fff 0%,#0876e8 52%,#0f58ce 100%); }
.hero-real-btn-max {
  border:2px solid rgba(226,144,255,.9);
  box-shadow:inset 0 0 22px rgba(255,255,255,.18),0 0 18px rgba(173,55,255,.95),0 0 38px rgba(130,31,255,.4);
}
.hero-real-btn-max::before { background:linear-gradient(135deg,#7d31d8 0%,#57169b 54%,#3c0f78 100%); }
.hero-real-icon {
  display:grid;
  place-items:center;
  flex:0 0 auto;
  width:20%;
  aspect-ratio:1;
  font-size:clamp(19px,2.2vw,37px);
  line-height:1;
  transform:rotate(-28deg);
  text-shadow:0 2px 8px rgba(0,0,0,.25);
}
.hero-real-icon-max {
  border:clamp(4px,.42vw,7px) solid #fff;
  border-right-color:transparent;
  border-radius:50%;
  font-size:0;
  transform:none;
}
.hero-real-btn span:last-child { display:block; min-width:0; }
.hero-real-btn strong {
  display:block;
  white-space:nowrap;
  font-size:clamp(12px,1.34vw,24px);
  font-weight:900;
  line-height:1.05;
  letter-spacing:-.02em;
}
.hero-real-btn small {
  display:block;
  margin-top:4%;
  white-space:nowrap;
  font-size:clamp(9px,.86vw,16px);
  font-weight:700;
  color:rgba(255,255,255,.82);
}
.floating-bots { display:none !important; }

@media (max-width:720px) {
  .exact-hero-wrap {
    width:100%;
    aspect-ratio:1733 / 686;
    overflow:hidden;
  }
  .exact-hero-wrap > img {
    width:100% !important;
    height:100% !important;
    object-fit:contain;
    transform:none !important;
  }
  .hero-real-actions { display:none; }
}

/* v3.5 FINAL — cache-safe hero, exact aspect ratio, clickable image buttons */
.exact-hero{width:100%;margin:0;padding:0;background:#050505;overflow:hidden}
.exact-hero-wrap{
  position:relative;
  width:100%;
  max-width:1733px;
  aspect-ratio:1733 / 686;
  margin-inline:auto;
  overflow:hidden;
  background:#050505;
  line-height:0;
}
.exact-hero-wrap>img{
  display:block;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  object-fit:contain!important;
  object-position:50% 50%!important;
  transform:none!important;
  user-select:none;
  pointer-events:none;
}
/* Clickable anchors sit exactly over the two painted buttons. */
.banner-action{
  position:absolute;
  z-index:100;
  top:76.35%;
  height:15.85%;
  display:block;
  border-radius:22px;
  text-decoration:none;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  transition:filter .2s ease,transform .2s ease,box-shadow .2s ease;
}
.banner-action span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.banner-action-tg{left:43.25%;width:21.75%}
.banner-action-max{left:66.7%;width:22.55%}
.banner-action:hover,.banner-action:focus-visible{
  transform:translateY(-2px) scale(1.012);
  filter:brightness(1.12);
  outline:none;
}
.banner-action-tg:hover,.banner-action-tg:focus-visible{box-shadow:0 0 0 2px rgba(255,255,255,.9),0 0 34px rgba(0,153,255,.95),inset 0 0 22px rgba(255,255,255,.14)}
.banner-action-max:hover,.banner-action-max:focus-visible{box-shadow:0 0 0 2px rgba(255,255,255,.9),0 0 34px rgba(177,62,255,.95),inset 0 0 22px rgba(255,255,255,.12)}
.hero-real-actions,.hero-real-btn,.floating-bots{display:none!important}
@media(max-width:720px){
  .exact-hero-wrap{width:100%;aspect-ratio:1733 / 686}
  .exact-hero-wrap>img{width:100%!important;height:100%!important;object-fit:contain!important;transform:none!important}
  .banner-action{display:block}
  .mobile-quick-actions{display:grid}
}

/* ===== SM Ecosystem Website 4.0 — тарифная продуктовая модель ===== */
.tariff-ribbon{display:block;width:min(100% - 28px,1180px);margin:14px auto 0;padding:14px 20px;text-align:center;border-radius:16px;background:linear-gradient(135deg,#ffd400,#ffb800);color:#151515;text-decoration:none;font-weight:950;box-shadow:0 14px 35px rgba(255,190,0,.25);transition:transform .2s ease,box-shadow .2s ease}
.tariff-ribbon:hover{transform:translateY(-2px);box-shadow:0 18px 42px rgba(255,190,0,.35)}
.service-tariffs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:34px}
.service-tariff{position:relative;overflow:hidden;padding:28px;border:1px solid rgba(255,255,255,.12);border-radius:26px;background:linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.035));box-shadow:0 22px 55px rgba(0,0,0,.18)}
.service-tariff::before{content:"";position:absolute;inset:0 0 auto;height:5px;background:#888}
.service-tariff.economy::before{background:#54c878}.service-tariff.standard::before{background:#42a5f5}.service-tariff.plus::before{background:#ff9f1a}.service-tariff.premium::before{background:linear-gradient(90deg,#ffd400,#fff0a1,#ffb300)}
.service-tariff.popular{transform:translateY(-8px);border-color:rgba(255,212,0,.5);box-shadow:0 28px 70px rgba(255,196,0,.13)}
.tariff-topline{display:flex;justify-content:space-between;gap:10px;align-items:center}.tariff-name{font-size:22px;font-weight:950;color:#fff}.tariff-badge{font-size:10px;text-transform:uppercase;letter-spacing:.08em;padding:7px 9px;border-radius:999px;background:rgba(255,255,255,.12);color:rgba(255,255,255,.82);font-weight:900}
.service-tariff .tariff-price{margin:20px 0 10px;color:#ffd400}.service-tariff p{color:rgba(255,255,255,.72);line-height:1.55}.service-tariff ul{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:10px}.service-tariff li{position:relative;padding-left:22px;color:rgba(255,255,255,.88);font-size:14px}.service-tariff li::before{content:"✓";position:absolute;left:0;color:#ffd400;font-weight:950}
.availability-rule{margin:20px 0 0;padding:15px 18px;border:1px solid rgba(255,255,255,.12);border-radius:16px;color:rgba(255,255,255,.66);font-size:13px;text-align:center}
.tariff-tools{display:grid;grid-template-columns:1.05fr .95fr;gap:24px;margin-top:32px}.field-label{display:block;margin:18px 0 8px;font-weight:900}.tariff-select{width:100%;padding:15px 16px;border:1px solid var(--line);border-radius:15px;background:#fff;color:#151515;font:inherit;font-weight:800;outline:none}.tariff-select:focus{border-color:#f1ba00;box-shadow:0 0 0 4px rgba(255,212,0,.18)}
.depth-guide{padding:34px;border-radius:28px;background:linear-gradient(145deg,#fdfdfd,#f0f0f0);color:#151515;box-shadow:var(--shadow)}.depth-guide h3{margin:8px 0 20px;font-size:clamp(28px,3vw,42px);line-height:1.05}.depth-diagram{position:relative;height:300px;margin:24px 0;border-radius:22px;background:#e9e9e9;overflow:hidden;border:1px solid #d6d6d6}.wall{position:absolute;left:0;right:0;top:0;height:42px;background:#333;color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;letter-spacing:.18em;font-weight:900}.washer-top{position:absolute;left:23%;right:23%;top:80px;bottom:38px;border-radius:14px;background:linear-gradient(145deg,#fff,#cfcfcf);border:3px solid #aaa;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;box-shadow:0 18px 35px rgba(0,0,0,.18)}.washer-top span{font-size:11px;color:#666;text-transform:uppercase;letter-spacing:.12em}.washer-top strong{margin-top:8px}.depth-arrow{position:absolute;right:8%;top:55px;bottom:25px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px}.depth-arrow span{font-size:54px;color:#f3b800;line-height:1}.depth-arrow b{font-size:11px;writing-mode:vertical-rl;transform:rotate(180deg);letter-spacing:.08em}.depth-options{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}.depth-options span{padding:9px 12px;border-radius:999px;background:#171717;color:#fff;font-size:12px;font-weight:900}.depth-help{padding:14px 16px;border-left:4px solid #ffd400;background:#fff;border-radius:0 14px 14px 0;color:#555}
.steps-six{grid-template-columns:repeat(3,1fr)}
.floating-tariffs{position:fixed;z-index:901;left:18px;bottom:20px;display:flex;align-items:center;gap:9px;padding:14px 17px;border-radius:17px;background:linear-gradient(135deg,#ffd400,#ffb800);color:#151515;text-decoration:none;font-weight:950;box-shadow:0 16px 38px rgba(0,0,0,.23);transition:transform .2s}.floating-tariffs:hover{transform:translateY(-4px)}
@media(max-width:1100px){.service-tariffs{grid-template-columns:repeat(2,1fr)}.tariff-tools{grid-template-columns:1fr}}
@media(max-width:720px){.service-tariffs{grid-template-columns:1fr}.service-tariff.popular{transform:none}.steps-six{grid-template-columns:1fr}.depth-guide{padding:25px}.depth-diagram{height:260px}.washer-top{left:12%;right:32%}.depth-arrow{right:6%}.floating-tariffs{left:10px;bottom:74px;width:54px;height:54px;padding:0;justify-content:center}.floating-tariffs span{display:none}.mobile-quick-actions{grid-template-columns:repeat(4,1fr)!important}.tariff-ribbon{font-size:14px}}

/* v4.2 — approved Evolution hero: original image proportions, larger logo, centered compact CTAs */
.hero-site-header{position:relative;z-index:100;background:#050505;border-bottom:1px solid rgba(255,193,7,.18)}
.hero-header-inner{width:min(100% - 40px,1500px);height:86px;margin:0 auto;display:flex;align-items:center;gap:26px}
.hero-brand{display:flex;align-items:center;flex:0 0 auto}
.hero-brand img{display:block;width:clamp(210px,17vw,290px);height:auto;max-height:76px;object-fit:contain}
.hero-nav{display:flex;align-items:center;justify-content:center;gap:clamp(18px,2vw,36px);margin-left:auto}
.hero-nav a,.hero-phone{color:#fff;text-decoration:none;font-weight:850;white-space:nowrap}
.hero-nav a{font-size:15px;opacity:.9;transition:.2s}.hero-nav a:hover{color:#ffc107;opacity:1}
.hero-phone{font-size:16px}
.hero-order{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 24px;border-radius:999px;background:linear-gradient(135deg,#ffd21a,#ffb800);color:#111;text-decoration:none;font-weight:950;white-space:nowrap;box-shadow:0 0 25px rgba(255,193,7,.28)}
.hero-v42 .exact-hero-wrap{position:relative;width:min(100%,1733px);aspect-ratio:1733/686;margin:0 auto;background:#050505;overflow:hidden}
.hero-v42 .exact-hero-wrap>img{display:block;width:100%!important;height:100%!important;object-fit:contain!important;object-position:center!important;transform:none!important}
.hero-price-pill{position:absolute;z-index:20;left:45.4%;top:66.7%;width:24.6%;height:9.8%;display:flex;align-items:center;justify-content:center;gap:4%;border:2px solid rgba(255,193,7,.75);border-radius:16px;background:rgba(7,7,7,.90);box-shadow:inset 0 0 18px rgba(255,193,7,.08),0 0 22px rgba(255,193,7,.16);color:#fff;font-size:clamp(12px,1.38vw,25px);font-weight:850;line-height:1;backdrop-filter:blur(8px)}
.hero-price-pill strong{color:#ffc107;font-size:1.35em}.price-tag{font-size:1.05em}
.hero-three-actions{position:absolute;z-index:25;left:42.8%;top:78.0%;width:48.7%;height:13.7%;display:grid;grid-template-columns:1fr 1.18fr 1.12fr;gap:1.65%;align-items:stretch}
.hero-action{position:relative;display:flex;align-items:center;justify-content:center;gap:7%;min-width:0;height:100%;padding:0 6%;border-radius:17px;color:#fff;text-decoration:none;overflow:hidden;isolation:isolate;box-sizing:border-box;transition:transform .2s ease,filter .2s ease,box-shadow .2s ease}
.hero-action:hover,.hero-action:focus-visible{transform:translateY(-3px) scale(1.012);filter:brightness(1.07)}
.hero-action::after{content:"";position:absolute;top:-130%;left:-45%;width:22%;height:360%;transform:rotate(24deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.44),transparent);transition:left .65s}.hero-action:hover::after{left:125%}
.hero-action-tariff{background:linear-gradient(135deg,#ffd21a,#f3a900);border:2px solid #ffe681;color:#161616;box-shadow:inset 0 0 18px rgba(255,255,255,.35),0 0 22px rgba(255,193,7,.45)}
.hero-action-tg{background:linear-gradient(135deg,#179fff,#075fd5);border:2px solid rgba(125,218,255,.9);box-shadow:inset 0 0 18px rgba(255,255,255,.2),0 0 22px rgba(0,144,255,.48)}
.hero-action-max{background:linear-gradient(135deg,#7a2fd4,#4a0d88);border:2px solid rgba(224,145,255,.9);box-shadow:inset 0 0 18px rgba(255,255,255,.18),0 0 22px rgba(165,55,255,.5)}
.hero-action-icon{flex:0 0 auto;font-size:clamp(16px,1.8vw,32px);line-height:1}.hero-action-tg .hero-action-icon{transform:rotate(-28deg)}
.max-ring{width:clamp(20px,2vw,36px);height:clamp(20px,2vw,36px);border:clamp(3px,.34vw,6px) solid #fff;border-right-color:transparent;border-radius:50%;box-sizing:border-box}
.hero-action span:last-child{min-width:0}.hero-action strong{display:block;white-space:nowrap;font-size:clamp(9px,1.02vw,18px);line-height:1.05;font-weight:950;letter-spacing:-.015em}.hero-action small{display:block;margin-top:4px;white-space:nowrap;font-size:clamp(7px,.68vw,12px);line-height:1;color:currentColor;opacity:.82;font-weight:750}
@media(max-width:1250px){.hero-phone{display:none}.hero-nav{gap:18px}.hero-header-inner{gap:16px}.hero-order{padding-inline:18px}}
@media(max-width:900px){.hero-nav{display:none}.hero-header-inner{height:74px}.hero-brand img{width:220px}.hero-order{margin-left:auto}.hero-price-pill,.hero-three-actions{display:none}.mobile-quick-actions{display:grid}}
@media(max-width:560px){.hero-header-inner{width:min(100% - 24px,1500px)}.hero-brand img{width:185px}.hero-order{min-height:44px;padding:0 15px;font-size:13px}.hero-v42 .exact-hero-wrap{aspect-ratio:1733/686}.hero-v42 .exact-hero-wrap>img{object-fit:contain!important}}

/* v4.4 — readability polish: larger brand, fully readable CTA group, premium sticky header */
.hero-site-header{
  position:sticky;
  top:0;
  z-index:1000;
  background:rgba(5,5,5,.92);
  border-bottom:1px solid rgba(255,193,7,.20);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  box-shadow:0 12px 35px rgba(0,0,0,.18);
}
.hero-header-inner{height:94px}
.hero-brand img{
  width:clamp(245px,19vw,335px);
  max-height:84px;
}
.hero-order{min-height:54px;padding-inline:27px}

/* CTA area uses two rows: tariff button above, messengers below */
.hero-three-actions{
  left:42.8%;
  top:76.0%;
  width:48.7%;
  height:19.2%;
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:46% 54%;
  column-gap:2.2%;
  row-gap:8%;
  align-items:stretch;
}
.hero-action-tariff{grid-column:1 / -1;width:68%;justify-self:center}
.hero-action-tg,.hero-action-max{width:100%}
.hero-action{
  gap:5%;
  padding:0 5%;
  border-radius:15px;
}
.hero-action strong{
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  font-size:clamp(10px,1.00vw,18px);
  line-height:1.12;
  text-align:left;
}
.hero-action small{
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  font-size:clamp(7px,.66vw,12px);
  line-height:1.15;
  text-align:left;
}
.hero-action-tariff strong,.hero-action-tariff small{text-align:center}
.hero-action-icon{font-size:clamp(15px,1.55vw,28px)}
.max-ring{width:clamp(18px,1.8vw,32px);height:clamp(18px,1.8vw,32px)}

/* Clearer price proposition */
.hero-price-pill{top:64.7%;height:9.2%}
.hero-price-pill::before{
  content:"Аренда";
  margin-right:.35em;
  color:rgba(255,255,255,.76);
  font-size:.68em;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}

/* Gentle premium interaction without aggressive movement */
.hero-action:hover,.hero-action:focus-visible{transform:translateY(-2px);filter:brightness(1.06)}

@media(max-width:1250px){
  .hero-brand img{width:clamp(225px,18vw,290px)}
  .hero-header-inner{height:88px}
  .hero-three-actions{left:42.2%;width:50.2%}
  .hero-action strong{font-size:clamp(9px,.98vw,16px)}
}
@media(max-width:900px){
  .hero-site-header{position:sticky}
  .hero-header-inner{height:76px}
  .hero-brand img{width:230px;max-height:68px}
  .hero-price-pill,.hero-three-actions{display:none}
}
@media(max-width:560px){
  .hero-brand img{width:195px}
}

/* ===== SM Ecosystem Website 5.0 — Service Levels & Tariff Advisor ===== */
.tariff-question{max-width:850px;margin:28px auto 0;text-align:center;color:rgba(255,255,255,.72);font-size:17px;line-height:1.55}
.tariff-question span{display:block;color:#ffd400;font-size:13px;font-weight:950;letter-spacing:.12em;text-transform:uppercase;margin-bottom:6px}
.tariff-question strong{color:#fff;font-size:clamp(18px,2vw,25px)}
.service-tariffs-v50{align-items:stretch;margin-top:30px}
.service-tariffs-v50 .service-tariff{display:flex;flex-direction:column;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.service-tariffs-v50 .service-tariff:hover{transform:translateY(-7px);border-color:rgba(255,212,0,.55);box-shadow:0 32px 85px rgba(0,0,0,.32),0 0 35px rgba(255,212,0,.08)}
.service-tariffs-v50 .service-tariff.popular:hover{transform:translateY(-13px)}
.tariff-for{margin-top:18px;padding:11px 13px;border-radius:14px;background:rgba(255,255,255,.07);color:#fff;font-size:14px;font-weight:850}
.service-tariffs-v50 .service-tariff ul{margin-bottom:25px}
.tariff-choose{display:flex;align-items:center;justify-content:center;min-height:52px;margin-top:auto;padding:12px 14px;border-radius:15px;background:#ffd400;color:#151515;text-align:center;text-decoration:none;font-weight:950;line-height:1.2;box-shadow:0 12px 30px rgba(255,196,0,.16);transition:transform .2s ease,filter .2s ease}
.tariff-choose:hover{transform:translateY(-2px);filter:brightness(1.05)}
.tariff-choose-economy{background:#72dd91}
.recommend-ribbon{position:absolute;top:0;right:18px;padding:8px 12px;border-radius:0 0 12px 12px;background:#ffd400;color:#151515;font-size:11px;font-weight:950;text-transform:uppercase;letter-spacing:.04em}
.tariff-advisor{display:grid;grid-template-columns:.8fr 1.15fr;gap:28px;margin:40px 0 34px;padding:34px;border-radius:28px;border:1px solid rgba(255,212,0,.32);background:radial-gradient(circle at 10% 10%,rgba(255,212,0,.11),transparent 32%),rgba(255,255,255,.055);box-shadow:0 28px 75px rgba(0,0,0,.28)}
.advisor-copy h3{margin:8px 0 12px;color:#fff;font-size:clamp(27px,3vw,40px);line-height:1.05}
.advisor-copy p{margin:0;color:rgba(255,255,255,.7);line-height:1.6}
.advisor-form{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}
.advisor-form label{display:grid;gap:8px;color:rgba(255,255,255,.8);font-size:13px;font-weight:800}
.advisor-form select{width:100%;min-height:50px;padding:0 13px;border:1px solid rgba(255,255,255,.17);border-radius:14px;background:#232323;color:#fff;font:inherit}
.advisor-submit{grid-column:1/-1;min-height:54px;border:0;border-radius:15px;background:#ffd400;color:#151515;font-size:16px;font-weight:950;cursor:pointer;box-shadow:0 14px 32px rgba(255,196,0,.18)}
.advisor-result{grid-column:1/-1;padding:25px;border-radius:20px;background:#fff;color:#1b1b1b}
.advisor-result>span{display:block;color:#777;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.11em}
.advisor-result>strong{display:block;margin:4px 0 8px;font-size:35px;color:#151515}
.advisor-result p{margin:0 0 18px;color:#555;line-height:1.5}
.advisor-actions{display:flex;flex-wrap:wrap;gap:10px}
.advisor-actions a{padding:12px 16px;border-radius:13px;background:#1c9bea;color:#fff;text-decoration:none;font-weight:900}
.advisor-actions a:last-child{background:#6f4bff}
@media(max-width:1100px){.tariff-advisor{grid-template-columns:1fr}.advisor-form{grid-template-columns:1fr 1fr}.advisor-submit{grid-column:1/-1}}
@media(max-width:720px){.advisor-form{grid-template-columns:1fr}.advisor-submit{grid-column:auto}.tariff-advisor{padding:24px 18px}.recommend-ribbon{position:static;display:inline-flex;align-self:flex-start;margin:-28px 0 18px;padding:7px 10px;border-radius:0 0 10px 10px}.service-tariffs-v50 .service-tariff.popular:hover{transform:translateY(-7px)}}
.service-tariff.advisor-highlight{border-color:#ffd400!important;box-shadow:0 0 0 2px rgba(255,212,0,.28),0 32px 85px rgba(0,0,0,.34)!important}

/* ===== SM Ecosystem Website 5.1 — Approved Visual Rebuild ===== */
.hero-header-v51{background:#050505;border-bottom:1px solid rgba(255,193,7,.38);box-shadow:none}
.hero-header-v51 .hero-header-inner{width:min(100% - 46px,1540px);height:96px;gap:24px}
.hero-brand-v51{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-width:300px}
.hero-brand-v51 img{width:285px!important;max-height:72px!important;object-fit:contain;object-position:left center;filter:drop-shadow(0 0 12px rgba(255,193,7,.08))}
.hero-brand-v51 small{margin:1px 0 0 72px;color:rgba(255,255,255,.78);font-size:11px;font-weight:750;letter-spacing:.015em}
.hero-header-v51 .hero-nav{margin-left:auto;gap:clamp(18px,2vw,35px)}
.hero-header-v51 .hero-nav a{font-size:16px;font-weight:880}
.hero-contact-v51{display:flex;flex-direction:column;align-items:flex-start;gap:3px;white-space:nowrap}
.hero-phone-v51{display:flex;align-items:center;gap:8px;color:#fff;text-decoration:none;font-size:17px;font-weight:950}
.hero-phone-v51 span{color:#ffc107;font-size:21px}
.hero-contact-v51 small{padding-left:29px;color:rgba(255,255,255,.58);font-size:11px}
.hero-header-v51 .hero-order{min-height:52px;padding:0 30px;border-radius:13px;font-size:15px}

.hero-v51{background:#030303}
.hero-v51 .exact-hero-wrap{position:relative;width:min(100%,1733px);aspect-ratio:1733/686;margin:0 auto;background:#030303;overflow:hidden}
.hero-v51 .exact-hero-wrap>img{display:block;width:100%!important;height:100%!important;object-fit:contain!important;object-position:center!important;transform:none!important}
.hero-care-badge{position:absolute;left:43.8%;top:4.8%;width:27.8%;height:5.8%;display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid rgba(255,193,7,.62);border-radius:999px;background:rgba(7,7,7,.78);color:#fff;font-size:clamp(8px,.78vw,14px);font-weight:800;line-height:1;letter-spacing:.01em;text-transform:uppercase;backdrop-filter:blur(8px)}
.hero-care-badge span{color:#ffc107}
.hero-service-card{position:absolute;z-index:20;left:43.7%;top:54.3%;width:37.4%;height:12.4%;display:grid;grid-template-columns:12% 42% 1px 46%;align-items:center;border:2px solid rgba(255,193,7,.72);border-radius:17px;background:rgba(7,7,7,.91);box-shadow:inset 0 0 24px rgba(255,193,7,.06),0 0 25px rgba(255,193,7,.10);color:#fff;line-height:1;backdrop-filter:blur(10px)}
.hero-service-icon{display:grid;place-items:center;width:clamp(30px,3.2vw,54px);height:clamp(30px,3.2vw,54px);margin:auto;border:3px solid #ffc107;border-radius:50%;color:#ffc107;font-size:clamp(15px,1.65vw,28px)}
.hero-service-name{display:flex;flex-direction:column;justify-content:center;min-width:0;padding-left:1%}
.hero-service-name small{color:#ffc107;font-size:clamp(7px,.68vw,12px);font-weight:950;text-transform:uppercase;letter-spacing:.05em}
.hero-service-name strong{margin-top:3px;font-size:clamp(15px,1.55vw,27px);text-transform:uppercase}
.hero-service-name span{margin-top:5px;color:rgba(255,255,255,.7);font-size:clamp(7px,.64vw,11px)}
.hero-service-divider{width:1px;height:58%;background:rgba(255,193,7,.65)}
.hero-service-price{display:flex;align-items:baseline;justify-content:center;gap:7px;white-space:nowrap}
.hero-service-price strong{color:#ffc107;font-size:clamp(23px,2.6vw,45px);font-weight:950}
.hero-service-price span{font-size:clamp(10px,1.15vw,20px);font-weight:900}
.hero-actions-v51{position:absolute;z-index:22;left:43.7%;top:68.5%;width:42.8%;height:17.2%;display:grid;grid-template-rows:45% 51%;gap:8%}
.hero-actions-v51 .hero-action{border-radius:14px}
.hero-actions-v51>.hero-action-tariff{width:100%;height:100%}
.hero-messenger-row{display:grid;grid-template-columns:1fr 1fr;gap:2.5%;height:100%}
.hero-actions-v51 .hero-action strong{font-size:clamp(9px,1vw,17px);white-space:nowrap;text-align:left}
.hero-actions-v51 .hero-action small{font-size:clamp(7px,.66vw,11px);white-space:nowrap;text-align:left}
.hero-actions-v51 .hero-action-tariff strong,.hero-actions-v51 .hero-action-tariff small{text-align:center}
.hero-benefits-v51{position:absolute;z-index:25;left:8.1%;right:8.1%;bottom:1.8%;height:12.8%;display:grid;grid-template-columns:repeat(4,1fr);border:1px solid rgba(255,193,7,.40);border-radius:21px;background:linear-gradient(180deg,rgba(30,30,30,.94),rgba(8,8,8,.94));box-shadow:0 18px 45px rgba(0,0,0,.3);backdrop-filter:blur(12px);overflow:hidden}
.hero-benefits-v51>div{display:flex;align-items:center;justify-content:center;gap:12px;padding:0 18px;border-right:1px solid rgba(255,255,255,.14)}
.hero-benefits-v51>div:last-child{border-right:0}
.benefit-icon{display:grid;place-items:center;flex:0 0 auto;width:clamp(34px,3.6vw,58px);height:clamp(34px,3.6vw,58px);border:2px solid rgba(255,193,7,.65);border-radius:14px;color:#ffc107;font-size:clamp(18px,2vw,31px)}
.hero-benefits-v51 p{margin:0;line-height:1.1}
.hero-benefits-v51 strong{display:block;color:#fff;font-size:clamp(9px,.95vw,16px)}
.hero-benefits-v51 small{display:block;margin-top:6px;color:rgba(255,255,255,.72);font-size:clamp(7px,.68vw,11px)}
.section-v51-benefits{padding-top:68px;background:#fff}
.section-v51-benefits .section-head{margin-bottom:38px}

@media(max-width:1350px){
  .hero-brand-v51{min-width:250px}.hero-brand-v51 img{width:245px!important}.hero-brand-v51 small{margin-left:60px}
  .hero-contact-v51{display:none}
  .hero-header-v51 .hero-nav{gap:20px}
}
@media(max-width:1050px){
  .hero-header-v51 .hero-nav{display:none}.hero-header-v51 .hero-header-inner{height:78px}.hero-brand-v51{min-width:0}.hero-brand-v51 img{width:220px!important;max-height:60px!important}.hero-brand-v51 small{display:none}.hero-header-v51 .hero-order{margin-left:auto}
}
@media(max-width:900px){
  .hero-care-badge,.hero-service-card,.hero-actions-v51,.hero-benefits-v51{display:none}
  .hero-v51 .exact-hero-wrap{aspect-ratio:1733/686}
  .mobile-quick-actions{display:grid}
}
@media(max-width:560px){
  .hero-header-v51 .hero-header-inner{width:min(100% - 22px,1540px);height:70px}.hero-brand-v51 img{width:175px!important}.hero-header-v51 .hero-order{min-height:43px;padding:0 14px;font-size:12px}
}


/* === SM Website 5.2: clean logo + Russia city selector === */
.header-brand-city{display:flex;align-items:center;gap:18px;min-width:0;flex:0 1 auto}
.hero-brand-v51{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;min-width:230px}
.hero-brand-v51 img{width:250px!important;height:auto!important;max-height:82px!important;object-fit:contain;filter:drop-shadow(0 4px 15px rgba(0,0,0,.38))}
.hero-brand-v51 small{color:#f5f5f5!important;margin-top:-5px!important;padding-left:75px!important;font-size:11px!important;letter-spacing:.03em!important}
.city-selector{position:relative;z-index:120;min-width:165px;color:#fff}
.city-label{display:block;margin:0 0 5px 2px;font-size:12px;color:#d9d9d9;white-space:nowrap}
.city-trigger{width:100%;min-height:42px;padding:0 38px 0 13px;border:1px solid rgba(255,192,0,.75);border-radius:10px;background:linear-gradient(180deg,#181818,#0e0e0e);color:#fff;text-align:left;font:700 14px/1.2 inherit;cursor:pointer;position:relative;transition:.2s ease}
.city-trigger:hover,.city-trigger[aria-expanded="true"]{border-color:#ffc400;box-shadow:0 0 0 3px rgba(255,196,0,.11),0 8px 26px rgba(0,0,0,.35)}
.city-trigger i{position:absolute;right:14px;top:50%;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:7px solid #ffc400;transform:translateY(-30%);transition:.2s}
.city-trigger[aria-expanded="true"] i{transform:translateY(-50%) rotate(180deg)}
.city-panel{position:absolute;left:0;top:calc(100% + 9px);width:min(340px,90vw);padding:12px;background:rgba(16,16,16,.98);border:1px solid rgba(255,196,0,.55);border-radius:14px;box-shadow:0 22px 65px rgba(0,0,0,.65);backdrop-filter:blur(18px)}
.city-search-wrap{display:flex;align-items:center;position:relative;margin-bottom:10px}
.city-search-wrap input{width:100%;height:42px;padding:0 40px 0 12px;border:1px solid #505050;border-radius:9px;background:#222;color:#fff;font:600 14px inherit;outline:none}
.city-search-wrap input:focus{border-color:#ffc400;box-shadow:0 0 0 3px rgba(255,196,0,.12)}
.city-search-wrap b{position:absolute;right:13px;color:#fff;font-size:22px;font-weight:400;pointer-events:none}
.city-panel-title{padding:3px 5px 9px;color:#bdbdbd;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.city-list{max-height:330px;overflow:auto;overscroll-behavior:contain;padding-right:3px;scrollbar-color:#ffc400 #252525;scrollbar-width:thin}
.city-option{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px;border:0;border-radius:8px;background:transparent;color:#f6f6f6;text-align:left;font:700 14px inherit;cursor:pointer}
.city-option small{display:block;margin-top:2px;color:#8f8f8f;font-size:11px;font-weight:500}
.city-option:hover,.city-option.active{background:linear-gradient(90deg,rgba(255,192,0,.2),rgba(255,192,0,.05));color:#ffc400}
.city-option .check{color:#ffc400;opacity:0}.city-option.active .check{opacity:1}
.city-empty{padding:24px 10px;text-align:center;color:#aaa}
.city-notice{position:fixed;z-index:500;top:105px;left:50%;transform:translateX(-50%);max-width:min(600px,calc(100% - 30px));padding:13px 18px;border:1px solid rgba(255,196,0,.65);border-radius:12px;background:#151515;color:#fff;box-shadow:0 14px 45px rgba(0,0,0,.55);font-weight:700;text-align:center}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:1380px){.header-brand-city{gap:10px}.hero-brand-v51 img{width:210px!important}.hero-brand-v51{min-width:195px}.city-selector{min-width:145px}.hero-nav{gap:18px!important}.hero-contact-v51{display:none!important}}
@media(max-width:1100px){.city-selector{display:none}.hero-brand-v51 img{width:220px!important}.hero-brand-v51 small{padding-left:65px!important}.hero-header-inner{gap:10px!important}}
@media(max-width:760px){.hero-brand-v51 img{width:185px!important}.hero-brand-v51 small{display:none!important}.city-notice{top:78px;font-size:13px}}

/* v5.3 — approved hero spacing: full character head and clear CTA/benefits separation */
.hero-v51 .exact-hero-wrap{
  width:min(100%,1733px);
  aspect-ratio:1733 / 765;
  background:#030303;
  overflow:hidden;
}
.hero-v51 .exact-hero-wrap>img{
  position:absolute;
  left:0;
  top:20px;
  width:100%!important;
  height:auto!important;
  max-height:686px;
  object-fit:contain!important;
  object-position:center top!important;
}
/* Keep the master’s full head visible below the sticky navigation. */
.hero-care-badge{top:6.2%}
.hero-service-card{top:50.8%}
.hero-actions-v51{
  top:64.2%;
  height:16.2%;
  gap:7%;
}
/* Benefits are now a separate lower row and never overlap action buttons. */
.hero-benefits-v51{
  left:5.5%;
  right:5.5%;
  bottom:2.2%;
  height:12.2%;
  z-index:15;
}
.hero-benefits-v51>div{padding-inline:14px}

/* Header follows the approved compact visual and leaves more width for navigation. */
.hero-header-inner{
  width:min(100% - 34px,1600px);
  height:104px;
  gap:18px;
}
.hero-brand-v51{min-width:245px}
.hero-brand-v51 img{width:240px!important;max-height:82px!important}
.hero-brand-v51 small{padding-left:70px!important}
.city-selector{min-width:180px}
.hero-nav{gap:clamp(15px,1.55vw,28px)!important}

@media(max-width:1380px){
  .hero-header-inner{height:94px}
  .hero-brand-v51{min-width:205px}
  .hero-brand-v51 img{width:205px!important}
  .city-selector{min-width:150px}
}
@media(max-width:900px){
  .hero-v51 .exact-hero-wrap{aspect-ratio:1733/765}
  .hero-v51 .exact-hero-wrap>img{top:12px}
}


/* =========================================================
   SM Ecosystem Website 5.6 — REFERENCE APPROVED VISUAL
   Desktop first screen is the approved 1536×1024 composition.
   ========================================================= */
html{scroll-behavior:smooth}
body{overflow-x:hidden;background:#000}
.page-noise,.cursor-glow{display:none!important}
.approved-visual-stage{position:relative;z-index:1;width:100%;aspect-ratio:3/2;margin:0;background:#000;overflow:hidden;line-height:normal}
.approved-visual-image{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:fill;user-select:none;-webkit-user-drag:none;pointer-events:none}
.approved-visual-interactions{position:absolute;inset:0;z-index:5}
.stage-hotspot{position:absolute;display:block;border:0;border-radius:12px;background:transparent;color:transparent;text-indent:-9999px;overflow:hidden;cursor:pointer;text-decoration:none;outline:0}
.stage-hotspot::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 0 rgba(255,193,7,0);transition:box-shadow .18s ease,background .18s ease}
.stage-hotspot:hover::after,.stage-hotspot:focus-visible::after{box-shadow:inset 0 0 0 2px rgba(255,193,7,.78),0 0 18px rgba(255,193,7,.18);background:rgba(255,193,7,.035)}
.stage-hotspot:focus-visible{outline:3px solid #fff;outline-offset:2px}
.stage-city-trigger{left:14.72%;top:2.64%;width:13.30%;height:5.30%}
.stage-city-search-trigger{left:28.84%;top:2.64%;width:16.70%;height:5.30%}
.stage-nav-tariffs{left:46.72%;top:2.95%;width:4.60%;height:4.60%}
.stage-nav-benefits{left:52.24%;top:2.95%;width:6.40%;height:4.60%}
.stage-nav-how{left:59.82%;top:2.95%;width:6.80%;height:4.60%}
.stage-nav-faq{left:67.33%;top:2.95%;width:5.70%;height:4.60%}
.stage-phone{left:73.55%;top:2.30%;width:13.70%;height:5.90%}
.stage-order{left:88.65%;top:2.55%;width:9.85%;height:5.35%;border-radius:15px}
.stage-tariff-main{left:54.10%;top:50.15%;width:39.00%;height:7.10%;border-radius:14px}
.stage-telegram{left:54.10%;top:58.55%;width:18.50%;height:7.70%;border-radius:14px}
.stage-max{left:73.45%;top:58.55%;width:19.65%;height:7.70%;border-radius:14px}
.stage-benefits-anchor{position:absolute;left:0;top:79.25%;width:1px;height:1px}
.stage-city-selected{position:absolute;z-index:9;left:17.78%;top:5.53%;max-width:8.65%;padding:1px 4px;background:#0b0b0b;color:#fff;font:700 clamp(10px,1vw,16px)/1.15 Arial,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.desktop-city-panel{position:absolute;z-index:40;left:14.72%;top:8.20%;width:min(430px,31%);max-height:55%;padding:15px;border:1px solid rgba(255,193,7,.55);border-radius:16px;background:rgba(7,7,7,.985);box-shadow:0 25px 65px rgba(0,0,0,.68),0 0 30px rgba(255,193,7,.12);color:#fff;backdrop-filter:blur(18px)}
.desktop-city-panel[hidden]{display:none}
.desktop-city-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.desktop-city-panel-head strong{font-size:17px}
.desktop-city-panel-head button{width:34px;height:34px;border:1px solid rgba(255,255,255,.14);border-radius:10px;background:#181818;color:#fff;font-size:25px;line-height:1;cursor:pointer}
.desktop-city-search{display:flex;align-items:center;gap:8px;padding:0 12px;border:1px solid rgba(255,255,255,.22);border-radius:11px;background:#101010}
.desktop-city-search:focus-within{border-color:#ffc107;box-shadow:0 0 0 3px rgba(255,193,7,.12)}
.desktop-city-search input{min-width:0;flex:1;height:43px;border:0;outline:0;background:transparent;color:#fff;font:600 14px Arial,sans-serif}
.desktop-city-search input::placeholder{color:rgba(255,255,255,.58)}
.desktop-city-search span{font-size:20px;color:#fff}
.desktop-city-list{display:grid;gap:4px;max-height:min(430px,38vh);margin-top:11px;padding-right:5px;overflow:auto;scrollbar-color:#ffc107 #171717;scrollbar-width:thin}
.desktop-city-option{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:10px 11px;border:0;border-radius:9px;background:transparent;color:#fff;text-align:left;cursor:pointer}
.desktop-city-option:hover,.desktop-city-option.active{background:linear-gradient(90deg,rgba(255,193,7,.18),rgba(255,193,7,.05));color:#ffd451}
.desktop-city-option span:first-child{display:flex;flex-direction:column;gap:2px;font-weight:750}
.desktop-city-option small{color:rgba(255,255,255,.48);font-size:10px;font-weight:500}
.desktop-city-option .check{color:#ffc107;font-size:16px}
.desktop-city-empty{padding:22px 8px;color:rgba(255,255,255,.58);text-align:center}
.desktop-city-notice{position:absolute;z-index:45;left:50%;top:8.8%;transform:translateX(-50%);max-width:660px;padding:13px 19px;border:1px solid rgba(255,193,7,.52);border-radius:13px;background:rgba(8,8,8,.96);box-shadow:0 20px 55px rgba(0,0,0,.5);color:#fff;font-weight:750;text-align:center}
.desktop-city-notice[hidden]{display:none}
.mobile-site-top,.mobile-only-block{display:none!important}
.floating-bots{display:none!important}
/* The approved image already contains the white benefits section. */
.approved-visual-stage + .mobile-site-top + .mobile-only-block + .mobile-only-block + .section-dark{margin-top:0}
@media (max-width:900px){
  .approved-visual-stage{display:none!important}
  .mobile-site-top{display:block!important}
  .mobile-only-block{display:block!important}
  .page-noise{display:block!important}
  .mobile-site-top .city-notice{display:block}
}
@media (min-width:901px) and (max-width:1180px){
  .desktop-city-panel{width:38%;left:14.5%}
}

/* =========================================================
   SM Ecosystem Website 6.0 — READABILITY AND FAQ UPDATE
   Fixes invisible dark text on the FAQ and other light sections.
   ========================================================= */
body{
  background:#fff;
  color:#151515;
}

/* Every ordinary content section gets an explicit light surface.
   This prevents the black body background from showing through. */
.section:not(.section-dark):not(.section-soft){
  background:#fff;
  color:#151515;
}
.section-soft{
  background:#f5f5f3;
  color:#151515;
}

/* Readable, premium FAQ block */
#faq{
  background:#f6f6f3;
  color:#151515;
  isolation:isolate;
}
#faq .section-head,
#faq .title,
#faq .faq-button{
  color:#151515;
}
#faq .lead{
  color:#5d5d5d;
}
#faq .faq-list{
  max-width:980px;
  border-top:0;
  display:grid;
  gap:12px;
}
#faq .faq-item{
  overflow:hidden;
  border:1px solid rgba(21,21,21,.12);
  border-radius:18px;
  background:#fff;
  box-shadow:0 10px 30px rgba(0,0,0,.045);
}
#faq .faq-button{
  min-height:76px;
  padding:20px 22px;
  font-size:18px;
  line-height:1.3;
}
#faq .faq-button > span:first-child{
  display:block;
  padding-right:14px;
}
#faq .faq-plus{
  width:42px;
  height:42px;
  border-radius:13px;
  color:#111;
  background:#ffc107;
  font-size:23px;
  font-weight:900;
  box-shadow:0 7px 18px rgba(255,193,7,.28);
}
#faq .faq-answer p{
  margin:0;
  padding:0 78px 22px 22px;
  color:#505050;
  font-size:16px;
  line-height:1.7;
}
#faq .faq-item.open{
  border-color:rgba(255,193,7,.7);
  box-shadow:0 14px 36px rgba(0,0,0,.07);
}
#faq .faq-item.open .faq-button{
  color:#000;
}

/* Keep text readable even when browser/extension forces a dark palette. */
#faq button,
#faq p,
#faq h2,
#faq .eyebrow{
  -webkit-text-fill-color:currentColor;
}

@media(max-width:720px){
  #faq .faq-button{padding:17px 16px;font-size:16px;min-height:68px}
  #faq .faq-answer p{padding:0 16px 18px;font-size:15px}
  #faq .faq-plus{width:38px;height:38px;flex-basis:38px}
}


/* Tariff messenger chooser — Website 6.1 */
.tariff-channel-modal{position:fixed;inset:0;z-index:5000;display:grid;place-items:center;padding:20px;opacity:0;transition:opacity .18s ease}
.tariff-channel-modal.is-open{opacity:1}
.tariff-channel-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(8px)}
.tariff-channel-dialog{position:relative;z-index:1;width:min(560px,100%);padding:34px;border:1px solid rgba(255,196,0,.35);border-radius:28px;background:linear-gradient(145deg,#181818,#090909);color:#fff;text-align:center;box-shadow:0 28px 80px rgba(0,0,0,.6),0 0 40px rgba(255,196,0,.08);transform:translateY(14px) scale(.98);transition:transform .18s ease}
.tariff-channel-modal.is-open .tariff-channel-dialog{transform:none}
.tariff-channel-close{position:absolute;top:14px;right:14px;width:42px;height:42px;border:0;border-radius:50%;background:#ffc400;color:#111;font-size:28px;font-weight:900;line-height:1;cursor:pointer}
.tariff-channel-icon{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 14px;border-radius:20px;background:#ffc400;color:#111;font-size:30px}
.tariff-channel-kicker{margin:0 0 6px;color:#ffc400;font-weight:900;text-transform:uppercase;letter-spacing:.08em;font-size:12px}
.tariff-channel-dialog h2{margin:0 0 10px;font-size:clamp(25px,4vw,36px);color:#fff}
.tariff-channel-dialog>p:not(.tariff-channel-kicker){margin:0 auto 24px;max-width:430px;color:#cfcfcf;line-height:1.55}
.tariff-channel-actions{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.tariff-channel-link{display:flex;align-items:center;gap:13px;min-height:86px;padding:16px;border-radius:18px;color:#fff;text-align:left;text-decoration:none;box-shadow:0 15px 35px rgba(0,0,0,.25);transition:transform .2s ease,filter .2s ease}
.tariff-channel-link:hover{transform:translateY(-3px);filter:brightness(1.08)}
.tariff-channel-telegram{background:linear-gradient(135deg,#1597eb,#0860c7)}
.tariff-channel-max{background:linear-gradient(135deg,#7d24cf,#4a078b)}
.tariff-channel-symbol{display:grid;place-items:center;flex:0 0 48px;width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.16);font-size:26px}
.tariff-channel-max-ring{border:6px solid #fff;background:transparent}
.tariff-channel-link strong,.tariff-channel-link small{display:block}
.tariff-channel-link strong{font-size:17px;line-height:1.2}
.tariff-channel-link small{margin-top:4px;color:rgba(255,255,255,.82);font-size:12px}
.tariff-channel-cancel{margin-top:18px;border:0;background:transparent;color:#bdbdbd;text-decoration:underline;cursor:pointer;font:inherit}
.tariff-modal-open{overflow:hidden}
@media(max-width:620px){.tariff-channel-dialog{padding:28px 18px 22px;border-radius:22px}.tariff-channel-actions{grid-template-columns:1fr}.tariff-channel-link{min-height:76px}.floating-tariffs{display:none!important}}

/* Website 6.2 — reliable tariff selection */
.tariff-choose{
  position:relative;
  z-index:20;
  pointer-events:auto!important;
  cursor:pointer;
  touch-action:manipulation;
  user-select:none;
}
.tariff-channel-modal[hidden]{display:none!important}
.tariff-channel-modal:not([hidden]){display:grid!important}
.tariff-channel-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.78)}
.tariff-channel-dialog{pointer-events:auto}

/* Website 6.3 — remove all floating/sticky mobile controls */
.mobile-quick-actions,
.floating-tariffs,
.floating-bots,
.float-btn,
[class*="floating-"]{display:none!important;visibility:hidden!important;pointer-events:none!important}
@media(max-width:900px){
  .mobile-quick-actions,
  .floating-tariffs,
  .floating-bots,
  .float-btn,
  [class*="floating-"]{display:none!important;visibility:hidden!important;pointer-events:none!important}
}


/* =========================================================
   SM Ecosystem Website 6.4 — MOBILE VISUAL & NAVIGATION FIX
   - approved Master + Sam visual on mobile;
   - unique anchors and working Contacts link;
   - city selection available on mobile;
   - no floating/sticky overlay controls.
   ========================================================= */
.stage-nav-contacts{left:67.33%;top:2.95%;width:5.70%;height:4.60%}

.mobile-hero-v64{display:none;background:#050505;color:#fff}
.mobile-hero-media-v64{position:relative;overflow:hidden;background:#050505;line-height:0}
.mobile-hero-media-v64::after{content:"";position:absolute;inset:auto 0 0;height:34%;background:linear-gradient(transparent,#050505);pointer-events:none}
.mobile-hero-media-v64 img{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none}
.mobile-hero-content-v64{position:relative;margin-top:-38px;padding:0 18px 28px;background:#050505;text-align:center}
.mobile-hero-care-v64{display:inline-flex;align-items:center;justify-content:center;gap:7px;max-width:100%;padding:9px 13px;border:1px solid rgba(255,193,7,.55);border-radius:999px;background:rgba(15,15,15,.94);color:#f6f6f6;font-size:11px;font-weight:900;line-height:1.25;text-transform:uppercase;letter-spacing:.025em}
.mobile-hero-care-v64 span{color:#ffc107}
.mobile-hero-v64 h1{max-width:720px;margin:18px auto 12px;color:#fff;font-size:clamp(37px,10.7vw,63px);line-height:.94;letter-spacing:-.045em}
.mobile-hero-v64 h1 span{display:block;margin-top:9px;color:#ffc107;font-size:.72em;line-height:1.02}
.mobile-hero-lead-v64{max-width:650px;margin:0 auto;color:rgba(255,255,255,.74);font-size:15px;line-height:1.55}
.mobile-service-card-v64{display:grid;grid-template-columns:1fr auto;align-items:center;gap:14px;max-width:650px;margin:22px auto 12px;padding:17px 18px;border:1px solid rgba(255,193,7,.55);border-radius:18px;background:linear-gradient(145deg,#1a1a1a,#0b0b0b);box-shadow:0 20px 45px rgba(0,0,0,.34);text-align:left}
.mobile-service-card-v64>div{min-width:0}
.mobile-service-card-v64 small,.mobile-service-card-v64 span{display:block}
.mobile-service-card-v64>div small{color:#ffc107;font-size:10px;font-weight:950;text-transform:uppercase;letter-spacing:.08em}
.mobile-service-card-v64>div strong{display:block;margin-top:4px;color:#fff;font-size:24px;line-height:1;text-transform:uppercase}
.mobile-service-card-v64>div span{margin-top:6px;color:rgba(255,255,255,.62);font-size:11px;line-height:1.3}
.mobile-service-card-v64>p{margin:0;padding-left:14px;border-left:1px solid rgba(255,193,7,.36);white-space:nowrap;text-align:right}
.mobile-service-card-v64>p strong{display:block;color:#ffc107;font-size:30px;line-height:1}
.mobile-service-card-v64>p span{margin-top:5px;color:#fff;font-size:11px;font-weight:850;text-transform:uppercase}
.mobile-tariff-action-v64{display:flex;align-items:center;justify-content:center;gap:14px;max-width:650px;min-height:70px;margin:0 auto 11px;padding:13px 17px;border:1px solid #ffe27c;border-radius:17px;background:linear-gradient(135deg,#ffd341,#f3aa00);color:#111;text-decoration:none;box-shadow:0 15px 35px rgba(255,181,0,.18);touch-action:manipulation}
.mobile-tariff-action-v64 span{min-width:0;text-align:left}
.mobile-tariff-action-v64 strong,.mobile-tariff-action-v64 small{display:block}
.mobile-tariff-action-v64 strong{font-size:16px;line-height:1.2}
.mobile-tariff-action-v64 small{margin-top:4px;font-size:11px;line-height:1.25}
.mobile-tariff-action-v64 b{margin-left:auto;font-size:27px;line-height:1}
.mobile-messenger-actions-v64{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:650px;margin:0 auto}
.mobile-messenger-v64{display:flex;align-items:center;justify-content:center;gap:10px;min-width:0;min-height:68px;padding:12px 10px;border-radius:16px;color:#fff;text-align:left;text-decoration:none;box-shadow:0 15px 32px rgba(0,0,0,.28);touch-action:manipulation}
.mobile-telegram-v64{background:linear-gradient(135deg,#159df0,#075fc9)}
.mobile-max-v64{background:linear-gradient(135deg,#7b2bd0,#4b0a8c)}
.mobile-messenger-symbol-v64{font-size:25px;transform:rotate(-24deg)}
.mobile-max-ring-v64{flex:0 0 27px;width:27px;height:27px;border:5px solid #fff;border-right-color:transparent;border-radius:50%}
.mobile-messenger-v64 strong,.mobile-messenger-v64 small{display:block}
.mobile-messenger-v64 strong{font-size:16px;line-height:1.1}
.mobile-messenger-v64 small{margin-top:4px;color:rgba(255,255,255,.8);font-size:10px;line-height:1.2}
.mobile-benefits-v64{display:grid;grid-template-columns:repeat(3,1fr);max-width:650px;margin:18px auto 0;border:1px solid rgba(255,193,7,.26);border-radius:18px;background:#0e0e0e;overflow:hidden;text-align:left}
.mobile-benefits-v64>div{display:flex;align-items:center;gap:8px;min-width:0;padding:13px 10px;border-right:1px solid rgba(255,255,255,.09)}
.mobile-benefits-v64>div:last-child{border-right:0}
.mobile-benefits-v64>div>span{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border:1px solid rgba(255,193,7,.55);border-radius:9px;color:#ffc107;font-weight:950}
.mobile-benefits-v64 p{min-width:0;margin:0;line-height:1.15}
.mobile-benefits-v64 strong,.mobile-benefits-v64 small{display:block}
.mobile-benefits-v64 strong{color:#fff;font-size:11px}
.mobile-benefits-v64 small{margin-top:4px;color:rgba(255,255,255,.58);font-size:9px}

@media(max-width:900px){
  .mobile-hero-v64{display:block}
  .mobile-site-top .hero-header-inner{height:auto!important;min-height:74px;padding:9px 0 11px;align-items:flex-start;flex-wrap:wrap}
  .mobile-site-top .header-brand-city{display:flex;flex:1 1 calc(100% - 128px);min-width:0;flex-wrap:wrap;align-items:center}
  .mobile-site-top .hero-brand-v51{min-width:0!important;flex:1 1 auto}
  .mobile-site-top .hero-order{flex:0 0 auto;margin:5px 0 0 auto!important}
  .mobile-site-top .city-selector{display:block!important;flex:1 0 100%;width:100%;min-width:0;margin-top:8px}
  .mobile-site-top .city-label{display:none}
  .mobile-site-top .city-trigger{min-height:43px}
  .mobile-site-top .city-panel{left:0;right:auto;width:min(340px,calc(100vw - 24px))}
}
@media(max-width:560px){
  .mobile-site-top .hero-header-inner{width:min(100% - 22px,1600px)!important;gap:8px!important}
  .mobile-site-top .header-brand-city{flex-basis:calc(100% - 116px)}
  .mobile-site-top .hero-brand-v51 img{width:168px!important}
  .mobile-site-top .hero-order{min-height:42px!important;padding:0 12px!important;font-size:12px!important}
  .mobile-hero-content-v64{padding-inline:12px}
  .mobile-service-card-v64{grid-template-columns:1fr auto;padding:15px 13px}
  .mobile-service-card-v64>div strong{font-size:21px}
  .mobile-service-card-v64>p strong{font-size:25px}
  .mobile-messenger-v64{padding-inline:8px}
  .mobile-benefits-v64{grid-template-columns:1fr}
  .mobile-benefits-v64>div{border-right:0;border-bottom:1px solid rgba(255,255,255,.09);padding:12px 14px}
  .mobile-benefits-v64>div:last-child{border-bottom:0}
  .mobile-benefits-v64 strong{font-size:12px}
  .mobile-benefits-v64 small{font-size:10px}
}
@media(max-width:380px){
  .mobile-site-top .hero-brand-v51 img{width:145px!important}
  .mobile-site-top .hero-order{padding-inline:10px!important;font-size:11px!important}
  .mobile-messenger-actions-v64{grid-template-columns:1fr}
  .mobile-service-card-v64{grid-template-columns:1fr}
  .mobile-service-card-v64>p{padding:11px 0 0;border-top:1px solid rgba(255,193,7,.36);border-left:0;text-align:left}
}

/* Version 6.4: all legacy overlay buttons remain permanently disabled. */
.mobile-quick-actions,.floating-tariffs,.floating-bots,.float-btn,[class*="floating-"]{display:none!important;visibility:hidden!important;pointer-events:none!important}

/* 6.4 mobile header final alignment: logo and CTA on first row, city on second. */
@media(max-width:900px){
  .mobile-site-top .hero-header-inner{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center!important;
    column-gap:10px!important;
    row-gap:8px!important;
  }
  .mobile-site-top .header-brand-city{display:contents!important}
  .mobile-site-top .hero-brand-v51{grid-column:1;grid-row:1;align-self:center}
  .mobile-site-top .hero-order{grid-column:2;grid-row:1;align-self:center;margin:0!important}
  .mobile-site-top .city-selector{grid-column:1 / -1;grid-row:2;margin:0!important}
  .mobile-hero-v64 h1{font-size:clamp(34px,8.7vw,60px)}
}

/* ============================================================
   Website 6.4.1 — definitive removal of mobile overlay controls
   No black/yellow floating, sticky or quick-action button may
   cover the page on phones. Keep tariff and messenger buttons
   only inside the normal document flow.
   ============================================================ */
.mobile-quick-actions,
.mobile-floating-button,
.mobile-float,
.floating-cta,
.floating-tariffs,
.floating-bots,
.quick-actions,
.quick-action,
.float-btn,
.sticky-cta,
.sticky-actions,
[class*="mobile-float"],
[class*="floating-cta"],
[class*="quick-actions"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
}

@media (max-width: 900px) {
  html, body { overflow-x: hidden; }

  /* The mobile header remains part of the page and no longer floats
     above the content while scrolling. */
  .mobile-site-top .hero-site-header {
    position: relative !important;
    top: auto !important;
    inset: auto !important;
  }

  /* Remove the compact header CTA that could look like a black/yellow
     overlay on narrow screens. The full tariff CTA remains below. */
  .mobile-site-top .hero-order {
    display: none !important;
  }

  body > a[style*="position: fixed"],
  body > button[style*="position: fixed"],
  body > div[style*="position: fixed"][class*="button"],
  body > div[style*="position: fixed"][class*="cta"] {
    display: none !important;
  }
}


/* Website 6.4.2 — hard removal of every legacy mobile overlay control */
.mobile-quick-actions,
.mobile-floating-button,
.mobile-float,
.floating-cta,
.floating-tariffs,
.floating-bots,
.quick-actions,
.sticky-cta,
.float-btn,
[class*="mobile-float"],
[class*="floating-cta"],
[class*="quick-actions"],
[class*="sticky-cta"] {
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
  width:0 !important;
  height:0 !important;
  min-width:0 !important;
  min-height:0 !important;
  padding:0 !important;
  margin:0 !important;
  overflow:hidden !important;
}
@media (max-width: 900px) {
  .city-notice,.desktop-city-notice {
    position:static !important;
    transform:none !important;
    max-width:none !important;
    margin:8px 12px !important;
    background:#fff8d8 !important;
    color:#151515 !important;
    border-color:#e7bd25 !important;
    box-shadow:none !important;
  }
  body > a[style*="position:fixed"],
  body > button[style*="position:fixed"],
  body > a[style*="position: fixed"],
  body > button[style*="position: fixed"] {
    display:none !important;
  }
}