/*
Theme Name: Evim Mobilya
Theme URI: https://evimmobilya.com.tr
Author: 4U Digital Media
Author URI: https://4udigitalmedia.com
Description: Evim Mobilya için özel WordPress teması — "Çizgiden Eve" konsepti. Ürün katalog + kurumsal tanıtım + showroom yönlendirme (satış/sepet yok).
Version: 0.5.0
License: Tüm hakları saklıdır
Text Domain: evim-mobilya
*/

/* ==========================================================================
   0. TOKENS — docs/design/design-dna.md §5.1/§6 + onaylı docs/preview/*.html
   ile BİREBİR aynı olmalı. Değiştirilecekse önce design-dna.md güncellenir.
   ========================================================================== */
:root{
  /* ── OMURGA (logo türevi) ─────────────────────────── */
  --color-ink:            #14120F;
  --color-ink-pure:       #000000;
  --color-ink-elevated:   #211E19;
  --color-paper:          #F5F2EC;
  --color-paper-warm:     #EDE7DD;
  --color-sand:           #DED5C7;

  /* ── ÇİZGİ (logonun kalemi) ───────────────────────── */
  --color-line:           #D8D0C4;
  --color-line-strong:    #8A7F6E;
  --color-line-dark:      #3A352E;
  --color-line-dark-str:  #6B6255;

  /* ── METİN ────────────────────────────────────────── */
  --color-text:           #14120F;
  --color-text-soft:      #4A443C;
  --color-text-muted:     #6E655C;
  --color-on-ink:         #F5F2EC;
  --color-on-ink-muted:   #A8A093;

  /* ── VURGU: AHŞAP / CLAY ──────────────────────────── */
  --color-clay:           #9A6E4E;
  --color-clay-deep:      #7E5739;
  --color-clay-light:     #C89B76;

  /* ── KISITLI ÜÇÜNCÜL ──────────────────────────────── */
  --color-sage:           #5E684F;

  /* ── DURUM ────────────────────────────────────────── */
  --color-error:          #9B2C1F;
  --color-success:        #4A6B4F;

  /* ── ÖRTÜ ─────────────────────────────────────────── */
  --scrim:                rgba(20,18,15,.55);
  --scrim-soft:           rgba(20,18,15,.28);

  /* ── FONT (self-host — assets/fonts/, @font-face aşağıda) ─────────── */
  --font-body: "Fraunces","Fraunces Fallback",Georgia,"Times New Roman",serif;
  --font-ui:   "Jost","Jost Fallback","Futura","Century Gothic",system-ui,sans-serif;
  --vf-display: "SOFT" 40, "WONK" 0;
  --vf-body:    "SOFT" 40, "WONK" 0;

  /* ── TİP ÖLÇEĞİ (fluid, mobil-first) — design-dna.md §4.3 ─────────── */
  --fs-hero:     clamp(2.75rem, 9vw, 7.5rem);
  --fs-display:  clamp(2.25rem, 6vw, 5rem);
  --fs-h2:       clamp(1.75rem, 3.6vw, 3rem);
  --fs-h3:       clamp(1.375rem, 2.2vw, 1.75rem);
  --fs-lead:     clamp(1.125rem, 1.6vw, 1.375rem);
  --fs-body:     clamp(1.0625rem, 1.1vw, 1.125rem);
  --fs-small:    0.9375rem;
  --fs-eyebrow:  0.75rem;
  --fs-meta:     0.8125rem;
  --fs-nav:      0.8125rem;
  --fs-h1-page:  clamp(2.25rem, 5vw, 4rem);
  --fs-micro:    0.6875rem;
  --measure:       62ch;
  --measure-tight: 46ch;

  /* ── RİTİM — 4px taban, kasıtlı sıçramalı ramp ────────────────────── */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px;
  --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px; --s-11:180px;

  --gap-section:        clamp(72px, 9vw, 152px);
  --gap-section-tight:  clamp(48px, 5.5vw, 88px);
  --gutter:             clamp(20px, 5vw, 72px);
  --container:          1440px;
  --container-text:     720px;
  --container-wide:     1720px;
  --nav-height:         68px;
  --radius:             0;

  --sticky-top:   calc(var(--nav-height) + var(--s-5));
  --sticky-band:  calc(var(--nav-height) + 54px + 16px);
  --frame-offset: 10px;

  --dur-fast: .22s;  --dur: .4s;  --dur-slow: .7s;
  --dur-draw: 1.4s;  --dur-hex:  .5s;
  --ease-out: cubic-bezier(.22,1,.36,1);

  --ph-tone: var(--color-sand);
}
@media (min-width:900px){ :root{ --nav-height:88px; } }

/* ==========================================================================
   0b. FONT-FACE — self-host, latin+latin-ext subset (KVKK + performans)
   wp-plan.md §5.4: opsz 14..144 / wght 300..600 (SOFT 40 / WONK 0 sabit
   instance edildi, dosya boyutu düşürüldü — CSS'te font-variation-settings
   yine de yazılır, zararsız, eksen aralığı korunuyor).
   ========================================================================== */
@font-face{
  font-family:"Fraunces";
  src:url("assets/fonts/fraunces-variable.woff2") format("woff2-variations"),
      url("assets/fonts/fraunces-variable.woff2") format("woff2");
  font-weight:300 600;
  font-style:normal;
  font-display:swap;
  unicode-range:U+0000-00FF,U+0100-024F,U+2018-201E,U+2026,U+2013-2014;
}
@font-face{
  font-family:"Fraunces";
  src:url("assets/fonts/fraunces-italic-variable.woff2") format("woff2-variations"),
      url("assets/fonts/fraunces-italic-variable.woff2") format("woff2");
  font-weight:300 600;
  font-style:italic;
  font-display:swap;
  unicode-range:U+0000-00FF,U+0100-024F,U+2018-201E,U+2026,U+2013-2014;
}
@font-face{
  font-family:"Jost";
  src:url("assets/fonts/jost-variable.woff2") format("woff2-variations"),
      url("assets/fonts/jost-variable.woff2") format("woff2");
  font-weight:300 500;
  font-style:normal;
  font-display:swap;
  unicode-range:U+0000-00FF,U+0100-024F,U+2018-201E,U+2026,U+2013-2014;
}

/* ==========================================================================
   1. RESET + BASE
   ========================================================================== */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0; background:var(--color-paper); color:var(--color-text);
  font-family:var(--font-body); font-variation-settings:var(--vf-body);
  font-size:var(--fs-body); line-height:1.75; font-weight:400;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img,svg{ display:block; max-width:100%; }
a{ color:inherit; }
h1,h2,h3,dl,dd,p,ol,ul{ margin:0; }
ol,ul{ list-style:none; padding:0; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; padding:0; }
input,textarea{ font:inherit; }
:focus-visible{ outline:2px solid var(--color-clay-deep); outline-offset:3px; }
.on-ink :focus-visible, [data-tone="dark"] :focus-visible{ outline-color:var(--color-clay-light); }
h1,h2,h3{ font-family:var(--font-body); font-variation-settings:var(--vf-display); font-weight:400; }

.sr-only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

.skip-link{
  position:fixed; top:-100px; left:var(--s-4); z-index:9998;
  background:var(--color-ink); color:var(--color-on-ink); padding:14px 20px;
  font:500 var(--fs-nav)/1 var(--font-ui); text-transform:uppercase; letter-spacing:.1em;
  transition:top var(--dur-fast) var(--ease-out);
}
.skip-link:focus{ top:var(--s-4); }

/* Reveal sistemi — JS yoksa içerik görünür kalır (assets/js/animations.js) */
html:not(.js) [data-reveal]{ opacity:1 !important; transform:none !important; }
.js [data-reveal]{ opacity:0; transform:translateY(28px); }
.js [data-reveal].is-in{ opacity:1; transform:translateY(0);
  transition:opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out); }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .js [data-reveal]{ opacity:1 !important; transform:none !important; transition:none !important; }
}

/* ==========================================================================
   2. UTILITY
   ========================================================================== */
.wrap      { width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter); }
.wrap--wide{ max-width:var(--container-wide); }
.wrap--text{ max-width:var(--container-text); }
.bleed     { margin-inline:calc(var(--gutter) * -1); }

/* ==========================================================================
   3. GLOBAL BİLEŞENLER — wp-plan.md §2 (tüm sayfalarda tekrarlar)
   ========================================================================== */

/* --- sec-head (label-in-rule, motif B) --- */
.sec-head{ display:grid; grid-template-columns:auto 1fr; align-items:center; gap:var(--s-4); }
.sec-head__eyebrow{ font:500 var(--fs-eyebrow)/1.15 var(--font-ui); text-transform:uppercase;
  letter-spacing:.18em; color:var(--color-text-muted); white-space:nowrap; }
.sec-head__rule{ height:1px; background:var(--color-line); transform:scaleX(0); transform-origin:left; }
.js .sec-head__rule.is-in{ transform:scaleX(1); transition:transform .6s var(--ease-out); }
.sec-head__title{ grid-column:1 / -1; margin-top:var(--s-4); font-size:var(--fs-h2); max-width:22ch; line-height:1.1; letter-spacing:-.02em; }
.sec-head--dark .sec-head__eyebrow{ color:var(--color-on-ink-muted); }
.sec-head--dark .sec-head__rule{ background:var(--color-line-dark); }
.sec-head--dark .sec-head__title{ color:var(--color-on-ink); }
.sec-head--end{ text-align:right; justify-content:end; }

