/* Pixel-polished Hero overrides. No additional page sections. */
html,
body {
  overflow-x: hidden;
}

.site-header__inner,
.hero,
.hero__features,
.hero__stats {
  min-width: 0;
}

.hero__badge svg,
.hero__button svg,
.feature__icon svg {
  display: block;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.hero__badge svg {
  width: 1em;
  height: 1em;
  fill: currentColor;
  stroke-width: 0;
}

.hero__button svg {
  width: 1.25em;
  height: 1.25em;
}

.feature__icon svg {
  width: 55%;
  height: 55%;
}

.hero__badge,
.hero__title,
.hero__subtitle,
.hero__text,
.hero__description,
.hero__button,
.hero__features,
.hero__stats-label,
.hero__stats {
  animation: hero-rise .7s cubic-bezier(.2,.7,.2,1) both;
}

.hero__title { animation-delay: .06s; }
.hero__subtitle { animation-delay: .11s; }
.hero__text { animation-delay: .16s; }
.hero__description { animation-delay: .21s; }
.hero__button { animation-delay: .27s; }
.hero__features { animation-delay: .33s; }
.hero__stats-label,
.hero__stats { animation-delay: .39s; }

.feature {
  transition: transform .22s ease, border-color .22s ease, background-color .22s ease;
}

.feature:hover {
  transform: translateY(-2px);
  border-color: rgba(100, 160, 255, .48);
  background: rgba(255, 255, 255, .075);
}

@keyframes hero-rise {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (min-width: 1200px) {
  .site-header {
    padding-top: 28px;
  }

  .site-header__inner {
    grid-template-columns: 138px 1fr 165px;
    width: min(1550px, calc(100% - 84px));
  }

  .site-branding,
  .site-logo,
  .custom-logo-link {
    width: 138px;
    height: 56px;
  }

  .site-logo,
  .custom-logo-link {
    border-radius: 14px;
  }

  .custom-logo {
    max-width: 138px;
    height: 56px;
  }

  .site-logo span { font-size: 16px; }
  .site-logo b { font-size: 12px; }

  .site-nav {
    gap: 30px;
  }

  .site-nav a {
    font-size: clamp(15px, 1.1vw, 18px);
  }

  .site-header__cta {
    width: 165px;
    height: 56px;
    border-radius: 10px;
    font-size: 18px;
  }

  .page {
    min-height: 1080px;
  }

  .hero {
    width: min(1320px, calc(100% - 48px));
    padding: 105px 0 56px;
  }

  .hero__badge {
    min-height: 48px;
    padding: 11px 20px;
    gap: 9px;
    font-size: 18px;
    line-height: 24px;
  }

  .hero__title {
    margin-top: 42px;
    font-size: clamp(70px, 5.5vw, 90px);
    letter-spacing: -2.5px;
  }

  .hero__subtitle {
    margin-top: 16px;
    font-size: clamp(68px, 5.3vw, 86px);
    letter-spacing: -2px;
  }

  .hero__text {
    margin-top: 26px;
    font-size: clamp(28px, 2.3vw, 38px);
  }

  .hero__description {
    max-width: 860px;
    margin-top: 30px;
    font-size: clamp(20px, 1.7vw, 28px);
    line-height: 1.25;
  }

  .hero__button {
    gap: 18px;
    margin-top: 50px;
    padding: 20px 30px;
    border-radius: 10px;
    font-size: 20px;
  }

  .hero__features {
    width: 765px;
    gap: 20px;
    margin-top: 58px;
  }

  .feature {
    min-height: 76px;
    gap: 14px;
    padding: 12px 18px;
    border-radius: 14px;
  }

  .feature__icon {
    flex-basis: 48px;
    width: 48px;
    height: 48px;
    border-radius: 12px;
  }

  .feature strong { font-size: 18px; }
  .feature div { font-size: 14px; }

  .hero__stats-label {
    margin-top: 55px;
    font-size: 13px;
  }

  .hero__stats {
    width: 900px;
    gap: 24px;
    margin-top: 20px;
  }

  .stat span { font-size: 38px; }
  .stat small { font-size: 13px; }
}

@media (min-width: 900px) and (max-width: 1199px) {
  .site-header { padding-top: 20px; }
  .site-header__inner { grid-template-columns: 96px 1fr 112px; width: min(1040px, calc(100% - 48px)); }
  .site-branding, .site-logo, .custom-logo-link { width: 96px; height: 40px; }
  .custom-logo { max-width: 96px; height: 40px; }
  .site-logo span { font-size: 11px; }
  .site-logo b { font-size: 8px; }
  .site-nav { gap: 16px; }
  .site-nav a { font-size: 12px; }
  .site-header__cta { width: 112px; height: 40px; font-size: 12px; }
  .page { min-height: 850px; }
  .hero { width: min(980px, calc(100% - 40px)); padding: 130px 0 48px; }
  .hero__badge { font-size: 12px; }
  .hero__title { margin-top: 28px; font-size: 60px; }
  .hero__subtitle { margin-top: 12px; font-size: 58px; }
  .hero__text { margin-top: 20px; font-size: 25px; }
  .hero__description { max-width: 650px; margin-top: 22px; font-size: 18px; }
  .hero__button { margin-top: 34px; padding: 14px 22px; font-size: 14px; }
  .hero__features { width: 560px; gap: 14px; margin-top: 40px; }
  .feature { min-height: 56px; }
  .feature strong { font-size: 12px; }
  .feature div { font-size: 9px; }
  .hero__stats-label { margin-top: 42px; font-size: 10px; }
  .hero__stats { width: 680px; }
  .stat span { font-size: 30px; }
  .stat small { font-size: 10px; }
}

@media (min-width: 641px) and (max-width: 899px) {
  .site-header { padding-top: 18px; }
  .site-header__inner { grid-template-columns: 1fr 112px; width: calc(100% - 36px); }
  .site-nav { display: none; }
  .site-branding, .site-logo, .custom-logo-link { width: 92px; height: 38px; }
  .custom-logo { max-width: 92px; height: 38px; }
  .site-header__cta { grid-column: 2; width: 112px; height: 38px; font-size: 11px; }
  .page { min-height: 930px; }
  .hero { width: min(720px, calc(100% - 36px)); padding: 110px 0 48px; }
  .hero__badge { font-size: 10px; }
  .hero__title { margin-top: 28px; font-size: clamp(46px, 7vw, 56px); }
  .hero__subtitle { font-size: clamp(42px, 6.6vw, 52px); }
  .hero__text { font-size: 20px; }
  .hero__description { max-width: 560px; font-size: 16px; }
  .hero__button { padding: 13px 20px; font-size: 13px; }
  .hero__features { width: 600px; gap: 12px; }
  .feature { min-height: 54px; }
  .feature strong { font-size: 11px; }
  .feature div { font-size: 9px; }
  .hero__stats { width: 620px; }
}

@media (max-width: 640px) {
  .site-header {
    padding-top: 14px;
  }

  .site-header__inner {
    grid-template-columns: 82px 1fr 96px;
    width: calc(100% - 28px);
  }

  .site-branding,
  .site-logo,
  .custom-logo-link {
    width: 82px;
    height: 34px;
  }

  .custom-logo {
    max-width: 82px;
    height: 34px;
  }

  .site-logo span { font-size: 9px; }
  .site-logo b { font-size: 7px; }

  .site-header__cta {
    grid-column: 3;
    width: 96px;
    height: 34px;
    font-size: 10px;
  }

  .page {
    min-height: 1080px;
  }

  .hero {
    width: calc(100% - 30px);
    padding: 96px 0 44px;
  }

  .hero__badge {
    max-width: 100%;
    min-height: 32px;
    padding: 7px 11px;
    font-size: 9px;
    line-height: 1.3;
    white-space: normal;
  }

  .hero__title {
    margin-top: 24px;
    font-size: clamp(36px, 11vw, 44px);
    line-height: 1.04;
    letter-spacing: -1.3px;
  }

  .hero__subtitle {
    margin-top: 12px;
    font-size: clamp(32px, 9.6vw, 39px);
    line-height: 1.08;
  }

  .hero__text {
    margin-top: 20px;
    font-size: 18px;
    line-height: 1.35;
    white-space: normal;
  }

  .hero__description {
    margin-top: 18px;
    padding: 0 8px;
    font-size: 15px;
    line-height: 1.45;
  }

  .hero__button {
    margin-top: 28px;
    padding: 13px 19px;
    font-size: 13px;
  }

  .hero__features {
    width: 100%;
    grid-template-columns: 1fr;
    gap: 10px;
    margin-top: 30px;
  }

  .feature {
    min-height: 58px;
    justify-content: flex-start;
    padding: 9px 16px;
  }

  .feature__icon {
    flex-basis: 38px;
    width: 38px;
    height: 38px;
  }

  .feature strong { font-size: 12px; }
  .feature div { font-size: 9px; }

  .hero__stats-label {
    margin-top: 34px;
    font-size: 9px;
  }

  .hero__stats {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px 12px;
    margin-top: 18px;
  }

  .stat span { font-size: 28px; }
  .stat small { font-size: 9px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .hero__badge,
  .hero__title,
  .hero__subtitle,
  .hero__text,
  .hero__description,
  .hero__button,
  .hero__features,
  .hero__stats-label,
  .hero__stats {
    animation: none;
  }
  .hero__button,
  .feature {
    transition: none;
  }
}
