/* ============================================================
   QAFİLE KURU KAHVE — style.css
   Siyah · altın · zümrüt. Dibek usulü bir arayüz.
   ============================================================ */

/* ---------- 1. TOKENS ---------- */
:root{
  --ink:        #0A0806;
  --ink-2:      #100C08;
  --ink-3:      #171209;
  --cream:      #EFE6D4;
  --cream-dim:  #C9BFAB;

  --gold-1:     #F6E9C3;
  --gold-2:     #D9B45E;
  --gold-3:     #A87A2C;
  --gold-line:  rgba(217,180,94,.22);

  --green:      #0C3A2B;
  --green-2:    #071E16;

  --accent:     #D9B45E;
  --tint:       #F6E9C3;

  --font-display: 'Bodoni Moda', 'Didot', 'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-serif:   'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-sans:    'Jost', 'Futura', 'Avenir Next', 'Helvetica Neue', Arial, sans-serif;

  --pad:  clamp(1.25rem, 4.5vw, 4.5rem);
  --navh: clamp(78px, 9vh, 106px);

  --ease:      cubic-bezier(.22,.61,.36,1);
  --ease-out:  cubic-bezier(.16,1,.3,1);
  --ease-soft: cubic-bezier(.65,.05,.36,1);

  --enter-y: 9%;
  --exit-y: -9%;
}

*,*::before,*::after{ box-sizing:border-box; }

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