/* --- .btn (radius 0, pill değil — sistem kuralı) --- */
.btn{ position:relative; display:inline-flex; align-items:center; gap:var(--s-3);
  min-height:48px; padding:15px 28px; overflow:hidden;
  font:500 var(--fs-nav)/1.15 var(--font-ui); text-transform:uppercase; letter-spacing:.14em;
  color:var(--color-ink); background:transparent; border:1px solid var(--color-ink);
  text-decoration:none; }
.btn::before{ content:""; position:absolute; inset:0; background:var(--color-clay-deep);
  transform:scaleY(0); transform-origin:bottom; transition:transform .35s var(--ease-out); z-index:0; }
.btn > *{ position:relative; z-index:1; }
.btn:hover::before, .btn:focus-visible::before{ transform:scaleY(1); }
.btn:hover, .btn:focus-visible{ color:var(--color-paper); border-color:var(--color-clay-deep); }
.btn--on-ink{ color:var(--color-on-ink); border-color:var(--color-line-dark-str); }
.btn--on-ink::before{ background:var(--color-clay); }
.btn--on-ink:hover, .btn--on-ink:focus-visible{ color:var(--color-ink); border-color:var(--color-clay); }

/* --- .link-line / .link-arrow --- */
.link-line{ position:relative; color:var(--color-clay-deep); text-decoration:none; }
.link-line::after{ content:""; position:absolute; left:0; right:0; bottom:-3px; height:1px;
  background:currentColor; transform:scaleX(0); transform-origin:left;
  transition:transform .3s var(--ease-out); }
.link-line:hover::after, .link-line:focus-visible::after{ transform:scaleX(1); }

.link-arrow{ display:inline-flex; align-items:center; gap:var(--s-3); text-decoration:none;
  font:500 var(--fs-nav)/1 var(--font-ui); text-transform:uppercase; letter-spacing:.14em; }
.link-arrow__u{ position:relative; }
.link-arrow__u::after{ content:""; position:absolute; left:0; right:0; bottom:-4px; height:1px;
  background:currentColor; transform:scaleX(1); transform-origin:left; transition:transform .25s var(--ease-out); }
.link-arrow:hover .link-arrow__u::after, .link-arrow:focus-visible .link-arrow__u::after{ transform:scaleX(0); transform-origin:right; }
.link-arrow svg{ width:14px; height:14px; flex:0 0 auto; transition:transform .25s var(--ease-out); }
.link-arrow:hover svg, .link-arrow:focus-visible svg{ transform:translateX(5px); }

/* --- .hairline --- */
.hairline{ height:1px; background:var(--color-line); border:0; }
.hairline--dark{ background:var(--color-line-dark); }
.hairline[data-animate="1"]{ transform:scaleX(0); transform-origin:left; }
.js .hairline[data-animate="1"].is-in{ transform:scaleX(1); transition:transform .6s var(--ease-out); }

/* --- .title-block (pafta tablosu) --- */
.title-block{ display:grid; }
.title-block__row{ display:grid; grid-template-columns:1fr; gap:var(--s-1);
  border-top:1px solid var(--color-line); padding-block:var(--s-4); }
.title-block__row:last-child{ border-bottom:1px solid var(--color-line); }
.title-block__label{ font:500 var(--fs-eyebrow)/1.15 var(--font-ui); text-transform:uppercase;
  letter-spacing:.18em; color:var(--color-text-muted); }
.title-block__value{ font-size:var(--fs-body); color:var(--color-text); }
.title-block__value a{ text-decoration:none; }
@media (min-width:600px){
  .title-block__row{ grid-template-columns:minmax(112px,24%) 1fr; gap:var(--s-5); align-items:baseline; }
}
.title-block--dark .title-block__row{ border-color:var(--color-line-dark); }
.title-block--dark .title-block__label{ color:var(--color-on-ink-muted); }
.title-block--dark .title-block__value{ color:var(--color-on-ink); }

/* --- .frame (görsel sarmalayıcı) --- */
.frame{ position:relative; overflow:hidden; background:var(--color-sand); }
.frame img{ display:block; width:100%; height:100%; object-fit:cover; }
.frame--r45{ aspect-ratio:4/5; } .frame--r34{ aspect-ratio:3/4; } .frame--r11{ aspect-ratio:1/1; }
.frame--r32{ aspect-ratio:3/2; } .frame--r169{ aspect-ratio:16/9; } .frame--r23{ aspect-ratio:2/3; }
.frame--offset{ position:relative; }
.frame--offset::after{ content:""; position:absolute;
  inset: var(--frame-offset) calc(var(--frame-offset) * -1) calc(var(--frame-offset) * -1) var(--frame-offset);
  border:1px solid var(--color-line-strong); opacity:0;
  transition:opacity var(--dur) var(--ease-out); pointer-events:none; }
a:hover .frame--offset::after, a:focus-visible .frame--offset::after{ opacity:1; }

/* --- .ph (placeholder rozeti — TEMSİLİ, canlıya çıkışta grep ile temizlenir) --- */
.ph{ position:relative; }
.ph::after{ content:"TEMSİLİ GÖRSEL"; position:absolute; left:10px; bottom:8px;
  font-family:var(--font-ui); font-size:var(--fs-micro); font-weight:500;
  letter-spacing:.14em; text-transform:uppercase; color:var(--color-on-ink-muted);
  background:var(--scrim); padding:3px 7px; pointer-events:none; z-index:2; }
.ph--drawn{ display:grid; place-items:center; background:var(--ph-tone); }
.ph--drawn::after{ display:none; }
.ph--drawn::before{ content:""; position:absolute; inset:0;
  background:linear-gradient(to top right, transparent calc(50% - .5px),
              var(--color-line-strong) 50%, transparent calc(50% + .5px)); opacity:.5; }
.ph--drawn > span{ position:relative; z-index:1; font-family:var(--font-ui); font-size:var(--fs-meta);
  letter-spacing:.1em; text-transform:uppercase; color:var(--color-text-muted); text-align:center; padding:0 var(--s-4); }

/* --- hexagon (logo motifi — inline SVG, currentColor) --- */
.hex-mark{ fill:none; stroke:currentColor; vector-effect:non-scaling-stroke; }

/* ==========================================================================
   4. HEADER (S0) — LESSON: şeffaf sadece .home, curtain görünür başlar
   ========================================================================== */
.site-header{
  position:fixed; inset-block-start:0; inset-inline:0; z-index:100;
  height:var(--nav-height); color:var(--color-paper);
  transition:background var(--dur) var(--ease-out), border-color var(--dur) var(--ease-out),
             height var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
}
.site-header__inner{ height:100%; display:flex; align-items:center; justify-content:space-between;
  padding-inline:var(--gutter); }
/* Ana sayfa varsayılan: şeffaf üstünde (lessons-learned: sadece .home'da) */
body.home .site-header{ background:transparent; border-bottom:1px solid transparent; }
body.home .site-header.is-scrolled{
  background:rgba(245,242,236,.94); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--color-line); color:var(--color-ink);
}
/* İç sayfalar: varsayılan koyu (LESSON — Lucezza: header şeffaflığı sadece anasayfada) */
body:not(.home) .site-header{
  background:rgba(245,242,236,.94); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--color-line); color:var(--color-ink);
}

.brand{ display:flex; align-items:center; gap:var(--s-3); text-decoration:none; color:currentColor; }
.brand__hex{ width:26px; height:26px; }
.brand__div{ width:1px; height:18px; background:currentColor; opacity:.3; }
.brand__word{ font-family:var(--font-ui); font-weight:500; font-size:1.05rem; letter-spacing:.01em; line-height:1; }
@media (min-width:900px){ .brand__hex{ width:30px; height:30px; } .brand__word{ font-size:1.2rem; } }

.nav-primary{ display:none; }
.nav-list{ display:flex; gap:var(--s-6); }
.nav-list a{ position:relative; display:inline-block; padding-block:14px;
  font:400 var(--fs-nav)/1.15 var(--font-ui); text-transform:uppercase; letter-spacing:.14em;
  text-decoration:none; color:currentColor; transition:color var(--dur) var(--ease-out); }
.nav-list a::after{ content:""; position:absolute; left:0; right:0; bottom:8px; height:1px;
  background:currentColor; transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease-out); }
.nav-list a:hover, .nav-list a:focus-visible{ color:var(--color-clay-deep); }
body.home .site-header:not(.is-scrolled) .nav-list a:hover,
body.home .site-header:not(.is-scrolled) .nav-list a:focus-visible{ color:var(--color-clay-light); }
.nav-list a:hover::after, .nav-list a:focus-visible::after{ transform:scaleX(1); }
.nav-list a[aria-current="page"]::after{ transform:scaleX(1); opacity:.55; }

