/* self-hosted fonts (restored after polish strip) */
@font-face {
  font-family: 'Work Sans';
  font-style: italic;
  font-weight: 400;
  font-display: optional;
  src: url(../fonts/WorkSans-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Work Sans';
  font-style: italic;
  font-weight: 400;
  font-display: optional;
  src: url(../fonts/WorkSans-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: 'Work Sans';
  font-style: italic;
  font-weight: 600;
  font-display: optional;
  src: url(../fonts/WorkSans-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Work Sans';
  font-style: italic;
  font-weight: 600;
  font-display: optional;
  src: url(../fonts/WorkSans-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: 'Work Sans';
  font-style: normal;
  font-weight: 400;
  font-display: optional;
  src: url(../fonts/WorkSans-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 400;
  font-display: optional;
  src: url(../fonts/WorkSans-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: 'Work Sans';
  font-style: normal;
  font-weight: 500;
  font-display: optional;
  src: url(../fonts/WorkSans-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 500;
  font-display: optional;
  src: url(../fonts/WorkSans-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: 'Work Sans';
  font-style: normal;
  font-weight: 600;
  font-display: optional;
  src: url(../fonts/WorkSans-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 600;
  font-display: optional;
  src: url(../fonts/WorkSans-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: 'Work Sans';
  font-style: normal;
  font-weight: 700;
  font-display: optional;
  src: url(../fonts/WorkSans-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 700;
  font-display: optional;
  src: url(../fonts/WorkSans-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;
}

/* ================================================================
   KESİK KOLEKTİF — Analog Kolaj Atölyesi
   EDITORIAL FASHION-MAGAZINE COLLAGE · couture spread
   Palette: bone/cream ground · deep oxblood + warm ink · ONE metallic (gold)
   Display: high-contrast system serif (Georgia) · Body/labels: Work Sans
   ================================================================ */

:root {
  interpolate-size: allow-keywords;

  /* --- paper / ground --- */
  --bg: #EFE7D8;            /* bone / warm cream ground */
  --paper: #F7F1E6;         /* brighter page */
  --surface: #FBF6EC;       /* cream magazine cut-out */
  --surface-2: #F1E9DA;     /* aged page */
  --surface-3: #E7DCC8;     /* deeper aged */

  /* --- inks --- */
  --ink: #1E1712;          /* warm near-black */
  --ink-soft: #4A3F35;
  --ink-mute: #6E6153;
  --ink-faint: #94856F;

  /* --- oxblood (deep editorial red) --- */
  --ox: #6E1622;
  --ox-deep: #571018;
  --ox-text: #7C1826;

  /* --- ONE metallic: gold --- */
  --gold: #A9853E;
  --gold-2: #CBA765;
  --gold-soft: #E7D3A3;

  /* aliases kept for compatibility with shared markup/JS */
  --accent: var(--ox);
  --accent-text: var(--ox-text);
  --accent-2: var(--gold);
  --accent-2-deep: var(--gold);
  --paper-ink: var(--ink);

  --line: rgba(30, 23, 18, 0.14);
  --line-strong: rgba(30, 23, 18, 0.30);
  --line-gold: rgba(169, 133, 62, 0.42);

  --display: Georgia, "Times New Roman", "Times", "Iowan Old Style", serif;
  --head: "Work Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --body: "Work Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

  --container: 1320px;
  --pad: clamp(16px, 4vw, 48px);
  --header-h: 76px;

  --ease: cubic-bezier(.2, .7, .2, 1);
  --ease2: cubic-bezier(.4, 0, .2, 1);

  --shadow-card: 0 2px 4px rgba(30,23,18,.04), 0 18px 40px -24px rgba(30,23,18,.42);
  --shadow-cut: 0 1px 2px rgba(30,23,18,.10), 0 24px 50px -28px rgba(30,23,18,.5);

  --mx: 50%;
  --my: 50%;
}

* { box-sizing: border-box; }

html, body {
  overflow-x: clip;          /* CRITICAL: clip (not hidden) so position:sticky pins survive */
  overflow-y: visible;
  max-width: 100vw;
  margin: 0;
}
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  background-color: var(--bg);
  /* fine paper grain + faint magazine column rules */
  background-image:
    radial-gradient(rgba(30,23,18,.035) 0.5px, transparent 0.6px),
    linear-gradient(90deg, transparent calc(50% - 0.5px), rgba(30,23,18,.028) 50%, transparent calc(50% + 0.5px));
  background-size: 5px 5px, 100% 100%;
  color: var(--ink);
  font-family: var(--body);
  font-size: 17px;
  line-height: 1.65;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

figure, figcaption, blockquote { margin: 0; }
img { max-width: 100%; height: auto; display: block; }

h1, h2, h3 {
  font-family: var(--display);
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -0.012em;
  margin: 0;
  color: var(--ink);
}
h1 { line-height: 1.0; }
h4, h5 {
  font-family: var(--head);
  font-weight: 600;
  margin: 0;
  color: var(--ink);
}
p { margin: 0 0 1em; }
a { color: inherit; text-decoration: none; }
ul { margin: 0; padding: 0; list-style: none; }

::selection { background: var(--ox); color: var(--paper); }

.long { word-break: break-word; overflow-wrap: anywhere; }
.center { text-align: center; }
.mt-lg { margin-top: clamp(28px, 4vw, 48px); }

/* ---------- Layout ---------- */
.container {
  width: 100%;
  max-width: var(--container);
  margin: 0 auto;
  padding-left: var(--pad);
  padding-right: var(--pad);
}
section { position: relative; }
.section { padding: clamp(64px, 9vw, 120px) 0; position: relative; }
.section-head { max-width: 760px; margin-bottom: clamp(30px, 4.5vw, 56px); position: relative; }
.section-head h2 {
  font-size: clamp(2rem, 5.4vw, 3.7rem);
  letter-spacing: -0.02em;
}
.section-head h2 .accent, .section-head h2 em { color: var(--ox-text); font-style: italic; }
.section-head p {
  color: var(--ink-soft);
  max-width: 58ch;
  margin-top: 16px;
  font-size: 1.06rem;
}

/* ---------- Eyebrow (letterpress kicker) ---------- */
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  font-family: var(--head);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--ox-text);
  margin-bottom: 16px;
}
.eyebrow::before {
  content: "";
  width: 30px;
  height: 1.5px;
  background: linear-gradient(90deg, var(--gold), var(--gold-2));
}

/* ---------- Skip link ---------- */
.skip-link {
  position: fixed;
  left: 12px; top: -60px;
  background: var(--ink);
  color: var(--paper);
  padding: 10px 16px;
  z-index: 3000;
  font-family: var(--head);
  font-size: 0.85rem;
  letter-spacing: 0.04em;
  transition: top 160ms var(--ease);
}
.skip-link:focus { top: 12px; }
:focus-visible { outline: 2px solid var(--ox); outline-offset: 2px; }

/* ================================================================
   HEADER — masthead
   ================================================================ */
.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1080;
  height: var(--header-h);
  background: rgba(239, 231, 216, 0.86);
  backdrop-filter: saturate(1.2) blur(10px);
  -webkit-backdrop-filter: saturate(1.2) blur(10px);
  border-bottom: 1px solid var(--line);
  transition: background 240ms var(--ease), height 240ms var(--ease), box-shadow 240ms var(--ease);
}
.site-header::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -1px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--line-gold) 20%, var(--line-gold) 80%, transparent);
  opacity: .7;
}
.site-header.is-scrolled {
  background: rgba(243, 236, 223, 0.96);
  height: 64px;
  box-shadow: 0 10px 30px -22px rgba(30,23,18,.5);
}
.header-inner {
  height: 100%;
  max-width: var(--container);
  margin: 0 auto;
  padding-left: var(--pad);
  padding-right: var(--pad);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--display);
  font-weight: 600;
  font-size: 1.34rem;
  letter-spacing: 0.01em;
  color: var(--ink);
}
.brand .stamp {
  width: 36px; height: 36px;
  display: grid;
  place-items: center;
  font-family: var(--display);
  font-size: 1rem;
  font-weight: 700;
  color: var(--gold);
  background: var(--ink);
  border: 1px solid var(--gold);
  box-shadow: inset 0 0 0 2px rgba(203,167,101,.28);
  border-radius: 2px;
}
.brand b { color: var(--ox-text); font-weight: 600; }

.nav-desktop { display: none; }
.nav-desktop ul {
  display: flex;
  align-items: center;
  gap: 4px;
}
.nav-desktop a {
  position: relative;
  font-family: var(--head);
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-soft);
  padding: 8px 12px;
  transition: color 200ms var(--ease);
}
.nav-desktop a::after {
  content: "";
  position: absolute;
  left: 12px; right: 12px; bottom: 2px;
  height: 1.5px;
  background: linear-gradient(90deg, var(--gold), var(--gold-2));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 220ms var(--ease);
}
.nav-desktop a:hover { color: var(--ink); }
.nav-desktop a:hover::after,
.nav-desktop a.is-active::after { transform: scaleX(1); }
.nav-desktop a.is-active { color: var(--ox-text); }

.nav-cta {
  font-family: var(--head);
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--paper);
  background: var(--ox);
  padding: 11px 20px;
  border-radius: 2px;
  border: 1px solid var(--ox);
  transition: background 220ms var(--ease), color 220ms var(--ease), box-shadow 220ms var(--ease), transform 220ms var(--ease);
}
.nav-desktop .nav-cta { margin-left: 10px; }
.nav-desktop .nav-cta::after { display: none; }
.nav-cta:hover, .nav-cta:focus-visible {
  background: var(--ink);
  color: var(--gold-2);
  box-shadow: 0 10px 24px -14px rgba(110,22,34,.8);
  transform: translateY(-1px);
}

/* hamburger */
.nav-toggle {
  position: relative;
  z-index: 1100;
  width: 48px; height: 48px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 1px solid var(--line-strong);
  border-radius: 2px;
  cursor: pointer;
}
.nav-toggle span {
  width: 20px; height: 1.6px;
  background: var(--ink);
  transition: transform 260ms var(--ease), opacity 200ms var(--ease);
}
.nav-toggle span + span { margin-top: 5px; }
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(6.6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6.6px) rotate(-45deg); }

/* drawer */
.drawer-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(30,23,18,.5);
  opacity: 0;
  visibility: hidden;
  transition: opacity 240ms var(--ease), visibility 240ms var(--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(--paper);
  border-left: 1px solid var(--line-gold);
  box-shadow: -30px 0 60px -40px rgba(30,23,18,.7);
  transform: translateX(100%);
  transition: transform 320ms var(--ease);
  z-index: 1050;
  padding: calc(var(--header-h) + 20px) 28px 32px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  overflow-y: auto;
}
.drawer.is-open { transform: translateX(0); }
.drawer a {
  font-family: var(--head);
  font-weight: 600;
  font-size: 0.82rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-soft);
  padding: 16px 4px;
  border-bottom: 1px solid var(--line);
  transition: color 200ms var(--ease), padding-left 200ms var(--ease);
}
.drawer a:hover, .drawer a.is-active { color: var(--ox-text); padding-left: 8px; }
.drawer .nav-cta {
  margin-top: 22px;
  text-align: center;
  color: var(--paper);
  border-bottom: 1px solid var(--ox);
}
.drawer .nav-cta:hover { color: var(--gold-2); padding-left: 4px; }

/* ================================================================
   BUTTONS
   ================================================================ */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-family: var(--head);
  font-weight: 600;
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 15px 28px;
  border-radius: 2px;
  border: 1px solid transparent;
  cursor: pointer;
  text-align: center;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease), color 220ms var(--ease), border-color 220ms var(--ease);
}
.btn-primary {
  background: var(--ox);
  color: var(--paper);
  border-color: var(--ox);
  box-shadow: 0 12px 30px -18px rgba(110,22,34,.9);
}
.btn-primary:hover, .btn-primary:focus-visible {
  background: var(--ink);
  color: var(--gold-2);
  transform: translateY(-2px);
  box-shadow: 0 16px 34px -16px rgba(30,23,18,.7);
}
.btn-ghost {
  background: transparent;
  color: var(--ink);
  border-color: var(--line-strong);
}
.btn-ghost:hover, .btn-ghost:focus-visible {
  border-color: var(--gold);
  color: var(--ox-text);
  background: var(--surface);
  transform: translateY(-2px);
  box-shadow: 0 12px 26px -18px rgba(30,23,18,.5);
}
.btn-block { width: 100%; }
.btn .arw { font-family: var(--body); font-weight: 600; transition: transform 220ms var(--ease); }
.btn:hover .arw { transform: translateX(4px); }

