/* ==========================================================================
   İDA HALI YIKAMA — ANIMATIONS
   ========================================================================== */

/* Flowing gradient backdrop used behind dark sections */
.flow-gradient{
  position:absolute; inset:-20%; z-index:0; opacity:.4; pointer-events:none;
  background:
    radial-gradient(38% 45% at 15% 25%, rgba(176,138,62,.22), transparent 60%),
    radial-gradient(30% 40% at 85% 70%, rgba(15,90,80,.28), transparent 60%);
  animation:flowmove 18s ease-in-out infinite alternate;
  filter:blur(30px);
}
@keyframes flowmove{
  0%{ transform:translate(0,0) scale(1); }
  100%{ transform:translate(3%,-4%) scale(1.08); }
}

/* Ripple ring used for CTA / interactive hint (host element must already be positioned) */
.ripple::after{
  content:''; position:absolute; inset:0; border-radius:inherit;
  border:1px solid rgba(18,181,201,.5);
  animation:ripple-grow 2.6s var(--ease-out) infinite;
}
@keyframes ripple-grow{
  0%{ transform:scale(1); opacity:.8; }
  100%{ transform:scale(1.35); opacity:0; }
}

/* Micro bubble drift for water themed sections */
.bubble-field{ position:absolute; inset:0; overflow:hidden; z-index:0; pointer-events:none; }
.bubble-field i{
  position:absolute; bottom:-10%; border-radius:50%;
  background:radial-gradient(circle at 30% 30%, rgba(255,255,255,.85), rgba(255,255,255,.05) 70%);
  animation:bubble-rise linear infinite;
  opacity:.35;
}
@keyframes bubble-rise{
  0%{ transform:translateY(0) translateX(0); opacity:0; }
  10%{ opacity:.4; }
  100%{ transform:translateY(-120%) translateX(14px); opacity:0; }
}

/* Counter pop */
@keyframes countpop{ from{ opacity:0; transform:translateY(6px);} to{ opacity:1; transform:none; } }
.stat.is-counted .num{ animation:countpop .5s var(--ease-out); }

/* SVG line draw utility (stroke-dasharray set inline / via JS) */
.line-draw{ stroke-dasharray:1000; stroke-dashoffset:1000; transition:stroke-dashoffset 1.6s var(--ease-out); }
.line-draw.is-drawn{ stroke-dashoffset:0; }

/* Text mask reveal for headings */
.mask-reveal{ overflow:hidden; display:block; }
.mask-reveal span{
  display:block; transform:translateY(110%); transition:transform .9s var(--ease-out);
}
.mask-reveal.is-visible span{ transform:translateY(0); }

/* Image clip reveal */
.clip-reveal{ clip-path:inset(0 0 100% 0); transition:clip-path 1s var(--ease-out); }
.clip-reveal.is-visible{ clip-path:inset(0 0 0% 0); }

/* Soft float loop for icons/badges */
@keyframes float-y{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-8px);} }
.float{ animation:float-y 4.5s ease-in-out infinite; }

/* Magnetic button micro-interaction handled via JS transform; keep smooth easing */
.magnetic{ transition:transform .25s var(--ease-out); }

/* Spin loader (form submit state) */
@keyframes spin{ to{ transform:rotate(360deg); } }
.spinner{ width:16px; height:16px; border-radius:50%; border:2px solid rgba(255,255,255,.35); border-top-color:#fff; animation:spin .7s linear infinite; }

/* ---- Spotlight cursor-glow card (mouse-tracked radial highlight) ----------- */
.spotlight{ position:relative; }
.spotlight::before{
  content:''; position:absolute; inset:0; z-index:1; border-radius:inherit;
  background:radial-gradient(280px circle at var(--sx,50%) var(--sy,50%), rgba(228,208,154,.14), transparent 68%);
  opacity:0; transition:opacity .35s var(--ease-out); pointer-events:none;
}
.spotlight:hover::before{ opacity:1; }
.spotlight-border{ position:relative; }
.spotlight-border::after{
  content:''; position:absolute; inset:0; z-index:1; border-radius:inherit; padding:1px;
  background:radial-gradient(220px circle at var(--sx,50%) var(--sy,50%), rgba(95,225,232,.85), transparent 70%);
  -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  opacity:0; transition:opacity .35s var(--ease-out); pointer-events:none;
}
.spotlight-border:hover::after{ opacity:1; }

/* ---- 3D tilt card (JS sets --tx / --ty rotation degrees) ------------------- */
.tilt-card{
  transform:perspective(900px) rotateX(var(--tx,0deg)) rotateY(var(--ty,0deg)) translateZ(0);
  transition:transform .4s var(--ease-out);
  transform-style:preserve-3d;
}
.tilt-card.is-tilting{ transition:transform .08s linear; }

/* ---- Infinite marquee ticker ------------------------------------------------ */
.marquee{ position:relative; overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); }
.marquee-track{ display:flex; width:max-content; animation:marquee-scroll 26s linear infinite; }
.marquee:hover .marquee-track{ animation-play-state:paused; }
.marquee-track span{
  display:flex; align-items:center; gap:.6rem;
  padding-inline:1.4rem; font-family:var(--font-display); font-weight:700;
  font-size:1rem; letter-spacing:.03em; white-space:nowrap; color:rgba(255,255,255,.5);
}
.marquee-track span::after{ content:'•'; margin-left:1.4rem; color:var(--c-gold-light); }
.marquee-track span b{ color:#fff; font-weight:800; }
@keyframes marquee-scroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ---- Film-grain noise overlay for dark sections ---------------------------- */
.noise-layer{ position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---- Animated conic-gradient glow border (wrap target in .glow-border) ----- */
.glow-border{ position:relative; border-radius:var(--radius-full); isolation:isolate; }
.glow-border::before{
  content:''; position:absolute; inset:-2px; z-index:-1; border-radius:inherit;
  background:conic-gradient(from var(--gb-angle,0deg), var(--c-aqua-deep), var(--c-aqua-light), var(--c-aqua-deep));
  animation:glow-spin 4.5s linear infinite;
  opacity:.45; filter:blur(1.5px);
}
@keyframes glow-spin{ to{ --gb-angle:360deg; } }
@property --gb-angle{ syntax:'<angle>'; inherits:false; initial-value:0deg; }

/* ---- Split-text word reveal (JS wraps words in spans) ---------------------- */
.split-word{ display:inline-block; overflow:hidden; vertical-align:top; }
.split-word > span{
  display:inline-block; transform:translateY(115%) rotate(3deg); opacity:0;
  transition:transform .7s var(--ease-out), opacity .5s var(--ease-out);
  transition-delay:var(--split-delay,0s);
}
.split-word.is-visible > span{ transform:translateY(0) rotate(0deg); opacity:1; }

@media (prefers-reduced-motion: reduce){
  .flow-gradient, .bubble-field i, .ripple::after, .float{ animation:none !important; }
  .marquee-track{ animation:none !important; }
  .glow-border::before{ animation:none !important; }
  .tilt-card{ transform:none !important; }
  .split-word > span{ transform:none !important; opacity:1 !important; transition:none !important; }
}