.site-header__act{ display:flex; align-items:center; gap:var(--s-4); }
.nav-wa{ width:44px; height:44px; display:grid; place-items:center;
  border:1px solid currentColor; opacity:1; text-decoration:none; color:currentColor;
  transition:background var(--dur) var(--ease-out), color var(--dur) var(--ease-out), border-color var(--dur) var(--ease-out); }
.nav-wa svg{ width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:1.25; }
.nav-wa:hover, .nav-wa:focus-visible{ background:var(--color-clay-deep); border-color:var(--color-clay-deep); color:var(--color-paper); }

.nav-toggle{ width:44px; height:44px; display:grid; place-items:center; gap:6px; }
.nav-toggle span{ display:block; width:20px; height:1px; background:currentColor; transition:transform .3s var(--ease-out), opacity .3s var(--ease-out); }
.nav-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(3.5px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2){ transform:translateY(-3.5px) rotate(-45deg); }

@media (min-width:900px){
  .nav-primary{ display:block; }
  .nav-toggle{ display:none; }
}

/* --- mobil overlay --- */
.nav-overlay{ position:fixed; inset:0; z-index:99; background:var(--color-ink); visibility:hidden; }
.nav-overlay__inner{ height:100%; display:grid; align-content:space-between;
  padding:calc(var(--nav-height) + var(--s-7)) var(--gutter) var(--s-8); }
.nav-overlay__list a{ display:block; padding-block:var(--s-5); border-top:1px solid var(--color-line-dark);
  font-size:var(--fs-h2); color:var(--color-on-ink); text-decoration:none; }
.nav-overlay__list li:last-child a{ border-bottom:1px solid var(--color-line-dark); }
.nav-overlay__list a:hover, .nav-overlay__list a:focus-visible{ color:var(--color-clay-light); }
.nav-overlay__foot .title-block__label, .nav-overlay__foot .title-block__value{ color:var(--color-on-ink-muted); }
@media (min-width:900px){ .nav-overlay{ display:none; } }

/* --- WhatsApp float --- */
.wa-float{ position:fixed; right:var(--s-5); bottom:max(var(--s-5), env(safe-area-inset-bottom)); z-index:90;
  width:48px; height:48px; display:grid; place-items:center; overflow:hidden;
  background:var(--color-ink); color:var(--color-paper); border:1px solid var(--color-line-dark-str);
  text-decoration:none; }
.wa-float::before{ content:""; position:absolute; inset:0; background:var(--color-clay);
  transform:scaleY(0); transform-origin:bottom; transition:transform .35s var(--ease-out); z-index:0; }
.wa-float svg{ position:relative; z-index:1; width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:1.25; }
.wa-float:hover::before, .wa-float:focus-visible::before{ transform:scaleY(1); }

/* --- curtain (sayfa girişi/geçişi — spec: CSS'te GÖRÜNÜR başlar, transform yok) --- */
.page-curtain{ position:fixed; inset:0; z-index:9999; pointer-events:none; }
.page-curtain__panel{ position:absolute; inset:0; background:var(--color-ink); }

/* ==========================================================================
   5. PAGE-HEAD (iç sayfalar — sade, koyu; LESSON: hero görseli zorlama)
   ========================================================================== */
.page-head{ background:var(--color-ink); color:var(--color-on-ink);
  padding:calc(var(--nav-height) + var(--s-9)) var(--gutter) var(--s-8);
  border-bottom:1px solid var(--color-line-dark-str); }
.page-head__eyebrow{ font:500 var(--fs-eyebrow)/1.15 var(--font-ui); text-transform:uppercase;
  letter-spacing:.18em; color:var(--color-on-ink-muted); margin-bottom:var(--s-4); }
.page-head__title{ font-size:var(--fs-h1-page); line-height:1.05; letter-spacing:-.02em; max-width:18ch; }
.page-head__lead{ margin-top:var(--s-5); font-size:var(--fs-lead); color:var(--color-on-ink-muted);
  max-width:var(--measure-tight); }

/* ==========================================================================
   6. FOOTER (S8) — zemin #000, kırpılmış wordmark
   ========================================================================== */
.site-footer{ background:var(--color-ink-pure); color:var(--color-on-ink); padding:var(--s-9) var(--gutter) 0; }
@media (min-width:900px){ .site-footer{ padding-top:var(--s-10); } }

.footer-grid{ display:grid; grid-template-columns:1fr; gap:var(--s-7); }
@media (min-width:1200px){
  .footer-grid{ grid-template-columns:minmax(0,5fr) minmax(0,3fr) minmax(0,4fr); align-items:end; gap:var(--s-8); }
  .footer-nav, .footer-contact{ border-left:1px solid var(--color-line-dark); padding-left:var(--s-7); }
}
.footer-mark{ display:grid; gap:var(--s-5); }
.footer-mark svg{ width:52px; height:52px; }
.footer-mark p{ font-size:var(--fs-h3); max-width:24ch; color:var(--color-on-ink); }
.footer-nav ul{ display:grid; gap:var(--s-3); }
.footer-nav a{ position:relative; text-decoration:none; color:var(--color-on-ink-muted); font:400 var(--fs-nav)/1.4 var(--font-ui); text-transform:uppercase; letter-spacing:.12em; }
.footer-nav a:hover, .footer-nav a:focus-visible{ color:var(--color-clay-light); }
.footer-contact .title-block__row{ padding-block:var(--s-3); }

.footer-wordmark{ overflow:hidden; height:clamp(52px,11vw,132px); margin-top:var(--s-9); }
.footer-wordmark svg{ display:block; width:116%; margin-left:-8%; height:auto; fill:var(--color-on-ink); opacity:.82; }

.footer-bottom{ border-top:1px solid var(--color-line-dark); margin-top:var(--s-6); padding-block:var(--s-5);
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--s-3);
  font:400 var(--fs-meta)/1.5 var(--font-ui); color:var(--color-on-ink-muted); }
.footer-bottom a{ text-decoration:none; }
.footer-bottom a:hover{ color:var(--color-clay-light); }

/* ==========================================================================
   7. S1 — EŞİK (hero) — docs/preview/index.html ile birebir (Sprint W3)
   ========================================================================== */
.s-esik{ position:relative; overflow:hidden; height:88svh; min-height:560px; }
@media (min-width:900px){ .s-esik{ height:100svh; } }

.esik__media{ position:absolute; inset:0; }
.esik__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity 1.2s var(--ease-out); }
.esik__media img.is-active{ opacity:1; }
.esik__scrim{ position:absolute; inset:0;
  background:linear-gradient(to top, rgba(20,18,15,.66) 0%, rgba(20,18,15,.34) 44%, rgba(20,18,15,.10) 100%); }
/* Hero görseli henüz girilmemişse (Evim Ayarları → Marka & Hero) — nötr tam-bleed placeholder */
.esik__media > .ph--drawn{ position:absolute; inset:0; }

.esik__hex{ position:absolute; top:calc(var(--nav-height) + 4px); right:-24vw; width:80vw; max-width:940px; opacity:.09; }
@media (min-width:900px){
  .esik__hex{ top:50%; right:-14vw; transform:translateY(-50%); width:62vw; opacity:.14; }
}

.esik__inner{ position:relative; z-index:2; height:100%; display:grid; grid-template-columns:repeat(12,1fr);
  column-gap:var(--s-5); align-items:end;
  padding: calc(var(--nav-height) + var(--s-6)) var(--gutter) clamp(40px,7vh,96px); }
.esik__type{ grid-column:1 / -1; }
@media (min-width:900px){ .esik__type{ grid-column:1 / 10; } }
@media (min-width:1200px){ .esik__type{ grid-column:2 / 8; } }

.esik__eyebrow{ font:500 var(--fs-eyebrow)/1.15 var(--font-ui); text-transform:uppercase; letter-spacing:.18em;
  color:var(--color-paper); opacity:.78; margin-bottom:var(--s-5); }
.esik__title{ font-size:var(--fs-hero); font-variation-settings:"SOFT" 40,"WONK" 0; line-height:.98;
  letter-spacing:-.03em; color:var(--color-on-ink); max-width:15ch; }
.esik__title .line{ display:block; overflow:hidden; }
.esik__title .line span{ display:block; }
.esik__rule{ width:min(220px,42vw); height:1px; background:var(--color-paper); opacity:.5;
  margin:var(--s-6) 0 var(--s-5); transform-origin:left; }
.esik__cta{ color:var(--color-paper); }
.esik__cta:hover, .esik__cta:focus-visible{ color:var(--color-clay-light); }

/* ==========================================================================
   8. S2 — SÖZ (manifesto)
   ========================================================================== */
.s-soz{ background:var(--color-paper); padding-block:var(--gap-section-tight); max-width:var(--container-wide); margin-inline:auto; }
.soz__inner{ max-width:1180px; margin-inline:var(--gutter); }
@media (min-width:900px){
  .soz__inner{ margin-left:clamp(20px,8vw,140px); margin-right:var(--gutter); }
}
.soz__line{ display:block; font-size:var(--fs-display); font-variation-settings:"SOFT" 40,"WONK" 0;
  line-height:1.02; letter-spacing:-.025em; color:var(--color-text); }
