.page {
  --ai-ink: #f5f8ff;
  --ai-navy: #2dd4ff;
  --ai-navy-deep: #f8fbff;
  --ai-muted: #b8c2d6;
  --ai-soft: #101522;
  --ai-ivory: #111827;
  --ai-gold: #f1b84b;
  --ai-gold-dark: #ffd77a;
  --ai-line: rgba(255, 255, 255, 0.16);
  --ai-card: rgba(10, 14, 26, 0.78);
  --ai-sky: rgba(67, 217, 255, 0.1);
  position: relative;
  isolation: isolate;
  color: var(--ai-ink);
  background:
    radial-gradient(circle at 12% 4%, rgba(45, 212, 255, 0.22), transparent 28rem),
    radial-gradient(circle at 82% 14%, rgba(255, 105, 180, 0.18), transparent 26rem),
    linear-gradient(180deg, #05070d 0%, #080b14 44%, #05070d 100%);
  width: 100%;
  max-width: 100vw;
  min-height: 100vh;
  overflow-x: hidden;
  padding-bottom: 112px;
}

.page * {
  box-sizing: border-box;
  letter-spacing: 0;
}

.page::before,
.page::after {
  content: "";
  position: fixed;
  z-index: 0;
  pointer-events: none;
  border-radius: 999px;
  filter: blur(34px);
  opacity: 0.62;
  will-change: transform, opacity;
}

.page::before {
  top: -11rem;
  right: -11rem;
  width: min(74vw, 760px);
  height: min(74vw, 760px);
  background:
    radial-gradient(circle at 34% 36%, rgba(49, 231, 255, 0.58), transparent 0 34%),
    radial-gradient(circle at 64% 58%, rgba(255, 74, 179, 0.44), transparent 0 36%),
    radial-gradient(circle at 42% 72%, rgba(241, 184, 75, 0.36), transparent 0 34%);
  transform: translate3d(0, 0, 0) scale(1);
  animation: aiGlowDriftA 16s ease-in-out infinite;
}

.page::after {
  left: -10rem;
  bottom: 10vh;
  width: min(82vw, 680px);
  height: min(82vw, 680px);
  background:
    radial-gradient(circle at 35% 42%, rgba(119, 76, 255, 0.46), transparent 0 38%),
    radial-gradient(circle at 68% 66%, rgba(45, 212, 255, 0.34), transparent 0 34%),
    radial-gradient(circle at 44% 74%, rgba(255, 219, 112, 0.2), transparent 0 36%);
  transform: translate3d(0, 0, 0) scale(1);
  animation: aiGlowDriftB 18s ease-in-out infinite;
}

.page > * {
  position: relative;
  z-index: 1;
}

.transitionGlow {
  position: fixed;
  inset: -16%;
  z-index: 90;
  pointer-events: none;
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.96), transparent 0 28%),
    radial-gradient(circle at 40% 56%, rgba(45, 212, 255, 0.38), transparent 0 42%),
    radial-gradient(circle at 63% 46%, rgba(255, 91, 188, 0.34), transparent 0 44%),
    radial-gradient(circle at 52% 70%, rgba(255, 210, 87, 0.32), transparent 0 40%);
  opacity: 0;
  filter: blur(26px);
  transform: translate3d(0, 0, 0) scale(0.78);
  will-change: opacity, transform;
}

.page[data-ai-transition="true"] .transitionGlow {
  animation: aiPageGlowTransition 980ms cubic-bezier(0.18, 1, 0.28, 1) both;
}

@keyframes aiHeroFloat {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-8px);
  }
}

@keyframes aiPageGlowTransition {
  0% {
    opacity: 0;
    transform: translate3d(0, 0, 0) scale(0.78);
  }

  36% {
    opacity: 0.98;
    transform: translate3d(0, 0, 0) scale(1.05);
  }

  100% {
    opacity: 0;
    transform: translate3d(0, -3vh, 0) scale(1.22);
  }
}

@keyframes aiGoldSweep {
  0% {
    transform: translate3d(-18%, 0, 0) scaleX(1);
  }

  50% {
    transform: translate3d(18%, 0, 0) scaleX(1.08);
  }

  100% {
    transform: translate3d(-18%, 0, 0) scaleX(1);
  }
}

@keyframes aiPanelItemIn {
  from {
    opacity: 0;
    transform: translateX(18px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes aiPriceMark {
  0%,
  100% {
    transform: scaleY(0.32);
  }

  50% {
    transform: scaleY(1);
  }
}

@keyframes aiGlowDriftA {
  0%,
  100% {
    opacity: 0.58;
    transform: translate3d(0, 0, 0) scale(1);
  }

  42% {
    opacity: 0.76;
    transform: translate3d(-5vw, 7vh, 0) scale(1.08);
  }

  72% {
    opacity: 0.5;
    transform: translate3d(3vw, 12vh, 0) scale(0.96);
  }
}

@keyframes aiGlowDriftB {
  0%,
  100% {
    opacity: 0.46;
    transform: translate3d(0, 0, 0) scale(1);
  }

  45% {
    opacity: 0.68;
    transform: translate3d(8vw, -5vh, 0) scale(1.1);
  }

  76% {
    opacity: 0.42;
    transform: translate3d(3vw, -10vh, 0) scale(0.96);
  }
}

.page a {
  color: inherit;
  text-decoration: none;
}

.page [data-ai-reveal] {
  opacity: 0;
  transform: translateY(var(--ai-reveal-y, 28px)) scale(var(--ai-reveal-scale, 0.992));
  filter: blur(var(--ai-reveal-blur, 3px));
  transition:
    opacity 1280ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 1280ms cubic-bezier(0.16, 1, 0.32, 1),
    filter 1280ms cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 220ms ease,
    border-color 220ms ease,
    background-color 220ms ease;
  transition-delay: var(--ai-delay, 0ms);
  will-change: opacity, transform;
}

.page .isVisible {
  opacity: 1;
  transform: translateY(0) scale(1);
  filter: blur(0);
}

.section {
  width: min(1120px, calc(100% - 40px));
  margin: 0 auto;
  padding: 96px 0;
}

.localHeader {
  position: sticky;
  top: 0;
  z-index: 40;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 22px;
  width: min(1180px, calc(100% - 28px));
  min-height: 72px;
  margin: 14px auto 0;
  padding: 12px 14px 12px 20px;
  border: 1px solid rgba(19, 32, 51, 0.12);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 18px 48px rgba(8, 26, 49, 0.08);
  backdrop-filter: blur(16px);
}

.brand {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  max-width: min(240px, 54vw);
  color: var(--ai-navy);
  font-size: 1rem;
  font-weight: 800;
  text-decoration: none;
  background: transparent;
}

.brandLogo {
  display: block;
  width: auto;
  max-width: 100%;
  height: 40px;
  object-fit: contain;
  background: transparent;
}

.desktopNav {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 12px 18px;
  min-width: 0;
  color: var(--ai-muted);
  font-size: 0.88rem;
  font-weight: 700;
}

.desktopMegaNav {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
  min-width: 0;
}

.navGroup {
  position: relative;
}

.navGroupButton {
  min-height: 42px;
  padding: 0 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ai-muted);
  font: inherit;
  font-size: 0.88rem;
  font-weight: 800;
  cursor: default;
}

.navGroupButton::after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-left: 8px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
}

.navDropdown {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 45;
  display: grid;
  gap: 8px;
  width: min(320px, calc(100vw - 36px));
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background: rgba(6, 9, 18, 0.96);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.42);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-8px) scale(0.98);
  transform-origin: top right;
  backdrop-filter: blur(18px);
}

.navGroup:hover .navDropdown,
.navGroup:focus-within .navDropdown {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}

.navDropdown a {
  display: grid;
  gap: 4px;
  padding: 12px;
  border-radius: 8px;
}

.navDropdown a:hover,
.navDropdown a.activeNav,
.navGroupButton.activeNav {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

.navLinkLabel {
  color: #f8fbff;
  font-weight: 900;
}

.navLinkDescription {
  color: #aebbd3;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.55;
}

.desktopNav a,
.desktopMegaNav a,
.navGroupButton,
.navDropdown,
.headerCta,
.mobileMenu a,
.mobileNavGroup summary,
.primaryButton,
.secondaryButton,
.textButton,
.desktopFloatingCta,
.mobileStickyCta,
.zoomButton,
.lightboxClose {
  transition:
    transform 180ms ease,
    background-color 180ms ease,
    border-color 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease;
}

.desktopNav a:hover {
  color: var(--ai-navy);
}

.navGroup:hover .navGroupButton,
.navGroup:focus-within .navGroupButton {
  color: #ffffff;
}

.headerCta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 18px;
  border-radius: 8px;
  background: var(--ai-navy);
  color: #ffffff;
  font-weight: 800;
  white-space: nowrap;
}

.headerCta:hover,
.primaryButton:hover,
.desktopFloatingCta:hover,
.mobileStickyCta:hover {
  background: var(--ai-navy-deep);
  transform: translateY(-1px);
}

.menuButton {
  display: none;
  width: 44px;
  height: 44px;
  border: 1px solid var(--ai-line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ai-navy);
}

.menuButton span {
  display: block;
  width: 19px;
  height: 2px;
  margin: 4px auto;
  border-radius: 999px;
  background: currentColor;
  transition:
    opacity 180ms ease,
    transform 180ms ease;
}

.mobileMenu {
  display: none;
}

.mobileMenuFab {
  display: none;
}

.mobileNavGroup {
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.035);
  overflow: hidden;
}

.mobileNavGroup summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 48px;
  padding: 0 12px;
  color: #f8fbff;
  font-weight: 900;
  cursor: pointer;
  list-style: none;
}

.mobileNavGroup summary::-webkit-details-marker {
  display: none;
}

.mobileNavGroup summary::after {
  content: "";
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform 180ms ease;
}

.mobileNavGroup[open] summary::after {
  transform: rotate(225deg);
}

.mobileNavLinks {
  display: grid;
  gap: 4px;
  padding: 0 8px 8px;
}

.hero {
  --hero-copy-shift: 0px;
  --hero-copy-opacity: 1;
  --hero-focus-offset: -28px;
  --hero-focus-opacity: 0.58;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr));
  gap: 52px;
  align-items: center;
  min-height: auto;
  padding-top: 88px;
  padding-bottom: 92px;
}

.heroCopy {
  max-width: 760px;
  min-width: 0;
  --ai-reveal-y: -30px;
  --ai-reveal-scale: 0.99;
  --ai-reveal-blur: 8px;
}

.heroCopy.isVisible {
  opacity: var(--hero-copy-opacity, 1);
  transform: translate3d(0, var(--hero-copy-shift, 0px), 0) scale(1);
  filter: blur(0);
  transition:
    opacity 720ms cubic-bezier(0.4, 0, 0.2, 1),
    transform 720ms cubic-bezier(0.18, 1.16, 0.28, 1),
    filter 720ms cubic-bezier(0.4, 0, 0.2, 1);
}

