/*
 * Elff Optik — koyu lüks tema katmanı.
 *
 * Renkler theme.json'daki --wp--preset--color-* değişkenlerinden gelir;
 * burada yalnızca Site Düzenleyici'nin karşılamadığı davranışlar tanımlanır:
 * banner mercek efekti, kayan marka şeridi, kart yüzeyleri, kaydırma animasyonu.
 *
 * Performans notu: tüm efektler CSS'tir. Animasyonlar yalnızca `transform` ve
 * `opacity` üzerinde çalışır (GPU'da compositor katmanında işlenir, sayfa
 * yeniden yerleşimi tetiklemez).
 */

:root {
	--elff-ink: #0C0A09;
	--elff-surface: #15100D;
	--elff-surface-2: #1E1712;
	--elff-line: rgba(247, 242, 236, 0.14);
	--elff-text: #F7F2EC;
	--elff-muted: #A2968B;
	--elff-orange: #F58220;
	--elff-amber: #FFC178;
	--elff-whatsapp: #25D366;

	--elff-radius: 14px;
	--elff-ease: cubic-bezier(0.22, 1, 0.36, 1);

	--elff-star-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 .6l3.5 7.1 7.9 1.1-5.7 5.6 1.3 7.8L12 18.5l-7 3.7 1.3-7.8L.6 8.8l7.9-1.1z"/></svg>');

	/* Banner mercek geometrisi — kırpma alanı, çerçeve ve mercek yazısı
	   aynı değerleri kullandığı için hepsi birebir örtüşür. Gözlük dikeyde
	   ortanın biraz üstünde durur; altında kalan boşluk başlık içindir. */
	--lens-cx-l: 35%;
	--lens-cx-r: 65%;
	--lens-cy: 38%;
	--lens-rx: 13%;
	--lens-ry: 23%;
}

html {
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
}

body {
	background: var(--elff-ink);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

/* Tam genişlikteki bölümler arasında istenmeyen boşluk oluşmasın. */
.wp-block-post-content > .alignfull { margin-block: 0; }

::selection {
	background: var(--elff-orange);
	color: #140F0B;
}

/* =========================================================================
 * Ortak parçalar
 * ====================================================================== */

.elff-eyebrow {
	margin: 0 0 0.6rem;
	font-size: 0.74rem;
	font-weight: 700;
	letter-spacing: 3.4px;
	text-transform: uppercase;
	color: var(--elff-orange);
}

.elff-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	padding: 1rem 2.1rem;
	border-radius: 999px;
	font-weight: 600;
	font-size: 1rem;
	text-decoration: none;
	white-space: nowrap;
	transition: transform 0.25s var(--elff-ease), box-shadow 0.25s var(--elff-ease),
		background-color 0.25s var(--elff-ease), color 0.25s var(--elff-ease);
}

.elff-cta--solid {
	background: linear-gradient(135deg, var(--elff-orange), var(--elff-amber));
	color: #140F0B;
	box-shadow: 0 12px 34px -14px rgba(245, 130, 32, 0.85);
}

.elff-cta--ghost {
	border: 1px solid rgba(247, 242, 236, 0.35);
	color: var(--elff-text);
}

.elff-cta:hover,
.elff-cta:focus-visible {
	transform: translateY(-2px);
}

.elff-cta--ghost:hover,
.elff-cta--ghost:focus-visible {
	border-color: var(--elff-orange);
	color: var(--elff-orange);
}

/* Kaydırıldıkça belirme — JS yalnızca sınıf ekler, animasyon CSS'tedir. */
.elff-reveal {
	opacity: 0;
	transform: translateY(22px);
	transition: opacity 0.7s var(--elff-ease), transform 0.7s var(--elff-ease);
}

.elff-reveal.is-visible {
	opacity: 1;
	transform: none;
}

/* JS kapalıysa içerik gizli kalmasın. */
.no-js .elff-reveal {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.elff-reveal { opacity: 1; transform: none; transition: none; }
}

/* =========================================================================
 * BANNER — bulanık arka plan, mercek içi net
 * ====================================================================== */

