/* Deevans — temel: tokenlar, sıfırlama, ortak bileşenler. */

:root {
	--dv-ink: #181818;
	--dv-text: #333;
	--dv-muted: #6b6560;
	--dv-faint: #a19a94;
	--dv-line: #ebe8e5;
	--dv-line-2: #e0dcd8;
	--dv-soft: #f8f5f1;
	--dv-soft-2: #f1ece6;
	--dv-greige: #ece6df;
	--dv-greige-2: #ddd4ca;
	--dv-taupe: #8f7d6f;
	--dv-white: #fff;
	--dv-brand: #3d2f29;
	--dv-brand-2: #5b463b;
	--dv-brand-3: #2a201b;
	--dv-accent: #9a6b4b;
	--dv-accent-soft: #f3ebe4;
	--dv-wa: #1f9d55;

	--dv-font: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
	--dv-wrap: 1300px;
	--dv-gutter: 24px;
	--dv-r-sm: 12px;
	--dv-r: 20px;
	--dv-r-lg: 24px;
	--dv-shadow: 0 10px 40px rgba(40, 30, 25, .08);
	--dv-shadow-lg: 0 24px 70px rgba(40, 30, 25, .16);
	--dv-ease: cubic-bezier(.2, .7, .2, 1);
	--dv-fast: .2s;
	--dv-normal: .35s;
	--dv-header-h: 81px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
	margin: 0;
	font-family: var(--dv-font);
	font-size: 14px;
	line-height: 1.6;
	color: var(--dv-text);
	background: var(--dv-white);
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}
body.dv-lock { overflow: hidden; }
img, svg, video, iframe { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3, h4 { margin: 0; color: var(--dv-ink); font-weight: 500; line-height: 1.3; }
p { margin: 0; }
:where(ul[role="list"], ol[role="list"]) { list-style: none; margin: 0; padding: 0; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--dv-accent); outline-offset: 3px; border-radius: 6px; }

.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px); white-space: nowrap;
}
.dv-skip {
	position: fixed; left: 16px; top: -60px; z-index: 200; padding: 10px 18px;
	background: var(--dv-brand); color: #fff; border-radius: 999px; transition: top var(--dv-fast);
}
.dv-skip:focus { top: 16px; }

.dv-wrap { width: min(100% - var(--dv-gutter) * 2, var(--dv-wrap)); margin-inline: auto; }
.dv-section { margin-block: 72px; }
.dv-section--tight { margin-block: 32px 56px; }
.dv-main { display: block; }

/* Başlık satırı + oklar */
.dv-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 28px; min-height: 46px; }
.dv-head--end { justify-content: flex-end; margin-bottom: 20px; }
.dv-head__end { display: flex; align-items: center; gap: 12px; }
.dv-title { font-size: 26px; font-weight: 500; color: var(--dv-ink); letter-spacing: -.015em; line-height: 1.2; }

.dv-arrows { display: inline-flex; gap: 8px; }
.dv-arrows button {
	width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--dv-greige-2);
	transition: background var(--dv-fast), color var(--dv-fast), border-color var(--dv-fast), opacity var(--dv-fast);
}
.dv-arrows button:hover:not(:disabled) { background: var(--dv-brand); border-color: var(--dv-brand); color: #fff; }
.dv-arrows button:disabled { opacity: .35; cursor: default; }

/* İki ağırlıklı başlık + kısa çizgili etiket (Deevans sosyal medya dili) */
.dv-heading { display: grid; gap: 8px; }
.dv-kicker { display: inline-flex; align-items: center; gap: 12px; font-size: 11px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--dv-taupe); }
.dv-kicker::before { content: ""; width: 28px; height: 1px; background: currentColor; }
.dv-kicker--light { color: rgba(255, 255, 255, .85); }
.dv-title__light { font-weight: 300; }