.eyebrow {
  margin: 0 0 14px;
  color: var(--ai-gold-dark);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.hero h1,
.sectionIntro h2,
.finalCta h2,
.aboutHero h1 {
  margin: 0;
  color: var(--ai-navy-deep);
  font-weight: 900;
  line-height: 1.08;
}

.hero h1 {
  font-size: clamp(2.7rem, 6vw, 5.6rem);
  overflow-wrap: anywhere;
  word-break: break-word;
}

.formSectionTitle {
  margin: 10px 0 0;
  color: #07111f;
  font-size: 1.12rem;
  line-height: 1.5;
}

.contactForm b,
.checkboxGroup legend b,
.privacyConsent b {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  margin-left: 6px;
  padding: 0 8px;
  border-radius: 999px;
  background: rgba(255, 215, 122, 0.18);
  color: #a15d00;
  font-size: 0.74rem;
  font-weight: 950;
}

.formHoney {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.formHoney span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.privacyConsent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: #111827;
  font-weight: 900;
  line-height: 1.6;
}

.privacyConsent input {
  width: 18px;
  min-width: 18px;
  height: 18px;
  min-height: 18px;
  margin-top: 3px;
}

.formStatus:empty {
  display: none;
}

.thanksSection {
  display: grid;
  gap: 28px;
  width: min(1050px, calc(100% - 40px));
}

.thanksPanel,
.thanksSteps article,
.thanksChecklist {
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 18px 52px rgba(15, 23, 42, 0.08);
}

.thanksPanel {
  display: grid;
  gap: 16px;
  padding: clamp(24px, 4vw, 36px);
}

.thanksPanel p {
  margin: 0;
  color: #334155;
  font-weight: 780;
  line-height: 1.9;
}

.thanksSteps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.thanksSteps article {
  padding: 24px;
}

.thanksSteps span {
  display: inline-grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(135deg, #1f87ff, #2dd4ff 48%, #d94aa9);
  color: #ffffff;
  font-weight: 950;
  box-shadow: 0 16px 34px rgba(31, 135, 255, 0.22);
}

.thanksSteps h2 {
  margin: 16px 0 10px;
  color: #07111f;
  font-size: 1.15rem;
}

.thanksSteps p {
  margin: 0;
  color: #526174;
  font-weight: 760;
  line-height: 1.75;
}

.thanksChecklist {
  padding: clamp(24px, 4vw, 34px);
}

.checkListCompact {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.checkListCompact li {
  position: relative;
  padding: 14px 14px 14px 42px;
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 12px;
  background: #ffffff;
  color: #243449;
  font-weight: 850;
  line-height: 1.55;
}

.checkListCompact li::before {
  content: "✓";
  position: absolute;
  left: 16px;
  top: 14px;
  color: #0b64c0;
  font-weight: 950;
}

.thanksActions {
  justify-content: center;
}

@media (max-width: 880px) {
  .formSectionTitle {
    font-size: 1rem;
  }

  .privacyConsent {
    align-items: flex-start;
  }

  .thanksSection {
    width: calc(100vw - 28px);
  }

  .thanksSteps,
  .checkListCompact {
    grid-template-columns: 1fr;
  }
}

.hero h1 span {
  display: block;
  margin-top: 18px;
  font-size: clamp(1.5rem, 3.1vw, 3rem);
  line-height: 1.22;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.lead {
  margin: 28px 0 0;
  color: #334155;
  font-size: 1.08rem;
  line-height: 2;
  overflow-wrap: anywhere;
}

.heroActions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 20px;
}

.primaryButton,
.secondaryButton,
.textButton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  border-radius: 8px;
  font-weight: 900;
}

.primaryButton {
  padding: 0 22px;
  background: var(--ai-navy);
  color: #ffffff;
  box-shadow: 0 16px 32px rgba(16, 43, 78, 0.18);
}

.page .headerCta,
.page .primaryButton,
.page .desktopFloatingCta,
.page .mobileStickyCta {
  color: #ffffff;
}

.secondaryButton {
  padding: 0 20px;
  border: 1px solid var(--ai-gold);
  background: #ffffff;
  color: var(--ai-navy);
}

.secondaryButton:hover {
  border-color: var(--ai-gold-dark);
  background: var(--ai-ivory);
  transform: translateY(-1px);
}

.textButton {
  padding: 0 10px;
  color: var(--ai-gold-dark);
}

.badges {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 32px;
}

.badges span {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid rgba(181, 139, 59, 0.34);
  border-radius: 999px;
  background: #ffffff;
  color: #334155;
  font-size: 0.84rem;
  font-weight: 800;
}

.heroPrice {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin-top: 24px;
  padding: 18px 20px;
  border: 1px solid rgba(181, 139, 59, 0.42);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 16px 38px rgba(8, 26, 49, 0.08);
  overflow: hidden;
  --ai-reveal-y: 22px;
}

.heroPrice::before {
  content: "";
  position: absolute;
  inset: 14px auto 14px 0;
  width: 4px;
  border-radius: 0 999px 999px 0;
  background: var(--ai-gold);
  transform-origin: center;
  animation: aiPriceMark 2.8s ease-in-out infinite;
}

.heroPrice span {
  display: block;
  color: var(--ai-gold-dark);
  font-size: 0.78rem;
  font-weight: 900;
}

.heroPrice strong {
  display: block;
  margin-top: 4px;
  color: var(--ai-navy-deep);
  font-size: clamp(1.25rem, 2.2vw, 1.75rem);
  line-height: 1.2;
}

.heroPrice p {
  grid-column: 1 / -1;
  margin: 0;
  color: #485569;
  font-size: 0.9rem;
  line-height: 1.7;
  overflow-wrap: anywhere;
}

.heroPrice a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid var(--ai-gold);
  border-radius: 8px;
  color: var(--ai-navy);
  font-weight: 900;
  white-space: nowrap;
}

.heroPanel {
  position: relative;
  min-width: 0;
  border: 1px solid rgba(181, 139, 59, 0.34);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 24px 70px rgba(8, 26, 49, 0.12);
  overflow: hidden;
  --ai-reveal-y: -30px;
  --ai-reveal-scale: 0.98;
  --ai-reveal-blur: 10px;
}

.cardMotion {
  --ai-reveal-y: 44px;
  --ai-reveal-scale: 0.98;
  will-change: opacity, transform;
}

.heroPanel::before {
  content: "";
  display: block;
  height: 8px;
  background: linear-gradient(90deg, var(--ai-gold), #d9bd76, var(--ai-gold));
  background-size: 220% 100%;
  animation: aiGoldSweep 4.6s ease-in-out infinite;
}

.heroPanel.isVisible {
  opacity: var(--hero-focus-opacity, 1);
  transform: translate3d(0, var(--hero-focus-offset, 0px), 0) scale(1);
  filter: blur(0);
  transition:
    opacity 720ms cubic-bezier(0.4, 0, 0.2, 1),
    transform 720ms cubic-bezier(0.18, 1.16, 0.28, 1),
    filter 720ms cubic-bezier(0.4, 0, 0.2, 1);
}

.heroPanel.isVisible dl div {
  animation: aiPanelItemIn 620ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

.heroPanel.isVisible dl div:nth-child(2) {
  animation-delay: 110ms;
}

.heroPanel.isVisible dl div:nth-child(3) {
  animation-delay: 220ms;
}

.heroPanel dl {
  display: grid;
  gap: 0;
  margin: 0;
}

.heroPanel div {
  padding: 24px;
  border-bottom: 1px solid var(--ai-line);
}

.heroPanel dt {
  color: var(--ai-gold-dark);
  font-size: 0.82rem;
  font-weight: 900;
}

.heroPanel dd {
  margin: 8px 0 0;
  color: var(--ai-navy-deep);
  font-size: 1.08rem;
  font-weight: 900;
  line-height: 1.55;
}

.panelLabel {
  margin: 0;
  padding: 26px 24px 0;
  color: var(--ai-muted);
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.panelNote {
  margin: 0;
  padding: 22px 24px 26px;
  background: var(--ai-ivory);
  color: var(--ai-muted);
  font-size: 0.9rem;
  line-height: 1.8;
}

.sectionIntro {
  max-width: 800px;
  min-width: 0;
  margin-bottom: 36px;
}

.sectionIntro h2,
.finalCta h2 {
  font-size: clamp(2rem, 4vw, 3.2rem);
}

.sectionIntro p,
.finalCta p,
.aboutLinkSection p,
.articleGrid p {
  color: #485569;
  font-size: 1rem;
  line-height: 1.9;
}

.proofSection {
  width: min(1180px, calc(100% - 40px));
}

.achievementGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.achievementCard,
.featureCard,
.darkCard,
.processCard,
.industryCard,
.priceCard,
.faqItem {
  border-radius: 8px;
}

.achievementCard {
  border: 1px solid var(--ai-line);
  background: #ffffff;
  overflow: hidden;
  box-shadow: 0 16px 44px rgba(8, 26, 49, 0.08);
  transition:
    transform 220ms ease,
    box-shadow 220ms ease,
    border-color 220ms ease;
}

.achievementCard:hover {
  border-color: rgba(181, 139, 59, 0.48);
  box-shadow: 0 22px 58px rgba(8, 26, 49, 0.12);
  transform: translateY(-3px);
}

.achievementMedia {
  position: relative;
  aspect-ratio: 16 / 10;
  background: #f8fbff;
  overflow: hidden;
}

.achievementImage {
  display: block;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  object-fit: contain;
  object-position: center center;
  padding: 10px;
  background: #ffffff;
}

.placeholder {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  width: 100%;
  height: 100%;
  padding: 24px;
  background:
    linear-gradient(135deg, rgba(16, 43, 78, 0.08), rgba(181, 139, 59, 0.16)),
    #f7f3eb;
  color: var(--ai-navy);
  text-align: center;
}

.placeholder span {
  color: var(--ai-gold-dark);
  font-size: 0.76rem;
  font-weight: 900;
  text-transform: uppercase;
}

.placeholder strong {
  font-size: 1rem;
}

.placeholder small {
  color: var(--ai-muted);
}

.achievementBody {
  padding: 20px;
}

.achievementBody p {
  margin: 0;
  color: var(--ai-gold-dark);
  font-size: 0.86rem;
  font-weight: 900;
  line-height: 1.6;
}

.achievementBody h3 {
  margin: 8px 0 18px;
  color: var(--ai-navy-deep);
  font-size: 1.25rem;
}

.zoomButton {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--ai-line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ai-navy);
  font-weight: 900;
  cursor: pointer;
}

.zoomButton:hover:not(:disabled) {
  border-color: var(--ai-gold);
  background: var(--ai-ivory);
}

.zoomButton:disabled {
  color: #7a8594;
  cursor: not-allowed;
}

.notice {
  margin: 22px 0 0;
  padding: 16px 18px;
  border-left: 4px solid var(--ai-gold);
  background: #ffffff;
  color: #485569;
  font-size: 0.92rem;
  line-height: 1.8;
}

.notice p {
  margin: 0;
}

.notice p + p {
  margin-top: 8px;
}

.screenshotCredit {
  margin: 12px auto 0;
  max-width: 1100px;
  color: #526275;
  font-size: 0.74rem;
  font-weight: 800;
  line-height: 1.7;
}

.painSection {
  position: relative;
  width: min(1180px, calc(100% - 44px));
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 28px;
  background:
    radial-gradient(circle at 10% 10%, rgba(31, 135, 255, 0.12), transparent 30%),
    radial-gradient(circle at 88% 8%, rgba(238, 92, 183, 0.14), transparent 30%),
    radial-gradient(circle at 48% 96%, rgba(255, 215, 122, 0.13), transparent 32%),
    rgba(255, 255, 255, 0.92);
  box-shadow:
    0 26px 82px rgba(15, 23, 42, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.painIntro {
  max-width: 900px;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}

.painGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.painCard {
  display: block;
  min-height: 0;
  padding: 0;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 18px 52px rgba(15, 23, 42, 0.08);
  overflow: hidden;
}

.painCardSummary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  padding: clamp(18px, 2.4vw, 24px);
  list-style: none;
  cursor: pointer;
}

.painCardSummary::-webkit-details-marker {
  display: none;
}

.painCardSummary .painCardTop,
.painCardSummary h3 {
  grid-column: 1;
}

.painCardSummary::after {
  content: "＋";
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: start;
  margin-top: 2px;
  color: #1f87ff;
  font-size: 1.1rem;
  font-weight: 900;
  line-height: 1;
}

.painCard[open] .painCardSummary::after {
  content: "－";
}

.painCardBody {
  padding: 0 clamp(18px, 2.4vw, 24px) clamp(18px, 2.4vw, 24px);
}

.painCardTop {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.painNumber {
  color: #1f87ff;
  font-size: 0.86rem;
  font-weight: 950;
  letter-spacing: 0.12em;
}

.painLabel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 0 12px;
  border: 1px solid rgba(181, 139, 59, 0.26);
  border-radius: 999px;
  background: rgba(255, 245, 220, 0.86);
  color: #9b5f00;
  font-size: 0.78rem;
  font-weight: 950;
}

.painCard h3 {
  margin: 0;
  color: #07111f;
  font-size: clamp(1.05rem, 3.8vw, 1.45rem);
  line-height: 1.42;
}

.painCard > p {
  display: none;
}

.painSolution {
  align-self: stretch;
  padding: 18px;
  border: 1px solid rgba(31, 135, 255, 0.15);
  border-radius: 16px;
  background:
    radial-gradient(circle at 12% 8%, rgba(31, 135, 255, 0.1), transparent 34%),
    radial-gradient(circle at 92% 18%, rgba(238, 92, 183, 0.1), transparent 30%),
    #f8fbff;
}

.painSolution h4 {
  margin: 0;
  color: #0b3564;
  font-size: 1rem;
  line-height: 1.55;
}

.painSolution p {
  margin: 10px 0 0;
  color: #405067;
  font-size: 0.92rem;
  font-weight: 720;
  line-height: 1.85;
}

.painCard small {
  display: inline-flex;
  width: fit-content;
  min-height: 26px;
  align-items: center;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(7, 17, 31, 0.06);
  color: #334155;
  font-size: 0.76rem;
  font-weight: 950;
}

.painCta {
  display: grid;
  justify-items: center;
  gap: 14px;
  width: min(800px, 100%);
  margin: 28px auto 0;
  padding: clamp(22px, 3vw, 30px);
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 20px;
  background:
    radial-gradient(circle at 20% 18%, rgba(31, 135, 255, 0.11), transparent 30%),
    radial-gradient(circle at 80% 26%, rgba(238, 92, 183, 0.12), transparent 30%),
    rgba(255, 255, 255, 0.84);
  text-align: center;
}

.painCta p {
  margin: 0;
  color: #07111f;
  font-size: clamp(1.06rem, 1.5vw, 1.24rem);
  font-weight: 900;
  line-height: 1.7;
}

.painCta .primaryButton {
  width: min(360px, 100%);
}

.painCta small {
  max-width: 620px;
  color: #526275;
  font-size: 0.86rem;
  font-weight: 800;
  line-height: 1.75;
}

.cardGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.featureCard,
.processCard,
.industryCard,
.priceCard {
  border: 1px solid var(--ai-line);
  background: #ffffff;
  box-shadow: 0 14px 36px rgba(8, 26, 49, 0.06);
}

.featureCard {
  min-height: 210px;
  padding: 26px;
}

.featureCard h3,
.darkCard h3,
.processCard h3,
.industryCard h3,
.priceCard h3,
.articleGrid h2 {
  margin: 0;
  color: var(--ai-navy-deep);
  font-size: 1.15rem;
  line-height: 1.45;
}

.featureCard p,
.darkCard p,
.processCard p,
.priceCard dd {
  margin: 14px 0 0;
  color: #4b596b;
  line-height: 1.8;
}

.aioFocusPanel {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 18px;
  margin-top: 36px;
  padding: clamp(34px, 6vw, 62px);
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 24px;
  background:
    radial-gradient(circle at 14% 16%, rgba(31, 135, 255, 0.18), transparent 34%),
    radial-gradient(circle at 82% 18%, rgba(255, 100, 199, 0.2), transparent 32%),
    radial-gradient(circle at 52% 92%, rgba(255, 215, 122, 0.2), transparent 34%),
    rgba(255, 255, 255, 0.92);
  text-align: center;
  box-shadow:
    0 24px 76px rgba(15, 23, 42, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  overflow: hidden;
}

.aioFocusPanel::before {
  content: "";
  position: absolute;
  inset: -28%;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 30% 54%, rgba(45, 212, 255, 0.14), transparent 28%),
    radial-gradient(circle at 68% 44%, rgba(217, 74, 169, 0.14), transparent 30%);
  filter: blur(24px);
  opacity: 0.82;
  animation: aiGlowDriftA 12s cubic-bezier(0.45, 0, 0.2, 1) infinite;
}

.aioFocusPanel > * {
  position: relative;
  z-index: 1;
}

.aioFocusPanel h3 {
  max-width: none;
  margin: 0;
  font-family:
    "Hiragino Maru Gothic ProN",
    "M PLUS Rounded 1c",
    "Zen Maru Gothic",
    "Arial Rounded MT Bold",
    "Yu Gothic",
    YuGothic,
    system-ui,
    sans-serif;
  font-size: clamp(2rem, 4.2vw, 4.2rem);
  font-weight: 950;
  line-height: 1.08;
  letter-spacing: 0;
  text-wrap: balance;
  background:
    linear-gradient(110deg, #07111f 0%, #1f87ff 30%, #15b9db 48%, #d94aa9 70%, #07111f 100%);
  background-size: 260% 100%;
  color: transparent;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  -webkit-background-clip: text;
  animation: aiTextAuroraFlow 8s cubic-bezier(0.45, 0, 0.2, 1) infinite;
}

.aioFocusPanel h3 span {
  display: block;
  white-space: nowrap;
}

.aioFocusPanel p:not(.eyebrow) {
  max-width: 760px;
  margin: 0;
  color: #26364b;
  font-size: clamp(1rem, 1.4vw, 1.14rem);
  font-weight: 800;
  line-height: 1.9;
}

.contrastSection {
  width: 100%;
  max-width: none;
  padding: 92px max(20px, calc((100vw - 1120px) / 2));
  background: var(--ai-ivory);
}

.contrastSection .sectionIntro h2,
.contrastSection .sectionIntro p {
  color: var(--ai-navy-deep);
}

.contrastSection .eyebrow {
  color: var(--ai-gold-dark);
}

.threeColumn {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.darkCard {
  padding: 26px;
  border: 1px solid var(--ai-line);
  background: #ffffff;
  box-shadow: 0 14px 36px rgba(8, 26, 49, 0.06);
}

.darkCard h3,
.darkCard p {
  color: var(--ai-navy-deep);
}

.processGrid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}

.processCard {
  padding: 22px;
}

.processCard span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  margin-bottom: 18px;
  border-radius: 50%;
  background: var(--ai-ivory);
  color: var(--ai-gold-dark);
  font-weight: 900;
}

.serviceScope {
  border-top: 1px solid var(--ai-line);
  border-bottom: 1px solid var(--ai-line);
}

.checkList {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.checkList li {
  position: relative;
  min-height: 52px;
  padding: 15px 18px 15px 44px;
  border: 1px solid var(--ai-line);
  border-radius: 8px;
  background: #ffffff;
  color: #334155;
  font-weight: 700;
  line-height: 1.5;
}

.checkList li::before {
  content: "";
  position: absolute;
  left: 17px;
  top: 21px;
  width: 11px;
  height: 6px;
  border-bottom: 2px solid var(--ai-gold-dark);
  border-left: 2px solid var(--ai-gold-dark);
  transform: rotate(-45deg);
}

.industryGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.industryCard {
  display: flex;
  align-items: center;
  min-height: 112px;
  padding: 22px;
}

.pricingSection {
  width: min(1180px, calc(100% - 40px));
}

.pricingTableWrap {
  overflow-x: auto;
  border: 1px solid var(--ai-line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 18px 48px rgba(8, 26, 49, 0.08);
}

.pricingTable {
  width: 100%;
  min-width: 0;
  border-collapse: collapse;
}

.pricingTable th,
.pricingTable td {
  padding: 20px;
  border-bottom: 1px solid var(--ai-line);
  color: #334155;
  line-height: 1.7;
  text-align: left;
  vertical-align: top;
}

.pricingTable thead th {
  background: var(--ai-navy);
  color: #ffffff;
  font-size: 0.9rem;
}

.pricingTable tbody th {
  color: var(--ai-navy-deep);
  font-size: 1rem;
  white-space: nowrap;
}

.pricingTable tbody td:nth-child(2) {
  color: var(--ai-gold-dark);
  font-size: 1.08rem;
  font-weight: 900;
  white-space: nowrap;
}

.pricingTable th:last-child,
.pricingTable td:last-child {
  width: 128px;
  text-align: center;
}

.tableCta,
.priceCardCta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 112px;
  min-width: 112px;
  min-height: 46px;
  padding: 0 14px;
  border: 1px solid rgba(20, 58, 95, 0.14);
  border-radius: 999px;
  background: #143a5f;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff;
  font-size: 0.9rem;
  font-weight: 900;
  line-height: 1.35;
  text-decoration: none;
  white-space: nowrap;
  box-shadow: 0 10px 26px rgba(20, 58, 95, 0.16);
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    background 180ms ease,
    box-shadow 180ms ease;
}

.tableCta:hover,
.priceCardCta:hover {
  transform: translateY(-1px);
  border-color: rgba(45, 212, 255, 0.8);
  background: linear-gradient(110deg, #1f87ff, #2dd4ff 48%, #e95bc1);
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff;
  box-shadow: 0 12px 28px rgba(45, 212, 255, 0.16);
}

.recommendedRow th,
.recommendedRow td {
  background: #fbf8f1;
}

.recommendedBadge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  margin: 0 8px 8px 0;
  padding: 0 10px;
  border-radius: 999px;
  background: var(--ai-gold);
  color: #ffffff;
  font-size: 0.78rem;
  font-weight: 900;
  vertical-align: middle;
}

.planRecommendedBadge {
  display: flex;
  width: fit-content;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  margin-top: 10px;
  padding: 0 10px;
  border-radius: 999px;
  background: var(--ai-gold);
  color: #ffffff;
  font-size: 0.76rem;
  font-weight: 900;
  line-height: 1;
}

.guaranteeBadge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  margin: 0 8px 8px 0;
  padding: 0 12px;
  border: 1px solid rgba(20, 33, 61, 0.16);
  border-radius: 999px;
  background:
    linear-gradient(135deg, rgba(255, 215, 122, 0.96), rgba(255, 100, 199, 0.9)),
    #ffd77a;
  color: #07111f;
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1.25;
  vertical-align: middle;
  box-shadow: 0 10px 24px rgba(255, 100, 199, 0.16);
}

.pricingTable tr:last-child th,
.pricingTable tr:last-child td {
  border-bottom: 0;
}

.pricingCards {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.price {
  margin: 14px 0;
  color: var(--ai-gold-dark);
  font-size: 1.35rem;
  font-weight: 900;
}

.priceCard {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 26px;
  border-radius: 14px;
}

.priceCard .priceCardCta {
  margin-top: auto;
}

.priceCardRecommended {
  border-color: rgba(181, 139, 59, 0.72);
  box-shadow: 0 22px 58px rgba(181, 139, 59, 0.16);
}

.refundGuarantee {
  position: relative;
  display: grid;
  gap: 30px;
  margin: 24px 0 0;
  padding: clamp(30px, 5.6vw, 68px);
  border: 1px solid rgba(20, 33, 61, 0.12);
  border-radius: 18px;
  background:
    radial-gradient(circle at 16% 18%, rgba(31, 135, 255, 0.2), transparent 34%),
    radial-gradient(circle at 82% 20%, rgba(255, 100, 199, 0.22), transparent 36%),
    radial-gradient(circle at 54% 92%, rgba(255, 215, 122, 0.2), transparent 38%),
    rgba(255, 255, 255, 0.9);
  box-shadow:
    0 32px 92px rgba(15, 23, 42, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.82);
  overflow: hidden;
}

.refundGuarantee::before {
  content: "";
  position: absolute;
  inset: -28%;
  border-radius: 999px;
  background:
    radial-gradient(circle at 36% 40%, rgba(31, 135, 255, 0.22), transparent 0 34%),
    radial-gradient(circle at 64% 54%, rgba(255, 100, 199, 0.18), transparent 0 38%),
    radial-gradient(circle at 50% 74%, rgba(255, 215, 122, 0.18), transparent 0 36%);
  filter: blur(34px);
  opacity: 0.8;
  pointer-events: none;
  transform: translate3d(0, 0, 0) scale(1);
  animation: aiGuaranteeGlow 15s cubic-bezier(0.45, 0, 0.2, 1) infinite;
}

.refundGuarantee > * {
  position: relative;
  z-index: 1;
}

.refundGuaranteeKicker {
  margin: 0 0 12px;
  color: #8a5400;
  font-size: 0.82rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.refundGuarantee h3 {
  margin: 0;
  color: #07111f;
  font-size: clamp(1.28rem, 2.1vw, 1.65rem);
  line-height: 1.35;
  font-weight: 900;
}

.refundGuaranteeLead {
  max-width: 900px;
  margin: 12px 0 0;
  color: #334155;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.8;
  text-wrap: pretty;
}

.guaranteeGrid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
  gap: 24px;
  align-items: start;
}

.guaranteeGrid p {
  margin: 0;
  color: #172033;
  font-size: 1.02rem;
  font-weight: 800;
  line-height: 1.95;
}

.guaranteeNote {
  margin-top: 16px !important;
  padding: 16px 18px;
  border-left: 4px solid #143a5f;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  color: #334155 !important;
  font-weight: 700 !important;
}

.guaranteeProofImage {
  position: relative;
  margin: 24px 0 0;
  min-height: clamp(260px, 34vw, 420px);
  border: 1px solid rgba(20, 33, 61, 0.14);
  border-radius: 18px;
  background: #10131a;
  box-shadow:
    0 24px 64px rgba(15, 23, 42, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
  overflow: hidden;
}

.guaranteeProofImage img {
  display: block;
  width: 100%;
  height: clamp(260px, 34vw, 420px);
  object-fit: cover;
  object-position: 50% 28%;
  filter: saturate(1.08) contrast(1.08);
  transform: scale(1.04);
}

.guaranteeProofImage::after {
  content: "japanrealtor.jp";
  position: absolute;
  left: 18px;
  top: 18px;
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  background: rgba(8, 12, 20, 0.72);
  color: #ffffff;
  font-size: 0.86rem;
  font-weight: 900;
  backdrop-filter: blur(12px);
}

.guaranteeProofImage figcaption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0;
  padding: 18px 20px;
  background: linear-gradient(180deg, transparent, rgba(8, 12, 20, 0.9));
  color: #ffffff;
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1.6;
}

.guaranteeConditions {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.guaranteeSide {
  display: grid;
  gap: 16px;
}

.guaranteeConditions li {
  position: relative;
  min-height: 46px;
  padding: 13px 16px 13px 42px;
  border: 1px solid rgba(20, 33, 61, 0.1);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.74);
  color: #172033;
  font-weight: 850;
  line-height: 1.55;
}

.guaranteeConditions li::before {
  content: "";
  position: absolute;
  left: 16px;
  top: 20px;
  width: 12px;
  height: 7px;
  border-bottom: 2px solid #143a5f;
  border-left: 2px solid #143a5f;
  transform: rotate(-45deg);
}

.performanceBilling {
  position: relative;
  display: grid;
  gap: 10px;
  padding: 24px;
  border: 1px solid rgba(255, 183, 77, 0.45);
  border-radius: 18px;
  background:
    radial-gradient(circle at 14% 14%, rgba(255, 215, 122, 0.42), transparent 34%),
    radial-gradient(circle at 86% 78%, rgba(255, 100, 199, 0.24), transparent 36%),
    linear-gradient(135deg, rgba(255, 247, 214, 0.96), rgba(255, 242, 250, 0.94));
  box-shadow:
    0 24px 70px rgba(155, 98, 0, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.92);
  overflow: hidden;
}

.performanceBilling::before {
  content: "";
  position: absolute;
  inset: -34%;
  pointer-events: none;
  background:
    radial-gradient(circle at 32% 50%, rgba(255, 184, 73, 0.2), transparent 34%),
    radial-gradient(circle at 72% 42%, rgba(233, 91, 193, 0.16), transparent 34%);
  filter: blur(18px);
  animation: aiGuaranteeGlow 9s cubic-bezier(0.45, 0, 0.2, 1) infinite;
}

.performanceBilling > * {
  position: relative;
  z-index: 1;
}

.performanceBilling span {
  justify-self: start;
  min-height: 30px;
  padding: 5px 12px;
  border-radius: 999px;
  background: #143a5f;
  color: #ffffff;
  font-size: 0.82rem;
  font-weight: 950;
  letter-spacing: 0.08em;
}

.performanceBilling strong {
  color: #07111f;
  font-size: clamp(1.15rem, 1.8vw, 1.45rem);
  font-weight: 900;
  line-height: 1.35;
  text-wrap: balance;
}

.performanceBilling p {
  margin: 0;
  color: #7a3f00 !important;
  font-size: clamp(1rem, 1.35vw, 1.18rem);
  font-weight: 950 !important;
  line-height: 1.55 !important;
}

.guaranteeCtaButton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 58px;
  padding: 0 22px;
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 14px;
  background: linear-gradient(110deg, #1f87ff, #2dd4ff 42%, #e95bc1);
  color: #ffffff;
  font-weight: 950;
  text-align: center;
  box-shadow: 0 20px 52px rgba(31, 135, 255, 0.24);
  transition:
    transform 180ms ease,
    box-shadow 180ms ease;
}

.guaranteeCtaButton:hover {
  transform: translate3d(0, -2px, 0);
  box-shadow: 0 24px 62px rgba(31, 135, 255, 0.32);
}

@keyframes aiGuaranteeGlow {
  0%,
  100% {
    opacity: 0.55;
    transform: translate3d(-4vw, -2vh, 0) scale(0.96);
  }

  44% {
    opacity: 0.88;
    transform: translate3d(5vw, 3vh, 0) scale(1.06);
  }

  74% {
    opacity: 0.68;
    transform: translate3d(1vw, -4vh, 0) scale(0.98);
  }
}

.priceCard dl {
  display: grid;
  gap: 14px;
  margin: 0;
}

.priceCard dt {
  color: var(--ai-muted);
  font-size: 0.82rem;
  font-weight: 900;
}

.priceCardCta {
  width: 100%;
  margin-top: 18px;
}

.ctaNote {
  color: #dbe7ff;
  font-weight: 800;
}

.workflow {
  display: grid;
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: workflow;
}

.workflow li {
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 18px;
  align-items: start;
  padding: 24px;
  border: 1px solid var(--ai-line);
  border-radius: 8px;
  background: #ffffff;
}

.workflow span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--ai-navy);
  color: #ffffff;
  font-weight: 900;
}

.workflow h3 {
  margin: 0;
  color: var(--ai-navy-deep);
  font-size: 1.18rem;
}

.workflow p {
  margin: 8px 0 0;
  color: #4b596b;
  line-height: 1.75;
}

.aboutLinkSection {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 28px;
  align-items: center;
  padding: 42px;
  border: 1px solid rgba(181, 139, 59, 0.34);
  border-radius: 8px;
  background: #ffffff;
}

.aboutLinkSection h2 {
  margin: 0;
  color: var(--ai-navy-deep);
  font-size: clamp(1.8rem, 3vw, 2.5rem);
}

.faqList {
  display: grid;
  gap: 12px;
}

.faqItem {
  border: 1px solid var(--ai-line);
  background: #ffffff;
}

.faqItem summary {
  min-height: 58px;
  padding: 18px 22px;
  color: var(--ai-navy-deep);
  font-weight: 900;
  cursor: pointer;
}

.faqItem p {
  margin: 0;
  padding: 0 22px 20px;
  color: #4b596b;
  line-height: 1.8;
}

.finalCta {
  margin-bottom: 54px;
  padding: 56px;
  border-radius: 8px;
  background: var(--ai-navy-deep);
  color: #ffffff;
}

.finalCta h2,
.finalCta p {
  color: #ffffff;
}

.finalCta .secondaryButton {
  background: transparent;
  color: #ffffff;
}

.desktopFloatingCta {
  position: fixed;
  right: 22px;
  bottom: 28px;
  z-index: 35;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 0 20px;
  border-radius: 8px;
  background: var(--ai-navy);
  color: #ffffff;
  font-weight: 900;
  box-shadow: 0 18px 44px rgba(8, 26, 49, 0.22);
}

.dwellCtaPopup {
  position: fixed;
  right: 22px;
  bottom: 96px;
  z-index: 150;
  display: grid;
  gap: 12px;
  width: min(340px, calc(100vw - 32px));
  max-width: calc(100vw - 32px);
  padding: 22px;
  box-sizing: border-box;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 18px;
  background:
    radial-gradient(circle at 14% 12%, rgba(31, 135, 255, 0.18), transparent 34%),
    radial-gradient(circle at 88% 80%, rgba(255, 100, 199, 0.16), transparent 34%),
    rgba(255, 255, 255, 0.96);
  color: #07111f;
  box-shadow:
    0 24px 76px rgba(15, 23, 42, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.92);
  backface-visibility: hidden;
  transform: translate3d(0, 24px, 0) scale(0.98);
  opacity: 0;
  animation: dwellCtaIn 980ms cubic-bezier(0.16, 1, 0.3, 1) forwards;
  will-change: transform, opacity;
}

.dwellCtaPopup:not([hidden]) {
  pointer-events: auto;
}

.dwellCtaPopup[hidden] {
  display: none;
}

.dwellCtaPopup h2 {
  margin: 0;
  color: #07111f;
  font-size: 1.26rem;
  line-height: 1.45;
}

.dwellCtaPopup p:not(.eyebrow) {
  margin: 0;
  color: #334155;
  font-weight: 800;
  line-height: 1.7;
}

.dwellCtaPopup .primaryButton {
  width: 100%;
  min-height: 48px;
}

.dwellCtaClose {
  position: absolute;
  top: 10px;
  right: 12px;
  z-index: 3;
  display: inline-grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: 50%;
  background: #07111f;
  color: #ffffff;
  font-size: 1.55rem;
  font-weight: 900;
  line-height: 1;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.22);
  cursor: pointer;
  pointer-events: auto;
  touch-action: manipulation;
}

@keyframes dwellCtaIn {
  from {
    opacity: 0;
    transform: translate3d(0, 18px, 0) scale(0.96);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

.mobileStickyCta {
  display: none;
}

.midCtaSection {
  padding-top: 24px;
  padding-bottom: 70px;
}

.midCtaSection .footerCta {
  margin-bottom: 0;
}

.lightbox {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: none;
  place-items: center;
  padding: 24px;
  background: rgba(8, 26, 49, 0.72);
}

.lightbox.lightboxOpen {
  display: grid;
}

.lightbox[hidden] {
  display: none !important;
}

.lightboxPanel {
  width: min(1180px, 100%);
  max-height: min(860px, 92vh);
  padding: 18px;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.24);
}

.lightboxClose {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  margin-bottom: 12px;
  padding: 0 16px;
  border: 1px solid var(--ai-line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ai-navy);
  font-weight: 900;
}

.lightboxMedia {
  position: relative;
  aspect-ratio: 16 / 10;
  max-height: min(72vh, 700px);
  border: 1px solid var(--ai-line);
  border-radius: 8px;
  overflow: hidden;
  background: #ffffff;
}

.lightboxPanel p {
  margin: 12px 0 0;
  color: #334155;
  font-weight: 800;
}

.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 30px;
  color: var(--ai-muted);
  font-size: 0.9rem;
}

.breadcrumb a {
  color: var(--ai-navy);
  font-weight: 800;
}

.aboutPage {
  padding-bottom: 40px;
}

.aboutHero {
  padding-top: 90px;
}

.aboutHero h1 {
  font-size: clamp(2.6rem, 5vw, 4.8rem);
}

.articleGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

.articleGrid article {
  padding: 30px;
  border: 1px solid var(--ai-line);
  border-radius: 8px;
  background: #ffffff;
}

.page :focus-visible {
  outline: 3px solid rgba(181, 139, 59, 0.55);
  outline-offset: 3px;
}

@media (max-width: 1080px) {
  .hero {
    grid-template-columns: 1fr;
    gap: 34px;
    min-height: 0;
  }

  .heroPanel {
    max-width: 680px;
  }

  .achievementGrid,
  .cardGrid,
  .painGrid,
  .threeColumn,
  .industryGrid,
  .relatedGrid,
  .evidenceGrid,
  .queryMapGrid,
  .observationGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .processGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .footerGrid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 881px) {
  .pricingTable {
    min-width: 1080px;
  }
}

@media (max-width: 880px) {
  .localHeader {
    grid-template-columns: 1fr auto;
    width: min(calc(100% - 24px), 720px);
    margin-top: 10px;
  }

  .desktopNav,
  .desktopMegaNav,
  .headerCta {
    display: none;
  }

  .menuButton {
    position: fixed;
    top: 20px;
    right: 24px;
    left: auto;
    z-index: 70;
    display: block;
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(8, 26, 49, 0.12);
  }

  .mobileMenu {
    position: fixed;
    top: 84px;
    left: 14px;
    right: 14px;
    z-index: 65;
    display: grid;
    gap: 8px;
    max-height: calc(100dvh - 116px);
    overflow-y: auto;
    padding: 14px;
    border: 1px solid var(--ai-line);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 22px 58px rgba(8, 26, 49, 0.16);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-8px);
    transition:
      opacity 220ms ease,
      transform 220ms ease,
      visibility 220ms ease;
  }

  .mobileMenuOpen {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
  }

  .menuButton[aria-expanded="true"] span:nth-child(1) {
    transform: translateY(6px) rotate(42deg);
  }

  .menuButton[aria-expanded="true"] span:nth-child(2) {
    opacity: 0;
  }

  .menuButton[aria-expanded="true"] span:nth-child(3) {
    transform: translateY(-6px) rotate(-42deg);
  }

  .mobileMenu a {
    display: flex;
    align-items: center;
    min-height: 46px;
    padding: 0 12px;
    border-radius: 8px;
    color: var(--ai-navy);
    font-weight: 900;
  }

  .mobileMenu a:hover {
    background: var(--ai-ivory);
  }

  .mobileMenuCta {
    justify-content: center;
    background: var(--ai-navy);
    color: #ffffff !important;
  }

  .section {
    width: calc(100vw - 28px);
    max-width: 720px;
    padding: 62px 0;
  }

  .page {
    width: 100vw;
    max-width: 100vw;
    overflow-x: hidden;
  }

  .proofSection,
  .primarySourceSection,
  .pricingSection {
    width: calc(100vw - 28px);
    max-width: 720px;
  }

  .primarySourceSection {
    grid-template-columns: 1fr;
    gap: 24px;
    padding-top: 70px;
    padding-bottom: 74px;
  }

  .primarySourceCopy {
    justify-items: center;
    text-align: center;
  }

  .primarySourceCopy h2 {
    max-width: 10em;
    font-size: clamp(2.18rem, 10vw, 3.35rem);
  }

  .primarySourceCopy p:not(.eyebrow) {
    max-width: 34em;
    font-size: 0.96rem;
  }

  .primarySourceVisual,
  .primarySourceVisual img {
    min-height: 0;
  }

  .primarySourceVisual::after {
    top: 34%;
    font-size: clamp(1.08rem, 6vw, 1.78rem);
    white-space: normal;
  }

  .hero {
    padding-top: 44px;
    padding-bottom: 58px;
  }

  .heroCopy,
  .heroPanel {
    width: 100%;
    max-width: 100%;
  }

  .hero h1 {
    font-size: clamp(2.35rem, 12vw, 3.35rem);
  }

  .hero h1 span {
    font-size: clamp(1.25rem, 5vw, 1.55rem);
    line-height: 1.35;
    word-break: break-all;
  }

  .lead {
    font-size: 1rem;
    line-height: 1.78;
  }

  .heroActions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .heroPrice {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 20px;
    padding: 16px 18px;
  }

  .heroPrice a {
    width: 100%;
  }

  .primaryButton,
  .secondaryButton,
  .textButton {
    width: 100%;
  }

  .achievementGrid,
  .cardGrid,
  .painGrid,
  .threeColumn,
  .processGrid,
  .checkList,
  .industryGrid,
  .articleGrid,
  .relatedGrid,
  .sitemapGrid,
  .directoryGrid,
  .footerGrid {
    grid-template-columns: 1fr;
  }

  .siteFooter {
    width: calc(100vw - 28px);
    max-width: 720px;
    padding-bottom: 46px;
  }

  .footerCta {
    grid-template-columns: 1fr;
    padding: 26px;
  }

  .footerGrid {
    padding: 22px;
  }

  .relatedCard {
    min-height: auto;
  }

  .featureCard {
    min-height: auto;
  }

  .pricingTableWrap {
    display: none;
  }

  .pricingCards {
    display: grid;
    gap: 14px;
  }

  .aioFocusPanel {
    margin-top: 24px;
    padding: 30px 20px;
    border-radius: 18px;
  }

  .painSection {
    border-radius: 22px;
  }

  .painIntro {
    text-align: left;
  }

  .painCard {
    min-height: auto;
  }

  .painCta {
    justify-items: stretch;
    text-align: left;
  }

  .painCta .primaryButton {
    width: 100%;
  }

  .aioFocusPanel h3 {
    font-size: clamp(1.55rem, 6.7vw, 3rem);
  }

  .guaranteeGrid {
    grid-template-columns: 1fr;
  }

  .priceCard {
    padding: 22px;
  }

  .workflow li {
    grid-template-columns: 48px 1fr;
    padding: 20px;
  }

  .workflow span {
    width: 44px;
    height: 44px;
  }

  .aboutLinkSection {
    grid-template-columns: 1fr;
    width: calc(100vw - 28px);
    max-width: 720px;
    padding: 28px;
  }

  .finalCta {
    width: calc(100vw - 28px);
    max-width: 720px;
    padding: 34px 24px;
  }

  .desktopFloatingCta {
    display: none;
  }

  .mobileStickyCta {
    position: fixed;
    left: 14px;
    right: 14px;
    bottom: 14px;
    z-index: 60;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    border-radius: 8px;
    background: var(--ai-navy);
    color: #ffffff;
    font-weight: 900;
    box-shadow: 0 18px 44px rgba(8, 26, 49, 0.24);
  }

  .dwellCtaPopup {
    left: 14px;
    right: auto;
    bottom: 82px;
    z-index: 150;
    width: calc(100vw - 28px);
    max-width: calc(100vw - 28px);
    padding: 20px 18px 18px;
  }

  .dwellCtaPopup h2 {
    padding-right: 46px;
    font-size: 1.08rem;
  }
}

@media (max-width: 520px) {
  .page {
    padding-bottom: 92px;
  }

  .localHeader {
    min-height: 64px;
    padding: 10px 12px 10px 16px;
  }

  .hero {
    padding-top: 36px;
  }

  .breadcrumb {
    margin-bottom: 22px;
  }

  .hero h1 span {
    margin-top: 14px;
  }

  .lead {
    margin-top: 22px;
    font-size: 0.96rem;
    line-height: 1.72;
  }

  .heroActions,
  .badges {
    margin-top: 18px;
  }

  .heroPrice strong {
    font-size: 1.22rem;
  }

  .heroPrice p {
    font-size: 0.86rem;
    line-height: 1.55;
  }

  .primarySourceSection {
    padding-top: 58px;
    padding-bottom: 64px;
  }

  .primarySourceVisual,
  .primarySourceVisual img {
    min-height: 0;
  }

  .primarySourceVisual::after {
    max-width: calc(100% - 26px);
    padding: 8px 12px 10px;
  }

  .primarySourceVisual figcaption {
    left: 12px;
    right: 12px;
    bottom: 12px;
    padding: 10px 12px;
    font-size: 0.78rem;
  }

  .refundGuarantee {
    padding: 28px 18px;
    border-radius: 14px;
  }

  .refundGuarantee h3 {
    font-size: clamp(1.2rem, 4.5vw, 1.5rem);
    line-height: 1.35;
  }

  .guaranteeProofImage,
  .guaranteeProofImage img {
    min-height: 280px;
    height: 280px;
  }

  .guaranteeProofImage img {
    object-position: 50% 24%;
  }

  .guaranteeProofImage figcaption {
    padding: 42px 14px 14px;
    font-size: 0.78rem;
  }

  .refundGuaranteeLead {
    font-size: clamp(0.95rem, 3.4vw, 1.05rem);
    font-weight: 600;
    line-height: 1.75;
  }

  .guaranteeConditions li {
    padding-right: 14px;
  }

  .sectionIntro h2,
  .finalCta h2 {
    font-size: 2rem;
  }

  .badges span {
    width: 100%;
  }

  .heroPanel div,
  .panelLabel,
  .panelNote,
  .achievementBody,
  .featureCard,
  .darkCard,
  .processCard {
    padding-left: 18px;
    padding-right: 18px;
  }

  .lightbox {
    padding: 12px;
  }

  .lightboxPanel {
    padding: 12px;
  }
}

.localHeader,
.heroPanel,
.heroPrice,
.achievementCard,
.featureCard,
.darkCard,
.processCard,
.priceCard,
.workflow li,
.aboutLinkSection,
.faqItem,
.pricingTableWrap,
.notice,
.lightboxPanel,
.articleGrid article {
  border-color: rgba(255, 255, 255, 0.14);
  background: rgba(9, 13, 26, 0.74);
  box-shadow:
    0 22px 70px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(18px);
}

.localHeader {
  background: rgba(5, 8, 16, 0.72);
  box-shadow: 0 18px 62px rgba(0, 0, 0, 0.32);
}

.brand,
.desktopNav a,
.breadcrumb a,
.hero h1,
.hero h1 span,
.sectionIntro h2,
.finalCta h2,
.aboutHero h1,
.achievementBody h3,
.featureCard h3,
.darkCard h3,
.processCard h3,
.industryCard h3,
.priceCard h3,
.workflow h3,
.aboutLinkSection h2,
.faqItem summary,
.articleGrid h2 {
  color: #f8fbff;
}

.desktopNav,
.breadcrumb,
.lead,
.sectionIntro p,
.finalCta p,
.aboutLinkSection p,
.articleGrid p,
.featureCard p,
.darkCard p,
.processCard p,
.priceCard dd,
.workflow p,
.faqItem p,
.notice,
.panelNote,
.placeholder small {
  color: #c6d0e4;
}

.eyebrow,
.heroPrice span,
.heroPanel dt,
.achievementBody p,
.placeholder span,
.price,
.pricingTable tbody td:nth-child(2),
.textButton,
.priceCard dt {
  color: #ffd77a;
}

.primaryButton,
.headerCta,
.desktopFloatingCta,
.mobileStickyCta {
  background: linear-gradient(135deg, #1a6dff, #35d4ff 54%, #ff64c7);
  box-shadow:
    0 16px 42px rgba(45, 212, 255, 0.2),
    0 0 0 1px rgba(255, 255, 255, 0.08) inset;
}

.primaryButton:hover,
.headerCta:hover,
.desktopFloatingCta:hover,
.mobileStickyCta:hover {
  background: linear-gradient(135deg, #2dd4ff, #7c5cff 52%, #ff64c7);
  box-shadow:
    0 22px 58px rgba(255, 100, 199, 0.22),
    0 0 0 1px rgba(255, 255, 255, 0.14) inset;
  transform: translateY(-2px) scale(1.015);
}

.secondaryButton,
.heroPrice a,
.zoomButton,
.lightboxClose {
  border-color: rgba(45, 212, 255, 0.42);
  background: rgba(255, 255, 255, 0.06);
  color: #f8fbff;
}

.secondaryButton:hover,
.heroPrice a:hover,
.zoomButton:hover:not(:disabled),
.lightboxClose:hover {
  border-color: rgba(255, 215, 122, 0.72);
  background: rgba(255, 255, 255, 0.12);
  transform: translateY(-2px) scale(1.012);
}

.textButton:hover {
  transform: translateY(-1px);
}

.badges span {
  border-color: rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.065);
  color: #eaf2ff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.heroPrice {
  border-color: rgba(255, 215, 122, 0.36);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.035)),
    rgba(8, 12, 24, 0.78);
}

