/* SolidSEO — beyaz + turkuaz cam sistemi
   Hover/active durumları .x* sınıflarıyla, animasyonlar @keyframes ile. */

*{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{margin:0;background:#ffffff;color:#0d2b2b;font-family:"Inter","Helvetica Neue",Arial,sans-serif;font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
  a{color:#0a8478;text-decoration:none}
  a:hover{color:#12b5a6}
  summary::-webkit-details-marker{display:none}
  @keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
  @keyframes floatY2{0%,100%{transform:translateY(0)}50%{transform:translateY(12px)}}
  @keyframes drift{0%,100%{transform:translate3d(0,0,0) scale(1)}33%{transform:translate3d(4%,-3%,0) scale(1.08)}66%{transform:translate3d(-3%,4%,0) scale(.95)}}
  @keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  @keyframes growBar{from{transform:scaleY(.04)}to{transform:scaleY(1)}}
  @keyframes sweep{0%{transform:translateX(-120%)}100%{transform:translateX(220%)}}
  @keyframes pulseRing{0%{transform:scale(.7);opacity:.55}100%{transform:scale(1.9);opacity:0}}
  @keyframes scrollCue{0%{transform:translateY(-6px);opacity:0}40%{opacity:1}100%{transform:translateY(10px);opacity:0}}
  @media (prefers-reduced-motion: reduce){*{animation:none !important;transition:none !important}}
  [data-navtoggle]{display:none}
  [data-navcta],[data-pill]{white-space:nowrap}
  @media (max-width:960px){
    [data-hero-grid],[data-steps-grid]{grid-template-columns:1fr !important;gap:36px !important}
    [data-sticky-col]{position:static !important}
    [data-parallax]{position:static !important;translate:none !important;animation:none !important;margin-top:14px}
    [data-parallax="30"],[data-parallax="-22"]{display:inline-flex !important}
    [data-grid3]{grid-template-columns:repeat(2,1fr) !important}
    [data-foot-grid]{grid-template-columns:1fr 1fr !important}
  }
  @media (max-width:680px){
    [data-grid3],[data-grid2],[data-stats],[data-foot-grid]{grid-template-columns:1fr !important}
    [data-navlinks]{display:none !important;position:absolute;top:72px;left:0;right:0;background:#fff;border-bottom:1px solid #e2ece9;flex-direction:column;padding:18px 24px;gap:14px}
    [data-navlinks][data-open="1"]{display:flex !important}
    [data-navcta]{display:none !important}
    [data-navtoggle]{display:block;margin-left:auto}
    [data-cta-card]{padding:56px 22px !important}
  }
.x1:hover{color:#0a8478 !important}
.x2:hover{color:#0a8478 !important}
.x3:hover{color:#0a8478 !important}
.x4:hover{color:#0a8478 !important}
.x5:hover{background:#0a8478 !important;transform:translateY(-1px) !important;color:#fff !important}
.x6:hover{transform:translateY(-2px) !important;box-shadow:0 18px 40px rgba(18,181,166,.42) !important;color:#fff !important}
.x7:hover{border-color:#12b5a6 !important;color:#0a8478 !important;transform:translateY(-2px) !important}
.x8:hover{border-color:rgba(18,181,166,.55) !important;box-shadow:0 26px 54px rgba(8,37,36,.12) !important;transform:translateY(-6px) !important}
.x9:hover{border-color:rgba(18,181,166,.55) !important;box-shadow:0 26px 54px rgba(8,37,36,.12) !important;transform:translateY(-6px) !important}
.x10:hover{border-color:rgba(18,181,166,.55) !important;box-shadow:0 26px 54px rgba(8,37,36,.12) !important;transform:translateY(-6px) !important}
.x11:hover{border-color:rgba(18,181,166,.55) !important;box-shadow:0 26px 54px rgba(8,37,36,.12) !important;transform:translateY(-6px) !important}
.x12:hover{border-color:rgba(18,181,166,.55) !important;box-shadow:0 26px 54px rgba(8,37,36,.12) !important;transform:translateY(-6px) !important}
.x13:hover{border-color:rgba(18,181,166,.55) !important;box-shadow:0 26px 54px rgba(8,37,36,.12) !important;transform:translateY(-6px) !important}
.x14:hover{border-color:rgba(18,181,166,.55) !important;box-shadow:0 28px 58px rgba(8,37,36,.12) !important;transform:translateY(-6px) !important}
.x15:hover{border-color:rgba(18,181,166,.55) !important;box-shadow:0 28px 58px rgba(8,37,36,.12) !important;transform:translateY(-6px) !important}
.x16:hover{border-color:rgba(95,216,203,.5) !important;background:rgba(255,255,255,.08) !important;transform:translateY(-6px) !important}
.x17:hover{border-color:rgba(95,216,203,.5) !important;background:rgba(255,255,255,.08) !important;transform:translateY(-6px) !important}
.x18:hover{transform:translateY(-2px) !important;background:#e6f7f5 !important;color:#082524 !important}
.x19:hover{color:#5fd8cb !important}
.x20:hover{color:#5fd8cb !important}
.x21:hover{color:#5fd8cb !important}
.x22:hover{color:#5fd8cb !important}
.x23:hover{color:#5fd8cb !important}
.x24:hover{color:#5fd8cb !important}
.x25:hover{color:#5fd8cb !important}
.x26:hover{color:#5fd8cb !important}

/* SOLIDSEO HEADER LIQUID CTA — 2026-08-04 */
.nav-quote-liquid{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  min-width:126px;
  min-height:44px;
  padding:11px 20px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:linear-gradient(135deg,#17bdb2 0%,#0fa695 52%,#087f75 100%);
  color:#fff !important;
  box-shadow:0 9px 24px rgba(13,159,146,.28), inset 0 1px 0 rgba(255,255,255,.22);
  font-size:.9rem;
  font-weight:700;
  line-height:1;
  text-decoration:none;
  transform:translateZ(0);
  transition:transform .25s ease,box-shadow .25s ease,filter .25s ease;
}

.nav-quote-liquid__text{
  position:relative;
  z-index:4;
  white-space:nowrap;
  text-shadow:0 1px 1px rgba(0,70,64,.16);
}

/* Butonun içinde yavaşça dönen sıvı ışık */
.nav-quote-liquid::before{
  content:"";
  position:absolute;
  z-index:1;
  width:190%;
  height:260%;
  left:-45%;
  top:36%;
  border-radius:42%;
  background:
    radial-gradient(circle at 32% 28%,rgba(255,255,255,.38) 0 8%,transparent 34%),
    linear-gradient(145deg,rgba(105,244,226,.62),rgba(9,126,117,.50));
  opacity:.82;
  transform-origin:50% 48%;
  animation:solidLiquidWave 6.8s linear infinite;
  will-change:transform;
}

/* Yüzeyde dolaşan yansıma */
.nav-quote-liquid::after{
  content:"";
  position:absolute;
  z-index:2;
  top:-35%;
  bottom:-35%;
  left:-65%;
  width:34%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.48),transparent);
  filter:blur(2px);
  transform:skewX(-20deg);
  animation:solidLiquidShine 4.8s ease-in-out infinite;
  pointer-events:none;
}

.nav-quote-liquid:hover{
  color:#fff !important;
  transform:translateY(-2px);
  filter:saturate(1.08);
  box-shadow:0 15px 34px rgba(13,159,146,.34),inset 0 1px 0 rgba(255,255,255,.28);
}

.nav-quote-liquid:active{
  transform:translateY(0) scale(.985);
}

.nav-quote-liquid:focus-visible{
  outline:3px solid rgba(18,181,166,.25);
  outline-offset:3px;
}

@keyframes solidLiquidWave{
  0%{transform:translate3d(-3%,0,0) rotate(0deg) scale(1)}
  35%{transform:translate3d(3%,-7%,0) rotate(125deg) scale(1.06)}
  70%{transform:translate3d(-1%,-3%,0) rotate(252deg) scale(1.02)}
  100%{transform:translate3d(-3%,0,0) rotate(360deg) scale(1)}
}

@keyframes solidLiquidShine{
  0%,20%{left:-65%;opacity:0}
  35%{opacity:.72}
  65%{opacity:.42}
  80%,100%{left:145%;opacity:0}
}

@media (prefers-reduced-motion:reduce){
  .nav-quote-liquid::before,
  .nav-quote-liquid::after{animation:none}
  .nav-quote-liquid{transition:none}
}

