/* ==========================================================================
   FIORA REAXION — TEMEL (sifirlama + tipografi + duzen kabuklari)
   Renk yazilmaz; her deger tokens.css'ten gelir.
   ========================================================================== */

/* ---------------------------------------------------------------- sifirlama */

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

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: 6rem;   /* sabit baslik yuksekligi kadar */
}

body {
  margin: 0;
  background: var(--fr-bg);
  color: var(--fr-text);
  font-family: var(--fr-font-sans);
  font-size: var(--fr-fs-md);
  font-weight: var(--fr-fw-regular);
  line-height: var(--fr-lh-normal);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 { margin: 0 0 var(--fr-sp-4); }
p, ul, ol, figure, blockquote, table { margin: 0 0 var(--fr-sp-4); }
:where(p, ul, ol):last-child { margin-bottom: 0; }

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

button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }

ul, ol { padding-left: 1.25rem; }
li + li { margin-top: var(--fr-sp-2); }

hr {
  border: 0;
  border-top: 1px solid var(--fr-line);
  margin: var(--fr-sp-7) 0;
}

/* ---------------------------------------------------------------- baslıklar */

.fr-h1, h1 {
  font-size: var(--fr-fs-3xl);
  line-height: var(--fr-lh-tight);
  letter-spacing: var(--fr-ls-tight);
  font-weight: var(--fr-fw-semibold);
}

.fr-h2, h2 {
  font-size: var(--fr-fs-2xl);
  line-height: var(--fr-lh-snug);
  letter-spacing: var(--fr-ls-tight);
  font-weight: var(--fr-fw-semibold);
}

.fr-h3, h3 {
  font-size: var(--fr-fs-xl);
  line-height: var(--fr-lh-snug);
  font-weight: var(--fr-fw-semibold);
}

.fr-h4, h4 {
  font-size: var(--fr-fs-lg);
  line-height: var(--fr-lh-snug);
  font-weight: var(--fr-fw-medium);
}

h5, h6 {
  font-size: var(--fr-fs-base);
  font-weight: var(--fr-fw-semibold);
}

/* Referansin imzasi: iki satirli baslik — ust satir ince, alt satir kalin */
.fr-title { margin: 0 0 var(--fr-sp-5); }

.fr-title__lead {
  display: block;
  font-size: var(--fr-fs-xl);
  font-weight: var(--fr-fw-light);
  line-height: var(--fr-lh-snug);
  letter-spacing: var(--fr-ls-tight);
  opacity: .92;
}

.fr-title__main {
  display: block;
  font-size: var(--fr-fs-2xl);
  font-weight: var(--fr-fw-semibold);
  line-height: var(--fr-lh-snug);
  letter-spacing: var(--fr-ls-tight);
}

/* Bolum ustu kucuk etiket — KUCUK BASLIK */
.fr-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--fr-sp-2);
  margin: 0 0 var(--fr-sp-3);
  font-size: var(--fr-fs-xs);
  font-weight: var(--fr-fw-semibold);
  letter-spacing: var(--fr-ls-caps);
  text-transform: uppercase;
  color: var(--fr-accent);
}

.fr-eyebrow::before {
  content: "";
  width: 1.75rem;
  height: 1px;
  background: currentColor;
  opacity: .6;
}

.fr-lede {
  font-size: var(--fr-fs-lg);
  line-height: var(--fr-lh-loose);
  color: var(--fr-text-soft);
  max-width: var(--fr-container-text);
}

/* ---------------------------------------------------------------- baglantı */

a {
  color: var(--fr-sand-400);
  text-decoration-thickness: 1px;
  text-underline-offset: .18em;
  transition: color var(--fr-t-fast);
}
a:hover { color: var(--fr-white); }

/* ---------------------------------------------------------------- duzen */

.fr-container {
  width: 100%;
  max-width: var(--fr-container);
  margin-inline: auto;
  padding-inline: var(--fr-gutter);
}

.fr-container--wide { max-width: var(--fr-container-wide); }
.fr-container--text { max-width: var(--fr-container-text); }

.fr-section { padding-block: var(--fr-section-y); }
.fr-section--tight { padding-block: var(--fr-section-y-sm); }
.fr-section--flush-top { padding-top: 0; }

/* Bolum zemin varyantlari */
.fr-section--soft { background: var(--fr-bg-soft); }
.fr-section--sand { background: var(--fr-bg-sand); }

.fr-section--dark {
  background: var(--fr-bg-dark);
  color: var(--fr-text-on-dark);
}
.fr-section--dark .fr-eyebrow { color: var(--fr-accent-soft); }
.fr-section--dark .fr-lede    { color: var(--fr-text-on-dark-soft); }
/* Sadece METIN baglantilari renklenir; butonlar HARIC tutulur —
   yoksa bu kural .fr-btn'in siyah yazisini ezip gold zeminde
   okunmaz hale getiriyordu. */
.fr-section--dark a:not(.fr-btn):not(.fr-float__btn) { color: var(--fr-accent-soft); }

.fr-section--grad {
  background: var(--fr-grad-dark);
  color: var(--fr-text-on-dark);
}
.fr-section--grad .fr-eyebrow { color: var(--fr-accent-soft); }
.fr-section--grad .fr-lede    { color: var(--fr-text-on-dark-soft); }

