@charset "UTF-8";
/* ==========================================================================
   Kavurmacı Celal Usta — Ana Sayfa
   assets/css/style.css
   1.  Yazı tipleri
   2.  Tasarım değişkenleri
   3.  Temel / genel
   4.  Yardımcı bileşenler (buton, başlık, ikon)
   5.  Üst bilgi şeridi
   6.  Header + navigasyon + offcanvas
   7.  Hero
   8.  Güven avantajları
   9.  Öne çıkan ürünler
   10. Marka hikâyesi
   11. Hazırlık süreci
   12. Yorumlar
   13. Galeri
   14. İletişim / harita / saatler
   15. Footer
   16. Mobil sabit CTA çubuğu
   17. Duyarlı (responsive) düzenlemeler
   ========================================================================== */

/* ==========================================================================
   1. Yazı tipleri
   ========================================================================== */
@font-face{font-family:"Kaushan Script";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/kaushan-script-400.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/montserrat-400.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/montserrat-600.woff2") format("woff2")}
@font-face{font-family:"Oswald";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/oswald-500.woff2") format("woff2")}
@font-face{font-family:"Oswald";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/oswald-700.woff2") format("woff2")}

/* ==========================================================================
   2. Tasarım değişkenleri
   ========================================================================== */
:root{
  /* Renk paleti */
  --ink:        #0C0B09;
  --ink-2:      #131210;
  --ink-3:      #050505;
  --ink-soft:   #191714;

  --cream:      #F4E9D6;
  --cream-2:    #EFE2CD;
  --cream-3:    #E9DAC2;

  --gold:       #B58146;
  --gold-2:     #D2A468;
  --gold-3:     #8A5A28;
  --copper-a:   #9C6830;
  --copper-b:   #7C4C1F;

  --green:      #26301B;
  --green-2:    #1B2213;
  --green-3:    #38452A;

  --txt:        #F1E7D7;
  --txt-dim:    #B0A390;
  --txt-ink:    #24190F;
  --txt-ink-dim:#5F5342;

  /* Tipografi */
  --f-display: "Oswald", "Arial Narrow", Impact, sans-serif;
  --f-body:    "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --f-script:  "Kaushan Script", "Brush Script MT", cursive;

  /* Ölçüler */
  --gut:        clamp(1rem, 2.4vw, 2rem);
  --shell:      1360px;
  --hdr-h:      62px;
  --topbar-h:   38px;
  --mobbar-h:   62px;
  --sec-pad:    clamp(3.25rem, 5.6vw, 5.5rem);
  --r:          4px;

  /* Logo: kutu = akıştaki yükseklik, img = görsel yükseklik (fark kadar aşağı taşar) */
  --brand-box:  50px;
  --brand-h:    84px;

  /* Dokular */
  --noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}

@media (min-width: 992px){
  :root{ --hdr-h: 96px; --topbar-h: 42px; --mobbar-h: 0px; --brand-box: 88px; --brand-h: 148px; }
}

/* ==========================================================================
   3. Temel / genel
   ========================================================================== */
*,*::before,*::after{ box-sizing:border-box }

html{
  -webkit-text-size-adjust:100%;
  scroll-padding-top: calc(var(--hdr-h) + 12px);
}
@media (prefers-reduced-motion: no-preference){
  html{ scroll-behavior:smooth }
}

body{
  margin:0;
  overflow-x:clip;
  background:var(--ink);
  color:var(--txt);
  font-family:var(--f-body);
  font-size:clamp(.9rem, .35vw + .82rem, 1rem);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  padding-bottom: calc(var(--mobbar-h) + env(safe-area-inset-bottom, 0px));
}

img,picture,svg,iframe{ max-width:100% }
img{ height:auto; display:block }

a{ color:inherit; text-decoration:none }
a:focus-visible,button:focus-visible,iframe:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--gold-2);
  outline-offset:3px;
  border-radius:2px;
}

h1,h2,h3{ font-family:var(--f-display); font-weight:700; margin:0; line-height:1.08; letter-spacing:.005em }
p{ margin:0 }
ul,ol{ margin:0; padding:0; list-style:none }
address{ font-style:normal }

.container{
  width:100%;
  max-width:var(--shell);
  margin-inline:auto;
  padding-inline:var(--gut);
}

.skip-link{
  position:fixed; top:-100px; left:12px; z-index:2000;
  background:var(--gold); color:#1A1206;
  padding:.7rem 1.1rem; border-radius:var(--r);
  font-family:var(--f-display); letter-spacing:.06em; text-transform:uppercase;
  transition:top .2s ease;
}
.skip-link:focus{ top:12px }

.svg-sprite{ position:absolute; width:0; height:0; overflow:hidden }

.ic{ width:1em; height:1em; flex:0 0 auto; fill:currentColor; stroke:none }
svg.ic{ display:inline-block; vertical-align:middle }

/* Ortak bölüm iskeleti */
.section{ padding-block:var(--sec-pad); position:relative }
.section--dark{
  background:
    radial-gradient(120% 120% at 50% -10%, #1A1714 0%, rgba(12,11,9,0) 60%),
    var(--ink);
}
.section--dark::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:var(--noise); background-size:160px 160px;
  opacity:.045; mix-blend-mode:overlay;
}
.section--cream{ background:var(--cream); color:var(--txt-ink); position:relative }
.section--cream::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:var(--noise); background-size:160px 160px;
  opacity:.05; mix-blend-mode:multiply;
}
.section > .container{ position:relative; z-index:1 }

