/* =============================================================================
   Biosmyrna — Canlılık katmanı (2026-09-22)

   Şirket: "Tasarımımız ruhsuz duruyor. Ne bir efekt, ne de başka bir şey var."
   Canlılık Kataloğu'ndan (20 efekt) şirketin onayladıkları buradadır.
   Numara = katalogdaki numara. Kayıt: PHASE_7_KNOWN_ISSUES_V1.md §34.

   🔴 Kurallar (MOTION_DIRECTION §3 · LAYOUT_SYSTEM §9):
      · Hareket içeriği geciktirmez; desteklemeyen tarayıcıda sayfa sade
        hâliyle, eksiksiz görünür (hepsi @supports arkasında).
      · prefers-reduced-motion açıkken hiçbir şey hareket etmez.
      · Kaydırma ele geçirilmez; yalnızca kaydırmaya EŞLİK edilir.
      · Yalnızca transform / opacity / clip-path canlandırılır.
      · Yön-bağımsız: Arapçada perde ve dolgu ters yönden gelir.
   ============================================================================= */

/* ─────────────────────────────────────────────────────────────────────────────
   Doku token'ları (14) — tarayıcının çizdiği gren; dosya indirilmez.
   Açık temada koyu, koyu temada açık zerre. Çok düşük alfa: okunurluğa
   dokunmaz, yalnızca düz rengin "dijital" soğukluğunu kırar.
   ───────────────────────────────────────────────────────────────────────────── */

:root {
	--grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .25  0 0 0 0 .24  0 0 0 0 .14  0 0 0 .16 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
	--grain-light: radial-gradient(120% 90% at 15% 0%, rgba(255, 255, 255, 0.5), transparent 55%);
	--soft-heading: var(--link);
}
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {
		--grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .92  0 0 0 0 .95  0 0 0 0 .9  0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
		--grain-light: radial-gradient(120% 90% at 15% 0%, rgba(124, 196, 155, 0.06), transparent 55%);
	}
}
:root[data-theme="dark"] {
	--grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .92  0 0 0 0 .95  0 0 0 0 .9  0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
	--grain-light: radial-gradient(120% 90% at 15% 0%, rgba(124, 196, 155, 0.06), transparent 55%);
}

/* =============================================================================
   14 · GRENLİ KÂĞIT DOKUSU — parşömen zeminler
   Zemin rengi yerinde kalır; doku ve ışık onun ÜSTÜNE katmanlanır.
   ============================================================================= */

.page-head,
.quote-card,
.featured,
.stop--warm,
.content-flow .block--band {
	background-image: var(--grain), var(--grain-light);
	background-size: 240px 240px, 100% 100%;
}

/* =============================================================================
   17 · KOYU BANTTA YUMUŞAK IŞIMA — yalnızca ana sayfa kapanışı
   🔄 H6 "otomatik hareket eden içerik yok" bu dekoratif katman için şirket
      kararıyla kaldırıldı (2026-09-22, §34). İçerik hareket etmez.
   ============================================================================= */

.closure {
	position: relative;
	isolation: isolate;
	/* 2026-09-28 · hidden → clip. `hidden` bölümü kaydırma kabı yapıyordu;
	   içindeki view() zaman çizelgeleri (zemin yakınlaşması, sertifika
	   halkaları) kaymayan bu kaba bağlanıp yerinde takılıyordu. */
	overflow: hidden;
	overflow: clip;
	background-image: var(--grain);
	background-size: 240px 240px;
}
.closure::before {
	content: "";
	position: absolute;
	inset: -25%;
	z-index: -1;
	background:
		radial-gradient(32% 42% at 30% 38%, rgba(124, 196, 155, 0.24), transparent 70%),
		radial-gradient(28% 38% at 72% 66%, rgba(176, 164, 96, 0.16), transparent 70%);
	pointer-events: none;
}
/* 17b · dolaşan ışık — çok yavaş, yalnızca transform (şirket kararı 2026-09-22) */
@media (prefers-reduced-motion: no-preference) {
	.closure::before { animation: bio-drift 26s ease-in-out infinite alternate; }
}
@keyframes bio-drift {
	0%   { transform: translate(-7%, -5%) rotate(0deg); }
	50%  { transform: translate(5%, 3%) rotate(6deg); }
	100% { transform: translate(8%, -4%) rotate(-4deg); }
}