/* Bolum basligi blogu */
.fr-section__head {
  max-width: var(--fr-container-text);
  margin-inline: auto;
  margin-bottom: var(--fr-sp-8);
  text-align: center;
}
.fr-section__head--left {
  margin-inline: 0;
  text-align: left;
}
.fr-section__head .fr-eyebrow { justify-content: center; }
.fr-section__head--left .fr-eyebrow { justify-content: flex-start; }

/* Izgara — otomatik sarma, sutun sayisi degiskenle */
.fr-grid {
  display: grid;
  gap: var(--fr-sp-5);
  grid-template-columns: repeat(var(--fr-cols, 1), minmax(0, 1fr));
}

@media (min-width: 640px)  { .fr-grid { --fr-cols: var(--fr-cols-sm, 2); } }
@media (min-width: 960px)  { .fr-grid { --fr-cols: var(--fr-cols-md, 3); } }
@media (min-width: 1200px) { .fr-grid { --fr-cols: var(--fr-cols-lg, var(--fr-cols-md, 3)); } }

/* Iki sutunlu metin + gorsel duzeni */
.fr-split {
  display: grid;
  gap: clamp(var(--fr-sp-6), 4vw, var(--fr-sp-9));
  align-items: center;
}
@media (min-width: 960px) {
  .fr-split { grid-template-columns: 1fr 1fr; }
  .fr-split--text-wide { grid-template-columns: 1.15fr 1fr; }
  .fr-split--media-wide { grid-template-columns: 1fr 1.15fr; }
  .fr-split--flip > :first-child { order: 2; }
}

.fr-stack > * + * { margin-top: var(--fr-sp-4); }
.fr-stack--lg > * + * { margin-top: var(--fr-sp-6); }

/* ---------------------------------------------------------------- yardımcı */

.fr-center { text-align: center; }
.fr-nowrap { white-space: nowrap; }
.fr-accent { color: var(--fr-accent); }
.fr-muted  { color: var(--fr-text-soft); }

/* Ekran okuyucuya acik, gorsel olarak gizli */
.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.screen-reader-text:focus {
  position: static !important;
  width: auto; height: auto;
  clip: auto; clip-path: none;
  margin: 0; padding: var(--fr-sp-3) var(--fr-sp-4);
  background: var(--fr-bg-dark);
  color: var(--fr-text-on-dark);
  border-radius: var(--fr-r-sm);
}

/* Klavye odagi — her zaman gorunur */
:focus-visible {
  outline: 2px solid var(--fr-accent);
  outline-offset: 3px;
  border-radius: var(--fr-r-sm);
}

/* Iceriğe atla baglantisi */
.fr-skip-link {
  position: absolute;
  top: var(--fr-sp-3);
  left: var(--fr-sp-3);
  z-index: var(--fr-z-modal);
  transform: translateY(-200%);
  padding: var(--fr-sp-3) var(--fr-sp-5);
  background: var(--fr-bg-dark);
  color: var(--fr-text-on-dark);
  border-radius: var(--fr-r-sm);
  text-decoration: none;
  transition: transform var(--fr-t-base);
}
.fr-skip-link:focus { transform: translateY(0); }

/* Gorsel oran kutulari */
.fr-ratio { position: relative; overflow: hidden; border-radius: var(--fr-r-lg); }
.fr-ratio > img,
.fr-ratio > video,
.fr-ratio > iframe {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}
.fr-ratio--square  { aspect-ratio: 1 / 1; }
.fr-ratio--4x3     { aspect-ratio: 4 / 3; }
.fr-ratio--3x4     { aspect-ratio: 3 / 4; }
.fr-ratio--16x9    { aspect-ratio: 16 / 9; }
.fr-ratio--portrait { aspect-ratio: 4 / 5; }

/* Gorsel yoksa gosterilen yer tutucu */
.fr-placeholder {
  display: grid;
  place-items: center;
  background: var(--fr-grad-sand);
  color: var(--fr-navy-900);
  font-size: var(--fr-fs-xs);
  font-weight: var(--fr-fw-medium);
  letter-spacing: var(--fr-ls-wide);
  text-transform: uppercase;
  text-align: center;
  padding: var(--fr-sp-4);
  min-height: 10rem;
}

/* Yazi akisi (WordPress editor ciktisi) */
.fr-prose { max-width: var(--fr-container-text); }
.fr-prose > * + * { margin-top: var(--fr-sp-5); }
.fr-prose h2 { margin-top: var(--fr-sp-8); }
.fr-prose h3 { margin-top: var(--fr-sp-7); }
.fr-prose img { border-radius: var(--fr-r-lg); }
.fr-prose blockquote {
  margin: 0;
  padding: var(--fr-sp-5) var(--fr-sp-6);
  border-left: 3px solid var(--fr-accent);
  background: var(--fr-bg-soft);
  border-radius: 0 var(--fr-r-md) var(--fr-r-md) 0;
  font-size: var(--fr-fs-lg);
}
.fr-prose table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--fr-fs-sm);
}
.fr-prose th, .fr-prose td {
  padding: var(--fr-sp-3) var(--fr-sp-4);
  border-bottom: 1px solid var(--fr-line);
  text-align: left;
}
.fr-prose th {
  background: var(--fr-bg-soft);
  font-weight: var(--fr-fw-semibold);
}

/* Genis icerik yatay kaydirilir, sayfa govdesi asla kaymaz */
.fr-scroll-x {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