.soz__line--2{ font-style:italic; text-indent:3ch; }
@media (min-width:600px){ .soz__line--2{ text-indent:6ch; } }
.soz__hex{ display:inline-block; width:.6em; height:.6em; margin-inline:.3em; vertical-align:.02em; }
.soz__hex .hex-mark{ stroke:var(--color-clay); }
.soz__note{ font:400 var(--fs-meta)/1.7 var(--font-ui); letter-spacing:.06em; color:var(--color-text-muted);
  max-width:46ch; margin:var(--s-5) 0 0 auto; }
.soz__hairline{ margin-top:var(--s-8); }

/* ==========================================================================
   9. S3 — FİHRİST (imza bölüm)
   ========================================================================== */
.s-fihrist{ background:var(--color-paper); padding-block:var(--gap-section-tight) var(--gap-section); }
.s-fihrist .sec-head{ margin-bottom:var(--s-9); }

.fihrist{ display:grid; grid-template-columns:1fr; gap:var(--s-7); }
@media (min-width:900px){
  .fihrist{ grid-template-columns:minmax(0,1fr) 46%; column-gap:clamp(40px,5vw,96px); align-items:start; }
}

.fihrist__row{ border-top:1px solid var(--color-line-strong); }
.fihrist__row:last-child{ border-bottom:1px solid var(--color-line-strong); }
.fihrist__link{ display:grid; grid-template-columns:auto 1fr; column-gap:var(--s-4);
  align-items:baseline; padding-block:var(--s-6); text-decoration:none; color:var(--color-text); }
@media (min-width:600px){ .fihrist__link{ grid-template-columns:auto 1fr auto; } }
.fihrist__idx{ font:400 var(--fs-eyebrow)/1.15 var(--font-ui); letter-spacing:.18em; color:var(--color-text-muted); }
.fihrist__name{ font-size:var(--fs-h2); line-height:1.1; letter-spacing:-.02em; display:inline-block;
  transition:color var(--dur) var(--ease-out), transform var(--dur) var(--ease-out); }
.fihrist__count{ grid-column:2; margin-top:var(--s-1); font:400 var(--fs-meta)/1.5 var(--font-ui);
  letter-spacing:.06em; color:var(--color-text-muted); white-space:nowrap; }
@media (min-width:600px){ .fihrist__count{ grid-column:auto; margin-top:0; } }
.fihrist__note{ grid-column:2 / -1; margin-top:var(--s-2); font-size:var(--fs-small); font-style:italic; color:var(--color-text-muted); }
.fihrist__thumb{ grid-column:1 / -1; margin-top:var(--s-5); }
@media (min-width:900px){ .fihrist__thumb{ display:none; } }
.fihrist__row.is-active .fihrist__name{ color:var(--color-clay-deep); transform:translateX(10px); }
.fihrist__row.is-dim{ opacity:.35; transition:opacity .3s var(--ease-out); }

.fihrist__stage{ display:none; }
@media (min-width:900px){
  .fihrist__stage{ display:block; position:sticky; top:var(--sticky-top); aspect-ratio:4/5; overflow:visible; }
}
.fihrist__slab{ position:absolute; inset:0; }
.fihrist__slab img{ transition:opacity .45s var(--ease-out), transform .45s var(--ease-out); }
.fihrist__slab-off{ position:absolute; right:-32px; bottom:-32px; width:42%; z-index:2;
  outline:1px solid var(--color-paper); outline-offset:0; }
.fihrist__hex{ position:absolute; inset:-18px; width:calc(100% + 36px); height:calc(100% + 36px); z-index:3; pointer-events:none; }
.fihrist__hex .hex-mark{ stroke:var(--color-clay); stroke-width:1; }

.fihrist__foot{ display:flex; justify-content:flex-end; margin-top:var(--s-7); }

/* ==========================================================================
   10. S4 — VİTRİN (filmstrip)
   ========================================================================== */
.s-vitrin{ background:var(--color-paper-warm); padding-block:var(--gap-section); }
.s-vitrin .sec-head{ margin-bottom:var(--s-8); }

.vitrin__track{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--s-4);
  padding-inline:var(--gutter); }
.vitrin__track > a:first-child{ grid-column:span 2; }
@media (min-width:900px){
  .vitrin__track{ display:flex; align-items:end; gap:clamp(16px,2vw,32px); overflow-x:auto;
    overscroll-behavior-x:contain; scroll-snap-type:x proximity; padding-inline:var(--gutter);
    scrollbar-width:none; cursor:grab; }
  .vitrin__track::-webkit-scrollbar{ display:none; }
  .vitrin__track.is-grabbing{ cursor:grabbing; }
  .vitrin__track > a{ flex:0 0 auto; scroll-snap-align:start; width:var(--w,320px); }
  .vitrin__track > a:first-child{ grid-column:auto; }
}
.vitrin__item .frame{ aspect-ratio:var(--ratio,3/4); }
.vitrin__meta{ display:grid; gap:var(--s-1); margin-top:var(--s-4); }
.vitrin__name{ font:500 var(--fs-nav)/1.3 var(--font-ui); text-transform:uppercase; letter-spacing:.12em;
  transition:color var(--dur) var(--ease-out); }
.vitrin__mat{ font-size:var(--fs-small); color:var(--color-text-muted); }
.vitrin__where{ font:500 var(--fs-micro)/1.2 var(--font-ui); text-transform:uppercase; letter-spacing:.16em;
  color:var(--color-clay-deep); margin-top:var(--s-1); }
.vitrin__item{ text-decoration:none; color:var(--color-text); display:block; }
.vitrin__item:hover .vitrin__name, .vitrin__item:focus-visible .vitrin__name{ color:var(--color-clay-deep); }
.vitrin__item:hover .frame img, .vitrin__item:focus-visible .frame img{ transform:scale(1.03); }
.vitrin__item .frame img{ transition:transform .5s var(--ease-out); }

.vitrin__foot{ display:none; }
@media (min-width:900px){
  .vitrin__foot{ display:grid; grid-template-columns:1fr auto; align-items:center; gap:var(--s-5);
    margin-top:var(--s-6); padding-inline:var(--gutter); }
}
.vitrin__progress{ height:1px; background:var(--color-line); position:relative; }
.vitrin__progress span{ position:absolute; inset:0 auto 0 0; height:1px; background:var(--color-clay);
  transform-origin:left; transform:scaleX(0); }
.vitrin__nav{ display:flex; gap:var(--s-3); }
.vitrin__nav button{ width:44px; height:44px; display:grid; place-items:center;
  border:1px solid var(--color-line-strong); transition:background var(--dur) var(--ease-out), color var(--dur) var(--ease-out); }
.vitrin__nav button svg{ width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:1.25; }
.vitrin__nav button:hover:not(:disabled), .vitrin__nav button:focus-visible{ background:var(--color-ink); color:var(--color-paper); border-color:var(--color-ink); }
.vitrin__nav button:disabled{ opacity:.35; cursor:not-allowed; }

/* ==========================================================================
   11. S5 — ÇİZGİ VE ÖLÇÜ (Sprint W4)
   ========================================================================== */
.s-cizgi{ background:var(--color-paper); padding-block:var(--gap-section); }
.cizgi{ display:grid; grid-template-columns:1fr; gap:var(--s-8); }
@media (min-width:900px){
  .cizgi{ grid-template-columns:5fr 7fr; column-gap:clamp(40px,6vw,112px); align-items:center; }
}
.cizgi__art{ width:60vw; margin-inline:auto; }
@media (min-width:900px){ .cizgi__art{ width:calc(100% + 6vw); margin-left:-6vw; margin-inline:0; } }
.cizgi__art svg{ width:100%; height:auto; }
.cizgi__art path, .cizgi__art line, .cizgi__art circle{ transition:stroke var(--dur) var(--ease-out), stroke-width var(--dur) var(--ease-out); }
.cizgi__art .g-target-on path, .cizgi__art .g-target-on line, .cizgi__art .g-target-on circle{ stroke:var(--color-clay) !important; }

.cizgi__dl > div{ border-top:1px solid var(--color-line); padding-block:var(--s-5); cursor:default; }
.cizgi__dl > div:last-child{ border-bottom:1px solid var(--color-line); }
.cizgi__dl dt{ display:flex; align-items:center; gap:var(--s-2); font:500 var(--fs-eyebrow)/1.15 var(--font-ui);
  text-transform:uppercase; letter-spacing:.18em; color:var(--color-text-muted); }
.cizgi__dl dt .hex-mark{ stroke:var(--color-clay); }
.cizgi__dl .hex-glyph{ width:.72em; height:.72em; flex:0 0 auto; }
.cizgi__dl dd{ margin:var(--s-2) 0 0; font-size:var(--fs-body); max-width:52ch; }

/* ==========================================================================
   12. S6 — SHOWROOM PAFTASI (Sprint W4)
   ========================================================================== */
.s-showroom{ background:var(--color-ink); padding-block:var(--gap-section); color:var(--color-on-ink); }
.pafta{ position:relative; border:1px solid var(--color-line-dark-str); padding:clamp(28px,4vw,64px); }
.pafta__title{ position:absolute; top:0; left:clamp(28px,4vw,64px); transform:translateY(-50%);
  background:var(--color-ink); padding-inline:var(--s-4); margin:0; font-size:var(--fs-h3); color:var(--color-on-ink); }
