/* ============================================================
   YAMAN MİMARLIK — animations.css
   Scroll-reveal, SVG line-drawing, custom cursor, keyframes.
   prefers-reduced-motion ile TÜM hareket kapatılır.
   ============================================================ */

/* ---------- Scroll reveal ---------- */
[data-reveal] {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .9s var(--ease-out), transform .9s var(--ease-out);
  will-change: opacity, transform;
}
[data-reveal].revealed { opacity: 1; transform: none; }

/* Kademeli gecikme (inline --d ya da nth ile) */
[data-reveal][style*="--d"] { transition-delay: var(--d); }

/* Maske ile yukarı kayan satır reveal (başlıklar) */
.reveal-line { display: block; overflow: hidden; }
.reveal-line > * {
  display: block;
  transform: translateY(110%);
  transition: transform 1s var(--ease-out);
}
.reveal-line.revealed > * { transform: translateY(0); }

/* ---------- SVG line-drawing ---------- */
.draw path,
.draw line,
.draw polyline,
.draw rect,
.draw circle,
.draw polygon {
  fill: transparent;
  stroke: var(--ink);
  stroke-width: 1.25;
  vector-effect: non-scaling-stroke;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.draw--paper path,
.draw--paper line,
.draw--paper polyline,
.draw--paper rect,
.draw--paper circle,
.draw--paper polygon { stroke: var(--paper); }

/* draw.js dasharray/offset'i JS ile ayarlar; transition burada */
.draw [data-draw] {
  transition: stroke-dashoffset 1.8s var(--ease-out);
}
/* İnce dolgu vurgusu (çizim bitince hafif görünür alan) */
.draw .fill-soft { fill: var(--line-soft); stroke: none; opacity: 0; transition: opacity 1s var(--ease) .8s; }
.draw.is-drawn .fill-soft { opacity: 1; }

/* ---------- Parallax ---------- */
[data-parallax] { will-change: transform; }

/* ---------- Custom cursor ---------- */
.cursor {
  position: fixed; top: 0; left: 0; z-index: 300;
  width: 26px; height: 26px;
  margin: -13px 0 0 -13px;
  pointer-events: none;
  mix-blend-mode: difference;
  opacity: 0;
  transition: opacity .3s var(--ease), width .3s var(--ease), height .3s var(--ease);
}
.cursor::before, .cursor::after {
  content: ""; position: absolute; background: #fff;
}
/* artı (+) işareti */
.cursor::before { left: 50%; top: 0; width: 1px; height: 100%; transform: translateX(-50%); }
.cursor::after  { top: 50%; left: 0; height: 1px; width: 100%; transform: translateY(-50%); }
.cursor.is-active { opacity: 1; }
.cursor.is-hover {
  width: 56px; height: 56px; margin: -28px 0 0 -28px;
}
.cursor.is-hover::before, .cursor.is-hover::after { opacity: .4; }
/* dış halka (hover) */
.cursor__ring {
  position: absolute; inset: 0; border: 1px solid #fff; border-radius: 50%;
  opacity: 0; transform: scale(.4); transition: opacity .3s var(--ease), transform .3s var(--ease);
}
.cursor.is-hover .cursor__ring { opacity: 1; transform: scale(1); }
body.has-cursor, body.has-cursor a, body.has-cursor button { cursor: none; }

/* ---------- Keyframes ---------- */
@keyframes floaty {
  0%,100% { transform: translateY(0); }
  50%     { transform: translateY(-8px); }
}
@keyframes scroll-hint {
  0%   { transform: translateY(0); opacity: 1; }
  70%  { transform: translateY(10px); opacity: 0; }
  100% { transform: translateY(10px); opacity: 0; }
}
@keyframes fade-up {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: none; }
}

/* Hero giriş animasyonu (load) */
.hero__eyebrow { animation: fade-up 1s var(--ease-out) both; }
.hero__title .line { animation: fade-up 1.1s var(--ease-out) both; }
.hero__title .line:nth-child(2) { animation-delay: .12s; }
.hero__title .line:nth-child(3) { animation-delay: .24s; }
.hero__sub { animation: fade-up 1.1s var(--ease-out) .42s both; }
.hero__cta { animation: fade-up 1.1s var(--ease-out) .58s both; }
.hero__meta { animation: fade-up 1.1s var(--ease-out) .7s both; }

.scroll-hint span { animation: scroll-hint 2.2s var(--ease) infinite; }

/* ============================================================
   REDUCED MOTION — her şeyi durdur
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
  [data-reveal] { opacity: 1 !important; transform: none !important; }
  .reveal-line > * { transform: none !important; }
  .draw [data-draw] { stroke-dashoffset: 0 !important; }
  .cursor { display: none !important; }
  body.has-cursor, body.has-cursor a, body.has-cursor button { cursor: auto !important; }
}