/* ================================================================
   PRINTER / EDITORIAL DECOR MARK SYSTEM  (.pm = absolute, pointer-events:none)
   Reskinned to: hairline rules, foil stamps, folios, contact-sheet strips,
   registration ticks, silk ribbons, swatch chips, editorial asterisks.
   ================================================================ */
.pm { position: absolute; pointer-events: none; z-index: 0; }
.tc-ink { color: var(--ink); }
.tc-gold { color: var(--gold); }
.tc-ox { color: var(--ox); }
.o35 { opacity: .35 } .o5 { opacity: .5 } .o6 { opacity: .6 } .o7 { opacity: .7 } .o85 { opacity: .85 }

/* hairline rule with end ticks (letterpress rule) */
.pm-rule { width: 180px; height: 10px; }
.pm-rule::before { content: ""; position: absolute; top: 50%; left: 0; right: 0; height: 1px; background: currentColor; transform: translateY(-50%); }
.pm-rule::after { content: ""; position: absolute; top: 0; left: 0; width: 1px; height: 100%; background: currentColor; box-shadow: 180px 0 0 currentColor; }

/* registration tick / corner crop mark (L) */
.pm-tick { width: 26px; height: 26px; }
.pm-tick::before { content: ""; position: absolute; left: 0; top: 0; width: 26px; height: 1.4px; background: currentColor; }
.pm-tick::after { content: ""; position: absolute; left: 0; top: 0; width: 1.4px; height: 26px; background: currentColor; }

/* registration crosshair */
.pm-reg { width: 34px; height: 34px;
  background: radial-gradient(circle, transparent 4px, currentColor 4px, currentColor 5.4px, transparent 6px); }
.pm-reg::before { content: ""; position: absolute; left: 50%; top: -5px; bottom: -5px; width: 1.3px; background: currentColor; transform: translateX(-50%); }
.pm-reg::after { content: ""; position: absolute; top: 50%; left: -5px; right: -5px; height: 1.3px; background: currentColor; transform: translateY(-50%); }

/* foil-stamped stamp (letterpress plate) */
.pm-stamp {
  font-family: var(--head); font-weight: 600; font-size: 0.66rem; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--gold); border: 1.5px solid var(--gold); border-radius: 2px; padding: 6px 11px;
  white-space: nowrap; opacity: .9;
  background: linear-gradient(135deg, rgba(231,211,163,.16), rgba(169,133,62,.06));
  box-shadow: inset 0 0 0 2px rgba(203,167,101,.2);
}
.pm-stamp.ink { color: var(--ink); border-color: var(--line-strong); }
.pm-stamp.ox { color: var(--ox-text); border-color: rgba(110,22,34,.5); }
.pm-stamp.solid { color: var(--paper); background: var(--ink); border-color: var(--ink); opacity: .95; }
.pm-stamp.solid.ox { background: var(--ox); border-color: var(--ox); color: var(--paper); }

/* foil folio number (embossed disc) */
.pm-folio {
  width: 54px; height: 54px; border-radius: 50%;
  display: grid; place-items: center;
  font-family: var(--display); font-style: italic; font-size: 0.86rem; color: var(--gold);
  border: 1px solid var(--line-gold);
  background: radial-gradient(circle at 40% 35%, rgba(251,246,236,.9), rgba(231,220,200,.6));
  box-shadow: inset 0 1px 2px rgba(255,255,255,.7), 0 6px 16px -10px rgba(30,23,18,.5);
}

/* contact-sheet film strip */
.pm-contact {
  width: 168px; height: 34px;
  background:
    repeating-linear-gradient(90deg, transparent 0 8px, rgba(251,246,236,.9) 8px 12px, transparent 12px 20px) top/100% 6px no-repeat,
    repeating-linear-gradient(90deg, transparent 0 8px, rgba(251,246,236,.9) 8px 12px, transparent 12px 20px) bottom/100% 6px no-repeat,
    linear-gradient(90deg, var(--ink) 0 33.333%, var(--ox-deep) 33.333% 66.666%, var(--ink) 66.666% 100%);
  border: 1px solid rgba(30,23,18,.4);
}

