/* self-hosted fonts (restored after polish strip) */
@font-face {
  font-family: 'Lora';
  font-style: italic;
  font-weight: 400;
  font-display: optional;
  src: url(../fonts/Lora-400-italic-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Lora';
  font-style: italic;
  font-weight: 400;
  font-display: optional;
  src: url(../fonts/Lora-400-italic-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Lora';
  font-style: italic;
  font-weight: 600;
  font-display: optional;
  src: url(../fonts/Lora-600-italic-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Lora';
  font-style: italic;
  font-weight: 600;
  font-display: optional;
  src: url(../fonts/Lora-600-italic-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400;
  font-display: optional;
  src: url(../fonts/Lora-400-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400;
  font-display: optional;
  src: url(../fonts/Lora-400-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 500;
  font-display: optional;
  src: url(../fonts/Lora-500-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 500;
  font-display: optional;
  src: url(../fonts/Lora-500-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 600;
  font-display: optional;
  src: url(../fonts/Lora-600-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 600;
  font-display: optional;
  src: url(../fonts/Lora-600-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 700;
  font-display: optional;
  src: url(../fonts/Lora-700-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 700;
  font-display: optional;
  src: url(../fonts/Lora-700-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 400;
  font-display: optional;
  src: url(../fonts/PlayfairDisplay-400-italic-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 400;
  font-display: optional;
  src: url(../fonts/PlayfairDisplay-400-italic-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 600;
  font-display: optional;
  src: url(../fonts/PlayfairDisplay-600-italic-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 600;
  font-display: optional;
  src: url(../fonts/PlayfairDisplay-600-italic-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400;
  font-display: optional;
  src: url(../fonts/PlayfairDisplay-400-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400;
  font-display: optional;
  src: url(../fonts/PlayfairDisplay-400-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 500;
  font-display: optional;
  src: url(../fonts/PlayfairDisplay-500-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 500;
  font-display: optional;
  src: url(../fonts/PlayfairDisplay-500-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 600;
  font-display: optional;
  src: url(../fonts/PlayfairDisplay-600-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 600;
  font-display: optional;
  src: url(../fonts/PlayfairDisplay-600-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  font-display: optional;
  src: url(../fonts/PlayfairDisplay-700-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  font-display: optional;
  src: url(../fonts/PlayfairDisplay-700-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ================================================================
   ESKİ GÖK ARŞİVİ — vintage gazete-kolaj burç baskıları
   Palet bg #E8DEC6 · surface #D6C7A1 · ink #2B241A · accent #8A3B2E · accent2 #3A4A3C
   ================================================================ */

:root {
  --bg: #E8DEC6;
  --surface: #D6C7A1;
  --surface-2: #cdbd92;
  --paper: #f1e9d6;
  --ink: #2B241A;
  --ink-soft: #5a4f3d;
  --muted: #6b5f49;
  --accent: #8A3B2E;
  --accent-text: #7a3327;
  --accent-2: #3A4A3C;
  --accent-2-text: #334133;
  --line: rgba(43, 36, 26, 0.22);
  --line-strong: rgba(43, 36, 26, 0.42);
  --tape: rgba(220, 205, 160, 0.62);
  --tape-2: rgba(190, 170, 120, 0.5);
  --shadow: 0 14px 30px -18px rgba(28, 22, 12, 0.6);
  --shadow-lift: 0 22px 48px -22px rgba(28, 22, 12, 0.7);

  --display: "Abril Fatface", "Playfair Display", Georgia, serif;
  --body: "Lora", Georgia, "Times New Roman", serif;
  --type: "Special Elite", "Courier New", monospace;

  --container: 1240px;
  --header-h: 72px;
  --sec-pad: clamp(56px, 8vw, 104px);
  /* self-contained paper grain (no external asset) */
  --tex: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.7' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  interpolate-size: allow-keywords;

  /* ---- collage-kit (kk-*) palette hooks, mapped to this site's vintage palette ---- */
  --kk-paper: #f1e9d6;
  --kk-paper-2: #e4d7b6;
  --kk-kraft: #c9b183;
  --kk-cork: #b4875a;
  --kk-ink: #2B241A;
  --kk-accent: #8A3B2E;
  --kk-tape: rgba(222, 205, 150, 0.78);
  --kk-hand-font: var(--type);
  --kk-stamp-font: var(--type);
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  overflow-x: clip;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  max-width: 100vw;
  overflow-x: clip;
  font-family: var(--body);
  font-size: clamp(16px, 1.05vw, 17px);
  line-height: 1.68;
  color: var(--ink);
  background-color: var(--bg);
  background-image:
    radial-gradient(circle at 18% 12%, rgba(138, 59, 46, 0.05), transparent 42%),
    radial-gradient(circle at 82% 78%, rgba(58, 74, 60, 0.06), transparent 46%),
    var(--tex);
  background-size: auto, auto, 560px;
  background-attachment: fixed, fixed, fixed;
  background-blend-mode: normal, normal, multiply;
}

img { max-width: 100%; height: auto; display: block; }
figure, figcaption, blockquote { margin: 0; }
a { color: var(--accent-text); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--ink); }

h1, h2, h3, h4 {
  font-family: var(--display);
  font-weight: 400;
  line-height: 1.14;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 0 0 0.4em;
}

p { margin: 0 0 1em; overflow-wrap: anywhere; }
ul, ol { margin: 0 0 1em; padding-left: 1.1em; }

.container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: clamp(16px, 4vw, 32px);
}

.eyebrow {
  font-family: var(--type);
  text-transform: uppercase;
  letter-spacing: 0.22em;
  font-size: 0.72rem;
  color: var(--accent-text);
  margin: 0 0 0.9em;
  display: inline-block;
}

.hand {
  font-family: var(--type);
  color: var(--accent-2-text);
  transform: rotate(-2.5deg);
  display: inline-block;
}

.skip-link {
  position: absolute;
  left: 12px; top: -60px;
  z-index: 1200;
  background: var(--ink);
  color: var(--bg);
  padding: 10px 16px;
  border-radius: 4px;
  font-family: var(--type);
  transition: top .2s ease;
}
.skip-link:focus { top: 12px; color: var(--bg); }

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* ============================ COLLAGE PRIMITIVES ============================ */

.board {
  position: relative;
  background-color: var(--paper);
  background-image: var(--tex);
  background-size: 480px;
  background-blend-mode: multiply;
  box-shadow: var(--shadow);
}

.scrap {
  position: relative;
  background: var(--paper);
  padding: clamp(18px, 2.2vw, 26px);
  box-shadow: var(--shadow);
  border: 1px solid rgba(43, 36, 26, 0.1);
}

.tape::before,
.tape::after {
  content: "";
  position: absolute;
  width: 92px; height: 26px;
  background: var(--tape);
  box-shadow: 0 2px 6px rgba(28, 22, 12, 0.18);
  pointer-events: none;
  mix-blend-mode: multiply;
  z-index: 3;
}
.tape::before { top: -12px; left: 16px; transform: rotate(-6deg); }
.tape::after { bottom: -11px; right: 18px; transform: rotate(-5deg); background: var(--tape-2); }
.tape--one::after { display: none; }

.pin {
  position: absolute;
  width: 20px; height: 20px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 34% 32%, #f3ddc0 0 18%, transparent 20%),
    radial-gradient(circle at 60% 64%, rgba(0,0,0,0.3), transparent 60%),
    var(--accent);
  box-shadow: 0 6px 10px -3px rgba(28, 22, 12, 0.6);
  z-index: 5;
  pointer-events: none;
}
.pin--green { background:
    radial-gradient(circle at 34% 32%, #e8e4cf 0 18%, transparent 20%),
    radial-gradient(circle at 60% 64%, rgba(0,0,0,0.3), transparent 60%),
    var(--accent-2); }
.pin--ink { background:
    radial-gradient(circle at 34% 32%, #d8c9a6 0 18%, transparent 20%),
    radial-gradient(circle at 60% 64%, rgba(0,0,0,0.35), transparent 60%),
    var(--ink); }

.clip {
  position: absolute;
  width: 16px; height: 44px;
  border: 3px solid #8b8477;
  border-radius: 9px;
  background: transparent;
  box-shadow: 0 3px 5px -2px rgba(0,0,0,0.5);
  z-index: 5;
  pointer-events: none;
}

.polaroid {
  background: #fbf6ea;
  padding: 10px 10px 34px;
  box-shadow: var(--shadow);
  position: relative;
}
.polaroid img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.polaroid figcaption {
  font-family: var(--type);
  font-size: 0.82rem;
  color: var(--ink-soft);
  text-align: center;
  padding-top: 8px;
}

.torn {
  --tear: polygon(0 3%, 6% 0, 14% 4%, 23% 1%, 33% 5%, 44% 1%, 55% 4%, 66% 0,
    77% 4%, 87% 1%, 95% 5%, 100% 2%, 100% 97%, 94% 100%, 85% 96%, 74% 100%,
    63% 96%, 52% 100%, 41% 96%, 30% 100%, 20% 96%, 10% 100%, 3% 97%, 0 99%);
  clip-path: var(--tear);
}

.stamp {
  display: inline-block;
  font-family: var(--type);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 0.72rem;
  color: var(--accent-text);
  border: 2.5px solid var(--accent-text);
  border-radius: 6px;
  padding: 7px 12px;
  transform: rotate(-7deg);
  opacity: 0.86;
  background: rgba(241, 233, 214, 0.35);
  mix-blend-mode: multiply;
}
.stamp--green { color: var(--accent-2-text); border-color: var(--accent-2-text); }
.stamp--round {
  border-radius: 50%;
  width: 92px; height: 92px;
  display: grid; place-content: center;
  text-align: center;
  line-height: 1.1;
}

.regmark {
  position: absolute;
  width: 22px; height: 22px;
  pointer-events: none;
  opacity: 0.5;
  z-index: 2;
}
.regmark::before, .regmark::after {
  content: ""; position: absolute; background: var(--ink);
}
.regmark::before { left: 50%; top: 0; width: 1.5px; height: 100%; transform: translateX(-50%); }
.regmark::after { top: 50%; left: 0; height: 1.5px; width: 100%; transform: translateY(-50%); }

.ink-splotch {
  position: absolute;
  pointer-events: none;
  background: radial-gradient(circle at 40% 40%, rgba(138, 59, 46, 0.28), rgba(138, 59, 46, 0.08) 55%, transparent 72%);
  border-radius: 48% 52% 60% 40% / 55% 45% 55% 45%;
  mix-blend-mode: multiply;
  z-index: 1;
}

.scatter { position: absolute; pointer-events: none; z-index: 2; }

/* ============================ HEADER / NAV ============================ */

.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1080;
  height: var(--header-h);
  display: flex;
  align-items: center;
  background: rgba(232, 222, 198, 0.92);
  backdrop-filter: saturate(1.1);
  border-bottom: 1px solid var(--line);
  transition: background .24s ease, box-shadow .24s ease, height .24s ease;
}
.site-header.is-scrolled {
  background: rgba(230, 219, 193, 0.98);
  box-shadow: 0 8px 24px -16px rgba(28, 22, 12, 0.5);
  height: 62px;
}
.header-inner {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: clamp(16px, 4vw, 32px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.brand {
  font-family: var(--display);
  font-size: 1.24rem;
  color: var(--ink);
  text-decoration: none;
  letter-spacing: 0.01em;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  line-height: 1.1;
}
.brand:hover { color: var(--accent-text); }
.brand .brand-mark {
  font-family: var(--type);
  font-size: 0.62rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--accent-text);
  border: 1.5px solid var(--accent-text);
  padding: 3px 6px;
  border-radius: 4px;
  transform: rotate(-4deg);
}

.nav-desktop { display: none; }
.nav-desktop ul {
  list-style: none; margin: 0; padding: 0;
  display: flex; align-items: center; gap: clamp(14px, 1.8vw, 26px);
}
.nav-desktop a {
  position: relative;
  font-family: var(--type);
  font-size: 0.86rem;
  letter-spacing: 0.04em;
  color: var(--ink);
  text-decoration: none;
  padding: 6px 0;
}
.nav-desktop a::after {
  content: ""; position: absolute; left: 0; bottom: -2px;
  width: 0; height: 2px; background: var(--accent);
  transition: width .24s ease;
}
.nav-desktop a:hover { color: var(--accent-text); }
.nav-desktop a:hover::after,
.nav-desktop a.is-active::after { width: 100%; }

.nav-desktop a.nav-cta,
header a.nav-cta {
  padding: 10px 20px;
  color: var(--bg);
  background: var(--accent);
  border-radius: 5px;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  transform: rotate(-1.5deg);
  box-shadow: 0 6px 14px -8px rgba(138, 59, 46, 0.9);
}
.nav-desktop a.nav-cta::after { display: none; }
.nav-desktop a.nav-cta:hover,
.nav-desktop a.nav-cta:focus-visible,
header a.nav-cta:hover,
header a.nav-cta:focus-visible { color: var(--bg); background: var(--ink); }

/* hamburger — three absolutely-positioned spans only */
.nav-toggle {
  position: relative;
  width: 46px; height: 46px;
  padding: 0;
  display: inline-block;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: var(--paper);
  color: var(--ink);
  cursor: pointer;
  z-index: 1100;
}
.nav-toggle span {
  position: absolute; left: 50%; top: 50%;
  width: 23px; height: 3px;
  translate: -50% -50%;
  background: currentColor;
  border-radius: 2px;
  transition: transform .25s ease, opacity .2s ease, background .2s ease;
}
.nav-toggle:hover,
.nav-toggle:focus-visible { background: var(--surface); border-color: var(--ink); }
.nav-toggle:hover span { background: var(--accent); }
.nav-toggle[aria-expanded="true"] { background: var(--accent); color: var(--bg); border-color: var(--accent); }
.nav-toggle span:nth-child(1) { transform: translateY(-7px); }
.nav-toggle span:nth-child(3) { transform: translateY(7px); }
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: rotate(45deg); opacity: 1; }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: rotate(-45deg); opacity: 1; }
@media (min-width: 1024px) {
  .nav-toggle { display: none; }
  .nav-desktop { display: block; }
}

/* drawer */
.drawer-backdrop {
  position: fixed; inset: 0;
  background: rgba(20, 16, 8, 0.55);
  opacity: 0; visibility: hidden;
  transition: opacity .24s ease, visibility .24s ease;
  z-index: 1040;
}
.drawer-backdrop.is-open { opacity: 1; visibility: visible; }
.drawer {
  position: fixed; top: 0; right: 0; bottom: 0;
  width: min(360px, 92vw);
  background: var(--surface);
  background-image: var(--tex);
  background-size: 420px;
  background-blend-mode: multiply;
  border-left: 2px solid var(--line-strong);
  transform: translateX(100%);
  transition: transform .32s cubic-bezier(.2,.7,.2,1);
  z-index: 1050;
  padding: calc(var(--header-h) + 16px) 26px 26px;
  overflow-y: auto;
}
.drawer.is-open { transform: translateX(0); }
.drawer nav ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.drawer nav a {
  display: block;
  font-family: var(--type);
  font-size: 1.04rem;
  color: var(--ink);
  text-decoration: none;
  padding: 13px 12px;
  border-bottom: 1px dashed var(--line);
  background: rgba(241, 233, 214, 0.5);
}
.drawer nav a:hover, .drawer nav a.is-active { color: var(--accent-text); background: rgba(241, 233, 214, 0.9); }
.drawer .drawer-cta {
  margin-top: 18px;
  text-align: center;
  background: var(--accent); color: var(--bg);
  border-bottom: 0; border-radius: 6px;
}
.drawer .drawer-cta:hover { background: var(--ink); color: var(--bg); }
.drawer .drawer-meta {
  margin-top: 22px;
  font-family: var(--type);
  font-size: 0.82rem;
  color: var(--ink-soft);
  line-height: 1.6;
}

/* ============================ BUTTONS ============================ */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--type);
  font-size: 0.92rem;
  letter-spacing: 0.03em;
  text-decoration: none;
  padding: 13px 24px;
  border-radius: 6px;
  border: 2px solid transparent;
  cursor: pointer;
  transition: transform .2s ease, background .2s ease, color .2s ease, box-shadow .2s ease;
}
.btn-primary { background: var(--accent); color: var(--bg); box-shadow: 0 10px 22px -12px rgba(138,59,46,0.9); }
.btn-primary:hover, .btn-primary:focus-visible { background: var(--ink); color: var(--bg); transform: translateY(-2px); }
.btn-ghost { background: transparent; color: var(--ink); border-color: var(--line-strong); }
.btn-ghost:hover, .btn-ghost:focus-visible { background: var(--ink); color: var(--bg); transform: translateY(-2px); }
.btn-arrow::after { content: "→"; }

/* ============================ PANELS (home) ============================ */

body.home main { padding-top: 0; }
/* Content-sized editorial panels. (Earlier full-viewport `100svh` + scroll-snap
   panels ballooned under full-page rendering, leaving the hero several screens
   tall with vast empty space — content-based height keeps the rhythm intact.) */
.panel {
  position: relative;
  display: grid;
  align-content: center;
  overflow: clip;
  padding: calc(var(--header-h) + clamp(40px, 6vh, 72px)) 0 clamp(52px, 8vh, 96px);
}
.panel + .panel { padding-top: clamp(52px, 8vh, 96px); }
.panel > .container { position: relative; z-index: 4; width: 100%; }

.panel-gazete { background-color: var(--bg); background-image: var(--tex); background-size: 560px; background-blend-mode: multiply; }
.panel-kraft { background-color: var(--surface); background-image: var(--tex); background-size: 500px; background-blend-mode: multiply; }
.panel-mukavva { background-color: var(--surface-2); background-image: var(--tex); background-size: 440px; background-blend-mode: multiply; }
.panel-harita { background-color: #2a2b26; background-image: linear-gradient(rgba(20,20,16,0.55), rgba(20,20,16,0.62)), var(--tex); background-size: auto, 300px; color: var(--paper); }

.panel-head { margin-bottom: clamp(18px, 3vw, 40px); }
.panel-head h2 {
  font-size: clamp(2.1rem, 5.4vw, 4rem);
  line-height: 1.08;
}
.panel-harita .panel-head h2,
.panel-harita h2, .panel-harita h3 { color: var(--paper); }
.panel-harita .eyebrow { color: #e0a99b; }
/* dark panel: keep ink-colored emphasis + stamps legible on the near-black ground */
.panel-harita .quality-list li b { color: var(--paper); }
.panel-harita .stamp {
  color: #eac7bd;
  border-color: #eac7bd;
  background: rgba(241, 233, 214, 0.06);
  mix-blend-mode: normal;
  opacity: 1;
}
.panel-harita .stamp--green { color: #b3ccb0; border-color: #b3ccb0; }

/* panel dots */
.panel-dots {
  position: fixed;
  right: clamp(10px, 1.6vw, 20px);
  top: 50%;
  transform: translateY(-50%);
  z-index: 1030;
  display: grid;
  gap: 12px;
}
.panel-dots button {
  width: 13px; height: 13px;
  border-radius: 50%;
  border: 2px solid var(--ink);
  background: transparent;
  padding: 0; cursor: pointer;
  transition: background .2s ease, transform .2s ease;
}
.panel-dots button.is-active { background: var(--accent); border-color: var(--accent); transform: scale(1.2); }
.panel-dots button:hover { background: var(--ink); }

.scroll-cue {
  position: absolute;
  left: 50%; bottom: 20px;
  transform: translateX(-50%);
  font-family: var(--type);
  font-size: 0.74rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-soft);
  z-index: 5;
  text-align: center;
}
.scroll-cue span { display: block; font-size: 1.1rem; animation: bob 1.8s ease-in-out infinite; }
@keyframes bob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(6px); } }

/* ============================ HERO (panel 1) ============================ */

.hero-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: clamp(20px, 3vw, 48px);
  align-items: center;
}
.hero-headline { position: relative; }
.hero-masthead {
  font-family: var(--type);
  text-transform: uppercase;
  letter-spacing: 0.3em;
  font-size: 0.68rem;
  color: var(--ink-soft);
  border-top: 2px solid var(--ink);
  border-bottom: 2px solid var(--ink);
  padding: 6px 0;
  margin-bottom: 20px;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.hero-headline h1 {
  font-size: clamp(2.6rem, 8.2vw, 4.5rem);
  line-height: 1.02;
  margin: 0 0 0.3em;
}
.hero-headline .hero-sub {
  font-family: var(--body);
  font-size: clamp(1.02rem, 1.6vw, 1.2rem);
  color: var(--ink-soft);
  max-width: 46ch;
  margin-bottom: 1.4em;
}
.hero-cta-row { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.hero-trust {
  margin-top: 26px;
  display: flex; flex-wrap: wrap; gap: 10px;
}
.hero-trust .stamp { font-size: 0.64rem; transform: rotate(-3deg); }
.hero-trust .stamp:nth-child(2) { transform: rotate(2deg); }
.hero-trust .stamp:nth-child(3) { transform: rotate(-1deg); }

.hero-collage { position: relative; min-height: 360px; }
.hero-kupur-1 {
  position: relative;
  z-index: 3;
  transform: rotate(-4deg);
  max-width: 300px;
  margin-left: auto;
}
.hero-kupur-2 {
  position: absolute;
  left: 0; bottom: -10px;
  z-index: 2;
  transform: rotate(5deg);
  max-width: 210px;
}
.hero-kupur-1 img, .hero-kupur-2 img { width: 100%; object-fit: cover; }
.hero-kupur-1 img { aspect-ratio: 4 / 5; }
.hero-kupur-2 img { aspect-ratio: 1 / 1; }
.hero-serial {
  position: absolute;
  right: -6px; top: -22px;
  z-index: 6;
  font-family: var(--type);
  font-size: 0.68rem;
  color: var(--accent-text);
  transform: rotate(6deg);
}

/* ============================ STORY (panel 2) ============================ */

.story-grid {
  display: grid;
  grid-template-columns: 0.95fr 1.05fr;
  gap: clamp(22px, 4vw, 56px);
  align-items: center;
}
.story-photo { position: relative; max-width: 440px; }
.story-photo .polaroid { transform: rotate(-3deg); }
.story-photo .polaroid img { aspect-ratio: 3 / 4; max-height: 440px; }
.story-note {
  position: relative;
  background: var(--paper);
  padding: clamp(20px, 3vw, 34px);
  box-shadow: var(--shadow);
  transform: rotate(0.6deg);
  font-family: var(--body);
}
.story-note .typed {
  font-family: var(--type);
  font-size: 0.92rem;
  color: var(--ink-soft);
  line-height: 1.85;
}
.story-note .typed strong { color: var(--ink); }
.story-sign {
  font-family: var(--type);
  color: var(--accent-2-text);
  transform: rotate(-3deg);
  display: inline-block;
  margin-top: 14px;
  font-size: 1.05rem;
}
.story-facts {
  display: flex; flex-wrap: wrap; gap: 18px;
  margin-top: 22px;
  border-top: 1px dashed var(--line);
  padding-top: 18px;
}
.story-facts .fact { font-family: var(--type); }
.story-facts .fact b {
  display: block;
  font-family: var(--display);
  font-size: 1.9rem;
  color: var(--accent-text);
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.story-facts .fact span { font-size: 0.76rem; color: var(--ink-soft); }

/* ============================ COLLECTION FILTER (panel 3) ============================ */

.coll-wrap {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: clamp(18px, 2.4vw, 32px);
  align-items: start;
}
.filter-panel {
  position: relative;
  background: var(--paper);
  padding: 22px 20px;
  box-shadow: var(--shadow);
  transform: rotate(-0.8deg);
}
.filter-panel h3 { font-family: var(--type); font-size: 1rem; letter-spacing: 0.04em; margin-bottom: 4px; }
.filter-group { margin-top: 16px; }
.filter-group > .flabel {
  font-family: var(--type);
  font-size: 0.74rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--accent-text);
  display: block;
  margin-bottom: 8px;
}
.chip-row { display: flex; flex-wrap: wrap; gap: 6px; }
.chip {
  font-family: var(--type);
  font-size: 0.78rem;
  padding: 6px 11px;
  border: 1.5px solid var(--line-strong);
  border-radius: 20px;
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  transition: background .2s ease, color .2s ease, transform .15s ease;
}
.chip:hover { transform: translateY(-1px); background: var(--surface); }
.chip[aria-pressed="true"] { background: var(--accent); color: var(--bg); border-color: var(--accent); }
.chip[aria-pressed="true"].chip--green { background: var(--accent-2); border-color: var(--accent-2); }

.filter-actions { margin-top: 18px; display: flex; flex-direction: column; gap: 10px; }
.filter-reset {
  background: transparent; border: 0; text-align: left;
  font-family: var(--type); font-size: 0.8rem; color: var(--ink-soft);
  cursor: pointer; text-decoration: underline; padding: 0;
}
.filter-reset:hover { color: var(--accent-text); }
.compare-note {
  font-family: var(--type); font-size: 0.74rem; color: var(--ink-soft);
  border-top: 1px dashed var(--line); padding-top: 12px; line-height: 1.5;
}

.coll-results { min-width: 0; }
@media (min-width: 1024px) {
  .coll-grid { max-height: 54vh; overflow-y: auto; padding-right: 6px; }
}
.coll-status {
  font-family: var(--type);
  font-size: 0.82rem;
  color: var(--ink-soft);
  margin-bottom: 14px;
  min-height: 1.2em;
}
.coll-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 1.8vw, 22px);
}
.art-card {
  position: relative;
  background: #fbf6ea;
  padding: 9px 9px 14px;
  box-shadow: var(--shadow);
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease;
  outline-offset: 3px;
}
.art-card:nth-child(3n+1) { transform: rotate(-1.6deg); }
.art-card:nth-child(3n+2) { transform: rotate(1deg); }
.art-card:nth-child(3n) { transform: rotate(-0.4deg); }
.art-card:hover, .art-card:focus-visible { transform: translateY(-4px) rotate(0deg); box-shadow: var(--shadow-lift); }
.art-card .art-thumb {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: var(--surface-2);
}
.art-card .art-thumb img { width: 100%; height: 100%; object-fit: cover; }
.art-card .art-meta { padding: 9px 4px 0; }
.art-card .art-name { display: block; font-family: var(--display); font-size: 1.12rem; line-height: 1.15; }
.art-card .art-sub { display: block; font-family: var(--type); font-size: 0.72rem; color: var(--ink-soft); margin-top: 2px; }
.art-card .art-price { display: block; font-family: var(--type); font-size: 0.82rem; color: var(--accent-text); margin-top: 3px; }
.art-badge {
  position: absolute; top: 8px; left: 8px; z-index: 4;
  font-family: var(--type); font-size: 0.62rem; text-transform: uppercase; letter-spacing: 0.08em;
  background: var(--ink); color: var(--bg); padding: 3px 7px; border-radius: 3px; transform: rotate(-5deg);
}
.art-badge.sold { background: var(--accent); }
.art-card.is-disabled { opacity: 0.62; }
.art-compare-tag {
  position: absolute; top: 8px; right: 8px; z-index: 4;
  font-family: var(--type); font-size: 0.62rem;
  background: var(--accent-2); color: var(--paper);
  padding: 3px 7px; border-radius: 3px; display: none;
}
.art-card.is-compared .art-compare-tag { display: inline-block; }
.art-card.is-compared { outline: 2px dashed var(--accent-2); }

/* compare tray */
.compare-tray {
  margin-top: 16px;
  background: var(--paper);
  border: 1px dashed var(--line-strong);
  padding: 14px 16px;
  box-shadow: var(--shadow);
}
.compare-tray[hidden] { display: none; }
.compare-tray h4 { font-family: var(--type); font-size: 0.86rem; margin-bottom: 10px; letter-spacing: 0.04em; }
.compare-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.compare-slot {
  position: relative;
  background: #fbf6ea; padding: 8px; box-shadow: var(--shadow); min-height: 120px;
  display: grid; align-content: start; gap: 6px;
}
.compare-slot .empty-slot {
  font-family: var(--type); font-size: 0.78rem; color: var(--ink-soft);
  display: grid; place-content: center; aspect-ratio: 3/2; text-align: center;
}
.compare-slot img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.compare-slot .cs-name { font-family: var(--display); font-size: 1rem; }
.compare-slot .cs-row { font-family: var(--type); font-size: 0.72rem; color: var(--ink-soft); }
.compare-slot .cs-remove {
  position: absolute; top: 6px; right: 6px; z-index: 3;
  width: 24px; height: 24px; border-radius: 50%; border: 0;
  background: var(--ink); color: var(--bg); cursor: pointer; font-family: var(--type); line-height: 1;
}
.compare-slot .cs-remove:hover { background: var(--accent); }

/* ============================ PRINT QUALITY (panel 4) ============================ */

.quality-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: clamp(22px, 4vw, 56px);
  align-items: center;
}
.quality-photo { position: relative; }
.quality-photo .macro {
  position: relative;
  background: #fbf6ea; padding: 12px; box-shadow: var(--shadow-lift);
  transform: rotate(-2deg);
}
.quality-photo .macro img { width: 100%; aspect-ratio: 5/4; object-fit: cover; }
.quality-photo .macro::after {
  content: "";
  position: absolute; inset: 12px;
  background: linear-gradient(130deg, transparent 55%, rgba(255,250,235,0.35) 70%, transparent 80%);
  mix-blend-mode: screen; pointer-events: none;
  transform: translateX(var(--sheenx, 0));
  transition: transform .2s ease;
}
.quality-list { list-style: none; padding: 0; margin: 20px 0 0; display: grid; gap: 14px; }
.quality-list li {
  position: relative;
  padding-left: 22px;
  font-family: var(--body);
}
.quality-list li::before {
  content: ""; position: absolute; left: 0; top: 10px;
  width: 9px; height: 9px; border-radius: 50%; background: var(--accent);
}
.quality-list li b { font-family: var(--type); color: var(--ink); }
.quality-badges { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 14px; }

/* ============================ PRICING (panel 5) ============================ */

.price-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 2.4vw, 34px);
  align-items: start;
}
.ticket {
  position: relative;
  background: #fbf6ea;
  background-image: var(--tex);
  background-size: 300px;
  background-blend-mode: multiply;
  padding: 26px 22px 28px;
  box-shadow: var(--shadow);
  --tear: polygon(0 2%, 50% 0, 100% 2%, 100% 98%, 50% 100%, 0 98%);
  clip-path: var(--tear);
}
.ticket:nth-child(1) { transform: rotate(-1.6deg); }
.ticket:nth-child(2) { transform: rotate(0.8deg) translateY(-8px); }
.ticket:nth-child(3) { transform: rotate(-0.6deg); }
.ticket .t-stub {
  font-family: var(--type); text-transform: uppercase; letter-spacing: 0.14em;
  font-size: 0.68rem; color: var(--accent-text);
  border-bottom: 2px dashed var(--line-strong); padding-bottom: 10px; margin-bottom: 14px;
  display: flex; justify-content: space-between;
}
.ticket h3 { font-family: var(--display); font-size: 1.7rem; margin-bottom: 4px; }
.ticket .t-price {
  font-family: var(--display); font-size: 2.6rem; color: var(--accent-text);
  line-height: 1; margin: 8px 0 2px; font-variant-numeric: tabular-nums;
}
.ticket .t-unit { font-family: var(--type); font-size: 0.72rem; color: var(--ink-soft); }
.ticket ul { list-style: none; padding: 0; margin: 16px 0; display: grid; gap: 7px; font-size: 0.92rem; }
.ticket ul li { position: relative; padding-left: 18px; }
.ticket ul li::before { content: "·"; position: absolute; left: 4px; color: var(--accent); font-weight: 700; }
.ticket ul li.no { color: var(--muted); }
.ticket ul li.no::before { content: "×"; color: var(--muted); }
.ticket .t-featured {
  display: inline-block;
  margin-bottom: 10px;
}
.price-foot {
  margin-top: clamp(18px, 2.4vw, 28px);
  font-family: var(--type); font-size: 0.78rem; color: var(--ink-soft);
  display: flex; flex-wrap: wrap; gap: 16px; align-items: center;
}

/* ============================ REVIEWS + FAQ (panel 6) ============================ */

.voices-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(22px, 3.2vw, 44px);
  align-items: start;
}
.reviews-stack { display: grid; gap: 16px; }
.review {
  position: relative;
  background: #fbf6ea;
  padding: 18px 20px;
  box-shadow: var(--shadow);
}
.review:nth-child(odd) { transform: rotate(-1.2deg); }
.review:nth-child(even) { transform: rotate(0.9deg); }
.review .r-text { font-family: var(--body); font-style: italic; margin-bottom: 10px; }
.review .r-meta { font-family: var(--type); font-size: 0.78rem; color: var(--accent-text); }
.review .r-stars { font-family: var(--type); color: var(--accent); letter-spacing: 2px; font-size: 0.8rem; }

.faq-stack { display: grid; gap: 10px; }
.faq-item {
  background: var(--paper);
  box-shadow: var(--shadow);
  border-left: 4px solid var(--accent-2);
}
.faq-item summary {
  list-style: none;
  cursor: pointer;
  font-family: var(--type);
  font-size: 0.96rem;
  padding: 15px clamp(16px, 3vw, 22px);
  display: flex; justify-content: space-between; gap: 12px; align-items: center;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; font-size: 1.3rem; color: var(--accent-text); transition: transform .3s ease; }
.faq-item[open] summary::after { transform: rotate(45deg); }
.faq-item > .answer {
  height: 0;
  padding: 0 clamp(16px, 3vw, 22px);
  overflow: hidden;
  transition: height 360ms cubic-bezier(.4,0,.2,1), padding-block-end 360ms cubic-bezier(.4,0,.2,1);
}
.faq-item[open] > .answer { height: auto; padding-block-end: 20px; }
.faq-item > .answer p { margin: 0; color: var(--ink-soft); font-size: 0.96rem; }

/* ============================ CONTACT + FOOTER (panel 7 / pages) ============================ */

.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(22px, 3.4vw, 48px);
  align-items: start;
}
.contact-board { position: relative; }
.contact-note {
  position: relative;
  background: var(--paper);
  padding: clamp(20px, 3vw, 30px);
  box-shadow: var(--shadow);
  transform: rotate(-1deg);
}
.contact-note .ink-stamp {
  display: inline-block;
  font-family: var(--type); text-transform: uppercase; letter-spacing: 0.1em;
  color: var(--accent-text); border: 3px double var(--accent-text);
  padding: 8px 14px; transform: rotate(-4deg); margin-bottom: 16px; font-size: 0.8rem;
}
.contact-channels { display: grid; gap: 12px; margin-top: 6px; }
.contact-channels .ch {
  font-family: var(--type); font-size: 0.92rem; line-height: 1.5;
}
.contact-channels .ch .lbl {
  display: block; font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.12em; color: var(--accent-text);
}
.contact-channels .ch a { color: var(--ink); text-decoration: none; }
.contact-channels .ch a:hover { color: var(--accent-text); text-decoration: underline; }

/* forms */
.form-card {
  position: relative;
  background: var(--paper);
  background-image: var(--tex);
  background-size: 360px; background-blend-mode: multiply;
  padding: clamp(20px, 3vw, 32px);
  box-shadow: var(--shadow);
  transform: rotate(0.6deg);
}
.form-card h3 { font-family: var(--type); font-size: 1.05rem; letter-spacing: 0.03em; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.field { margin-bottom: 15px; display: block; }
.field > span.flabel {
  display: block; font-family: var(--type); font-size: 0.78rem;
  letter-spacing: 0.04em; color: var(--ink); margin-bottom: 5px;
}
.field input[type="text"],
.field input[type="email"],
.field input[type="tel"],
.field select,
.field textarea {
  width: 100%;
  font-family: var(--body);
  font-size: 0.98rem;
  color: var(--ink);
  background: rgba(255, 252, 244, 0.72);
  border: 0;
  border-bottom: 2px solid var(--line-strong);
  padding: 10px 6px;
  border-radius: 2px 2px 0 0;
  transition: border-color .2s ease, background .2s ease;
}
.field textarea { min-height: 110px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus {
  outline: none; border-color: var(--accent); background: rgba(255, 252, 244, 0.95);
}
.field.kvkk {
  display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: start;
  font-family: var(--type); font-size: 0.82rem; color: var(--ink-soft); line-height: 1.45;
}
.field.kvkk a { color: var(--accent-text); }
.field input[type="checkbox"] {
  appearance: auto; -webkit-appearance: auto;
  width: 18px; height: 18px; min-width: 18px; min-height: 18px;
  padding: 0; border: 0; margin: 2px 0 0; accent-color: var(--accent);
}
.form-card button[type="submit"] { width: 100%; margin-top: 6px; }
@media (min-width: 560px) { .form-card button[type="submit"] { width: auto; } }

/* CTA card (replaces secondary forms outside contact page) */
.form-card.cta-card { display: grid; gap: 2px; align-content: start; }
.form-card.cta-card .ink-stamp {
  justify-self: start;
  font-family: var(--type); text-transform: uppercase; letter-spacing: 0.1em;
  color: var(--accent-text); border: 3px double var(--accent-text);
  padding: 7px 12px; transform: rotate(-3deg); margin-bottom: 12px; font-size: 0.78rem;
}
.form-card.cta-card h3 { font-family: var(--display); font-size: clamp(1.4rem, 3vw, 1.9rem); letter-spacing: -0.01em; }
.form-card.cta-card p { font-size: 0.98rem; color: var(--ink-soft); margin: 0 0 22px; }
.form-card.cta-card .btn { justify-self: start; }

/* ============================ FOOTER ============================ */

main, .site-footer { position: relative; z-index: 1; }
.site-footer {
  background: #211b12;
  background-image: var(--tex);
  background-size: 440px; background-blend-mode: multiply;
  color: #e4d9bf;
  padding: clamp(40px, 6vw, 72px) 0 28px;
  border-top: 3px solid var(--accent);
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
  gap: clamp(22px, 3vw, 40px);
}
.site-footer h4 {
  font-family: var(--type); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.14em;
  color: #d8a393; margin-bottom: 14px;
}
.site-footer a { color: #e4d9bf; }
.site-footer a:hover { color: #fff; }
.footer-col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.footer-col ul a { display: block; font-family: var(--type); font-size: 0.9rem; text-decoration: none; }
.footer-brand .fb-name { font-family: var(--display); font-size: 1.5rem; color: #f1e9d6; margin-bottom: 8px; }
.footer-brand p { font-size: 0.9rem; color: #bdb094; }
.footer-stamp {
  display: inline-block; margin-top: 10px;
  font-family: var(--type); font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase;
  color: #d8a393; border: 2px solid #d8a393; border-radius: 50%;
  width: 84px; height: 84px; display: grid; place-content: center; text-align: center; line-height: 1.2;
  transform: rotate(-8deg); opacity: 0.85;
}
.footer-bottom {
  margin-top: clamp(28px, 4vw, 44px);
  padding-top: 20px;
  border-top: 1px solid rgba(228, 217, 191, 0.2);
  display: flex; flex-wrap: wrap; gap: 10px 20px; justify-content: space-between;
  font-family: var(--type); font-size: 0.78rem; color: #bdb094;
}
.footer-bottom .legal-links { display: flex; flex-wrap: wrap; gap: 6px 14px; }
.footer-bottom .legal-links a { display: inline; text-decoration: none; }
.footer-bottom .legal-links a:hover { text-decoration: underline; }

/* ============================ COOKIE BANNER ============================ */

.cookie-banner {
  position: fixed;
  bottom: 16px; left: 16px; right: 16px;
  max-width: 520px; margin: 0 auto;
  background: var(--paper);
  border: 2px solid var(--ink);
  box-shadow: var(--shadow-lift);
  padding: 18px 20px;
  transform: translateY(140%);
  opacity: 0;
  transition: transform 280ms cubic-bezier(.2,.7,.2,1), opacity 240ms;
  z-index: 9999;
  border-radius: 8px;
}
.cookie-banner.is-visible { transform: translateY(0); opacity: 1; }
.cookie-banner h3 { font-family: var(--type); font-size: 0.98rem; margin-bottom: 6px; }
.cookie-banner p { font-size: 0.86rem; color: var(--ink-soft); margin-bottom: 12px; }
.cookie-banner p a { color: var(--accent-text); }
.cookie-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.cookie-actions button {
  flex: 1 1 auto; min-height: 44px; min-width: 96px;
  font-family: var(--type); font-size: 0.84rem; cursor: pointer;
  border-radius: 5px; border: 2px solid var(--ink); padding: 8px 12px;
  transition: background .2s ease, color .2s ease;
}
/* Accept and Reject carry equal visual weight (KVKK/GDPR: reject must not be
   weaker than accept). Settings stays the tertiary, text-level choice. */
.cookie-actions [data-consent="accept"] { background: var(--accent); color: var(--bg); border-color: var(--accent); }
.cookie-actions [data-consent="accept"]:hover,
.cookie-actions [data-consent="accept"]:focus-visible { background: var(--ink); border-color: var(--ink); color: var(--bg); }
.cookie-actions [data-consent="reject"] { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.cookie-actions [data-consent="reject"]:hover,
.cookie-actions [data-consent="reject"]:focus-visible { background: var(--accent); border-color: var(--accent); color: var(--bg); }
.cookie-actions [data-consent="settings"] { flex: 1 1 100%; background: transparent; color: var(--ink); border-color: var(--line-strong); }
.cookie-actions [data-consent="settings"]:hover,
.cookie-actions [data-consent="settings"]:focus-visible { background: var(--surface); border-color: var(--ink); }
@media (min-width: 720px) {
  .cookie-banner { left: 24px; right: auto; max-width: 420px; }
}

/* ============================ SUBPAGES ============================ */

body.page { padding-top: var(--header-h); }
:where(section, .page-section, .form-card, .page-hero)[id], :target { scroll-margin-top: calc(var(--header-h) + 20px); }
.page-hero {
  position: relative;
  padding: clamp(48px, 7vw, 92px) 0 clamp(32px, 5vw, 56px);
  background-color: var(--surface);
  background-image: var(--tex);
  background-size: 500px; background-blend-mode: multiply;
  border-bottom: 2px solid var(--line);
  overflow: clip;
}
.page-hero h1 { font-size: clamp(2.2rem, 6vw, 4rem); }
.page-hero .lead { font-size: clamp(1.02rem, 1.6vw, 1.2rem); color: var(--ink-soft); max-width: 60ch; }
.page-section { padding-block: var(--sec-pad); }
.page-section.alt { background: var(--surface); background-image: var(--tex); background-size: 440px; background-blend-mode: multiply; }
.prose { max-width: 74ch; }
.prose h2 { font-size: clamp(1.6rem, 3.4vw, 2.4rem); margin-top: 1.4em; }
.prose h3 { font-size: clamp(1.2rem, 2.4vw, 1.5rem); margin-top: 1.2em; }
.prose p, .prose li { color: var(--ink-soft); }
.prose a { color: var(--accent-text); }

.team-grid, .steps-grid, .cards-3 {
  display: grid; gap: clamp(16px, 2.4vw, 28px);
}
.team-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cards-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.steps-grid { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }

.team-member {
  position: relative;
  background: #fbf6ea; padding: 10px 10px 18px; box-shadow: var(--shadow);
}
.team-member:nth-child(odd) { transform: rotate(-1.4deg); }
.team-member:nth-child(even) { transform: rotate(1deg); }
.team-member img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.team-member h3 { font-family: var(--display); font-size: 1.25rem; margin: 12px 4px 2px; }
.team-member .role { font-family: var(--type); font-size: 0.76rem; color: var(--accent-text); margin: 0 4px 8px; }
.team-member p { font-size: 0.9rem; color: var(--ink-soft); margin: 0 4px; }

.step {
  position: relative;
  background: var(--paper); padding: 20px; box-shadow: var(--shadow);
  border-top: 3px solid var(--accent);
}
.step:nth-child(even) { transform: rotate(-0.8deg); }
.step:nth-child(odd) { transform: rotate(0.6deg); }
.step .step-no { font-family: var(--display); font-size: 2rem; color: var(--accent-text); line-height: 1; }
.step .step-when { font-family: var(--type); font-size: 0.72rem; color: var(--accent-2-text); text-transform: uppercase; letter-spacing: 0.1em; }
.step h3 { font-family: var(--type); font-size: 1rem; margin: 8px 0 6px; }
.step p { font-size: 0.9rem; color: var(--ink-soft); margin: 0; }

.info-card {
  background: var(--paper); padding: 22px; box-shadow: var(--shadow);
}
.info-card:nth-child(odd) { transform: rotate(-0.8deg); }
.info-card:nth-child(even) { transform: rotate(0.8deg); }
.info-card h3 { font-family: var(--type); font-size: 1rem; }

/* contact channel cards */
.channel-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: clamp(14px, 2vw, 22px);
}
.channel-card {
  position: relative;
  background: var(--paper);
  padding: 22px 20px;
  box-shadow: var(--shadow);
  border-top: 3px solid var(--accent);
  transition: transform .2s ease, box-shadow .2s ease;
}
.channel-card:nth-child(3n+1) { transform: rotate(-1deg); }
.channel-card:nth-child(3n+2) { transform: rotate(0.8deg); }
.channel-card:nth-child(3n) { transform: rotate(-0.4deg); }
.channel-card:hover { transform: translateY(-3px) rotate(0deg); box-shadow: var(--shadow-lift); }
.channel-card .cc-badge {
  display: inline-grid; place-content: center;
  width: 46px; height: 46px; border-radius: 50%;
  background: var(--accent); color: var(--bg);
  font-family: var(--type); font-size: 0.72rem; letter-spacing: 0.04em;
  margin-bottom: 12px;
}
.channel-card h3 { font-family: var(--type); font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.12em; color: var(--accent-text); margin-bottom: 4px; }
.channel-card .cc-value { font-family: var(--display); font-size: 1.22rem; line-height: 1.2; word-break: break-word; }
.channel-card .cc-value a { color: var(--ink); text-decoration: none; }
.channel-card .cc-value a:hover { color: var(--accent-text); }
.channel-card .cc-sub { font-family: var(--type); font-size: 0.78rem; color: var(--ink-soft); margin-top: 6px; }

/* tables */
.table-scroll {
  display: block; width: 100%; max-width: 100%; min-width: 0;
  overflow-x: auto; -webkit-overflow-scrolling: touch;
  margin: 18px 0;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--paper);
}
.table-scroll > table { margin: 0 !important; min-width: 480px; width: 100%; border-collapse: collapse; }
:where(*:has(> .table-scroll), *:has(> * > .table-scroll), *:has(> * > * > .table-scroll)) { min-width: 0; }
.table-scroll th, .table-scroll td {
  text-align: left; padding: 11px 14px; border-bottom: 1px solid var(--line);
  font-size: 0.92rem;
}
.table-scroll th { font-family: var(--type); font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--accent-text); }
.table-scroll td { color: var(--ink-soft); font-variant-numeric: tabular-nums; }

.hours-grid { display: grid; gap: 6px; max-width: 420px; }
.hours-grid .hrow {
  display: flex; justify-content: space-between; gap: 14px;
  font-family: var(--type); font-size: 0.88rem;
  padding: 8px 12px; background: var(--paper); border-radius: 4px;
}
.hours-grid .hrow.today { border-left: 3px solid var(--accent); color: var(--ink); }
.hours-grid .hrow span:last-child { color: var(--ink-soft); font-variant-numeric: tabular-nums; }

.notes-list { display: grid; gap: 12px; list-style: none; padding: 0; margin: 0; }
.notes-list li {
  background: var(--paper); padding: 14px 18px; box-shadow: var(--shadow);
  border-left: 3px solid var(--accent-2);
}
.notes-list .n-date { font-family: var(--type); font-size: 0.72rem; color: var(--accent-text); text-transform: uppercase; letter-spacing: 0.1em; }

/* thank-you / 404 */
.center-block { text-align: center; max-width: 620px; margin-inline: auto; }
.center-block h1 { font-size: clamp(2.2rem, 6vw, 4rem); }
.center-block .big404 { font-family: var(--display); font-size: clamp(5rem, 18vw, 11rem); color: var(--accent-text); line-height: 1; }

/* ============================ REVEAL + NICHE ANIMATIONS ============================ */

.reveal { opacity: 0; transform: translateY(28px); transition: opacity 640ms cubic-bezier(.2,.7,.2,1), transform 640ms cubic-bezier(.2,.7,.2,1); }
.reveal.is-in { opacity: 1; transform: none; }
.reveal.stagger.is-in > * { animation: riseIn 640ms cubic-bezier(.2,.7,.2,1) both; }
.reveal.stagger.is-in > *:nth-child(1) { animation-delay: 60ms; }
.reveal.stagger.is-in > *:nth-child(2) { animation-delay: 140ms; }
.reveal.stagger.is-in > *:nth-child(3) { animation-delay: 220ms; }
.reveal.stagger.is-in > *:nth-child(4) { animation-delay: 300ms; }
.reveal.stagger.is-in > *:nth-child(5) { animation-delay: 380ms; }
.reveal.stagger.is-in > *:nth-child(6) { animation-delay: 460ms; }
@keyframes riseIn { from { opacity: 0; transform: translateY(22px) rotate(var(--rot, 0deg)); } to { opacity: 1; transform: none; } }

/* niche: yellowing / aging fade */
@keyframes yellowing { 0% { filter: sepia(0.5) brightness(1.08); } 100% { filter: sepia(0) brightness(1); } }
.age-in.is-in img { animation: yellowing 1.1s ease forwards; }

/* niche: ink bleed on heading */
@keyframes inkBleed { 0% { letter-spacing: 0.04em; filter: blur(1.2px); opacity: 0.4; } 100% { letter-spacing: -0.01em; filter: blur(0); opacity: 1; } }
.ink-in.is-in { animation: inkBleed 900ms ease forwards; }

/* niche: constellation twinkle (hero decoration, pure CSS) */
.constellation { position: absolute; pointer-events: none; z-index: 1; }
.constellation i {
  position: absolute; width: 5px; height: 5px; border-radius: 50%;
  background: var(--accent-text); opacity: 0.5;
  animation: twinkle 3.5s ease-in-out infinite;
}
.constellation .line { width: 1px; background: var(--line-strong); transform-origin: top; opacity: 0.4; }
@keyframes twinkle { 0%,100% { opacity: 0.25; } 50% { opacity: 0.8; } }

html.no-js .reveal { opacity: 1; transform: none; }

/* niche: pinned papers lift off the board on hover (shadow only — keeps the
   hand-placed rotation of each card, so nothing straightens unexpectedly) */
.ticket, .review, .team-member, .step, .info-card, .notes-list li, .faq-item {
  transition: box-shadow .3s cubic-bezier(.2,.7,.2,1), transform .3s cubic-bezier(.2,.7,.2,1);
  will-change: box-shadow;
}
.ticket:hover, .review:hover, .team-member:hover, .step:hover,
.info-card:hover, .notes-list li:hover, .faq-item:hover {
  box-shadow: var(--shadow-lift);
}
.faq-item summary:hover { color: var(--accent-text); }

/* niche: warm paper glow trailing the primary CTA on hover */
.btn-primary { position: relative; overflow: hidden; }
.btn-primary::before {
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(130px circle at var(--glow-x, 50%) 50%, rgba(244, 212, 160, 0.55), transparent 68%);
  mix-blend-mode: screen;
  opacity: 0;
  transition: opacity .3s ease;
  pointer-events: none;
}
.btn-primary:hover::before, .btn-primary:focus-visible::before { opacity: 1; }

html.no-js .reveal, html.no-js .age-in img { opacity: 1; }

/* ============================ RESPONSIVE ============================ */

@media (max-width: 1023px) {
  .hero-grid, .story-grid, .quality-grid, .contact-grid, .voices-grid { grid-template-columns: 1fr; }
  .coll-wrap { grid-template-columns: 1fr; }
  .filter-panel { transform: none; }
}

@media (max-width: 860px) {
  .coll-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .price-grid { grid-template-columns: 1fr; }
  .ticket:nth-child(2) { transform: rotate(0.6deg); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .team-grid, .cards-3 { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 760px) {
  .panel { padding: calc(var(--header-h) + 24px) 0 48px; }
  .panel + .panel { padding-top: 48px; }
  .panel-dots { display: none; }
  .hero-collage { min-height: 300px; margin-top: 10px; }
  .hero-kupur-2 { position: relative; left: auto; bottom: auto; margin-top: -30px; transform: rotate(4deg); }
  .compare-cols { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .coll-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .footer-grid { grid-template-columns: 1fr; }
  .team-grid, .cards-3 { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .art-card .art-name { font-size: 1rem; }
  .hero-masthead { font-size: 0.6rem; letter-spacing: 0.18em; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal, .reveal.stagger.is-in > * { opacity: 1 !important; transform: none !important; transition: none !important; animation: none !important; }
  .age-in.is-in img, .ink-in.is-in, .constellation i, .scroll-cue span { animation: none !important; }
}

.scroll-progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--accent);z-index:9998;transition:width 80ms linear;pointer-events:none}

/* ============================ COLLAGE KIT — site reconciliation ============================ */
/* kit css is loaded AFTER this file; these rules keep kit paper + fasteners legible on the
   old flat surfaces without touching header position, buttons, JS tool or cookie banner. */
.kk-scrap{backdrop-filter:none}
/* tickets carry their own clip-path tear — drop it where a scrap so pins/tape read as fasteners */
.ticket.kk-scrap{clip-path:none}
/* bare containers that became scraps need breathing room (kit scrap has no padding) */
.site-footer .footer-col.kk-scrap{padding:18px 20px}
.kk-scrap.quality-list{padding:clamp(18px,2.2vw,26px);margin-top:20px}
.prose.kk-scrap{padding:clamp(20px,3vw,32px);max-width:none}
.hours-grid.kk-scrap{padding:16px;max-width:none}
/* dark footer columns now sit on paper scraps — pull text/links/headings to ink */
.site-footer .footer-col.kk-scrap h4{color:var(--kk-ink)}
.site-footer .footer-col.kk-scrap,.site-footer .footer-col.kk-scrap p{color:var(--kk-ink)}
.site-footer .footer-col.kk-scrap a{color:var(--kk-ink)}
.site-footer .footer-col.kk-scrap a:hover{color:var(--kk-accent)}
.site-footer .footer-col.kk-scrap .footer-stamp{color:var(--kk-accent);border-color:var(--kk-accent)}
/* point-fixes: site classes that used light/accent text, now on paper scraps */
.kk-scrap .flabel,.kk-scrap .lbl,.kk-scrap .cc-sub,.kk-scrap .r-meta,.kk-scrap .role,.kk-scrap .art-sub,.kk-scrap .n-date{color:var(--kk-accent)}
.kk-scrap .coll-status,.kk-scrap .compare-note,.kk-scrap .cc-value a{color:var(--kk-ink)}
/* dark panel (kalite): paper scraps there keep ink body text, override the light panel-harita rules */
.panel-harita .kk-scrap,.panel-harita .kk-scrap li,.panel-harita .kk-scrap li b,.panel-harita .kk-scrap p{color:var(--kk-ink)}

/* autofit(panels): every panel fits one screen */
@media (min-width:761px){#hikaye{min-height:calc(100svh / 1.09) !important;zoom:1.09}}

@media (min-width:761px){#koleksiyon{min-height:calc(100svh / 1.08) !important;zoom:1.08}}

@media (min-width:761px){#kalite{min-height:calc(100svh / 1.1) !important;zoom:1.1}}

@media (min-width:761px){#fiyat{min-height:calc(100svh / 1.07) !important;zoom:1.07}}

@media (min-width:761px){#sesler{min-height:100svh !important}}

@media (min-width:761px){#iletisim-panel{min-height:calc(100svh / 1.19) !important;zoom:1.19}}

@media (max-width:760px){#hero,#hikaye,#koleksiyon,#kalite,#fiyat,#sesler,#iletisim-panel{padding-top:calc(var(--header-h,72px) + clamp(12px,2.4vh,32px)) !important;padding-bottom:clamp(20px,3.2vh,44px) !important}}
@media (max-width:760px){#hero{min-height:auto !important;scroll-snap-align:none !important;scroll-snap-stop:normal !important}}
@media (max-width:760px){#hikaye{min-height:auto !important;scroll-snap-align:none !important;scroll-snap-stop:normal !important}}
@media (max-width:760px){#koleksiyon{min-height:auto !important;scroll-snap-align:none !important;scroll-snap-stop:normal !important}}
@media (max-width:760px){#kalite{min-height:auto !important;scroll-snap-align:none !important;scroll-snap-stop:normal !important}}
@media (max-width:760px){#fiyat{min-height:auto !important;scroll-snap-align:none !important;scroll-snap-stop:normal !important}}
@media (max-width:760px){#sesler{min-height:auto !important;scroll-snap-align:none !important;scroll-snap-stop:normal !important}}
@media (max-width:760px){#iletisim-panel{min-height:auto !important;scroll-snap-align:none !important;scroll-snap-stop:normal !important}}

/* autofix(panels) */
html:has(.panel){scroll-snap-type:y mandatory !important;scroll-padding-top:var(--header-h,72px)}
html:not(:has(.panel)){scroll-snap-type:none !important}
.panel{scroll-snap-stop:always}
@media (max-width:760px){html:has(.panel){scroll-snap-type:y proximity !important}}

/* footer must be a snap target, otherwise mandatory snap bounces back to the last panel */
.site-footer,body > footer{scroll-snap-align:end;scroll-snap-stop:normal}

/* hero остаётся snap-целью даже если контент выше экрана */
@media (min-width:761px){#hero{min-height:100svh !important;scroll-snap-align:start !important;scroll-snap-stop:always !important}}

/* panels that cannot fit a phone screen: let them scroll normally instead of clipping */
@media (max-width:760px){#hero,#sesler,#iletisim-panel{min-height:auto !important;scroll-snap-align:none !important;scroll-snap-stop:normal !important;padding-top:calc(var(--header-h,72px) + clamp(16px,4vh,40px)) !important;padding-bottom:clamp(48px,9vh,80px) !important}}

@media (min-width:761px){#koleksiyon,#iletisim-panel{min-height:auto !important;scroll-snap-align:none !important}}

@media (max-width:760px){html:has(.panel){scroll-snap-type:y proximity !important}}

/* autofix(contrast): текст, не проходивший WCAG на своей подложке */
div.footer-col.footer-brand div.fb-name{color:#1E1710 !important}   /* 1.03 -> 15.05 */
section.page-section.alt span.eyebrow.kk-hand{color:#1E1710 !important}   /* 3.94 -> 13.37 */
#koleksiyon span.eyebrow.kk-hand{color:#1E1710 !important}   /* 3.94 -> 13.37 */
#fiyat span.eyebrow.kk-hand{color:#1E1710 !important}   /* 3.83 -> 12.99 */
#sesler span.scatter.stamp.stamp--green{color:#1E1710 !important}   /* 3.55 -> 5.82 */

/* autofix(panels) */
/* hero остаётся snap-целью даже если контент выше экрана */
@media (min-width:761px){#hero{min-height:100svh !important;scroll-snap-align:start !important;scroll-snap-stop:always !important}}

/* panels that cannot fit a phone screen: let them scroll normally instead of clipping */
@media (max-width:760px){#hero,#sesler,#iletisim-panel{min-height:auto !important;scroll-snap-align:none !important;scroll-snap-stop:normal !important;padding-top:calc(var(--header-h,72px) + clamp(16px,4vh,40px)) !important;padding-bottom:clamp(48px,9vh,80px) !important}}

@media (min-width:761px){#koleksiyon,#iletisim-panel{min-height:auto !important;scroll-snap-align:none !important}}

@media (max-width:760px){html:has(.panel){scroll-snap-type:y proximity !important}}

/* панели обязаны быть snap-целями, иначе mandatory примораживает страницу */
@media (min-width:761px){.panel{min-height:100svh;scroll-snap-align:start;scroll-snap-stop:always}}

/* fix(snap): #koleksiyon и #iletisim-panel («Bir burç seçelim») были отпущены из
   snap (align:none, строки 1610/1628). При `y mandatory` отпущенная панель между
   двумя snap-точками становится стеной: колесо перепрыгивало их — с #hikaye сразу
   на #kalite и с #sesler сразу в футер. Возвращаем в snap с подогнанным zoom'ом. */
@media (min-width:761px){
  #koleksiyon{
    min-height:calc(100svh / 1.08) !important; zoom:1.08;
    scroll-snap-align:start !important; scroll-snap-stop:always !important;
  }
  #iletisim-panel{
    min-height:calc(100svh / 1.19) !important; zoom:1.19;
    scroll-snap-align:start !important; scroll-snap-stop:always !important;
  }
}