/* =============================================================================
   KAPANIŞ BANDI — ZEMİN GÖRSELİ (şirket isteği, 2026-09-22)
   Görsel (closure_image) varsa: yeşil bant rengi, gren ve dolaşan ışık
   KALKAR; görselin üstünde %50 koyu, renksiz geçiş durur. Görsel yoksa
   bant eskisi gibi yeşildir.
   ============================================================================= */

.closure--media { background-color: var(--ink-950, #0E1512); background-image: none; }
.closure--media::before { display: none; }
.closure__media { position: absolute; inset: 0; z-index: -2; }
.closure__media picture { display: block; block-size: 100%; }
.closure__media img { inline-size: 100%; block-size: 100%; object-fit: cover; }
.closure--media::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(180deg, rgba(6, 8, 7, 0.40) 0%, rgba(6, 8, 7, 0.50) 50%, rgba(6, 8, 7, 0.60) 100%);
	pointer-events: none;
}
.closure--media .closure__title,
.closure--media .closure__body,
.closure--media .verification__line { text-shadow: 0 1px 12px rgba(0, 0, 0, 0.35); }
.verification__button { margin-block-start: var(--space-3); }


/* =============================================================================
   19 · İKİ TONLU BAŞLIK — ikinci cümle ikinci tonda
   Sunucu tarafı: bioTwoTone() başlığı ilk cümle sonundan böler.
   🔴 Lora italik yüklü değil; sahte italik yerine ağırlık + ton farkı.
   ============================================================================= */

.t-soft { font-weight: 400; color: var(--soft-heading); }
.band .t-soft,
.closure .t-soft { color: var(--band-accent); }
.hero .t-soft { color: color-mix(in srgb, var(--white) 78%, var(--primary-300)); }

/* =============================================================================
   15 · KAYDIRINCA BUZLU CAM MENÜ
   Sayfa başında şeffaf durum (ana sayfa) korunur; onun dışında header
   yarı saydam zemin + bulanıklık. Desteklemeyen tarayıcıda opak kalır.
   ============================================================================= */

@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.header:not(.is-top) {
		background: color-mix(in srgb, var(--surface) 82%, transparent);
		-webkit-backdrop-filter: blur(14px) saturate(1.3);
		backdrop-filter: blur(14px) saturate(1.3);
	}
}

/* =============================================================================
   09 · KART ÜSTÜNE GELME — yükselme, derin gölge, görsel yakınlaşması
   MOTION_DIRECTION M8/M9. Klavye odağında da aynısı. Dokunmatikte yok.
   ============================================================================= */

.card__media { overflow: hidden; }
.card__img { transition: transform 600ms var(--motion-ease-out); }

@media (hover: hover) {
	.card { transition: transform 300ms var(--motion-ease-out), border-color var(--motion-fast) var(--motion-ease), box-shadow 300ms var(--motion-ease-out); }
	.card:not(.card--tier2):hover,
	.card:not(.card--tier2):focus-within { transform: translateY(-4px); box-shadow: var(--elev-2); }
	.card__link:hover .card__img,
	.card__link:focus-visible .card__img { transform: scale(1.05); }
}

/* Ok ileri itilir — tüm "ok bağlantıları" */
.arrow-link .icon { transition: transform 300ms var(--motion-ease-out); }
.arrow-link:hover .icon,
.arrow-link:focus-visible .icon { transform: translateX(5px); }
[dir="rtl"] .arrow-link:hover .icon--directional,
[dir="rtl"] .arrow-link:focus-visible .icon--directional { transform: scaleX(-1) translateX(5px); }

