/* ==========================================================================
   PERA FESTIVAL — BASE
   reset · tipografi · layout primitifleri · yardımcı sınıflar
   Bootstrap 5 altyapı olarak yüklenir; bu dosya görsel dili tamamen devralır.
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--font-ui);
  font-size: var(--fs-body);
  font-weight: var(--fw-body, 400);
  line-height: 1.6;
  color: var(--text-primary);
  background: var(--surface-page);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-synthesis-weight: none;
}

img, picture, svg, video { display: block; max-width: 100%; }
img { height: auto; }

h1, h2, h3, h4, h5, h6 { margin: 0 0 var(--space-3); font-weight: var(--fw-heading, 650); line-height: 1.2; letter-spacing: -.02em; }
p { margin: 0 0 var(--space-4); }
ul, ol { margin: 0 0 var(--space-4); padding-left: 1.25em; }
a { color: inherit; text-decoration: none; }

button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }

hr { border: 0; border-top: 1px solid var(--ink-150); margin: var(--space-8) 0; }

::selection { background: var(--brass-200); color: var(--ink-900); }

:focus-visible { outline: none; box-shadow: var(--ring); border-radius: var(--radius-xs); }

/* Ekran okuyucu */
.visually-hidden,
.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: absolute; left: var(--space-4); top: -60px; z-index: var(--z-system);
  background: var(--chip-bg); color: #fff; padding: var(--space-3) var(--space-5);
  border-radius: var(--radius-sm); transition: top var(--dur-base) var(--ease-out);
}
.skip-link:focus { top: var(--space-4); }

/* ---------- TİPOGRAFİ SINIFLARI ---------- */
.display-xl { font-family: var(--font-display); font-size: var(--fs-display-xl); font-weight: 600; line-height: 1.02; letter-spacing: -.03em; }
.display-lg { font-family: var(--font-display); font-size: var(--fs-display-lg); font-weight: 600; line-height: 1.06; letter-spacing: -.025em; }
.display-md { font-family: var(--font-display); font-size: var(--fs-display-md); font-weight: 600; line-height: 1.12; letter-spacing: -.02em; }
.t-h1 { font-size: var(--fs-h1); font-weight: 650; letter-spacing: -.02em; line-height: 1.15; }
.t-h2 { font-size: var(--fs-h2); font-weight: 600; letter-spacing: -.015em; line-height: 1.22; }
.t-h3 { font-size: var(--fs-h3); font-weight: 600; letter-spacing: -.01em; line-height: 1.3; }
.t-h4 { font-size: var(--fs-h4); font-weight: 600; line-height: 1.35; }
.t-lg { font-size: var(--fs-body-lg); line-height: 1.6; }
.t-sm { font-size: var(--fs-body-sm); line-height: 1.55; }
.t-caption { font-size: var(--fs-caption); line-height: 1.5; }
.t-micro { font-size: var(--fs-micro); font-weight: 500; line-height: 1.4; letter-spacing: .06em; }
.t-num { font-variant-numeric: tabular-nums; }
.t-code { font-variant-numeric: tabular-nums; letter-spacing: .04em; }
.t-muted { color: var(--text-secondary); }
.t-dim { color: var(--text-muted); }
/* FINAL AUDIT §38 — hata/uyarı metni RENKLE de ayrışır (yalnız metinle değil).
   Bu iki yardımcı sınıf arayüzde kullanılıyordu ama tanımsızdı: nötr görünüyordu. */
.t-danger { color: var(--danger-600); }
.t-warning { color: var(--warning-700); }
.eyebrow {
  font-size: var(--fs-micro); font-weight: 600; letter-spacing: .16em;
  color: var(--eyebrow-fg, var(--color-secondary, var(--brass-500))); display: inline-flex; align-items: center; gap: var(--space-2);
}
.eyebrow::before { content: ""; width: 24px; height: 1px; background: currentColor; opacity: .7; }
.eyebrow.no-rule::before { display: none; }