/* silk ribbon */
.pm-ribbon {
  width: 132px; height: 15px; transform: rotate(-3deg);
  background: linear-gradient(180deg, var(--gold-soft), var(--gold) 45%, var(--gold-2) 55%, var(--gold-soft));
  box-shadow: 0 6px 14px -8px rgba(169,133,62,.7);
}
.pm-ribbon.ox { background: linear-gradient(180deg, #a33a44, var(--ox) 50%, var(--ox-deep)); }

/* thin ink swatch chips */
.pm-swatch { width: 22px; height: 96px; border: 1px solid rgba(30,23,18,.28);
  background: linear-gradient(180deg, var(--ox) 0 33%, var(--gold) 33% 66%, var(--ink) 66% 100%); }

/* halftone / grain patch */
.pm-halo { width: 108px; height: 108px;
  background: radial-gradient(currentColor 30%, transparent 32%); background-size: 7px 7px;
  -webkit-mask: radial-gradient(circle, #000 58%, transparent 66%); mask: radial-gradient(circle, #000 58%, transparent 66%); }

/* editorial asterisk / floret */
.pm-star { width: 40px; height: 40px;
  background: conic-gradient(from 0deg, currentColor 0 6deg, transparent 6deg 45deg, currentColor 45deg 51deg, transparent 51deg 90deg, currentColor 90deg 96deg, transparent 96deg 135deg, currentColor 135deg 141deg, transparent 141deg 180deg, currentColor 180deg 186deg, transparent 186deg 225deg, currentColor 225deg 231deg, transparent 231deg 270deg, currentColor 270deg 276deg, transparent 276deg 315deg, currentColor 315deg 321deg, transparent 321deg 360deg);
  -webkit-mask: radial-gradient(circle, #000 66%, transparent 70%); mask: radial-gradient(circle, #000 66%, transparent 70%); }

/* big serif quote glyph */
.pm-quote { font-family: var(--display); font-size: 8rem; line-height: .7; color: var(--gold); opacity: .5; }
.pm-quote::before { content: "\201C"; }

/* ---- DENSITY KIT (added): refined editorial-collage layers ---- */

/* full-bleed hairline gold thread (wall-to-wall letterpress rule) */
.pm-thread { left: 0; right: 0; width: 100%; height: 1px; opacity: .7;
  background: linear-gradient(90deg, transparent, var(--line-gold) 12%, var(--line-gold) 88%, transparent); }
.pm-thread.ink { background: linear-gradient(90deg, transparent, var(--line) 12%, var(--line) 88%, transparent); }
.pm-thread.tick::before, .pm-thread.tick::after {
  content: ""; position: absolute; top: -3px; width: 1px; height: 7px; background: var(--gold); opacity: .8; }
.pm-thread.tick::before { left: 12%; } .pm-thread.tick::after { right: 12%; }

/* cut-paper pull-quote slab (surface that sits behind / around headings) */
.pm-slab {
  width: clamp(220px, 26vw, 360px); height: clamp(88px, 12vw, 148px);
  background: linear-gradient(135deg, rgba(251,246,236,.92), rgba(241,233,218,.72));
  border: 1px solid var(--line); border-radius: 2px; opacity: .9;
  box-shadow: 0 1px 2px rgba(30,23,18,.05), 0 20px 42px -30px rgba(30,23,18,.4);
}
.pm-slab.gold { border-color: var(--line-gold); }
.pm-slab.tall { height: clamp(130px, 18vw, 220px); width: clamp(150px, 18vw, 240px); }
.pm-slab::after {  /* torn-but-clean deckle edge */
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; opacity: .5;
  background: repeating-linear-gradient(90deg, var(--gold-soft) 0 5px, transparent 5px 11px); }

/* small cut lookbook photo fragment (clean-cut glossy scrap) */
.pm-cut { background: var(--paper); padding: 6px; box-shadow: var(--shadow-cut); width: 92px; }
.pm-cut img { width: 100%; aspect-ratio: 3/4; object-fit: cover; display: block; filter: saturate(1.02) contrast(1.02); }
.pm-cut.sq img { aspect-ratio: 1/1; }
.pm-cut.wide { width: 120px; } .pm-cut.wide img { aspect-ratio: 4/3; }
.pm-cut .ctag {
  position: absolute; left: 6px; bottom: 6px;
  font-family: var(--head); font-size: 0.5rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--paper); background: rgba(30,23,18,.72); padding: 2px 6px; }

/* corner crop marks (L) — refined framing pair */
.pm-crop { width: 30px; height: 30px; color: var(--ink); }
.pm-crop::before { content: ""; position: absolute; left: 0; top: 0; width: 30px; height: 1.3px; background: currentColor; }
.pm-crop::after { content: ""; position: absolute; left: 0; top: 0; width: 1.3px; height: 30px; background: currentColor; }
.pm-crop.br::before { top: auto; bottom: 0; }
.pm-crop.br::after { left: auto; right: 0; }

/* mobile sizing for kept density pieces */
@media (max-width: 768px) {
  .pm-keep.pm-cut { width: 62px; padding: 4px; }
  .pm-keep.pm-cut.wide { width: 78px; }
  .pm-keep.pm-slab { width: 168px; height: 78px; }
  .pm-keep.pm-slab.tall { width: 130px; height: 150px; }
  .pm-keep.pm-crop { width: 22px; height: 22px; }
}

/* decor mobile curation */
@media (max-width: 900px) { .pm-bleed { display: none !important; } }
@media (max-width: 768px) {
  .pm:not(.pm-keep) { display: none !important; }
  .pm-keep.pm-rule { width: 120px; }
  .pm-keep.pm-rule::after { box-shadow: 120px 0 0 currentColor; }
  .pm-keep.pm-contact { width: 118px; }
  .pm-keep.pm-swatch { height: 70px; }
  .pm-keep.pm-folio { width: 44px; height: 44px; }
}

/* ================================================================
   HERO — editorial cover cluster
   ================================================================ */
.hero {
  position: relative;
  padding-top: calc(var(--header-h) + clamp(20px, 4vw, 48px));
  padding-bottom: clamp(48px, 7vw, 96px);
  overflow: hidden;
  background:
    radial-gradient(120% 90% at 100% 0%, rgba(169,133,62,.10), transparent 55%),
    linear-gradient(180deg, var(--paper), var(--bg) 70%);
}
.hero::before {  /* faint magazine column grid */
  content: "";
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(90deg, transparent 0 calc(16.66% - 1px), rgba(30,23,18,.045) calc(16.66% - 1px), rgba(30,23,18,.045) 16.66%);
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,.6), transparent 78%);
  mask-image: linear-gradient(180deg, rgba(0,0,0,.6), transparent 78%);
  pointer-events: none;
  opacity: .7;
}
.hero-media { display: none; }  /* full-bleed image retired in favor of cut cluster */
.hero-scrim { display: none; }

.hero-inner {
  position: relative;
  z-index: 4;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--pad);
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(30px, 4vw, 54px);
  align-items: center;
}
@media (min-width: 1000px) { .hero-inner { grid-template-columns: 1.04fr 0.96fr; } }

.hero-copy { max-width: 640px; position: relative; z-index: 5; }
.hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--head);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--ox-text);
  margin-bottom: 20px;
}
.hero-eyebrow::before { content: ""; width: 34px; height: 1.5px; background: linear-gradient(90deg, var(--gold), var(--gold-2)); }
.hero-eyebrow::after { content: "İST · 2017"; color: var(--ink-mute); letter-spacing: 0.2em; font-weight: 500; }

.hero h1 {
  font-family: var(--display);
  font-size: clamp(3rem, 10vw, 6.6rem);
  line-height: 0.94;
  letter-spacing: -0.03em;
  margin: 0 0 24px;
}
.hero h1 .l { display: inline-block; }
.hero h1 .accent { color: var(--ox-text); font-style: italic; }
.hero h1 .accent2 { color: var(--gold); font-style: italic; }
.hero-sub {
  font-size: clamp(1.06rem, 1.6vw, 1.28rem);
  color: var(--ink-soft);
  max-width: 46ch;
  margin: 0 0 30px;
}
.hero-sub::first-letter {
  font-family: var(--display);
  float: left;
  font-size: 3.2em;
  line-height: 0.72;
  padding: 6px 12px 0 0;
  color: var(--ox);
  font-weight: 600;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; }
.trust-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
  margin-top: 34px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
}
.trust-strip span {
  font-family: var(--head);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-soft);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.trust-strip span::before { content: ""; width: 5px; height: 5px; background: var(--gold); transform: rotate(45deg); }

/* hero cut-photo cluster (editorial cover) */
.hero-cluster {
  position: relative;
  height: clamp(360px, 52vw, 560px);
  z-index: 3;
}
.hero-frame {  /* keep for JS gold-sheen pointer effect */
  position: absolute; inset: -6% -4%;
  z-index: 6; pointer-events: none;
  --mx: 50%; --my: 50%;
}
.hero-frame::before {
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(220px 220px at var(--mx) var(--my), rgba(203,167,101,.28), transparent 60%);
  mix-blend-mode: screen;
  opacity: .8;
  transition: opacity 300ms var(--ease);
}
.hero-cut {
  position: absolute;
  background: var(--paper);
  padding: 9px;
  box-shadow: var(--shadow-cut);
}
.hero-cut img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hero-cut .cut-tag {
  position: absolute; bottom: 14px; left: 14px;
  font-family: var(--head); font-size: 0.6rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--paper); background: rgba(30,23,18,.72); padding: 4px 8px;
}
.hero-cut.hc1 { width: min(52%, 260px); aspect-ratio: 3/4; left: 34%; top: 2%; transform: rotate(2.5deg); z-index: 5; }
.hero-cut.hc2 { width: min(40%, 200px); aspect-ratio: 4/5; left: 2%; top: 20%; transform: rotate(-4deg); z-index: 6; }
.hero-cut.hc3 { width: min(38%, 190px); aspect-ratio: 1/1; left: 46%; top: 52%; transform: rotate(-3deg); z-index: 7; }
.hero-cluster .pm-stamp.hero-stamp {
  position: absolute; top: 8%; right: 4%; z-index: 8; transform: rotate(6deg);
  font-size: 0.74rem; padding: 10px 14px;
}
.hero-cluster .pm-folio.hero-folio { position: absolute; bottom: 6%; left: 30%; z-index: 8; }
.hero-cluster .pm-ribbon.hero-ribbon { position: absolute; top: 44%; left: -3%; z-index: 4; }