body{
  margin:0;
  background:var(--ink);
  color:var(--cream);
  font-family:var(--font-sans);
  font-weight:300;
  font-size:clamp(15px,1.02vw,17px);
  line-height:1.68;
  letter-spacing:.012em;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

body.is-loading{ overflow:hidden; }
body.is-locked{ overflow:hidden; }

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
ul,ol,dl,dd{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,p,figure{ margin:0; }

::selection{ background:var(--gold-2); color:#0A0806; }

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0;
}

.wrap{ width:min(1440px, 100% - var(--pad)*2); margin-inline:auto; }

/* ---------- 2. TYPE ---------- */
.h-display{
  font-family:var(--font-display);
  font-weight:400;
  font-size:clamp(2.6rem, 6.4vw, 6rem);
  line-height:.98;
  letter-spacing:-.022em;
  color:var(--cream);
}
.h-display em{ font-style:italic; color:var(--gold-2); }

.eyebrow{
  display:flex; align-items:center; gap:.85em;
  font-size:.68rem; letter-spacing:.34em; text-transform:uppercase;
  font-weight:400; color:var(--gold-2);
}
.eyebrow i{ font-style:normal; opacity:.6; font-size:.62rem; letter-spacing:.1em; }
.eyebrow em{ font-style:normal; }

.lead{
  font-family:var(--font-serif);
  font-size:clamp(1.12rem,1.55vw,1.44rem);
  line-height:1.62; color:var(--cream);
  letter-spacing:.004em;
}

.gold-text{
  background:linear-gradient(96deg, var(--gold-3) 0%, var(--gold-1) 26%, var(--gold-2) 52%, var(--gold-1) 74%, var(--gold-3) 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
}

/* ---------- 2b. ALTIN MARKA İMZASI ---------- */
/* Logo PNG'si maske olarak kullanılır: zemin dökme altın,
   üstünden düzenli aralıklarla bir ışık huzmesi geçer. */
.brandmark{
  display:inline-block; position:relative; overflow:hidden; line-height:0;
  background:
    linear-gradient(168deg,
      #FDF6DF 0%, #F6E9C3 14%, #E3C77E 30%, #D9B45E 46%,
      #B9903C 62%, #E0BC69 76%, #F3E4B4 88%, #A87A2C 100%);
  -webkit-mask:url("../img/logo.png") no-repeat center / contain;
          mask:url("../img/logo.png") no-repeat center / contain;
  filter:drop-shadow(0 0 14px rgba(217,180,94,.30)) drop-shadow(0 1px 1px rgba(0,0,0,.35));
  transition:filter .5s var(--ease);
}
.brandmark img{ display:block; width:100%; height:auto; opacity:0; }

/* geçen ışık */
.brandmark::after{
  content:''; position:absolute; inset:-20% -10%;
  background:linear-gradient(102deg,
    transparent 38%,
    rgba(255,255,255,.28) 46%,
    rgba(255,253,242,.92) 50%,
    rgba(255,255,255,.28) 54%,
    transparent 62%);
  transform:translateX(-120%);
  animation:brandSheen 5.5s cubic-bezier(.5,0,.3,1) infinite;
}
@keyframes brandSheen{
  0%    { transform:translateX(-120%); }
  38%   { transform:translateX(120%); }
  100%  { transform:translateX(120%); }
}

/* maske desteklemeyen tarayıcılarda logo yine altın görünsün */
@supports not ((-webkit-mask-image:url("../img/logo.png")) or (mask-image:url("../img/logo.png"))){
  .brandmark{ background:none; }
  .brandmark::after{ display:none; }
  .brandmark img{ opacity:1;
    filter:invert(1) sepia(1) saturate(2.6) hue-rotate(3deg) brightness(1.02); }
}

.brandmark--nav img{ width:auto; height:clamp(42px,4.3vw,62px); }
.brandmark--loader{ width:min(430px,76vw); }
.brandmark--foot{ width:min(340px,58vw); }

/* ---------- 3. ATMOSFER ---------- */
.grain{
  position:fixed; inset:-120px; z-index:9000; pointer-events:none;
  opacity:.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grainShift 5s steps(6) infinite;
}
@keyframes grainShift{
  0%{transform:translate(0,0)}   20%{transform:translate(-6%,4%)}
  40%{transform:translate(4%,-5%)} 60%{transform:translate(-3%,-3%)}
  80%{transform:translate(5%,3%)}  100%{transform:translate(0,0)}
}

.vignette{
  position:fixed; inset:0; z-index:8990; pointer-events:none;
  background:radial-gradient(120% 90% at 50% 45%, transparent 42%, rgba(0,0,0,.42) 100%);
}

/* ---------- 4. CURSOR ---------- */
.cursor{ position:fixed; top:0; left:0; z-index:9500; pointer-events:none; opacity:0;
         transition:opacity .35s ease; mix-blend-mode:difference; }
.cursor.is-on{ opacity:1; }
.cursor__ring{
  position:absolute; width:36px; height:36px; margin:-18px 0 0 -18px; border-radius:50%;
  border:1px solid rgba(246,233,195,.85);
  transition:width .3s var(--ease), height .3s var(--ease), margin .3s var(--ease), opacity .3s;
}
.cursor__dot{
  position:absolute; width:4px; height:4px; margin:-2px 0 0 -2px; border-radius:50%;
  background:var(--gold-1);
}
.cursor.is-hover .cursor__ring{ width:66px; height:66px; margin:-33px 0 0 -33px; opacity:.6; }
@media (hover:none),(pointer:coarse){ .cursor{ display:none; } }

/* ---------- 5. PRELOADER ---------- */
.loader{
  position:fixed; inset:0; z-index:9800;
  display:grid; place-items:center;
  background:radial-gradient(90% 70% at 50% 40%, #17110A 0%, #060504 100%);
  transition:opacity .9s var(--ease-out), visibility .9s;
}
.loader.is-done{ opacity:0; visibility:hidden; }
.loader__inner{ text-align:center; width:min(420px, 74vw); }
.loader__logo{
  opacity:0; transform:translateY(12px);
  animation:loaderIn 1.15s var(--ease-out) .12s forwards,
            brandGlow 3.2s ease-in-out 1s infinite;
}
@keyframes loaderIn{ to{ opacity:1; transform:none; } }
@keyframes brandGlow{
  0%,100%{ filter:drop-shadow(0 0 14px rgba(217,180,94,.28)); }
  50%    { filter:drop-shadow(0 0 30px rgba(246,233,195,.5)); }
}
.loader__line{
  height:1px; margin:2.2rem auto 1.1rem; width:100%;
  background:rgba(217,180,94,.16); overflow:hidden;
}
.loader__line span{
  display:block; height:100%; width:0;
  background:linear-gradient(90deg,transparent,var(--gold-1),var(--gold-2));
  animation:loaderBar 1.5s var(--ease) .25s forwards;
}
@keyframes loaderBar{ to{ width:100%; } }
.loader__quote{
  font-family:var(--font-serif); font-style:italic;
  font-size:.98rem; color:var(--gold-2); letter-spacing:.06em;
  opacity:0; animation:fadeIn .8s ease .8s forwards;
}
@keyframes fadeIn{ to{ opacity:.85; } }

/* ---------- 6. NAV ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:900;
  height:var(--navh);
  display:flex; align-items:center; justify-content:space-between;
  padding-inline:var(--pad);
  transition:background .5s var(--ease), backdrop-filter .5s, border-color .5s, transform .55s var(--ease);
  border-bottom:1px solid transparent;
}
.nav.is-solid{
  background:rgba(8,6,4,.72);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  backdrop-filter:blur(18px) saturate(140%);
  border-bottom-color:var(--gold-line);
}
.nav.is-hidden{ transform:translateY(-102%); }

.nav__brand{ display:flex; align-items:center; transform:translateY(6px); }
.nav__brand:hover .brandmark{
  filter:drop-shadow(0 0 22px rgba(246,233,195,.55)) drop-shadow(0 1px 1px rgba(0,0,0,.35));
}

.nav__links{ display:flex; gap:clamp(1.2rem,2.4vw,2.6rem); }
.nav__links a{
  position:relative; font-size:.74rem; letter-spacing:.2em; text-transform:uppercase;
  font-weight:300; color:rgba(239,230,212,.72); padding-block:.4rem;
  transition:color .35s var(--ease);
}
.nav__links a::after{
  content:''; position:absolute; left:0; bottom:0; height:1px; width:100%;
  background:var(--gold-2); transform:scaleX(0); transform-origin:right;
  transition:transform .5s var(--ease-out);
}
.nav__links a:hover{ color:var(--gold-1); }
.nav__links a:hover::after{ transform:scaleX(1); transform-origin:left; }

.nav__right{ display:flex; align-items:center; gap:1rem; }

.burger{ display:none; width:42px; height:42px; position:relative; }
.burger span{
  position:absolute; left:11px; width:20px; height:1px; background:var(--cream);
  transition:transform .4s var(--ease), opacity .3s;
}
.burger span:nth-child(1){ top:19px; }
.burger span:nth-child(2){ top:24px; }
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(2.5px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ transform:translateY(-2.5px) rotate(-45deg); }

/* drawer — mobil menü */
.drawer{
  position:fixed; inset:0; z-index:880;
  display:flex; flex-direction:column;
  padding:calc(var(--navh) + 1rem) var(--pad) calc(var(--pad) + .4rem);
  overflow-y:auto; overscroll-behavior:contain;
  background:
    radial-gradient(96% 62% at 84% 8%,  rgba(217,180,94,.14), transparent 58%),
    radial-gradient(90% 60% at 10% 96%, rgba(217,180,94,.08), transparent 60%),
    linear-gradient(180deg,#130D06 0%,#0A0705 46%,#060403 100%);
  opacity:0; visibility:hidden; transform:translateY(-1.5%);
  transition:opacity .5s var(--ease), visibility .5s, transform .6s var(--ease-out);
}
.drawer.is-open{ opacity:1; visibility:visible; transform:none; }

/* havada asılı çekirdekler */
.drawer__beans{ position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.drawer__beans .bean{ color:var(--gold-2); }

.drawer__eyebrow{
  position:relative; z-index:1; display:flex; align-items:center; gap:1rem;
  font-size:.6rem; letter-spacing:.34em; text-transform:uppercase; color:var(--gold-2);
  opacity:0;
}
.drawer__eyebrow em{ flex:1; height:1px; background:linear-gradient(90deg,var(--gold-2),transparent); }
.drawer.is-open .drawer__eyebrow{ animation:drawerIn .5s var(--ease-out) .04s forwards; }

.drawer__nav{
  position:relative; z-index:1; margin-top:auto;
  display:flex; flex-direction:column;
}
.drawer__nav a{
  display:grid; grid-template-columns:2.2rem 1fr auto; align-items:baseline;
  gap:.2rem .3rem; padding-block:.6rem;
  border-bottom:1px solid rgba(217,180,94,.13);
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(1.38rem,5.9vw,2.05rem); line-height:1.2;
  color:var(--cream); opacity:0; transform:translateY(12px);
  transition:color .35s var(--ease);
}
.drawer.is-open .drawer__nav a{
  animation:drawerIn .55s var(--ease-out) forwards;
  animation-delay:calc(.08s + var(--i,0) * 42ms);
}
.drawer__nav a i{
  font-style:normal; font-family:var(--font-sans); font-size:.58rem;
  letter-spacing:.18em; color:var(--gold-2); opacity:.75;
  align-self:center;
}
.drawer__nav a span{ padding-right:.4rem; }
.drawer__nav a::after{
  content:'→'; font-family:var(--font-sans); font-size:.9rem;
  color:var(--gold-2); opacity:0; transform:translateX(-8px);
  transition:opacity .4s var(--ease), transform .45s var(--ease-out);
  align-self:center;
}
.drawer__nav a:active::after,
.drawer__nav a[aria-current="page"]::after{ opacity:1; transform:none; }
.drawer__nav a[aria-current="page"]{ color:var(--gold-1); }
.drawer__nav a[aria-current="page"] i{ opacity:1; }

@keyframes drawerIn{ to{ opacity:1; transform:none; } }

.drawer__foot{
  position:relative; z-index:1; margin-bottom:auto;
  padding-top:1.7rem; opacity:0;
}
.drawer.is-open .drawer__foot{ animation:drawerIn .6s var(--ease-out) .5s forwards; }
.drawer__quote{
  font-family:var(--font-serif); font-style:italic; font-size:1.02rem;
  color:var(--gold-2); letter-spacing:.04em;
}
.drawer__contact{ display:flex; flex-wrap:wrap; gap:.9rem 1.6rem; margin-top:1.1rem; }
.drawer__contact a{
  font-size:.64rem; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(239,230,212,.62);
  border-bottom:1px solid rgba(217,180,94,.32); padding-bottom:.35rem;
  transition:color .35s var(--ease), border-color .35s var(--ease);
}
.drawer__contact a:active{ color:var(--gold-1); border-color:var(--gold-2); }

/* çok kısa ekranlarda sıkıştır */
@media (max-height:680px){
  .drawer__nav a{ font-size:clamp(1.15rem,5vw,1.6rem); padding-block:.42rem; }
  .drawer__foot{ padding-top:1.1rem; }
  .drawer__quote{ font-size:.92rem; }
}

/* ---------- 7. BUTTONS ---------- */
.btn{
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  padding:.92em 1.9em; border-radius:100px;
  font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; font-weight:400;
  overflow:hidden; isolation:isolate; white-space:nowrap;
  transition:color .45s var(--ease), border-color .45s var(--ease), transform .4s var(--ease-out);
}
.btn svg{ width:1.05em; height:1.05em; }
.btn span{ position:relative; z-index:2; }
.btn::before{
  content:''; position:absolute; inset:0; z-index:1; border-radius:inherit;
  background:linear-gradient(100deg,var(--gold-3),var(--gold-1) 45%,var(--gold-2));
  transform:translateY(101%); transition:transform .55s var(--ease-out);
}
.btn:hover::before{ transform:translateY(0); }

.btn--ghost{ border:1px solid var(--gold-line); color:var(--gold-1); }
.btn--ghost:hover{ color:#0A0806; border-color:transparent; }

.btn--gold{
  color:#241703; border:1px solid rgba(255,246,222,.62);
  background:linear-gradient(177deg,
    #FCF3DA 0%, #F2DCA6 15%, #DEBB6C 40%,
    #BE9438 51%, #D4AE59 60%, #F1DDA9 86%, #C39A42 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.8),
    inset 0 -1px 0 rgba(110,76,16,.45),
    0 14px 30px -12px rgba(217,180,94,.7);
  transition:filter .4s var(--ease), box-shadow .5s var(--ease), transform .4s var(--ease-out);
}
.btn--gold::before{
  background:linear-gradient(104deg,
    transparent 38%, rgba(255,255,255,.9) 50%, transparent 62%);
  transform:translateX(-130%); inset:-45% -25%; border-radius:0;
  animation:btnSheen 4.8s cubic-bezier(.5,0,.3,1) infinite;
  transition:none;
}
@keyframes btnSheen{
  0%{ transform:translateX(-130%); } 34%{ transform:translateX(130%); }
  100%{ transform:translateX(130%); }
}
.btn--gold:hover{
  color:#1B1102; filter:brightness(1.07) saturate(1.05);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    inset 0 -1px 0 rgba(110,76,16,.45),
    0 20px 42px -14px rgba(246,233,195,.85);
}
.btn--gold:hover::before{ transform:translateX(-130%); }
.btn--full{ width:100%; }

/* ============================================================
   8. VİTRİN / SHOWCASE
   ============================================================ */
.showcase{
  position:relative; height:100svh; min-height:600px; overflow:hidden;
  isolation:isolate;
  --accent:#D9B45E; --tint:#F6E9C3;
}
.showcase[data-active="0"]{ --accent:#D9B45E; --tint:#F6E9C3; }
.showcase[data-active="1"]{ --accent:#E9C878; --tint:#FBEECB; }
.showcase[data-active="2"]{ --accent:#E3C579; --tint:#F4E6BE; }
.showcase[data-active="3"]{ --accent:#E0D7BE; --tint:#F2ECDD; }

.showcase[data-dir="down"]{ --enter-y:9%;  --exit-y:-9%;  --enter-y-ch:.55em;  }
.showcase[data-dir="up"]  { --enter-y:-9%; --exit-y:9%;   --enter-y-ch:-.55em; }

/* renk katmanları */
.sc__bg{ position:absolute; inset:0; z-index:0; background:#050403; }
.sc__layer{
  position:absolute; inset:0; opacity:0;
  transition:opacity 1.1s var(--ease-out);
}
.sc__layer[data-bg="0"]{
  background:
    radial-gradient(85% 62% at 50% 34%, #241A0C 0%, #120D07 44%, #060402 100%),
    linear-gradient(180deg,#0B0805,#050403);
}
.sc__layer[data-bg="1"]{
  background:
    radial-gradient(80% 60% at 50% 32%, #1F1808 0%, #0F0B05 46%, #050302 100%),
    linear-gradient(180deg,#0A0704,#040302);
}
.sc__layer[data-bg="2"]{
  background:
    radial-gradient(85% 62% at 50% 34%, #12503A 0%, #0A3325 42%, #03110C 100%),
    linear-gradient(180deg,#062018,#020B07);
}
.sc__layer[data-bg="3"]{
  background:
    radial-gradient(85% 62% at 50% 34%, #2A241B 0%, #14100B 44%, #050403 100%),
    linear-gradient(180deg,#0C0A07,#030302);
}
.showcase[data-active="0"] .sc__layer[data-bg="0"],
.showcase[data-active="1"] .sc__layer[data-bg="1"],
.showcase[data-active="2"] .sc__layer[data-bg="2"],
.showcase[data-active="3"] .sc__layer[data-bg="3"]{ opacity:1; }

/* ışık havuzu */
.sc__glow{
  position:absolute; z-index:1; left:50%; top:46%;
  width:min(90vw,1000px); aspect-ratio:1; transform:translate(-50%,-50%);
  background:radial-gradient(circle, color-mix(in srgb, var(--accent) 26%, transparent) 0%, transparent 62%);
  filter:blur(28px); opacity:.55; pointer-events:none;
  transition:background 1.1s var(--ease-out);
  animation:breathe 9s ease-in-out infinite;
}
@keyframes breathe{ 0%,100%{ transform:translate(-50%,-50%) scale(1); opacity:.5; }
                    50%{ transform:translate(-50%,-50%) scale(1.08); opacity:.68; } }

/* arabesk halka */
.sc__ornament{
  position:absolute; z-index:1; left:50%; top:47%;
  width:min(112vh,1080px); aspect-ratio:1; transform:translate(-50%,-50%);
  color:var(--accent); opacity:.2; pointer-events:none;
  transition:color 1.1s var(--ease-out), opacity 1.1s;
  animation:spin 78s linear infinite;
}
.sc__ornament svg{ width:100%; height:100%; }
.sc__petals{ transform-origin:300px 300px; animation:spinBack 120s linear infinite; }
@keyframes spin{ to{ transform:translate(-50%,-50%) rotate(360deg); } }
@keyframes spinBack{ to{ transform:rotate(-360deg); } }

/* sahne */
.sc__stage{ position:absolute; inset:0; z-index:2; }

.slide{
  position:absolute; inset:0;
  visibility:hidden; pointer-events:none;
}
.slide.is-active,.slide.is-leaving{ visibility:visible; }
.slide.is-active{ pointer-events:auto; }

/* — ürün adı (dev tipografi) — */
.slide__name{
  position:absolute; left:50%; top:44%;
  transform:translate(calc(-50% + var(--name-x,0px)), calc(-50% + var(--name-y,0px)));
  width:100%; text-align:center;
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(3.6rem, 16vw, 18rem);
  line-height:.86; letter-spacing:-.035em;
  white-space:nowrap; pointer-events:none; z-index:1;
  will-change:transform;
}
.slide__name .ch{
  display:inline-block;
  background:linear-gradient(178deg,
     color-mix(in srgb, var(--tint) 92%, transparent) 0%,
     var(--accent) 46%,
     color-mix(in srgb, var(--accent) 40%, #000) 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
  opacity:0; transform:translateY(var(--enter-y-ch,.5em)) rotate(2deg);
  transition:opacity .7s var(--ease-out), transform .95s var(--ease-out);
  transition-delay:calc(var(--d) * 34ms);
}
.slide.is-active .slide__name .ch{ opacity:1; transform:none; }
.slide.is-leaving .slide__name .ch{
  opacity:0; transform:translateY(calc(var(--enter-y-ch,.5em) * -.7));
  transition-duration:.45s; transition-delay:calc(var(--d) * 14ms);
}

/* — kutu — */
.slide__tin{
  position:absolute; left:50%; top:50%;
  transform:translate(calc(-50% + var(--tin-x,0px)), calc(-50% + var(--tin-y,0px)));
  height:clamp(280px, 55vh, 600px);
  z-index:3; will-change:transform;
}
.slide__tin img{
  height:100%; width:auto; margin-inline:auto;
  filter:drop-shadow(0 42px 60px rgba(0,0,0,.72)) drop-shadow(0 4px 14px rgba(0,0,0,.5));
  opacity:0; transform:translateY(var(--enter-y)) scale(.94);
  transition:opacity .85s var(--ease-out), transform 1.05s var(--ease-out), filter .8s;
}
.slide.is-active .slide__tin img{ opacity:1; transform:none; animation:float 7s ease-in-out 1.1s infinite; }
.slide.is-leaving .slide__tin img{
  opacity:0; transform:translateY(var(--exit-y)) scale(.97);
  transition-duration:.5s,.6s,.4s; animation:none;
}
@keyframes float{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-13px); } }

.slide__shadow{
  position:absolute; left:50%; bottom:-4%; width:58%; height:26px;
  transform:translateX(-50%);
  background:radial-gradient(ellipse at center, rgba(0,0,0,.66) 0%, transparent 70%);
  filter:blur(9px); opacity:0; transition:opacity .9s var(--ease-out) .2s;
}
.slide.is-active .slide__shadow{ opacity:1; }

/* — sol bilgi bloğu — */
.slide__meta{
  position:absolute; left:var(--pad); bottom:clamp(2rem,7vh,5.2rem);
  width:min(34ch, 27vw); z-index:4;
}
.slide__en{
  margin:.85rem 0 1.05rem; font-size:.7rem; letter-spacing:.26em;
  text-transform:uppercase; color:rgba(239,230,212,.42);
}
.slide__lead{
  font-family:var(--font-serif); font-size:clamp(1rem,1.15vw,1.16rem);
  line-height:1.62; color:rgba(239,230,212,.86);
}
.notes{
  display:flex; flex-wrap:wrap; gap:.45rem .55rem; margin-top:1.35rem;
}
.notes li{
  font-size:.63rem; letter-spacing:.16em; text-transform:uppercase;
  padding:.42em .95em; border-radius:100px;
  border:1px solid color-mix(in srgb, var(--accent) 30%, transparent);
  color:color-mix(in srgb, var(--tint) 80%, #fff);
  background:color-mix(in srgb, var(--accent) 7%, transparent);
}

/* — sağ teknik blok — */
.slide__spec{
  position:absolute; right:var(--pad); bottom:clamp(2rem,7vh,5.2rem);
  text-align:right; z-index:4; width:min(24ch, 22vw);
}
.slide__spec dl{ display:grid; gap:.55rem; margin-bottom:1.5rem; }
.slide__spec dl > div{
  display:flex; justify-content:flex-end; align-items:baseline; gap:.9rem;
  padding-bottom:.55rem; border-bottom:1px solid rgba(239,230,212,.09);
}
.slide__spec dt{ font-size:.62rem; letter-spacing:.22em; text-transform:uppercase;
  color:rgba(239,230,212,.38); }
.slide__spec dd{ font-family:var(--font-serif); font-size:1.02rem; color:var(--tint); }

.chips{ display:flex; gap:.4rem; justify-content:flex-end; margin-bottom:1.5rem; }
.chips span, .chips button{
  font-size:.64rem; letter-spacing:.14em; padding:.5em .9em; border-radius:6px;
  border:1px solid rgba(239,230,212,.14); color:rgba(239,230,212,.55);
  transition:all .35s var(--ease);
}
.chips button:hover{ border-color:rgba(217,180,94,.42); color:var(--tint); }
.chips span.is-on, .chips button.is-on{
  border-color:color-mix(in srgb, var(--accent) 55%, transparent);
  color:var(--tint); background:color-mix(in srgb, var(--accent) 12%, transparent);
}

/* meta + spec giriş animasyonu */
.slide__meta > *, .slide__spec > *{
  opacity:0; transform:translateY(22px);
  transition:opacity .8s var(--ease-out), transform .9s var(--ease-out);
}
.slide.is-active .slide__meta > *, .slide.is-active .slide__spec > *{ opacity:1; transform:none; }
.slide__meta > *:nth-child(1){ transition-delay:.24s } .slide__spec > *:nth-child(1){ transition-delay:.28s }
.slide__meta > *:nth-child(2){ transition-delay:.30s } .slide__spec > *:nth-child(2){ transition-delay:.34s }
.slide__meta > *:nth-child(3){ transition-delay:.36s } .slide__spec > *:nth-child(3){ transition-delay:.40s }
.slide__meta > *:nth-child(4){ transition-delay:.42s }
.slide.is-leaving .slide__meta > *, .slide.is-leaving .slide__spec > *{
  opacity:0; transform:translateY(-14px); transition-duration:.35s; transition-delay:0s;
}

/* — sağ dikey indeks — */
.sc__index{
  position:absolute; right:var(--pad); top:34%; transform:translateY(-50%);
  z-index:5; display:flex; flex-direction:column; gap:.35rem; width:142px;
}
.sc__index button{
  display:grid; grid-template-columns:auto 1fr; align-items:center;
  gap:.7rem; padding:.45rem 0 .5rem; text-align:left; position:relative; width:100%;
  opacity:.5; transition:opacity .45s var(--ease);
}
.sc__index button i{
  font-style:normal; font-size:.62rem; letter-spacing:.16em;
  color:rgba(239,230,212,.72); transition:color .45s var(--ease);
}
.sc__index button em{
  font-style:normal; font-family:var(--font-serif); font-size:.98rem;
  color:var(--cream); white-space:nowrap;
  transform:translateX(-4px); opacity:.55;
  transition:transform .5s var(--ease-out), opacity .5s, color .45s;
}
.sc__index button .bar{
  grid-column:1 / -1; height:1px; width:100%; margin-top:.45rem;
  background:rgba(239,230,212,.16); display:block; overflow:hidden;
}
.sc__index button .bar b{ display:block; height:100%; width:0; background:var(--accent);
  transition:width .6s var(--ease-out); }
.sc__index button:hover{ opacity:.85; }
.sc__index button:hover em{ opacity:.9; transform:none; }
.sc__index button.is-on{ opacity:1; }
.sc__index button.is-on i{ color:var(--accent); }
.sc__index button.is-on em{ opacity:1; transform:none;
  color:color-mix(in srgb, var(--tint) 88%, #fff); }
.sc__index button.is-on .bar b{ width:100%; }

/* — imza & ipucu — */
.sc__taphint{
  display:none; margin-left:auto; align-self:center;
  font-size:.56rem; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(239,230,212,.4); white-space:nowrap;
}

.sc__signature{
  position:absolute; left:var(--pad); top:calc(var(--navh) + 1.6rem); z-index:5;
  font-family:var(--font-serif); font-style:italic; font-size:.92rem;
  letter-spacing:.05em; color:color-mix(in srgb, var(--accent) 78%, #fff);
  opacity:.75;
}
.sc__hint{
  position:absolute; left:50%; bottom:1.7rem; transform:translateX(-50%);
  z-index:5; display:flex; flex-direction:column; align-items:center; gap:.6rem;
  transition:opacity .6s var(--ease);
}
.sc__hint.is-gone{ opacity:0; }
.sc__hint-txt{ font-size:.6rem; letter-spacing:.34em; text-transform:uppercase;
  color:rgba(239,230,212,.42); }
.sc__hint-line{ display:block; width:1px; height:46px; background:rgba(239,230,212,.14);
  overflow:hidden; position:relative; }
.sc__hint-line b{ position:absolute; top:-46px; left:0; width:1px; height:46px;
  background:linear-gradient(180deg,transparent,var(--accent));
  animation:hintRun 2.1s var(--ease) infinite; }
@keyframes hintRun{ 0%{ transform:translateY(0) } 100%{ transform:translateY(92px) } }

/* ---------- 9. MARQUEE ---------- */
.marquee{
  border-block:1px solid var(--gold-line);
  background:linear-gradient(180deg,#0A0806,#0E0A06);
  overflow:hidden; padding-block:1.05rem;
}
.marquee__track{
  display:flex; gap:2.6rem; width:max-content;
  animation:slideX 34s linear infinite;
}
.marquee__track span{
  font-family:var(--font-display); font-size:clamp(1rem,1.9vw,1.55rem);
  letter-spacing:.03em; color:rgba(239,230,212,.62); white-space:nowrap;
}
.marquee__track b{ color:var(--gold-2); font-size:.8rem; align-self:center; }
@keyframes slideX{ to{ transform:translateX(-50%); } }

/* ---------- 10. HİKÂYE ---------- */
.story{
  position:relative; padding-block:clamp(5rem,13vh,10rem);
  background:
    radial-gradient(70% 46% at 82% 12%, rgba(217,180,94,.07) 0%, transparent 62%),
    linear-gradient(180deg,#0A0806 0%,#0D0A07 100%);
}
.story__grid{
  display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:clamp(2rem,6vw,7rem); align-items:start;
}
.story__col > * + *{ margin-top:1.5rem; }
.story p{ color:rgba(239,230,212,.66); }
.dropcap{
  float:left; font-family:var(--font-display); font-size:3.6em; line-height:.78;
  padding:.06em .16em 0 0; color:var(--gold-2);
}
.story__sign{ display:flex; align-items:center; gap:1rem; margin-top:2.4rem; }
.story__sign-line{ width:clamp(40px,7vw,90px); height:1px; background:var(--gold-2); opacity:.6; }
.story__sign em{ font-family:var(--font-serif); font-style:italic; color:var(--gold-2);
  font-size:.98rem; letter-spacing:.04em; }

.stats{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:clamp(1rem,3vw,2.5rem); margin-top:clamp(3.5rem,9vh,7rem);
  border-top:1px solid var(--gold-line); padding-top:clamp(2rem,5vh,3.4rem);
}
.stat b{
  display:block; font-family:var(--font-display); font-weight:400;
  font-size:clamp(2.2rem,4.4vw,3.9rem); line-height:1; letter-spacing:-.02em;
  background:linear-gradient(170deg,var(--gold-1),var(--gold-2) 55%,var(--gold-3));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.stat span{ display:block; margin-top:.7rem; font-size:.68rem; letter-spacing:.2em;
  text-transform:uppercase; color:rgba(239,230,212,.4); }

/* ---------- 11. DİBEK USULÜ ---------- */
.usul{
  position:relative; padding-block:clamp(5rem,13vh,10rem);
  background:linear-gradient(180deg,#0D0A07 0%,#080605 100%);
}
.sec-head{ max-width:60ch; }
.sec-head > * + *{ margin-top:1.3rem; }
.sec-head__note{ color:rgba(239,230,212,.55); max-width:46ch; }
.sec-head--split{
  display:flex; justify-content:space-between; align-items:flex-end;
  gap:2rem; max-width:none; flex-wrap:wrap;
}
.sec-head--split > * + *{ margin-top:0; }
.sec-head--split .sec-head__note{ max-width:34ch; }

.steps{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  margin-top:clamp(3rem,7vh,5.5rem);
  background:var(--gold-line); border:1px solid var(--gold-line);
}
.step{
  position:relative; padding:clamp(1.6rem,2.6vw,2.6rem);
  background:#0A0806; min-height:clamp(220px,30vh,320px);
  display:flex; flex-direction:column; overflow:hidden;
  transition:background .6s var(--ease);
}
.step::after{
  content:''; position:absolute; inset:0; opacity:0;
  background:radial-gradient(70% 60% at 50% 100%, rgba(217,180,94,.13), transparent 70%);
  transition:opacity .6s var(--ease);
}
.step:hover{ background:#100C07; }
.step:hover::after{ opacity:1; }
.step__no{
  font-size:.64rem; letter-spacing:.26em; color:var(--gold-2); opacity:.75;
}
.step h3{
  margin-top:auto; font-family:var(--font-display); font-weight:400;
  font-size:clamp(1.5rem,2.3vw,2.1rem); letter-spacing:-.01em; color:var(--cream);
}
.step p{ margin-top:.75rem; font-size:.92rem; line-height:1.62; color:rgba(239,230,212,.5); }
.step__ico{
  position:absolute; right:clamp(1rem,1.6vw,1.7rem); top:clamp(1.3rem,2.2vw,2.2rem);
  width:34px; height:34px; color:var(--gold-2); opacity:.35;
  transition:opacity .5s var(--ease), transform .7s var(--ease-out);
}
.step:hover .step__ico{ opacity:.75; transform:translateY(-3px) rotate(-4deg); }

/* ---------- 12. KOLEKSİYON ---------- */
.collection{
  padding-block:clamp(5rem,13vh,10rem);
  background:linear-gradient(180deg,#080605 0%,#0B0806 100%);
}
.cards{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(1rem,1.8vw,1.6rem); margin-top:clamp(3rem,7vh,5rem);
}
.card{
  position:relative; overflow:hidden; border-radius:2px;
  border:1px solid rgba(239,230,212,.08);
  transition:transform .7s var(--ease-out), border-color .5s var(--ease);
}
.card::before{
  content:''; position:absolute; inset:0; opacity:0;
  transition:opacity .7s var(--ease);
}
.card--dark{ background:linear-gradient(165deg,#161009 0%,#080604 100%); }
.card--dark::before{ background:radial-gradient(75% 55% at 50% 22%, rgba(217,180,94,.2), transparent 70%); }
.card--green{ background:linear-gradient(165deg,#0E4433 0%,#04160F 100%); }
.card--green::before{ background:radial-gradient(75% 55% at 50% 22%, rgba(224,197,121,.22), transparent 70%); }
.card--cream{ background:linear-gradient(165deg,#211D17 0%,#080706 100%); }
.card--cream::before{ background:radial-gradient(75% 55% at 50% 22%, rgba(231,223,204,.16), transparent 70%); }
.card:hover{ transform:translateY(-8px); border-color:var(--gold-line); }
.card:hover::before{ opacity:1; }

.card__img{
  position:relative; z-index:1; aspect-ratio:4/3.4;
  display:grid; place-items:center; padding:clamp(1.6rem,3vw,2.8rem);
}
.card__img img{
  height:100%; width:auto; object-fit:contain;
  filter:drop-shadow(0 26px 34px rgba(0,0,0,.6));
  transition:transform .8s var(--ease-out);
}
.card:hover .card__img img{ transform:translateY(-6px) scale(1.045); }

.card__body{
  position:relative; z-index:1;
  padding:0 clamp(1.4rem,2.4vw,2.1rem) clamp(1.5rem,2.6vw,2.2rem);
  border-top:1px solid rgba(239,230,212,.07); padding-top:1.3rem;
}
.card__body h3{
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(1.35rem,2vw,1.85rem); color:var(--cream); letter-spacing:-.012em;
}
.card__body h3 i{ font-style:normal; font-family:var(--font-sans); font-size:.6rem;
  letter-spacing:.2em; color:var(--gold-2); vertical-align:middle; margin-left:.5rem; }
.card__body p{ margin-top:.35rem; font-size:.85rem; color:rgba(239,230,212,.48); }
.card__sizes{
  display:inline-block; margin-top:1rem; font-size:.62rem; letter-spacing:.2em;
  text-transform:uppercase; color:var(--gold-2); opacity:.8;
}

/* ---------- 13. RİTÜEL ---------- */
.ritual{
  padding-block:clamp(5rem,13vh,10rem);
  background:
    radial-gradient(60% 50% at 12% 30%, rgba(217,180,94,.06), transparent 60%),
    linear-gradient(180deg,#0B0806 0%,#0E0A07 100%);
}
.ritual__grid{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(2.5rem,6vw,7rem); align-items:center;
}
.ritual__grid > div > * + *{ margin-top:1.4rem; }
.ritual__list{ display:grid; gap:1px; background:var(--gold-line);
  border:1px solid var(--gold-line); }
.ritual__list li{
  display:flex; gap:clamp(1rem,2vw,2rem); align-items:flex-start;
  padding:clamp(1.5rem,2.6vw,2.2rem); background:#0A0806;
  transition:background .5s var(--ease);
}
.ritual__list li:hover{ background:#110C07; }
.ritual__list b{
  font-family:var(--font-display); font-weight:400; font-size:1.5rem;
  color:var(--gold-2); opacity:.65; line-height:1;
}
.ritual__list h4{
  font-family:var(--font-display); font-weight:400; font-size:1.4rem;
  color:var(--cream); letter-spacing:-.01em;
}
.ritual__list p{ margin-top:.5rem; font-size:.92rem; color:rgba(239,230,212,.5); line-height:1.62; }

/* ---------- 14. İLETİŞİM ---------- */
.contact{
  padding-block:clamp(5rem,13vh,10rem);
  background:linear-gradient(180deg,#0E0A07 0%,#070504 100%);
}
.contact__grid{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.85fr);
  gap:clamp(2.5rem,6vw,7rem);
}
.contact__intro > * + *{ margin-top:1.4rem; }
.contact__info{ margin-top:2.6rem; display:grid; gap:0; }
.contact__info li{
  display:flex; justify-content:space-between; align-items:baseline; gap:1.5rem;
  padding-block:1.05rem; border-bottom:1px solid rgba(239,230,212,.08);
}
.contact__info span{ font-size:.64rem; letter-spacing:.24em; text-transform:uppercase;
  color:rgba(239,230,212,.36); }
.contact__info a, .contact__info em{
  font-family:var(--font-serif); font-style:normal; font-size:1.08rem; color:var(--cream);
  transition:color .35s var(--ease);
}
.contact__info a:hover{ color:var(--gold-2); }

.socials{ display:flex; gap:1.6rem; margin-top:2.2rem; }
.socials a{
  position:relative; font-size:.68rem; letter-spacing:.22em; text-transform:uppercase;
  color:rgba(239,230,212,.55); padding-bottom:.3rem; transition:color .35s var(--ease);
}
.socials a::after{ content:''; position:absolute; left:0; bottom:0; width:100%; height:1px;
  background:var(--gold-2); transform:scaleX(0); transform-origin:right;
  transition:transform .45s var(--ease-out); }
.socials a:hover{ color:var(--gold-1); }
.socials a:hover::after{ transform:scaleX(1); transform-origin:left; }

/* form */
.form{
  border:1px solid var(--gold-line); padding:clamp(1.6rem,3vw,2.8rem);
  background:linear-gradient(165deg, rgba(217,180,94,.05), rgba(0,0,0,.2));
  align-self:start;
}
.field{ position:relative; margin-bottom:1.5rem; }
.field input, .field textarea, .field select{
  width:100%; background:transparent; border:0; border-bottom:1px solid rgba(239,230,212,.16);
  padding:1.5rem 0 .65rem; color:var(--cream); font-family:var(--font-serif);
  font-size:1.05rem; border-radius:0; outline:none;
  transition:border-color .4s var(--ease);
}
.field textarea{ resize:vertical; min-height:100px; }
.field select{ cursor:pointer; appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23D9B45E' stroke-width='1.2'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right .2rem center; }
.field select option{ background:#0E0A07; color:var(--cream); }
.field label{
  position:absolute; left:0; top:1.5rem; pointer-events:none;
  font-size:.95rem; color:rgba(239,230,212,.42); font-family:var(--font-serif);
  transition:transform .4s var(--ease-out), font-size .4s var(--ease-out), color .4s;
  transform-origin:left top;
}
.field label.is-static,
.field input:focus + label, .field textarea:focus + label,
.field input:not(:placeholder-shown) + label,
.field textarea:not(:placeholder-shown) + label{
  transform:translateY(-1.45rem) scale(.72); color:var(--gold-2);
  letter-spacing:.16em; text-transform:uppercase; font-family:var(--font-sans);
}
.field input:focus, .field textarea:focus, .field select:focus{ border-bottom-color:var(--gold-2); }
.field.has-error input, .field.has-error textarea{ border-bottom-color:#B4533C; }
.form__note{ margin-top:1rem; font-size:.78rem; letter-spacing:.06em; min-height:1.2em;
  color:var(--gold-2); }

/* ---------- 15. FOOTER ---------- */
.foot{
  padding-top:clamp(3rem,8vh,6rem); background:#050403;
  border-top:1px solid var(--gold-line);
}
.foot__grid{
  display:flex; flex-direction:column; align-items:center; gap:1.8rem;
  text-align:center; padding-bottom:clamp(2.5rem,6vh,4.5rem);
}
.foot__logo{ opacity:.95; }
.foot__quote{ font-family:var(--font-serif); font-style:italic; color:var(--gold-2);
  letter-spacing:.05em; }
.foot__contact{
  display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:.85rem;
  font-family:var(--font-serif); font-size:1.02rem; color:rgba(239,230,212,.7);
}
.foot__contact a{ color:var(--cream); transition:color .35s var(--ease); }
.foot__contact a:hover{ color:var(--gold-2); }
.foot__contact em{ font-style:normal; color:rgba(239,230,212,.5); }
.foot__contact span{ color:var(--gold-2); opacity:.5; }
.socials--foot{ margin-top:0; justify-content:center; }
.foot__nav{ display:flex; flex-wrap:wrap; justify-content:center; gap:1.4rem; }
.foot__nav a{ font-size:.66rem; letter-spacing:.24em; text-transform:uppercase;
  color:rgba(239,230,212,.5); transition:color .35s var(--ease); }
.foot__nav a:hover{ color:var(--gold-2); }
.foot__bottom{
  display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  padding-block:1.5rem; border-top:1px solid rgba(239,230,212,.07);
  font-size:.66rem; letter-spacing:.12em; color:rgba(239,230,212,.3);
}

/* ---------- 16. REVEAL ---------- */
[data-reveal]{
  opacity:0; transform:translateY(28px);
  transition:opacity .95s var(--ease-out), transform 1.05s var(--ease-out);
  transition-delay:var(--rd,0ms);
}
[data-reveal].is-in{ opacity:1; transform:none; }

/* ---------- 8b. HAVADA ASILI KAHVE ÇEKİRDEKLERİ ---------- */
.sc__beans{ position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.sc__beans--back{  z-index:2; }
.sc__beans--front{ z-index:4; }

.beans-layer{
  position:absolute; inset:0;
  transform:translate3d(calc(var(--tin-x,0px) * var(--k,1)),
                        calc(var(--tin-y,0px) * var(--k,1)), 0);
}
.beans-layer[data-depth="far"]{  filter:blur(2.6px); }
.beans-layer[data-depth="mid"]{  filter:blur(.9px); }
.beans-layer[data-depth="near"]{ filter:blur(.2px); }

.bean{
  position:absolute; left:var(--x); top:var(--y);
  width:var(--s); color:var(--accent); opacity:var(--o);
  animation:beanFloat var(--dur) ease-in-out var(--del) infinite;
  will-change:transform;
  transition:color 1.1s var(--ease-out), opacity 1.1s var(--ease-out);
}
.bean svg{ display:block; width:100%; height:auto; }

/* Antep fıstıkları — yalnızca Fıstıkhan sahnesinde belirir */
.bean--pistachio{
  opacity:0;
  color:color-mix(in srgb, var(--accent) 62%, #79A85E);
}
.showcase[data-active="2"] .bean--pistachio{ opacity:var(--o); }
@keyframes beanFloat{
  0%,100%{ transform:translate3d(0,0,0) rotate(var(--r)); }
  50%    { transform:translate3d(var(--dx),var(--dy),0) rotate(calc(var(--r) + var(--rr))); }
}

/* ---------- 8c. AKTİF SAYFA ---------- */
.nav__links a[aria-current="page"]{ color:var(--gold-1); }
.nav__links a[aria-current="page"]::after{ transform:scaleX(1); opacity:.55; }
.drawer__nav a[aria-current="page"]{ color:var(--gold-2); }

/* ============================================================
   16b. İÇ SAYFA BAŞLIĞI
   ============================================================ */
.pagehead{
  position:relative; overflow:hidden;
  padding-top:calc(var(--navh) + clamp(3.5rem,10vh,8rem));
  padding-bottom:clamp(3rem,8vh,6.5rem);
  background:
    radial-gradient(78% 62% at 50% 0%, rgba(217,180,94,.13) 0%, transparent 62%),
    linear-gradient(180deg,#100C07 0%,#0A0806 100%);
  border-bottom:1px solid var(--gold-line);
}
.pagehead__orn{
  position:absolute; left:50%; top:-40%; width:min(120vh,1100px); aspect-ratio:1;
  transform:translateX(-50%); color:var(--gold-2); opacity:.13; pointer-events:none;
  animation:spin 90s linear infinite;
}
.pagehead__orn svg{ width:100%; height:100%; }
.pagehead .wrap{ position:relative; z-index:1; }
.pagehead__title{
  margin-top:1.4rem;
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(3rem,9vw,8.5rem); line-height:.92; letter-spacing:-.03em;
  background:linear-gradient(176deg,#FBF3DC 0%,var(--gold-1) 24%,var(--gold-2) 56%,#9A6E27 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.pagehead__lead{
  margin-top:1.6rem; max-width:52ch;
  font-family:var(--font-serif); font-size:clamp(1.1rem,1.5vw,1.42rem);
  line-height:1.6; color:rgba(239,230,212,.72);
}
.pagehead__crumb{
  display:flex; align-items:center; gap:.7rem; margin-top:2.2rem;
  font-size:.64rem; letter-spacing:.24em; text-transform:uppercase;
  color:rgba(239,230,212,.34);
}
.pagehead__crumb a{ color:var(--gold-2); transition:color .35s var(--ease); }
.pagehead__crumb a:hover{ color:var(--gold-1); }

/* ============================================================
   16c. KOLEKSİYON — ÜRÜN BLOKLARI
   ============================================================ */
.collection-list{
  display:grid; gap:clamp(1.2rem,2.6vw,2.2rem);
  padding-block:clamp(3.5rem,9vh,7rem);
}
.product{
  position:relative; overflow:hidden;
  display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
  align-items:center; gap:clamp(1.5rem,4vw,4.5rem);
  padding:clamp(2rem,4vw,4rem);
  border:1px solid var(--gold-line);
  --accent:#D9B45E; --tint:#F6E9C3;
  --shot-h:clamp(265px,38vh,460px);
  transition:border-color .6s var(--ease), transform .8s var(--ease-out);
}
.product:hover{ border-color:color-mix(in srgb,var(--accent) 42%, transparent); }
.product[data-theme="demgah"]{
  background:radial-gradient(78% 96% at 24% 16%, #1D1509 0%, #0B0805 60%, #070504 100%); }
.product[data-theme="dibekhan"]{ --accent:#E9C878; --tint:#FBEECB;
  background:radial-gradient(78% 96% at 24% 16%, #1A1207 0%, #0A0705 60%, #060403 100%); }
.product[data-theme="fistikhan"]{ --accent:#E3C579; --tint:#F4E6BE;
  background:radial-gradient(78% 96% at 24% 16%, #0F4A37 0%, #062219 58%, #03110C 100%); }
.product[data-theme="espresso"]{ --accent:#E0D7BE; --tint:#F2ECDD;
  background:radial-gradient(78% 96% at 24% 16%, #262019 0%, #0D0A07 60%, #050403 100%); }

.product--flip .product__media{ order:2; }

/* dev kontur numara */
.product__ghost{
  position:absolute; top:-.16em; right:.04em; z-index:0;
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(8rem,20vw,18rem); line-height:.78;
  color:transparent; pointer-events:none; user-select:none;
  -webkit-text-stroke:1px color-mix(in srgb, var(--accent) 26%, transparent);
}
.product--flip .product__ghost{ right:auto; left:.04em; }

.product__media{
  position:relative; z-index:1; display:grid; place-items:center;
  min-height:calc(var(--shot-h) + 3rem);
}
.product__halo{
  position:absolute; left:50%; top:50%; width:min(94%,520px);
  aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle, color-mix(in srgb,var(--accent) 30%, transparent) 0%, transparent 62%);
  filter:blur(26px); animation:breathe 10s ease-in-out infinite;
}
.product__ring{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:min(96%,540px); aspect-ratio:1; border-radius:50%;
  border:1px solid color-mix(in srgb,var(--accent) 22%, transparent);
}
.product__ring::after{
  content:''; position:absolute; inset:9%; border-radius:50%;
  border:1px dashed color-mix(in srgb,var(--accent) 14%, transparent);
}
.product__shot{
  position:relative; height:var(--shot-h); width:auto; margin-inline:auto;
  filter:drop-shadow(0 34px 46px rgba(0,0,0,.72)) drop-shadow(0 4px 12px rgba(0,0,0,.5));
  transition:transform .9s var(--ease-out);
  animation:float 8s ease-in-out infinite;
}
.product:hover .product__shot{ transform:translateY(-12px) scale(1.025); }
.product__floor{
  position:absolute; bottom:6%; left:50%; transform:translateX(-50%);
  width:46%; height:22px;
  background:radial-gradient(ellipse at center, rgba(0,0,0,.7), transparent 70%);
  filter:blur(9px);
}

.product__body{ position:relative; z-index:1; }
.product__name{
  margin-top:1rem; font-family:var(--font-display); font-weight:400;
  font-size:clamp(2.6rem,5.2vw,4.6rem); line-height:.96; letter-spacing:-.028em;
  background:linear-gradient(174deg,
    color-mix(in srgb,var(--tint) 95%, #fff) 0%, var(--accent) 52%,
    color-mix(in srgb,var(--accent) 42%, #000) 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.product__en{
  margin-top:.7rem; font-size:.68rem; letter-spacing:.26em; text-transform:uppercase;
  color:rgba(239,230,212,.42);
}
.product__lead{
  margin-top:1.4rem; max-width:44ch;
  font-family:var(--font-serif); font-size:clamp(1.02rem,1.25vw,1.2rem);
  line-height:1.64; color:rgba(239,230,212,.82);
}
.product .notes{ margin-top:1.5rem; }
.product__spec{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1px; margin-top:1.9rem;
  background:color-mix(in srgb,var(--accent) 16%, transparent);
  border:1px solid color-mix(in srgb,var(--accent) 16%, transparent);
}
.product__spec > div{ padding:.95rem 1.05rem; background:rgba(6,5,4,.62); }
.product__spec dt{
  font-size:.58rem; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(239,230,212,.4);
}
.product__spec dd{
  margin-top:.35rem; font-family:var(--font-serif); font-size:1.02rem; color:var(--tint);
}
.product__foot{
  display:flex; align-items:center; gap:1.4rem; flex-wrap:wrap; margin-top:1.9rem;
}
.product__foot .chips{ margin:0; justify-content:flex-start; }

/* diğer gramajlar şeridi */
.sizes{
  display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(1rem,2vw,1.6rem);
  padding-bottom:clamp(3.5rem,9vh,7rem);
}
.size-card{
  display:flex; align-items:center; gap:clamp(1rem,2.4vw,2rem);
  padding:clamp(1.2rem,2.4vw,2rem);
  border:1px solid var(--gold-line);
  background:linear-gradient(150deg,#150F08 0%,#080605 100%);
  transition:border-color .5s var(--ease), transform .7s var(--ease-out);
}
.size-card:hover{ border-color:rgba(217,180,94,.4); transform:translateY(-5px); }
.size-card img{ height:clamp(110px,13vh,150px); width:auto;
  filter:drop-shadow(0 18px 24px rgba(0,0,0,.6)); }
.size-card h3{ font-family:var(--font-display); font-weight:400;
  font-size:clamp(1.3rem,2vw,1.8rem); color:var(--cream); }
.size-card p{ margin-top:.3rem; font-size:.86rem; color:rgba(239,230,212,.48); }
/* yalnız kartın kendi etiketi — butonun içindeki yazıya dokunma */
.size-card > div > span{ display:inline-block; margin-top:.8rem; font-size:.6rem;
  letter-spacing:.2em; text-transform:uppercase; color:var(--gold-2); }

/* ============================================================
   16d. ANA SAYFA — KEŞFET ŞERİDİ
   ============================================================ */
.explore{
  padding-block:clamp(4rem,11vh,8rem);
  background:linear-gradient(180deg,#0A0806 0%,#0D0A07 100%);
}
.explore__grid{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:1px; margin-top:clamp(2.5rem,6vh,4rem);
  background:var(--gold-line); border:1px solid var(--gold-line);
}
.explore__cell{
  position:relative; display:block; overflow:hidden;
  padding:clamp(1.6rem,2.6vw,2.4rem); background:#0A0806;
  min-height:clamp(200px,26vh,280px);
  display:flex; flex-direction:column;
  transition:background .6s var(--ease);
}
.explore__cell::after{
  content:''; position:absolute; inset:0; opacity:0;
  background:radial-gradient(70% 60% at 50% 100%, rgba(217,180,94,.16), transparent 70%);
  transition:opacity .6s var(--ease);
}
.explore__cell:hover{ background:#120D07; }
.explore__cell:hover::after{ opacity:1; }
.explore__cell i{
  font-style:normal; font-size:.62rem; letter-spacing:.26em; color:var(--gold-2); opacity:.8;
}
.explore__cell h3{
  margin-top:auto; font-family:var(--font-display); font-weight:400;
  font-size:clamp(1.5rem,2.4vw,2.2rem); color:var(--cream); letter-spacing:-.012em;
}
.explore__cell p{ margin-top:.6rem; font-size:.88rem; line-height:1.6; color:rgba(239,230,212,.48); }
.explore__cell em{
  position:relative; z-index:1; margin-top:1.2rem; font-style:normal;
  font-size:.62rem; letter-spacing:.22em; text-transform:uppercase; color:var(--gold-2);
  display:inline-flex; align-items:center; gap:.5rem;
  transform:translateX(-6px); opacity:0;
  transition:transform .5s var(--ease-out), opacity .5s;
}
.explore__cell:hover em{ transform:none; opacity:1; }

/* alıntı bandı */
.quoteband{
  padding-block:clamp(4rem,11vh,8rem); text-align:center;
  background:
    radial-gradient(60% 70% at 50% 50%, rgba(217,180,94,.09), transparent 65%),
    linear-gradient(180deg,#080605,#0C0906);
  border-block:1px solid var(--gold-line);
}
.quoteband p{
  font-family:var(--font-display); font-style:italic; font-weight:400;
  font-size:clamp(1.6rem,4.2vw,3.4rem); line-height:1.24; letter-spacing:-.02em;
  max-width:22ch; margin-inline:auto; color:var(--cream);
}
.quoteband span{
  display:block; margin-top:1.8rem; font-size:.64rem; letter-spacing:.28em;
  text-transform:uppercase; color:var(--gold-2);
}

/* ============================================================
   16e. SİPARİŞ · FİYAT · KATALOG İKONU
   ============================================================ */
.btn--xl{ padding:1.12em 2.35em; font-size:.76rem; letter-spacing:.24em; }
.btn__ico{ width:1.2em; height:1.2em; flex:none; position:relative; z-index:2; }

/* nav — yuvarlak katalog ikonu */
.nav__cat{
  position:relative; display:grid; place-items:center; flex:none;
  width:clamp(42px,3.4vw,50px); aspect-ratio:1; border-radius:50%;
  border:1px solid rgba(217,180,94,.42); color:var(--gold-1);
  background:linear-gradient(150deg, rgba(217,180,94,.13), rgba(0,0,0,.25));
  overflow:visible; isolation:isolate;
  transition:color .45s var(--ease), border-color .45s var(--ease),
             box-shadow .5s var(--ease), transform .4s var(--ease-out);
}
.nav__cat::before{
  content:''; position:absolute; inset:0; border-radius:50%; z-index:-1;
  background:linear-gradient(170deg,#FCF3DA,#DEBB6C 46%,#BE9438 54%,#F1DDA9);
  opacity:0; transition:opacity .45s var(--ease);
}
.nav__cat svg{ width:46%; height:46%; }
.nav__cat:hover{ color:#241703; border-color:transparent;
  box-shadow:0 14px 28px -12px rgba(217,180,94,.8); }
.nav__cat:hover::before{ opacity:1; }
.nav__cat-tip{
  position:absolute; top:calc(100% + .65rem); right:0; white-space:nowrap;
  font-size:.56rem; letter-spacing:.24em; text-transform:uppercase;
  color:var(--gold-2); opacity:0; transform:translateY(-4px);
  transition:opacity .4s var(--ease), transform .4s var(--ease-out);
  pointer-events:none;
}
.nav__cat:hover .nav__cat-tip{ opacity:1; transform:none; }

/* fiyat */
.price{ display:flex; align-items:baseline; gap:.4rem; }
.price i{
  font-style:normal; font-family:var(--font-serif);
  font-size:clamp(1.1rem,1.7vw,1.5rem); color:var(--accent);
}
.price b{
  font-family:var(--font-display); font-weight:400; letter-spacing:-.02em;
  font-size:clamp(1.9rem,3.2vw,2.8rem); line-height:1;
  background:linear-gradient(172deg,
    color-mix(in srgb,var(--tint) 96%,#fff) 0%, var(--accent) 55%,
    color-mix(in srgb,var(--accent) 45%,#000) 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.price em{
  font-style:normal; font-size:.62rem; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(239,230,212,.42); margin-left:.2rem;
}

/* ürün bloğunda sipariş alanı — öne çıkan panel */
.product__order{
  margin-top:1.9rem; padding:clamp(1.1rem,2vw,1.6rem);
  border:1px solid color-mix(in srgb,var(--accent) 32%, transparent);
  background:linear-gradient(140deg,
    color-mix(in srgb,var(--accent) 11%, transparent), rgba(0,0,0,.3));
  display:grid; gap:1.15rem;
  box-shadow:inset 0 1px 0 color-mix(in srgb,var(--accent) 22%, transparent);
}
.product__order-top{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:1rem 1.4rem; flex-wrap:wrap;
}
.product__order .chips{ margin:0; justify-content:flex-start; }
.product__order .btn{ width:100%; }
.product__order-note{
  font-size:.62rem; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(239,230,212,.36); display:flex; align-items:center; gap:.5rem;
}
.product__order-note svg{ width:.95em; height:.95em; color:var(--accent); }

/* vitrindeki kompakt fiyat */
.slide__price{ margin-bottom:1.1rem; justify-content:flex-end; }
.slide__price b{ font-size:clamp(1.5rem,2.2vw,2rem); }

/* ============================================================
   16f. BLOG
   ============================================================ */
.posts{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(1rem,1.8vw,1.6rem);
  padding-block:clamp(3.5rem,9vh,7rem);
}
.post{
  position:relative; display:flex; flex-direction:column; overflow:hidden;
  border:1px solid var(--gold-line);
  background:linear-gradient(160deg,#150F08 0%,#080605 100%);
  transition:transform .7s var(--ease-out), border-color .5s var(--ease);
}
.post::after{
  content:''; position:absolute; inset:0; opacity:0; pointer-events:none;
  background:radial-gradient(70% 55% at 50% 0%, rgba(217,180,94,.16), transparent 70%);
  transition:opacity .6s var(--ease);
}
.post:hover{ transform:translateY(-7px); border-color:rgba(217,180,94,.4); }
.post:hover::after{ opacity:1; }
.post--wide{ grid-column:span 3; flex-direction:row; align-items:stretch; }
.post__thumb{
  position:relative; z-index:1; display:grid; place-items:center;
  padding:clamp(1.6rem,3vw,2.6rem); aspect-ratio:16/10;
  background:radial-gradient(70% 70% at 50% 40%, rgba(217,180,94,.1), transparent 70%);
}
.post--wide .post__thumb{ aspect-ratio:auto; flex:0 0 42%; }
.post__thumb img{
  height:100%; max-height:clamp(170px,24vh,300px); width:auto; object-fit:contain;
  filter:drop-shadow(0 24px 32px rgba(0,0,0,.65));
  transition:transform .8s var(--ease-out);
}
.post:hover .post__thumb img{ transform:translateY(-6px) scale(1.04); }
.post__body{
  position:relative; z-index:1; display:flex; flex-direction:column; flex:1;
  padding:clamp(1.4rem,2.4vw,2.2rem);
  border-top:1px solid rgba(239,230,212,.07);
}
.post--wide .post__body{ border-top:0; border-left:1px solid rgba(239,230,212,.07);
  justify-content:center; }
.post__meta{
  display:flex; align-items:center; gap:.8rem; margin-bottom:1rem;
  font-size:.58rem; letter-spacing:.22em; text-transform:uppercase;
  color:rgba(239,230,212,.38);
}
.post__meta b{ color:var(--gold-2); font-weight:400; }
.post h3{
  font-family:var(--font-display); font-weight:400; letter-spacing:-.016em;
  font-size:clamp(1.35rem,2.1vw,2rem); line-height:1.14; color:var(--cream);
}
.post--wide h3{ font-size:clamp(1.8rem,3.4vw,3rem); }
.post p{ margin-top:.85rem; font-size:.92rem; line-height:1.62; color:rgba(239,230,212,.5); }
.post__more{
  margin-top:auto; padding-top:1.4rem; font-size:.62rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--gold-2);
  display:inline-flex; align-items:center; gap:.5rem;
}
.post__more span{ transition:transform .45s var(--ease-out); }
.post:hover .post__more span{ transform:translateX(5px); }

/* makale */
.article{
  padding-block:clamp(3.5rem,9vh,7rem);
  background:linear-gradient(180deg,#0A0806 0%,#0D0A07 100%);
}
.article__grid{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2.1fr);
  gap:clamp(2rem,5vw,5rem); align-items:start;
}
.article__aside{ position:sticky; top:calc(var(--navh) + 2rem); }
.article__aside img{
  width:100%; max-width:300px; height:auto; margin-inline:auto;
  filter:drop-shadow(0 30px 40px rgba(0,0,0,.7));
}
.article__facts{ margin-top:2rem; border-top:1px solid var(--gold-line); }
.article__facts div{
  display:flex; justify-content:space-between; gap:1rem;
  padding-block:.85rem; border-bottom:1px solid rgba(239,230,212,.07);
}
.article__facts dt{ font-size:.6rem; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(239,230,212,.36); }
.article__facts dd{ font-family:var(--font-serif); font-size:1rem; color:var(--tint); }
.article__body > * + *{ margin-top:1.5rem; }
.article__body p{ font-size:clamp(1.02rem,1.2vw,1.14rem); line-height:1.78;
  color:rgba(239,230,212,.72); }
.article__body h2{
  margin-top:2.8rem; font-family:var(--font-display); font-weight:400;
  font-size:clamp(1.7rem,3vw,2.5rem); line-height:1.1; letter-spacing:-.018em;
  color:var(--cream);
}
.article__body h3{
  margin-top:2rem; font-family:var(--font-display); font-weight:400;
  font-size:clamp(1.25rem,2vw,1.6rem); color:var(--gold-1);
}
.article__body ul{ display:grid; gap:.7rem; }
.article__body li{
  position:relative; padding-left:1.5rem; font-size:1rem; line-height:1.7;
  color:rgba(239,230,212,.68);
}
.article__body li::before{
  content:'✦'; position:absolute; left:0; top:.05em;
  color:var(--gold-2); font-size:.7em;
}
.article__body blockquote{
  margin-block:2.4rem; padding:1.6rem 0 1.6rem 1.8rem;
  border-left:1px solid var(--gold-2);
  font-family:var(--font-serif); font-style:italic;
  font-size:clamp(1.2rem,1.9vw,1.55rem); line-height:1.5; color:var(--gold-1);
}
.article__end{
  display:flex; align-items:center; gap:1rem; margin-top:3rem;
  padding-top:1.8rem; border-top:1px solid var(--gold-line);
  flex-wrap:wrap; justify-content:space-between;
}
.article__back{ font-size:.64rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--gold-2); }

/* ============================================================
   16g. FRANCHISE & BAYİLİK
   ============================================================ */
.fmodels{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  margin-top:clamp(2.5rem,6vh,4rem);
  background:var(--gold-line); border:1px solid var(--gold-line);
}
.fmodel{
  position:relative; padding:clamp(1.7rem,2.8vw,2.6rem); background:#0A0806;
  display:flex; flex-direction:column; overflow:hidden;
  transition:background .6s var(--ease);
}
.fmodel::after{
  content:''; position:absolute; inset:0; opacity:0;
  background:radial-gradient(70% 60% at 50% 0%, rgba(217,180,94,.14), transparent 70%);
  transition:opacity .6s var(--ease);
}
.fmodel:hover{ background:#110C07; }
.fmodel:hover::after{ opacity:1; }
.fmodel__tag{
  align-self:flex-start; font-size:.58rem; letter-spacing:.22em; text-transform:uppercase;
  padding:.45em 1em; border-radius:100px; color:var(--gold-1);
  border:1px solid rgba(217,180,94,.35); background:rgba(217,180,94,.08);
}
.fmodel h3{
  margin-top:1.6rem; font-family:var(--font-display); font-weight:400;
  font-size:clamp(1.5rem,2.4vw,2.1rem); color:var(--cream); letter-spacing:-.014em;
}
.fmodel p{ margin-top:.8rem; font-size:.92rem; line-height:1.64; color:rgba(239,230,212,.5); }
.fmodel ul{ margin-top:1.5rem; display:grid; gap:.6rem; }
.fmodel li{
  position:relative; padding-left:1.35rem; font-size:.86rem; line-height:1.6;
  color:rgba(239,230,212,.62);
}
.fmodel li::before{ content:'✦'; position:absolute; left:0; top:.1em;
  color:var(--gold-2); font-size:.66em; }

.fsteps{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:clamp(1rem,2vw,2rem); margin-top:clamp(2.5rem,6vh,4rem);
  counter-reset:fs;
}
.fstep{ position:relative; padding-top:2.2rem; border-top:1px solid var(--gold-line); }
.fstep::before{
  counter-increment:fs; content:counter(fs,decimal-leading-zero);
  position:absolute; top:1rem; left:0;
  font-size:.62rem; letter-spacing:.22em; color:var(--gold-2);
}
.fstep h4{
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(1.2rem,1.9vw,1.55rem); color:var(--cream);
}
.fstep p{ margin-top:.6rem; font-size:.88rem; line-height:1.62; color:rgba(239,230,212,.48); }

/* B2B / HoReCa */
.horeca{
  position:relative; overflow:hidden;
  padding-block:clamp(4rem,11vh,8rem);
  background:
    radial-gradient(66% 60% at 78% 20%, rgba(217,180,94,.1), transparent 62%),
    linear-gradient(180deg,#0C0906 0%,#080605 100%);
  border-block:1px solid var(--gold-line);
}
.horeca__grid{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.9fr);
  gap:clamp(2.5rem,6vw,6rem); align-items:start;
}
.horeca__list{ margin-top:2.4rem; display:grid; gap:1px;
  background:var(--gold-line); border:1px solid var(--gold-line); }
.horeca__list li{
  display:flex; gap:1.2rem; align-items:flex-start;
  padding:1.2rem 1.4rem; background:#0A0806;
}
.horeca__list b{ font-family:var(--font-display); font-weight:400;
  font-size:1.15rem; color:var(--gold-2); line-height:1.3; }
.horeca__list p{ font-size:.9rem; line-height:1.6; color:rgba(239,230,212,.52); }
.horeca__list strong{ display:block; font-weight:400; color:var(--cream); font-size:1rem; }

/* ============================================================
   16h. KATALOG SAYFASI
   ============================================================ */
.catalog{ padding-block:clamp(3rem,8vh,6rem); }
.catalog__bar{
  display:flex; justify-content:space-between; align-items:center; gap:1.5rem;
  flex-wrap:wrap; padding-bottom:2rem; border-bottom:1px solid var(--gold-line);
}
.catalog__bar p{ font-size:.66rem; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(239,230,212,.4); }
.catsheet{
  display:grid; grid-template-columns:repeat(2,1fr);
  gap:clamp(1rem,2vw,1.6rem); margin-top:clamp(2rem,5vh,3.5rem);
}
.catitem{
  display:grid; grid-template-columns:auto minmax(0,1fr); gap:clamp(1.2rem,2.4vw,2rem);
  align-items:center; padding:clamp(1.3rem,2.4vw,2rem);
  border:1px solid var(--gold-line); --accent:#D9B45E; --tint:#F6E9C3;
  background:linear-gradient(150deg,#140E08 0%,#080605 100%);
}
.catitem[data-theme="fistikhan"]{ --accent:#E3C579; --tint:#F4E6BE;
  background:linear-gradient(150deg,#0D4232 0%,#04150F 100%); }
.catitem[data-theme="espresso"]{ --accent:#E0D7BE; --tint:#F2ECDD;
  background:linear-gradient(150deg,#221D16 0%,#070605 100%); }
.catitem img{ height:clamp(120px,16vh,190px); width:auto;
  filter:drop-shadow(0 20px 26px rgba(0,0,0,.62)); }
.catitem h3{ font-family:var(--font-display); font-weight:400;
  font-size:clamp(1.3rem,2.2vw,1.9rem); color:var(--cream); }
.catitem__sub{ margin-top:.3rem; font-size:.62rem; letter-spacing:.2em;
  text-transform:uppercase; color:rgba(239,230,212,.42); }
.catitem .notes{ margin-top:.9rem; }
.catitem__rows{ margin-top:1.1rem; display:grid; gap:.4rem; }
.catitem__rows div{
  display:flex; justify-content:space-between; gap:1rem; align-items:baseline;
  padding-bottom:.4rem; border-bottom:1px solid rgba(239,230,212,.08);
  font-size:.84rem;
}
.catitem__rows span{ color:rgba(239,230,212,.5); letter-spacing:.06em; }
.catitem__rows b{ font-family:var(--font-serif); font-size:1.05rem;
  font-weight:400; color:var(--tint); }

@media print{
  .catalog__bar .btn, .nav, .drawer, .foot__nav, .quoteband{ display:none !important; }
  body{ background:#fff !important; color:#111 !important; }
  .catitem{ break-inside:avoid; border-color:#bbb; background:#fff !important; }
  .catitem h3, .catitem__rows b{ color:#111 !important;
    -webkit-text-fill-color:#111 !important; }
}

/* ============================================================
   16i. ÜÇLÜ SET
   ============================================================ */
.setband{
  padding-block:clamp(3.5rem,9vh,7rem) clamp(1rem,2vh,2rem);
  background:
    radial-gradient(64% 58% at 50% 0%, rgba(217,180,94,.1), transparent 62%),
    linear-gradient(180deg,#0A0806 0%,#0C0906 100%);
}
.setbox{
  position:relative; isolation:isolate;
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  gap:clamp(1.6rem,4vw,4.5rem); align-items:center;
  padding:clamp(1.8rem,3.6vw,3.6rem);
  --accent:#E5C071; --tint:#F8EBC4;
  background:linear-gradient(150deg,#1B1409 0%,#0A0705 55%,#100B06 100%);
}
/* altın çerçeve */
.setbox::before{
  content:''; position:absolute; inset:0; z-index:-1; padding:1px; border-radius:2px;
  background:linear-gradient(140deg,#F6E9C3,#A87A2C 28%,#F3E2B2 52%,#8F6B2A 78%,#E3C77E);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}
.setbox__ribbon{
  position:absolute; top:0; left:clamp(1.5rem,3vw,3rem); z-index:4;
  transform:translateY(-50%);
  font-size:.6rem; letter-spacing:.28em; text-transform:uppercase; color:#241703;
  padding:.6em 1.4em;
  background:linear-gradient(177deg,#FCF3DA,#DEBB6C 45%,#BE9438 52%,#F1DDA9);
  box-shadow:0 10px 24px -10px rgba(217,180,94,.75);
}

.setbox__media{
  position:relative; display:grid; place-items:center;
  min-height:clamp(280px,38vh,440px);
}
.setbox__halo{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:min(96%,560px); aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle, rgba(229,192,113,.3) 0%, transparent 62%);
  filter:blur(28px); animation:breathe 10s ease-in-out infinite;
}
.setbox__ring{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:min(90%,500px); aspect-ratio:1; border-radius:50%;
  border:1px solid rgba(229,192,113,.2);
}
.setbox__tin{
  position:absolute; height:clamp(190px,27vh,330px); width:auto;
  filter:drop-shadow(0 30px 40px rgba(0,0,0,.75));
  transition:transform .9s var(--ease-out);
}
.setbox__tin--a{ transform:translateX(-46%) rotate(-8deg) scale(.86); z-index:1; }
.setbox__tin--b{ transform:translateY(-4%) scale(1.02); z-index:3; }
.setbox__tin--c{ transform:translateX(46%) rotate(8deg) scale(.86); z-index:2; }
.setbox:hover .setbox__tin--a{ transform:translateX(-58%) rotate(-11deg) scale(.88); }
.setbox:hover .setbox__tin--b{ transform:translateY(-8%) scale(1.05); }
.setbox:hover .setbox__tin--c{ transform:translateX(58%) rotate(11deg) scale(.88); }
.setbox__floor{
  position:absolute; bottom:8%; left:50%; transform:translateX(-50%);
  width:64%; height:24px;
  background:radial-gradient(ellipse at center, rgba(0,0,0,.72), transparent 70%);
  filter:blur(11px);
}

.setbox__body{ position:relative; z-index:2; }
.setbox__name{
  font-family:var(--font-display); font-weight:400; letter-spacing:-.026em;
  font-size:clamp(2.4rem,4.6vw,4rem); line-height:.98;
  background:linear-gradient(174deg,#FDF6E0 0%,#E5C071 52%,#8F6B2A 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.setbox__lead{
  margin-top:1.2rem; max-width:44ch;
  font-family:var(--font-serif); font-size:clamp(1.02rem,1.25vw,1.2rem);
  line-height:1.64; color:rgba(239,230,212,.8);
}
.setbox__list{
  margin-top:1.8rem; display:grid; gap:1px;
  background:rgba(229,192,113,.2); border:1px solid rgba(229,192,113,.2);
}
.setbox__list li{
  display:flex; align-items:baseline; gap:.9rem; flex-wrap:wrap;
  padding:.85rem 1.1rem; background:rgba(6,5,4,.6);
}
.setbox__list b{
  font-family:var(--font-display); font-weight:400; font-size:1.22rem;
  color:var(--tint); letter-spacing:-.01em;
}
.setbox__list span{
  font-size:.6rem; letter-spacing:.2em; text-transform:uppercase;
  color:#241703; background:rgba(229,192,113,.85); padding:.25em .7em; border-radius:3px;
}
.setbox__list em{
  font-style:normal; font-size:.86rem; color:rgba(239,230,212,.46); margin-left:auto;
}

.setbox__order{
  margin-top:1.9rem; padding:clamp(1.1rem,2vw,1.5rem);
  border:1px solid rgba(229,192,113,.36);
  background:linear-gradient(140deg, rgba(229,192,113,.13), rgba(0,0,0,.3));
  box-shadow:inset 0 1px 0 rgba(229,192,113,.26);
  display:grid; gap:1.1rem;
}
.setbox__order .btn{ width:100%; }
.price--set{ flex-wrap:wrap; }
.price--set s{
  font-family:var(--font-serif); font-size:1.05rem;
  color:rgba(239,230,212,.34); margin-left:.7rem;
  text-decoration-color:rgba(229,192,113,.7);
}

/* katalogdaki set satırı: üç kutu yan yana */
.catitem__trio{ display:flex; align-items:flex-end; justify-content:center; }
.catitem__trio img{
  height:clamp(92px,12vh,140px); width:auto; flex:none;
  filter:drop-shadow(0 14px 20px rgba(0,0,0,.6));
}
.catitem__trio img:nth-child(1){ transform:rotate(-7deg); z-index:1; }
.catitem__trio img:nth-child(2){ margin-inline:-12px; z-index:3; }
.catitem__trio img:nth-child(3){ transform:rotate(7deg); z-index:2; }

.catitem--set{ --accent:#E5C071; --tint:#F8EBC4;
  background:linear-gradient(150deg,#1D1509 0%,#090705 100%);
  border-color:rgba(229,192,113,.38); }

/* ---------- 16j. BASILI KATALOG ŞERİDİ ---------- */
.catbook{ margin-top:clamp(2rem,5vh,3.4rem); }
.catbook__head{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:1.5rem; flex-wrap:wrap; margin-bottom:1.4rem;
}
.catbook__note{ font-size:.82rem; color:rgba(239,230,212,.42); letter-spacing:.04em; }
.catbook__strip{
  display:flex; gap:clamp(.7rem,1.4vw,1.2rem);
  overflow-x:auto; overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory; scroll-padding-left:0;
  padding-bottom:1rem; margin-inline:calc(var(--pad) * -1);
  padding-inline:var(--pad);
  scrollbar-width:thin; scrollbar-color:rgba(217,180,94,.4) transparent;
}
.catbook__strip::-webkit-scrollbar{ height:4px; }
.catbook__strip::-webkit-scrollbar-thumb{ background:rgba(217,180,94,.4); }
.catpage{
  position:relative; flex:0 0 auto; scroll-snap-align:start;
  width:clamp(190px,26vw,300px); margin:0;
  border:1px solid var(--gold-line); background:#0A0806;
  transition:transform .6s var(--ease-out), border-color .5s var(--ease);
}
.catpage:hover{ transform:translateY(-6px); border-color:rgba(217,180,94,.42); }
.catpage img{ width:100%; height:auto; display:block; }
.catpage figcaption{
  position:absolute; left:.6rem; bottom:.6rem;
  font-size:.55rem; letter-spacing:.2em; color:#241703;
  background:rgba(229,192,113,.9); padding:.2em .55em; border-radius:2px;
}

/* ============================================================
   16k. ARAMA
   ============================================================ */
.nav__search{
  position:relative; display:grid; place-items:center; flex:none;
  width:clamp(42px,3.4vw,50px); aspect-ratio:1; border-radius:50%;
  border:1px solid rgba(217,180,94,.42); color:var(--gold-1);
  background:linear-gradient(150deg, rgba(217,180,94,.13), rgba(0,0,0,.25));
  overflow:visible; isolation:isolate; cursor:pointer;
  transition:color .45s var(--ease), border-color .45s var(--ease),
             box-shadow .5s var(--ease);
}
.nav__search::before{
  content:''; position:absolute; inset:0; border-radius:50%; z-index:-1;
  background:linear-gradient(170deg,#FCF3DA,#DEBB6C 46%,#BE9438 54%,#F1DDA9);
  opacity:0; transition:opacity .45s var(--ease);
}
.nav__search svg{ width:48%; height:48%; }
.nav__search:hover{ color:#241703; border-color:transparent;
  box-shadow:0 14px 28px -12px rgba(217,180,94,.8); }
.nav__search:hover::before{ opacity:1; }
.nav__search:hover .nav__cat-tip{ opacity:1; transform:none; }

.search{
  position:fixed; inset:0; z-index:960;
  display:flex; flex-direction:column;
  padding:calc(var(--navh) + 1rem) var(--pad) var(--pad);
  overflow-y:auto; overscroll-behavior:contain;
  background:
    radial-gradient(96% 60% at 80% 6%, rgba(217,180,94,.13), transparent 58%),
    linear-gradient(180deg,#120C06 0%,#0A0705 48%,#060403 100%);
  opacity:0; visibility:hidden; transform:translateY(-1.5%);
  transition:opacity .45s var(--ease), visibility .45s, transform .55s var(--ease-out);
}
.search.is-open{ opacity:1; visibility:visible; transform:none; }
.search__inner{ width:min(860px,100%); margin-inline:auto; }

.search__field{
  display:flex; align-items:center; gap:.9rem; margin-top:1.4rem;
  padding-bottom:.9rem; border-bottom:1px solid rgba(217,180,94,.32);
}
.search__field svg{ width:clamp(20px,2.4vw,26px); height:auto; color:var(--gold-2); flex:none; }
.search__field input{
  flex:1; min-width:0; background:none; border:0; outline:none; color:var(--cream);
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(1.4rem,4.4vw,2.4rem); line-height:1.2; letter-spacing:-.015em;
  -webkit-appearance:none; appearance:none;
}
.search__field input::placeholder{ color:rgba(239,230,212,.3); }
.search__field input::-webkit-search-cancel-button{ display:none; }
.search__clear{
  flex:none; width:32px; height:32px; border-radius:50%; cursor:pointer;
  border:1px solid rgba(239,230,212,.18); color:rgba(239,230,212,.6);
  font-size:.8rem; line-height:1; transition:all .3s var(--ease);
}
.search__clear:hover{ color:var(--gold-1); border-color:rgba(217,180,94,.5); }
.search__hint{
  margin-top:.9rem; font-size:.6rem; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(239,230,212,.32);
}
.search__hint b{ color:var(--gold-2); font-weight:400; }

.search__results{ margin-top:clamp(1.4rem,4vh,2.4rem); display:flex; flex-direction:column; }
.search__item{
  display:grid; grid-template-columns:auto 1fr auto; align-items:center;
  gap:.3rem 1rem; padding:.9rem .2rem;
  border-bottom:1px solid rgba(217,180,94,.12);
  transition:background .3s var(--ease);
}
.search__item:hover, .search__item.is-sel{ background:rgba(217,180,94,.07); }
.search__item i{
  font-style:normal; font-size:.55rem; letter-spacing:.2em; text-transform:uppercase;
  color:#241703; background:rgba(229,192,113,.85); padding:.3em .6em; border-radius:3px;
  white-space:nowrap;
}
.search__item b{
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(1.05rem,2.4vw,1.5rem); color:var(--cream); letter-spacing:-.01em;
}
.search__item em{
  grid-column:2 / -1; font-style:normal; font-size:.84rem;
  color:rgba(239,230,212,.45); line-height:1.45;
}
.search__item span{ font-size:1rem; color:var(--gold-2); justify-self:end; }
.search__item.is-sel b{ color:var(--gold-1); }
.search__bos{
  padding:2rem .2rem; font-family:var(--font-serif); font-style:italic;
  font-size:1.05rem; color:rgba(239,230,212,.42);
}

/* çapaya giderken sabit başlığın altında kalmasın */
[id^="urun-"]{ scroll-margin-top:calc(var(--navh) + 1.5rem); }

/* ============================================================
   17. RESPONSIVE
   ============================================================ */
@media (max-width:1280px){
  .slide__meta{ width:min(32ch,34vw); }
  .slide__spec{ width:min(22ch,26vw); }
  .sc__index button em{ display:none; }
  .sc__index{ gap:.5rem; width:58px; }
  .sc__index button{ grid-template-columns:auto; }
}

@media (max-width:1024px){
  .nav__links{ display:none; }
  .burger{ display:block; }
  .story__grid, .ritual__grid, .contact__grid{ grid-template-columns:1fr; }
  .steps{ grid-template-columns:repeat(2,1fr); }
  .cards{ grid-template-columns:repeat(2,1fr); }
  .stats{ grid-template-columns:repeat(2,1fr); row-gap:2.4rem; }
}

@media (max-width:820px){
  /* ── MOBİL VİTRİN: akışta dikey dizilim — üst üste binme imkânsız ── */
  .showcase{ height:auto; min-height:100svh; }
  .sc__stage{ position:relative; inset:auto; }
  .slide{
    position:absolute; inset:0;               /* pasif slaytlar üstte gizli durur */
    display:flex; flex-direction:column; align-items:center;
    padding:calc(var(--navh) + 6.2rem) var(--pad) clamp(1.6rem,4vh,2.6rem);
    gap:0;
  }
  .slide.is-active{ position:relative; }      /* aktif slayt yüksekliği belirler */

  .slide__name{
    position:static; transform:none !important; width:100%;
    font-size:clamp(2.6rem,15vw,5.2rem); line-height:.9;
    margin-bottom:clamp(1.9rem,5.5vh,3rem);
  }
  .slide__tin{
    position:static; transform:none !important;
    height:clamp(200px,34vh,330px); margin:0 auto clamp(2rem,5.5vh,3rem);
  }
  .slide__meta{
    position:static; width:100%; text-align:left;
    margin-bottom:clamp(1.2rem,3vh,1.8rem);
  }
  .slide__lead{ font-size:.95rem; }
  .notes{ margin-top:1rem; }
  .slide__spec{
    position:static; width:100%; text-align:left; z-index:auto;
  }
  .slide__spec dl{ display:none; }
  .slide__price{ justify-content:flex-start; margin-bottom:.8rem; }
  .slide__spec .chips{ justify-content:flex-start; margin-bottom:.9rem; }
  .slide__spec .btn{ width:100%; }

  .sc__index{
    left:var(--pad); right:var(--pad); bottom:auto; width:auto;
    transform:none; flex-direction:row; align-items:center; gap:.9rem;
    top:calc(var(--navh) + 2.6rem);
  }
  .sc__taphint{ display:block; }
  .sc__index button{ padding:0; width:auto; flex:0 0 auto; }
  .sc__index button .bar{ display:none; }
  .sc__index button i{ font-size:.68rem; padding:.3rem .1rem; }
  .sc__index button.is-on i{ text-decoration:underline; text-underline-offset:5px; }
  .sc__signature{ font-size:.8rem; top:calc(var(--navh) + .9rem); }
  .sc__hint{ display:none; }
  .sc__ornament{ width:170vw; opacity:.14; top:38%; }
  .sc__glow{ top:38%; }

  /* diğer bölümlerde nefes payı */
  .product__ghost{ display:none; }            /* arkadaki dev numara küçük ekranda kalabalık */
  .pagehead__title{ line-height:1; }
}
@media (max-width:640px){
  .steps, .cards{ grid-template-columns:1fr; }
  .stats{ grid-template-columns:1fr 1fr; }
  .foot__bottom{ justify-content:center; text-align:center; }
  .contact__info li{ flex-direction:column; gap:.2rem; align-items:flex-start; }
}

/* ---------- 18. ERİŞİLEBİLİRLİK ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.15s !important; scroll-behavior:auto !important;
  }
  .grain{ display:none; }
}

:focus-visible{ outline:1px solid var(--gold-2); outline-offset:4px; }

@media print{ .nav,.drawer,.cursor,.grain,.vignette,.sc__hint{ display:none !important; } }

/* ---------- 19. YENİ BÖLÜMLER — RESPONSIVE ---------- */
@media (max-width:1100px){
  .product{ grid-template-columns:1fr; gap:clamp(1.5rem,4vw,2.6rem); }
  .product--flip .product__media{ order:0; }
  .product__ghost{ font-size:clamp(7rem,26vw,12rem); }
  .explore__grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:820px){
  .sc__beans--front{ display:none; }
  .beans-layer[data-depth="far"]{ filter:blur(2px); }
  .sizes{ grid-template-columns:1fr; }
  .pagehead__orn{ width:190vw; }
}
@media (max-width:640px){
  .explore__grid{ grid-template-columns:1fr; }
  .product__spec{ grid-template-columns:1fr; }
  .size-card{ flex-direction:column; align-items:flex-start; text-align:left; }
  .product__foot{ gap:1rem; }
  .product__foot .btn{ width:100%; }
}

/* ---------- 20. SİPARİŞ / BLOG / BAYİLİK — RESPONSIVE ---------- */
@media (max-width:1180px){
  .nav__links{ gap:clamp(.9rem,1.7vw,1.6rem); }
  .nav__links a{ font-size:.68rem; letter-spacing:.14em; }
}
@media (max-width:1100px){
  .nav__links{ display:none; }
  .burger{ display:block; }
  .nav__cta span{ display:none; }
  .nav__cta{ display:inline-flex; padding:.9em 1.05em; }
  .nav__cta .btn__ico{ width:1.35em; height:1.35em; }
  .posts{ grid-template-columns:repeat(2,1fr); }
  .post--wide{ grid-column:span 2; flex-direction:column; }
  .post--wide .post__thumb{ flex:none; aspect-ratio:16/9; }
  .post--wide .post__body{ border-left:0; border-top:1px solid rgba(239,230,212,.07); }
  .article__grid{ grid-template-columns:1fr; }
  .article__aside{ position:static; }
  .article__aside img{ max-width:220px; }
  .fmodels{ grid-template-columns:1fr; }
  .fsteps{ grid-template-columns:repeat(2,1fr); }
  .horeca__grid{ grid-template-columns:1fr; }
  .catsheet{ grid-template-columns:1fr; }
}
@media (max-width:640px){
  .posts{ grid-template-columns:1fr; }
  .post--wide{ grid-column:span 1; }
  .fsteps{ grid-template-columns:1fr; }
  .catitem{ grid-template-columns:1fr; justify-items:center; text-align:center; }
  .catitem .notes{ justify-content:center; }
  .product__order-top{ flex-direction:column; align-items:flex-start; }
}

/* ---------- 21. SET — RESPONSIVE ---------- */
@media (max-width:1100px){
  .setbox{ grid-template-columns:1fr; }
  .setbox__media{ min-height:clamp(240px,32vh,340px); }
}
@media (max-width:640px){
  /* üç kutu da net seçilsin: daha küçük ve daha açık yelpaze */
  .setbox__tin{ height:clamp(118px,17vh,165px); }
  .setbox__tin--a{ transform:translateX(-74%) rotate(-9deg) scale(.9); }
  .setbox__tin--b{ transform:translateY(-3%) scale(1); }
  .setbox__tin--c{ transform:translateX(74%) rotate(9deg) scale(.9); }
  .setbox:hover .setbox__tin--a{ transform:translateX(-74%) rotate(-9deg) scale(.9); }
  .setbox:hover .setbox__tin--b{ transform:translateY(-3%) scale(1); }
  .setbox:hover .setbox__tin--c{ transform:translateX(74%) rotate(9deg) scale(.9); }
  .setbox__list em{ margin-left:0; width:100%; }
  .nav__brand{ transform:translateY(4px); }
}

@media (max-width:640px){
  .catpage{ width:min(72vw,290px); }
}

@media (max-width:640px){
  .search__item{ grid-template-columns:1fr auto; }
  .search__item i{ grid-column:1 / -1; justify-self:start; margin-bottom:.35rem; }
  .search__item em{ grid-column:1 / -1; }
}