.elff-hero {
	position: relative;
	display: grid;
	align-content: end;
	justify-items: center;
	min-height: min(94vh, 900px);
	padding: clamp(70px, 10vh, 120px) var(--wp--preset--spacing--50, 24px) clamp(70px, 10vh, 120px);
	overflow: hidden;
	background: var(--elff-ink);
	isolation: isolate;
}

/* --- Video modu ---------------------------------------------------------
   Videonun üzerinde yazı veya karartma yoktur; video olduğu gibi görünür.
   Başlık ve butonlar hemen alttaki .elff-hero-intro bölümündedir. */

.elff-hero-video {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	max-height: 88vh;
	overflow: hidden;
	background: var(--elff-ink);
}

.elff-hero__video {
	position: absolute;
	inset: 0;
	overflow: hidden;
}

.elff-hero__poster {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Kutu 16:9'dan basıksa (çok geniş ekranda max-height devreye girdiğinde)
   videoyu kırpmadan boşluk bırakmamak için "cover" ölçekleme. */
.elff-hero__iframe {
	position: absolute;
	top: 50%;
	left: 50%;
	height: max(100%, 56.25vw);
	aspect-ratio: 16 / 9;
	width: auto;
	border: 0;
	transform: translate(-50%, -50%);
	pointer-events: none;
	opacity: 0;
	transition: opacity 1.2s var(--elff-ease);
}

.elff-hero__iframe.is-ready {
	opacity: 1;
}

.elff-hero-intro {
	padding: clamp(48px, 7vw, 90px) var(--wp--preset--spacing--50, 24px) clamp(56px, 8vw, 100px);
	background: var(--elff-ink);
	display: grid;
	justify-items: center;
}

@media (prefers-reduced-motion: reduce) {
	.elff-hero__iframe { transition: none; }
}

/* --- Görsel katmanları --- */

.elff-hero__stage {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.elff-hero__layer {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

/* Alt katman: bulanık. Ölçek büyütmesi, bulanıklığın kenarlarda
   saydamlaşmasını (kenar sızması) engeller. */
.elff-hero__layer--blur {
	filter: blur(16px) saturate(0.85) brightness(0.42);
	transform: scale(1.12);
}

/* Üst katmanlar: yalnızca mercek şekillerinde görünür. Kırpma elipsi ile
   çerçevedeki halkalar aynı --lens-* değerlerini kullandığı için birebir örtüşür. */
.elff-hero__layer--sharp {
	filter: brightness(1.06) contrast(1.04) saturate(1.08);
}

.elff-hero__layer--l {
	clip-path: ellipse(var(--lens-rx) var(--lens-ry) at var(--lens-cx-l) var(--lens-cy));
}

.elff-hero__layer--r {
	clip-path: ellipse(var(--lens-rx) var(--lens-ry) at var(--lens-cx-r) var(--lens-cy));
}

/* Merceklere hafif cam parlaması. */
.elff-hero__stage::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background:
		radial-gradient(ellipse var(--lens-rx) var(--lens-ry) at var(--lens-cx-l) var(--lens-cy),
			rgba(255, 255, 255, 0.16) 0%, rgba(255, 255, 255, 0.03) 45%, transparent 70%),
		radial-gradient(ellipse var(--lens-rx) var(--lens-ry) at var(--lens-cx-r) var(--lens-cy),
			rgba(255, 255, 255, 0.16) 0%, rgba(255, 255, 255, 0.03) 45%, transparent 70%);
}

/* --- Gözlük çerçevesi --- */

.elff-hero__frame {
	position: absolute;
	inset: 0;
	z-index: 3;
	pointer-events: none;
}

.elff-hero__ring {
	position: absolute;
	top: calc(var(--lens-cy) - var(--lens-ry));
	width: calc(var(--lens-rx) * 2);
	height: calc(var(--lens-ry) * 2);
	border: 2px solid rgba(255, 193, 120, 0.85);
	border-radius: 50%;
	box-shadow:
		0 0 32px rgba(245, 130, 32, 0.35),
		inset 0 0 24px rgba(255, 193, 120, 0.18);
}

.elff-hero__ring--l { left: calc(var(--lens-cx-l) - var(--lens-rx)); }
.elff-hero__ring--r { left: calc(var(--lens-cx-r) - var(--lens-rx)); }

.elff-hero__bridge {
	position: absolute;
	top: calc(var(--lens-cy) - var(--lens-ry) * 0.34);
	left: calc(var(--lens-cx-l) + var(--lens-rx) - 1px);
	width: calc(var(--lens-cx-r) - var(--lens-cx-l) - var(--lens-rx) * 2 + 2px);
	height: calc(var(--lens-ry) * 0.34);
	border-top: 2px solid rgba(255, 193, 120, 0.85);
	border-radius: 60% 60% 0 0 / 100% 100% 0 0;
}

.elff-hero__temple {
	position: absolute;
	top: calc(var(--lens-cy) - var(--lens-ry) * 0.55);
	width: 9%;
	height: 2px;
	background: linear-gradient(90deg, rgba(255, 193, 120, 0.85), transparent);
}

.elff-hero__temple--l {
	right: calc(100% - var(--lens-cx-l) + var(--lens-rx) - 0.5%);
	transform: rotate(8deg);
	transform-origin: right center;
	background: linear-gradient(270deg, rgba(255, 193, 120, 0.85), transparent);
}

.elff-hero__temple--r {
	left: calc(var(--lens-cx-r) + var(--lens-rx) - 0.5%);
	transform: rotate(-8deg);
	transform-origin: left center;
}

/* --- Mercek içi yazı --- */

.elff-hero__lens-text {
	position: absolute;
	inset: 0;
	z-index: 4;
	pointer-events: none;
}

.elff-hero__lens-word {
	position: absolute;
	top: var(--lens-cy);
	transform: translate(-50%, -50%);
	font-family: var(--wp--preset--font-family--platypi, Georgia, serif);
	font-size: clamp(1.4rem, 3.2vw, 2.6rem);
	font-weight: 600;
	letter-spacing: -0.5px;
	color: #FFFFFF;
	text-shadow: 0 2px 18px rgba(0, 0, 0, 0.75), 0 0 40px rgba(245, 130, 32, 0.5);
	white-space: nowrap;
}

.elff-hero__lens-word--l { left: var(--lens-cx-l); }
.elff-hero__lens-word--r { left: var(--lens-cx-r); }

/* --- Banner metni --- */

.elff-hero__content {
	position: relative;
	z-index: 5;
	max-width: 720px;
	text-align: center;
}

.elff-hero__eyebrow {
	margin: 0 0 0.9rem;
	font-size: 0.74rem;
	font-weight: 700;
	letter-spacing: 4px;
	text-transform: uppercase;
	color: var(--elff-amber);
}

.elff-hero__title {
	margin: 0;
	font-family: var(--wp--preset--font-family--platypi, Georgia, serif);
	font-size: clamp(2.6rem, 7vw, 5rem);
	font-weight: 500;
	line-height: 1.02;
	letter-spacing: -1.5px;
	color: var(--elff-text);
}

.elff-hero__sub {
	margin: 1.1rem auto 0;
	max-width: 40ch;
	font-size: clamp(1rem, 1.6vw, 1.15rem);
	line-height: 1.6;
	color: var(--elff-muted);
}

.elff-hero__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
	margin-top: 2rem;
}

.elff-hero__scroll {
	position: absolute;
	bottom: 26px;
	left: 50%;
	z-index: 5;
	width: 22px;
	height: 36px;
	margin-left: -11px;
	border: 1px solid rgba(247, 242, 236, 0.3);
	border-radius: 999px;
}

.elff-hero__scroll span {
	position: absolute;
	top: 8px;
	left: 50%;
	width: 3px;
	height: 6px;
	margin-left: -1.5px;
	border-radius: 2px;
	background: var(--elff-amber);
	animation: elff-scroll 1.9s var(--elff-ease) infinite;
}

@keyframes elff-scroll {
	0%   { transform: translateY(0); opacity: 0; }
	25%  { opacity: 1; }
	75%  { transform: translateY(13px); opacity: 0; }
	100% { transform: translateY(13px); opacity: 0; }
}

/* Mobil: gözlük daha büyük ve yuvarlak dursun, bulanıklık hafiflesin
   (düşük donanımlı telefonlarda büyük blur yarıçapı pahalıdır). */
@media (max-width: 781px) {
	:root {
		--lens-cx-l: 28%;
		--lens-cx-r: 72%;
		--lens-cy: 32%;
		--lens-rx: 19%;
		--lens-ry: 14%;
	}

	.elff-hero {
		min-height: 92vh;
	}

	.elff-hero__layer--blur {
		filter: blur(10px) saturate(0.85) brightness(0.4);
	}

	.elff-hero__actions .elff-cta {
		flex: 1 1 auto;
		min-width: 140px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.elff-hero__scroll span { animation: none; }
}

/* =========================================================================
 * Bölüm iskeleti
 * ====================================================================== */

.elff-section {
	padding-block: clamp(70px, 10vw, 130px);
	padding-inline: var(--wp--preset--spacing--50, 24px);
}

.elff-section--alt { background: var(--elff-surface-2); }
.elff-section--deep { background: var(--elff-surface); }

.elff-shell {
	max-width: 1240px;
	margin-inline: auto;
}

.elff-head {
	max-width: 760px;
	margin: 0 auto clamp(40px, 6vw, 70px);
	text-align: center;
}

.elff-head h2 {
	margin: 0;
	font-size: clamp(2rem, 4.4vw, 3.1rem);
	line-height: 1.1;
	letter-spacing: -1px;
}

.elff-head p {
	margin: 0.9rem auto 0;
	max-width: 52ch;
	color: var(--elff-muted);
}

/* =========================================================================
 * Kartlar (hizmetler)
 * ====================================================================== */

.elff-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
	gap: clamp(18px, 2.2vw, 28px);
}

.elff-card {
	position: relative;
	overflow: hidden;
	border: 1px solid var(--elff-line);
	border-radius: var(--elff-radius);
	background: var(--elff-surface);
	transition: transform 0.4s var(--elff-ease), border-color 0.4s var(--elff-ease),
		box-shadow 0.4s var(--elff-ease);
}

.elff-card:hover {
	transform: translateY(-6px);
	border-color: rgba(245, 130, 32, 0.45);
	box-shadow: 0 28px 60px -34px rgba(0, 0, 0, 0.95);
}

.elff-card__media {
	margin: 0;
	aspect-ratio: 4 / 3;
	overflow: hidden;
}

.elff-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s var(--elff-ease);
}