/* ================================================================
   POSTER STRIP — upcoming sessions marquee (letterpress bar)
   ================================================================ */
.poster-strip {
  background: var(--ink);
  border-top: 1px solid var(--line-gold);
  border-bottom: 1px solid var(--line-gold);
  padding: 15px 0;
  overflow: hidden;
}
.poster-strip .container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
}
.poster-strip .label {
  font-family: var(--head);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gold-2);
}
.poster-strip .pill {
  font-family: var(--head);
  font-size: 0.82rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--paper);
  padding: 4px 10px;
  border: 1px solid rgba(203,167,101,.3);
  border-radius: 2px;
}
.poster-strip .pill b { color: var(--gold-2); font-weight: 700; }

/* ================================================================
   SIGNATURE SCROLL SCENE — LOOKBOOK editorial spread composes
   ================================================================ */
.cine-track { position: relative; }
.cine-pin { position: sticky; top: 0; height: 100vh; overflow: hidden; display: grid; place-items: center; }

.lb-track { height: 300vh; }
.cine-pin.lb-pin {
  background:
    radial-gradient(rgba(30,23,18,.04) 0.5px, transparent 0.6px) 0 0/5px 5px,
    radial-gradient(130% 100% at 50% 30%, var(--paper), var(--bg) 78%);
}
.lb-wrap {
  position: relative;
  z-index: 3;
  width: 100%;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--pad);
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(20px, 3vw, 44px);
  align-items: center;
}
@media (min-width: 980px) { .lb-wrap { grid-template-columns: 1.1fr 0.9fr; } }

.lb-stage {
  position: relative;
  width: 100%;
  max-width: 560px;
  aspect-ratio: 5 / 5.4;
  margin: 0 auto;
}
@media (max-width: 979px) { .lb-stage { aspect-ratio: 4 / 4.2; max-width: 460px; } }
.lb-stage::before {  /* the editorial page the spread composes onto */
  content: "";
  position: absolute; inset: 4% 2%;
  background: var(--surface);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-cut);
}
.lbc { will-change: transform, opacity; }

.lb-ph {
  position: absolute;
  background: var(--paper);
  padding: 7px;
  box-shadow: var(--shadow-cut);
  overflow: hidden;
}
.lb-ph img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lb-p1 { width: 44%; aspect-ratio: 3/4; left: 8%;  top: 8%;  z-index: 5; }
.lb-p2 { width: 38%; aspect-ratio: 4/5; right: 6%; top: 12%; z-index: 6; }
.lb-p3 { width: 40%; aspect-ratio: 1/1; left: 10%; bottom: 8%; z-index: 6; }
.lb-p4 { width: 34%; aspect-ratio: 3/4; right: 8%; bottom: 10%; z-index: 7; }

.lb-masthead {
  position: absolute; top: 1%; left: 6%; right: 6%; z-index: 8;
  font-family: var(--display);
  font-size: clamp(1.1rem, 2.6vw, 1.7rem);
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--ink);
  text-align: center;
  padding-bottom: 6px;
  border-bottom: 1.5px solid var(--gold);
}
.lb-masthead span { color: var(--ox-text); font-style: italic; }
.lb-quote {
  position: absolute; left: 12%; top: 42%; z-index: 9;
  font-family: var(--display); font-style: italic;
  font-size: clamp(1.1rem, 2.4vw, 1.7rem);
  line-height: 1.15; color: var(--ox);
  max-width: 60%;
  text-shadow: 0 1px 0 rgba(251,246,236,.9);
}
.lb-stamp {
  position: absolute; top: 6%; right: 3%; z-index: 10; transform: rotate(7deg);
  font-family: var(--head); font-weight: 600; font-size: 0.64rem; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--gold); border: 1.5px solid var(--gold); border-radius: 2px; padding: 8px 10px;
  background: linear-gradient(135deg, rgba(231,211,163,.2), rgba(169,133,62,.08));
  box-shadow: inset 0 0 0 2px rgba(203,167,101,.24);
}
.lb-contact {
  position: absolute; bottom: 2%; left: 50%; transform: translateX(-50%); z-index: 8;
  width: 62%; height: 30px;
  background:
    repeating-linear-gradient(90deg, transparent 0 7px, rgba(251,246,236,.9) 7px 10px, transparent 10px 18px) top/100% 5px no-repeat,
    repeating-linear-gradient(90deg, transparent 0 7px, rgba(251,246,236,.9) 7px 10px, transparent 10px 18px) bottom/100% 5px no-repeat,
    linear-gradient(90deg, var(--ink) 0 25%, var(--ox-deep) 25% 50%, var(--ink) 50% 75%, var(--ox-deep) 75% 100%);
  border: 1px solid rgba(30,23,18,.4);
}
.lb-folio {
  position: absolute; bottom: 40%; right: 4%; z-index: 9;
  font-family: var(--display); font-style: italic; font-size: 0.9rem; color: var(--gold);
  width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center;
  border: 1px solid var(--line-gold);
  background: radial-gradient(circle at 40% 35%, rgba(251,246,236,.92), rgba(231,220,200,.6));
  box-shadow: inset 0 1px 2px rgba(255,255,255,.7), 0 6px 16px -10px rgba(30,23,18,.5);
}

.lb-cap { position: relative; z-index: 4; }
.lb-cap h2 { font-size: clamp(1.9rem, 4.4vw, 3.1rem); }
.lb-cap h2 .accent { color: var(--ox-text); font-style: italic; }
.lb-cap .lead { color: var(--ink-soft); font-size: 1.06rem; max-width: 46ch; margin-top: 14px; }
.lb-readout {
  margin-top: 22px;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  font-family: var(--head);
  font-weight: 600;
  font-size: 0.82rem;
  letter-spacing: 0.08em;
  color: var(--ink);
  border: 1px solid var(--line-strong);
  border-radius: 2px;
  padding: 12px 16px;
  background: var(--surface);
}
.lb-readout b { font-variant-numeric: tabular-nums; color: var(--ox-text); min-width: 6ch; }
.lb-readout .pct { color: var(--gold); }
.lb-readout.done b, .lb-readout.done .pct { color: var(--gold); }
.lb-marks { display: flex; gap: 12px; align-items: center; margin-top: 20px; }
.lb-marks .pm { position: static; }

@media (prefers-reduced-motion: reduce) {
  .lbc { opacity: 1 !important; transform: none !important; }
}

/* ================================================================
   LOOKBOOK GALLERY — editorial grid of cut works
   ================================================================ */
.lookbook {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: clamp(16px, 2.4vw, 30px);
}
.tile {
  position: relative;
  background: var(--paper);
  padding: 10px 10px 0;
  box-shadow: var(--shadow-card);
  overflow: hidden;
}
.tile::after {  /* clean editorial hairline frame */
  content: "";
  position: absolute; inset: 10px 10px 0;
  border: 1px solid rgba(30,23,18,.08);
  pointer-events: none;
}
.tile img {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  display: block;
  filter: saturate(1.02) contrast(1.02);
  transition: transform 700ms var(--ease), filter 700ms var(--ease);
}
.tile:hover img { transform: scale(1.04); filter: saturate(1.08) contrast(1.05); }
.tile .cap {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 10px;
  padding: 14px 4px 16px;
}
.tile .cap .t { font-family: var(--display); font-style: italic; font-size: 1.1rem; color: var(--ink); }
.tile .cap .p { font-family: var(--head); font-size: 0.68rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold); }
.tile .tag {
  position: absolute; top: 20px; left: 0; z-index: 2;
  font-family: var(--head); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--paper); background: var(--ox); padding: 6px 12px;
}
.tile.span-6 { grid-column: span 6; }
.tile.span-4 { grid-column: span 4; }
.tile.span-3 { grid-column: span 3; }
.tile.span-8 { grid-column: span 8; }
.tile.span-6 img, .tile.span-8 img { aspect-ratio: 3 / 2; }
.tile.tall img { aspect-ratio: 3 / 4; }
@media (max-width: 720px) { .tile.span-6, .tile.span-4, .tile.span-3, .tile.span-8 { grid-column: span 12; } }

/* ================================================================
   SPLIT (media + text)
   ================================================================ */
