/* 4-column matte curtain wipe. Text starts only after all bands have lifted. */
:root {
  --intro-band-1: #071519;
  --intro-band-2: #0e2229;
  --intro-band-3: #13333d;
  --intro-band-4: #1b4b5a;
}


.wipe, .mertsLoader {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: 99999 !important;
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  pointer-events: none !important;
  background: transparent !important;
  transform: none !important;
  animation: none !important;
  will-change: auto !important;
}

.wipe > i, .mertsLoader > i {
  display: block !important;
  height: 100% !important;
  width: 100% !important;
  background: var(--intro-band-1) !important;
  transform: translate3d(0, 0, 0);
  animation: none !important;
  will-change: transform;
}

.wipe > i:nth-child(1), .mertsLoader > i:nth-child(1) { background: var(--intro-band-1) !important; }
.wipe > i:nth-child(2), .mertsLoader > i:nth-child(2) { background: var(--intro-band-2) !important; }
.wipe > i:nth-child(3), .mertsLoader > i:nth-child(3) { background: var(--intro-band-3) !important; }
.wipe > i:nth-child(4), .mertsLoader > i:nth-child(4) { background: var(--intro-band-4) !important; }

.mertsLoaderLabel { color: #f5f0e8; animation: none; transition: opacity .18s ease; }
html[data-intro="loading"] .mertsLoaderLabel { opacity: 0; }

html[data-intro="loading"] .wipe > i:nth-child(1), html[data-intro="loading"] .mertsLoader > i:nth-child(1) {
  animation: landingBandLift .52s cubic-bezier(.76, 0, .24, 1) .03s forwards !important;
}
html[data-intro="loading"] .wipe > i:nth-child(2), html[data-intro="loading"] .mertsLoader > i:nth-child(2) {
  animation: landingBandLift .52s cubic-bezier(.76, 0, .24, 1) .10s forwards !important;
}
html[data-intro="loading"] .wipe > i:nth-child(3), html[data-intro="loading"] .mertsLoader > i:nth-child(3) {
  animation: landingBandLift .52s cubic-bezier(.76, 0, .24, 1) .17s forwards !important;
}
html[data-intro="loading"] .wipe > i:nth-child(4), html[data-intro="loading"] .mertsLoader > i:nth-child(4) {
  animation: landingBandLift .52s cubic-bezier(.76, 0, .24, 1) .24s forwards !important;
}

@keyframes landingBandLift {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(0, -101%, 0); }
}

/* Fix Turkish letter dot clipping (Ü, İ, Ö) in hero title masks */
.page .heroTitle {
  line-height: 1.05 !important;
}
.page .heroTitle > span {
  display: block !important;
  overflow: hidden;
  padding-top: 0.35em !important;
  margin-top: -0.35em !important;
  padding-bottom: 0.12em !important;
  margin-bottom: -0.12em !important;
  padding-right: 0.12em !important;
}
.page .heroTitle > span > i {
  display: block !important;
  font-style: normal;
  transform: translate3d(0, 115%, 0);
  animation: none;
}

/* Once intro is ready, remove overflow clipping completely to guarantee zero clipped umlauts/dots */
html[data-intro="ready"] .page .heroTitle > span,
html[data-intro="ready"] .introWord {
  overflow: visible !important;
}

.introWord {
  display: inline-block !important;
  overflow: hidden;
  vertical-align: top !important;
  padding-top: 0.35em !important;
  margin-top: -0.35em !important;
  padding-bottom: 0.12em !important;
  margin-bottom: -0.12em !important;
}
.page .moduleHero h1 > .introWord,
.v4SubHeroCopy h1 > .introWord {
  display: inline-block !important;
  vertical-align: top;
  font-size: inherit;
  line-height: inherit;
}
.introWord > i {
  display: block;
  font: inherit;
  font-style: normal;
  transform: translate3d(0, 115%, 0);
}

.page .hero .kicker, .page .heroLead, .page .heroActions, .page .heroSignals, .page .dashboardScene {
  opacity: 0;
  animation: none;
}

html[data-intro="ready"] .page .heroTitle > span > i,
html[data-intro="ready"] .introWord > i {
  animation: landingTextWipe .7s cubic-bezier(.16, 1, .3, 1) calc(var(--intro-order, 0) * .045s) both;
}
html[data-intro="ready"] .page .hero .kicker,
html[data-intro="ready"] .page .heroLead,
html[data-intro="ready"] .page .heroActions,
html[data-intro="ready"] .page .heroSignals,
html[data-intro="ready"] .page .dashboardScene {
  animation: landingCopyIn .6s cubic-bezier(.16, 1, .3, 1) .14s both;
}

@keyframes landingTextWipe {
  from { transform: translate3d(0, 115%, 0); }
  to { transform: translate3d(0, 0, 0); }
}
@keyframes landingCopyIn {
  from { opacity: 0; transform: translate3d(0, 14px, 0); }
  to { opacity: 1; transform: none; }
}

@media(prefers-reduced-motion: reduce) {
  .wipe, .mertsLoader { display: none !important; }
  .page .heroTitle > span, .introWord { overflow: visible !important; }
  .page .heroTitle > span > i, .introWord > i, .page .hero .kicker, .page .heroLead, .page .heroActions, .page .heroSignals, .page .dashboardScene {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }
}

/* Waitlist modal removed */
.mertsWaitlistOverlay, #mertsWaitlistOverlay {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* ==========================================================================
   PROMINENT LOGO & BRAND SIZING (52px Header & Footer Mark)
   ========================================================================== */
.islandBrand, .footerBrand, .v5FooterBrand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  text-decoration: none !important;
}

.islandBrand > span, .v5BrandMark, .footerBrand > span, .v5FooterBrand > span {
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  min-height: 52px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  position: relative !important;
  flex: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.islandBrand img, .v5BrandMark img, .footerBrand img, .v5FooterBrand img {
  width: 52px !important;
  height: 52px !important;
  max-width: 52px !important;
  max-height: 52px !important;
  display: block !important;
  object-fit: contain !important;
  position: static !important;
  top: auto !important;
  left: auto !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

.islandBrand > strong, .footerBrand > strong, .v5FooterBrand > strong {
  font-size: 24px !important;
  font-weight: 850 !important;
  letter-spacing: -0.04em !important;
  color: #ffffff !important;
  line-height: 1 !important;
  display: inline-block !important;
}

.islandBrand > i {
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: #10b981 !important;
  margin-left: -4px !important;
  display: inline-block !important;
}

@media (max-width: 480px) {
  .islandBrand > span, .v5BrandMark, .footerBrand > span, .v5FooterBrand > span {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
  }
  .islandBrand img, .v5BrandMark img, .footerBrand img, .v5FooterBrand img {
    width: 42px !important;
    height: 42px !important;
    max-width: 42px !important;
    max-height: 42px !important;
  }
  .islandBrand > strong, .footerBrand > strong, .v5FooterBrand > strong {
    font-size: 20px !important;
  }
}