.elff-card:hover .elff-card__media img { transform: scale(1.06); }

.elff-card__body { padding: clamp(22px, 2.4vw, 32px); }

.elff-card__body h3 {
	margin: 0 0 0.6rem;
	font-size: 1.4rem;
	letter-spacing: -0.3px;
}

.elff-card__body p {
	margin: 0;
	color: var(--elff-muted);
	font-size: 0.97rem;
	line-height: 1.65;
}

/* =========================================================================
 * Marka şeridi — geniş, kesintisiz akış
 * ====================================================================== */

.elff-marquee {
	display: flex;
	width: 100%;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}

.elff-marquee__track {
	display: flex;
	flex: none;
	align-items: center;
	gap: clamp(48px, 7vw, 96px);
	margin: 0;
	padding: 0 clamp(24px, 3.5vw, 48px) 0 0;
	list-style: none;
	animation: elff-marquee 38s linear infinite;
}

.elff-marquee:hover .elff-marquee__track { animation-play-state: paused; }

.elff-marquee__item { flex: none; margin: 0; }

.elff-marquee__item img {
	display: block;
	width: auto;
	height: clamp(42px, 5vw, 62px);
	max-width: 180px;
	object-fit: contain;
	opacity: 0.55;
	filter: grayscale(1) brightness(2.4);
	transition: opacity 0.3s var(--elff-ease), filter 0.3s var(--elff-ease);
}