.split {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(28px, 5vw, 64px);
  align-items: center;
}
@media (min-width: 880px) { .split { grid-template-columns: 1fr 1fr; } }
.split .media { position: relative; background: var(--paper); padding: 12px; box-shadow: var(--shadow-cut); }
.split .media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.split .media .stain {
  position: absolute; bottom: -14px; right: -10px; z-index: 2;
  width: 84px; height: 84px; border-radius: 50%;
  border: 1px solid var(--line-gold);
  background: radial-gradient(circle at 40% 35%, rgba(251,246,236,.9), rgba(231,220,200,.5));
  box-shadow: 0 10px 22px -14px rgba(30,23,18,.5);
}
.split .media .stain::after {
  content: "İST"; position: absolute; inset: 0; display: grid; place-items: center;
  font-family: var(--display); font-style: italic; font-size: 0.82rem; color: var(--gold);
}
.lead { font-size: 1.12rem; color: var(--ink-soft); }
.do-list { display: grid; gap: 6px; margin-top: 8px; }
.do-list li {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 18px;
  align-items: start;
  padding: 20px 0;
  border-bottom: 1px solid var(--line);
}
.do-list .num {
  font-family: var(--display);
  font-style: italic;
  font-size: 1.5rem;
  color: var(--gold);
  line-height: 1;
}
.do-list h3 { font-size: 1.3rem; margin-bottom: 6px; }
.do-list p { color: var(--ink-mute); margin: 0; font-size: 0.98rem; }
.do-list a { color: var(--ox-text); }

/* ================================================================
   RESERVATION TOOL
   ================================================================ */
.rez {
  position: relative;
  background: var(--surface);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-card);
  padding: clamp(22px, 3.4vw, 44px);
}
.rez::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--ox), var(--gold) 60%, var(--gold-2));
}
.rez-grid { display: grid; grid-template-columns: 1fr; gap: clamp(24px, 3.4vw, 44px); }
@media (min-width: 860px) { .rez-grid { grid-template-columns: 0.9fr 1.1fr; } }
.rez-form { display: grid; gap: 20px; align-content: start; }
.rez .field { display: grid; gap: 8px; }
.rez label.lbl {
  font-family: var(--head);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.rez input, .rez select {
  width: 100%;
  background: var(--paper);
  border: 1px solid var(--line-strong);
  color: var(--ink);
  font-family: var(--body);
  font-size: 1rem;
  padding: 13px 14px;
  border-radius: 2px;
  transition: border-color 200ms var(--ease), box-shadow 200ms var(--ease);
}
.rez input:focus, .rez select:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(169,133,62,.16); }
.rez .stepper { display: grid; grid-template-columns: 52px 1fr 52px; border: 1px solid var(--line-strong); border-radius: 2px; overflow: hidden; }
.rez .stepper button {
  background: var(--surface-2);
  color: var(--ink);
  border: 0;
  font-family: var(--display);
  font-size: 1.3rem;
  cursor: pointer;
  min-height: 48px;
  transition: background 180ms var(--ease), color 180ms var(--ease);
}
.rez .stepper button:hover { background: var(--ox); color: var(--paper); }
.rez .stepper input { border: 0; text-align: center; font-family: var(--display); font-size: 1.2rem; background: var(--paper); border-radius: 0; }
.rez-note { font-size: 0.86rem; color: var(--ink-faint); }

.rez-out {
  background: var(--paper);
  border: 1px solid var(--line);
  padding: clamp(18px, 2.6vw, 28px);
  align-content: start;
}
.rez-out h3 { font-family: var(--display); font-size: 1.4rem; margin-bottom: 14px; color: var(--ink); }
.rez-slot {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px 12px;
  align-items: baseline;
  border: 1px solid var(--line);
  background: var(--surface);
  padding: 14px 16px;
  margin-bottom: 10px;
}
.rez-slot .when { font-family: var(--display); font-style: italic; font-size: 1.06rem; color: var(--ink); }
.rez-slot .meta { grid-column: 1 / -1; color: var(--ink-mute); font-size: 0.86rem; }
.rez-slot .kont {
  font-family: var(--head);
  font-size: 0.64rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--paper);
  background: var(--ink);
  padding: 5px 10px;
  white-space: nowrap;
}
.rez-slot .kont.low { background: var(--ox); }
.rez-slot.full { opacity: 0.55; }
.rez-slot.full .kont { background: var(--surface-3); color: var(--ink-mute); }
.rez-total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 2px solid var(--gold);
}
.rez-total .lab { font-family: var(--head); font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.12em; color: var(--ink-soft); }
.rez-total .val { font-family: var(--display); font-size: 1.7rem; color: var(--ox-text); }
.rez-warn {
  margin-top: 14px;
  padding: 14px 16px;
  border: 1px solid var(--line-gold);
  background: rgba(169,133,62,.08);
  color: var(--ink-soft);
  font-size: 0.92rem;
}
.rez-warn b { color: var(--ox-text); }
.rez-empty { color: var(--ink-mute); font-style: italic; }

/* ================================================================
   ATMOS — mekan / pull-quote band
   ================================================================ */
.atmos { position: relative; color: var(--paper); overflow: hidden; background: var(--ink); }
.atmos-media { position: absolute; inset: 0; z-index: 0; }
.atmos-media img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(.35) contrast(1.05) brightness(.6); }
.atmos-media::after {
  content: "";
  position: absolute; inset: 0;
  background:
    radial-gradient(rgba(0,0,0,.28) 0.5px, transparent 0.6px) 0 0/5px 5px,
    linear-gradient(120deg, rgba(30,23,18,.86), rgba(87,16,24,.6) 60%, rgba(30,23,18,.8));
}
.atmos-inner { position: relative; z-index: 2; padding: clamp(64px, 10vw, 130px) 0; }
.atmos .eyebrow { color: var(--gold-2); }
.atmos .eyebrow::before { background: var(--gold-2); }
.atmos blockquote {
  font-family: var(--display);
  font-size: clamp(1.8rem, 5vw, 3.4rem);
  line-height: 1.16;
  font-weight: 600;
  letter-spacing: -0.01em;
  max-width: 20ch;
  color: var(--paper);
  position: relative;
}
.atmos blockquote::before {
  content: "\201C"; font-family: var(--display); font-size: 3em; line-height: 0;
  color: var(--gold); opacity: .5; position: absolute; left: -0.5em; top: 0.35em;
}
.atmos blockquote .accent { color: var(--gold-2); font-style: italic; }
.atmos blockquote .accent2 { color: var(--gold); font-style: italic; }
.atmos cite {
  display: block;
  margin-top: 22px;
  font-family: var(--body);
  font-style: normal;
  font-size: 1.02rem;
  color: rgba(247,241,230,.72);
  max-width: 52ch;
}
.atmos-facts {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(24px, 4vw, 56px);
  margin-top: clamp(36px, 5vw, 60px);
  padding-top: 30px;
  border-top: 1px solid rgba(203,167,101,.3);
}
.atmos-facts .fact { min-width: 110px; }
.atmos-facts .n { font-family: var(--display); font-size: clamp(2.4rem, 6vw, 4rem); color: var(--gold-2); line-height: 1; font-variant-numeric: tabular-nums; }
.atmos-facts .k {
  display: block;
  margin-top: 10px;
  font-family: var(--head);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(247,241,230,.7);
}

/* ================================================================
   BILET — tiers
   ================================================================ */
.tiers { display: grid; grid-template-columns: 1fr; gap: clamp(18px, 2.6vw, 28px); }
@media (min-width: 760px) { .tiers { grid-template-columns: repeat(3, 1fr); } }
.tier {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: var(--surface);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-card);
  padding: clamp(24px, 3vw, 36px);
}
.tier.featured {
  background: var(--paper);
  border-color: var(--gold);
  box-shadow: 0 2px 4px rgba(30,23,18,.06), 0 30px 60px -30px rgba(110,22,34,.4);
}
.tier.featured::before {
  content: ""; position: absolute; inset: 0; border: 1px solid var(--line-gold); pointer-events: none;
  margin: 5px;
}
.tier .rib {
  position: absolute; top: 18px; right: -1px;
  font-family: var(--head); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--paper); background: var(--ox); padding: 6px 14px;
}
.tier h3 { font-size: 1.5rem; font-family: var(--display); }
.tier .price { font-family: var(--display); font-size: 2.4rem; color: var(--ox-text); line-height: 1; }
.tier .price small { display: block; font-family: var(--head); font-size: 0.72rem; font-weight: 500; letter-spacing: 0.06em; color: var(--ink-mute); margin-top: 8px; text-transform: none; }
.tier .incl { display: grid; gap: 10px; margin: 6px 0; }
.tier .incl li { position: relative; padding-left: 22px; font-size: 0.96rem; color: var(--ink-soft); }
.tier .incl li::before { content: ""; position: absolute; left: 0; top: 10px; width: 8px; height: 8px; background: var(--gold); transform: rotate(45deg); }
.tier .excl { display: grid; gap: 8px; }
.tier .excl li { position: relative; padding-left: 22px; font-size: 0.9rem; color: var(--ink-faint); }
.tier .excl li::before { content: "×"; position: absolute; left: 2px; top: -1px; color: var(--ink-faint); font-family: var(--head); }
.tier .foot { margin-top: auto; padding-top: 8px; }
.tier .foot .btn { width: 100%; }
.price-note { font-family: var(--head); font-size: 0.82rem; color: var(--ink-faint); margin-top: clamp(20px, 3vw, 32px); max-width: 70ch; }