/* =============================================================================
   10 · CANLI BUTONLAR — dolgu kayması, basınca içe çökme
   Hover rengi artık kayan katmandan gelir; zemin değişmez.
   ============================================================================= */

.btn { position: relative; isolation: isolate; overflow: hidden; transition: color var(--motion-fast) var(--motion-ease), border-color var(--motion-fast) var(--motion-ease), transform var(--motion-fast) var(--motion-ease); }
.btn::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	transform: translateX(-101%);
	transition: transform 420ms cubic-bezier(0.7, 0, 0.2, 1);
	pointer-events: none;
}
[dir="rtl"] .btn::before { transform: translateX(101%); }
.btn:hover::before,
.btn:focus-visible::before { transform: none; }
.btn:active { transform: scale(0.97); }

.btn--primary::before { background: var(--action-primary-hover); }
.btn--primary:hover { background: var(--action-primary-bg); }

/* İkincil: zemin aşağıdan dolar */
.btn--secondary::before,
.btn--band-secondary::before { transform: scaleY(0); transform-origin: bottom; }
[dir="rtl"] .btn--secondary::before,
[dir="rtl"] .btn--band-secondary::before { transform: scaleY(0); }
.btn--secondary:hover::before,
.btn--secondary:focus-visible::before,
.btn--band-secondary:hover::before,
.btn--band-secondary:focus-visible::before { transform: none; }
.btn--secondary::before { background: var(--action-soft-bg); }
.btn--secondary:hover { background: transparent; }
.btn--band-secondary::before { background: rgba(124, 196, 155, 0.14); }
/* Hero fotoğrafı üstünde beyaz yazılı ikincil buton — açık yeşil dolgu
   beyaz yazıyı okunmaz yapıyordu (şirket bildirimi 2026-09-22). */
.hero__actions .btn--secondary::before { background: rgba(255, 255, 255, 0.16); }
.hero__actions .btn--secondary:hover { background: transparent; }
.btn--band-secondary:hover { background: transparent; }

.btn--band-primary::before { background: var(--accent-200); }
.btn--band-primary:hover { background: var(--accent-400); border-color: var(--accent-200); }

.btn[disabled]::before,
.btn[aria-disabled="true"]::before { display: none; }

/* =============================================================================
   13 · ÇİZİLEREK GELEN BAĞLANTI ÇİZGİSİ — metin içi bağlantılar
   🔴 WCAG 1.4.1: bağlantı yalnızca renkle ayırt edilmez — ince, soluk
      alt çizgi HEP durur; üstüne gelince tam renkli çizgi soldan çizilir.
   ============================================================================= */

.rich a:not(.btn):not(.arrow-link),
.footer a:not(.btn):not(.arrow-link):not(.icon-btn) {
	text-decoration-line: underline;
	text-decoration-color: color-mix(in srgb, currentColor 35%, transparent);
	background: linear-gradient(currentColor, currentColor) no-repeat 0 100% / 0 1.5px;
	transition: background-size 420ms var(--motion-ease-out), text-decoration-color var(--motion-fast) var(--motion-ease);
}
[dir="rtl"] .rich a:not(.btn):not(.arrow-link),
[dir="rtl"] .footer a:not(.btn):not(.arrow-link):not(.icon-btn) { background-position: 100% 100%; }
.rich a:not(.btn):not(.arrow-link):hover,
.rich a:not(.btn):not(.arrow-link):focus-visible,
.footer a:not(.btn):not(.arrow-link):not(.icon-btn):hover,
.footer a:not(.btn):not(.arrow-link):not(.icon-btn):focus-visible {
	text-decoration-color: transparent;
	background-size: 100% 1.5px;
}

/* =============================================================================
   12 · YUMUŞAK AÇILAN SSS VE KANIT KATMANLARI
   `::details-content` destekleyen tarayıcıda yükseklik kayarak açılır;
   desteklemeyende eskisi gibi anında açılır.
   ============================================================================= */

:root { interpolate-size: allow-keywords; }