.elff-marquee__item:hover img {
	opacity: 1;
	filter: grayscale(0) brightness(1);
}

@keyframes elff-marquee {
	from { transform: translateX(0); }
	to   { transform: translateX(-100%); }
}

@media (prefers-reduced-motion: reduce) {
	.elff-marquee { -webkit-mask-image: none; mask-image: none; overflow-x: auto; }
	.elff-marquee__track { animation: none; }
	.elff-marquee__track[aria-hidden="true"] { display: none; }
}

/* =========================================================================
 * Google puanı ve yorumlar
 * ====================================================================== */

.elff-rating-box {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 0.4rem;
	margin-bottom: clamp(34px, 5vw, 54px);
}

.elff-rating-number {
	font-family: var(--wp--preset--font-family--platypi, Georgia, serif);
	font-size: clamp(3.4rem, 8vw, 5rem);
	line-height: 1;
	font-weight: 500;
	background: linear-gradient(135deg, var(--elff-orange), var(--elff-amber));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.elff-stars { display: inline-flex; gap: 5px; }

.elff-star {
	width: 24px;
	height: 24px;
	background: currentColor;
	opacity: 0.2;
	-webkit-mask: var(--elff-star-mask) center / contain no-repeat;
	mask: var(--elff-star-mask) center / contain no-repeat;
}

.elff-star.is-full { color: var(--elff-amber); opacity: 1; }

.elff-star.is-half { position: relative; opacity: 0.2; }

.elff-star.is-half::after {
	content: "";
	position: absolute;
	inset: 0;
	width: 50%;
	background: var(--elff-amber);
	-webkit-mask: var(--elff-star-mask) left center / auto 100% no-repeat;
	mask: var(--elff-star-mask) left center / auto 100% no-repeat;
	opacity: 1;
}

.elff-rating-count {
	font-size: 0.92rem;
	color: var(--elff-muted);
}

/* Yorum kartları — sayfa düzenleyicide serbestçe çoğaltılabilir. */
.elff-reviews {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 310px), 1fr));
	gap: clamp(18px, 2.2vw, 28px);
}

