:root{
  --bg:#F7F3EA; --bg-white:#FFFFFF; --surface:#FFFDF9; --ink:#211E1B; --ink-2:#6E675C;
  --wine:#7A2230; --wine-hover:#671C28; --green:#3E7F72; --green-dark:#2F5D50;
  --lemon:#EFE08A; --rule:#E3DCCB; --ikincil-hover:#EFE9DC;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:26px; --s7:32px;
  --s8:44px; --s9:56px; --s10:80px;
  --kap:1280px; --yan:20px; --tasma:16px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;border-radius:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  background:var(--bg); color:var(--ink);
  font-family:Newsreader,Georgia,serif; font-weight:400; font-size:17px; line-height:1.55;
  text-wrap:pretty; -webkit-font-smoothing:antialiased;
}
img,svg,iframe{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
[hidden]{display:none !important}
h1,h2,h3{font-family:'Bricolage Grotesque',system-ui,sans-serif;font-weight:400;line-height:1.2}
:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.gizli{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.atla{position:absolute;left:-9999px;top:0;z-index:99;background:var(--ink);color:var(--bg);
  padding:12px 16px;font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.06em}
.atla:focus{left:0}

/* ------------------------------------------------ bilgi katmanı */
.mono,.etiket,.btn,.filtre,.kont,.geri,.ic-link,.ay-baslik,.adim__no{
  font-family:'IBM Plex Mono',ui-monospace,monospace; font-weight:400;
  letter-spacing:.06em; text-transform:uppercase; line-height:1.35;
}
.mono{font-size:13px;color:var(--ink-2)}

/* ------------------------------------------------ yerleşim */
.kap{width:100%;max-width:var(--kap);margin-inline:auto;padding-inline:var(--yan)}
main{display:block}
.bolum{padding-block:var(--s8)}
.bolum:first-child{padding-block-start:var(--s7)}
.bolum>.kap{display:flex;flex-direction:column;gap:var(--s5);align-items:flex-start}
.bolum__ust{display:flex;flex-wrap:wrap;gap:var(--s3) var(--s5);align-items:baseline;
  justify-content:space-between;width:100%}
.bolum__etiket{font-size:13px;color:var(--ink-2)}
.bolum__baslik{font-size:24px;letter-spacing:.005em;max-width:20ch}
.alt-baslik{font-size:19px;font-weight:500;margin-block-start:var(--s2)}
.metin{display:flex;flex-direction:column;gap:var(--s3);max-width:46ch}
.metin p,.hero__lead p,.blok p,.adim__ic p,.sss__cevap p,.bos p{max-width:46ch}
strong{font-weight:500}

.cizgi{width:100%;height:2px;background:var(--ink)}
.cizgi--tasan{height:2px;background:var(--ink);margin-inline:calc(-1 * var(--tasma))}
hr{border:0;height:1px;background:var(--rule)}

/* ------------------------------------------------ üst çubuk */
.ust{border-block-end:1px solid var(--rule);background:var(--bg);position:relative;z-index:20}
.ust__kap{display:flex;align-items:center;gap:var(--s4);min-height:64px;
  justify-content:space-between}
.logo{display:flex;align-items:center;gap:var(--s3);text-decoration:none;padding-block:var(--s2)}
.logo .sembol{width:26px;height:auto;color:var(--ink)}
.logo__ad{font-family:'Bricolage Grotesque',sans-serif;font-weight:400;font-size:14px;
  line-height:1.05;letter-spacing:.04em;text-transform:uppercase}
.menu{display:flex;align-items:center;gap:var(--s5)}
.menu__liste{display:flex;align-items:center;gap:var(--s5)}
.menu__oge{position:relative;display:flex;align-items:center}
.menu__link{font-family:'Bricolage Grotesque',sans-serif;font-size:16px;text-decoration:none;
  display:flex;align-items:center;min-height:44px;transition:color .15s ease}
.menu__link:hover{color:var(--wine)}
.menu__link[aria-current="page"]{border-block-end:2px solid var(--ink)}
.menu__ok{min-width:32px;min-height:44px;font-size:12px;color:var(--ink-2)}
.menu__alt{position:absolute;inset-inline-start:0;top:100%;background:var(--surface);
  border:1px solid var(--rule);min-width:210px;padding:var(--s2) 0;display:none;z-index:30}
.menu__oge--acilir:hover .menu__alt,.menu__oge--acilir:focus-within .menu__alt,
.menu__oge--acik .menu__alt{display:block}
.menu__alt a{display:block;padding:var(--s3) var(--s4);min-height:44px;text-decoration:none;
  font-family:'Bricolage Grotesque',sans-serif;font-size:15px;
  transition:background-color .15s ease}
.menu__alt a:hover{background:var(--ikincil-hover)}
.hamburger{display:none;width:44px;height:44px;flex-direction:column;justify-content:center;
  gap:5px;align-items:center;border:1px solid var(--rule)}
.hamburger__cizgi{width:20px;height:2px;background:var(--ink)}

/* ------------------------------------------------ butonlar */
.btnler{display:flex;flex-wrap:wrap;gap:var(--s3)}
.btn{display:inline-flex;align-items:center;justify-content:center;text-align:center;
  font-weight:500;font-size:11px;letter-spacing:.06em;padding:12px var(--s4);
  min-height:44px;text-decoration:none;border:1px solid transparent;
  transition:background-color .15s ease,border-color .15s ease,color .15s ease}
.btn--birincil{background:var(--wine);color:var(--bg);border-color:var(--wine)}
.btn--birincil:hover{background:var(--wine-hover);border-color:var(--wine-hover)}
.btn--ikincil{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn--ikincil:hover{background:var(--ikincil-hover)}
.btn--yer-tutucu{color:var(--ink-2);border-color:var(--rule);cursor:default}
.ust__wa{padding-inline:var(--s4)}
.ic-link{font-size:12px;font-weight:500;text-decoration:none;
  border-block-end:1px solid var(--rule);padding-block-end:2px;color:var(--ink);
  display:inline-flex;align-items:center;min-height:32px;
  transition:border-color .15s ease,color .15s ease}
.ic-link:hover{color:var(--wine);border-color:var(--wine)}
.geri{font-size:12px;font-weight:500;text-decoration:none;color:var(--ink-2);
  display:inline-flex;align-items:center;min-height:44px;transition:color .15s ease}
.geri:hover{color:var(--ink)}

/* ------------------------------------------------ hero */
.hero{padding-block:var(--s9) var(--s8);border-block-end:1px solid var(--rule)}
.hero__kap{display:flex;flex-direction:column;gap:var(--s5);align-items:flex-start}
.hero__h1{font-weight:300;font-size:36px;line-height:1.06;letter-spacing:.01em;max-width:15ch}
.hero__lead{display:flex;flex-direction:column;gap:var(--s3);font-size:19px}
.hero__meta{font-size:13px;color:var(--ink-2)}
.hero--vurgulu{background:var(--lemon);border-block-end:2px solid var(--ink)}
.hero--vurgulu .hero__meta,.hero--vurgulu .mono{color:var(--ink)}
.hero--vurgulu .btn--ikincil{border-color:var(--ink)}
.hero--sablon{padding-block:var(--s7) var(--s8)}

/* ------------------------------------------------ kategori etiketi */
.etiket{display:inline-flex;align-items:center;font-weight:500;font-size:10px;
  letter-spacing:.08em;padding:5px var(--s2);align-self:flex-start}
.etiket--cocuk{background:var(--green-dark);color:var(--bg)}
.etiket--workshop{background:var(--green-dark);color:var(--bg)}
.etiket--sip-paint{background:var(--wine);color:var(--bg)}
.etiket--eser{background:var(--ink);color:var(--bg)}
.etiket--ozel-grup{background:var(--ink);color:var(--lemon)}
.etiket--donemsel{background:var(--lemon);color:var(--ink)}

/* ------------------------------------------------ kartlar */
.kartlar{display:grid;grid-template-columns:1fr;gap:var(--s4);width:100%}
.kartlar--aylik{display:flex;flex-direction:column;gap:var(--s3)}
.kartlar__ay{display:grid;grid-template-columns:1fr;gap:var(--s4);width:100%;
  margin-block-end:var(--s5)}
.ay-baslik{font-size:13px;font-weight:500;color:var(--ink);margin-block-start:var(--s4)}
.kart{--tasma:16px;background:var(--surface);border:1px solid var(--rule);padding:var(--s4);
  display:flex;flex-direction:column;gap:9px;text-decoration:none;
  transition:border-color .15s ease,background-color .15s ease}
.kart:hover{border-color:var(--ink)}
.gorsel{aspect-ratio:16/7;width:100%}
.gorsel--cocuk{background:var(--green)}
.gorsel--workshop{background:var(--green)}
.gorsel--sip-paint{background:var(--wine)}
.gorsel--eser{background:var(--ink)}
.kart__baslik{font-size:18px;line-height:1.2}
.kart__kunye{font-size:12px;color:var(--ink-2)}
.kart__egitmen{font-size:11px;color:var(--ink-2)}
.kart__aciklama{font-size:16px;line-height:1.5}
.kart__git{font-size:11px;font-weight:500;color:var(--ink);margin-block-start:auto}
.kart__durum{margin-block-start:var(--s1)}
.kart__durum--buyuk .kont{font-size:14px}
.kont{font-weight:500;font-size:12px;letter-spacing:.06em}
.kont--var{color:var(--green-dark)}
.kont--son{color:var(--wine)}
.kont--doldu{color:var(--ink-2)}

/* ------------------------------------------------ ikili blok */
.ikili__grid{display:grid;grid-template-columns:1fr;gap:var(--s4);width:100%}
.ikili__blok{--tasma:16px;background:var(--surface);border:1px solid var(--rule);
  padding:var(--s4);display:flex;flex-direction:column;gap:9px}
.ikili__blok .gorsel{aspect-ratio:16/5}
.ikili__baslik{font-size:20px}
.ikili__meta{font-size:12px;color:var(--ink-2)}
.ikili__blok p{font-size:16px}
.ikili__blok .ic-link{margin-block-start:var(--s2);align-self:flex-start}

/* ------------------------------------------------ vurgu bloğu */
.vurgu{background:var(--lemon);border-block:2px solid var(--ink)}
.vurgu .bolum__etiket,.vurgu .mono,.vurgu p{color:var(--ink)}
.vurgu .btn--ikincil{border-color:var(--ink);color:var(--ink)}
.vurgu .btn--ikincil:hover{background:var(--bg)}

/* ------------------------------------------------ bloklar / adımlar */
.bloklar{display:grid;grid-template-columns:1fr;gap:var(--s4);width:100%}
.blok{--tasma:16px;border-block-start:1px solid var(--rule);padding-block-start:var(--s4);
  display:flex;flex-direction:column;gap:var(--s2)}
.blok__baslik{font-size:17px;font-weight:500}
.blok p{font-size:16px}
.blok .ic-link{align-self:flex-start;margin-block-start:var(--s1)}
.adimlar{display:flex;flex-direction:column;gap:var(--s5);width:100%}
.adim{display:grid;grid-template-columns:32px 1fr;gap:var(--s4);align-items:start;
  border-block-start:1px solid var(--rule);padding-block-start:var(--s4)}
.adim__no{font-size:13px;font-weight:500;color:var(--wine)}
.adim__ic{display:flex;flex-direction:column;gap:var(--s1)}
.adim__baslik{font-size:17px;font-weight:500}
.adim__ic p{font-size:16px}
.nokta-liste{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);font-size:12px;color:var(--ink-2)}
.nokta-liste li{display:flex;align-items:center;gap:var(--s4)}
.nokta-liste li:not(:last-child)::after{content:"·";color:var(--rule)}
.uyari{font-size:16px;color:var(--ink-2);max-width:46ch}
.uyari strong{color:var(--ink)}

/* ------------------------------------------------ SSS */
.sss-grup{width:100%;display:flex;flex-direction:column;gap:0}
.sss-grup__baslik{font-size:20px;margin-block:var(--s5) var(--s3)}
.sss{border-block-start:1px solid var(--rule);width:100%}
.sss:last-child{border-block-end:1px solid var(--rule)}
.sss__soru{font-family:'Bricolage Grotesque',sans-serif;font-size:17px;font-weight:400;
  padding:var(--s4) var(--s6) var(--s4) 0;min-height:44px;cursor:pointer;position:relative;
  display:flex;align-items:center;transition:color .15s ease}
.sss__soru::-webkit-details-marker{display:none}
.sss__soru::marker{content:""}
.sss__soru::after{content:"+";position:absolute;inset-inline-end:0;
  font-family:'IBM Plex Mono',monospace;font-size:16px;color:var(--ink-2)}
.sss[open] .sss__soru::after{content:"–"}
.sss__soru:hover{color:var(--wine)}
.sss__cevap{padding-block:0 var(--s4);font-size:16px}

/* ------------------------------------------------ tablo / adres / harita */
.tablo{width:100%;border-block-start:1px solid var(--rule)}
.tablo__satir{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s5);justify-content:space-between;
  padding-block:var(--s3);border-block-end:1px solid var(--rule)}
.tablo__k{font-size:12px;color:var(--ink-2)}
.tablo__v{font-size:13px;font-weight:500;color:var(--ink)}
.yer-tutucu{color:var(--ink-2);font-weight:400}
.adres{display:flex;flex-direction:column;gap:var(--s1);font-size:14px;font-style:normal;
  color:var(--ink);letter-spacing:.06em}
.harita{width:100%;border:1px solid var(--rule);background:var(--surface)}
.harita iframe{width:100%;height:340px;border:0;filter:saturate(.7)}

/* ------------------------------------------------ boş durum / hata */
.bos{width:100%;border:1px solid var(--rule);background:var(--surface);padding:var(--s6);
  display:flex;flex-direction:column;gap:var(--s3);align-items:flex-start}
.bos__baslik{font-size:20px}
.bos p{font-size:16px}
.hata{color:var(--wine);font-size:17px;padding-block:var(--s7);display:flex;flex-wrap:wrap;
  gap:var(--s3);align-items:center}
.hata .ic-link{color:var(--wine);border-color:var(--wine)}

/* ------------------------------------------------ filtreler */
.filtreler{display:flex;flex-wrap:wrap;gap:var(--s2);width:100%}
.filtre{font-size:11px;font-weight:500;padding:11px var(--s3);min-height:44px;
  border:1px solid var(--rule);background:transparent;color:var(--ink-2);
  transition:background-color .15s ease,border-color .15s ease,color .15s ease}
.filtre:hover{border-color:var(--ink);color:var(--ink)}
.filtre--aktif{background:var(--ink);border-color:var(--ink);color:var(--bg)}

/* ------------------------------------------------ alt bilgi */
.alt{background:var(--ink);color:var(--bg);padding-block:var(--s8);margin-block-start:var(--s8)}
.alt__kap{display:grid;grid-template-columns:1fr;gap:var(--s6)}
.alt .mono,.alt address{color:var(--bg);font-size:12px;font-style:normal;line-height:1.7}
.alt address span,.alt p span{display:block}
.alt__marka{display:flex;align-items:center;gap:var(--s3)}
.alt__marka .sembol{width:28px;color:var(--bg)}
.alt__ad{font-family:'Bricolage Grotesque',sans-serif;font-size:14px;letter-spacing:.04em;
  text-transform:uppercase;line-height:1.1}
.alt__baslik{font-size:11px;font-weight:500;color:var(--rule);margin-block-end:var(--s2)}
.alt a{text-decoration:none;transition:color .15s ease}
.alt a:hover{color:var(--lemon)}
.alt__menu ul{display:flex;flex-wrap:wrap;gap:var(--s3) var(--s5)}
.alt__menu a{font-family:'Bricolage Grotesque',sans-serif;font-size:15px;
  display:inline-flex;align-items:center;min-height:44px}
.alt__telif{font-size:11px;color:var(--ink-2);border-block-start:1px solid var(--ink-2);
  padding-block-start:var(--s4)}
.alt :focus-visible{outline-color:var(--bg)}

/* ------------------------------------------------ responsive */
@media (min-width:640px){
  :root{--yan:32px}
  body{font-size:18px}
  .hero__h1{font-size:40px}
  .bolum__baslik{font-size:27px}
  .kartlar,.kartlar__ay,.ikili__grid{grid-template-columns:repeat(2,1fr)}
  .bloklar{grid-template-columns:repeat(2,1fr)}
  .alt__kap{grid-template-columns:repeat(2,1fr)}
  .adim{grid-template-columns:44px 1fr}
}
@media (min-width:1024px){
  :root{--yan:48px}
  body{font-size:18px}
  .hero{padding-block:var(--s10) var(--s9)}
  .hero__h1{font-size:52px}
  .hero__lead{font-size:19px}
  .bolum{padding-block:var(--s9)}
  .bolum__baslik{font-size:30px}
  .kartlar,.kartlar__ay{grid-template-columns:repeat(3,1fr)}
  .bloklar{grid-template-columns:repeat(3,1fr)}
  .alt__kap{grid-template-columns:1.2fr 1fr 1fr 1.2fr}
  .alt__menu,.alt__telif{grid-column:1/-1}
}
@media (max-width:899px){
  .hamburger{display:flex}
  .menu{position:absolute;inset-inline:0;top:100%;background:var(--bg);
    border-block-end:1px solid var(--rule);flex-direction:column;align-items:stretch;
    gap:0;padding:var(--s3) var(--yan) var(--s5);display:none}
  body.menu-acik .menu{display:flex}
  .menu__liste{flex-direction:column;align-items:stretch;gap:0;width:100%}
  .menu__oge{display:flex;flex-wrap:wrap;align-items:center;
    border-block-end:1px solid var(--rule)}
  .menu__link{flex:1;font-size:18px;min-height:52px}
  .menu__alt{position:static;border:0;border-block-start:1px solid var(--rule);
    width:100%;padding:0;background:transparent}
  .menu__oge--acilir:hover .menu__alt{display:none}
  .menu__oge--acik .menu__alt{display:block}
  .menu__alt a{padding-inline:var(--s4)}
  .ust__wa{margin-block-start:var(--s4);align-self:flex-start}
  .ust__kap{flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important;
    animation-iteration-count:1 !important}
}
@media print{.ust,.alt,.harita{display:none}}

/* ------------------------------------------------ alt2: fotoğraf katmanı */
.gorsel--foto{aspect-ratio:4/3;overflow:hidden;background:var(--rule)}
.gorsel--foto img{width:100%;height:100%;object-fit:cover;filter:saturate(.88) contrast(.96)}
.ikili__blok .gorsel--foto{aspect-ratio:16/9}
.kart:hover .gorsel--foto img{filter:saturate(1) contrast(1)}

.hero{position:relative;padding-block:0 var(--s8)}
.hero__serit{width:100%;height:clamp(180px,34vw,340px);overflow:hidden;
  border-block-end:2px solid var(--ink);background:var(--rule)}
.hero__serit img{width:100%;height:100%;object-fit:cover;filter:saturate(.85) contrast(.95)}
.hero__kap{padding-block-start:var(--s8)}
.hero--vurgulu{padding-block:var(--s9) var(--s8)}
.hero--vurgulu .hero__kap{padding-block-start:0}
.hero--sablon{padding-block-start:var(--s7)}
.hero--sablon .hero__kap{padding-block-start:0}

/* boş durumun görsel karşılığı: fotoğraf yerine düz yüzey kalır */
.bos{background:var(--bg-white)}
@media (min-width:1024px){
  .hero__serit{height:380px}
}