.accordion__item::details-content,
.evidence::details-content {
	block-size: 0;
	overflow: clip;
	transition: block-size 380ms var(--motion-ease-out), content-visibility 380ms allow-discrete;
}
.accordion__item[open]::details-content,
.evidence[open]::details-content { block-size: auto; }

.accordion__sign .icon { transition: transform 300ms var(--motion-ease-out); }
.accordion__item[open] .accordion__sign .icon { transform: rotate(180deg); }

/* =============================================================================
   16 · YAPRAK BİÇİMLİ GÖRSEL — yalnızca Bioyem vurgu görselleri
   Logodaki yaprak motifine akraba. Üstüne gelince yaprak yön değiştirir.
   ============================================================================= */

.featured__media img,
.tpl-bioyem-group .intro-split__media img {
	border-radius: 38% 6px 38% 6px / 30% 6px 30% 6px;
	transition: border-radius 700ms var(--motion-ease-out);
}
[dir="rtl"] .featured__media img,
[dir="rtl"] .tpl-bioyem-group .intro-split__media img { border-radius: 6px 38% 6px 38% / 6px 30% 6px 30%; }
@media (hover: hover) {
	.featured:hover .featured__media img { border-radius: 6px 38% 6px 38% / 6px 30% 6px 30%; }
	[dir="rtl"] .featured:hover .featured__media img { border-radius: 38% 6px 38% 6px / 30% 6px 30% 6px; }
}

/* =============================================================================
   18 · BENTO IZGARA — kategori kartları (ana sayfa katalog · Organik Ürünler)
   İlk kategori büyük kutu; taksonomi SIRASI değişmez (L5) — yalnız boyut.
   🔄 2026-09-22 · Görselin üstündeki yeşil geçiş örtüsü şirket kararıyla
      kaldırıldı ("bütün görselliği bozmuş"). Görsel kendi renginde durur,
      başlık altındaki kart alanındadır — sitedeki diğer kartlarla aynı dil.
   ============================================================================= */

.grid-cards--bento {
	grid-auto-rows: 240px;
	grid-auto-flow: row dense;
}
.grid-cards--bento > :first-child { grid-column: span 2; }
.grid-cards--bento > :last-child:nth-child(even) { grid-column: span 2; }
@media (min-width: 900px) {
	.grid-cards--bento { grid-auto-rows: clamp(250px, 21vw, 310px); }
	.grid-cards--bento > :first-child { grid-column: span 2; grid-row: span 2; }
	.grid-cards--bento > :last-child:nth-child(even) { grid-column: auto; }
}

.grid-cards--bento .card { border-radius: var(--radius-lg); }
.grid-cards--bento .card__link { min-block-size: 0; }
.grid-cards--bento .card__media {
	position: relative;
	flex: 1 1 auto;
	min-block-size: 0;
	aspect-ratio: auto;
}
.grid-cards--bento .card__media picture { display: block; block-size: 100%; }
.grid-cards--bento .card__media img,
.grid-cards--bento .card__media .ph { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; object-fit: cover; aspect-ratio: auto; }
.grid-cards--bento > :not(:first-child) .card__summary { display: none; }
@media (min-width: 900px) {
	.grid-cards--bento > :first-child .card__title { font-size: var(--text-h3, 26px); }
}

/* =============================================================================
   06 · OKUMA İLERLEME ÇİZGİSİ — Bilgi Merkezi yazıları (MOTION_DIRECTION M11)
   Sayfanın kendi kaydırmasına bağlı; JavaScript yok.
   ============================================================================= */

.read-progress { display: none; }
/* 2026-10-01 · GSAP ilerletir (scripts/motion-site.js) — her tarayıcı */
html.has-gsap .read-progress {
	display: block; position: fixed; inset-block-start: 0; inset-inline: 0; z-index: 95;
	block-size: 3px; background: var(--link); transform-origin: 0 50%; transform: scaleX(0); pointer-events: none;
}
html.has-gsap[dir="rtl"] .read-progress { transform-origin: 100% 50%; }
@keyframes bio-grow { to { transform: scaleX(1); } }

