/* ===== Todor adaptive polish / no-overlap cleanup ===== */
:root {
  --todor-container: min(1180px, calc(100vw - 32px));
}

img[alt*="Веселий персонаж"],
img[alt*="Персонаж"],
img[src*="mascot"],
.smart-todor-wrap,
.smart-todor-mascot,
button[aria-label*="Todor помічник"],
button[aria-label*="Помічник Todor"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body {
  overflow-x: hidden;
}

section,
.hero,
[class*="hero"],
[class*="Hero"] {
  max-width: 100%;
}

.hero,
[class*="hero"],
[class*="Hero"] {
  box-sizing: border-box;
}

@media (max-width: 1280px) {
  [class*="hero"],
  [class*="Hero"] {
    padding-left: clamp(18px, 4vw, 48px) !important;
    padding-right: clamp(18px, 4vw, 48px) !important;
  }

  h1 {
    font-size: clamp(44px, 7vw, 84px) !important;
    line-height: 0.95 !important;
    letter-spacing: -0.045em !important;
  }
}

@media (max-width: 1024px) {
  [class*="hero"],
  [class*="Hero"] {
    min-height: auto !important;
    padding-top: 96px !important;
    padding-bottom: 56px !important;
  }

  [class*="phone"],
  [class*="Phone"],
  img[src*="phone"],
  img[alt*="phone"],
  img[alt*="телефон"],
  img[alt*="Телефон"] {
    max-width: min(360px, 42vw) !important;
    height: auto !important;
  }

  h1 {
    font-size: clamp(38px, 8vw, 68px) !important;
  }
}

@media (max-width: 768px) {
  header,
  nav {
    max-width: 100vw;
  }

  [class*="hero"],
  [class*="Hero"] {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    text-align: left !important;
    overflow: hidden !important;
    border-radius: 0 0 28px 28px !important;
    padding: 88px 18px 36px !important;
  }

  h1 {
    font-size: clamp(34px, 12vw, 54px) !important;
    line-height: 0.92 !important;
    max-width: 100% !important;
  }

  [class*="hero"] p,
  [class*="Hero"] p,
  [class*="hero"] li,
  [class*="Hero"] li {
    font-size: 15px !important;
    line-height: 1.45 !important;
  }

  [class*="hero"] button,
  [class*="Hero"] button,
  [class*="hero"] a,
  [class*="Hero"] a {
    max-width: 100%;
  }

  [class*="hero"] input,
  [class*="Hero"] input {
    width: 100% !important;
    min-width: 0 !important;
  }

  [class*="phone"],
  [class*="Phone"],
  img[src*="phone"],
  img[alt*="phone"],
  img[alt*="телефон"],
  img[alt*="Телефон"] {
    position: relative !important;
    max-width: min(280px, 72vw) !important;
    margin: 0 auto !important;
    transform: none !important;
    right: auto !important;
    left: auto !important;
  }
}

@media (max-width: 520px) {
  [class*="hero"],
  [class*="Hero"] {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  h1 {
    font-size: clamp(30px, 13vw, 44px) !important;
  }

  [class*="hero"] .flex,
  [class*="Hero"] .flex {
    flex-wrap: wrap !important;
  }

  [class*="hero"] button,
  [class*="Hero"] button,
  [class*="hero"] a,
  [class*="Hero"] a {
    min-height: 48px !important;
  }
}

/* Tariff cards adapt cleanly */
@media (max-width: 920px) {
  [class*="tariff"],
  [class*="Tariff"],
  [class*="pricing"],
  [class*="Pricing"] {
    grid-template-columns: 1fr !important;
  }
}