.prose { max-width: var(--w-prose); }
.prose p { color: var(--text-secondary); }

/* ---------- LAYOUT ---------- */
.wrap { width: 100%; max-width: var(--w-wide); margin-inline: auto; padding-inline: var(--space-container, var(--space-4)); }
@media (min-width: 576px) { .wrap { padding-inline: var(--space-6); } }
@media (min-width: 992px) { .wrap { padding-inline: var(--space-8); } }
.wrap-narrow { max-width: var(--w-narrow); }
.wrap-form { max-width: var(--w-form); }

.section { padding-block: var(--space-section, clamp(3rem, 2rem + 5vw, 6rem)); }
.section-sm { padding-block: clamp(2rem, 1.5rem + 3vw, 3.5rem); }
.section-alt { background: var(--surface-2); }
.section-ink { background: var(--ink-950); color: #fff; }
.section-ink .t-muted { color: rgba(255,255,255,.62); }

.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-6); margin-bottom: var(--space-8); flex-wrap: wrap; }
.section-head h2 { margin-bottom: var(--space-2); }
.section-head .lead { color: var(--text-secondary); margin: 0; max-width: 56ch; }

.grid { display: grid; gap: var(--space-6); }
.g-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
.g-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.g-4 { grid-template-columns: repeat(4, minmax(0,1fr)); }
.g-5 { grid-template-columns: repeat(5, minmax(0,1fr)); }
@media (max-width: 991px) { .g-3, .g-4, .g-5 { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 575px) {
  .g-2, .g-3, .g-4, .g-5 { grid-template-columns: 1fr; }
  .g-2.keep-2, .g-4.keep-2, .g-5.keep-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

.stack { display: flex; flex-direction: column; }
.stack-2 { gap: var(--space-2); } .stack-3 { gap: var(--space-element, var(--space-3)); }
.stack-4 { gap: var(--space-4); } .stack-6 { gap: var(--space-6); }
.row-flex { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
.spread { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.mt-0{margin-top:0}.mb-0{margin-bottom:0}.mb-2{margin-bottom:var(--space-2)}.mb-3{margin-bottom:var(--space-3)}
.mb-4{margin-bottom:var(--space-4)}.mb-6{margin-bottom:var(--space-6)}.mb-8{margin-bottom:var(--space-8)}
.mt-4{margin-top:var(--space-4)}.mt-6{margin-top:var(--space-6)}.mt-8{margin-top:var(--space-8)}
.text-center { text-align: center; }
.hide { display: none !important; }
@media (max-width: 991px) { .hide-md { display: none !important; } }
@media (max-width: 575px) { .hide-sm { display: none !important; } }
@media (min-width: 992px) { .only-md { display: none !important; } }

/* ---------- SCROLL REVEAL ---------- */
.reveal { opacity: 0; transform: translateY(16px); transition: opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out); }
.reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; } }
/* PF-046 — JS yoksa/çalışmadıysa içerik ASLA gizli kalmaz (html.js, <head>'deki satır içi betikle eklenir). */
html:not(.js) .reveal { opacity: 1; transform: none; }

/* Yatay kaydırma ipucu */
.scroll-x { overflow-x: auto; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
.scroll-x::-webkit-scrollbar { height: 8px; }
.scroll-x::-webkit-scrollbar-thumb { background: var(--ink-200); border-radius: var(--radius-full); }
.snap-x { scroll-snap-type: x mandatory; }
.snap-x > * { scroll-snap-align: start; }

/* Yazdırma */
@media print {
  .site-header, .site-footer, .no-print { display: none !important; }
  body { background: var(--surface); color: #000; }
}

/* [hidden] her zaman gizler — display kuralları geçersiz kılmasın */
[hidden] { display: none !important; }

/* Şartname penceresinde etkinlik adı (Rev.7) */
.doc-meta .doc-ev { flex-basis: 100%; font-size: var(--fs-body); }