.heroPrice strong {
  color: #ffffff;
  text-shadow: 0 0 28px rgba(45, 212, 255, 0.28);
}

.heroPrice p {
  color: #c6d0e4;
}

.heroPrice::before {
  background: linear-gradient(180deg, #2dd4ff, #ff64c7, #ffd77a);
}

.heroPanel::before {
  width: 140%;
  background: linear-gradient(90deg, #2dd4ff, #ff64c7, #ffd77a, #2dd4ff);
}

.heroPanel div {
  border-bottom-color: rgba(255, 255, 255, 0.12);
}

.panelNote {
  background: rgba(255, 255, 255, 0.04);
}

.achievementCard:hover,
.featureCard:hover,
.darkCard:hover,
.processCard:hover,
.priceCard:hover,
.workflow li:hover,
.faqItem:hover {
  border-color: rgba(45, 212, 255, 0.38);
  box-shadow:
    0 28px 80px rgba(0, 0, 0, 0.32),
    0 0 34px rgba(45, 212, 255, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  transform: translateY(-4px);
}

.achievementMedia,
.placeholder,
.lightboxMedia {
  background:
    radial-gradient(circle at 26% 24%, rgba(45, 212, 255, 0.22), transparent 34%),
    radial-gradient(circle at 72% 72%, rgba(255, 100, 199, 0.18), transparent 36%),
    rgba(255, 255, 255, 0.04);
}

.placeholder strong {
  color: #f8fbff;
}

.contrastSection {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.015)),
    transparent;
}

.contrastSection .sectionIntro h2,
.contrastSection .sectionIntro p,
.contrastSection .eyebrow,
.darkCard h3,
.darkCard p {
  color: inherit;
}

.processCard span,
.workflow span {
  background: linear-gradient(135deg, #2dd4ff, #7c5cff);
  color: #ffffff;
  box-shadow: 0 10px 28px rgba(45, 212, 255, 0.18);
}

.pricingTable th,
.pricingTable td {
  border-bottom-color: rgba(255, 255, 255, 0.12);
  color: #c6d0e4;
}

.pricingTable thead th {
  background: rgba(255, 255, 255, 0.08);
  color: #f8fbff;
}

.pricingTable tbody th {
  color: #f8fbff;
}

.recommendedRow th,
.recommendedRow td,
.priceCardRecommended {
  background:
    linear-gradient(135deg, rgba(255, 215, 122, 0.12), rgba(45, 212, 255, 0.06)),
    rgba(9, 13, 26, 0.82);
}

.recommendedBadge {
  background: linear-gradient(135deg, #ffd77a, #ff64c7);
  color: #07101f;
}

.finalCta {
  background:
    radial-gradient(circle at 22% 16%, rgba(45, 212, 255, 0.24), transparent 38%),
    radial-gradient(circle at 82% 70%, rgba(255, 100, 199, 0.22), transparent 38%),
    rgba(8, 12, 24, 0.82);
}

.mobileMenu {
  border-color: rgba(255, 255, 255, 0.14);
  background: rgba(6, 9, 18, 0.94);
  box-shadow: 0 26px 80px rgba(0, 0, 0, 0.44);
  backdrop-filter: blur(20px);
}

.mobileMenu a {
  color: #f8fbff;
}

.mobileMenu a:hover {
  background: rgba(255, 255, 255, 0.08);
}

.mobileMenuCta {
  background: linear-gradient(135deg, #1a6dff, #35d4ff 54%, #ff64c7);
  color: #ffffff !important;
}

.menuButton {
  border-color: rgba(255, 255, 255, 0.18);
  background: rgba(6, 9, 18, 0.9);
  color: #f8fbff;
}

.lightbox {
  background: rgba(0, 0, 0, 0.78);
}

.articlePage {
  overflow-x: clip;
  width: 100%;
  max-width: 100%;
  padding-bottom: 110px;
}

.page.articlePage > .section {
  width: min(1120px, 100%);
  max-width: 100%;
  padding-left: 20px;
  padding-right: 20px;
  margin-inline: auto;
  box-sizing: border-box;
}

.page.articlePage [data-ai-reveal] {
  --ai-reveal-y: 22px;
  --ai-reveal-scale: 0.994;
  --ai-reveal-blur: 2px;
}

.articlePage .articleHero,
.articlePage .articleBody,
.articlePage .sectionIntro {
  width: 100%;
  max-width: min(980px, 100%);
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

.articlePage .articleSection,
.articlePage .breadcrumb,
.articlePage .articleMeta,
.articlePage .faqList,
.articlePage .relatedGrid {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.articlePage .aboutHero h1 {
  font-size: clamp(2.6rem, 5vw, 4.8rem);
  line-height: 1.12;
  color: var(--ai-navy-deep, #07111f);
  word-break: normal;
  overflow-wrap: anywhere;
}

.articlePage .articleLead,
.articlePage .articleHero p {
  word-break: normal;
  overflow-wrap: anywhere;
}

.articleHero {
  max-width: 980px;
  padding-top: 92px;
  padding-bottom: 64px;
}

.articleHero h1 {
  max-width: 100%;
  margin: 0;
  color: #f8fbff;
  font-size: clamp(2.5rem, 6vw, 5rem);
  line-height: 1.08;
  overflow-wrap: anywhere;
  word-break: normal;
}

.articleHero h1 span {
  display: block;
}

.articleLead {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: normal;
}

.articleMeta {
  margin: 12px 0 0;
  color: #526174;
  font-size: 0.88rem;
  line-height: 1.6;
  overflow-wrap: anywhere;
  word-break: normal;
}

.articleBody {
  display: grid;
  gap: 22px;
  max-width: 980px;
}

.articleSection {
  padding: 34px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background: rgba(9, 13, 26, 0.74);
  box-shadow:
    0 22px 70px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(18px);
}

.articleSection h2 {
  margin: 0 0 16px;
  color: #f8fbff;
  font-size: clamp(1.55rem, 3vw, 2.35rem);
  line-height: 1.25;
}

.articleSection p {
  margin: 0;
  color: #c6d0e4;
  font-size: 1rem;
  line-height: 1.95;
  overflow-wrap: anywhere;
  word-break: break-all;
}

.articleSection p + p {
  margin-top: 14px;
}

.articleList {
  display: grid;
  gap: 10px;
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
}

.articleList li {
  position: relative;
  padding: 14px 16px 14px 42px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.045);
  color: #e9f1ff;
  font-weight: 800;
  line-height: 1.6;
}

.articleList li::before {
  content: "";
  position: absolute;
  left: 17px;
  top: 22px;
  width: 12px;
  height: 7px;
  border-bottom: 2px solid #2dd4ff;
  border-left: 2px solid #2dd4ff;
  transform: rotate(-45deg);
}

.articleCardGrid,
.detailLinksGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 20px;
}

.detailMiniCard,
.detailLinkCard {
  padding: 22px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)),
    rgba(9, 13, 26, 0.72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.detailMiniCard h3,
.detailLinkCard h3 {
  margin: 0;
  color: #f8fbff;
  font-size: 1.08rem;
  line-height: 1.45;
}

.detailMiniCard p,
.detailLinkCard p {
  margin: 10px 0 0;
  color: #c6d0e4;
  line-height: 1.75;
}

.detailLinkCard {
  display: flex;
  flex-direction: column;
  min-height: 188px;
  transition:
    transform 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease;
}

.detailLinkCard:hover {
  border-color: rgba(45, 212, 255, 0.42);
  box-shadow:
    0 26px 70px rgba(0, 0, 0, 0.28),
    0 0 34px rgba(45, 212, 255, 0.08);
  transform: translateY(-4px);
}

.detailLinkCard span {
  margin-top: auto;
  padding-top: 18px;
  color: #ffd77a;
  font-weight: 900;
}

.detailLinksSection {
  max-width: 1180px;
}

.articleTableWrap {
  overflow-x: auto;
  margin-top: 20px;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 8px;
}

.articleTable {
  width: 100%;
  min-width: 640px;
  border-collapse: collapse;
}

.articleTable th,
.articleTable td {
  padding: 16px 18px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.11);
  color: #c6d0e4;
  line-height: 1.75;
  text-align: left;
  vertical-align: top;
}

.articleTable th {
  background: rgba(255, 255, 255, 0.08);
  color: #f8fbff;
  font-weight: 900;
}

.articleTable tr:last-child td {
  border-bottom: 0;
}

.articleImageSection {
  max-width: 1180px;
}

.articlePage .sectionIntro p {
  overflow-wrap: anywhere;
  word-break: normal;
}

.articlePage .relatedGrid {
  gap: 10px;
}

.page.articlePage .breadcrumb,
.page.articlePage .breadcrumb a,
.page.articlePage .breadcrumb span {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: normal;
}

.page.articlePage .heroActions {
  flex-wrap: wrap;
  max-width: 100%;
}

.page.articlePage .heroActions .primaryButton,
.page.articlePage .heroActions .secondaryButton {
  max-width: 100%;
}

.page.articlePage .articleSection {
  min-width: 0;
  overflow: hidden;
}

.page.articlePage .articleTable {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.page.articlePage .pricingTableWrap {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.page.articlePage .pricingTable {
  width: auto;
  min-width: 100%;
  table-layout: auto;
}

.page.articlePage .pricingTable th,
.page.articlePage .pricingTable td {
  white-space: normal;
  overflow-wrap: normal;
  word-break: normal;
  line-break: strict;
  min-width: 7.5em;
}

.page.articlePage .pricingTable tbody th {
  min-width: 6.5em;
}

@media (max-width: 640px) {
  .page.articlePage .pricingTable th,
  .page.articlePage .pricingTable td {
    padding: 12px 14px;
    font-size: 0.9rem;
    min-width: 8.5em;
    line-height: 1.6;
  }

  .page.articlePage .pricingTable tbody th {
    min-width: 7em;
  }

  .page.articlePage .pricingTable thead th {
    font-size: 0.82rem;
  }
}

.page.articlePage .articleSection p a {
  overflow-wrap: anywhere;
  word-break: break-word;
}

@media (max-width: 880px) {
  .articlePage .relatedGrid {
    grid-template-columns: 1fr;
  }
}

.articlePage .relatedCardAccordion {
  border-color: rgba(15, 23, 42, 0.12);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 16px 44px rgba(15, 23, 42, 0.08);
}

.articlePage .relatedCardSummary span {
  color: #9b6200;
  font-size: 0.76rem;
  font-weight: 900;
}

.articlePage .relatedCardSummary h3 {
  margin: 0;
  color: #07111f;
  font-size: 1rem;
  line-height: 1.45;
}

.articlePage .relatedCardSummary::after {
  color: #1f87ff;
}

.articlePage .relatedCardLink {
  border-color: rgba(20, 33, 61, 0.14);
  background: rgba(20, 33, 61, 0.05);
  color: #14213d;
}

.articlePage .relatedCardLink:hover {
  border-color: rgba(20, 33, 61, 0.24);
  background: rgba(20, 33, 61, 0.08);
}

.articlePage .relatedCardHint {
  color: #526174;
}

.articleImageGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.articleImageGrid .achievementMedia {
  aspect-ratio: 16 / 11;
}

.relatedSection {
  max-width: 1180px;
  padding-top: 32px;
}

.queryCoverage {
  max-width: 980px;
  padding-top: 28px;
  padding-bottom: 36px;
}

.queryCoverage h2 {
  margin: 0 0 12px;
  color: #f8fbff;
  font-size: clamp(1.55rem, 3vw, 2.35rem);
  line-height: 1.25;
}

.queryCoverage p:not(.eyebrow) {
  margin: 0;
  color: #c6d0e4;
  line-height: 1.9;
}

.primarySourceSection {
  width: min(1240px, calc(100% - 44px));
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(28px, 4vw, 52px);
  align-items: start;
  padding-top: 82px;
  padding-bottom: 92px;
  scroll-margin-top: 92px;
}

.primarySourceCopy {
  display: grid;
  gap: 18px;
  min-width: 0;
  justify-items: center;
  text-align: center;
}

.primarySourceCopy h2 {
  max-width: 17em;
  margin: 0;
  color: #07111f;
  font-family:
    "Hiragino Maru Gothic ProN",
    "M PLUS Rounded 1c",
    "Zen Maru Gothic",
    "Arial Rounded MT Bold",
    "Yu Gothic",
    YuGothic,
    system-ui,
    sans-serif;
  font-size: clamp(2.35rem, 4.3vw, 4.7rem);
  font-weight: 950;
  line-height: 1.08;
  letter-spacing: 0;
  text-wrap: balance;
  background:
    linear-gradient(
      110deg,
      #07111f 0%,
      #143a5f 18%,
      #1f87ff 35%,
      #15b9db 52%,
      #d94aa9 72%,
      #ffd77a 86%,
      #07111f 100%
    );
  background-size: 280% 100%;
  color: transparent;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  -webkit-background-clip: text;
  animation: aiTextAuroraFlow 8.5s cubic-bezier(0.45, 0, 0.2, 1) infinite;
  text-shadow: 0 12px 34px rgba(7, 17, 31, 0.1);
}

.primarySourceCopy p:not(.eyebrow) {
  max-width: 58em;
  margin: 0;
  color: #334155;
  font-size: clamp(1rem, 1.45vw, 1.12rem);
  font-weight: 800;
  line-height: 1.95;
}

.primarySourceVisual {
  position: relative;
  width: min(1100px, 100%);
  min-height: auto;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 22px;
  background:
    radial-gradient(circle at 12% 18%, rgba(45, 212, 255, 0.18), transparent 34%),
    radial-gradient(circle at 82% 12%, rgba(255, 91, 188, 0.16), transparent 32%),
    #ffffff;
  box-shadow:
    0 28px 82px rgba(15, 23, 42, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.86);
  isolation: isolate;
}

.primarySourceVisual::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.02), transparent 34%),
    radial-gradient(circle at 52% 42%, transparent 0 32%, rgba(255, 255, 255, 0.16) 62%);
}

.primarySourceVisual::after {
  content: "一次情報としてAIが認識";
  position: absolute;
  left: 50%;
  top: 35%;
  z-index: 2;
  width: max-content;
  max-width: min(86%, 720px);
  padding: 10px 22px 13px;
  border-radius: 4px;
  background: #1647ff;
  color: #ffffff;
  font-size: clamp(1.45rem, 3.1vw, 3rem);
  font-weight: 950;
  line-height: 1.05;
  text-align: center;
  text-shadow: 0 2px 0 rgba(0, 0, 0, 0.12);
  transform: translate3d(-50%, -50%, 0);
  box-shadow: 0 18px 46px rgba(22, 71, 255, 0.32);
}

.primarySourceVisual img {
  display: block;
  width: 100%;
  height: auto;
  min-height: 0;
  object-fit: contain;
  object-position: center center;
  filter: saturate(1.02) contrast(1.02);
}

.primarySourceVisual figcaption {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 16px;
  z-index: 2;
  margin: 0;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.88);
  color: #14213d;
  font-size: 0.86rem;
  font-weight: 900;
  line-height: 1.55;
  backdrop-filter: blur(14px);
}

.impactBridge,
.deliveryBand {
  position: relative;
  width: min(1180px, calc(100% - 44px));
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 28px;
  background:
    radial-gradient(circle at 12% 18%, rgba(31, 135, 255, 0.16), transparent 34%),
    radial-gradient(circle at 84% 18%, rgba(238, 92, 183, 0.17), transparent 34%),
    radial-gradient(circle at 48% 86%, rgba(255, 215, 122, 0.18), transparent 34%),
    rgba(255, 255, 255, 0.9);
  box-shadow:
    0 28px 88px rgba(15, 23, 42, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.88);
  isolation: isolate;
}

.impactBridge {
  display: grid;
  gap: 24px;
  margin-top: 18px;
  margin-bottom: 36px;
  padding: clamp(40px, 7vw, 84px);
  text-align: center;
}

.impactBridge::before,
.deliveryBand::before {
  content: "";
  position: absolute;
  inset: -24%;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at 28% 36%, rgba(45, 212, 255, 0.22), transparent 30%),
    radial-gradient(circle at 66% 42%, rgba(217, 74, 169, 0.18), transparent 32%),
    radial-gradient(circle at 50% 72%, rgba(255, 215, 122, 0.16), transparent 30%);
  filter: blur(28px);
  opacity: 0.86;
  transform: translate3d(0, 0, 0);
  animation: aiGlowDriftA 14s cubic-bezier(0.45, 0, 0.2, 1) infinite;
}

.impactBridgeTitle,
.deliveryBandTitle {
  margin: 0 auto;
  color: #07111f;
  font-family:
    "Hiragino Maru Gothic ProN",
    "M PLUS Rounded 1c",
    "Zen Maru Gothic",
    "Arial Rounded MT Bold",
    "Yu Gothic",
    YuGothic,
    system-ui,
    sans-serif;
  font-weight: 950;
  letter-spacing: 0;
  text-wrap: balance;
  background:
    linear-gradient(
      110deg,
      #07111f 0%,
      #1f87ff 28%,
      #12b8d8 46%,
      #d94aa9 68%,
      #ffd77a 84%,
      #07111f 100%
    );
  background-size: 280% 100%;
  color: transparent;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  -webkit-background-clip: text;
  animation: aiTextAuroraFlow 8.5s cubic-bezier(0.45, 0, 0.2, 1) infinite;
}

.impactBridgeTitle {
  max-width: none;
  font-size: clamp(2.55rem, 5.5vw, 5.6rem);
  line-height: 1.02;
}

.impactBridgeTitle span {
  display: block;
  white-space: nowrap;
}

.impactBridgeLead,
.deliveryBandLead {
  max-width: 820px;
  margin: 0 auto;
  color: #243449;
  font-size: clamp(1.02rem, 1.5vw, 1.2rem);
  font-weight: 850;
  line-height: 1.95;
}

.impactBridgeGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  width: min(860px, 100%);
  margin: 4px auto 0;
}