/* ================================================================
   AKIS — timeline
   ================================================================ */
.timeline { display: grid; gap: 0; margin-top: 10px; }
.tstep {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(18px, 3vw, 40px);
  padding: clamp(22px, 3vw, 34px) 0;
  border-bottom: 1px solid var(--line);
}
.tstep .mark {
  font-family: var(--display);
  font-style: italic;
  font-size: clamp(2rem, 5vw, 3.2rem);
  color: var(--gold);
  line-height: 1;
}
.tstep .when {
  display: block;
  font-family: var(--head);
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ox-text);
  margin-bottom: 8px;
}
.tstep h3 { font-size: 1.4rem; margin: 0 0 8px; }
.tstep p { color: var(--ink-mute); margin: 0; }

/* ================================================================
   YORUMLAR — pull-quote cards
   ================================================================ */
.quotes { display: grid; grid-template-columns: 1fr; gap: clamp(18px, 2.6vw, 28px); }
@media (min-width: 820px) { .quotes { grid-template-columns: repeat(3, 1fr); } }
.quote {
  position: relative;
  background: var(--surface);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-card);
  padding: clamp(24px, 3vw, 34px);
  padding-top: clamp(34px, 4vw, 48px);
}
.quote::before {
  content: "\201C";
  position: absolute; top: 6px; left: 18px;
  font-family: var(--display); font-size: 4.4rem; line-height: 1;
  color: var(--gold); opacity: .5;
}
.quote p { font-family: var(--display); font-size: 1.06rem; line-height: 1.5; color: var(--ink); margin: 0 0 18px; }
.quote .who { font-family: var(--head); font-weight: 600; font-size: 0.9rem; color: var(--ink); }
.quote .who span { display: block; font-weight: 500; color: var(--ink-faint); font-size: 0.72rem; letter-spacing: 0.06em; text-transform: uppercase; margin-top: 4px; }

/* ================================================================
   NOTLAR — editorial notes
   ================================================================ */
.notes { display: grid; gap: 0; border-top: 1px solid var(--line); }
.note {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(16px, 3vw, 36px);
  align-items: baseline;
  padding: 22px 0;
  border-bottom: 1px solid var(--line);
}
.note time { font-family: var(--head); font-size: 0.7rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ox-text); white-space: nowrap; }
.note p { margin: 0; color: var(--ink-soft); font-size: 1.02rem; }

/* ================================================================
   FAQ
   ================================================================ */
.faq { display: grid; gap: 12px; max-width: 900px; }
.faq-item { background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-card); }
.faq-item summary {
  list-style: none;
  cursor: pointer;
  padding: 20px clamp(18px, 3vw, 26px);
  font-family: var(--head);
  font-weight: 600;
  font-size: 1.02rem;
  color: var(--ink);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; font-family: var(--display); font-size: 1.5rem; color: var(--gold); transition: transform 300ms var(--ease); line-height: 1; }
.faq-item[open] summary::after { transform: rotate(45deg); }
.faq-item > .answer { height: 0; overflow: hidden; padding: 0 clamp(18px, 3vw, 26px); transition: height 360ms var(--ease2), padding-block-end 360ms var(--ease2); }
.faq-item[open] > .answer { height: auto; padding-block-end: 24px; }
.faq-item > .answer p { color: var(--ink-soft); margin: 0; }
@media (prefers-reduced-motion: reduce) { .faq-item > .answer { transition: none; } }

/* ================================================================
   CTA card (index iletisim)
   ================================================================ */
.cta-card {
  position: relative;
  background: var(--ink);
  color: var(--paper);
  padding: clamp(28px, 4vw, 44px);
  box-shadow: var(--shadow-cut);
  overflow: hidden;
}
.cta-card::before {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(120% 90% at 100% 0%, rgba(169,133,62,.18), transparent 55%);
  pointer-events: none;
}
.cta-card .eyebrow { color: var(--gold-2); position: relative; }
.cta-card h3 { font-family: var(--display); font-size: clamp(1.5rem, 3vw, 2.1rem); color: var(--paper); position: relative; }
.cta-card p { color: rgba(247,241,230,.74); position: relative; margin: 14px 0 22px; }
.cta-card .btn { position: relative; }
.cta-card .btn-ghost { color: var(--gold-2); border-color: rgba(203,167,101,.4); }
.cta-card .btn-ghost:hover { background: rgba(203,167,101,.12); color: var(--paper); }

/* ================================================================
   CONTACT / ABOUT subpages
   ================================================================ */
.contact-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.ccard {
  background: var(--surface);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-card);
  padding: 24px;
  transition: transform 240ms var(--ease2), box-shadow 240ms var(--ease2), border-color 240ms var(--ease2);
}
.ccard:hover { transform: translateY(-3px); border-color: var(--gold); box-shadow: var(--shadow-cut); }
.ccard .mk {
  width: 46px; height: 46px; display: grid; place-items: center; margin-bottom: 14px;
  font-family: var(--display); font-weight: 700; font-size: 1.1rem; color: var(--gold);
  background: var(--ink); border: 1px solid var(--gold); border-radius: 2px;
}
.ccard h3 { font-family: var(--head); font-size: 0.72rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 8px; }
.ccard a, .ccard .val { color: var(--ink); font-weight: 600; word-break: break-word; }
.ccard .val { display: block; font-family: var(--display); font-size: 1.1rem; }
a.ccard:hover .val, .ccard a:hover { color: var(--ox-text); }
.ccard .sub { color: var(--ink-faint); font-size: 0.86rem; margin-top: 6px; }

.hours-grid { display: grid; gap: 6px; margin-top: 8px; }
.hours-grid .row {
  display: flex; justify-content: space-between; gap: 12px;
  padding: 13px 18px;
  background: var(--surface);
  border: 1px solid var(--line);
}
.hours-grid .row.today { border-color: var(--gold); background: var(--paper); }
.hours-grid .row .d { font-family: var(--head); font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.82rem; }
.hours-grid .row.today .d { color: var(--ox-text); }
.hours-grid .row .h { color: var(--ink-mute); font-size: 0.92rem; font-variant-numeric: tabular-nums; }

.team-grid { display: grid; grid-template-columns: 1fr; gap: clamp(18px, 2.6vw, 28px); }
@media (min-width: 720px) { .team-grid { grid-template-columns: repeat(3, 1fr); } }
.member { background: var(--paper); border: 1px solid var(--line); box-shadow: var(--shadow-card); overflow: hidden; }
.member img, .member .avatar { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; display: block; }
.member .avatar { display: grid; place-items: center; background: var(--surface-3); font-family: var(--display); font-size: 2.4rem; color: var(--gold); }
.member .body { padding: 22px; }
.member h3 { font-size: 1.3rem; font-family: var(--display); }
.member .role { font-family: var(--head); font-size: 0.68rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.14em; color: var(--ox-text); margin: 6px 0 12px; }
.member p { color: var(--ink-mute); font-size: 0.94rem; margin: 0; }

/* ================================================================
   FOOTER — masthead colophon
   ================================================================ */
.site-footer {
  background: var(--ink);
  border-top: 1px solid var(--line-gold);
  padding: clamp(52px, 7vw, 84px) 0 32px;
  color: rgba(247,241,230,.7);
  position: relative;
}
.site-footer::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold) 30%, var(--gold-2) 70%, transparent);
  opacity: .6;
}
.footer-top { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: clamp(28px, 4vw, 52px); }
@media (max-width: 900px) { .footer-top { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .footer-top { grid-template-columns: 1fr; } }
.footer-brand .brand { color: var(--paper); font-size: 1.5rem; margin-bottom: 16px; }
.footer-brand .brand b { color: var(--gold-2); }
.footer-brand p { font-size: 0.94rem; max-width: 34ch; color: rgba(247,241,230,.6); }
.footer-col h4 { font-family: var(--head); font-size: 0.72rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold-2); margin-bottom: 16px; }
.footer-col a, .footer-col span { display: block; color: rgba(247,241,230,.68); padding: 5px 0; margin: 0; font-size: 0.94rem; word-break: break-word; overflow-wrap: anywhere; transition: color 200ms var(--ease); }
.footer-col a:hover { color: var(--gold-2); }
.footer-legal {
  margin-top: 44px; padding-top: 24px;
  border-top: 1px solid rgba(203,167,101,.24);
  display: flex; flex-wrap: wrap; gap: 8px 20px;
  justify-content: space-between; align-items: center;
  font-family: var(--head); font-size: 0.8rem; color: rgba(247,241,230,.55);
}
.footer-legal .links a { display: inline; margin-right: 16px; color: rgba(247,241,230,.6); }
.footer-legal .links a:hover { color: var(--gold-2); }