.pafta__grid{ display:grid; grid-template-columns:1fr; gap:var(--s-7); margin-top:var(--s-4); }
@media (min-width:900px){
  .pafta__grid{ grid-template-columns:repeat(12,1fr); column-gap:clamp(24px,3vw,56px); align-items:end; margin-top:0; }
}
@media (min-width:900px){ .pafta__foto{ grid-column:1 / 6; } }
.pafta__foto .frame{ outline:1px solid var(--color-line-dark-str); outline-offset:8px; }
@media (min-width:900px){ .pafta__tb{ grid-column:8 / 13; align-self:end; } }
.pafta__cta{ margin-top:var(--s-6); display:flex; flex-wrap:wrap; gap:var(--s-4); }
@media (min-width:900px){ .pafta__cta{ grid-column:8 / 13; } }
.pafta__note{ grid-column:1 / -1; margin-top:var(--s-4); font:400 var(--fs-micro)/1.5 var(--font-ui); color:var(--color-on-ink-muted); }

.map-cl{ grid-column:1 / -1; margin-top:clamp(32px,4vw,64px); position:relative; overflow:hidden;
  border:1px solid var(--color-line-dark-str); aspect-ratio:4/3; }
@media (min-width:900px){ .map-cl{ aspect-ratio:16/9; } }
.map-cl__poster{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.map-cl__scrim{ position:absolute; inset:0; background:var(--scrim); }
.map-cl__btn{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); }
.map-cl iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.map-cl[data-loaded="1"] .map-cl__poster, .map-cl[data-loaded="1"] .map-cl__scrim, .map-cl[data-loaded="1"] .map-cl__btn{ display:none; }

/* ==========================================================================
   13. S7 — EVLERDE (Sprint W4)
   ========================================================================== */
.s-evlerde{ background:var(--color-paper-warm); padding-block:var(--gap-section); }
.s-evlerde .sec-head{ margin-bottom:var(--s-8); }
.evlerde{ display:grid; grid-template-columns:1fr; gap:var(--s-6); }
.evlerde > *{ width:100%; }
.evlerde .ev-p2{ width:82%; }
.evlerde .ev-p3{ width:92%; margin-left:auto; }
.evlerde .ev-p4{ width:74%; }
.evlerde .ev-p5{ width:100%; }

@media (min-width:900px){
  .evlerde{ grid-template-columns:repeat(8,1fr); grid-auto-rows:auto; gap:clamp(12px,1.6vw,28px); }
  .evlerde > *{ width:auto; margin:0 !important; }
  .ev-p1{ grid-area:1/1/2/5; }
  .ev-p2{ grid-area:1/5/2/9; margin-right:calc(var(--gutter) * -1) !important; }
  .ev-cap{ grid-area:2/1/3/3; align-self:center; }
  .ev-p3{ grid-area:2/3/3/6; }
  .ev-p4{ grid-area:2/6/3/9; margin-top:clamp(24px,4vw,72px) !important; }
  .ev-p5{ grid-area:3/2/4/7; }
  .ev-ig{ grid-area:3/7/4/9; align-self:end; justify-self:end; }
}
@media (min-width:1200px){
  .evlerde{ grid-template-columns:repeat(12,1fr); }
  .ev-p1{ grid-area:1/1/2/6; }
  .ev-p2{ grid-area:1/7/2/13; }
  .ev-cap{ grid-area:2/1/3/4; }
  .ev-p3{ grid-area:2/4/3/8; }
  .ev-p4{ grid-area:2/9/3/13; }
  .ev-p5{ grid-area:3/3/4/9; }
  .ev-ig{ grid-area:3/10/4/13; }
}

.evlerde__cap{ display:grid; gap:var(--s-4); }
.evlerde__cap .hairline{ width:56px; }
.evlerde__cap p{ font-size:var(--fs-lead); font-style:italic; color:var(--color-text-soft); max-width:22ch; }

/* ==========================================================================
   14. KATALOG KÖKÜ (archive-urun.php) — spec-katalog.md §1
   ========================================================================== */
.page-head--katalog{ padding:calc(var(--nav-height) + clamp(48px,7vw,104px)) var(--gutter) clamp(40px,5vw,72px); }
.page-head--katalog .page-head__inner{ max-width:var(--container); margin-inline:auto;
  display:grid; grid-template-columns:1fr; gap:var(--s-5); }
.page-head--katalog .page-head__type h1{ margin:var(--s-3) 0 0; font-size:var(--fs-h1-page); font-weight:400;
  line-height:1.05; letter-spacing:-.025em; color:var(--color-on-ink); }
.page-head--katalog .page-head__lead{ margin:var(--s-4) 0 0; font-size:var(--fs-lead); color:var(--color-on-ink-muted); max-width:46ch; }
.page-head--katalog .page-head__meta{ font:400 var(--fs-meta)/1.5 var(--font-ui); letter-spacing:.06em; color:var(--color-on-ink-muted); }
@media (min-width:900px){
  .page-head--katalog .page-head__inner{ grid-template-columns:repeat(12,1fr); align-items:end; column-gap:var(--s-5); }
  .page-head--katalog .page-head__type{ grid-column:1 / 8; }
  .page-head--katalog .page-head__meta{ grid-column:9 / 13; justify-self:end; text-align:right; }
}

.spine{ position:sticky; top:var(--nav-height); z-index:40;
  background:rgba(245,242,236,.94); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--color-line); }
.spine__inner{ max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter);
  min-height:54px; display:flex; align-items:center; justify-content:space-between; gap:var(--s-5); }
.spine__types{ display:flex; gap:var(--s-5); list-style:none; margin:0; padding:0;
  overflow-x:auto; scrollbar-width:none; }
.spine__types::-webkit-scrollbar{ display:none; }
.spine__types a{ font:400 var(--fs-nav)/1.15 var(--font-ui); text-transform:uppercase;
  letter-spacing:.14em; color:var(--color-text-muted); white-space:nowrap;
  padding-block:16px; position:relative; text-decoration:none; }
.spine__types a[aria-current="true"]{ color:var(--color-text); }
.spine__types a[aria-current="true"]::after{ content:""; position:absolute; left:0; right:0; bottom:12px;
  height:1px; background:var(--color-clay); }
.spine__filter{ display:flex; gap:var(--s-4); align-items:center; flex:0 0 auto; }
.spine__filter a{ font:400 var(--fs-nav)/1.15 var(--font-ui); text-transform:uppercase; letter-spacing:.12em;
  color:var(--color-text-muted); text-decoration:none; white-space:nowrap; }
.spine__filter a[aria-current="page"]{ color:var(--color-text); border-bottom:1px solid var(--color-clay); }
.spine__mobile-only{ display:none; }
@media (max-width:599.98px){
  .spine__filter{ display:none; }
  .spine__mobile-only{ display:inline; color:var(--color-sage); }
}

.kat-band{ padding-block:var(--gap-section-tight); border-top:1px solid var(--color-line);
  scroll-margin-top:var(--sticky-band); }
.kat-band:first-child{ border-top:0; padding-top:var(--gap-section-tight); }
.kat-band__head{ max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter);
  display:grid; grid-template-columns:auto 1fr; column-gap:var(--s-4);
  align-items:baseline; margin-bottom:clamp(24px,3vw,48px); }
.kat-band__idx{ font:400 var(--fs-eyebrow)/1.15 var(--font-ui); letter-spacing:.18em; color:var(--color-text-muted); }
.kat-band__title{ font-size:var(--fs-h2); line-height:1.1; letter-spacing:-.02em; margin:0; }
.kat-band__title a{ text-decoration:none; color:inherit; }
.kat-band__title a:hover, .kat-band__title a:focus-visible{ color:var(--color-clay-deep); }
.kat-band__note{ grid-column:2; margin-top:var(--s-2); font-size:var(--fs-small); font-style:italic;
  color:var(--color-text-muted); max-width:42ch; }
.kat-band__all{ grid-column:2; margin-top:var(--s-4); }
@media (min-width:900px){
  .kat-band__head{ grid-template-columns:auto minmax(0,1fr) auto; }
  .kat-band__all{ grid-column:3; grid-row:1; margin-top:0; align-self:baseline; justify-self:end; }
}

.kat-band__grid{ display:grid; gap:clamp(20px,2.5vw,40px); padding-inline:var(--gutter);
  max-width:var(--container); margin-inline:auto; }