/* =============================================================================
   01 · KAYDIRINCA BELİRME · 03 · PERDE AÇILIŞI · 07 · YAPIŞKAN HİKÂYE
   Kaydırmaya bağlı (animation-timeline: view()). Görünüm alanında zaten
   duran öğe hareket etmez — ilk ekran hep hazırdır (H2, H7).
   ============================================================================= */


@keyframes bio-rise {
	from { opacity: 0; transform: translateY(28px); }
	to   { opacity: 1; transform: none; }
}
@keyframes bio-curtain {
	from { clip-path: inset(0 100% 0 0); }
	to   { clip-path: inset(0 0 0 0); }
}
@keyframes bio-curtain-rtl {
	from { clip-path: inset(0 0 0 100%); }
	to   { clip-path: inset(0 0 0 0); }
}
@keyframes bio-lift {
	from { clip-path: inset(100% 0 0 0 round var(--radius-md)); }
	to   { clip-path: inset(0 0 0 0 round var(--radius-md)); }
}
@keyframes bio-focus {
	0%   { opacity: 0.35; }
	28%  { opacity: 1; }
	72%  { opacity: 1; }
	100% { opacity: 0.35; }
}

/* =============================================================================
   02 · GÖRSELİN KAYDIRMAYLA YAKINLAŞMASI — şirket kararı 2026-09-22
   Görsel, görünüm alanına girerken %12 yakından normale oturur. Çerçeve
   sabit kalır (taşma kırpılır); sayfa düzeni kıpırdamaz.
   🔄 "Belgesel fotoğraf oynatılmaz" kuralı kalktı: görseller AI üretimi.
   ============================================================================= */

.block-split__media,
.intro-split__media,
.page-head__media { overflow: clip; border-radius: var(--radius-md); }
.stop__visual,
.stop__base { overflow: clip; border-radius: var(--radius-md); }

@keyframes bio-zoom {
	from { transform: scale(1.12); }
	to   { transform: scale(1); }
}

/* =============================================================================
   04 · KİNETİK BAŞLIK — kelime kelime, bir kez (şirket kararı 2026-09-22)
   Betik başlığı kelimelere böler ve `.is-kinetic` ekler. Betik yoksa başlık
   olduğu gibi durur. Harf harf DEĞİL — Arapçada harf bağları korunur.
   ============================================================================= */

@media (prefers-reduced-motion: no-preference) {
	.is-kinetic .kw {
		display: inline-block;
		animation: bio-word 800ms var(--motion-ease-out) both;
		animation-delay: calc(var(--i) * 70ms + 80ms);
	}
}
@keyframes bio-word {
	from { opacity: 0; transform: translateY(0.45em); filter: blur(4px); }
	to   { opacity: 1; transform: none; filter: none; }
}

/* =============================================================================
   05 · SAYAN RAKAMLAR — sayı şeridi (şirket kararı 2026-09-22)
   Sayma betikte; burada yalnızca dört rakamlı şeridin düzeni.
   ============================================================================= */

.numbers__value { font-variant-numeric: tabular-nums lining-nums; }
@media (min-width: 900px) {
	.numbers:has(> :nth-child(4):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.numbers__value { font-size: clamp(40px, 4vw, 56px); line-height: 1.05; }
}

/* =============================================================================
   08 · SAYFALAR ARASI YUMUŞAK GEÇİŞ — View Transitions (şirket kararı 2026-09-22)
   Tarayıcı iki sayfa arasında çapraz geçiş yapar; karttaki görsel, hedef
   sayfadaki görselin yerine büyüyerek taşınır (bioVtName / bioVtSelf).
   Desteklemeyen tarayıcı sayfayı her zamanki gibi açar.
   ============================================================================= */

@media (prefers-reduced-motion: no-preference) {
	@view-transition { navigation: auto; }
}
.header { view-transition-name: site-header; }
::view-transition-old(root),
::view-transition-new(root) { animation-duration: 260ms; }
::view-transition-group(*) { animation-duration: 420ms; animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1); }