.section__head{ text-align:center; margin-bottom:clamp(1.75rem, 3vw, 2.75rem) }
.section__title{
  font-size:clamp(1.65rem, .9rem + 2.4vw, 2.6rem);
  text-transform:uppercase;
  color:var(--cream);
  letter-spacing:.012em;
}
.section__title--dark{ color:#1E1409 }
.section__sub{
  margin-top:.65rem; color:var(--txt-ink-dim);
  font-size:clamp(.85rem,.3vw + .78rem,.95rem);
}
.section--dark .section__sub{ color:var(--txt-dim) }
.section__foot{ margin-top:clamp(1.5rem,2.6vw,2.25rem); text-align:center }

/* Eyebrow (küçük üst başlık) */
.eyebrow{
  font-family:var(--f-display); font-weight:500;
  font-size:clamp(.7rem,.22vw + .66rem,.82rem);
  letter-spacing:.22em; text-transform:uppercase;
  color:var(--gold-2);
  display:inline-flex; align-items:center; gap:.7em;
  margin-bottom:.55rem;
}
.eyebrow__star{ width:.72em; height:.72em; fill:var(--gold); flex:0 0 auto }
.eyebrow--hero{ margin-bottom:.85rem }
.eyebrow--line{
  color:var(--gold-3); display:flex; margin-bottom:.7rem;
}
.eyebrow--line::after{
  content:""; height:2px; width:44px; background:var(--gold);
  opacity:.65; border-radius:2px;
}

/* ==========================================================================
   4. Butonlar
   ========================================================================== */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.6em;
  min-height:46px; padding:.72rem 1.35rem;
  font-family:var(--f-display); font-weight:500;
  font-size:clamp(.8rem,.2vw + .76rem,.92rem);
  letter-spacing:.1em; text-transform:uppercase; white-space:nowrap;
  border:1px solid transparent; border-radius:var(--r);
  cursor:pointer; transition:background-color .22s ease, border-color .22s ease, transform .22s ease, box-shadow .22s ease;
}
.btn .ic{ font-size:1.15em }
.btn:active{ transform:translateY(1px) }