.impactBridgeCard {
  display: grid;
  gap: 10px;
  min-height: 160px;
  padding: 24px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.78);
  color: #07111f;
  text-align: left;
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.08);
}

.impactBridgeCard span {
  color: #a15d00;
  font-size: 0.8rem;
  font-weight: 950;
  text-transform: uppercase;
}

.impactBridgeCard strong {
  color: #07111f;
  font-size: clamp(1.1rem, 1.6vw, 1.32rem);
  line-height: 1.45;
}

.impactBridgeCard p {
  margin: 0;
  color: #405067;
  font-weight: 750;
  line-height: 1.75;
}

.impactBridgeActions,
.deliveryBandActions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}

.deliveryBand {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
  gap: clamp(24px, 4vw, 52px);
  align-items: center;
  margin-top: 34px;
  margin-bottom: 48px;
  padding: clamp(34px, 6vw, 72px);
}

.deliveryBandTitle {
  max-width: 9.5em;
  margin-left: 0;
  font-size: clamp(2.25rem, 5vw, 5.1rem);
  line-height: 1.04;
}

.deliveryBandLead {
  margin: 18px 0 0;
}

.deliveryHighlight {
  display: grid;
  gap: 12px;
  padding: clamp(24px, 4vw, 38px);
  border: 1px solid rgba(31, 135, 255, 0.22);
  border-radius: 22px;
  background:
    radial-gradient(circle at 16% 20%, rgba(31, 135, 255, 0.18), transparent 38%),
    radial-gradient(circle at 92% 12%, rgba(238, 92, 183, 0.18), transparent 36%),
    rgba(255, 255, 255, 0.84);
  box-shadow: 0 24px 64px rgba(31, 135, 255, 0.12);
}