.kat-band--01 .kat-band__grid{ grid-template-columns:5fr 4fr 3fr; }
.kat-band--02 .kat-band__grid{ grid-template-columns:7fr 5fr; }
.kat-band--02 .kat-band__grid > *:nth-child(2){ margin-top:clamp(32px,5vw,88px); }
.kat-band--03 .kat-band__grid{ grid-template-columns:repeat(4,1fr); }
.kat-band--03 .kat-band__grid > *:nth-child(2), .kat-band--03 .kat-band__grid > *:nth-child(4){ margin-top:clamp(24px,3vw,64px); }
.kat-band--04 .kat-band__grid{ grid-template-columns:4fr 8fr; align-items:end; }
.kat-band--05 .kat-band__grid{ grid-template-columns:3fr 5fr 4fr; }
.kat-band--05 .kat-band__grid > *:nth-child(3){ margin-top:clamp(32px,4vw,72px); }
@media (max-width:1199.98px) and (min-width:900px){
  .kat-band__grid{ grid-template-columns:repeat(2,1fr) !important; }
  .kat-band--03 .kat-band__grid > *:nth-child(2), .kat-band--03 .kat-band__grid > *:nth-child(4){ margin-top:clamp(16px,3vw,40px); }
  .kat-band--02 .kat-band__grid > *:nth-child(2){ margin-top:clamp(16px,3vw,40px); }
  .kat-band--05 .kat-band__grid > *:nth-child(3){ margin-top:clamp(16px,3vw,40px); }
}
@media (max-width:899.98px){
  .kat-band__grid{ display:flex !important; gap:var(--s-4); overflow-x:auto; overscroll-behavior-x:contain;
    scroll-snap-type:x proximity; padding-inline:var(--gutter); scrollbar-width:none; }
  .kat-band__grid::-webkit-scrollbar{ display:none; }
  .kat-band__grid > *{ flex:0 0 auto; width:min(68vw,300px); scroll-snap-align:start;
    margin-top:0 !important; align-self:auto !important; }
}
@media (max-width:599.98px){ .kat-band__grid > *{ width:min(76vw,280px); } }

/* --- .urun-kart (paylaşılan bileşen — template-parts/urun/card.php, spec-katalog.md §2) --- */
.urun-kart{ display:block; text-decoration:none; color:var(--color-text); overflow:visible; }
.urun-kart .frame{ aspect-ratio:var(--ratio,4/5); }
.urun-kart img{ transition:transform .5s var(--ease-out); }
.urun-kart:hover img, .urun-kart:focus-visible img{ transform:scale(1.03); }
.urun-kart__meta{ display:grid; gap:var(--s-1); margin-top:var(--s-4); }
.urun-kart__name{ margin:0; font:500 var(--fs-nav)/1.35 var(--font-ui);
  text-transform:uppercase; letter-spacing:.12em; transition:color var(--dur) var(--ease-out); }
.urun-kart:hover .urun-kart__name{ color:var(--color-clay-deep); }
.urun-kart__mat{ margin:0; font-size:var(--fs-small); color:var(--color-text-muted); }
.urun-kart__where{ font:500 var(--fs-micro)/1.2 var(--font-ui); text-transform:uppercase;
  letter-spacing:.16em; color:var(--color-clay-deep); margin-top:var(--s-1); }
.urun-kart__tag{ position:absolute; left:0; top:0; z-index:2; padding:5px 9px;
  font:500 var(--fs-micro)/1.2 var(--font-ui); text-transform:uppercase;
  letter-spacing:.16em; color:var(--color-paper); background:var(--color-sage); }   /* SAGE'İN TEK KULLANIM YERİ */

/* ==========================================================================
   15. TÜR ARŞİVİ (taxonomy-urun_kategori.php) — spec-katalog.md §3
   ========================================================================== */
.tur-head{ display:grid; grid-template-columns:1fr; padding-top:calc(var(--nav-height) + var(--s-7));
  padding-bottom:clamp(48px,6vw,96px); background:var(--color-paper); }
.tur-head__type{ grid-column:1/-1; padding-inline:var(--gutter); }
.tur-head__type h1{ margin:0; font-size:var(--fs-h1-page); color:var(--color-text); font-weight:400;
  line-height:1.05; letter-spacing:-.025em; }
.tur-head__lead{ margin-top:var(--s-4); font-size:var(--fs-lead); font-style:italic; color:var(--color-text-soft); max-width:40ch; }
.tur-head hr.hairline{ width:96px; margin-top:var(--s-5); }
.tur-head__cover{ grid-column:1/-1; aspect-ratio:16/9; margin-top:var(--s-6); }
@media (min-width:1200px){
  .tur-head{ grid-template-columns:repeat(12,1fr); column-gap:var(--s-5); align-items:start;
    padding-top:calc(var(--nav-height) + clamp(48px,6vw,96px)); }
  .tur-head__type{ grid-column:2 / 7; }
  .tur-head__cover{ grid-column:8 / 13; aspect-ratio:4/5; margin-right:calc(var(--gutter) * -1); margin-top:0; }
}

.tur-filter{ position:sticky; top:var(--nav-height); z-index:40;
  background:rgba(245,242,236,.94); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border-block:1px solid var(--color-line); }
.tur-filter__inner{ max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter);
  min-height:54px; display:flex; align-items:center; gap:var(--s-5); justify-content:space-between; }
.chips{ display:flex; gap:var(--s-4); list-style:none; margin:0; padding:0; overflow-x:auto; scrollbar-width:none; }
.chips::-webkit-scrollbar{ display:none; }
.chips a{ font:400 var(--fs-nav)/1.15 var(--font-ui); text-transform:uppercase; letter-spacing:.14em;
  color:var(--color-text-muted); white-space:nowrap; padding-block:16px; position:relative; text-decoration:none; }
.chips a[aria-current="page"]{ color:var(--color-text); }
.chips a[aria-current="page"]::after{ content:""; position:absolute; inset:auto 0 12px 0; height:1px; background:var(--color-clay); }
.chips__sep{ width:1px; height:14px; background:var(--color-line-strong); align-self:center; flex:0 0 auto; }
.tur-filter__count{ font:400 var(--fs-meta)/1.5 var(--font-ui); letter-spacing:.06em; color:var(--color-text-muted); white-space:nowrap; }
@media (max-width:599.98px){ .tur-filter__count{ display:none; } }

.tur-grid{ display:grid; grid-template-columns:repeat(12,1fr);
  column-gap:clamp(16px,2vw,32px); row-gap:clamp(40px,5vw,88px);
  list-style:none; margin:clamp(48px,6vw,96px) 0 0; padding:0;
  max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter); }
.tur-grid > li{ grid-column:span var(--span,4); }
.tur-grid > li[data-push="1"]{ margin-top:clamp(24px,4vw,72px); }
.tur-grid__note{ grid-column:span 3; align-self:center; }
.tur-grid__note hr{ width:56px; margin-bottom:var(--s-3); }
.tur-grid__note p{ margin:0; font-size:var(--fs-small); font-style:italic; color:var(--color-text-muted); max-width:22ch; }
@media (max-width:1199.98px){
  .tur-grid > li{ grid-column:span 6 !important; }
  .tur-grid > li[data-push="1"]{ margin-top:clamp(16px,3vw,40px); }
  .tur-grid__note{ grid-column:span 6; }
}
@media (max-width:599.98px){
  .tur-grid{ column-gap:var(--s-3); row-gap:var(--s-7); }
  .tur-grid > li{ grid-column:span 12 !important; }
  .tur-grid > li:nth-child(3n+2){ width:84%; margin-left:auto; }
  .tur-grid > li:nth-child(3n+3){ width:76%; }
  .tur-grid__note{ grid-column:span 12; width:100% !important; margin-left:0 !important; }
}

.pager{ display:flex; align-items:center; justify-content:center; gap:var(--s-4);
  margin-top:clamp(56px,7vw,112px); padding-top:var(--s-6); padding-inline:var(--gutter);
  border-top:1px solid var(--color-line); flex-wrap:wrap; }
.pager .page-numbers{ min-width:44px; min-height:44px; display:inline-grid; place-items:center;
  font:400 var(--fs-meta)/1 var(--font-ui); letter-spacing:.08em; color:var(--color-text-muted); text-decoration:none; }
.pager .page-numbers.current{ color:var(--color-text); border-bottom:1px solid var(--color-clay); }
.pager a.page-numbers:hover{ color:var(--color-clay-deep); }
.pager .page-numbers.dots{ color:var(--color-text-muted); }
.pager svg{ width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:1.25; vertical-align:middle; }

.tur-cross{ background:var(--color-paper-warm); padding-block:var(--gap-section-tight); margin-top:var(--gap-section-tight); }
.tur-cross__list{ display:grid; grid-template-columns:1fr; list-style:none; margin:var(--s-8) 0 0; padding:0; }
.tur-cross__list li{ border-top:1px solid var(--color-line-strong); }
.tur-cross__list li:last-child{ border-bottom:1px solid var(--color-line-strong); }
.tur-cross__list a{ display:flex; align-items:baseline; justify-content:space-between; gap:var(--s-4);
  padding-block:var(--s-5); text-decoration:none; color:var(--color-text); }
.tur-cross__name{ font-size:var(--fs-h3); }
.tur-cross__cnt{ font:400 var(--fs-meta)/1.5 var(--font-ui); color:var(--color-text-muted); }
.tur-cross__list a:hover .tur-cross__name, .tur-cross__list a:focus-visible .tur-cross__name{ color:var(--color-clay-deep); }

/* ==========================================================================
   16. ÜRÜN DETAY (single-urun.php) — spec-katalog.md §4
   ========================================================================== */
.urun{ padding-top:calc(var(--nav-height) + var(--s-7)); padding-inline:var(--gutter);
  max-width:var(--container); margin-inline:auto;
  display:grid; grid-template-columns:1fr; gap:var(--s-7); }
