/* Titrek Toys tasarım taslakları: üç yönün paylaştığı temel stiller */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, h4, p, ul, ol, figure, blockquote { margin: 0; }
ul, ol { padding: 0; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
input, textarea, select { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--focus, currentColor); outline-offset: 3px; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
  position: fixed; left: 1rem; top: -4rem; z-index: 2000;
  padding: .6rem 1rem; background: #fff; color: #000; border-radius: 6px;
}
.skip-link:focus { top: 1rem; }

/* SVG çizim deposu: display:none kullanılmaz, yoksa gradyanlar çizilmez */
.tt-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

/* Logo fotoğrafından kırpılmış alanlar (gerçek vektör logo gelene kadar) */
.tt-logo {
  aspect-ratio: 4 / 5;
  background: url(../../logo.jpeg) 50.1% 34% / 207.5% auto no-repeat;
  -webkit-mask-image:
    linear-gradient(to right, transparent, #000 10%, #000 90%, transparent),
    linear-gradient(to bottom, transparent, #000 6%, #000 92%, transparent);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(to right, transparent, #000 10%, #000 90%, transparent),
    linear-gradient(to bottom, transparent, #000 6%, #000 92%, transparent);
  mask-composite: intersect;
}
.tt-emblem {
  aspect-ratio: .85;
  background: url(../../logo.jpeg) 50.3% 20.2% / 351.5% auto no-repeat;
}

/* Giriş animasyonu iskeleti; görünümü her tasarım kendi belirler */
html.intro-playing { overflow: hidden; }
.intro {
  position: fixed; inset: 0; z-index: 1000;
  display: grid; place-items: center;
  /* JS çalışmazsa perde kendiliğinden kalkar */
  animation: tt-failsafe 0s 4.5s forwards;
}
.intro-seen .intro { display: none; }
.intro.is-leaving { pointer-events: none; }
.intro__skip {
  position: absolute;
  right: max(1.25rem, env(safe-area-inset-right));
  bottom: max(1.25rem, env(safe-area-inset-bottom));
  padding: .55rem 1.1rem; border-radius: 999px; font-size: .875rem;
}
@keyframes tt-failsafe { to { visibility: hidden; opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}