/* Focused visual corrections for landing v14. */

/* Hero headline: only the KIPO realtime phrase remains accented. */
.hero h1{
  color:#f7fbff!important;
  text-shadow:0 2px 18px rgba(0,0,0,.48)!important;
}
.hero h1 .hl{
  color:#9fd8ef!important;
  text-shadow:0 2px 16px rgba(0,0,0,.46),0 0 28px rgba(98,185,224,.14)!important;
}

/* Header demo CTA: use the old hover treatment as its normal state. */
.nav .nav__cta .btn--primary,
.nav--over .nav__cta .btn--primary{
  background:#fff!important;
  color:#071017!important;
  border:1px solid rgba(255,255,255,.78)!important;
  box-shadow:0 8px 26px rgba(0,0,0,.24)!important;
}
.nav .nav__cta .btn--primary:hover,
.nav--over .nav__cta .btn--primary:hover{
  background:#fff!important;
  color:#071017!important;
  transform:translateY(-1px);
}

/* Force the scroll guide to the true horizontal center of the splash viewport. */
.splash{position:relative!important;}
.splash__scroll{
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:26px!important;
  width:max-content!important;
  margin-left:auto!important;
  margin-right:auto!important;
  transform:none!important;
  justify-content:center!important;
  align-items:center!important;
}

/* B2B landing typography: stronger display hierarchy without turning the page
   into a campaign-style poster. Supporting copy grows only enough for dark-field legibility. */
.hero h1{
  font-size:clamp(40px,4.6vw,62px)!important;
  line-height:1.10!important;
}
.hero p.lead{
  font-size:17px!important;
  line-height:1.72!important;
}
.sec-head h2,
.cta h2{
  font-size:clamp(32px,3.8vw,48px)!important;
  line-height:1.14!important;
}
.sec-head p{
  font-size:16.5px!important;
}
.feat h3{
  font-size:26px!important;
  line-height:1.26!important;
}
.feat p{
  font-size:16px!important;
  line-height:1.72!important;
}
.feat li{
  font-size:15.5px!important;
  line-height:1.62!important;
}

/* One continuous page background from splash through footer. The previous splash
   gradient/overlay and body gradient made the first viewport visibly darker than
   the following hero. Keep only the Three.js field above a single solid canvas. */
html,
body{
  background:#071017!important;
}
.splash,
.splash__bg,
.splash__overlay,
.hero,
.stats,
.section,
.section--tint,
.cta,
.foot{
  background:transparent!important;
  background-image:none!important;
}
.stats{backdrop-filter:none!important;}
/* The Three.js runtime injects a later .025 opacity rule. Higher specificity keeps
   the legacy splash media from tinting only the first viewport. */
html.seoram-three-ready body .splash__video,
html.seoram-three-ready body .splash__img{
  opacity:0!important;
}

/* Top-of-page upper-right glow. Keep the following hero and all later sections flat. */
.splash{
  background-color:transparent!important;
  background-image:radial-gradient(ellipse 62% 68% at 92% 8%,rgba(73,159,230,.16) 0%,rgba(61,137,204,.085) 30%,rgba(7,16,23,0) 69%)!important;
  background-repeat:no-repeat!important;
}

/* Nudge only the splash headline block slightly upward; keep the scroll guide fixed. */
.splash__content{
  transform:translateY(-18px)!important;
}

/* Section changes should be carried only by spacing/content, not horizontal rules.
   Internal separators such as .feat + .feat remain intact. */
.splash,
.hero,
.stats,
.section,
.section--tint,
.cta,
.foot{
  border-top:0!important;
  border-bottom:0!important;
}

/* #integrations is a 100vh, vertically-centered section on desktop, so its visible
   trailing whitespace is much larger than ordinary section padding. Give the final
   CTA a larger leading runway so pricing -> CTA reads like integrations -> pricing. */
.cta{
  padding-bottom:24svh!important;
}
.cta__in{
  padding-top:190px!important;
}

@media(max-width:900px){
  .cta__in{padding-top:120px!important;}
}

@media(max-width:760px){
  .cta__in{padding-top:76px!important;}
}

@media(max-width:600px){
  .hero h1{font-size:36px!important;line-height:1.13!important;}
  .hero p.lead{font-size:16px!important;}
  .sec-head h2,.cta h2{font-size:31px!important;}
  .sec-head p{font-size:16px!important;}
  .feat h3{font-size:22px!important;}
  .feat p{font-size:15.5px!important;}
  .feat li{font-size:15px!important;}
  .cta{padding-bottom:14svh!important;}
  .splash{
    background-image:radial-gradient(ellipse 76% 60% at 96% 5%,rgba(73,159,230,.12) 0%,rgba(61,137,204,.060) 31%,rgba(7,16,23,0) 70%)!important;
  }
  .splash__content{transform:translateY(-12px)!important;}
}