@media (min-width:900px){
  .urun{ grid-template-columns:6fr 5fr; column-gap:clamp(32px,4vw,72px);
    padding-top:calc(var(--nav-height) + clamp(48px,6vw,88px)); }
  .urun__info{ position:sticky; top:var(--sticky-top); align-self:start; }
}
@media (min-width:1200px){ .urun{ grid-template-columns:7fr 5fr; column-gap:clamp(48px,5vw,96px); } }

.urun__gallery{ display:grid; gap:clamp(12px,1.6vw,24px); }
.urun__gallery .frame:first-child{ aspect-ratio:4/5; }
.urun__gallery .frame:not(:first-child){ aspect-ratio:1/1; }
@media (min-width:600px){
  .urun__gallery{ grid-template-columns:repeat(2,1fr); }
  .urun__gallery .frame:first-child{ grid-column:1 / -1; }
  .urun__gallery .frame:nth-child(4){ grid-column:1 / -1; aspect-ratio:3/2; }
}

.urun__info h1{ margin:0; font-size:var(--fs-h1-page); font-weight:400; line-height:1.05; letter-spacing:-.025em; color:var(--color-text); }
.urun__lead{ margin-top:var(--s-4); font-size:var(--fs-lead); color:var(--color-text-soft); max-width:42ch; }
.urun__meta{ margin-top:var(--s-6); }
.urun__cta{ display:flex; flex-wrap:wrap; gap:var(--s-4); margin-top:var(--s-6); }
.urun__closing{ margin-top:var(--s-7); }
.urun__closing .title-block__value{ font-size:var(--fs-small); }

.olcu-karti{ margin-top:var(--s-7); border-top:1px solid var(--color-line-strong); padding-top:var(--s-5); }
.olcu-karti__dia{ width:100%; aspect-ratio:4/3; fill:none; stroke:var(--color-line-strong);
  stroke-width:1; vector-effect:non-scaling-stroke; margin-block:var(--s-5); }
.olcu-karti__dia .edge{ stroke:var(--color-ink); }
.olcu-karti__dia .tick{ stroke:var(--color-clay); }
.olcu-karti__dia text{ fill:var(--color-text-muted); font-family:"Jost",sans-serif; font-size:11px; letter-spacing:.05em; }
.olcu-karti__vals{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s-4); }
.olcu-karti__vals dt{ font:500 var(--fs-eyebrow)/1.15 var(--font-ui); text-transform:uppercase;
  letter-spacing:.18em; color:var(--color-text-muted); }
.olcu-karti__vals dd{ margin:0; font-size:var(--fs-h3); letter-spacing:-.01em; }
.olcu-karti__vals dd small{ font-size:var(--fs-meta); font-family:var(--font-ui); color:var(--color-text-muted); margin-left:3px; }

.urun-related{ background:var(--color-paper-warm); margin-top:var(--gap-section); padding-block:var(--gap-section-tight); }
.urun-related__grid{ display:grid; grid-template-columns:1fr; gap:var(--s-6);
  max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter); }
@media (min-width:900px){
  .urun-related__grid{ grid-template-columns:4fr 3fr 5fr; column-gap:clamp(20px,2.5vw,40px); align-items:end; }
  .urun-related__grid > *:nth-child(2){ margin-bottom:clamp(24px,3vw,56px); }
}

/* ==========================================================================
   17. HAKKIMIZDA (page-templates/tpl-hakkimizda.php) — spec-hakkimizda.md
   ========================================================================== */
.hik-open{ padding:calc(var(--nav-height) + clamp(56px,8vw,128px)) 0 var(--gap-section-tight); }
.hik-open .wrap{ display:grid; grid-template-columns:1fr; gap:var(--s-5); }
.hik-open__eyebrow{ font:500 var(--fs-eyebrow)/1.15 var(--font-ui); text-transform:uppercase;
  letter-spacing:.18em; color:var(--color-text-muted); }
.hik-open__lead{ margin:0; font-size:var(--fs-display); font-weight:400;
  line-height:1.02; letter-spacing:-.025em; max-width:24ch; }
.hik-open__lead em{ font-style:italic; }
.hik-open__body{ max-width:62ch; display:grid; gap:var(--s-4); font-size:var(--fs-body); color:var(--color-text-soft); }
.hik-open__body p{ margin:0; }
@media (min-width:1200px){
  .hik-open .wrap{ grid-template-columns:repeat(12,1fr); column-gap:var(--s-5); }
  .hik-open__eyebrow{ grid-column:1 / 2; grid-row:1; padding-top:.6em; }
  .hik-open__lead{ grid-column:2 / 9; grid-row:1; }
  .hik-open .hairline{ grid-column:2 / 5; grid-row:2; margin-top:var(--s-6); }
  .hik-open__body{ grid-column:2 / 8; grid-row:3; margin-top:var(--s-6); }
}

.hik-atolye{ padding-block:var(--gap-section-tight); }
.hik-atolye .wrap--wide{ display:grid; grid-template-columns:1fr; gap:var(--s-6); }
.hik-atolye__a{ aspect-ratio:3/2; width:100%; }
.hik-atolye__cap{ width:78%; }
.hik-atolye__cap .hairline{ width:48px; margin-bottom:var(--s-4); }
.hik-atolye__cap p{ margin:0; font-size:var(--fs-lead); font-style:italic; color:var(--color-text-soft); max-width:24ch; }
.hik-atolye__b{ aspect-ratio:1/1; width:72%; margin-left:auto; }
@media (min-width:1200px){
  .hik-atolye .wrap--wide{ grid-template-columns:repeat(12,1fr); column-gap:clamp(20px,2.5vw,40px); }
  .hik-atolye__a{ grid-column:1 / 8; aspect-ratio:3/2; margin-left:calc(var(--gutter) * -1); }
  .hik-atolye__cap{ grid-column:9 / 13; grid-row:1; align-self:end; padding-bottom:var(--s-5); width:auto; }
  .hik-atolye__b{ grid-column:9 / 12; grid-row:2; aspect-ratio:4/5; margin-top:clamp(24px,3vw,56px); width:auto; margin-left:0; }
}

.hik-yontem{ background:var(--color-ink); color:var(--color-on-ink); padding-block:var(--gap-section); }
.hik-yontem__list{ display:grid; grid-template-columns:1fr; list-style:none; margin:clamp(32px,4vw,64px) 0 0; padding:0; }
.hik-yontem__list li{ border-top:1px solid var(--color-line-dark); padding-block:var(--s-5); }
.hik-yontem__no{ display:block; font:400 var(--fs-eyebrow)/1.15 var(--font-ui);
  letter-spacing:.18em; color:var(--color-clay-light); margin-bottom:var(--s-3); transition:color .3s var(--ease-out); }
.hik-yontem__t{ margin:0 0 var(--s-2); font-size:var(--fs-h3); color:var(--color-on-ink); }
.hik-yontem__d{ margin:0; font-size:var(--fs-body); color:var(--color-on-ink-muted); max-width:34ch; }
.hik-yontem__list li:hover .hik-yontem__no{ color:var(--color-clay); }
@media (min-width:900px){
  .hik-yontem__list{ grid-template-columns:repeat(4,1fr); column-gap:0; border-top:1px solid var(--color-line-dark); }
  .hik-yontem__list li{ border-top:0; border-left:1px solid var(--color-line-dark);
    padding:var(--s-6) clamp(16px,2vw,32px) 0; }
  .hik-yontem__list li:first-child{ border-left:0; padding-left:0; }
  .hik-yontem__list li:last-child{ padding-right:0; }
}

.hik-kunye{ padding-block:var(--gap-section); }
.hik-kunye .wrap{ display:grid; grid-template-columns:1fr; gap:var(--s-7); }
@media (min-width:900px){
  .hik-kunye .wrap{ grid-template-columns:5fr 7fr; column-gap:clamp(40px,6vw,112px); align-items:start; }
  .hik-kunye__side{ position:sticky; top:var(--sticky-top); }
}
.hik-kunye__side h2{ margin:0; font-size:var(--fs-h2); max-width:16ch; }
.hik-kunye__side p{ margin:var(--s-4) 0 0; font:400 var(--fs-meta)/1.7 var(--font-ui);
  letter-spacing:.06em; color:var(--color-text-muted); max-width:34ch; }

.hik-davet{ background:var(--color-paper-warm); padding-block:var(--gap-section-tight); }
.hik-davet .wrap{ display:grid; gap:var(--s-6); justify-items:start; }
.hik-davet__line{ margin:0; font-size:var(--fs-h2); line-height:1.1; letter-spacing:-.02em; max-width:28ch; }
.hik-davet__cta{ display:flex; flex-wrap:wrap; gap:var(--s-4); }
@media (min-width:900px){
  .hik-davet .wrap{ justify-items:end; text-align:right; }
  .hik-davet__line{ max-width:22ch; }
}

/* ==========================================================================
   18. İLETİŞİM (page-templates/tpl-iletisim.php) — spec-iletisim.md
   ========================================================================== */