/* =============================================================================
   11 · İMLECİ İZLEYEN IŞIK — bento kategori kartları (şirket kararı 2026-09-22)
   Yalnızca fare olan cihazda; betik --gx/--gy konumunu yazar. Görselin
   üstünde renksiz, yumuşak bir ışık — görselin rengini değiştirmez.
   ============================================================================= */

@media (hover: hover) and (pointer: fine) {
	.grid-cards--bento .card__media::after {
		content: "";
		position: absolute;
		inset: 0;
		background: radial-gradient(320px circle at var(--gx, 50%) var(--gy, 50%), rgba(255, 255, 255, 0.22), transparent 60%);
		opacity: 0;
		transition: opacity 300ms var(--motion-ease);
		pointer-events: none;
	}
	.grid-cards--bento .card__link:hover .card__media::after { opacity: 1; }
}

/* =============================================================================
   HİKÂYE ÇERÇEVESİ — DENEME (şirket isteği, 2026-09-22 · §35)
   home.php → $hikayeCercevesi. Sınıf yoksa bu bölüm hiçbir şey yapmaz.
   Masaüstünde yolculuk, ekranın ortasında DAR ve KISA bir çerçevede kayar:
   iki yanda ve üst/altta boşluk kalır — fare çerçevenin dışındayken sayfa
   kendi kaydırmasıyla ilerler (şirket önerisi). Çerçevenin sonunda kaydırma
   sayfaya geçer (overscroll zinciri açık bırakıldı; kilitleme yok).
   Mobilde çerçeve kurulmaz; duraklar alt alta akar.
   ============================================================================= */

.journey-frame__visual { display: none; }
/* Bölüm başlığı — mobilde durakların kenar boşluğuyla hizalı */
.journey-frame__head { padding-inline: var(--gutter); padding-block-start: var(--space-8); }

@media (min-width: 900px) {
	.journey-frame-wrap {
		--jf-h: min(74vh, 700px);
		max-inline-size: min(1080px, 100% - 2 * var(--space-10, 96px));
		margin-inline: auto;
		padding-block: var(--space-8) var(--space-9);
	}
	.journey-frame__head { padding: 0; margin-block-end: var(--space-6); }

	.journey--frame {
		display: grid;
		/* 🔄 2026-09-23 · şirket: "yazıları sola resimleri sağa alalım".
		   Sütun genişlikleri korundu; yalnızca yer değiştirdiler. */
		grid-template-columns: minmax(0, 45fr) minmax(0, 55fr);
		block-size: var(--jf-h);
		overflow-y: auto;
		overscroll-behavior: auto;
		scrollbar-width: thin;
		scrollbar-color: var(--border) transparent;
		background: var(--surface-raised);
		border: var(--border-width) solid var(--card-border);
		border-radius: var(--radius-lg);
		box-shadow: var(--elev-2);
	}
	.journey--frame:focus-visible { outline: var(--focus-width) solid var(--link); outline-offset: 4px; }

	/* Sağ: sabit görsel sütunu */
	.journey-frame__visual {
		display: block;
		grid-column: 2;
		grid-row: 1;
		align-self: start;
		position: sticky;
		inset-block-start: 0;
		block-size: var(--jf-h);
		padding: var(--space-5);
		padding-inline-start: 0;
	}
	.journey-frame__item {
		position: absolute;
		inset: var(--space-5);
		inset-inline-start: 0;
		opacity: 0;
		transition: opacity 700ms var(--motion-ease);
		border-radius: var(--radius-md);
		overflow: clip;
	}
	.journey-frame__item.is-on { opacity: 1; }
	.journey-frame__item .stop__visual {
		position: absolute;
		inset: 0;
		block-size: auto;
		min-block-size: 0;
		animation: none;
		clip-path: none;
	}
	.journey-frame__item img { animation: none; transform: scale(1.06); transition: transform 1400ms var(--motion-ease-out); }
	.journey-frame__item.is-on img { transform: none; }
	.journey-frame__item .stop__overlay img { transform: none; }
	.journey-frame__item .stop__visual > img,
	.journey-frame__item .stop__visual > picture img,
	.journey-frame__item .stop__base img { inline-size: 100%; block-size: 100%; object-fit: cover; }
	.journey-frame__item .stop__visual > picture,
	.journey-frame__item .stop__base picture { display: block; block-size: 100%; }

	/* Sol: çerçevenin içinde akan metin */
	.journey-frame__steps { grid-column: 1; grid-row: 1; }
	.journey--frame .stop {
		min-block-size: 0;
		border: 0;
		background: none;
	}
	.journey--frame .stop__inner {
		grid-template-columns: 1fr;
		max-inline-size: none;
		padding: var(--space-7) var(--space-7);
		min-block-size: calc(var(--jf-h) * 0.92);
		align-content: center;
	}
	.journey--frame .stop:last-child .stop__inner { min-block-size: var(--jf-h); }
	.journey--frame .stop__inner > .stop__visual { display: none; }
	.journey--frame .stop__flow,
	.journey--frame .stop--tall .stop__flow { min-block-size: 0; }
	.journey--frame .stop__title { font-size: clamp(28px, 2.6vw, 40px); }
}

