html { scroll-behavior: smooth; }
body { background: #100C08; }
::selection { background: #E8A33D; color: #100C08; }

.row::-webkit-scrollbar { display: none; }
.row { -ms-overflow-style: none; scrollbar-width: none; scroll-snap-type: x proximity; }

#ambient {
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(55vw 50vh at 82% -8%, rgba(232,163,61,.18), transparent 60%),
    radial-gradient(45vw 40vh at -5% 25%, rgba(150,90,30,.12), transparent 60%);
}

.reveal { opacity: 0; transform: translateY(20px); transition: opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1); }
.reveal.in { opacity: 1; transform: none; }

.subbar { background: rgba(16,12,8,.72); backdrop-filter: blur(4px); border-radius: 5px; text-shadow: 0 1px 4px rgba(0,0,0,.9); }

.card { transition: transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s; }
.card:hover { transform: scale(1.06); box-shadow: 0 26px 54px -18px rgba(0,0,0,.95); z-index: 5; }
.card img { filter: grayscale(.6) sepia(.15) contrast(1.05); transition: filter .45s; }
.card:hover img { filter: grayscale(0) sepia(0) contrast(1.05); }
.card .reveal-on-hover { opacity: 0; transform: translateY(10px); transition: .35s; }
.card:hover .reveal-on-hover { opacity: 1; transform: none; }

.lcard { transition: transform .3s, border-color .3s, background .3s; }
.lcard:hover { transform: translateY(-4px); border-color: #5a4326; background: #241A12; }

.coll img { filter: grayscale(.5) sepia(.12) contrast(1.05); transition: .45s, transform .5s; }
.coll:hover img { filter: grayscale(0) sepia(0); transform: scale(1.06); }

a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px solid #E8A33D; outline-offset: 3px; border-radius: 6px; }
.arrow { transition: .2s; }
.arrow:hover { background: rgba(0,0,0,.7); transform: scale(1.05); }

[data-lang-en] { display: none; }
html.en [data-lang-tr] { display: none; }
html.en [data-lang-en] { display: inline; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { transition: none; opacity: 1; transform: none; }
  .card, .card img, .coll img { transition: none; }
}