.elff-review-card {
	height: 100%;
	padding: clamp(24px, 2.6vw, 34px) !important;
	border: 1px solid var(--elff-line);
	border-radius: var(--elff-radius) !important;
	background: var(--elff-surface) !important;
	transition: transform 0.4s var(--elff-ease), border-color 0.4s var(--elff-ease);
}

.elff-review-card:hover {
	transform: translateY(-4px);
	border-color: rgba(245, 130, 32, 0.4);
}

.elff-review-card p { margin-block: 0 0.8rem; }
.elff-review-card p:last-child { margin-bottom: 0; }

.elff-review-stars {
	color: var(--elff-amber);
	letter-spacing: 3px;
	font-size: 1.05rem;
}

/* Yorum sahibinin fotoğrafı + adı (görsel bloğu + paragraf) */
.elff-review-card .wp-block-image img {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	object-fit: cover;
}

/* =========================================================================
 * Kurucu bölümü
 * ====================================================================== */

.elff-founder {
	display: grid;
	grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
	align-items: center;
	gap: clamp(30px, 5vw, 70px);
}

@media (max-width: 899px) {
	.elff-founder { grid-template-columns: 1fr; }
}

.elff-founder__media {
	position: relative;
	margin: 0;
	border-radius: var(--elff-radius);
	overflow: hidden;
}

.elff-founder__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, transparent 55%, rgba(12, 10, 9, 0.55) 100%);
	pointer-events: none;
}

.elff-founder__media img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
}

.elff-founder__name {
	margin: 0 0 1rem;
	font-size: clamp(2rem, 4.2vw, 2.9rem);
	letter-spacing: -1px;
}

.elff-founder__text p {
	margin: 0 0 1rem;
	color: var(--elff-muted);
	line-height: 1.75;
	font-size: 1.03rem;
}

.elff-founder__text p:last-child { margin-bottom: 0; }

/* =========================================================================
 * S.S.S.
 * ====================================================================== */

.elff-faq .wp-block-details {
	border: 1px solid var(--elff-line);
	border-radius: 12px;
	background: var(--elff-surface);
	padding: clamp(16px, 2vw, 22px) clamp(18px, 2.2vw, 26px);
	margin-bottom: 12px;
	transition: border-color 0.3s var(--elff-ease), background-color 0.3s var(--elff-ease);
}