.deliveryHighlight strong {
  color: #07111f;
  font-size: clamp(1.35rem, 2.5vw, 2.25rem);
  font-weight: 950;
  line-height: 1.38;
}

.deliveryHighlight span {
  color: #4a5870;
  font-size: 0.92rem;
  font-weight: 800;
  line-height: 1.7;
}

.deliveryBand .primaryButton {
  width: min(100%, 420px);
  margin-top: 18px;
  color: #ffffff;
}

.evidenceBlock {
  max-width: 1180px;
}

.evidenceGrid,
.queryMapGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.evidenceCard,
.queryMapCard {
  display: grid;
  align-content: start;
  gap: 10px;
  min-height: 210px;
  padding: 22px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)),
    rgba(9, 13, 26, 0.72);
  box-shadow:
    0 20px 62px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(18px);
}

.evidenceCard span,
.queryMapCard span {
  color: #ffd77a;
  font-size: 0.78rem;
  font-weight: 900;
}

.evidenceCard h3,
.queryMapCard h3,
.evidenceRelated h3 {
  margin: 0;
  color: #f8fbff;
  font-size: 1.08rem;
  line-height: 1.45;
}

.evidenceCard p,
.queryMapCard p {
  margin: 0;
  color: #c6d0e4;
  line-height: 1.75;
  overflow-wrap: anywhere;
}

.evidenceCard small {
  color: #aebbd3;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.observationTableWrap {
  overflow-x: auto;
  margin-top: 18px;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 8px;
  background: rgba(6, 9, 18, 0.58);
}

.observationGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
}

.observationCard {
  display: grid;
  gap: 12px;
  padding: 22px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background:
    radial-gradient(circle at 18% 18%, rgba(45, 212, 255, 0.12), transparent 34%),
    rgba(9, 13, 26, 0.72);
  box-shadow:
    0 20px 62px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.observationCard span {
  color: #ffd77a;
  font-size: 0.78rem;
  font-weight: 900;
}

.observationCard h3 {
  margin: 0;
  color: #f8fbff;
  font-size: 1.16rem;
}

.observationCard dl {
  display: grid;
  gap: 10px;
  margin: 0;
}

.observationCard div {
  display: grid;
  gap: 4px;
}

.observationCard dt {
  color: #aebbd3;
  font-size: 0.78rem;
  font-weight: 900;
}

.observationCard dd {
  margin: 0;
  color: #dce6f8;
  line-height: 1.65;
  overflow-wrap: anywhere;
}

.observationTable {
  width: 100%;
  min-width: 780px;
  border-collapse: collapse;
}

.observationTable th,
.observationTable td {
  padding: 15px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.11);
  color: #c6d0e4;
  line-height: 1.65;
  text-align: left;
  vertical-align: top;
  overflow-wrap: anywhere;
}

.observationTable thead th {
  background: rgba(255, 255, 255, 0.08);
  color: #f8fbff;
  font-weight: 900;
}

.observationTable tbody th {
  color: #f8fbff;
}

.observationTable tr:last-child th,
.observationTable tr:last-child td {
  border-bottom: 0;
}

.evidenceRelated {
  display: grid;
  gap: 12px;
  margin-top: 18px;
  padding: 20px;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.045);
}

.evidenceRelated div {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.evidenceRelated a,
.queryMapCard a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 12px;
  border: 1px solid rgba(45, 212, 255, 0.34);
  border-radius: 8px;
  color: #f8fbff;
  font-weight: 900;
}

.queryMapCard a {
  margin-top: auto;
}

  border-bottom: 0;
}

.sitemapGrid {
  align-items: stretch;
}

.sitemapLinkCard {
  display: grid;
  gap: 10px;
  min-height: 100%;
  padding: 16px 18px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)),
    rgba(9, 13, 26, 0.72);
  box-shadow:
    0 20px 62px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(18px);
  color: inherit;
  text-decoration: none;
  transition:
    transform 0.2s ease,
    border-color 0.2s ease;
}

.sitemapLinkCard:hover {
  transform: translateY(-2px);
  border-color: rgba(45, 212, 255, 0.35);
}

.sitemapLinkLabel {
  color: #2dd4ff;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sitemapLinkCard h3 {
  margin: 0;
  color: #f8fbff;
  font-size: 1.02rem;
  font-weight: 900;
  line-height: 1.45;
}

.sitemapLinkCard p {
  margin: 0;
  color: #c6d0e4;
  font-size: 0.92rem;
  line-height: 1.7;
}

.sitemapCategorySection + .sitemapCategorySection {
  margin-top: 8px;
}

.legalDocumentBody .legalModalSection h3 {
  margin: 0 0 10px;
  color: #07111f;
  font-size: 1rem;
  font-weight: 900;
}

.legalDocumentBody .legalModalSection p,
.legalDocumentBody .legalModalFootnote {
  margin: 0 0 12px;
  color: #334155;
  line-height: 1.8;
}

.legalDocumentBody .legalModalFootnote {
  color: #64748b;
  font-size: 0.92rem;
}

.legalDocumentBody .legalModalTable {
  width: 100%;
  border-collapse: collapse;
}

.legalDocumentBody .legalModalTable th,
.legalDocumentBody .legalModalTable td {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.12);
  color: #334155;
  line-height: 1.7;
  text-align: left;
  vertical-align: top;
}

.legalDocumentBody .legalModalTable th {
  width: 28%;
  color: #07111f;
  font-weight: 900;
  white-space: nowrap;
}

@media (max-width: 880px) {
  .sitemapGrid {
    grid-template-columns: 1fr;
  }
}

.relatedGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.relatedCardAccordion {
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)),
    rgba(9, 13, 26, 0.72);
  box-shadow:
    0 20px 62px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(18px);
  overflow: hidden;
}

.relatedCardSummary {
  display: grid;
  gap: 8px;
  padding: 16px 18px;
  list-style: none;
  cursor: pointer;
}

.relatedCardSummary::-webkit-details-marker {
  display: none;
}

.relatedCardSummary::after {
  content: "＋";
  justify-self: end;
  color: #2dd4ff;
  font-size: 1rem;
  font-weight: 900;
  line-height: 1;
}

.relatedCardAccordion[open] .relatedCardSummary::after {
  content: "→";
}

.relatedCardHint {
  display: none;
  margin: 0;
  padding: 0 18px 14px;
  color: #9db0c8;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.5;
}

.relatedCardAccordion[open] .relatedCardHint {
  display: block;
}

.relatedCardBody {
  padding: 0 18px 16px;
}

.relatedCardLink {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid rgba(45, 212, 255, 0.35);
  border-radius: 999px;
  background: rgba(45, 212, 255, 0.1);
  color: #dff7ff;
  font-size: 0.88rem;
  font-weight: 800;
  text-decoration: none;
}

.relatedCardLink:hover {
  border-color: rgba(45, 212, 255, 0.55);
  background: rgba(45, 212, 255, 0.16);
}

.relatedCard,
.sitemapCategory,
.directoryCard,
.emptyState {
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)),
    rgba(9, 13, 26, 0.72);
  box-shadow:
    0 20px 62px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(18px);
}

.relatedCard {
  display: flex;
  flex-direction: column;
  min-height: 190px;
  padding: 22px;
  transition:
    transform 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease;
}

.relatedCard:hover,
.directoryCard:hover {
  border-color: rgba(45, 212, 255, 0.42);
  box-shadow:
    0 26px 72px rgba(0, 0, 0, 0.3),
    0 0 34px rgba(45, 212, 255, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  transform: translateY(-4px);
}

.relatedCard span,
.directoryCard span {
  color: #ffd77a;
  font-size: 0.78rem;
  font-weight: 900;
}

.relatedCard h3,
.directoryCard h3,
.sitemapCategory h2,
.footerCta h2 {
  margin: 8px 0 0;
  color: #f8fbff;
  font-size: 1.15rem;
  line-height: 1.45;
}

.relatedCard p,
.directoryCard p,
.sitemapCategory p,
.footerCta p,
.footerBottom {
  color: #c6d0e4;
  line-height: 1.75;
}

.relatedCard p {
  margin: 10px 0 0;
}

.siteFooter {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
  padding: 34px 0 56px;
}

.footerCta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: center;
  margin-bottom: 28px;
  padding: 34px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background:
    radial-gradient(circle at 18% 20%, rgba(45, 212, 255, 0.18), transparent 38%),
    radial-gradient(circle at 88% 74%, rgba(255, 100, 199, 0.17), transparent 34%),
    rgba(9, 13, 26, 0.78);
  box-shadow:
    0 24px 76px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.footerCta h2 {
  font-size: clamp(1.55rem, 3vw, 2.35rem);
}

.footerCta p {
  margin: 12px 0 0;
}

.footerGrid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  padding: 28px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  background: rgba(6, 9, 18, 0.62);
  backdrop-filter: blur(16px);
}

.footerGroup {
  display: grid;
  align-content: start;
  gap: 10px;
}

.footerGroup h2 {
  margin: 0 0 4px;
  color: #ffd77a;
  font-size: 0.86rem;
  font-weight: 900;
}

.footerGroup a {
  color: #dce6f8;
  font-size: 0.92rem;
  line-height: 1.55;
}

.footerGroup a:hover,
.footerBottom a:hover {
  color: #ffffff;
}

.footerBottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 4px 0;
  font-size: 0.9rem;
}

.footerBrandLogo {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  color: #07111f;
  font-family:
    "Noto Sans JP",
    "Yu Gothic",
    YuGothic,
    system-ui,
    sans-serif;
  text-decoration: none;
}

.footerBrandMark {
  display: inline-grid;
  place-items: center;
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  background: #000000;
  color: #ffffff;
  font-size: 1.05rem;
  font-weight: 900;
  line-height: 1;
}

.footerBrandText {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  font-size: 1rem;
  font-weight: 900;
  letter-spacing: 0.14em;
}

.footerBrandBadge {
  display: inline-block;
  padding: 4px 8px;
  border-radius: 6px;
  background: #f3f4f6;
  color: #6b7280;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: normal;
  line-height: 1.2;
}

.footerBottomNote {
  color: #526174;
  font-size: 0.88rem;
}

.footerBottom p {
  margin: 0;
}

