/* Ulukat Tema · Hakkımızda · v0.1.0 */

/* ── HİKÂYE ── */
.uhk { position: relative; padding: 200px 0 30px; }
.uhk-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: 90px; align-items: start; }

.uhk-baslik { margin-bottom: 26px; text-wrap: balance; }
.uhk-cizgi { display: block; width: 60px; height: 4px; margin: 0 0 38px; background: var(--ul-bronz); transform-origin: 0 50%; }
.ul-js .uhk-cizgi[data-ul-reveal] { opacity: 1; transform: scaleX(0); transition: transform 1.1s var(--ul-ease-cikis) .35s; }
.ul-js .uhk-cizgi[data-ul-reveal].is-in { transform: none; }

.uhk-p { max-width: 62ch; margin: 0 0 22px; color: #c4c4c4; font: 500 18px/1.75 var(--ul-sans2); text-wrap: pretty; }
.uhk-p strong { color: var(--ul-bronz); font-weight: 700; }
.uhk-p a {
  color: var(--ul-fawn); font-weight: 600; text-decoration: underline 1px rgba(219, 166, 110, .35); text-underline-offset: 4px;
  transition: color .3s var(--ul-ease), text-decoration-color .3s var(--ul-ease);
}
.uhk-p a:hover { color: #fff; text-decoration-color: currentColor; }
.uhk-p a:focus-visible { outline: 2px solid var(--ul-gold); outline-offset: 2px; border-radius: 2px; }
.ul-js .uhk-p[data-ul-reveal] {
  filter: blur(6px);
  transition: opacity .9s var(--ul-ease-cikis), transform .9s var(--ul-ease-cikis), filter .9s var(--ul-ease-cikis);
  transition-delay: calc(var(--i, 0) * 90ms);
}
.ul-js .uhk-p[data-ul-reveal].is-in { filter: none; }

.uhk-kurucular { margin-top: 44px; padding-top: 32px; border-top: 1px solid rgba(255, 255, 255, .1); }
.uhk-kurucu-ust { margin: 0 0 16px; color: #a3a3a3; font: 600 15px/1.4 var(--ul-sans2); }
.uhk-medya { position: sticky; top: 140px; }
.uhk-medya-ic { position: relative; padding-bottom: 96px; }
.uhk-foto { position: relative; isolation: isolate; margin: 0; }
.uhk-foto1 { max-width: 470px; margin-left: auto; }
.uhk-maske { position: relative; overflow: hidden; aspect-ratio: 4 / 5; background: #151515; }
.uhk-kay { position: absolute; inset: -12% 0; }
.uhk-kay img { display: block; width: 100%; height: 100%; object-fit: cover; }
.uhk-foto1 img { object-position: 46% 50%; }
.uhk-cerceve { position: absolute; top: 28px; right: -28px; bottom: -28px; left: 28px; z-index: -1; border: 1px solid rgba(219, 166, 110, .42); }
.uhk-foto2 { position: absolute; left: -64px; bottom: 0; z-index: 2; width: 58%; box-shadow: 0 0 0 10px #090909; }
.uhk-foto2 .uhk-maske { aspect-ratio: 4 / 3; }

.ul-js .uhk-foto[data-ul-reveal] { opacity: 1; transform: none; }
.ul-js .uhk-foto[data-ul-reveal] .uhk-maske { clip-path: inset(100% 0 0 0); transition: clip-path 1.4s var(--ul-ease-maske); }
.ul-js .uhk-foto[data-ul-reveal] .uhk-kay img { transform: scale(1.28); transition: transform 2s var(--ul-ease-cikis); }
.ul-js .uhk-foto2[data-ul-reveal] .uhk-maske { clip-path: inset(0 100% 0 0); transition-delay: .35s; }
.ul-js .uhk-foto2[data-ul-reveal] .uhk-kay img { transition-delay: .35s; }
.ul-js .uhk-foto1[data-ul-reveal] .uhk-cerceve { opacity: 0; transform: translate(-28px, -28px); transition: opacity .9s var(--ul-ease) .8s, transform 1.4s var(--ul-ease-cikis) .8s; }
.ul-js .uhk-foto[data-ul-reveal].is-in .uhk-maske { clip-path: inset(0 0 0 0); }
.ul-js .uhk-foto[data-ul-reveal].is-in .uhk-kay img,
.ul-js .uhk-foto1[data-ul-reveal].is-in .uhk-cerceve { opacity: 1; transform: none; }

@media (max-width: 1199px) {
  .uhk-grid { gap: 60px; }
  .uhk-foto2 { left: -40px; }
}
@media (max-width: 991px) {
  .uhk { padding: 120px 0 20px; }
  .uhk-grid { grid-template-columns: 1fr; gap: 70px; }
  .uhk-medya { position: relative; top: auto; }
  .uhk-medya-ic { max-width: 620px; padding: 0 28px 0 0; }
  .uhk-foto1 { max-width: none; margin: 0; }
  .uhk-foto1 .uhk-maske { aspect-ratio: 4 / 3; }
  .uhk-foto2 { position: relative; left: auto; width: 56%; margin: -90px 0 0 auto; }
}
@media (max-width: 575px) {
  .uhk { padding: 90px 0 10px; }
  .uhk-p { font-size: 17px; }
  .uhk-cerceve { top: 16px; right: -16px; bottom: -16px; left: 16px; }
  .uhk-medya-ic { padding-right: 16px; }
  .uhk-foto2 { width: 62%; margin-top: -60px; box-shadow: 0 0 0 6px #090909; }
}

/* ── SAYAÇLAR ── */
.ul-sayac-alan { padding: 10px 0 120px; }
.ul-sayac-alan .usy { margin-top: 0; }

@media (prefers-reduced-motion: reduce) {
  .ul-js .uhk-cizgi[data-ul-reveal],
  .ul-js .uhk-foto[data-ul-reveal] .uhk-kay img,
  .ul-js .uhk-foto1[data-ul-reveal] .uhk-cerceve { transform: none; opacity: 1; }
  .ul-js .uhk-foto[data-ul-reveal] .uhk-maske { clip-path: none; }
  .ul-js .uhk-p[data-ul-reveal] { filter: none; }
}