/* ================================================================
   PAGE HERO (subpages) — collaged masthead
   ================================================================ */
.page-hero {
  position: relative;
  padding: calc(var(--header-h) + clamp(44px, 7vw, 88px)) 0 clamp(40px, 5vw, 64px);
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(169,133,62,.14), transparent 55%),
    linear-gradient(180deg, var(--paper), var(--bg));
  border-bottom: 1px solid var(--line-gold);
  overflow: hidden;
}
.page-hero::before {
  content: "";
  position: absolute; inset: 0;
  background-image: repeating-linear-gradient(90deg, transparent 0 calc(20% - 1px), rgba(30,23,18,.05) calc(20% - 1px), rgba(30,23,18,.05) 20%);
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,.5), transparent 80%);
  mask-image: linear-gradient(180deg, rgba(0,0,0,.5), transparent 80%);
  opacity: .7; pointer-events: none;
}
.page-hero .container { position: relative; z-index: 2; }
.page-hero h1 { font-family: var(--display); font-size: clamp(2.6rem, 7vw, 5rem); letter-spacing: -0.02em; }
.page-hero p { color: var(--ink-soft); max-width: 60ch; margin-top: 16px; font-size: 1.1rem; }

/* prose (legal / about) */
.prose { max-width: 800px; }
.prose h2 { font-family: var(--display); font-size: clamp(1.6rem, 3vw, 2.1rem); margin: 44px 0 14px; }
.prose h3 { font-family: var(--display); font-size: 1.25rem; margin: 28px 0 10px; }
.prose p, .prose li { color: var(--ink-soft); }
.prose ul { display: grid; gap: 8px; margin: 12px 0 22px; }
.prose ul li { position: relative; padding-left: 22px; }
.prose ul li::before { content: ""; position: absolute; left: 0; top: 11px; width: 8px; height: 8px; background: var(--gold); transform: rotate(45deg); }
.prose a { color: var(--ox-text); text-decoration: underline; text-underline-offset: 3px; }

/* ================================================================
   FORM (contact) + generic fields
   ================================================================ */
.form {
  display: grid;
  gap: 20px;
  background: var(--surface);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-card);
  padding: clamp(24px, 3.4vw, 42px);
}
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 640px) { .form-row { grid-template-columns: 1fr; } }
.field { display: grid; gap: 8px; }
.field > span, .field > .lbl, .field > label {
  font-family: var(--head);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 0.72rem;
  color: var(--ink-soft);
}
.field .req { color: var(--ox-text); }
.field input, .field select, .field textarea {
  width: 100%;
  background: var(--paper);
  border: 1px solid var(--line-strong);
  color: var(--ink);
  font-family: var(--body);
  font-size: 1rem;
  padding: 13px 14px;
  border-radius: 2px;
  transition: border-color 200ms var(--ease), box-shadow 200ms var(--ease);
}
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(169,133,62,.16); }
.field textarea { min-height: 130px; resize: vertical; }
.field.kvkk { grid-template-columns: auto 1fr; align-items: start; gap: 12px; font-size: 0.9rem; color: var(--ink-mute); text-transform: none; letter-spacing: 0.01em; }
.field.kvkk a { color: var(--ox-text); text-decoration: underline; }
.field input[type="checkbox"] {
  appearance: auto; -webkit-appearance: auto;
  width: 18px; height: 18px; min-width: 18px; min-height: 18px;
  padding: 0; border: 0; margin: 3px 0 0; accent-color: var(--ox);
}

/* ================================================================
   TABLE
   ================================================================ */
.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);
}
.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 { background: var(--surface); }
table th, table td { text-align: left; padding: 13px 16px; border-bottom: 1px solid var(--line); font-size: 0.94rem; }
table th { font-family: var(--head); font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.72rem; color: var(--paper); background: var(--ink); }
table td { color: var(--ink-soft); }
table tbody tr:nth-child(even) { background: rgba(169,133,62,.05); }

/* ================================================================
   COOKIE BANNER
   ================================================================ */
.cookie-banner {
  position: fixed;
  bottom: 16px; left: 16px; right: 16px;
  max-width: 520px;
  margin: 0 auto;
  z-index: 9999;
  background: var(--paper);
  border: 1px solid var(--line-strong);
  border-top: 3px solid var(--ox);
  box-shadow: 0 22px 54px -22px rgba(30,23,18,.6);
  padding: 22px 24px;
  transform: translateY(140%);
  opacity: 0;
  transition: transform 280ms var(--ease), opacity 240ms var(--ease);
}
.cookie-banner.is-visible { transform: translateY(0); opacity: 1; }
@media (min-width: 720px) { .cookie-banner { left: 24px; right: auto; max-width: 420px; } }
.cookie-banner h2 { font-family: var(--display); font-size: 1.2rem; margin-bottom: 8px; }
.cookie-banner p { font-size: 0.9rem; color: var(--ink-soft); margin-bottom: 14px; }
.cookie-banner p a { color: var(--ox-text); text-decoration: underline; }
.cookie-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.cookie-actions button {
  flex: 1 1 auto; min-height: 44px;
  font-family: var(--head); font-weight: 600; text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.72rem;
  padding: 11px 14px; border: 1px solid var(--line-strong); background: transparent; color: var(--ink); cursor: pointer;
  transition: background 180ms var(--ease), color 180ms var(--ease), border-color 180ms var(--ease);
}
.cookie-actions button[data-consent="accept"] { background: var(--ox); color: var(--paper); border-color: var(--ox); }
.cookie-actions button[data-consent="accept"]:hover { background: var(--ink); color: var(--gold-2); border-color: var(--ink); }
.cookie-actions button:hover { border-color: var(--gold); }

/* ================================================================
   REVEAL (slow refined)
   ================================================================ */
.reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 800ms var(--ease), transform 800ms var(--ease);
  transition-delay: calc(var(--i, 0) * 90ms);
}
.reveal.is-in { opacity: 1; transform: none; }
html.no-js .reveal { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* ================================================================
   PRELOADER + gold-dust motes
   ================================================================ */
#pre {
  position: fixed; inset: 0; z-index: 9999;
  background: var(--bg);
  display: grid; place-items: center;
  transition: opacity .7s ease, visibility .7s;
}
#pre.done { opacity: 0; visibility: hidden; pointer-events: none; }
#pre .pl-in { text-align: center; }
#pre .pl-mark {
  font-family: var(--display); font-weight: 600; font-size: clamp(30px, 7vw, 60px);
  letter-spacing: 0.01em; color: var(--ink);
}
#pre .pl-mark em { color: var(--ox-text); font-style: italic; }
#pre .pl-sub { font-family: var(--head); font-size: 0.68rem; letter-spacing: 0.34em; text-transform: uppercase; color: var(--ink-mute); margin-top: 12px; }
#pre .pl-bar { margin: 24px auto 0; width: min(220px, 60vw); height: 3px; background: var(--surface-3); overflow: hidden; position: relative; }
#pre .pl-bar i { position: absolute; inset: 0; width: 0; background: linear-gradient(90deg, var(--ox), var(--gold) 60%, var(--gold-2)); animation: plFill 1.15s cubic-bezier(.5,0,.2,1) forwards; }
@keyframes plFill { to { width: 100%; } }

#motes { position: fixed; inset: 0; z-index: 3; pointer-events: none; mix-blend-mode: multiply; opacity: .5; }

/* scroll progress (polish.py injected element) */
.scroll-progress { position: fixed; top: 0; left: 0; height: 2px; width: 0; background: linear-gradient(90deg, var(--ox), var(--gold-2)); z-index: 9998; transition: width 80ms linear; pointer-events: none; }

/* grid overflow safety */
.split > *, .rez-grid > *, .tiers > *, .quotes > *, .team-grid > *,
.footer-top > *, .do-list li > div, .contact-cards > *, .lb-wrap > *, .hero-inner > * { min-width: 0; }
.rez-out, .rez-form { min-width: 0; }

/* desktop nav visibility */
@media (min-width: 1000px) {
  .nav-desktop { display: flex; align-items: center; }
  .nav-toggle { display: none; }
}

/* ================================================================
   ✦ COUTURE ELEVATION LAYER ✦
   Top-tier high-fashion editorial polish, appended so it refines the
   working system without rewiring it. Restrained cream/oxblood + gold.
   ================================================================ */