.ilet-head{ background:var(--color-ink); color:var(--color-on-ink);
  padding:calc(var(--nav-height) + clamp(48px,7vw,104px)) 0 clamp(40px,5vw,72px);
  border-bottom:1px solid var(--color-line-dark); }
.ilet-head .wrap{ display:grid; grid-template-columns:1fr; gap:var(--s-7); }
.ilet-head__type h1{ margin:var(--s-3) 0 0; font-size:var(--fs-h1-page); font-weight:400;
  line-height:1.05; letter-spacing:-.025em; color:var(--color-on-ink); }
.ilet-head__lead{ margin:var(--s-4) 0 0; font-size:var(--fs-lead); color:var(--color-on-ink-muted); max-width:42ch; }
.ilet-head__quick{ list-style:none; margin:0; padding:0; display:grid; }
.ilet-head__quick li{ border-top:1px solid var(--color-line-dark); }
.ilet-head__quick a{ display:grid; grid-template-columns:auto 1fr auto; align-items:center;
  gap:var(--s-4); padding-block:var(--s-4); text-decoration:none;
  color:var(--color-on-ink); transition:color var(--dur) var(--ease-out); }
.ilet-head__quick a:hover, .ilet-head__quick a:focus-visible{ color:var(--color-clay-light); }
.ilet-head__quick svg{ width:18px; height:18px; stroke:currentColor; stroke-width:1.25; fill:none; }
.ilet-head__qlab{ font:500 var(--fs-eyebrow)/1.15 var(--font-ui); text-transform:uppercase;
  letter-spacing:.18em; color:var(--color-on-ink-muted); }
.ilet-head__qval{ font-size:var(--fs-body); }
@media (min-width:900px){
  .ilet-head .wrap{ grid-template-columns:repeat(12,1fr); column-gap:var(--s-5); align-items:end; }
  .ilet-head__type{ grid-column:1 / 8; }
  .ilet-head__quick{ grid-column:8 / 13; }
}

.ilet-pafta{ padding-block:var(--gap-section); }
.pafta--light{ position:relative; border:1px solid var(--color-line-strong); padding:clamp(28px,4vw,64px); }
.pafta--light .pafta__title{ position:absolute; top:0; left:clamp(28px,4vw,64px);
  transform:translateY(-50%); background:var(--color-paper); padding-inline:var(--s-4); margin:0;
  font-size:var(--fs-h3); color:var(--color-text); }
.ilet-pafta__grid{ display:grid; grid-template-columns:1fr; gap:var(--s-7); margin-top:var(--s-4); }
.ilet-pafta__cta{ margin-top:var(--s-6); display:flex; flex-wrap:wrap; gap:var(--s-4); }
.ilet-pafta__foto{ outline:1px solid var(--color-line-strong); outline-offset:8px; }
@media (min-width:900px){
  .ilet-pafta__grid{ grid-template-columns:7fr 5fr; column-gap:clamp(32px,4vw,72px); align-items:start; margin-top:0; }
  .ilet-pafta__foto{ position:sticky; top:var(--sticky-top); }
}
.title-block--lg .title-block__value{ font-size:var(--fs-lead); }

.ilet-harita{ padding-bottom:var(--gap-section); }
/* click-to-load-map.php partial TEKRAR KULLANILDI (S6 ile aynı `.map-cl` CSS) —
   burada yalnızca İ3'e özgü ölçek/görünüm farkları scope'lanır. */
.ilet-harita .map-cl{ grid-column:auto; margin-top:0; aspect-ratio:4/3; border:1px solid var(--color-line-strong); }
@media (min-width:900px){ .ilet-harita .map-cl{ aspect-ratio:21/9; } }
.ilet-harita .map-cl__poster{ filter:grayscale(1) contrast(.92); }
.ilet-harita .map-cl__btn{ background:var(--color-paper); color:var(--color-ink); border-color:var(--color-ink); }
.ilet-harita .map-cl__btn::before{ background:var(--color-clay-deep); }
.ilet-harita .map-cl__btn:hover, .ilet-harita .map-cl__btn:focus-visible{ color:var(--color-paper); border-color:var(--color-clay-deep); }

.ilet-form{ background:var(--color-paper-warm); padding-block:var(--gap-section); border-top:1px solid var(--color-line); }
.ilet-form .wrap{ display:grid; grid-template-columns:1fr; gap:var(--s-7); }
.ilet-form__side h2{ margin:0; font-size:var(--fs-h2); max-width:18ch; }
.ilet-form__side p{ margin:var(--s-4) 0 0; font-size:var(--fs-body); color:var(--color-text-soft); max-width:34ch; }
.ilet-form__form{ display:grid; gap:var(--s-6); }
@media (min-width:900px){
  .ilet-form .wrap{ grid-template-columns:repeat(12,1fr); column-gap:clamp(32px,4vw,80px); }
  .ilet-form__side{ grid-column:1 / 5; }
  .ilet-form__form{ grid-column:6 / 13; }
  #formSuccess{ grid-column:6 / 13; }
}
@media (min-width:1200px){ .ilet-form__side{ position:sticky; top:var(--sticky-top); align-self:start; } }
@media (min-width:600px){ .ilet-form__row{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s-6); } }

/* --- form alanları (spec-anasayfa.md §0.6 — saç teli alt çizgi, kutu yok) --- */
.field{ position:relative; padding-top:22px; }
.field__label{ position:absolute; top:0; left:0; font:500 var(--fs-eyebrow)/1.15 var(--font-ui);
  text-transform:uppercase; letter-spacing:.14em; color:var(--color-text-muted); }
.field__input, .field__area{ width:100%; min-height:48px; padding:10px 0; background:transparent;
  border:0; border-bottom:1px solid var(--color-line-strong);
  font:400 var(--fs-body)/1.6 var(--font-body); color:var(--color-text);
  transition:border-color var(--dur) var(--ease-out); }
.field__area{ min-height:140px; resize:vertical; }
.field__input:focus, .field__area:focus{ border-bottom-color:var(--color-clay-deep); }
.field.is-invalid .field__input, .field.is-invalid .field__area{ border-bottom-color:var(--color-error); }
.field__error{ display:none; margin-top:var(--s-2); font:400 var(--fs-meta)/1.5 var(--font-ui); color:var(--color-error); }
.field.is-invalid .field__error{ display:block; }

.field__consent{ display:flex; align-items:flex-start; gap:var(--s-3);
  font:400 var(--fs-meta)/1.6 var(--font-ui); color:var(--color-text-soft); max-width:52ch; cursor:pointer; }
.field__consent input[type="checkbox"]{ appearance:none; -webkit-appearance:none; flex:0 0 auto;
  width:18px; height:18px; margin-top:2px; border:1px solid var(--color-line-strong); background:var(--color-paper);
  position:relative; cursor:pointer; }
.field__consent input[type="checkbox"]:checked{ background:var(--color-clay-deep); border-color:var(--color-clay-deep); }
.field__consent input[type="checkbox"]:checked::after{ content:""; position:absolute; left:4px; top:1px;
  width:5px; height:9px; border:solid var(--color-paper); border-width:0 2px 2px 0; transform:rotate(45deg); }

/* honeypot — display:none KULLANMA, bazı botlar atlar (spec §6) */
.hp-field{ position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }

.btn:disabled{ opacity:.7; pointer-events:none; }

.form-status{ display:none; margin-top:var(--s-4); }
.form-status.is-visible{ display:block; }
.form-status--error{ color:var(--color-error); font:400 var(--fs-meta)/1.6 var(--font-ui); }
/* ⚠️ display:grid burada DEĞİL, yalnızca .is-visible ile birlikte — aksi halde
   sayfa yüklenir yüklenmez (submit edilmeden) başarı mesajı görünür kalır
   (görsel QA dersi, iletisim.html Faz 2.5 önizlemesinden taşındı). */
.form-status--success{ gap:var(--s-4); }
.form-status--success.is-visible{ display:grid; }
.form-status--success p{ font-size:var(--fs-lead); font-style:italic; color:var(--color-success); margin:0; max-width:40ch; }
.ilet-form__form.is-hidden{ display:none; }

.ilet-ulasim{ background:var(--color-paper-warm); padding-block:var(--gap-section-tight); border-top:1px solid var(--color-line); }
.ilet-ulasim__list{ display:grid; grid-template-columns:1fr; list-style:none; margin:clamp(24px,3vw,48px) 0 0; padding:0; }
.ilet-ulasim__list li{ border-top:1px solid var(--color-line); padding-block:var(--s-5); }
.ilet-ulasim__t{ font:500 var(--fs-eyebrow)/1.15 var(--font-ui); text-transform:uppercase;
  letter-spacing:.18em; color:var(--color-text-muted); margin-bottom:var(--s-2); }
.ilet-ulasim__d{ margin:0; font-size:var(--fs-body); color:var(--color-text); max-width:38ch; }
@media (min-width:900px){
  .ilet-ulasim__list{ grid-template-columns:repeat(3,1fr); border-top:1px solid var(--color-line); }
  .ilet-ulasim__list li{ border-top:0; border-left:1px solid var(--color-line); padding:var(--s-6) clamp(16px,2vw,32px) 0; }
  .ilet-ulasim__list li:first-child{ border-left:0; padding-left:0; }
}
