#service-definition, #booster-conditions, #pricing-terms { scroll-margin-top: 88px; }
.hero#top { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 110px 20px 48px; }
.hero-copy { position: relative; z-index: 2; width: 100%; max-width: 1080px; text-align: center; color: #16181d; }
.hero-copy h1 { margin: 0; font-size: clamp(28px, 3.8vw, 52px); font-weight: 800; letter-spacing: -.045em; line-height: 1.15; }
.hero-copy h1 span { display: block; }
.hero-brand { color: #fff; font-weight: inherit; }
.hero#top > .stage { position: relative; left: auto; top: auto; transform: none; flex: none; margin: 28px auto 0; }
.hero#top > .stage .chat { height: clamp(360px, 58svh, 600px); border: 0; box-shadow: 0 20px 50px rgba(22, 24, 29, .12); }
.hero#top > .stage .chat::before { -webkit-clip-path: inset(0 round var(--r)); clip-path: inset(0 round var(--r)); }
.top nav a.nav-demo { opacity: 1; padding: 9px 15px; border: 0; border-radius: 999px; background: #fff; color: #16181d; text-decoration: none; transition: background-color .25s ease, color .25s ease; }
.top.scrolled nav a.nav-demo { background: #16181d; color: #fff; }
.hero .top nav a:hover, .hero .top nav a:focus-visible { text-decoration: none; }
.top nav .nav-demo:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.hero .top, .hero .top.scrolled { border-bottom: 0; }
.hero .top.scrolled { box-shadow: 0 8px 30px rgba(20, 22, 26, .06); }
.booster-conditions { grid-column: 1 / -1; margin: 30px auto 0; max-width: 1080px; padding: 22px 24px; border: 1px solid #d8d8dc; border-radius: 16px; color: #16181d; background: #fff; }
.booster-conditions[hidden] { display: none; }
.booster-conditions h3 { margin: 0; font-size: 22px; font-weight: 500; }
.bxp-guide { grid-column: 1 / -1; }
.bx-panel .bxp-guide { padding-right: 96px; }
.bxp-guide .bxp-guide-intro { max-width: none; margin-bottom: 22px; }
.bxp-guide dl { margin-top: 22px; }
.bxp-guide dl > div { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 20px; padding: 16px 0; border-top: 1px solid #e8e8ec; }
.bxp-guide dt { font-size: 15px; font-weight: 600; }
.bxp-guide dd { margin: 0; font-size: 14px; line-height: 1.8; color: #5b5b63; word-break: keep-all; }
.booster-conditions dl { margin: 18px 0 0; }
.booster-conditions dl > div { display: grid; grid-template-columns: 170px 1fr; gap: 18px; padding: 14px 0; border-top: 1px solid #eee; }
.booster-conditions dt { font-size: 15px; font-weight: 600; }
.booster-conditions dd { margin: 0; font-size: 14px; line-height: 1.8; word-break: keep-all; }
.pr-help-controls { display: inline-flex; align-items: center; gap: 10px; }
.pricing-info { flex: none; display: grid; place-items: center; width: 26px; height: 26px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.58); color: #66666e; cursor: pointer; box-shadow: none; transition: background .2s, color .2s; }
.pricing-info svg { display: block; width: 15px; height: 15px; }
.pricing-info:hover, .pricing-info[aria-expanded="true"] { background: #16181d; color: #fff; }
.pricing-terms[popover] { position: fixed; inset: auto auto 24px 16px; margin: 0; width: min(480px, calc(100vw - 32px)); max-height: calc(100svh - 32px); overflow: auto; padding: 24px; border: 1px solid rgba(255,255,255,.8); border-radius: 24px; background: linear-gradient(165deg, rgba(255,255,255,.76) 0%, rgba(255,255,255,.64) 55%, rgba(248,249,251,.70) 100%); -webkit-backdrop-filter: blur(40px) saturate(180%); backdrop-filter: blur(40px) saturate(180%); box-shadow: 0 20px 50px rgba(22,24,29,.12), 0 0 0 .5px rgba(22,24,29,.08); color: #45454c; font: 400 14px/1.8 var(--font); word-break: keep-all; }
.pricing-terms[popover] { scrollbar-width: thin; scrollbar-color: rgba(22,24,29,.24) transparent; }
.pricing-terms::backdrop { background: transparent; }
.pricing-terms .pricing-popup-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.pricing-terms .pricing-popup-head h3 { margin: 0; font-size: 18px; font-weight: 600; letter-spacing: -.03em; color: #16181d; }
.pricing-popup-close { display: grid; place-items: center; flex: none; width: 28px; height: 28px; border: 0; border-radius: 50%; padding: 0; background: rgba(22,24,29,.06); color: #66666e; cursor: pointer; }
.pricing-popup-close svg { width: 14px; height: 14px; }
.pricing-terms p { margin: 0; }
.pricing-terms p + p { padding-top: 14px; margin-top: 14px; border-top: 1px solid rgba(22,24,29,.08); }
.pricing-terms a { color: #16181d; text-underline-offset: 3px; }
:where(a, button, input, summary):focus-visible { outline: 3px solid #397645; outline-offset: 4px; }
@media (max-width: 600px) {
  .hero#top { padding: 110px 18px 38px; }
  .hero-copy h1 { font-size: clamp(21px, 6vw, 32px); line-height: 1.2; }
  .hero-copy h1 span { white-space: nowrap; }
  .hero#top > .stage { margin-top: 24px; }
  .hero#top > .stage .chat { height: clamp(340px, 55svh, 520px); }
  .booster-conditions { padding: 18px 70px 18px 18px; }
  .pricing-terms[popover] { padding: 20px; border-radius: 20px; font-size: 13px; }
  .booster-conditions dl > div { grid-template-columns: 1fr; gap: 5px; }
  .bxp-guide dl > div { grid-template-columns: 1fr; gap: 6px; }
  .bx-panel .bxp-guide { padding-right: 72px; }
  .top nav .nav-demo { padding: 6px 9px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