/* --- refined tokens: multi-layer shadows + a true foil gradient --- */
:root {
  --shadow-card:
    0 1px 1px rgba(30,23,18,.05),
    0 3px 8px -3px rgba(30,23,18,.12),
    0 22px 48px -30px rgba(30,23,18,.5);
  --shadow-cut:
    0 1px 2px rgba(30,23,18,.14),
    0 4px 12px -4px rgba(30,23,18,.2),
    0 30px 64px -32px rgba(30,23,18,.6);
  --shadow-plate:
    0 1px 2px rgba(30,23,18,.16),
    0 10px 24px -12px rgba(30,23,18,.32),
    0 40px 80px -44px rgba(30,23,18,.6);
  /* real leaf-foil sweep: dark bronze → pale champagne → deep gold */
  --foil: linear-gradient(100deg,
    #7f5f27 0%, #b48c3f 16%, #e9d69a 34%, #fbf3d6 46%,
    #cba765 58%, #9a7a34 74%, #d8bd7c 88%, #856733 100%);
}

/* --- fine second grain + soft page vignette for tactile paper --- */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(140% 120% at 50% -10%, transparent 58%, rgba(30,23,18,.05) 100%),
    radial-gradient(rgba(30,23,18,.02) 0.5px, transparent 0.6px) 0 0 / 3px 3px;
  mix-blend-mode: multiply;
  opacity: .7;
}

/* ---------------- couture typography ---------------- */
h1, h2, h3 { text-wrap: balance; font-feature-settings: "liga" 1, "kern" 1; }
.hero h1 { letter-spacing: -0.035em; }
.section-head h2 { font-size: clamp(2.1rem, 5.7vw, 3.95rem); letter-spacing: -0.024em; }
.section-head p { text-wrap: pretty; }

/* drop-cap on lead paragraphs (one couture opening per spread) */
.lead::first-letter {
  font-family: var(--display);
  float: left;
  font-size: 3.1em;
  line-height: 0.66;
  font-weight: 600;
  padding: 8px 12px 2px 0;
  margin-top: 4px;
  color: var(--ox);
  -webkit-text-fill-color: var(--ox);
}
@media (prefers-reduced-motion: reduce) { .lead::first-letter { margin-top: 2px; } }

/* letterpress kicker gets a trailing hair-rule + gold end-dot */
.eyebrow::after {
  content: "";
  width: 22px;
  height: 1.5px;
  background: linear-gradient(90deg, var(--gold-2), transparent);
  margin-left: 2px;
}
.hero-eyebrow, .section-head .eyebrow { position: relative; }

/* ---------------- foil-stamped mastheads ---------------- */
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .foil,
  .hero h1 .accent2,
  .lb-masthead {
    background: var(--foil);
    background-size: 260% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
  }
  .lb-masthead span { -webkit-text-fill-color: transparent; color: transparent; }
  @media (prefers-reduced-motion: no-preference) {
    .hero h1 .accent2, .lb-masthead, .foil { animation: foilShift 7s ease-in-out infinite; }
  }
}
@keyframes foilShift {
  0%, 100% { background-position: 0% center; }
  50% { background-position: 100% center; }
}
/* keep the composed masthead legible with a foil under-rule */
.lb-masthead { border-bottom-color: var(--gold); text-shadow: 0 1px 0 rgba(251,246,236,.6); }

/* brand wordmark: subtle gold on the surname, refined */
.footer-brand .brand b { color: var(--gold-2); }

/* ---------------- refined cut-out plates (matte + glossy) ---------------- */
.hero-cut, .lb-ph, .pm-cut, .tile, .split .media {
  box-shadow: var(--shadow-plate);
}
/* inner matte gold hairline frame — the "mounted print" look */
.hero-cut::before, .lb-ph::before, .split .media::before {
  content: "";
  position: absolute;
  inset: 6px;
  z-index: 2;
  border: 1px solid rgba(203,167,101,.30);
  pointer-events: none;
}
.split .media::before { inset: 12px; }
/* glossy top-light + torn/deckle sheen sweep on hover */
.hero-cut::after, .pm-cut::after, .split .media::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(255,255,255,.22), transparent 22%),
    linear-gradient(115deg, transparent 38%, rgba(247,238,200,.5) 50%, transparent 62%);
  background-size: 100% 100%, 250% 100%;
  background-position: 0 0, 160% 0;
  background-repeat: no-repeat;
  mix-blend-mode: screen;
  opacity: .5;
  transition: opacity .45s var(--ease), background-position .9s var(--ease);
}
.hero-cut:hover::after, .pm-cut:hover::after, .split .media:hover::after {
  opacity: 1;
  background-position: 0 0, -60% 0;
}
.tile { position: relative; }
.tile > .glint, .tile::before {
  content: "";
  position: absolute;
  inset: 10px 10px 0;
  z-index: 3;
  pointer-events: none;
  background: linear-gradient(115deg, transparent 40%, rgba(247,238,200,.55) 50%, transparent 60%);
  background-size: 250% 100%;
  background-position: 170% 0;
  opacity: 0;
  transition: opacity .4s var(--ease), background-position .9s var(--ease);
}
.tile:hover::before { opacity: 1; background-position: -70% 0; }

/* ---------------- gold shimmer + lift on editorial cards ---------------- */
.tier, .quote, .faq-item, .cta-card, .ccard, .rez, .rez-out, .member {
  transition: transform .45s var(--ease), box-shadow .45s var(--ease), border-color .45s var(--ease);
}
.tier:hover, .quote:hover, .member:hover {
  transform: translateY(-4px);
  border-color: var(--line-gold);
  box-shadow: var(--shadow-cut);
}
.tier.featured:hover { border-color: var(--gold); }
.faq-item:hover { border-color: var(--line-gold); }
.quote::after {
  content: "";
  position: absolute;
  left: clamp(24px, 3vw, 34px);
  bottom: 18px;
  width: 34px;
  height: 2px;
  background: var(--foil);
  opacity: 0;
  transform: scaleX(.4);
  transform-origin: left;
  transition: opacity .45s var(--ease), transform .45s var(--ease);
}
.quote:hover::after { opacity: 1; transform: scaleX(1); }

/* refined gold sheen wipe across primary/ghost buttons */
.btn { position: relative; overflow: hidden; isolation: isolate; }
@media (prefers-reduced-motion: no-preference) {
  .btn::after {
    content: "";
    position: absolute;
    top: 0; left: -75%;
    width: 45%; height: 100%;
    z-index: -1;
    background: linear-gradient(105deg, transparent, rgba(247,238,200,.4), transparent);
    transform: skewX(-18deg);
    transition: left .6s var(--ease);
  }
  .btn-primary::after { background: linear-gradient(105deg, transparent, rgba(203,167,101,.55), transparent); }
  .btn:hover::after, .btn:focus-visible::after { left: 135%; }
}

/* ---------------- hairline-gold section seams (running rules) ---------------- */
.section::before {
  content: "";
  position: absolute;
  top: 0;
  left: var(--pad);
  right: var(--pad);
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--line-gold) 18%, var(--line-gold) 82%, transparent);
  opacity: .42;
  pointer-events: none;
}
.section.atmos::before { left: 0; right: 0; opacity: .5; }

/* ---------------- richer poster/marquee + readout polish ---------------- */
.poster-strip { position: relative; }
.poster-strip .label { position: relative; }
.poster-strip .pill { transition: border-color .3s var(--ease), color .3s var(--ease), transform .3s var(--ease); }
.poster-strip .pill:hover { border-color: var(--gold-2); transform: translateY(-1px); }
.lb-readout { box-shadow: var(--shadow-card); background: linear-gradient(135deg, var(--surface), var(--paper)); }
.lb-readout.done { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(169,133,62,.14), var(--shadow-card); }

/* running-head folio slug (decorative, injected per section) */
.run-head {
  position: absolute;
  top: 18px;
  left: var(--pad);
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--head);
  font-size: 0.6rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--ink-faint);
  pointer-events: none;
}
.run-head::before {
  content: "";
  width: 16px;
  height: 1.5px;
  background: linear-gradient(90deg, var(--gold), var(--gold-2));
}
.run-head b { color: var(--ox-text); font-weight: 700; letter-spacing: 0.14em; }
.section-head { padding-top: 6px; }
@media (max-width: 900px) { .run-head { display: none; } }

/* foil-edged stamps sharpen on the eye */
.pm-stamp, .lb-stamp { text-shadow: 0 1px 0 rgba(251,246,236,.5); }

/* keep the couture overlays off when motion is reduced (no sweeps) */
@media (prefers-reduced-motion: reduce) {
  .hero-cut::after, .pm-cut::after, .split .media::after,
  .tile::before, .quote::after, .btn::after { transition: none; }
}

/* fix: header CTA (.nav-cta 'Seans Ayır') had dark text on dark oxblood bg (overridden by .nav-desktop a) — restore light text */
.nav-desktop a.nav-cta, .drawer a.nav-cta, .drawer .nav-cta{ color:#F7EFE4; }