.elff-faq .wp-block-details:hover { border-color: rgba(245, 130, 32, 0.4); }

.elff-faq .wp-block-details[open] {
	border-color: rgba(245, 130, 32, 0.55);
	background: var(--elff-surface-2);
}

.elff-faq .wp-block-details summary {
	cursor: pointer;
	font-family: var(--wp--preset--font-family--platypi, Georgia, serif);
	font-size: clamp(1.05rem, 1.7vw, 1.2rem);
	font-weight: 600;
	list-style: none;
	transition: color 0.25s var(--elff-ease);
}

.elff-faq .wp-block-details summary::-webkit-details-marker { display: none; }

.elff-faq .wp-block-details summary::after {
	content: "+";
	float: right;
	margin-left: 1rem;
	font-size: 1.4em;
	line-height: 1;
	color: var(--elff-orange);
	transition: transform 0.3s var(--elff-ease);
}

.elff-faq .wp-block-details[open] summary::after {
	content: "−";
}

.elff-faq .wp-block-details summary:hover,
.elff-faq .wp-block-details[open] summary { color: var(--elff-amber); }

.elff-faq .wp-block-details p {
	margin-top: 0.9rem;
	color: var(--elff-muted);
	line-height: 1.7;
}

/* =========================================================================
 * Instagram / galeri
 * ====================================================================== */

.elff-grid-4 {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
	gap: clamp(12px, 1.6vw, 20px);
}

.elff-grid-4 .wp-block-image {
	margin: 0;
	overflow: hidden;
	border-radius: 12px;
}

.elff-grid-4 .wp-block-image img {
	display: block;
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
	transition: transform 0.6s var(--elff-ease), filter 0.4s var(--elff-ease);
}

.elff-grid-4 .wp-block-image:hover img {
	transform: scale(1.07);
	filter: brightness(1.1);
}

/* =========================================================================
 * Blog kartları
 * ====================================================================== */

.wp-block-post-template { gap: clamp(18px, 2.2vw, 28px) !important; }

.wp-block-post-template .wp-block-post-featured-image img {
	border-radius: 12px;
	transition: transform 0.5s var(--elff-ease);
}

.wp-block-post-template li:hover .wp-block-post-featured-image img {
	transform: scale(1.03);
}

.wp-block-post-template .wp-block-post-title { margin-block: 0.9rem 0.4rem; }

.wp-block-post-template .wp-block-post-title a { text-decoration: none; }

.wp-block-post-template .wp-block-post-title a:hover { color: var(--elff-orange); }

.wp-block-post-template .wp-block-post-excerpt {
	color: var(--elff-muted);
	font-size: 0.95rem;
}

/* =========================================================================
 * Üst bilgi / alt bilgi
 * ====================================================================== */

.elff-header-brand { gap: 0; }

.elff-header-brand .wp-block-site-logo img {
	max-width: min(230px, 58vw);
	height: auto;
}

.elff-header-brand .wp-block-site-title a { text-decoration: none; }

.elff-footer { gap: 0.45rem; }

.elff-footer .wp-block-site-logo img {
	max-width: min(150px, 45vw);
	height: auto;
	margin-bottom: 0.5rem;
}

.elff-footer p { margin: 0; line-height: 1.55; }
.elff-footer a { text-decoration: none; }
.elff-footer a:hover { color: var(--elff-orange); }

.elff-hours-compact {
	display: inline-flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: baseline;
	gap: 0 0.1em;
}

.elff-hours-compact .elff-hours-day { font-weight: 600; }

.elff-footer-hours { opacity: 0.7; }
.elff-footer-links a { opacity: 0.85; }
.elff-footer-links a:hover { opacity: 1; }
.elff-footer-copy { opacity: 0.4; margin-top: 0.4rem !important; }
.elff-sep { opacity: 0.35; }

/* Çalışma saatleri listesi (uzun biçim) */
.elff-hours-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.35em;
}