/* Yuvarlak düğme ve kapsüller */
.dv-circle {
	flex: none; width: 48px; height: 48px; display: inline-grid; place-items: center;
	border: 1px solid var(--dv-line-2); border-radius: 50%; background: transparent;
	transition: background var(--dv-fast), border-color var(--dv-fast), color var(--dv-fast), transform var(--dv-fast);
}
.dv-circle--sm { width: 36px; height: 36px; }
.dv-circle--white { background: #fff; border-color: #fff; color: var(--dv-ink); box-shadow: 0 6px 20px rgba(0, 0, 0, .12); }
.dv-circle--glass { background: rgba(255, 255, 255, .22); border-color: rgba(255, 255, 255, .5); color: #fff; backdrop-filter: blur(8px); }
.dv-circle--ghost { border-color: rgba(255, 255, 255, .55); color: #fff; }
.dv-circle--ghost:hover { background: #fff; color: var(--dv-brand); }
a:hover > .dv-circle, button.dv-circle:hover { border-color: var(--dv-ink); }

.dv-pill {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 46px; padding: 0 22px; border-radius: 999px; font-size: 14px; font-weight: 500;
	border: 1px solid transparent; white-space: nowrap;
	transition: background var(--dv-fast), color var(--dv-fast), border-color var(--dv-fast), transform var(--dv-fast), box-shadow var(--dv-fast);
}
.dv-pill:active { transform: scale(.98); }
.dv-pill--line { border-color: var(--dv-line-2); background: #fff; color: var(--dv-ink); }
.dv-pill--line:hover, .dv-pill--line.is-active { border-color: var(--dv-ink); }
.dv-pill--line.is-active { background: var(--dv-ink); color: #fff; }
.dv-pill--accent { color: var(--dv-accent); font-weight: 600; letter-spacing: .02em; }
.dv-pill--accent:hover { border-color: var(--dv-accent); background: var(--dv-accent-soft); }
.dv-pill--brand { background: var(--dv-brand); color: #fff; }
.dv-pill--brand:hover { background: var(--dv-brand-3); box-shadow: 0 10px 24px rgba(61, 47, 41, .25); }
.dv-pill--white { background: #fff; color: var(--dv-ink); border-color: var(--dv-line); }
.dv-pill--white:hover { border-color: var(--dv-ink); }
.dv-pill--light { background: #fff; color: var(--dv-ink); }
.dv-pill--light:hover { background: var(--dv-soft-2); }
.dv-pill--ghost { border-color: rgba(255, 255, 255, .6); color: #fff; min-height: 60px; padding: 0 28px; }
.dv-pill--ghost:hover { background: #fff; color: var(--dv-brand); }
.dv-pill--lg { min-height: 58px; padding: 0 22px 0 18px; gap: 14px; }

.dv-btn {
	display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%;
	min-height: 52px; padding: 0 22px; border-radius: 999px; background: var(--dv-brand); color: #fff;
	font-size: 16px; font-weight: 500; letter-spacing: .02em;
	transition: background var(--dv-fast), box-shadow var(--dv-fast), transform var(--dv-fast);
}
.dv-btn:hover { background: var(--dv-brand-3); box-shadow: 0 12px 28px rgba(61, 47, 41, .28); }
.dv-btn:active { transform: scale(.99); }

.dv-chip {
	display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px;
	border-radius: 6px; background: var(--dv-soft-2); color: var(--dv-muted); font-size: 12px; white-space: nowrap;
	transition: background var(--dv-fast), color var(--dv-fast);
}
a.dv-chip:hover { background: var(--dv-accent-soft); color: var(--dv-brand); }
.dv-badge {
	position: absolute; left: 16px; top: 16px; z-index: 2; padding: 3px 9px; border-radius: 6px;
	border: 1px solid rgba(0, 0, 0, .25); background: rgba(255, 255, 255, .85); color: var(--dv-ink);
	font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
}
.dv-tag { display: inline-flex; height: 30px; align-items: center; padding: 0 14px; border-radius: 999px; background: var(--dv-brand); color: #fff; font-size: 13px; font-weight: 500; }

/* Yatay kaydırmalı şerit */
.dv-rail {
	--per: 3;
	display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - (var(--per) - 1) * 20px) / var(--per));
	gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
	overscroll-behavior-x: contain; padding: 2px; margin: -2px;
}
.dv-rail::-webkit-scrollbar { display: none; }
.dv-rail > * { scroll-snap-align: start; min-width: 0; }

/* Ürün kartı: içe alınmış görsel, etiket, özellik satırı, alt eylemler */
.dv-card {
	display: flex; flex-direction: column; height: 100%; padding: 10px; border: 1px solid var(--dv-line);
	border-radius: var(--dv-r); background: #fff;
	transition: box-shadow var(--dv-normal) var(--dv-ease), border-color var(--dv-normal), transform var(--dv-normal) var(--dv-ease);
}
.dv-card:hover { box-shadow: var(--dv-shadow); border-color: transparent; transform: translateY(-3px); }
.dv-card__media { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 14px; background: var(--dv-soft-2); }
.dv-card__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .35s, transform .8s var(--dv-ease); }
.dv-card__media img.is-on { opacity: 1; }
.dv-card:hover .dv-card__media img.is-on { transform: scale(1.04); }
.dv-card__bars { position: absolute; left: 14px; right: 14px; bottom: 12px; display: flex; gap: 4px; z-index: 2; }
.dv-card__bars i { flex: 1; height: 2px; border-radius: 2px; background: rgba(255, 255, 255, .4); transition: background var(--dv-fast); }
.dv-card__bars i.is-on { background: #fff; }
.dv-card__body { display: flex; flex-direction: column; gap: 6px; padding: 16px 10px 6px; flex: 1; }
.dv-card__cat { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--dv-taupe); }
.dv-card__title { font-size: 17px; font-weight: 500; }
.dv-card__title a { transition: color var(--dv-fast); }
.dv-card__title a:hover { color: var(--dv-accent); }
.dv-card__specs { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 4px; font-size: 13px; color: var(--dv-muted); }
.dv-card__specs li { display: inline-flex; align-items: center; gap: 6px; }
.dv-card__specs .dv-ico { color: var(--dv-taupe); }
.dv-card__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 16px; border-top: 1px dashed var(--dv-greige-2); }
.dv-card__body > .dv-card__foot { margin-top: auto; }
.dv-card__specs + .dv-card__foot, .dv-card__title + .dv-card__foot { margin-top: 14px; }
.dv-card__more { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 500; color: var(--dv-ink); }
.dv-card__more .dv-ico { transition: transform var(--dv-fast); }
.dv-card__more:hover .dv-ico { transform: translateX(4px); }
.dv-card__wa {
	display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px 0 12px; border-radius: 999px;
	background: var(--dv-brand); color: #fff; font-size: 13px; font-weight: 500;
	transition: background var(--dv-fast), box-shadow var(--dv-fast);
}
.dv-card__wa:hover { background: var(--dv-wa); box-shadow: 0 8px 20px rgba(31, 157, 85, .3); }

.dv-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 20px; }

/* Sayfa başlığı bandı */
.dv-pagehead { background: linear-gradient(180deg, var(--dv-greige), var(--dv-soft) 85%); padding: calc(var(--dv-header-h) + 52px) 0 32px; border-bottom: 1px solid var(--dv-line); }
.dv-pagehead__row { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.dv-pagehead__title { font-size: 30px; font-weight: 300; margin-top: 14px; letter-spacing: -.02em; }
.dv-pagehead__title small { font-size: 13px; color: var(--dv-faint); font-weight: 400; margin-left: 6px; }
.dv-pagehead__meta { display: block; color: var(--dv-faint); font-size: 13px; margin-top: 4px; }
.dv-crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 0; padding: 0; list-style: none; font-size: 13px; color: var(--dv-muted); }
.dv-crumbs a { display: inline-flex; align-items: center; gap: 8px; transition: color var(--dv-fast); }
.dv-crumbs a:hover { color: var(--dv-ink); }
.dv-crumbs [aria-current] { color: var(--dv-ink); }

/* Metin içerikleri */
.dv-prose { color: var(--dv-muted); font-size: 15px; line-height: 1.75; }
.dv-prose > * + * { margin-top: 1em; }
.dv-prose h2, .dv-prose h3 { color: var(--dv-ink); font-size: 18px; margin-top: 1.6em; }
.dv-prose a { color: var(--dv-accent); text-decoration: underline; text-underline-offset: 3px; }
.dv-prose strong { color: var(--dv-ink); font-weight: 500; }
.dv-prose ol, .dv-prose ul { padding-left: 1.3em; }
.dv-prose--page { max-width: 820px; margin-inline: auto; }
.dv-cover { border-radius: var(--dv-r-lg); overflow: hidden; margin-bottom: 40px; }
.dv-seo-text { font-size: 13px; }
.dv-note { padding: 14px 18px; border-radius: var(--dv-r-sm); background: var(--dv-accent-soft); color: var(--dv-brand); font-size: 13px; }

.dv-empty { text-align: center; padding: 72px 24px; border: 1px dashed var(--dv-line-2); border-radius: var(--dv-r); display: grid; justify-items: center; gap: 12px; }
.dv-empty h2 { font-size: 20px; }
.dv-empty p { color: var(--dv-muted); }

.nav-links { display: flex; justify-content: center; gap: 8px; margin-top: 40px; }
.nav-links .page-numbers { min-width: 46px; height: 46px; display: inline-grid; place-items: center; padding: 0 14px; border: 1px solid var(--dv-line); border-radius: 999px; }
.nav-links .page-numbers.current { background: var(--dv-ink); color: #fff; border-color: var(--dv-ink); }

.dv-404 { text-align: center; padding-top: calc(var(--dv-header-h) + 60px); display: grid; justify-items: center; gap: 14px; }
.dv-404__code { font-size: clamp(90px, 16vw, 180px); font-weight: 300; line-height: 1; color: var(--dv-line-2); letter-spacing: -.04em; }
.dv-404 h1 { font-size: 26px; }
.dv-404 p { color: var(--dv-muted); max-width: 520px; }
.dv-404__actions { display: flex; gap: 10px; margin-top: 10px; }

@media (max-width: 1100px) {
	.dv-rail { --per: 2.3; }
	.dv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 991px) {
	.dv-hide-md { display: none !important; }
	.dv-section { margin-block: 56px; }
}
@media (max-width: 640px) {
	:root { --dv-gutter: 16px; --dv-header-h: 64px; }
	.dv-hide-sm { display: none !important; }
	.dv-rail { --per: 1.15; gap: 14px; grid-auto-columns: calc((100% - (var(--per) - 1) * 14px) / var(--per)); }
	.dv-grid { grid-template-columns: 1fr; }
	.dv-section { margin-block: 44px; }
	.dv-title { font-size: 18px; }
	.dv-head { margin-bottom: 16px; }
	.dv-arrows { display: none; }
	.dv-pagehead { padding-top: calc(var(--dv-header-h) + 32px); }
}
@media (min-width: 1280px) {
	.dv-hide-lg-up { display: none !important; }
}
@media (max-width: 1279px) {
	.dv-hide-lg { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; scroll-behavior: auto !important; }
}