.directoryHero {
  max-width: 980px;
  padding-top: 92px;
  padding-bottom: 46px;
}

.directoryHero h1 {
  margin: 0;
  color: #f8fbff;
  font-size: clamp(2.35rem, 5.4vw, 4.7rem);
  line-height: 1.1;
}

.directoryHero p {
  max-width: 760px;
  color: #c6d0e4;
  line-height: 1.9;
}

.sitemapGrid,
.directoryGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.sitemapCategory {
  padding: 24px;
}

.sitemapCategory h2 {
  margin-top: 0;
}

.sitemapCategory ul,
.directoryList,
.metaList {
  display: grid;
  gap: 12px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.sitemapCategory li a,
.directoryCard {
  display: grid;
  gap: 6px;
}

.sitemapCategory li a {
  padding: 12px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.045);
}

.sitemapCategory li a:hover {
  background: rgba(255, 255, 255, 0.08);
}

.sitemapCategory strong {
  color: #f8fbff;
}

.sitemapCategory span {
  color: #aebbd3;
  font-size: 0.9rem;
  line-height: 1.6;
}

.directoryCard {
  min-height: 190px;
  padding: 22px;
  transition:
    transform 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease;
}

.emptyState {
  padding: 24px;
}

.emptyState h2 {
  margin: 0;
  color: #f8fbff;
}

.emptyState p,
.metaList li {
  color: #c6d0e4;
  line-height: 1.75;
}

.metaList li {
  padding: 12px 14px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.045);
}

.metaList div {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid rgba(10, 20, 36, 0.1);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
}

.metaList dt {
  color: #8a5b00;
  font-size: 0.76rem;
  font-weight: 900;
}

.metaList dd {
  min-width: 0;
  margin: 0;
  color: #172033;
  font-size: 0.9rem;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.contactSection {
  width: min(980px, calc(100% - 40px));
}

.contactForm {
  display: grid;
  gap: 22px;
  padding: 28px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background: rgba(9, 13, 26, 0.74);
  box-shadow:
    0 22px 70px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(18px);
}

.formGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.contactForm label,
.fullField,
.checkboxGroup {
  display: grid;
  gap: 9px;
  color: #f8fbff;
  font-weight: 900;
}

.contactForm input,
.contactForm select,
.contactForm textarea {
  width: 100%;
  min-height: 48px;
  border: 1px solid rgba(198, 208, 228, 0.26);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  color: #f8fbff;
  font: inherit;
  line-height: 1.5;
}

.contactForm input,
.contactForm select {
  padding: 0 14px;
}

.contactForm textarea {
  min-height: 160px;
  padding: 14px;
  resize: vertical;
}

.contactForm input::placeholder,
.contactForm textarea::placeholder {
  color: #91a0bb;
}

.contactForm select option {
  color: #08111f;
}

.contactForm input:focus,
.contactForm select:focus,
.contactForm textarea:focus {
  outline: 2px solid rgba(45, 212, 255, 0.45);
  outline-offset: 2px;
  border-color: rgba(45, 212, 255, 0.72);
}

.checkboxGroup {
  margin: 0;
  padding: 18px;
  border: 1px solid rgba(198, 208, 228, 0.2);
  border-radius: 8px;
}

.checkboxGroup legend {
  padding: 0 8px;
  color: #ffd77a;
}

.checkboxGroup > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 14px;
}

.checkboxGroup label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: #c6d0e4;
  font-weight: 800;
  line-height: 1.55;
}

.checkboxGroup input {
  width: 18px;
  min-width: 18px;
  height: 18px;
  min-height: 18px;
  margin-top: 3px;
}

.formDisclaimer,
.formStatus {
  margin: 0;
  color: #c6d0e4;
  line-height: 1.75;
}

.formStatus {
  padding: 14px 16px;
  border: 1px solid rgba(45, 212, 255, 0.32);
  border-radius: 8px;
  background: rgba(45, 212, 255, 0.08);
  color: #dff7ff;
  font-weight: 800;
}

@media (max-width: 880px) {
  .articleHero,
  .articleBody,
  .articleImageSection,
  .detailLinksSection,
  .relatedSection,
  .directoryHero,
  .queryCoverage,
  .evidenceBlock,
  .contactSection {
    width: 100%;
    max-width: 100%;
  }

  .articleHero {
    padding-top: 62px;
    padding-bottom: 46px;
  }

  .articleSection {
    padding: 24px;
  }

  .articleCardGrid,
  .detailLinksGrid,
  .articleImageGrid,
  .evidenceGrid,
  .queryMapGrid,
  .observationGrid {
    grid-template-columns: 1fr;
  }

  .formGrid,
  .checkboxGroup > div {
    grid-template-columns: 1fr;
  }

  .contactForm {
    padding: 20px;
  }

  .detailLinkCard {
    min-height: auto;
  }
}

@media (max-width: 520px) {
  .articleHero h1 {
    max-width: 100%;
    font-size: clamp(1.72rem, 8.3vw, 2.05rem);
    line-height: 1.16;
  }

  .articleSection {
    padding: 22px 18px;
  }
}

.page {
  --ai-ink: #111827;
  --ai-navy: #14213d;
  --ai-navy-deep: #07111f;
  --ai-muted: #526174;
  --ai-soft: #f3f7ff;
  --ai-ivory: #fff9ec;
  --ai-gold: #f4bd43;
  --ai-gold-dark: #9b6200;
  --ai-line: rgba(15, 23, 42, 0.13);
  --ai-card: rgba(255, 255, 255, 0.78);
  --ai-sky: rgba(31, 135, 255, 0.08);
  --cursor-x: 50vw;
  --cursor-y: 40vh;
  color: var(--ai-ink);
  background:
    radial-gradient(circle at 16% 12%, rgba(73, 188, 255, 0.2), transparent 26rem),
    radial-gradient(circle at 86% 18%, rgba(255, 124, 201, 0.16), transparent 24rem),
    linear-gradient(180deg, #ffffff 0%, #f7fbff 44%, #ffffff 100%);
  font-family:
    "M PLUS Rounded 1c",
    "Zen Maru Gothic",
    "Hiragino Maru Gothic ProN",
    "Yu Gothic",
    YuGothic,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    sans-serif;
}

.page::before {
  top: 50%;
  left: 50%;
  right: auto;
  width: min(92vw, 720px);
  height: min(92vw, 720px);
  background:
    radial-gradient(circle at 38% 36%, rgba(31, 135, 255, 0.5), transparent 0 33%),
    radial-gradient(circle at 66% 58%, rgba(255, 91, 188, 0.42), transparent 0 36%),
    radial-gradient(circle at 40% 74%, rgba(255, 210, 87, 0.42), transparent 0 34%);
  opacity: 0.72;
  filter: blur(50px);
  transform: translate3d(calc(var(--cursor-x) - 50vw), calc(var(--cursor-y) - 50vh), 0)
    translate3d(-50%, -50%, 0) scale(1);
  transition: transform 620ms cubic-bezier(0.18, 1, 0.28, 1);
  animation: aiAuroraPulse 12s ease-in-out infinite;
}

.page::after {
  left: auto;
  right: -18rem;
  bottom: -12rem;
  width: min(86vw, 660px);
  height: min(86vw, 660px);
  background:
    radial-gradient(circle at 35% 42%, rgba(119, 76, 255, 0.22), transparent 0 38%),
    radial-gradient(circle at 68% 66%, rgba(30, 212, 255, 0.22), transparent 0 34%),
    radial-gradient(circle at 44% 74%, rgba(255, 219, 112, 0.18), transparent 0 36%);
  opacity: 0.72;
  filter: blur(52px);
  animation: aiGlowDriftB 18s ease-in-out infinite;
}

@keyframes aiAuroraPulse {
  0%,
  100% {
    opacity: 0.48;
  }

  50% {
    opacity: 0.72;
  }
}

.localHeader,
.heroPanel,
.heroPrice,
.achievementCard,
.featureCard,
.darkCard,
.processCard,
.priceCard,
.workflow li,
.aboutLinkSection,
.faqItem,
.pricingTableWrap,
.notice,
.lightboxPanel,
.articleGrid article,
.articleSection,
.detailMiniCard,
.detailLinkCard,
.evidenceCard,
.queryMapCard,
.contactForm {
  border-color: rgba(15, 23, 42, 0.12);
  background: rgba(255, 255, 255, 0.76);
  box-shadow:
    0 24px 70px rgba(15, 23, 42, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.76);
  backdrop-filter: blur(22px);
}

.localHeader {
  position: fixed;
  left: 50%;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 20px 58px rgba(15, 23, 42, 0.09);
  transform: translateX(-50%);
  transition:
    opacity 520ms cubic-bezier(0.18, 1, 0.28, 1),
    transform 520ms cubic-bezier(0.18, 1, 0.28, 1);
}

.desktopFloatingCta,
.mobileStickyCta {
  transition:
    opacity 520ms cubic-bezier(0.18, 1, 0.28, 1),
    transform 520ms cubic-bezier(0.18, 1, 0.28, 1);
}

.page:not([data-ai-scrolled="true"]) .localHeader,
.page:not([data-ai-scrolled="true"]) .desktopFloatingCta,
.page:not([data-ai-scrolled="true"]) .mobileStickyCta {
  opacity: 0;
  pointer-events: none;
  transform: translateY(-18px);
}

.page:not([data-ai-scrolled="true"]) .localHeader {
  transform: translate(-50%, -18px);
}

.page[data-ai-scrolled="true"] .localHeader,
.page[data-ai-scrolled="true"] .desktopFloatingCta,
.page[data-ai-scrolled="true"] .mobileStickyCta {
  opacity: 1;
  transform: translateY(0);
}

.page[data-ai-scrolled="true"] .localHeader {
  transform: translate(-50%, 0);
}

.page.articlePage .localHeader,
.page.articlePage .desktopFloatingCta,
.page.articlePage .mobileStickyCta {
  opacity: 1;
  pointer-events: auto;
}

.page.articlePage .localHeader {
  transform: translate(-50%, 0);
}

.navGroup:hover .navGroupButton,
.navGroup:focus-within .navGroupButton {
  color: #14213d;
  background: rgba(20, 33, 61, 0.06);
}

.navDropdown a:hover,
.navDropdown a.activeNav,
.navGroupButton.activeNav {
  background: rgba(20, 33, 61, 0.08);
  color: #14213d;
}

.hero {
  grid-template-columns: minmax(0, 1fr);
  place-items: center;
  min-height: 100dvh;
  padding-top: 8vh;
  padding-bottom: 8vh;
  position: relative;
  isolation: isolate;
  text-align: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 45% 42%, rgba(31, 135, 255, 0.16), transparent 18rem),
    radial-gradient(circle at 58% 46%, rgba(255, 91, 188, 0.12), transparent 17rem),
    radial-gradient(circle at 48% 56%, rgba(255, 210, 87, 0.12), transparent 16rem);
}

.hero::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 0;
  width: min(92vw, 640px);
  height: min(92vw, 640px);
  border-radius: 999px;
  background:
    radial-gradient(circle at 34% 38%, rgba(31, 135, 255, 0.34), transparent 0 35%),
    radial-gradient(circle at 70% 55%, rgba(255, 91, 188, 0.3), transparent 0 38%),
    radial-gradient(circle at 48% 72%, rgba(255, 210, 87, 0.28), transparent 0 36%);
  filter: blur(28px);
  opacity: 0.92;
  pointer-events: none;
  transform: translate3d(calc(var(--cursor-x) - 50vw), calc(var(--cursor-y) - 50vh), 0)
    translate3d(-50%, -50%, 0) scale(1);
  transition: transform 620ms cubic-bezier(0.18, 1, 0.28, 1);
  animation: aiAuroraPulse 12s ease-in-out infinite;
}

.hero::after {
  content: "";
  position: absolute;
  inset: -15%;
  z-index: 0;
  background:
    radial-gradient(circle at 18% 78%, rgba(31, 135, 255, 0.16), transparent 30%),
    radial-gradient(circle at 84% 24%, rgba(255, 91, 188, 0.14), transparent 32%),
    radial-gradient(circle at 55% 68%, rgba(255, 210, 87, 0.12), transparent 28%);
  filter: blur(24px);
  opacity: 0;
  pointer-events: none;
  transform: scale(0.86) rotate(-5deg);
  animation: aiCanvasBloom 3.4s cubic-bezier(0.18, 1, 0.28, 1) 240ms both;
}

.hero > * {
  position: relative;
  z-index: 1;
}

.auroraStage {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  contain: paint;
}

.auroraStage span {
  position: absolute;
  display: block;
  width: clamp(180px, 34vw, 520px);
  aspect-ratio: 1;
  border-radius: 999px;
  background:
    radial-gradient(circle at 28% 28%, rgba(255, 255, 255, 0.78), transparent 0 16%),
    radial-gradient(circle at 36% 42%, rgba(31, 135, 255, 0.38), transparent 0 38%),
    radial-gradient(circle at 70% 62%, rgba(255, 91, 188, 0.3), transparent 0 40%),
    radial-gradient(circle at 50% 78%, rgba(255, 210, 87, 0.28), transparent 0 36%);
  filter: blur(32px);
  opacity: 0.58;
  mix-blend-mode: multiply;
  transform: translate3d(0, 0, 0) scale(1);
  will-change: transform, opacity;
}

.auroraStage span:nth-child(1) {
  left: 6%;
  top: 62%;
  animation: aiOrbDriftA 22s cubic-bezier(0.45, 0, 0.2, 1) infinite;
}

.auroraStage span:nth-child(2) {
  right: 0;
  top: 8%;
  width: clamp(200px, 38vw, 560px);
  animation: aiOrbDriftB 25s cubic-bezier(0.45, 0, 0.2, 1) -5s infinite;
}

.auroraStage span:nth-child(3) {
  left: 42%;
  top: 48%;
  width: clamp(170px, 30vw, 440px);
  animation: aiOrbDriftC 20s cubic-bezier(0.45, 0, 0.2, 1) -9s infinite;
}

.auroraStage span:nth-child(4) {
  left: 58%;
  bottom: 4%;
  width: clamp(160px, 28vw, 400px);
  opacity: 0.42;
  animation: aiOrbDriftD 27s cubic-bezier(0.45, 0, 0.2, 1) -13s infinite;
}

.page[data-ai-scrolled="true"] .hero {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr));
  place-items: center stretch;
  min-height: auto;
  padding-top: 118px;
  padding-bottom: 92px;
  text-align: left;
}

.page:not([data-ai-scrolled="true"]) .heroCopy {
  max-width: min(920px, 100%);
}

.page:not([data-ai-scrolled="true"]) .hero {
  width: 100%;
  max-width: none;
}

.page:not([data-ai-scrolled="true"]) .breadcrumb,
.page:not([data-ai-scrolled="true"]) .hero .eyebrow,
.page:not([data-ai-scrolled="true"]) .lead,
.page:not([data-ai-scrolled="true"]) .heroPrice,
.page:not([data-ai-scrolled="true"]) .heroActions,
.page:not([data-ai-scrolled="true"]) .badges,
.page:not([data-ai-scrolled="true"]) .heroPanel {
  display: none;
}

.page[data-ai-scrolled="true"] .breadcrumb,
.page[data-ai-scrolled="true"] .hero .eyebrow,
.page[data-ai-scrolled="true"] .lead,
.page[data-ai-scrolled="true"] .heroPrice,
.page[data-ai-scrolled="true"] .heroActions,
.page[data-ai-scrolled="true"] .badges,
.page[data-ai-scrolled="true"] .heroPanel {
  animation: aiHeroReveal 560ms cubic-bezier(0.18, 1, 0.28, 1) both;
}

.page[data-ai-scrolled="true"] .hero .eyebrow {
  animation-delay: 40ms;
}

.page[data-ai-scrolled="true"] .lead {
  animation-delay: 90ms;
}

.page[data-ai-scrolled="true"] .heroPrice {
  animation-delay: 140ms;
}

.page[data-ai-scrolled="true"] .heroActions {
  animation-delay: 190ms;
}

.page[data-ai-scrolled="true"] .badges {
  animation-delay: 230ms;
}

.page[data-ai-scrolled="true"] .heroPanel {
  animation-delay: 120ms;
}

@keyframes aiHeroReveal {
  from {
    opacity: 0;
    transform: translateY(14px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.scrollCue {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 168px;
  min-height: 46px;
  margin: 34px 0 0;
  padding: 0 28px;
  border: 1px solid rgba(20, 33, 61, 0.1);
  border-radius: 999px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.82), rgba(255, 255, 255, 0.54)),
    radial-gradient(circle at 24% 50%, rgba(31, 135, 255, 0.22), transparent 34%),
    radial-gradient(circle at 76% 50%, rgba(255, 91, 188, 0.2), transparent 36%);
  color: #14213d;
  appearance: none;
  cursor: pointer;
  font-family: inherit;
  font-size: 0.94rem;
  font-weight: 900;
  line-height: 1;
  -webkit-tap-highlight-color: transparent;
  box-shadow:
    0 18px 44px rgba(31, 135, 255, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.72);
  overflow: visible;
  animation: aiScrollCueButton 3.2s cubic-bezier(0.18, 1, 0.28, 1) both,
    aiScrollCueFloat 1.8s cubic-bezier(0.18, 1, 0.28, 1) 3.25s infinite;
}

.scrollCue::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background:
    radial-gradient(circle at 28% 28%, rgba(255, 255, 255, 0.94), transparent 18%),
    radial-gradient(circle at 34% 40%, rgba(31, 135, 255, 0.95), transparent 36%),
    radial-gradient(circle at 72% 62%, rgba(255, 91, 188, 0.9), transparent 40%),
    radial-gradient(circle at 48% 80%, rgba(255, 210, 87, 0.82), transparent 38%);
  box-shadow:
    0 0 32px rgba(31, 135, 255, 0.32),
    0 0 48px rgba(255, 91, 188, 0.24);
  transform: translate3d(-340px, -230px, 0) scale(1.55);
  pointer-events: none;
  animation: aiAuroraBallLand 3.2s cubic-bezier(0.18, 1, 0.28, 1) both;
}