.btn--gold{
  color:#FCF4E5;
  background:linear-gradient(180deg,var(--copper-a),var(--copper-b));
  border-color:rgba(214,171,113,.5);
  box-shadow:0 1px 0 rgba(255,225,180,.18) inset;
}
.btn--gold:hover{ background:linear-gradient(180deg,#AE7738,#8A5726); border-color:rgba(226,187,133,.75) }

.btn--green{
  color:var(--cream);
  background:var(--green-2);
  border-color:rgba(181,129,70,.6);
}
.btn--green:hover{ background:var(--green); border-color:var(--gold) }

.btn--ghost{
  color:var(--gold-2); background:rgba(0,0,0,.2);
  border-color:rgba(181,129,70,.55);
}
.btn--ghost:hover{ color:#F3E3CB; background:rgba(138,90,40,.25); border-color:var(--gold) }

.btn--lg{ min-height:52px; padding:.9rem 1.7rem; font-size:clamp(.85rem,.25vw + .8rem,1rem) }
.btn--wa{ margin-top:1.5rem; align-self:flex-start }

/* ==========================================================================
   5. Üst bilgi şeridi
   ========================================================================== */
.topbar{
  background:var(--ink-3);
  color:#CBBEA9;
  font-size:.78rem;
  border-bottom:1px solid rgba(181,129,70,.16);
  position:relative; z-index:5;
}
.topbar__inner{
  min-height:var(--topbar-h);
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
}
.topbar__list{ display:flex; align-items:center; gap:0; min-width:0 }
.topbar__item{ display:flex; align-items:center; gap:.5em; white-space:nowrap }
.topbar__item a{ display:inline-flex; align-items:center; gap:.5em }
.topbar__item a:hover{ color:var(--gold-2) }
.topbar__item .ic{ font-size:1.05em; color:var(--gold) }
.topbar__status{
  width:7px; height:7px; border-radius:50%; flex:0 0 auto;
  background:#6B6B6B; margin-right:.1rem;
}
.topbar__status.is-open{ background:#5FA84B; box-shadow:0 0 0 3px rgba(95,168,75,.18) }
.topbar__status.is-closed{ background:#B2513A; box-shadow:0 0 0 3px rgba(178,81,58,.18) }
.topbar__item--sep{ margin-left:1.4rem; padding-left:1.4rem; border-left:1px solid rgba(181,129,70,.22) }
.topbar__hours-short{ display:none }

.topbar__social{ display:flex; align-items:center; gap:.55rem }
.topbar__cta{ display:none; order:-1; margin-right:.55rem; color:#BCAF9A }
.topbar__soc{
  width:26px; height:26px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid rgba(181,129,70,.45); color:var(--gold-2);
  font-size:.8rem; transition:background-color .2s ease, color .2s ease, border-color .2s ease;
}
.topbar__soc:hover{ background:var(--gold-3); color:#FBF1DF; border-color:var(--gold-3) }
.topbar__soc--call{ display:none }

/* ==========================================================================
   6. Header + navigasyon
   ========================================================================== */
.site-header{
  position:sticky; top:0; z-index:1030;
  background:var(--cream);
  border-bottom:1px solid rgba(36,25,15,.1);
  transition:background-color .28s ease, box-shadow .28s ease;
}
.site-header__inner{
  min-height:var(--hdr-h);
  display:flex; align-items:center; gap:1rem;
}

/* Logonun akıştaki yüksekliği --brand-box, görseli --brand-h.
   Aradaki fark kadar header'ın altına taşar; üst şeridi asla kapatmaz. */
.brand{
  flex:0 0 auto; display:block; line-height:0;
  height:var(--brand-box);
  transition:height .28s ease;
}
.brand picture{ display:block; line-height:0 }
.brand__img{
  display:block; width:auto; height:var(--brand-h);
  transition:height .28s ease;
  filter:drop-shadow(0 8px 18px rgba(0,0,0,.5));
}

.burger,.hdr-map-btn{
  width:46px; height:46px; flex:0 0 auto;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:1.35rem; background:transparent; border:0; padding:0;
  color:#241A10; cursor:pointer;
}
.hdr-map-btn{
  border:1px solid var(--gold); border-radius:var(--r);
  background:var(--green-2); color:var(--gold-2);
  font-size:1.2rem; transition:background-color .2s ease;
}
.hdr-map-btn:hover{ background:var(--green) }

.mainnav__list{ display:flex; align-items:center }
.mainnav__link{
  position:relative; display:flex; align-items:center; min-height:44px;
  padding:.6rem clamp(.7rem,1.35vw,1.15rem);
  font-family:var(--f-display); font-weight:500;
  font-size:clamp(.82rem,.25vw + .78rem,.98rem);
  letter-spacing:.1em; text-transform:uppercase;
  color:var(--cream); opacity:.92;
  transition:color .2s ease, opacity .2s ease;
}
.mainnav__list li + li{ border-left:1px solid rgba(214,178,124,.22) }
.mainnav__link::after{
  content:""; position:absolute; left:50%; bottom:.1rem; translate:-50% 0;
  width:0; height:2px; background:var(--gold-2); transition:width .25s ease;
}
.mainnav__link:hover,.mainnav__link.is-active{ color:var(--gold-2); opacity:1 }
.mainnav__link.is-active::after,.mainnav__link:hover::after{ width:calc(100% - 1.6rem) }

/* Offcanvas mobil menü */
.mobmenu{
  width:min(86vw,340px);
  background:linear-gradient(180deg,#141210 0%,#0A0908 100%);
  color:var(--txt);
  border-right:1px solid rgba(181,129,70,.3);
}
.mobmenu__head{
  padding:1.05rem 1.25rem;
  border-bottom:1px solid rgba(181,129,70,.22);
  display:flex; align-items:center; justify-content:space-between;
}
.mobmenu__title{
  font-family:var(--f-display); font-weight:700; text-transform:uppercase;
  letter-spacing:.1em; font-size:1rem; color:var(--gold-2);
}
.mobmenu__close{
  width:44px; height:44px; margin-right:-.5rem;
  display:inline-flex; align-items:center; justify-content:center;
  background:transparent; border:0; color:var(--cream); font-size:1.15rem; cursor:pointer;
}
.mobmenu__body{ padding:.5rem 1.25rem 1.5rem; display:flex; flex-direction:column }
.mobmenu__list li + li{ border-top:1px solid rgba(181,129,70,.16) }
.mobmenu__list a{
  display:flex; align-items:center; min-height:52px;
  font-family:var(--f-display); font-weight:500; font-size:1.02rem;
  letter-spacing:.09em; text-transform:uppercase; color:var(--cream);
  transition:color .2s ease, padding-left .2s ease;
}
.mobmenu__list a:hover{ color:var(--gold-2); padding-left:.35rem }

.mobmenu__foot{ margin-top:1.5rem; display:flex; flex-direction:column; gap:.7rem }
.mobmenu__addr{
  display:flex; gap:.6rem; margin-top:.5rem;
  color:var(--txt-dim); font-size:.85rem; line-height:1.55;
}
.mobmenu__addr .ic{ color:var(--gold); margin-top:.28rem }
.mobmenu__social{ display:flex; gap:.6rem; margin-top:.9rem }
.mobmenu__social a{
  width:44px; height:44px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid rgba(181,129,70,.45); color:var(--gold-2); font-size:1.05rem;
  transition:background-color .2s ease, color .2s ease;
}
.mobmenu__social a:hover{ background:var(--gold-3); color:#FBF1DF }

/* ==========================================================================
   7. Hero
   ========================================================================== */
.hero{
  position:relative;
  background:var(--ink);
  isolation:isolate;
  display:flex; align-items:center;
  min-height:clamp(500px, 62vh, 620px);
  padding-block:clamp(2.5rem,5vw,4rem);
  overflow:hidden;
}
.hero__media{ position:absolute; inset:0; z-index:-2 }
.hero__media img{
  width:100%; height:100%; object-fit:cover; object-position:68% 50%;
}
.hero__media::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(90deg, #0A0908 0%, #0A0908 22%, rgba(10,9,8,.94) 36%, rgba(10,9,8,.62) 49%, rgba(10,9,8,.15) 63%, rgba(10,9,8,0) 74%),
    linear-gradient(0deg, rgba(8,7,6,.65) 0%, rgba(8,7,6,0) 38%),
    linear-gradient(180deg, rgba(8,7,6,.55) 0%, rgba(8,7,6,0) 26%);
}
.hero__container{ position:relative; z-index:1 }
.hero__content{ max-width:min(560px,100%) }

.hero__title{
  font-size:clamp(2.35rem, 1rem + 4.6vw, 4.7rem);
  text-transform:uppercase;
  color:#F6ECDC;
  line-height:.98;
  text-shadow:0 4px 22px rgba(0,0,0,.55);
}
.hero__script{
  display:block;
  font-family:var(--f-script); font-weight:400;
  text-transform:none;
  font-size:.6em; line-height:1.24;
  color:var(--gold-2);
  letter-spacing:.01em;
  margin-top:.12em;
  text-shadow:0 3px 16px rgba(0,0,0,.5);
}
.hero__text{
  margin-top:1.15rem; max-width:34rem;
  color:#DCD1C0; font-size:clamp(.9rem,.32vw + .84rem,1.02rem);
  text-shadow:0 2px 10px rgba(0,0,0,.5);
}
.hero__actions{ display:flex; flex-wrap:wrap; gap:.85rem; margin-top:1.85rem }

/* ==========================================================================
   8. Güven avantajları
   ========================================================================== */
.trust{
  background:var(--cream-2);
  color:var(--txt-ink);
  position:relative;
  border-block:1px solid rgba(36,25,15,.08);
}
.trust::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:var(--noise); background-size:160px 160px;
  opacity:.05; mix-blend-mode:multiply;
}
.trust .container{ position:relative; z-index:1 }
.trust__grid{
  display:grid; grid-template-columns:repeat(4,1fr);
  padding-block:clamp(1.1rem,2.2vw,1.65rem);
}
.trust__item{
  display:flex; align-items:center; gap:.9rem;
  padding-inline:clamp(.4rem,1.6vw,1.5rem);
}
.trust__item + .trust__item{ border-left:1px solid rgba(36,25,15,.14) }
.trust__ic{
  flex:0 0 auto; font-size:clamp(1.7rem,2.5vw,2.4rem);
  color:#5A3B18; line-height:0;
}
.trust__body{ display:flex; flex-direction:column; min-width:0 }
.trust__title{
  font-family:var(--f-display); font-weight:700; text-transform:uppercase;
  font-size:clamp(.8rem,.34vw + .74rem,1.02rem);
  letter-spacing:.045em; color:#20160C; line-height:1.2;
}
.trust__text{
  font-size:clamp(.78rem,.2vw + .74rem,.86rem);
  line-height:1.45; color:var(--txt-ink-dim); margin-top:.3rem;
}

/* ==========================================================================
   9. Öne çıkan ürünler
   ========================================================================== */
.menu__grid{ margin-bottom:0 }

.pcard{
  height:100%;
  display:flex; flex-direction:column;
  background:linear-gradient(180deg,#151310 0%,#0D0C0A 100%);
  border:1px solid rgba(181,129,70,.34);
  border-radius:var(--r);
  overflow:hidden;
  transition:border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.pcard:hover{
  border-color:var(--gold);
  transform:translateY(-4px);
  box-shadow:0 14px 32px rgba(0,0,0,.5);
}
.pcard__media{ position:relative; aspect-ratio:4/3; overflow:hidden; background:#100E0C }
.pcard__media img{
  width:100%; height:100%; object-fit:cover;
  transition:scale .5s ease;
}
.pcard:hover .pcard__media img{ scale:1.06 }
.pcard__badge{
  position:absolute; top:0; left:0; z-index:2;
  background:var(--green); color:#F0E6D3;
  font-family:var(--f-display); font-weight:500;
  font-size:.6rem; line-height:1.25; letter-spacing:.07em; text-transform:uppercase;
  padding:.4rem .6rem; border-radius:0 0 var(--r) 0;
  box-shadow:0 3px 10px rgba(0,0,0,.4);
}
.pcard__body{
  display:flex; flex-direction:column; flex:1 1 auto;
  padding:.85rem .9rem 1rem;
}
.pcard__title{
  font-size:clamp(.92rem,.3vw + .86rem,1.06rem);
  text-transform:uppercase; color:var(--cream); letter-spacing:.02em;
  line-height:1.2; min-height:2.4em;   /* iki satırlık sabit alan → kartlar hizalı */
}
.pcard__text{
  margin-top:.45rem; font-size:.79rem; line-height:1.5; color:#9E9381;
}
.pcard__price{
  margin-top:auto; padding-top:.75rem;
  font-family:var(--f-display); font-weight:700;
  font-size:clamp(1.15rem,.45vw + 1.05rem,1.45rem);
  color:var(--gold-2); letter-spacing:.01em;
}
.pcard__price .try{ font-size:.72em; margin-right:.06em; opacity:.9 }

/* ==========================================================================
   10. Marka hikâyesi
   ========================================================================== */
.story{
  display:grid;
  background:var(--cream);
  color:var(--txt-ink);
  position:relative;
}
.story__media{ position:relative; background:#0C0B09 }
.story__media img{ width:100%; height:100%; object-fit:cover; object-position:52% 42% }
.story__panel{ position:relative }
.story__panel::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:var(--noise); background-size:160px 160px;
  opacity:.05; mix-blend-mode:multiply;
}
.story__inner{
  position:relative; z-index:1;
  padding:clamp(2.25rem,4.4vw,4rem) var(--gut);
  max-width:760px;
}
.story__text{
  margin-top:1.1rem; color:#453728;
  font-size:clamp(.88rem,.3vw + .82rem,1rem); line-height:1.75;
}
.story__sign{
  margin-top:1.3rem;
  font-family:var(--f-script); font-size:1.55rem; color:#3A2C1D;
}

.stats{
  margin-top:1.75rem;
  display:grid; grid-template-columns:repeat(2,1fr);
  border:1px solid rgba(89,62,32,.3); border-radius:var(--r);
  background:rgba(255,252,244,.42);
}
.stats__item{
  display:flex; flex-direction:column; align-items:center; text-align:center;
  gap:.3rem; padding:1.1rem .55rem;
  border-top:1px solid rgba(89,62,32,.22);
  border-left:1px solid rgba(89,62,32,.22);
}
.stats__item:nth-child(-n+2){ border-top:0 }
.stats__item:nth-child(2n+1){ border-left:0 }
.stats__ic{ font-size:1.5rem; color:#5A3B18; margin-bottom:.15rem }
.stats__value{
  font-family:var(--f-display); font-weight:700; text-transform:uppercase;
  font-size:clamp(.85rem,.28vw + .8rem,1.02rem); line-height:1.15; color:#20160C;
  letter-spacing:.02em;
}
.stats__label{ font-size:.75rem; line-height:1.35; color:var(--txt-ink-dim) }

/* ==========================================================================
   11. Hazırlık süreci
   ========================================================================== */
.steps{
  display:grid; grid-template-columns:1fr;
  gap:clamp(1rem,2.2vw,1.6rem);
}
.steps__item{
  position:relative;
  display:flex; align-items:center; gap:.85rem;
  padding-right:clamp(.5rem,1.6vw,1.4rem);
}
.steps__num{
  flex:0 0 auto;
  width:44px; height:44px; border-radius:50%;
  display:grid; place-items:center;
  background:linear-gradient(180deg,var(--copper-a),var(--copper-b));
  color:#FBF2E2; font-family:var(--f-display); font-weight:700; font-size:1.2rem;
  box-shadow:0 0 0 5px rgba(181,129,70,.12);
}
.steps__ic{
  flex:0 0 auto; width:2.3rem; height:2.3rem;
  fill:currentColor; color:var(--gold); opacity:.95;
}
.steps__ic--wide{ width:3.1rem }
.steps__body{ min-width:0 }
.steps__title{
  font-size:clamp(.84rem,.3vw + .78rem,1rem);
  text-transform:uppercase; color:var(--gold-2); letter-spacing:.08em;
  display:flex; align-items:center; gap:.55rem;
}
.steps__title::after{
  content:""; flex:1 1 auto; height:1px; min-width:14px;
  background:linear-gradient(90deg,rgba(181,129,70,.7),rgba(181,129,70,0));
}
.steps__text{
  margin-top:.4rem; font-size:clamp(.79rem,.2vw + .75rem,.87rem);
  line-height:1.55; color:#9B9078;
}

/* ==========================================================================
   12. Yorumlar
   ========================================================================== */
.slider{
  position:relative;
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:1.1rem;
}
.slider__track{
  order:1; flex:1 1 100%; min-width:0;
  display:flex; gap:clamp(.9rem,1.7vw,1.5rem);
  overflow-x:auto; overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;
  scrollbar-width:none; -ms-overflow-style:none;
  padding-block:.4rem;
}
.slider__track::-webkit-scrollbar{ display:none }
.slider__slide{ flex:0 0 100%; scroll-snap-align:start; display:flex }

.rcard{
  margin:0; width:100%;
  display:flex; flex-direction:column;
  background:var(--cream-3);
  border:1px solid rgba(89,62,32,.24);
  border-radius:var(--r);
  padding:clamp(1.15rem,1.9vw,1.6rem);
  box-shadow:0 2px 0 rgba(89,62,32,.06);
}
.rcard__stars{ display:flex; gap:.18rem; color:#E0A32F; font-size:1.02rem; margin-bottom:.7rem }
.rcard__text{
  color:#3B2E20; font-size:clamp(.85rem,.28vw + .8rem,.95rem); line-height:1.62;
  flex:1 1 auto;
}
.rcard__foot{ display:flex; align-items:center; gap:.7rem; margin-top:1.15rem }
.rcard__g{ width:26px; height:26px; flex:0 0 auto }
.rcard__name{
  display:block; font-style:normal; font-weight:600;
  font-size:.88rem; color:#241A0F; line-height:1.3;
}
.rcard__src{ display:block; font-size:.75rem; color:var(--txt-ink-dim) }

.slider__nav{
  width:44px; height:44px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  background:transparent; border:1px solid rgba(89,62,32,.28);
  color:#4A3824; font-size:1rem; cursor:pointer;
  transition:background-color .2s ease, color .2s ease, border-color .2s ease, opacity .2s ease;
}
.slider__nav:hover{ background:#DCCBB1; border-color:rgba(89,62,32,.5) }
.slider__nav[disabled]{ opacity:.32; cursor:default }
.slider__nav[disabled]:hover{ background:transparent }
.slider__nav--prev{ order:2 }
.slider__nav--next{ order:3 }

/* ==========================================================================
   13. Galeri
   ========================================================================== */
.gallery__grid{
  display:grid; grid-template-columns:repeat(2,1fr);
  gap:clamp(.5rem,1vw,.75rem);
}
.gallery__item{
  position:relative; overflow:hidden; border-radius:var(--r);
  border:1px solid rgba(181,129,70,.22);
  aspect-ratio:4/3; background:#100E0C;
}
.gallery__item img{
  width:100%; height:100%; object-fit:cover;
  transition:scale .55s ease, filter .35s ease;
  filter:saturate(.95);
}
.gallery__item:hover img{ scale:1.07; filter:saturate(1.05) }

/* ==========================================================================
   14. İletişim / harita / saatler
   ========================================================================== */
.contact{ background:var(--cream); color:var(--txt-ink); position:relative }
.contact::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:var(--noise); background-size:160px 160px;
  opacity:.05; mix-blend-mode:multiply;
}
.contact__grid{ position:relative; z-index:1; display:grid }
.contact__col{ display:flex }
.contact__inner{
  display:flex; flex-direction:column; width:100%;
  padding:clamp(2rem,3.6vw,3.25rem) var(--gut);
}
.contact__title{ font-size:clamp(1.3rem,.7rem + 1.3vw,1.75rem); margin-bottom:1.35rem }

.cinfo{ display:flex; flex-direction:column; gap:1.05rem }
.cinfo__item{ display:flex; align-items:flex-start; gap:.85rem; line-height:1.5 }
.cinfo__item a{ display:inline-flex; align-items:center; min-height:44px }
.cinfo__item a:hover{ color:#8A5A28; text-decoration:underline }
.cinfo__ic{
  flex:0 0 auto; width:38px; height:38px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid rgba(89,62,32,.3); color:#5A3B18; font-size:1rem;
}
.cinfo__muted{ color:var(--txt-ink-dim); font-size:.85rem }

.contact__col--map{ min-height:280px }
.contact__map{ width:100%; height:100%; min-height:280px; border:0; display:block; background:#DCD3C2 }

.hours{ width:100%; border-collapse:collapse; font-size:clamp(.85rem,.25vw + .8rem,.95rem) }
.hours__caption{ position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap }
.hours th,.hours td{ padding:.42rem 0; font-weight:400; text-align:left }
.hours th{ color:#3B2E20 }
.hours td{ text-align:right; color:#4A3B2A; font-variant-numeric:tabular-nums; white-space:nowrap }
.hours tr + tr th,.hours tr + tr td{ border-top:1px solid rgba(89,62,32,.12) }
.hours .is-today th,.hours .is-today td{ color:#7A4E1C; font-weight:600 }
.hours .is-today th::before{
  content:""; display:inline-block; width:6px; height:6px; border-radius:50%;
  background:var(--gold); margin-right:.5rem; vertical-align:.12em;
}
.hours__note{ margin-top:1rem; font-size:.8rem; line-height:1.5; color:var(--txt-ink-dim) }

/* ==========================================================================
   15. Footer
   ========================================================================== */
.site-footer{
  background:var(--ink-3); color:#C4B8A5;
  border-top:1px solid rgba(181,129,70,.2);
  position:relative;
  font-size:.86rem;
}
.site-footer::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:var(--noise); background-size:160px 160px;
  opacity:.05; mix-blend-mode:overlay;
}
.site-footer .container{ position:relative; z-index:1 }
.site-footer__top{
  display:grid; gap:clamp(1.6rem,3vw,2.5rem);
  padding-block:clamp(2.25rem,4vw,3.25rem);
}
.site-footer__logo{ width:auto; height:118px }
.site-footer__about p{ line-height:1.75; color:#B7AB98 }
.site-footer__social{ display:flex; gap:.6rem; margin-top:1.1rem }
.site-footer__social a{
  width:44px; height:44px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid rgba(181,129,70,.4); color:var(--gold-2); font-size:1.02rem;
  transition:background-color .2s ease, color .2s ease, border-color .2s ease;
}
.site-footer__social a:hover{ background:var(--gold-3); color:#FBF1DF; border-color:var(--gold-3) }

.site-footer__title{
  font-size:1rem; text-transform:uppercase; letter-spacing:.1em;
  color:var(--gold-2); margin-bottom:1rem;
}
.flinks li + li{ margin-top:.15rem }
.flinks a{
  display:inline-flex; align-items:center; min-height:44px;
  transition:color .2s ease, padding-left .2s ease;
}
.flinks a:hover{ color:var(--gold-2); padding-left:.25rem }
.flinks--plain li{ color:#B7AB98; min-height:44px; display:flex; align-items:center }

.fcontact li{ display:flex; align-items:flex-start; gap:.65rem; line-height:1.55 }
.fcontact li + li{ margin-top:.85rem }
.fcontact a{ display:inline-flex; align-items:center; min-height:44px; margin-block:-.55rem }
.fcontact .ic{ color:var(--gold); margin-top:.3rem; font-size:.95rem }
.fcontact a:hover{ color:var(--gold-2) }

.site-footer__bottom{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:.5rem 1.5rem;
  padding-block:1.15rem;
  border-top:1px solid rgba(181,129,70,.18);
  font-size:.8rem; color:#9B9080;
}

/* ==========================================================================
   16. Mobil sabit CTA çubuğu
   ========================================================================== */
.mobbar{
  position:fixed; left:0; right:0; bottom:0; z-index:1040;
  display:grid; grid-template-columns:repeat(3,1fr);
  background:var(--green-2);
  border-top:1px solid rgba(181,129,70,.4);
  padding-bottom:env(safe-area-inset-bottom, 0px);
  box-shadow:0 -6px 22px rgba(0,0,0,.45);
}
.mobbar__item{
  min-height:var(--mobbar-h);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.16rem;
  background:var(--green);
  color:#EFE4D0; font-family:var(--f-display); font-weight:500;
  font-size:.74rem; letter-spacing:.08em; text-transform:uppercase;
  border-left:1px solid rgba(0,0,0,.28);
}
.mobbar__item:first-child{ border-left:0 }
.mobbar__item .ic{ font-size:1.25rem }
.mobbar__item--mid{ background:linear-gradient(180deg,var(--copper-a),var(--copper-b)); color:#FCF4E5 }
.mobbar__item:active{ filter:brightness(1.12) }

/* ==========================================================================
   17. Duyarlı düzenlemeler
   ========================================================================== */

/* ---- Küçük mobil (≤ 400px) ---- */
@media (max-width: 400px){
  .topbar{ font-size:.72rem }
  .pcard__body{ padding:.7rem .7rem .85rem }
  .pcard__text{ font-size:.74rem }
  .trust__title{ font-size:.7rem; letter-spacing:.02em }
  .hero__actions .btn{ width:100% }
}

/* ---- Üst şerit: mobil ve tablette sadeleşir ---- */
@media (max-width: 991.98px){
  .topbar__item--sep{ display:none }
  .topbar__hours-long{ display:none }
  .topbar__hours-short{ display:inline }
  .topbar__soc--call{ display:inline-flex }
  /* Dokunma alanı 44px; görünen daire küçük kalır */
  .topbar__soc{ border-color:transparent; width:44px; height:44px; font-size:1.05rem }
  .topbar__social{ gap:0; margin-right:-.5rem }
  .topbar__item a{ min-height:44px }
}

/* ---- Mobil: güven şeridi ikon üstte ---- */
@media (max-width: 767.98px){
  .trust__grid{ padding-block:.9rem }
  .trust__item{
    flex-direction:column; align-items:center; text-align:center; gap:.4rem;
    padding-inline:.35rem;
  }
  .trust__text{ display:none }
  .trust__title{ font-size:.74rem; letter-spacing:.02em }
  .trust__ic{ font-size:1.55rem }
}

/* ---- Mobil hero ---- */
@media (max-width: 991.98px){
  .hero{
    min-height:clamp(420px, 60vh, 520px);
    align-items:center;
    padding-block:clamp(2rem,6vw,3rem);
  }
  .hero__media img{ object-position:46% 62% }
  .hero__media::after{
    background:
      linear-gradient(180deg, rgba(9,8,7,.82) 0%, rgba(9,8,7,.3) 26%, rgba(9,8,7,.4) 62%, rgba(9,8,7,.88) 100%),
      linear-gradient(90deg, rgba(9,8,7,.9) 0%, rgba(9,8,7,.62) 34%, rgba(9,8,7,.22) 72%, rgba(9,8,7,.05) 100%);
  }
  .hero__content{ max-width:min(30rem,100%) }
  .hero__title{ line-height:.96 }
  .hero__actions{ flex-direction:column; align-items:stretch; gap:.65rem; margin-top:1.4rem }
  .hero__actions .btn{ max-width:17rem; justify-content:flex-start }
  .hero__text{ font-size:.88rem; margin-top:.9rem }

  /* Cream mobil header + ortalanmış taşan logo */
  .site-header__inner{ justify-content:space-between }
  .brand{ position:absolute; left:50%; translate:-50% 0; z-index:2 }
  .site-header .container{ position:relative }
  .site-header.is-stuck{ box-shadow:0 8px 24px rgba(0,0,0,.28) }
  .site-header.is-stuck{ --brand-box:44px; --brand-h:46px }
}

/* ---- Küçük tabletten itibaren ---- */
/* ---- Tablet: güven şeridi 2 sütun (4 sütun sıkışıyor) ---- */
@media (min-width: 768px) and (max-width: 991.98px){
  .trust__grid{ grid-template-columns:repeat(2,1fr); row-gap:1.1rem }
  .trust__item{ padding-inline:clamp(.5rem,2vw,1.25rem) }
  .trust__item:nth-child(2n+1){ border-left:0 }
  .trust__item:nth-child(n+3){ border-top:1px solid rgba(36,25,15,.14); padding-top:1.1rem }
}

@media (min-width: 576px){
  .gallery__grid{ grid-template-columns:repeat(3,1fr) }
  .slider__slide{ flex:0 0 calc((100% - clamp(.9rem,1.7vw,1.5rem)) / 2) }
  .steps{ grid-template-columns:repeat(2,1fr); column-gap:clamp(1.25rem,3vw,2.5rem) }
}

/* ---- Tablet ---- */
@media (min-width: 768px){
  .site-footer__top{ grid-template-columns:repeat(2,1fr) }
  .site-footer__brand{ grid-column:span 2; display:flex; justify-content:center }
  .site-footer__about{ grid-column:span 2; text-align:center }
  .site-footer__about .site-footer__social{ justify-content:center }

  .stats{ grid-template-columns:repeat(4,1fr) }
  .stats__item{ border-top:0 }
  .stats__item:nth-child(2n+1){ border-left:1px solid rgba(89,62,32,.22) }
  .stats__item:first-child{ border-left:0 }
}

/* ---- Masaüstü ---- */
@media (min-width: 992px){
  /* Header: hero üzerinde koyu, kaydırınca opak */
  .site-header{
    background:linear-gradient(180deg, rgba(9,8,7,.92) 0%, rgba(9,8,7,.34) 100%);
    border-bottom:0;
    margin-bottom:calc(var(--hdr-h) * -1);
  }
  .site-header.is-stuck{
    background:rgba(8,7,6,.97);
    box-shadow:0 10px 30px rgba(0,0,0,.5), inset 0 -1px 0 rgba(181,129,70,.28);
  }
  /* İç sayfalarda header opak ve akışta kalır (hero'nun üzerine binmez).
     Header işaretlemesi her sayfada aynıdır; fark yalnızca body sınıfındadır. */
  body:not(.page-anasayfa) .site-header,
  body:not(.page-anasayfa) .site-header.is-stuck{
    background:rgba(8,7,6,.97);
    margin-bottom:0;
    box-shadow:0 8px 26px rgba(0,0,0,.42), inset 0 -1px 0 rgba(181,129,70,.26);
  }
  .site-header__inner{ gap:clamp(1rem,2.4vw,2.5rem) }
  .site-header.is-stuck{ --brand-box:70px; --brand-h:72px }
  .mainnav{ margin-inline:auto }
  .site-header__cta{ margin-left:auto }

  /* Logo header'ın altına taştığı için hero metni o kadar aşağıdan başlar */
  .hero{
    padding-top:calc(var(--hdr-h) + (var(--brand-h) - var(--brand-box)) + 1.75rem);
    min-height:clamp(560px, 44vw, 700px);
  }
  .hero__content{ max-width:min(48%,640px) }

  .trust__grid{ padding-block:clamp(1.15rem,2vw,1.7rem) }

  /* Süreç: 4 adım + aralarında ok */
  .steps{ --steps-gap:clamp(1.25rem,2.6vw,2.25rem); grid-template-columns:repeat(4,1fr); column-gap:var(--steps-gap) }
  .steps__item:not(:last-child)::after{
    content:""; position:absolute; top:50%;
    right:calc(var(--steps-gap) / -2); translate:50% -50%;
    width:26px; height:11px; opacity:.75;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 11'%3E%3Cpath d='M1 5.5h20M17.5 2l3.5 3.5-3.5 3.5' fill='none' stroke='%23B58146' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  }

  .story{ grid-template-columns:43% 57%; align-items:stretch }
  .story__media::after{
    content:""; position:absolute; inset:0; pointer-events:none;
    background:linear-gradient(90deg, rgba(12,11,9,.35) 0%, rgba(12,11,9,0) 30%, rgba(12,11,9,0) 78%, rgba(12,11,9,.55) 100%);
  }
  .story__inner{ padding-inline:clamp(2.25rem,3.6vw,3.75rem) clamp(1.5rem,3vw,3rem) }

  .contact__grid{ grid-template-columns:minmax(260px,1fr) minmax(0,1.95fr) minmax(260px,1fr) }
  .contact__col--map{ min-height:380px }
  .contact__map{ min-height:380px }
  .contact__col--info .contact__inner{ padding-left:max(var(--gut), calc((100vw - var(--shell)) / 2 + var(--gut))) }
  .contact__col--hours .contact__inner{ padding-right:max(var(--gut), calc((100vw - var(--shell)) / 2 + var(--gut))) }

  .slider{ display:block; padding-inline:clamp(2.75rem,4.4vw,3.75rem) }
  .slider__slide{ flex:0 0 calc((100% - 2 * clamp(.9rem,1.7vw,1.5rem)) / 3) }
  .slider__nav{ position:absolute; top:50%; translate:0 -50% }
  .slider__nav--prev{ left:0 }
  .slider__nav--next{ right:0 }

  .gallery__grid{ grid-template-columns:repeat(6,1fr) }

  .site-footer{ font-size:.88rem }
  .site-footer__top{
    grid-template-columns:auto minmax(200px,1.35fr) repeat(3,minmax(140px,.85fr));
    align-items:start;
    gap:clamp(1.5rem,2.6vw,3rem);
  }
  .site-footer__brand{ grid-column:auto; display:block }
  .site-footer__about{ grid-column:auto; text-align:left }
  .site-footer__about .site-footer__social{ justify-content:flex-start }
}

/* ---- Büyük masaüstü: üst şeritte sosyal medya çağrısı ---- */
@media (min-width: 1200px){
  .topbar__cta{ display:inline }
}

/* ---- Geniş masaüstü ---- */
@media (min-width: 1400px){
  :root{ --brand-box:92px; --brand-h:158px }
}

/* Yorumlar kaydırma çubuğu odak halkası */
.slider__track:focus-visible{ outline-offset:-2px }

/* Hareket azaltma tercihi */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important;
  }
  .slider__track{ scroll-behavior:auto }
}

/* Yazdırma */
@media print{
  .topbar,.site-header,.mobbar,.slider__nav,.hero__media{ display:none !important }
  body{ background:#fff; color:#000; padding:0 }
}