.elff-hours-list li {
	display: flex;
	justify-content: space-between;
	gap: 1em;
	padding-block: 0.3em;
	border-bottom: 1px solid var(--elff-line);
}

.elff-hours-today { font-weight: 700; color: var(--elff-amber); }

.elff-transport-note {
	opacity: 0.7;
	font-size: 0.9em;
}

.elff-map-embed iframe {
	width: 100%;
	border: 0;
	border-radius: var(--elff-radius);
	min-height: 320px;
}

/* =========================================================================
 * Yüzen WhatsApp butonu
 * ====================================================================== */

.elff-wa-float {
	position: fixed;
	right: clamp(14px, 3vw, 28px);
	bottom: clamp(14px, 3vw, 28px);
	z-index: 999;
	display: inline-flex;
	align-items: center;
	gap: 0;
	padding: 14px;
	border-radius: 999px;
	background: var(--elff-whatsapp);
	color: #fff;
	text-decoration: none;
	box-shadow: 0 10px 26px -8px rgba(37, 211, 102, 0.6), 0 3px 10px rgba(0, 0, 0, 0.35);
	transition: transform 0.22s var(--elff-ease), gap 0.22s var(--elff-ease),
		padding 0.22s var(--elff-ease), box-shadow 0.22s var(--elff-ease);
}

.elff-wa-float__icon { flex: none; display: block; }

.elff-wa-float__label {
	max-width: 0;
	overflow: hidden;
	white-space: nowrap;
	font-weight: 600;
	font-size: 0.95rem;
	transition: max-width 0.28s var(--elff-ease);
}

@media (hover: hover) {
	.elff-wa-float:hover,
	.elff-wa-float:focus-visible {
		gap: 10px;
		padding-inline-end: 22px;
		transform: translateY(-2px);
	}

	.elff-wa-float:hover .elff-wa-float__label,
	.elff-wa-float:focus-visible .elff-wa-float__label { max-width: 140px; }
}

.elff-wa-float:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
	.elff-wa-float { transition: none; }
}

/* =========================================================================
 * 404 sayfası
 * ====================================================================== */

.elff-404 {
	position: relative;
	display: grid;
	place-items: center;
	min-height: min(78vh, 760px);
	padding: clamp(60px, 10vw, 120px) var(--wp--preset--spacing--50, 24px);
	overflow: hidden;
	background:
		radial-gradient(ellipse 60% 50% at 50% 30%, rgba(245, 130, 32, 0.14), transparent 70%),
		var(--elff-ink);
	text-align: center;
}

.elff-404__inner {
	max-width: 640px;
}

.elff-404__code {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: clamp(4px, 1.2vw, 14px);
	margin-bottom: clamp(18px, 3vw, 30px);
	font-family: var(--wp--preset--font-family--platypi, Georgia, serif);
	font-size: clamp(5.5rem, 17vw, 10rem);
	font-weight: 500;
	line-height: 1;
	letter-spacing: -2px;
	color: var(--elff-text);
}

/* Sıfırın yerindeki mercek: yavaşça "odaklanıyormuş" gibi nefes alır. */
.elff-404__lens {
	width: 0.62em;
	height: 0.78em;
	color: var(--elff-amber);
	filter: drop-shadow(0 0 22px rgba(245, 130, 32, 0.45));
	animation: elff-404-focus 3.6s var(--elff-ease) infinite;
}

@keyframes elff-404-focus {
	0%, 100% { transform: scale(1); opacity: 1; }
	50%      { transform: scale(0.94); opacity: 0.8; }
}

.elff-404__title {
	margin: 0;
	font-size: clamp(1.9rem, 4.6vw, 3rem);
	line-height: 1.1;
	letter-spacing: -1px;
}

.elff-404__text {
	margin: 1rem auto 0;
	max-width: 46ch;
	color: var(--elff-muted);
}

.elff-404__links {
	margin-top: 2.2rem;
	font-size: 0.92rem;
}

.elff-404__links a {
	color: var(--elff-muted);
	text-decoration: none;
}

.elff-404__links a:hover {
	color: var(--elff-orange);
}

@media (prefers-reduced-motion: reduce) {
	.elff-404__lens { animation: none; }
}