.scrollCue::after {
  content: "";
  position: absolute;
  inset: -12px;
  z-index: -1;
  border-radius: inherit;
  background:
    radial-gradient(circle at 28% 50%, rgba(31, 135, 255, 0.32), transparent 38%),
    radial-gradient(circle at 72% 50%, rgba(255, 91, 188, 0.28), transparent 40%),
    radial-gradient(circle at 50% 88%, rgba(255, 210, 87, 0.22), transparent 38%);
  filter: blur(16px);
  opacity: 0;
  animation: aiScrollGlowSettle 3.2s cubic-bezier(0.18, 1, 0.28, 1) both;
}

.scrollCue:hover,
.scrollCue:focus-visible {
  border-color: rgba(31, 135, 255, 0.42);
  box-shadow:
    0 20px 54px rgba(31, 135, 255, 0.24),
    0 0 0 6px rgba(31, 135, 255, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.82);
  transform: translateY(2px);
}

.page[data-ai-scrolled="true"] .scrollCue {
  display: none;
}

@keyframes aiCanvasBloom {
  0% {
    opacity: 0;
    transform: scale(0.82) rotate(-6deg);
  }

  36% {
    opacity: 0.82;
    transform: scale(1.04) rotate(2deg);
  }

  72% {
    opacity: 0.48;
    transform: scale(1.02) rotate(-1deg);
  }

  100% {
    opacity: 0.58;
    transform: scale(1) rotate(0);
  }
}

@keyframes aiOrbDriftA {
  0%,
  100% {
    opacity: 0.44;
    transform: translate3d(-4vw, 2vh, 0) scale(0.96);
  }

  28% {
    opacity: 0.72;
    transform: translate3d(12vw, -7vh, 0) scale(1.12);
  }

  62% {
    opacity: 0.52;
    transform: translate3d(3vw, -16vh, 0) scale(0.9);
  }

  82% {
    opacity: 0.68;
    transform: translate3d(18vw, -2vh, 0) scale(1.05);
  }
}

@keyframes aiOrbDriftB {
  0%,
  100% {
    opacity: 0.48;
    transform: translate3d(7vw, -5vh, 0) scale(1);
  }

  32% {
    opacity: 0.7;
    transform: translate3d(-8vw, 8vh, 0) scale(1.08);
  }

  58% {
    opacity: 0.42;
    transform: translate3d(-16vw, 14vh, 0) scale(0.92);
  }

  80% {
    opacity: 0.62;
    transform: translate3d(-5vw, -3vh, 0) scale(1.12);
  }
}

@keyframes aiOrbDriftC {
  0%,
  100% {
    opacity: 0.4;
    transform: translate3d(-8vw, 0, 0) scale(0.88);
  }

  36% {
    opacity: 0.66;
    transform: translate3d(4vw, 9vh, 0) scale(1.1);
  }

  64% {
    opacity: 0.5;
    transform: translate3d(14vw, -8vh, 0) scale(0.96);
  }
}

@keyframes aiOrbDriftD {
  0%,
  100% {
    opacity: 0.32;
    transform: translate3d(4vw, 8vh, 0) scale(0.94);
  }

  30% {
    opacity: 0.56;
    transform: translate3d(-13vw, -5vh, 0) scale(1.14);
  }

  72% {
    opacity: 0.38;
    transform: translate3d(-3vw, -14vh, 0) scale(0.88);
  }
}

@keyframes aiAuroraBallLand {
  0% {
    opacity: 0;
    transform: translate3d(-330px, -230px, 0) scale(1.55);
  }

  12% {
    opacity: 1;
  }

  24% {
    transform: translate3d(-190px, 34px, 0) scale(1.08);
  }

  42% {
    transform: translate3d(-72px, -118px, 0) scale(1.32);
  }

  62% {
    transform: translate3d(50px, 18px, 0) scale(0.98);
  }

  82% {
    transform: translate3d(-12px, -38px, 0) scale(0.9);
  }

  100% {
    opacity: 0.34;
    transform: translate3d(-50%, -50%, 0) scale(0.46);
  }
}

@keyframes aiScrollGlowSettle {
  0%,
  72% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes aiScrollCueButton {
  0%,
  68% {
    transform: translateY(0) scale(0.96);
  }

  82% {
    transform: translateY(-5px) scale(1.04);
  }

  100% {
    transform: translateY(0) scale(1);
  }
}

@keyframes aiScrollCueFloat {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(7px);
  }
}

.brand,
.desktopNav a,
.breadcrumb a,
.hero h1,
.hero h1 span,
.sectionIntro h2,
.finalCta h2,
.aboutHero h1,
.achievementBody h3,
.featureCard h3,
.darkCard h3,
.processCard h3,
.industryCard h3,
.priceCard h3,
.workflow h3,
.aboutLinkSection h2,
.faqItem summary,
.articleGrid h2,
.articleHero h1,
.articleSection h2,
.detailMiniCard h3,
.detailLinkCard h3,
.evidenceCard h3,
.queryMapCard h3,
.evidenceRelated h3,
.queryCoverage h2,
.contactForm label,
.fullField,
.checkboxGroup {
  color: #111827;
}

.desktopNav,
.breadcrumb,
.lead,
.sectionIntro p,
.finalCta p,
.aboutLinkSection p,
.articleGrid p,
.featureCard p,
.darkCard p,
.processCard p,
.priceCard dd,
.workflow p,
.faqItem p,
.notice,
.panelNote,
.placeholder small,
.articleSection p,
.detailMiniCard p,
.detailLinkCard p,
.evidenceCard p,
.queryMapCard p,
.queryCoverage p:not(.eyebrow),
.formDisclaimer,
.formStatus,
.checkboxGroup label {
  color: #526174;
}

.eyebrow,
.heroPrice span,
.heroPanel dt,
.achievementBody p,
.placeholder span,
.price,
.pricingTable tbody td:nth-child(2),
.textButton,
.priceCard dt,
.evidenceCard span,
.queryMapCard span,
.detailLinkCard span,
.checkboxGroup legend {
  color: #a66a00;
}

.hero h1 {
  color: #07111f;
  font-size: clamp(3.7rem, 12vw, 9.2rem);
  line-height: 0.92;
  overflow-wrap: normal;
  text-wrap: balance;
  word-break: normal;
  transition: font-size 520ms cubic-bezier(0.18, 1, 0.28, 1);
}

.hero h1 span {
  max-width: 11.5em;
  margin-right: auto;
  margin-left: auto;
  color: #14213d;
  font-size: clamp(1.45rem, 4.2vw, 3.25rem);
  line-height: 1.2;
  overflow-wrap: break-word;
  text-wrap: balance;
  word-break: normal;
}

.page[data-ai-scrolled="true"] .hero h1 {
  font-size: clamp(3rem, 7.2vw, 6.6rem);
}

.page[data-ai-scrolled="true"] .hero h1 span {
  margin-left: 0;
}

.page[data-ai-scrolled="true"] .pricingSection .sectionIntro,
.page[data-ai-scrolled="true"] .pricingTableWrap,
.page[data-ai-scrolled="true"] .priceCard {
  opacity: 1;
  transform: none;
  filter: none;
}

.featureCard {
  display: grid;
  align-content: center;
  justify-items: center;
  text-align: center;
}

.featureCard h3,
.featureCard p {
  max-width: 22em;
}

.pricingTableWrap {
  background: rgba(255, 255, 255, 0.92);
}

.pricingTable th,
.pricingTable td {
  color: #172033;
}

.pricingTable thead th {
  background: #14213d;
  color: #ffffff;
}

.pricingTable tbody th {
  color: #07111f;
}

.pricingTable tbody td:nth-child(2) {
  color: #8a5400;
}

.recommendedRow th,
.recommendedRow td {
  background:
    linear-gradient(135deg, rgba(20, 33, 61, 0.08), rgba(31, 135, 255, 0.06)),
    rgba(255, 255, 255, 0.96);
  color: #07111f;
  font-weight: 800;
}

.tableCta,
.priceCardCta {
  background: #143a5f;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff;
}