/* =============================================================================
   HAREKETİ AZALT — her şey durur, içerik eksiksiz (H1 · E10)
   ============================================================================= */

@media (prefers-reduced-motion: reduce) {
	.card, .card__img, .btn, .btn::before, .arrow-link .icon,
	.featured__media img, .accordion__sign .icon { transition: none !important; }
	.card:hover, .card:focus-within { transform: none !important; }
	.card__link:hover .card__img { transform: none !important; }
	.accordion__item::details-content,
	.evidence::details-content { transition: none; }
	.read-progress { display: none !important; }
	.closure::before { animation: none; }
	.grid-cards--bento .card__media::after { display: none; }
	.journey-frame__item, .journey-frame__item img { transition: none !important; }
}

/* 2026-10-01 · kullanıcı: telif iki satır, ortalı, beyaz; dil seçici
   altında ortada (uzun metin dilleri sola itiyordu) */
.footer__bottom-inner { flex-direction: column; justify-content: center; text-align: center; gap: var(--space-3); }
.footer .footer__bottom .footer__copy { color: var(--white); margin: 0; }
.footer__copy-line { display: block; }
/* 2026-10-15 · "Çerez tercihleri" — bağlantı görünümlü düğme (yalnız ölçüm kimliği girilince basılır) */
.footer__cookie-btn { background: none; border: 0; padding: 4px 0; margin: -4px 0; font: inherit; color: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }  /* Faz 10: dokunma alanı ≥ 24 px (WCAG 2.5.8), satır yüksekliği değişmez */
.footer__cookie-btn:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.footer .footer__langs { margin-inline: auto; justify-content: center; }

/* Yasal metinler kolonu — hareketli alt çizgi yok (liste bağlamı bağlantıyı
   zaten belli eder); üstüne gelince renk değişir */
.footer .footer__col--legal a:not(.btn):not(.arrow-link):not(.icon-btn) { text-decoration: none; background: none; transition: color var(--motion-fast) var(--motion-ease); }
.footer .footer__col--legal a:not(.btn):not(.arrow-link):not(.icon-btn):hover,
.footer .footer__col--legal a:not(.btn):not(.arrow-link):not(.icon-btn):focus-visible { color: var(--band-accent); }

/* 2026-10-01 · kullanıcı: "Ürünün hikâyesi" durak metinleri soluk/görünmez
   kalıyordu. Çerçeve kendi içinde kaydığı için belirme gözlemcisi bazı
   durakları kaçırıyor; durak metni her zaman tam görünür. */
.journey .stop__flow.reveal,
.journey .stop .reveal { opacity: 1; transform: none; }
.content-flow .block--band + .block--cont { background-image: var(--grain), var(--grain-light); background-size: 240px 240px, 100% 100%; }