.observationCard {
  border-color: rgba(15, 23, 42, 0.14);
  background:
    radial-gradient(circle at 18% 18%, rgba(31, 135, 255, 0.1), transparent 34%),
    rgba(255, 255, 255, 0.94);
  box-shadow:
    0 20px 58px rgba(15, 23, 42, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.observationCard span {
  color: #9b6200;
}

.observationCard h3 {
  color: #07111f;
}

.observationCard dt {
  color: #334155;
}

.observationCard dd {
  color: #263448;
}

.observationDisclaimer {
  color: #07111f;
}

.lead {
  max-width: 720px;
  color: #334155;
  line-height: 1.95;
  overflow-wrap: break-word;
  text-wrap: pretty;
  word-break: normal;
}

.primaryButton,
.headerCta,
.desktopFloatingCta,
.mobileStickyCta,
.mobileMenuCta {
  background: linear-gradient(135deg, #1a6dff, #35d4ff 54%, #ff64c7);
  color: #ffffff;
  box-shadow:
    0 16px 42px rgba(31, 135, 255, 0.18),
    0 0 0 1px rgba(255, 255, 255, 0.34) inset;
}

.secondaryButton,
.heroPrice a,
.zoomButton,
.lightboxClose {
  border-color: rgba(20, 33, 61, 0.18);
  background: rgba(255, 255, 255, 0.72);
  color: #14213d;
}

.badges span {
  border-color: rgba(15, 23, 42, 0.1);
  background: rgba(255, 255, 255, 0.68);
  color: #334155;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.heroPrice {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.86), rgba(255, 255, 255, 0.64)),
    rgba(255, 255, 255, 0.78);
}

.heroPrice strong {
  color: #111827;
  text-shadow: none;
}

.heroPrice p {
  color: #526174;
}

.heroPanel div {
  border-bottom-color: rgba(15, 23, 42, 0.1);
}

.panelNote {
  background: rgba(248, 250, 252, 0.78);
}

.mobileMenu {
  border-color: rgba(15, 23, 42, 0.12);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 26px 80px rgba(15, 23, 42, 0.14);
}

.mobileNavGroup {
  border-color: rgba(15, 23, 42, 0.1);
  background: rgba(248, 250, 252, 0.72);
}

.mobileNavGroup summary,
.mobileMenu a {
  color: #14213d;
}

.mobileMenu a:hover {
  background: rgba(20, 33, 61, 0.06);
}

.menuButton {
  border-color: rgba(15, 23, 42, 0.14);
  background: rgba(255, 255, 255, 0.88);
  color: #14213d;
}

.articleList li,
.observationCard,
.directoryCard,
.sitemapCard,
.footerGroup,
.footerCta,
.siteFooter {
  border-color: rgba(15, 23, 42, 0.12);
  background: rgba(255, 255, 255, 0.72);
  color: #111827;
}

.contactForm input,
.contactForm select,
.contactForm textarea {
  border-color: rgba(15, 23, 42, 0.16);
  background: rgba(255, 255, 255, 0.78);
  color: #111827;
}

.formStatus {
  background: rgba(31, 135, 255, 0.08);
  color: #14213d;
}

@keyframes aiTextAuroraFlow {
  0%,
  100% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }
}

.hero h1,
.hero h1 span {
  font-family:
    "Hiragino Maru Gothic ProN",
    "M PLUS Rounded 1c",
    "Zen Maru Gothic",
    "Arial Rounded MT Bold",
    "Yu Gothic",
    YuGothic,
    system-ui,
    sans-serif;
  background:
    linear-gradient(
      110deg,
      #07111f 0%,
      #143a5f 18%,
      #1f87ff 36%,
      #15b9db 52%,
      #d94aa9 72%,
      #143a5f 88%,
      #07111f 100%
    );
  background-size: 260% 100%;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  -webkit-background-clip: text;
  animation: aiTextAuroraFlow 8s cubic-bezier(0.45, 0, 0.2, 1) infinite;
  text-shadow: 0 10px 30px rgba(7, 17, 31, 0.12);
}

.hero h1 span {
  background-size: 320% 100%;
  animation-duration: 9.5s;
  text-shadow: 0 7px 22px rgba(7, 17, 31, 0.1);
}

.finalCta {
  border: 1px solid rgba(15, 23, 42, 0.12);
  background:
    radial-gradient(circle at 16% 12%, rgba(31, 135, 255, 0.16), transparent 34%),
    radial-gradient(circle at 86% 78%, rgba(255, 100, 199, 0.15), transparent 34%),
    rgba(255, 255, 255, 0.9);
  color: #07111f;
  box-shadow:
    0 26px 80px rgba(15, 23, 42, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

.finalCta h2,
.finalCta p,
.finalCta .ctaNote {
  color: #07111f;
}

.finalCta p,
.finalCta .ctaNote {
  color: #334155;
}

.finalCta .secondaryButton {
  border-color: rgba(20, 33, 61, 0.18);
  background: rgba(255, 255, 255, 0.62);
  color: #14213d;
}

.siteFooter,
.footerCta,
.footerGrid,
.footerGroup {
  color: #07111f;
}

.siteFooter {
  border-radius: 16px;
  background: transparent;
}

.footerCta {
  border-color: rgba(15, 23, 42, 0.12);
  background:
    radial-gradient(circle at 14% 18%, rgba(31, 135, 255, 0.14), transparent 36%),
    radial-gradient(circle at 90% 74%, rgba(255, 100, 199, 0.13), transparent 34%),
    rgba(255, 255, 255, 0.92);
  box-shadow: 0 24px 72px rgba(15, 23, 42, 0.1);
}

.footerGrid {
  border-color: rgba(15, 23, 42, 0.12);
  background: rgba(255, 255, 255, 0.84);
  box-shadow: 0 22px 66px rgba(15, 23, 42, 0.08);
}

.footerGroup {
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.78);
  padding: 16px;
}

.footerCta h2,
.footerGroup h2 {
  color: #07111f;
}

.footerCta p,
.footerBottom,
.footerBottom a,
.footerGroup a {
  color: #334155;
}

.footerGroup a:hover,
.footerBottom a:hover {
  color: #1f5fd6;
}

.articleHero h1,
.directoryHero h1 {
  color: #07111f;
  -webkit-text-fill-color: #07111f;
}

.articleHero h1 span,
.articleLead,
.directoryHero p,
.articleHero p {
  color: #334155;
  -webkit-text-fill-color: currentColor;
}

.articleSection,
.detailLinkCard,
.directoryCard,
.sitemapCategory,
.emptyState {
  border-color: rgba(15, 23, 42, 0.12);
  background: rgba(255, 255, 255, 0.86);
  color: #07111f;
}

.detailLinkCard h3,
.directoryCard h3,
.sitemapCategory h2,
.articleSection h2 {
  color: #07111f;
}

.detailLinkCard p,
.directoryCard p,
.sitemapCategory p,
.articleSection p {
  color: #334155;
}

.detailLinkCard span,
.directoryCard span,
.sitemapCategory a {
  color: #9b6200;
}

@media (max-width: 880px) {
  .hero {
    min-height: 100dvh;
    padding-top: 8vh;
    padding-bottom: 8vh;
  }

  .page[data-ai-scrolled="true"] .hero {
    padding-top: 96px;
    padding-bottom: 58px;
  }

  .hero h1 {
    font-size: clamp(2.85rem, 13.2vw, 3.75rem);
  }

  .auroraStage span {
    width: clamp(170px, 58vw, 360px);
    filter: blur(24px);
    opacity: 0.5;
  }

  .hero h1 span {
    font-size: clamp(1.3rem, 7vw, 2rem);
    line-height: 1.22;
    word-break: normal;
  }

  .lead {
    font-size: 1rem;
    line-height: 1.86;
  }
}

@media (max-width: 520px) {
  .hero h1 {
    font-size: clamp(2.72rem, 13vw, 3.42rem);
  }

  .hero h1 span {
    max-width: 10.5em;
    font-size: clamp(1.22rem, 6vw, 1.72rem);
  }
}

@media (max-width: 880px) {
  .page .localHeader,
  .page:not([data-ai-scrolled="true"]) .localHeader,
  .page[data-ai-scrolled="true"] .localHeader {
    position: fixed;
    top: 12px;
    left: 12px;
    right: 12px;
    z-index: 120;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    width: auto;
    min-height: 60px;
    margin: 0;
    padding: 8px 10px 8px 16px;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 18px 54px rgba(15, 23, 42, 0.12);
    opacity: 1;
    pointer-events: auto;
    transform: none;
    visibility: visible;
    backdrop-filter: blur(18px);
  }

  .page .brand {
    overflow: hidden;
    max-width: min(210px, 52vw);
  }

  .page .brandLogo {
    height: 34px;
  }

  .page .desktopMegaNav,
  .page .headerCta {
    display: none;
  }

  .page .menuButton,
  .page:not([data-ai-scrolled="true"]) .menuButton,
  .page[data-ai-scrolled="true"] .menuButton {
    position: fixed;
    top: 18px;
    right: auto;
    left: min(322px, calc(100vw - 72px));
    z-index: 122;
    display: inline-grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border: 1px solid rgba(15, 23, 42, 0.14);
    border-radius: 15px;
    background: #07111f;
    color: #ffffff;
    box-shadow: 0 16px 38px rgba(15, 23, 42, 0.2);
  }

  .page .menuButton span {
    background: currentColor;
  }

  .page .mobileMenu {
    position: fixed;
    top: 84px;
    left: 12px;
    right: 12px;
    z-index: 119;
    display: grid;
    gap: 10px;
    max-height: calc(100dvh - 106px);
    overflow-y: auto;
    padding: 14px;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 18px;
    background:
      radial-gradient(circle at 12% 12%, rgba(31, 135, 255, 0.12), transparent 36%),
      radial-gradient(circle at 88% 28%, rgba(255, 100, 199, 0.14), transparent 34%),
      rgba(255, 255, 255, 0.96);
    box-shadow: 0 28px 86px rgba(15, 23, 42, 0.18);
    opacity: 0;
    pointer-events: none;
    transform: translateY(-10px) scale(0.98);
    visibility: hidden;
  }

  .page .mobileMenuOpen {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0) scale(1);
    visibility: visible;
  }

  .page .mobileNavGroup {
    border-color: rgba(15, 23, 42, 0.1);
    background: rgba(255, 255, 255, 0.74);
  }

  .page .mobileNavGroup summary,
  .page .mobileMenu a {
    color: #07111f;
  }

  .page .mobileMenuCta {
    min-height: 52px;
    justify-content: center;
    background: linear-gradient(115deg, #1687ff 0%, #31d4ee 48%, #ee5cb7 100%);
    color: #ffffff !important;
    box-shadow: 0 14px 34px rgba(31, 135, 255, 0.2);
  }

  .page > .mobileMenuFab {
    display: none !important;
  }
}

@media (max-width: 880px) {
  .impactBridge,
  .deliveryBand {
    width: min(100% - 28px, 680px);
    border-radius: 24px;
  }

  .impactBridge {
    gap: 20px;
    margin-top: 8px;
    padding: 42px 22px;
  }

  .impactBridgeTitle {
    max-width: none;
    font-size: clamp(2.2rem, 10vw, 4.2rem);
    line-height: 1.04;
  }

  .impactBridgeLead,
  .deliveryBandLead {
    font-size: 1rem;
    line-height: 1.85;
  }

  .impactBridgeGrid,
  .deliveryBand {
    grid-template-columns: 1fr;
  }

  .impactBridgeCard {
    min-height: 0;
    text-align: center;
  }

  .impactBridgeActions,
  .deliveryBandActions {
    flex-direction: column;
    align-items: stretch;
  }

  .deliveryBand {
    gap: 22px;
    margin-top: 24px;
    padding: 40px 22px;
    text-align: center;
  }

  .deliveryBandTitle {
    max-width: 8.2em;
    margin-right: auto;
    margin-left: auto;
    font-size: clamp(2.25rem, 10.5vw, 4.25rem);
  }

  .deliveryBandLead {
    margin-top: 14px;
  }

  .deliveryHighlight {
    padding: 24px 18px;
  }

  .deliveryHighlight strong {
    font-size: clamp(1.25rem, 6vw, 1.7rem);
  }

  .deliveryBand .primaryButton {
    width: 100%;
    margin-top: 0;
  }
}

.hero h1 span {
  max-width: none;
  overflow-wrap: normal;
  text-wrap: nowrap;
  white-space: nowrap;
  word-break: keep-all;
}

@media (max-width: 880px) {
  .page .localHeader,
  .page:not([data-ai-scrolled="true"]) .localHeader,
  .page[data-ai-scrolled="true"] .localHeader {
    position: fixed;
    top: 14px;
    left: 50%;
    right: auto;
    z-index: 120;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    width: calc(100vw - 28px);
    max-width: 720px;
    min-height: 64px;
    margin: 0;
    padding: 9px 12px 9px 18px;
    border-radius: 18px;
    transform: translateX(-50%);
  }

  .page .brand {
    min-width: 0;
    max-width: min(210px, 52vw);
    overflow: hidden;
  }

  .page .brandLogo {
    height: 34px;
  }

  .page .menuButton,
  .page:not([data-ai-scrolled="true"]) .menuButton,
  .page[data-ai-scrolled="true"] .menuButton {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    grid-column: 2;
    grid-row: 1;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    justify-self: end;
    gap: 4px;
    width: 50px;
    height: 50px;
    margin: 0;
    padding: 0;
    border-radius: 15px;
    background: #07111f;
    color: #ffffff;
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.2);
    transform: none;
  }

  .page .menuButton span {
    width: 22px;
    height: 2px;
    margin: 0;
    background: currentColor;
  }

  .page .mobileMenu {
    top: 90px;
    left: 14px;
    right: 14px;
  }
}

@media (max-width: 420px) {
  .page .localHeader,
  .page:not([data-ai-scrolled="true"]) .localHeader,
  .page[data-ai-scrolled="true"] .localHeader {
    top: 12px;
    width: calc(100vw - 24px);
    min-height: 60px;
    padding: 8px 10px 8px 16px;
  }

  .page .menuButton,
  .page:not([data-ai-scrolled="true"]) .menuButton,
  .page[data-ai-scrolled="true"] .menuButton {
    position: static !important;
    width: 48px;
    height: 48px;
  }

  .page .mobileMenu {
    top: 82px;
    left: 12px;
    right: 12px;
  }
}

@media (max-width: 880px) {
  html,
  body,
  .page {
    max-width: 100%;
    overflow-x: hidden;
  }

  .section,
  .proofSection,
  .primarySourceSection,
  .pricingSection,
  .painSection,
  .impactBridge,
  .midCtaSection,
  .siteFooter,
  .page.articlePage > .section {
    width: 100%;
    max-width: 100%;
    padding-left: 14px;
    padding-right: 14px;
    margin-right: auto;
    margin-left: auto;
    box-sizing: border-box;
  }

  .page.articlePage .articleSection {
    padding: 22px 16px;
  }

  .page.articlePage .articleHero h1,
  .page.articlePage .aboutHero h1 {
    max-width: 100%;
    font-size: clamp(1.65rem, 7vw, 2.15rem);
    line-height: 1.22;
    overflow-wrap: anywhere;
    word-break: normal;
  }

  .page.articlePage .articleLead,
  .page.articlePage .articleHero p,
  .page.articlePage .articleSection p {
    overflow-wrap: anywhere;
    word-break: normal;
  }

  .impactBridge {
    gap: 18px;
    padding: 36px 20px 40px;
    border-radius: 24px;
    overflow: hidden;
    text-align: center;
  }

  .impactBridgeTitle {
    max-width: 8.2em;
    margin-right: auto;
    margin-left: auto;
    font-size: clamp(2.15rem, 9.6vw, 3.25rem);
    line-height: 1.08;
    text-wrap: balance;
    word-break: keep-all;
  }

  .impactBridgeTitle span {
    display: block;
    white-space: normal;
  }

  .impactBridgeLead {
    max-width: 28em;
    margin-right: auto;
    margin-left: auto;
    font-size: 0.96rem;
    line-height: 1.85;
    text-align: left;
  }

  .impactBridgeGrid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .impactBridgeCard {
    padding: 22px 18px;
    border-radius: 18px;
  }

  .impactBridgeActions {
    width: 100%;
  }

  .impactBridgeActions .primaryButton,
  .impactBridgeActions .secondaryButton {
    width: 100%;
  }

  .painSection {
    padding: 38px 18px 42px;
    border-radius: 24px;
  }

  .painIntro {
    width: 100%;
    max-width: none;
    text-align: left;
  }

  .painIntro .eyebrow {
    font-size: 0.76rem;
  }

  .painIntro h2 {
    max-width: 100%;
    font-size: clamp(1.65rem, 6.8vw, 2.4rem);
    line-height: 1.28;
    text-wrap: balance;
    overflow-wrap: anywhere;
    word-break: normal;
  }

  .painIntro p {
    max-width: none;
    font-size: 0.96rem;
    line-height: 1.85;
  }

  .painGrid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .relatedGrid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .refundGuarantee h3 {
    font-size: clamp(1.45rem, 5.6vw, 2rem);
    line-height: 1.22;
  }

  .refundGuaranteeLead {
    font-size: clamp(0.98rem, 3.8vw, 1.15rem);
    font-weight: 800;
    line-height: 1.65;
  }

  .painCard {
    min-height: 0;
    padding: 24px 20px;
    border-radius: 20px;
  }

  .painCard h3 {
    font-size: clamp(1.28rem, 5.4vw, 1.75rem);
    line-height: 1.45;
  }

  .painCard > p,
  .painSolution p {
    font-size: 0.95rem;
    line-height: 1.85;
  }

  .painCta {
    padding: 22px 18px;
  }

  .aioFocusPanel {
    width: 100%;
    max-width: 100%;
    margin: 30px auto 0;
    padding: 34px 18px;
    border-radius: 24px;
    overflow: hidden;
  }

  .aioFocusPanel h3 {
    max-width: 12em;
    font-size: clamp(1.65rem, 6.6vw, 2.35rem);
    line-height: 1.16;
    text-wrap: balance;
    word-break: keep-all;
  }

  .aioFocusPanel h3 span {
    display: block;
    white-space: normal;
  }

  .aioFocusPanel p:not(.eyebrow) {
    max-width: 27em;
    font-size: 0.96rem;
    line-height: 1.85;
    text-align: left;
  }

  .aioFocusPanel .secondaryButton {
    width: 100%;
    min-height: 54px;
  }

  .midCtaSection {
    padding-top: 36px;
    padding-bottom: 42px;
  }

  .midCtaSection .footerCta,
  .footerCta {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    align-items: start;
    padding: 28px 22px;
    border-radius: 22px;
    text-align: left;
  }

  .footerCta h2 {
    max-width: 11em;
    font-size: clamp(1.65rem, 7.6vw, 2.35rem);
    line-height: 1.22;
    text-wrap: balance;
    word-break: keep-all;
  }

  .footerCta p {
    font-size: 0.96rem;
    line-height: 1.8;
  }

  .footerCta .primaryButton {
    width: 100%;
    min-height: 58px;
  }

  .siteFooter {
    padding: 22px 0 126px;
  }

  .footerGrid {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 14px;
    border-radius: 22px;
  }

  .footerGroup {
    gap: 9px;
    padding: 18px;
    border-radius: 18px;
  }

  .footerGroup h2 {
    font-size: 0.9rem;
    line-height: 1.45;
  }

  .footerGroup a {
    font-size: 0.96rem;
    line-height: 1.65;
    word-break: keep-all;
  }

  .footerBottom {
    display: grid;
    justify-content: stretch;
    gap: 8px;
    padding: 18px 4px 0;
  }
}

@media (max-width: 520px) {
  .section,
  .proofSection,
  .primarySourceSection,
  .pricingSection,
  .painSection,
  .impactBridge,
  .midCtaSection,
  .siteFooter {
    width: calc(100% - 24px);
    max-width: calc(100vw - 24px);
  }

  .impactBridge {
    padding: 34px 18px 38px;
  }

  .impactBridgeTitle {
    max-width: 8.4em;
    font-size: clamp(2rem, 8.8vw, 2.72rem);
  }

  .painSection {
    padding: 34px 16px 38px;
  }

  .painIntro h2 {
    max-width: 100%;
    font-size: clamp(1.55rem, 6.2vw, 2rem);
    line-height: 1.3;
  }

  .aioFocusPanel h3 {
    font-size: clamp(1.55rem, 6.1vw, 2rem);
  }

  .footerCta h2 {
    max-width: 10.5em;
    font-size: clamp(1.55rem, 6.8vw, 2.1rem);
  }

  .midCtaSection .footerCta h2 {
    max-width: 100%;
    font-size: clamp(1.45rem, 6.2vw, 1.9rem);
    line-height: 1.28;
    overflow-wrap: anywhere;
    word-break: normal;
    text-wrap: balance;
  }
}

.impactBridgeActions .primaryButton {
  border: 1px solid rgba(15, 23, 42, 0.16);
  background: rgba(255, 255, 255, 0.86);
  color: #07111f !important;
  -webkit-text-fill-color: #07111f;
  box-shadow:
    0 12px 34px rgba(15, 23, 42, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.92);
}

.impactBridgeActions .primaryButton:hover {
  background: rgba(255, 255, 255, 0.96);
  color: #07111f !important;
  -webkit-text-fill-color: #07111f;
  box-shadow:
    0 16px 40px rgba(15, 23, 42, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.94);
}

.impactBridgeActions .secondaryButton {
  border-color: rgba(255, 255, 255, 0.7);
  background: linear-gradient(110deg, #1f87ff 0%, #2dd4ff 48%, #e95bc1 100%);
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff;
  box-shadow: 0 18px 46px rgba(31, 135, 255, 0.22);
}

.impactBridgeActions .secondaryButton:hover {
  background: linear-gradient(110deg, #1479ef 0%, #26c8e8 48%, #df4eb6 100%);
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff;
  box-shadow: 0 22px 52px rgba(31, 135, 255, 0.28);
}

@media (prefers-reduced-motion: reduce) {
  .desktopNav a,
  .desktopMegaNav a,
  .navGroupButton,
  .navDropdown,
  .headerCta,
  .mobileMenu,
  .mobileMenu a,
  .mobileNavGroup summary,
  .primaryButton,
  .secondaryButton,
  .textButton,
  .desktopFloatingCta,
  .mobileStickyCta,
  .guaranteeCtaButton,
  .zoomButton,
  .lightboxClose,
  .dwellCtaClose,
  .localHeader,
  .hero h1 {
    transition: none;
  }

  .page [data-ai-reveal] {
    opacity: 1;
    transform: none;
    filter: none;
    transition: none;
  }

  .page[data-ai-scrolled="true"] .breadcrumb,
  .page[data-ai-scrolled="true"] .hero .eyebrow,
  .page[data-ai-scrolled="true"] .lead,
  .page[data-ai-scrolled="true"] .heroPrice,
  .page[data-ai-scrolled="true"] .heroActions,
  .page[data-ai-scrolled="true"] .badges,
  .page[data-ai-scrolled="true"] .heroPanel {
    animation: none;
  }

  .heroPanel.isVisible,
  .heroPanel::before,
  .heroPanel.isVisible dl div,
  .heroPrice::before,
  .scrollCue,
  .scrollCue::before,
  .scrollCue::after,
  .transitionGlow,
  .hero h1,
  .hero h1 span,
  .page::before,
  .page::after,
  .hero::before,
  .hero::after,
  .auroraStage span,
  .refundGuarantee::before,
  .performanceBilling::before,
  .aioFocusPanel::before,
  .aioFocusPanel h3,
  .impactBridge::before,
  .deliveryBand::before,
  .impactBridgeTitle,
  .deliveryBandTitle,
  .dwellCtaPopup {
    animation: none;
  }
}

.pricingSupplement {
  margin: 16px 0 0;
  color: #475569;
  font-size: 0.95rem;
  line-height: 1.7;
}

.priceCardRole {
  margin: 0 0 8px;
  color: #64748b;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.06em;
}

.hubStandardHero h1 {
  margin: 0;
  color: #07111f;
  font-size: clamp(1.75rem, 3.6vw, 2.35rem);
  line-height: 1.25;
}

.hubStandardHero .articleLead,
.guaranteeHeroNote {
  max-width: 760px;
  color: #334155;
  font-size: 1.02rem;
  line-height: 1.85;
}

.guaranteeHeroNote {
  margin-top: 12px;
}

.companyInfoTable {
  width: 100%;
  border-collapse: collapse;
}

.companyInfoTable th,
.companyInfoTable td {
  padding: 12px 14px;
  border-bottom: 1px solid rgba(20, 33, 61, 0.12);
  text-align: left;
  vertical-align: top;
  line-height: 1.7;
}

.companyInfoTable th {
  width: 28%;
  color: #334155;
  font-weight: 800;
  white-space: nowrap;
}

.legalFooterLinks {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  align-items: center;
  justify-content: center;
  padding: 18px 20px 8px;
}

.legalFooterLinks a,
.legalFooterButton,
.inlineLegalButton {
  border: 0;
  background: none;
  padding: 0;
  color: #cbd5e1;
  font: inherit;
  font-size: 0.88rem;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

.notice .inlineLegalButton {
  color: inherit;
  margin-left: 6px;
}

.privacyConsent .inlineLegalButton {
  color: inherit;
  font-weight: 900;
}

.legalModalOpen {
  overflow: hidden;
}

.legalModalBackdrop {
  position: fixed;
  inset: 0;
  z-index: 120;
  background: rgba(7, 17, 31, 0.62);
}

.legalModal {
  position: fixed;
  inset: 0;
  z-index: 121;
  display: grid;
  place-items: center;
  padding: 20px;
}

.legalModal[hidden],
.legalModalBackdrop[hidden] {
  display: none !important;
}

.legalModalPanel {
  width: min(760px, 100%);
  max-height: min(86vh, 920px);
  overflow: auto;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 28px 80px rgba(15, 23, 42, 0.28);
  outline: none;
}

.legalModalHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  position: sticky;
  top: 0;
  padding: 18px 20px;
  border-bottom: 1px solid rgba(20, 33, 61, 0.1);
  background: #fff;
}

.legalModalHeader h2 {
  margin: 0;
  font-size: 1.15rem;
}

.legalModalClose {
  border: 0;
  background: rgba(15, 23, 42, 0.06);
  width: 36px;
  height: 36px;
  border-radius: 999px;
  font-size: 1.4rem;
  line-height: 1;
  cursor: pointer;
}

.legalModalBody {
  padding: 18px 20px 24px;
  color: #1f2937;
  line-height: 1.8;
}

.legalModalSection + .legalModalSection {
  margin-top: 18px;
}

.legalModalSection h3 {
  margin: 0 0 8px;
  font-size: 1rem;
}

.legalModalTable {
  width: 100%;
  border-collapse: collapse;
}

.legalModalTable th,
.legalModalTable td {
  padding: 10px 12px;
  border-bottom: 1px solid rgba(20, 33, 61, 0.1);
  vertical-align: top;
  line-height: 1.7;
}

.legalModalTable th {
  width: 34%;
  font-weight: 800;
  white-space: nowrap;
}

.legalModalFootnote {
  margin-top: 18px;
  color: #64748b;
  font-size: 0.92rem;
}

@media (max-width: 720px) {
  .legalModal {
    padding: 12px;
  }

  .legalModalPanel {
    max-height: 92vh;
  }

  .companyInfoTable th {
    white-space: normal;
    width: 34%;
  }
}