/* =========================================================================
   f36 · SOKAK — fast casual ailesi (pizza · smash burger · çiğ köfte · waffle/kumpir · pide-lahmacun)
   İmza: STICKER + BANT — kalın mürekkep konturu, sert ofset gölge, hafif eğim; zikzak "patlak" fiyat rozeti;
   bölümler arasından eğik geçen kayan kampanya bandı; renk blokları site desenini taşır.
   Renk/font/radius: Görünüm değişkenleri (var(--primary) …) — sabit renk yazılmaz.
   ========================================================================= */

:root {
  --f36-ink: var(--dark);
  --f36-edge: var(--f36-ink);
  --f36-shc: var(--f36-ink);
  --f36-bw: 2.5px;
  --f36-card: #fff;
  --f36-h1: clamp(2.05rem, 4.3vw, 3.65rem);
  --f36-h2: clamp(1.65rem, 3.1vw, 2.6rem);
  --f36-hw: var(--head-weight, 800);
  --f36-hh: 96px;
  --section-y: clamp(64px, 8vw, 112px);
  --header-h: 72px;
  --cl-card: var(--f36-card);
  --cl-line: var(--f36-ink);
  --card-bg: var(--f36-card);
}

/* gölge değişkenleri: gölge rengi (--f36-shc) değişen bağlamlarda yeniden hesaplanır */
:root, .f36-bg-ink, .f36-t-ink, .f36-footer, .f36-foot-top { --f36-sh-sm: 3px 3px 0 var(--f36-shc); --f36-sh: 5px 5px 0 var(--f36-shc); --f36-sh-lg: 9px 9px 0 var(--f36-shc); }

/* ---------- Temel ---------- */
.fam-sokak { background: var(--bg); }
.fam-sokak h1, .fam-sokak h2, .fam-sokak h3, .fam-sokak h4 { font-weight: var(--f36-hw); letter-spacing: -.015em; }
.fam-sokak ::selection { background: var(--accent); color: var(--on-accent); }
.fam-sokak :focus-visible { outline: 3px solid var(--f36-ink); outline-offset: 3px; }
.fam-sokak .section { position: relative; }
.f36-sec { position: relative; padding: var(--section-y) 0; }
.f36-sec :is(h1, h2, h3, h4) { color: inherit; }
.f36-bg-paper { background: var(--bg); color: var(--text); }
.f36-bg-cream { background: var(--surface); color: var(--text); }
.f36-bg-pop, .f36-t-pop { background: var(--primary); color: var(--on-primary); }
.f36-bg-pop2, .f36-t-pop2 { background: var(--secondary); color: var(--on-secondary); }
.f36-bg-pop3, .f36-t-pop3 { background: var(--accent); color: var(--on-accent); }
.f36-bg-ink, .f36-t-ink { background: var(--dark); color: #fff; --f36-shc: var(--accent); }
.f36-t-paper { background: var(--f36-card); color: var(--f36-ink); }
.f36-bg-paper :is(h2, h3), .f36-bg-cream :is(h2, h3) { color: var(--heading, var(--dark)); }
.f36-t-pop :is(h1, h2, h3, h4, p, a:not(.btn)), .f36-t-pop2 :is(h1, h2, h3, h4, p, a:not(.btn)), .f36-t-pop3 :is(h1, h2, h3, h4, p, a:not(.btn)), .f36-t-ink :is(h1, h2, h3, h4, p, a:not(.btn)) { color: inherit; }
.f36-bg-pop :is(h2, h3, p), .f36-bg-pop2 :is(h2, h3, p), .f36-bg-pop3 :is(h2, h3, p), .f36-bg-ink :is(h2, h3, p) { color: inherit; }

/* Site deseni (renk bloklarında): v-pat-leopard | checker | stripes | dots */
.has-pat { position: relative; isolation: isolate; }
.has-pat::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background-color: currentColor; opacity: .1;
  -webkit-mask: var(--f36-pat) 0 0 / var(--f36-pat-size, 18px) var(--f36-pat-size, 18px) repeat; mask: var(--f36-pat) 0 0 / var(--f36-pat-size, 18px) var(--f36-pat-size, 18px) repeat; }
.fam-sokak { --f36-pat: radial-gradient(circle at 50% 50%, #000 1.7px, transparent 2.1px); --f36-pat-size: 16px; }
.v-pat-checker { --f36-pat: conic-gradient(#000 25%, transparent 0 50%, #000 0 75%, transparent 0); --f36-pat-size: 34px; }
.v-pat-checker .has-pat::before { opacity: .07; }
.v-pat-stripes { --f36-pat: repeating-linear-gradient(-45deg, #000 0 9px, transparent 9px 26px); --f36-pat-size: 37px; }
.v-pat-stripes .has-pat::before { opacity: .07; }
.v-pat-leopard { --f36-pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cg fill='%23000'%3E%3Cpath d='M18 14c6-4 15-2 17 4 1 4-4 3-8 2-5-1-9 3-12 1-2-2 0-5 3-7z'/%3E%3Cpath d='M14 30c3-1 5 2 4 6-1 3-5 4-7 2-2-3 0-7 3-8z'/%3E%3Cpath d='M38 28c4 1 6 6 3 9-2 2-4-1-6-3-2-3 0-7 3-6z'/%3E%3Cpath d='M74 10c7-2 13 2 12 8-1 3-4 1-7 0-4-1-7 2-9 0-2-3 0-7 4-8z'/%3E%3Cpath d='M70 26c3 0 4 4 2 7-2 2-6 1-6-2 0-3 1-5 4-5z'/%3E%3Cpath d='M92 30c4-1 7 3 5 7-1 2-4 1-6-1-2-3-1-5 1-6z'/%3E%3Cpath d='M44 58c6-3 13 0 13 6 0 3-4 2-7 1-4-1-7 2-9 0-2-2 0-5 3-7z'/%3E%3Cpath d='M40 74c3 0 5 3 3 6-2 2-6 2-6-1-1-3 1-5 3-5z'/%3E%3Cpath d='M62 72c4 1 5 5 3 8-2 2-5-1-6-3-1-3 0-5 3-5z'/%3E%3Cpath d='M98 60c6-2 12 2 11 7-1 3-4 1-7 0-4-1-6 2-8 0-2-3 0-6 4-7z'/%3E%3Cpath d='M94 76c3 0 5 3 3 6-2 2-5 1-6-1-1-3 1-5 3-5z'/%3E%3Cpath d='M12 92c6-2 12 1 12 6 0 3-4 2-7 1-4-1-6 2-8 0-2-2 0-6 3-7z'/%3E%3Cpath d='M28 104c3 0 5 3 3 6-2 2-6 1-6-1-1-3 1-5 3-5z'/%3E%3Cpath d='M72 100c6-3 13 0 12 5 0 3-4 2-7 1-4-1-7 2-9 0-1-2 1-5 4-6z'/%3E%3Cpath d='M86 112c3 0 5 2 4 5-2 2-5 1-6-1 0-2 0-4 2-4z'/%3E%3C/g%3E%3C/svg%3E"); --f36-pat-size: 150px; }
.v-pat-leopard .has-pat::before { opacity: .16; }
.v-pat-none .has-pat::before { content: none; }

/* Vurgu (başlık): renkli çıkartma şerit; bitişik noktalama içeride, sağa boşluk verilmez */
.f36-hl { background: var(--accent); color: var(--on-accent); padding: 0 .1em; margin: 0 -.02em; border-radius: .16em; -webkit-box-decoration-break: clone; box-decoration-break: clone; box-shadow: .06em .06em 0 var(--f36-ink); }
.fam-sokak .blk-hl { background: var(--accent); color: var(--on-accent); padding: 0 .1em; border-radius: .16em; -webkit-box-decoration-break: clone; box-decoration-break: clone; box-shadow: .06em .06em 0 var(--f36-ink); font-style: normal; }
:is(.f36-t-pop3, .f36-bg-pop3) .f36-hl { background: var(--primary); color: var(--on-primary); }
:is(.f36-t-ink, .f36-bg-ink, .f36-footer) .f36-hl { box-shadow: none; }

/* Düğmeler: konturlu çıkartma */
.fam-sokak .btn { border: var(--f36-bw) solid var(--f36-ink); box-shadow: var(--f36-sh-sm); font-weight: 700; letter-spacing: .005em; transition: transform .16s var(--ease), box-shadow .16s var(--ease), background .2s; }
.fam-sokak .btn:hover { transform: translate(-2px, -2px); box-shadow: 5px 5px 0 var(--f36-ink); }
.fam-sokak .btn:active { transform: translate(2px, 2px); box-shadow: 0 0 0 var(--f36-ink); }
.fam-sokak .btn-primary, .fam-sokak .btn-primary:hover { background: var(--primary); color: var(--on-primary); border-color: var(--f36-ink); }
.fam-sokak .btn-outline { background: var(--f36-card); color: var(--f36-ink); border-color: var(--f36-ink); }
.fam-sokak .btn-outline:hover { background: var(--accent); color: var(--on-accent); border-color: var(--f36-ink); }
.fam-sokak .btn-light, .fam-sokak .btn-white { background: var(--f36-card); color: var(--f36-ink); border-color: var(--f36-ink); }
.f36-btn-ink, .f36-btn-ink:hover { background: var(--dark); color: #fff; }
.f36-btn-paper, .f36-btn-paper:hover { background: var(--f36-card); color: var(--f36-ink); }
.f36-btn-pop2, .f36-btn-pop2:hover { background: var(--secondary); color: var(--on-secondary); }
.f36-btn-pop3, .f36-btn-pop3:hover { background: var(--accent); color: var(--on-accent); }
.f36-btn { padding: .82em 1.35em; font-size: .98rem; }
.f36-btn-mini { padding: .45em .85em !important; font-size: .8rem !important; box-shadow: 2px 2px 0 var(--f36-ink) !important; }
.f36-btns { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px; align-items: center; }
.f36-link { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: inherit; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.f36-link:hover { color: inherit; text-decoration-color: var(--primary); }
.f36-link.is-muted { opacity: .75; }

/* Çıkartma etiketi */
.f36-stk { display: inline-flex; align-items: center; gap: .35em; padding: .32em .8em; border: 2px solid var(--f36-ink); border-radius: 999px; font-weight: 700; font-size: .78rem; line-height: 1.2; box-shadow: 2px 2px 0 var(--f36-ink); transform: rotate(-3deg); white-space: nowrap; max-width: 100%; }
.f36-stk > span { overflow: hidden; text-overflow: ellipsis; }
.f36-stk.f36-t-ink { box-shadow: 2px 2px 0 var(--accent); }

/* Patlak rozet (starburst) */
.f36-burst { --bs: 132px; position: relative; display: inline-grid; place-items: center; width: var(--bs); height: var(--bs); flex-shrink: 0; color: var(--on-accent); }
.f36-burst svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; filter: drop-shadow(3px 3px 0 var(--f36-ink)); }
.f36-burst polygon { fill: var(--accent); stroke: var(--f36-ink); stroke-width: 2.6; stroke-linejoin: round; }
.f36-bt-pop { color: var(--on-primary); } .f36-bt-pop polygon { fill: var(--primary); }
.f36-bt-pop2 { color: var(--on-secondary); } .f36-bt-pop2 polygon { fill: var(--secondary); }
.f36-bt-ink { color: #fff; } .f36-bt-ink polygon { fill: var(--dark); }
.f36-bt-paper { color: var(--f36-ink); } .f36-bt-paper polygon { fill: var(--f36-card); }
.f36-burst-t { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; line-height: 1.05; padding: 20%; gap: 2px; }
.f36-burst-t b { font-family: var(--font-head); font-weight: 900; font-size: calc(var(--bs) * .17); letter-spacing: -.02em; white-space: nowrap; }
.f36-burst-t small { font-size: calc(var(--bs) * .085); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; line-height: 1.15; }

/* Bölüm başlığı */
.f36-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px 40px; margin-bottom: clamp(30px, 4vw, 48px); }
.f36-head.is-center { flex-direction: column; align-items: center; text-align: center; }
.f36-head-main { max-width: 780px; min-width: 0; }
.f36-eyebrow { margin: 0 0 16px; }
.f36-eyebrow span, .f36-hero-eb span { display: inline-block; padding: .38em .95em; border: 2px solid var(--f36-ink); border-radius: 999px; background: var(--accent); color: var(--on-accent); font-weight: 800; font-size: .76rem; letter-spacing: .09em; text-transform: uppercase; box-shadow: 2px 2px 0 var(--f36-ink); transform: rotate(-2deg); }
:is(.f36-bg-pop3, .f36-t-pop3) .f36-eyebrow span { background: var(--f36-card); color: var(--f36-ink); }
:is(.f36-bg-ink, .f36-t-ink) .f36-eyebrow span { box-shadow: 2px 2px 0 var(--accent); border-color: var(--accent); }
.f36-title { font-size: var(--f36-h2); line-height: 1.1; margin: 0; overflow-wrap: break-word; }
.f36-intro { margin: 16px 0 0; font-size: 1.05rem; max-width: 62ch; opacity: .88; }
.f36-more { display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0; padding: .6em 1.1em; border: var(--f36-bw) solid var(--f36-ink); border-radius: 999px; background: var(--f36-card); color: var(--f36-ink); font-weight: 700; font-size: .92rem; box-shadow: var(--f36-sh-sm); transition: transform .16s, box-shadow .16s; }
.f36-more:hover { color: var(--f36-ink); transform: translate(-2px, -2px); box-shadow: 5px 5px 0 var(--f36-ink); }
.f36-lede { font-size: 1.08rem; line-height: 1.7; margin: 0 0 6px; max-width: 62ch; }
.f36-checks { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 12px; }
.f36-checks li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 12px; align-items: start; }
.f36-checks i { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--accent); color: var(--on-accent); border: 2px solid var(--f36-ink); font-size: 16px; }
.f36-grid { display: grid; gap: 28px; }
.f36-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.f36-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* ================= HEADER ================= */
.f36-header { background: var(--header-bg, var(--bg)); color: var(--header-text, var(--f36-ink)); }
.f36-header .site-logo { color: inherit; }
.f36-logo .logo-mark { width: 46px; height: 46px; border-radius: 50%; background: var(--primary); color: var(--on-primary); border: var(--f36-bw) solid var(--f36-ink); box-shadow: 2px 2px 0 var(--f36-ink); transform: rotate(-8deg); font-size: 22px; }
.f36-logo .logo-text strong { font-family: var(--font-head); font-weight: 900; font-size: 1.12rem; letter-spacing: -.02em; line-height: 1.05; }
.f36-logo .logo-text small { color: inherit; opacity: .7; font-weight: 600; letter-spacing: .12em; font-size: .62rem; }
.f36-hbar { gap: 18px; }
.f36-hbar.container { max-width: calc(var(--container) + 120px); }
.f36-header--block .f36-hphone { display: none; }
.site-sekerkare .f36-header--block .f36-nav .nav-menu > li > a { text-transform: none; font-size: .9rem; letter-spacing: 0; }
.f36-nav .nav-menu { gap: 2px; }
.f36-nav .nav-menu > li > a { padding: 9px 12px; border-radius: 999px; font-weight: 700; font-size: .92rem; color: inherit; border: 2px solid transparent; white-space: nowrap; }
.f36-nav .nav-menu > li > a:hover, .f36-nav .nav-menu > li.is-active > a { color: var(--on-accent); background: var(--accent); border-color: var(--f36-ink); }
.f36-nav .nav-menu > li > a > i { font-size: 1rem; opacity: .7; }
.f36-nav .submenu { border: var(--f36-bw) solid var(--f36-ink); border-radius: 18px; box-shadow: var(--f36-sh); padding: 8px; background: var(--f36-card); }
.f36-nav .submenu a { font-weight: 600; color: var(--f36-ink) !important; border-radius: 10px; }
.f36-nav .submenu a:hover { background: var(--surface); color: var(--f36-ink) !important; }
.f36-actions { gap: 10px; }
.f36-ibtn { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; border: var(--f36-bw) solid var(--f36-ink); background: var(--f36-card); color: var(--f36-ink); font-size: 19px; box-shadow: 2px 2px 0 var(--f36-ink); flex-shrink: 0; }
.f36-ibtn:hover { background: var(--accent); color: var(--on-accent); }
.f36-hcta { background: var(--primary); color: var(--on-primary); padding: .62em 1.1em; font-size: .9rem; }
.f36-hcta:hover { color: var(--on-primary); }
.f36-header .lang-current { border: 2px solid var(--f36-ink); border-radius: 999px; padding: 6px 10px; background: var(--f36-card); color: var(--f36-ink); font-weight: 700; min-height: 40px; }
.f36-header .lang-menu { border: var(--f36-bw) solid var(--f36-ink); border-radius: 14px; box-shadow: var(--f36-sh); }
.f36-header .f36-acc { font-weight: 700; font-size: .85rem; color: inherit; }
.fam-sokak .f36-toggle { background: var(--accent); border: var(--f36-bw) solid var(--f36-ink); border-radius: 50%; box-shadow: 2px 2px 0 var(--f36-ink); }
.fam-sokak .f36-toggle span { background: var(--f36-ink); }
.f36-mnav { display: none; }

/* pill: yüzen çıkartma bar */
.f36-header--pill { background: transparent; padding: 12px 0 0; }
.f36-header--pill .f36-hwrap { padding: 0 16px; }
.f36-header--pill .f36-hbar { background: var(--header-bg, var(--f36-card)); border: var(--f36-bw) solid var(--f36-ink); border-radius: 999px; box-shadow: var(--f36-sh); padding: 0 12px 0 18px; min-height: 72px; max-width: calc(var(--container) + 16px); }
.f36-header--pill.is-scrolled { box-shadow: none; }
.f36-header--pill.is-scrolled .f36-hbar { box-shadow: var(--f36-sh-lg); }
.fam-sokak.v-header-pill { --f36-hh: 100px; }

/* tape: üst kayan bant + beyaz bar */
.f36-htop { display: flex; align-items: stretch; background: var(--dark); color: #fff; min-height: 40px; border-bottom: var(--f36-bw) solid var(--f36-ink); }
.f36-htop-tape { flex: 1; min-width: 0; overflow: hidden; display: flex; align-items: center; }
.f36-htop-tape .f36-tape { transform: none; width: 100%; margin: 0; border: 0; box-shadow: none; }
.f36-htop-tape .f36-tape-i { font-size: .74rem; padding: .62em 0; }
.f36-htop-r { display: flex; align-items: center; gap: 12px; padding: 0 16px; background: var(--dark); flex-shrink: 0; }
.f36-htop-ph { color: #fff; font-weight: 700; font-size: .85rem; display: inline-flex; align-items: center; gap: 6px; }
.f36-htop-ph:hover { color: var(--accent); }
.f36-htop .lang-current { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .5); min-height: 30px; padding: 3px 8px; }
.f36-htop .f36-acc { color: #fff; }
.f36-header--tape .f36-hwrap { background: var(--header-bg, var(--f36-card)); border-bottom: 3px solid var(--f36-ink); }
.f36-header--tape .f36-logo { background: var(--primary); color: var(--on-primary); border: var(--f36-bw) solid var(--f36-ink); border-radius: 16px; padding: 6px 14px 6px 8px; box-shadow: 3px 3px 0 var(--f36-ink); transform: rotate(-1.5deg); }
.f36-header--tape .f36-logo .logo-mark { background: var(--accent); color: var(--on-accent); }
.fam-sokak.v-header-tape { --f36-hh: 118px; }

/* block: ana renk bloğu */
.f36-header--block .f36-hwrap { background: var(--header-bg, var(--primary)); color: var(--header-text, var(--on-primary)); border-bottom: 3px solid var(--f36-ink); }
.f36-header--block .f36-hwrap { position: relative; isolation: isolate; }
.f36-header--block .f36-hwrap::before { content: ""; position: absolute; inset: 0; z-index: -1; background-color: currentColor; opacity: .08; -webkit-mask: var(--f36-pat) 0 0 / var(--f36-pat-size, 18px) var(--f36-pat-size, 18px) repeat; mask: var(--f36-pat) 0 0 / var(--f36-pat-size, 18px) var(--f36-pat-size, 18px) repeat; pointer-events: none; }
.f36-header--block .f36-logo { transform: rotate(-2deg); }
.f36-header--block .f36-logo .logo-mark { background: var(--accent); color: var(--on-accent); }
.f36-header--block .f36-nav .nav-menu > li > a { text-transform: uppercase; font-size: .82rem; letter-spacing: .02em; padding-inline: 10px; }
.f36-header--block .f36-hcta { background: var(--dark); color: #fff; box-shadow: 3px 3px 0 var(--accent); }
.f36-header--block .f36-hcta:hover { color: #fff; box-shadow: 5px 5px 0 var(--accent); }
.fam-sokak.v-header-block { --f36-hh: 80px; }

@media (max-width: 1240px) {
  .f36-mnav { display: grid; gap: 12px; margin-top: 22px; padding-top: 18px; border-top: 2px dashed rgba(0, 0, 0, .2); }
  .f36-mnav-row { display: flex; align-items: center; gap: 8px; margin: 0; color: #111; font-weight: 600; font-size: .92rem; }
  .f36-mnav .pf-lang-inline { display: flex; flex-wrap: wrap; gap: 6px; }
  .f36-mnav .pf-lang-inline a { padding: 6px 10px; border: 2px solid #111; border-radius: 999px; color: #111; font-weight: 700; font-size: .8rem; }
  .f36-mnav .pf-lang-inline a.is-active { background: var(--accent); color: var(--on-accent); }
  .fam-sokak .main-nav.f36-nav { background: var(--bg); border-left: 3px solid var(--f36-ink); }
  .f36-nav .nav-menu > li > a { border-radius: 0; border: 0; text-transform: none !important; font-size: 1rem !important; }
  .f36-nav .nav-menu > li > a:hover, .f36-nav .nav-menu > li.is-active > a { background: transparent; color: var(--primary) !important; }
  .f36-nav .submenu { border: 0; box-shadow: none; background: transparent; }
  .f36-hlang, .f36-header .f36-acc { display: none; }
  .f36-hcta span { display: none; }
  .f36-hcta { padding: 0; width: 44px; height: 44px; border-radius: 50%; }
  .f36-hcta i { font-size: 19px; }
}
@media (max-width: 760px) {
  .f36-header--pill { padding-top: 8px; }
  .f36-header--pill .f36-hwrap { padding: 0 10px; }
  .f36-header--pill .f36-hbar { min-height: 62px; padding: 0 8px 0 12px; }
  .f36-htop-ph span { display: none; }
  .f36-logo .logo-text small { display: none; }
  .f36-logo .logo-text strong { font-size: .98rem; }
  .f36-logo .logo-mark { width: 40px; height: 40px; font-size: 19px; }
  .f36-hphone { display: none; }
  .f36-header--tape .f36-logo { padding: 4px 10px 4px 6px; }
}
@media (max-width: 400px) { .f36-logo .logo-text strong { font-size: .86rem; } .f36-hcta { display: none; } }

/* ================= KAYAN BANT ================= */
.f36-tapes { padding: 30px 0; overflow: hidden; background: var(--bg); }
.f36-tapes.has-cross { padding: 46px 0; }
.f36-tapes.is-flat { padding: 0; }
.f36-tape-back { position: absolute; left: 0; right: 0; top: 50%; translate: 0 -50%; z-index: 0; }
.f36-tape { position: relative; z-index: 1; width: 104%; margin-left: -2%; border-block: 3px solid var(--f36-ink); overflow: hidden; }
.f36-tape.is-left { transform: rotate(-2deg); }
.f36-tape.is-right { transform: rotate(2deg); }
.f36-tape-back .f36-tape { opacity: .95; }
.f36-tape-track { display: flex; width: max-content; animation: f36-marquee var(--f36-speed, 36s) linear infinite; }
.f36-tape-run { display: flex; align-items: center; gap: 22px; padding-right: 22px; flex-shrink: 0; }
.f36-tape-i { font-family: var(--font-head); font-weight: 800; font-size: clamp(.92rem, 1.6vw, 1.2rem); text-transform: uppercase; letter-spacing: .02em; white-space: nowrap; padding: .6em 0; }
.f36-tape-sep { font-size: 1.15em; opacity: .9; }
.f36-tape:hover .f36-tape-track { animation-play-state: paused; }
@keyframes f36-marquee { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .f36-tape-track { animation: none; } }

/* ================= HERO ================= */
.f36-hero { position: relative; }
.f36-h1 { font-size: var(--f36-h1); line-height: 1.04; margin: 0 0 20px; overflow-wrap: break-word; color: inherit; }
.f36-hero-eb { margin: 0 0 20px; }
.f36-hero .f36-lede { font-size: clamp(1rem, 1.3vw, 1.14rem); opacity: .92; }
.f36-hstats { list-style: none; margin: 34px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.f36-hstats li { display: flex; flex-direction: column; padding: 10px 16px; border: 2px solid var(--f36-ink); border-radius: 16px; background: var(--f36-card); color: var(--f36-ink); box-shadow: 3px 3px 0 var(--f36-ink); min-width: 0; }
.f36-hstats li:nth-child(2) { transform: rotate(1.5deg); } .f36-hstats li:nth-child(3) { transform: rotate(-1.5deg); }
.f36-hstat-v { display: flex; align-items: baseline; gap: 3px; font-family: var(--font-head); line-height: 1.05; }
.f36-hstat-v b { font-size: 1.5rem; font-weight: 900; }
.f36-hstat-v small { font-size: .82rem; font-weight: 700; }
.f36-hstat-l { font-size: .78rem; font-weight: 600; opacity: .8; }

/* poster */
.f36-hero--poster { padding: clamp(40px, 6vw, 84px) 0 clamp(56px, 7vw, 96px); overflow: hidden; }
.f36-hp-in { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.f36-hp-art { position: relative; padding: 18px; }
.f36-hp-disc { margin: 0; aspect-ratio: 1; border-radius: 50%; overflow: hidden; border: 4px solid var(--f36-ink); box-shadow: 12px 12px 0 var(--f36-ink); background: var(--surface); max-width: 520px; margin-inline: auto; }
.f36-hp-disc img { width: 100%; height: 100%; object-fit: cover; }
.f36-hp-art .f36-hero-burst { --bs: clamp(118px, 13vw, 168px); position: absolute; top: -4px; left: -6px; transform: rotate(-12deg); }
.f36-hp-stk { position: absolute; inset: 0; pointer-events: none; }
.f36-hp-stk .f36-stk, .f36-hb-stk .f36-stk, .f36-hf-stk .f36-stk { position: absolute; font-size: .84rem; padding: .45em 1em; box-shadow: 3px 3px 0 var(--f36-ink); }
.f36-hp-stk .f36-hs-1 { right: 0; top: 18%; transform: rotate(6deg); }
.f36-hp-stk .f36-hs-2 { left: 4%; bottom: 14%; transform: rotate(-5deg); }
.f36-hp-stk .f36-hs-3 { right: 10%; bottom: 2%; transform: rotate(3deg); }

/* bento */
.f36-hero--bento { padding: clamp(24px, 3vw, 40px) 0 clamp(36px, 4vw, 56px); }
.f36-hb-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-areas: "main main photo photo" "s1 p1 p2 s2"; gap: 18px; }
.f36-hb-grid > * { border: 3px solid var(--f36-ink); border-radius: 28px; box-shadow: var(--f36-sh); min-width: 0; }
.f36-hb-main { grid-area: main; padding: clamp(28px, 4vw, 52px); display: flex; flex-direction: column; justify-content: center; }
.f36-hb-main .f36-h1 { font-size: clamp(2rem, 3.8vw, 3.3rem); }
.f36-hb-photo { grid-area: photo; margin: 0; position: relative; overflow: hidden; min-height: 380px; background: var(--surface); }
.f36-hb-photo > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.f36-hb-photo .f36-hero-burst { --bs: clamp(110px, 11vw, 150px); position: absolute; right: 16px; top: 16px; transform: rotate(10deg); }
.f36-hb-stk { position: absolute; left: 16px; bottom: 16px; display: flex; flex-wrap: wrap; gap: 8px; max-width: 70%; }
.f36-hb-stk .f36-stk { position: static !important; }
.f36-hb-stat { padding: 20px 22px; display: flex; flex-direction: column; justify-content: center; gap: 6px; }
.f36-hb-stat:first-of-type { grid-area: s1; }
.f36-hb-stat:nth-of-type(2) { grid-area: s2; }
.f36-hb-stat .f36-hstat-v b { font-size: clamp(2rem, 3.4vw, 2.9rem); }
.f36-hb-stat .f36-hstat-v small { font-size: 1rem; }
.f36-hb-stat .f36-hstat-l { font-size: .88rem; opacity: .9; }
.f36-hb-promo { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 14px; align-items: center; padding: 14px; transition: transform .16s, box-shadow .16s; }
.f36-hb-promo:first-of-type { grid-area: p1; }
.f36-hb-promo:nth-of-type(2) { grid-area: p2; }
a.f36-hb-promo:hover { transform: translate(-2px, -2px); box-shadow: var(--f36-sh-lg); }
a.f36-hb-promo.f36-t-ink:hover { color: #fff; } a.f36-hb-promo.f36-t-paper:hover { color: var(--f36-ink); }
.f36-hb-promo-img { width: 84px; height: 84px; border-radius: 50%; overflow: hidden; border: 2px solid currentColor; }
.f36-hb-promo-img img { width: 100%; height: 100%; object-fit: cover; }
.f36-hb-promo-t { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.f36-hb-promo-t strong { font-family: var(--font-head); font-size: 1.02rem; line-height: 1.15; }
.f36-hb-promo-t small { font-weight: 700; font-size: .82rem; opacity: .85; }

/* stack */
.f36-hero--stack { padding: clamp(40px, 6vw, 80px) 0 clamp(60px, 7vw, 100px); overflow: hidden; }
.f36-hk-in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(30px, 5vw, 64px); align-items: center; }
.f36-hk-deck { position: relative; min-height: 560px; }
.f36-hk-card { position: absolute; width: 60%; background: var(--f36-card); color: var(--f36-ink); border: 3px solid var(--f36-ink); border-radius: 24px; box-shadow: var(--f36-sh-lg); overflow: hidden; display: block; transition: transform .2s var(--ease); margin: 0; }
.f36-hk-c1 { left: 0; top: 0; transform: rotate(-6deg); z-index: 1; }
.f36-hk-c2 { right: 0; top: 14%; transform: rotate(5deg); z-index: 2; }
.f36-hk-c3 { left: 16%; bottom: 0; width: 64%; transform: rotate(-1.5deg); z-index: 3; }
.f36-hk-deck.is-single .f36-hk-c1 { width: 92%; left: 4%; }
a.f36-hk-card:hover { transform: rotate(0) translateY(-8px); z-index: 5; color: var(--f36-ink); }
.f36-hk-img { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--surface); }
.f36-hk-img img { width: 100%; height: 100%; object-fit: cover; }
.f36-hk-body { position: absolute; left: 12px; right: 12px; top: 12px; padding: 10px 14px; display: flex; flex-direction: column; gap: 3px; background: var(--f36-card); border: 2.5px solid var(--f36-ink); border-radius: 16px; box-shadow: 3px 3px 0 var(--f36-ink); }
.f36-hk-c3 .f36-hk-body { top: auto; bottom: 12px; }
.f36-hk-body strong { font-family: var(--font-head); font-size: 1rem; line-height: 1.15; }
.f36-hk-body small { font-size: .82rem; color: var(--muted); line-height: 1.4; display: none; }
.f36-hk-c3 .f36-hk-body small { display: block; }
.f36-hk-body em { font-style: normal; font-weight: 800; font-size: .8rem; color: var(--primary); }
.f36-hk-deck .f36-hero-burst { --bs: clamp(110px, 10vw, 140px); position: absolute; right: -4px; bottom: 8%; z-index: 4; transform: rotate(12deg); }

/* photo */
.f36-hero--photo { min-height: clamp(560px, 82vh, 780px); display: flex; flex-direction: column; justify-content: flex-end; color: #fff; overflow: hidden; isolation: isolate; border-bottom: 3px solid var(--f36-ink); }
.f36-hf-bg { position: absolute; inset: 0; z-index: -2; }
.f36-hf-bg img { width: 100%; height: 100%; object-fit: cover; }
.f36-hf-shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(0, 0, 0, .15) 0%, rgba(0, 0, 0, .05) 35%, rgba(0, 0, 0, .7) 100%); }
.f36-hf-in { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 30px; align-items: end; padding-top: 120px; padding-bottom: clamp(36px, 5vw, 60px); }
.f36-hf-text { max-width: 820px; }
.f36-hf-h1 { line-height: 1.32; }
.f36-hf-label { background: var(--dark); color: #fff; padding: .02em .22em; -webkit-box-decoration-break: clone; box-decoration-break: clone; border-radius: .12em; }
.f36-hf-label .f36-hl { box-shadow: none; }
.f36-hf-lede { display: inline-block; background: var(--f36-card); color: var(--f36-ink); border: var(--f36-bw) solid var(--f36-ink); border-radius: 18px; padding: 14px 18px; box-shadow: var(--f36-sh); max-width: 620px; transform: rotate(-.6deg); }
.f36-hf-lede .f36-lede { margin: 0; font-size: 1rem; }
.f36-hf-side { position: relative; display: flex; flex-direction: column; align-items: center; gap: 14px; padding-bottom: 20px; }
.f36-hf-side .f36-hero-burst { --bs: clamp(130px, 12vw, 176px); transform: rotate(-10deg); }
.f36-hf-stk { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.f36-hf-stk .f36-stk { position: static !important; }
.f36-hf-stats { padding-bottom: 28px; }
.f36-hf-stats .f36-hstats { margin: 0; }

/* ================= BLOKLAR ================= */
/* rakamlar */
.f36-stat-row { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 22px; }
.f36-stat-row li { border: 3px solid var(--f36-ink); border-radius: 24px; padding: 24px 22px; box-shadow: var(--f36-sh); display: flex; flex-direction: column; gap: 8px; }
.f36-stat-row li:nth-child(odd) { transform: rotate(-1.5deg); }
.f36-stat-row li:nth-child(even) { transform: rotate(1.2deg); }
.f36-stat-v { display: flex; align-items: baseline; gap: 4px; font-family: var(--font-head); line-height: 1; }
.f36-stat-v b { font-size: clamp(2.2rem, 4vw, 3.3rem); font-weight: 900; letter-spacing: -.03em; }
.f36-stat-v small { font-size: 1.05rem; font-weight: 800; }
.f36-stat-l { font-weight: 600; font-size: .95rem; opacity: .92; }

/* menü bloğu */
.f36-mtablist { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 30px; }
.f36-mtab { display: inline-flex; align-items: center; gap: 8px; padding: .62em 1.1em; border: var(--f36-bw) solid var(--f36-ink); border-radius: 999px; background: var(--f36-card); color: var(--f36-ink); font-weight: 700; font-size: .92rem; box-shadow: 2px 2px 0 var(--f36-ink); transition: transform .14s, background .2s; min-height: 44px; }
.f36-mtab:hover { transform: translate(-1px, -1px); background: var(--accent); color: var(--on-accent); }
.f36-mtab[aria-selected="true"] { background: var(--dark); color: #fff; box-shadow: 3px 3px 0 var(--accent); transform: rotate(-2deg); }
.f36-mpanel[hidden] { display: none; }
.f36-mnote { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 22px; font-weight: 700; font-size: .9rem; padding: 6px 14px; background: var(--surface); border: 2px dashed var(--f36-ink); border-radius: 999px; }
.f36-mgrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.f36-mpanel-foot { display: flex; flex-wrap: wrap; gap: 14px 26px; margin-top: 28px; }

/* menü öğesi kartı */
.f36-mi { position: relative; height: 100%; display: flex; flex-direction: column; background: var(--f36-card); color: var(--f36-ink); border: var(--f36-bw) solid var(--f36-ink); border-radius: var(--radius); box-shadow: var(--f36-sh); overflow: hidden; transition: transform .18s var(--ease), box-shadow .18s var(--ease); }
.f36-mi:hover { transform: translate(-3px, -3px); box-shadow: var(--f36-sh-lg); }
.f36-mi-media { position: relative; aspect-ratio: 5 / 4; overflow: hidden; border-bottom: var(--f36-bw) solid var(--f36-ink); background: var(--surface); }
.f36-mi-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.f36-mi:hover .f36-mi-media img { transform: scale(1.05); }
.f36-mi-ph { position: absolute; inset: 0; display: grid; place-items: center; font-size: 52px; color: var(--f36-ink); }
.f36-mi.no-img .f36-mi-media { background: var(--accent); isolation: isolate; }
.f36-mi.no-img.f36-tn-pop .f36-mi-media { background: var(--primary); }
.f36-mi.no-img.f36-tn-pop2 .f36-mi-media { background: var(--secondary); }
.f36-mi.no-img .f36-mi-media::before { content: ""; position: absolute; inset: 0; z-index: -1; background-color: #000; opacity: .12; -webkit-mask: var(--f36-pat) 0 0 / var(--f36-pat-size, 18px) var(--f36-pat-size, 18px) repeat; mask: var(--f36-pat) 0 0 / var(--f36-pat-size, 18px) var(--f36-pat-size, 18px) repeat; }
.f36-mi.no-img .f36-mi-ph i { width: 96px; height: 96px; display: grid; place-items: center; border-radius: 50%; background: var(--f36-card); border: var(--f36-bw) solid var(--f36-ink); box-shadow: 3px 3px 0 var(--f36-ink); transform: rotate(-8deg); font-size: 42px; }
.f36-mi-tags { position: absolute; left: 10px; top: 10px; max-width: calc(100% - 20px); }
.f36-mi-body { padding: 16px 16px 14px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.f36-mi-name { font-size: 1rem; line-height: 1.2; margin: 0; color: var(--f36-ink); }
.f36-mi-desc { margin: 0; font-size: .87rem; line-height: 1.5; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.f36-mi-alg { margin: 0; display: flex; gap: 5px; font-size: .74rem; color: var(--muted); align-items: flex-start; }
.f36-mi-alg i { color: var(--primary); }
.f36-mi-foot { margin-top: auto; padding-top: 8px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.f36-mi-price { display: inline-flex; align-items: baseline; gap: 6px; font-family: var(--font-head); }
.f36-mi-price b { background: var(--accent); color: var(--on-accent); border: 2px solid var(--f36-ink); border-radius: 10px; padding: 3px 9px; font-size: 1rem; font-weight: 800; box-shadow: 2px 2px 0 var(--f36-ink); transform: rotate(-2deg); display: inline-block; font-variant-numeric: tabular-nums; }
.f36-mi-price del { font-family: var(--font-body); font-size: .82rem; color: var(--muted); }
.f36-mi-price.is-multi { flex-direction: column; align-items: stretch; gap: 4px; width: 100%; font-family: var(--font-body); }
.f36-pv { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; font-size: .82rem; padding: 3px 0; border-bottom: 1.5px dashed rgba(0, 0, 0, .18); }
.f36-pv:last-child { border-bottom: 0; }
.f36-pv small { font-size: .8rem; font-weight: 600; min-width: 0; }
.f36-pv b { font-family: var(--font-head); font-weight: 800; font-size: .9rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.f36-mi-meta { display: inline-flex; flex-wrap: wrap; gap: 4px 10px; font-size: .74rem; color: var(--muted); }
.f36-mi-meta span { display: inline-flex; align-items: center; gap: 3px; }
.f36-mi.is-featured { box-shadow: 5px 5px 0 var(--primary); }
.f36-mi.is-featured:hover { box-shadow: 9px 9px 0 var(--primary); }

/* kart varyantı: block (renk bloğu kartlar) */
.v-cards-block .f36-mi, .v-cards-block .f36-clc, .v-cards-block .f36-card { padding: 10px; }
.v-cards-block .f36-mi-media, .v-cards-block .f36-clc .cl-card-media, .v-cards-block .f36-card-media { border: var(--f36-bw) solid var(--f36-ink); border-radius: calc(var(--radius) - 6px); }
.v-cards-block .f36-mi.f36-tn-pop, .v-cards-block .f36-clc.f36-tn-pop { background: var(--primary); color: var(--on-primary); }
.v-cards-block .f36-mi.f36-tn-pop2, .v-cards-block .f36-clc.f36-tn-pop2 { background: var(--secondary); color: var(--on-secondary); }
.v-cards-block .f36-mi.f36-tn-pop3, .v-cards-block .f36-clc.f36-tn-pop3 { background: var(--accent); color: var(--on-accent); }
.v-cards-block :is(.f36-mi, .f36-clc):is(.f36-tn-pop, .f36-tn-pop2, .f36-tn-pop3) :is(.f36-mi-name, .f36-mi-desc, .f36-mi-alg, .f36-mi-meta, .f36-mi-alg i, .cl-card-title a, .cl-card-title, .cl-card-excerpt, dt, dd) { color: inherit; }
.v-cards-block :is(.f36-mi, .f36-clc):is(.f36-tn-pop, .f36-tn-pop2, .f36-tn-pop3) :is(.f36-mi-desc, .f36-mi-meta, .cl-card-excerpt) { opacity: .88; }
.v-cards-block .f36-mi.f36-tn-pop3 .f36-mi-price b { background: var(--f36-card); color: var(--f36-ink); }
.v-cards-block .f36-mi:nth-child(3n+1), .v-cards-block .f36-mcell:nth-child(3n+1) .f36-mi { transform: rotate(-.8deg); }
.v-cards-block .f36-mi:nth-child(3n+2), .v-cards-block .f36-mcell:nth-child(3n+2) .f36-mi { transform: rotate(.7deg); }
.v-cards-block .f36-mi:hover, .v-cards-block .f36-mcell .f36-mi:hover { transform: rotate(0) translate(-3px, -3px); }
.v-cards-block .f36-card { background: var(--surface); }
.v-cards-block .f36-pv { border-bottom-color: rgba(0, 0, 0, .2); }

/* koleksiyon kartları */
.fam-sokak .cl-card { background: var(--f36-card); border: var(--f36-bw) solid var(--f36-ink); border-radius: var(--radius); box-shadow: var(--f36-sh); overflow: visible; }
.fam-sokak .cl-card:hover { transform: translate(-3px, -3px); box-shadow: var(--f36-sh-lg); border-color: var(--f36-ink); }
.fam-sokak .cl-card-media { border-bottom: var(--f36-bw) solid var(--f36-ink); border-radius: calc(var(--radius) - 3px) calc(var(--radius) - 3px) 0 0; overflow: hidden; position: relative; }
.fam-sokak .cl-card-media .f36-clc-burst { position: absolute; right: 8px; bottom: 8px; --bs: 96px; transform: rotate(10deg); }
.fam-sokak .cl-card-btn, .fam-sokak .cl-card-btn:hover { background: var(--f36-card); color: var(--f36-ink); border-color: var(--f36-ink); }
.fam-sokak .cl-grid-cards-wide .cl-card-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fam-sokak .cl-grid-cards-wide .cl-card-media { flex-basis: 42%; border-bottom: 0; border-right: var(--f36-bw) solid var(--f36-ink); }
.v-cards-block .cl-grid-cards-wide .cl-card-media { border-right-width: var(--f36-bw); }
.fam-sokak .cl-card-media .f36-clc-burst .f36-burst-t b { font-size: .92rem; }
.fam-sokak .cl-badge { background: var(--f36-card); color: var(--f36-ink); border: 2px solid var(--f36-ink); border-radius: 999px; font-weight: 700; box-shadow: 2px 2px 0 var(--f36-ink); }
.fam-sokak .cl-card-title { font-size: 1.08rem; line-height: 1.2; }
.fam-sokak .cl-card-body { min-width: 0; }
.fam-sokak .cl-card-foot { flex-wrap: wrap; gap: 8px; min-width: 0; }
.fam-sokak .cl-card-actions { flex-wrap: wrap; min-width: 0; margin-left: auto; }
@media (max-width: 991px) { .fam-sokak .cl-grid-list .cl-card-media { flex-basis: 200px; } }
.fam-sokak .tl-out-v { overflow-wrap: break-word; max-width: 100%; }
.fam-sokak .cl-card-title a { color: inherit; }
.fam-sokak .cl-card-fields { gap: 0 14px; }
.fam-sokak .cl-card-fields { border-top: 1.5px dashed rgba(0, 0, 0, .2); padding-top: 10px; }
.fam-sokak .cl-cf { border: 0; border-radius: 0; padding: 2px 0; background: none; }
.fam-sokak .cl-cf dt { font-size: .68rem; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; opacity: .7; color: inherit; }
.fam-sokak .cl-cf dd { font-weight: 600; }
.fam-sokak .cl-cf .cl-chip { border: 1.5px solid var(--f36-ink); background: var(--f36-card); color: var(--f36-ink); font-weight: 700; }
.v-cards-block .f36-clc:is(.f36-tn-pop, .f36-tn-pop2, .f36-tn-pop3) .cl-card-fields { border-top-color: rgba(0, 0, 0, .3); }
.fam-sokak .cl-card-price { font-family: var(--font-head); font-weight: 800; }
.f36-clc-save { display: inline-flex; align-self: flex-start; align-items: center; gap: 8px; margin: 0 0 4px; padding: 4px 10px; border: 2px solid var(--f36-ink); border-radius: 999px; background: var(--dark); color: #fff; font-size: .78rem; font-weight: 700; transform: rotate(-2deg); }
.f36-clc-save b { color: var(--accent); font-family: var(--font-head); }
.f36-clc-save b * { color: inherit !important; }
.fam-sokak .cl-cmp-toggle span { border: 2px solid var(--f36-ink); border-radius: 999px; }
.fam-sokak .cl-card-list .cl-card-media { border-bottom: 0; border-right: var(--f36-bw) solid var(--f36-ink); border-radius: calc(var(--radius) - 3px) 0 0 calc(var(--radius) - 3px); }
.fam-sokak .cl-table-wrap { border: var(--f36-bw) solid var(--f36-ink); border-radius: var(--radius); box-shadow: var(--f36-sh); background: var(--f36-card); }
.fam-sokak .cl-table thead th { background: var(--dark); color: #fff; }

/* hikâye */
.f36-about-in { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: clamp(36px, 6vw, 88px); align-items: center; }
.f36-img-right .f36-about-media { order: 2; }
.f36-about-in.no-img { grid-template-columns: minmax(0, 1fr); max-width: 820px; }
.f36-about-media { position: relative; padding: 0 0 30px; }
.f36-frame { margin: 0; border: 3px solid var(--f36-ink); border-radius: 30px; overflow: hidden; box-shadow: var(--f36-sh-lg); transform: rotate(-2deg); aspect-ratio: 5 / 4; background: var(--surface); }
.f36-frame img { width: 100%; height: 100%; object-fit: cover; }
.f36-about-burst { position: absolute; right: -12px; bottom: -6px; --bs: 140px; transform: rotate(8deg); }
.f36-about-text .f36-head { margin-bottom: 20px; }

/* öne çıkan */
.f36-hl-in { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(32px, 5vw, 72px); align-items: center; }
.f36-hl-in.no-img { grid-template-columns: minmax(0, 1fr); }
.f36-hl-media { position: relative; margin: 0; border: 3px solid var(--f36-ink); border-radius: 30px; overflow: visible; box-shadow: var(--f36-sh-lg); transform: rotate(1.5deg); aspect-ratio: 4 / 3; background: var(--surface); }
.f36-hl-media img { width: 100%; height: 100%; object-fit: cover; border-radius: 27px; }
.f36-hl-stk { position: absolute; left: -12px; top: 22px; font-size: .9rem; padding: .5em 1.05em; }
.f36-hl-text .f36-head { margin-bottom: 18px; }

/* özellikler */
.f36-feat-grid { display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 22px; }
.f36-feat { border: 3px solid var(--f36-ink); border-radius: 24px; padding: 26px 22px; box-shadow: var(--f36-sh); }
.f36-feat:nth-child(even) { transform: translateY(18px); }
.f36-feat-ico { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; background: var(--f36-card); color: var(--f36-ink); border: 2.5px solid var(--f36-ink); font-size: 24px; margin-bottom: 16px; }
.f36-feat h3 { font-size: 1.08rem; margin: 0 0 8px; line-height: 1.2; }
.f36-feat p { margin: 0; font-size: .93rem; opacity: .92; }

/* süreç */
.f36-steps-row { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 22px; position: relative; }
.f36-steps-row::before { content: ""; position: absolute; left: 30px; right: 30px; top: 32px; border-top: 3px dashed var(--f36-ink); opacity: .55; }
.f36-steps-row li { position: relative; display: flex; flex-direction: column; gap: 16px; }
.f36-step-n { position: relative; width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; border: 3px solid var(--f36-ink); box-shadow: 3px 3px 0 var(--f36-ink); font-family: var(--font-head); font-weight: 900; font-size: 1.2rem; }
.f36-steps-row li:nth-child(even) .f36-step-n { transform: rotate(8deg); }
.f36-step-b { background: var(--f36-card); color: var(--f36-ink); border: var(--f36-bw) solid var(--f36-ink); border-radius: 20px; padding: 18px; box-shadow: var(--f36-sh-sm); flex: 1; }
.f36-step-b h3 { font-size: 1rem; margin: 0 0 6px; display: flex; gap: 8px; align-items: flex-start; line-height: 1.25; color: var(--f36-ink) !important; }
.f36-step-b h3 i { color: var(--primary); font-size: 1.15em; }
.f36-step-b p { margin: 0; font-size: .9rem; color: var(--muted) !important; }

/* araç vitrini */
.f36-tool-in { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(28px, 5vw, 64px); align-items: start; }
.f36-tool-side .f36-head { margin-bottom: 18px; }
.f36-tool-media { margin: 22px 0 0; border: 3px solid var(--f36-ink); border-radius: 24px; overflow: hidden; box-shadow: var(--f36-sh); transform: rotate(-1.5deg); aspect-ratio: 16 / 10; }
.f36-tool-media img { width: 100%; height: 100%; object-fit: cover; }
.f36-tool-help { display: inline-flex; align-items: center; gap: 12px; margin-top: 24px; padding: 10px 16px 10px 10px; background: var(--f36-card); color: var(--f36-ink) !important; border: var(--f36-bw) solid var(--f36-ink); border-radius: 999px; box-shadow: var(--f36-sh-sm); }
.f36-tool-help i { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--dark); color: #fff; font-size: 18px; }
.f36-tool-help span { display: flex; flex-direction: column; line-height: 1.2; }
.f36-tool-help small { font-size: .74rem; opacity: .8; }
.f36-tool.is-wide .f36-tool-top { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 24px 48px; align-items: end; margin-bottom: 34px; }
.f36-tool.is-wide .f36-tool-top .f36-head { margin: 0; }
.f36-tool.is-wide .f36-tool-top .f36-checks { margin: 0; }

/* araç kutusu (çekirdek) — çıkartma kart */
.fam-sokak .tl-box { background: var(--f36-card); color: var(--text); border: 3px solid var(--f36-ink); border-radius: calc(var(--radius) + 6px); box-shadow: var(--f36-sh-lg); --tl-line: rgba(0, 0, 0, .16); }
.fam-sokak .tl-box :is(h2, h3, h4, label, strong) { color: var(--f36-ink); }
.fam-sokak .tl-ico { background: var(--accent); color: var(--on-accent); border: 2px solid var(--f36-ink); border-radius: 50%; }
.fam-sokak .tl-out.is-hl { background: var(--dark); color: #fff; border: 2px solid var(--f36-ink); border-radius: 16px; }
.fam-sokak .tl-out.is-hl * { color: inherit; }
.fam-sokak .tl-opt { border: 2px solid var(--f36-ink); border-radius: 14px; }
.fam-sokak .tl-opt:hover, .fam-sokak .tl-opt.is-on, .fam-sokak .tl-opt:has(input:checked) { background: var(--accent); color: var(--on-accent); }
.fam-sokak .tl-result-band { border: 2px solid var(--f36-ink); border-radius: 16px; }
.fam-sokak .tl-card { border: var(--f36-bw) solid var(--f36-ink); border-radius: var(--radius); box-shadow: var(--f36-sh); background: var(--f36-card); }
.fam-sokak .tl-card:hover { transform: translate(-3px, -3px); box-shadow: var(--f36-sh-lg); }
.fam-sokak .tl-pl-row { border-radius: 14px; }
.fam-sokak .tl-pl-row.is-on { background: color-mix(in srgb, var(--accent) 30%, #fff); outline: 2px solid var(--f36-ink); }
.fam-sokak .tl-pl-gt { font-family: var(--font-head); }
.fam-sokak .tl-pl-sum { background: var(--dark); color: #fff; border-radius: 18px; border: 2px solid var(--f36-ink); }
.fam-sokak .tl-pl-sum :is(h3, h4, strong, b, span, small, p) { color: inherit; }

/* kampanya kartları */
.f36-promo-grid { display: grid; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); gap: 26px; }
.f36-promo { display: flex; flex-direction: column; border: 3px solid var(--f36-ink); border-radius: 26px; overflow: hidden; box-shadow: var(--f36-sh); transition: transform .18s, box-shadow .18s; }
.f36-promo:nth-child(2) { transform: rotate(1.2deg); }
.f36-promo:nth-child(3) { transform: rotate(-1deg); }
a.f36-promo:hover { transform: translate(-3px, -3px); box-shadow: var(--f36-sh-lg); }
.f36-promo.f36-t-pop:hover { color: var(--on-primary); } .f36-promo.f36-t-pop2:hover { color: var(--on-secondary); } .f36-promo.f36-t-pop3:hover { color: var(--on-accent); }
.f36-promo-img { display: block; aspect-ratio: 16 / 10; overflow: hidden; border-bottom: 3px solid var(--f36-ink); }
.f36-promo-img img { width: 100%; height: 100%; object-fit: cover; }
.f36-promo-b { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.f36-promo-b strong { font-family: var(--font-head); font-size: 1.2rem; line-height: 1.15; }
.f36-promo-b small { font-size: .92rem; opacity: .9; line-height: 1.5; }
.f36-promo-b em { margin-top: auto; padding-top: 8px; font-style: normal; font-weight: 800; display: inline-flex; align-items: center; gap: 6px; }

/* etkinlik biletleri */
.f36-tix { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; }
.f36-tik { display: grid; grid-template-columns: 86px minmax(0, 1fr); background: var(--f36-card); color: var(--f36-ink); border: 3px solid var(--f36-edge); border-radius: 22px; box-shadow: var(--f36-sh); overflow: hidden; transition: transform .18s, box-shadow .18s; }
.f36-tik:hover { color: var(--f36-ink); transform: translate(-3px, -3px); box-shadow: var(--f36-sh-lg); }
.f36-tik-date { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 14px 6px; border-right: 3px dashed var(--f36-ink); text-align: center; }
.f36-tik-date b { font-family: var(--font-head); font-size: 2.2rem; font-weight: 900; line-height: 1; }
.f36-tik-date small { font-weight: 800; text-transform: uppercase; font-size: .8rem; }
.f36-tik-date em { font-style: normal; font-size: .7rem; opacity: .85; }
.f36-tik-body { display: flex; flex-direction: column; gap: 6px; padding: 0 16px 16px; min-width: 0; }
.f36-tik-img { display: block; margin: 0 -16px 8px; aspect-ratio: 16 / 8; overflow: hidden; border-bottom: 2px solid var(--f36-ink); }
.f36-tik-img img { width: 100%; height: 100%; object-fit: cover; }
.f36-tik-body:not(:has(.f36-tik-img)) { padding-top: 16px; }
.f36-tik-cat { font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: var(--primary); }
.f36-tik-body strong { font-family: var(--font-head); font-size: 1.04rem; line-height: 1.2; }
.f36-tik-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: .84rem; color: var(--muted); }
.f36-tik-meta span { display: inline-flex; gap: 4px; align-items: center; }
.f36-tik-go { margin-top: auto; padding-top: 8px; font-style: normal; font-weight: 800; font-size: .86rem; display: inline-flex; gap: 6px; align-items: center; }

/* galeri */
.f36-snaps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 26px; padding: 10px 6px; }
.f36-snap { position: relative; display: block; background: var(--f36-card); padding: 10px 10px 36px; border: var(--f36-bw) solid var(--f36-ink); border-radius: 6px; box-shadow: var(--f36-sh); transition: transform .2s var(--ease); }
.f36-snap:nth-child(4n+1) { transform: rotate(-3deg); }
.f36-snap:nth-child(4n+2) { transform: rotate(2deg); }
.f36-snap:nth-child(4n+3) { transform: rotate(-1deg); }
.f36-snap:nth-child(4n) { transform: rotate(3deg); }
.f36-snap::before { content: ""; position: absolute; top: -12px; left: 50%; width: 74px; height: 24px; margin-left: -37px; background: var(--accent); opacity: .85; border: 1.5px solid rgba(0, 0, 0, .25); transform: rotate(-4deg); z-index: 1; }
.f36-snap:hover { transform: rotate(0) scale(1.03); z-index: 2; }
.f36-snap img { width: 100%; aspect-ratio: 1; object-fit: cover; border: 1.5px solid var(--f36-ink); }
.f36-snaps-ig { margin: 30px 0 0; text-align: center; font-weight: 800; }
.f36-snaps-ig a { color: inherit; display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; background: var(--f36-card); color: var(--f36-ink); border: 2px solid var(--f36-ink); border-radius: 999px; box-shadow: 3px 3px 0 var(--f36-ink); }

/* ekip */
.f36-crew { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 26px; }
.f36-crew-i { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; color: inherit; }
.f36-crew-ph { width: min(200px, 100%); aspect-ratio: 1; border-radius: 50%; overflow: hidden; border: 3px solid var(--f36-ink); box-shadow: var(--f36-sh); display: grid; place-items: center; font-size: 54px; margin-bottom: 12px; transition: transform .2s; }
.f36-crew-ph img { width: 100%; height: 100%; object-fit: cover; }
.f36-crew-i:hover .f36-crew-ph { transform: rotate(-4deg) scale(1.03); }
.f36-crew-i strong { font-family: var(--font-head); font-size: 1rem; }
.f36-crew-i small { opacity: .8; font-size: .86rem; }

/* paketler (çekirdek sh-pkg) */
.f36-pk-group + .f36-pk-group { margin-top: 40px; }
.f36-pk-gt { font-size: 1.2rem; margin: 0 0 18px; }
.fam-sokak .sh-pkg { background: var(--f36-card); color: var(--text); border: 3px solid var(--f36-ink); border-radius: 24px; box-shadow: var(--f36-sh); }
.fam-sokak .sh-pkg:hover { transform: translate(-3px, -3px); box-shadow: var(--f36-sh-lg); }
.fam-sokak .sh-pkg.is-popular { box-shadow: 7px 7px 0 var(--accent), 7px 7px 0 2.5px var(--f36-ink); }
.fam-sokak .sh-pkg :is(h3, h4, strong) { color: var(--f36-ink); }
.fam-sokak .sh-pkg-ribbon { background: var(--accent); color: var(--on-accent); border: 2px solid var(--f36-ink); box-shadow: 2px 2px 0 var(--f36-ink); }
.fam-sokak .sh-pkg-icon { background: var(--accent); color: var(--on-accent); border: 2px solid var(--f36-ink); border-radius: 50%; }
.fam-sokak .sh-pkg-price { border-color: rgba(0, 0, 0, .2); }

/* yorumlar */
.f36-rev-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; }
.f36-car-nav { display: flex; gap: 10px; margin-bottom: clamp(30px, 4vw, 48px); }
.f36-car-btn { width: 50px; height: 50px; border-radius: 50%; border: var(--f36-bw) solid var(--f36-ink); background: var(--f36-card); color: var(--f36-ink); font-size: 20px; box-shadow: 3px 3px 0 var(--f36-ink); display: grid; place-items: center; }
.f36-car-btn:hover { background: var(--accent); color: var(--on-accent); }
.f36-rev-track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 2 * 26px) / 3); gap: 26px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 6px 12px 34px 4px; scrollbar-width: none; }
.f36-rev-track::-webkit-scrollbar { display: none; }
.f36-rev { position: relative; margin: 0 0 24px; scroll-snap-align: start; border: 3px solid var(--f36-ink); border-radius: 26px; padding: 24px 24px 20px; box-shadow: var(--f36-sh); display: flex; flex-direction: column; gap: 14px; }
.f36-rev::after { content: ""; position: absolute; left: 36px; bottom: -15px; width: 26px; height: 26px; background: inherit; border-right: 3px solid var(--f36-ink); border-bottom: 3px solid var(--f36-ink); transform: rotate(45deg) skew(8deg, 8deg); }
.f36-rev blockquote { margin: 0; font-size: .98rem; line-height: 1.6; flex: 1; }
.f36-stars { display: flex; gap: 2px; color: var(--primary); font-size: 1rem; }
.f36-rev.f36-t-pop3 .f36-stars, .f36-rev.f36-t-pop2 .f36-stars { color: inherit; }
.f36-rev figcaption { display: flex; align-items: center; gap: 12px; }
.f36-rev-av { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; border: 2px solid var(--f36-ink); flex-shrink: 0; }
.f36-rev-av.is-init { display: grid; place-items: center; background: var(--dark); color: #fff; font-family: var(--font-head); font-weight: 800; }
.f36-rev figcaption span { display: flex; flex-direction: column; line-height: 1.25; }
.f36-rev figcaption small { opacity: .8; font-size: .8rem; }

/* blog / hizmet kartı */
.f36-card { background: var(--f36-card); color: var(--f36-ink); border: var(--f36-bw) solid var(--f36-ink) !important; border-radius: var(--radius); box-shadow: var(--f36-sh); overflow: hidden; }
.f36-card:hover { transform: translate(-3px, -3px); box-shadow: var(--f36-sh-lg); }
.f36-card-media { border-bottom: var(--f36-bw) solid var(--f36-ink); position: relative; }
.f36-card-tag { position: absolute; left: 12px; top: 12px; padding: 4px 10px; background: var(--accent); color: var(--on-accent); border: 2px solid var(--f36-ink); border-radius: 999px; font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; transform: rotate(-3deg); box-shadow: 2px 2px 0 var(--f36-ink); }
.f36-card-date { font-size: .8rem; font-weight: 700; color: var(--muted); }
.f36-card-title { font-size: 1.08rem; line-height: 1.25; }
.f36-card-title a { color: var(--f36-ink); }
.f36-card .card-text { color: var(--muted); }
.f36-card .f36-link { margin-top: auto; padding-top: 6px; color: var(--f36-ink); }
.f36-svc-ico { position: absolute; left: 14px; bottom: -22px; width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: var(--accent); color: var(--on-accent); border: 2.5px solid var(--f36-ink); font-size: 24px; box-shadow: 2px 2px 0 var(--f36-ink); }
.f36-svc .card-media { overflow: visible; }
.f36-svc .card-media img { border-radius: calc(var(--radius) - 3px) calc(var(--radius) - 3px) 0 0; }
.f36-svc .card-body { padding-top: 34px; }

/* SSS */
.f36-faq-in { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(30px, 5vw, 70px); align-items: start; }
.f36-faq-help { border: 3px solid var(--f36-ink); border-radius: 24px; padding: 24px; box-shadow: var(--f36-sh); transform: rotate(-1.2deg); }
.f36-faq-help strong { font-family: var(--font-head); font-size: 1.2rem; display: block; margin-bottom: 6px; }
.f36-faq-help p { margin: 0; }
.f36-faq-help .f36-btns { margin-top: 18px; }
.fam-sokak .faq-list { gap: 14px; }
.fam-sokak .faq-item { border: var(--f36-bw) solid var(--f36-ink); border-radius: 18px; background: var(--f36-card); box-shadow: var(--f36-sh-sm); }
.fam-sokak .faq-item summary { color: var(--f36-ink); }
.fam-sokak .faq-item summary i { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--accent); color: var(--on-accent); border: 2px solid var(--f36-ink); font-size: 18px; }
.fam-sokak .faq-item[open] { border-color: var(--f36-ink); box-shadow: 5px 5px 0 var(--primary); }
.fam-sokak .faq-answer { color: var(--text); }

/* şubeler */
.f36-shops { display: grid; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); gap: 26px; }
.f36-shop { display: flex; flex-direction: column; background: var(--f36-card); color: var(--f36-ink); border: 3px solid var(--f36-ink); border-radius: 26px; box-shadow: var(--f36-sh); overflow: hidden; transition: transform .18s, box-shadow .18s; }
.f36-shop:hover { color: var(--f36-ink); transform: translate(-3px, -3px); box-shadow: var(--f36-sh-lg); }
.f36-shop-img { display: block; aspect-ratio: 16 / 10; overflow: hidden; border-bottom: 3px solid var(--f36-ink); }
.f36-shop-img img { width: 100%; height: 100%; object-fit: cover; }
.f36-shop-b { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 26px 20px 20px; }
.f36-shop-b .f36-stk { position: absolute; top: -16px; left: 16px; }
.f36-shop-b strong { font-family: var(--font-head); font-size: 1.12rem; line-height: 1.2; }
.f36-shop-b small { color: var(--muted); font-size: .88rem; }
.f36-shop-h { display: inline-flex; gap: 6px; align-items: flex-start; font-size: .84rem; font-weight: 600; margin-top: 4px; }
.f36-br-map { border: 3px solid var(--f36-ink); border-radius: 26px; overflow: hidden; box-shadow: var(--f36-sh); background: var(--surface); }
.f36-br-map.is-wide { margin-top: 30px; }
.f36-br-split { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 28px; align-items: stretch; }
.f36-br-split.no-map { grid-template-columns: minmax(0, 1fr); }
.f36-br-side { background: var(--f36-card); color: var(--f36-ink); border: 3px solid var(--f36-ink); border-radius: 26px; box-shadow: var(--f36-sh); padding: 22px; display: flex; flex-direction: column; min-width: 0; }
.f36-br-count { display: flex; align-items: baseline; gap: 10px; margin: 0 0 14px; }
.f36-br-count b { font-family: var(--font-head); font-size: 3rem; font-weight: 900; line-height: 1; color: var(--primary); }
.f36-br-count span { font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.f36-br-list { list-style: none; margin: 0; padding: 0; overflow-y: auto; max-height: 440px; }
.f36-br-list a { display: grid; grid-template-columns: 16px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 11px 4px; border-bottom: 2px dashed rgba(0, 0, 0, .14); color: var(--f36-ink); }
.f36-br-list li:last-child a { border-bottom: 0; }
.f36-br-list a:hover { color: var(--primary); }
.f36-br-dot { width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--f36-ink); }
.f36-br-list strong { display: block; font-size: .96rem; }
.f36-br-list small { color: var(--muted); font-size: .82rem; }

/* CTA */
.f36-cta { padding: clamp(56px, 7vw, 96px) 0; }
.f36-cta-in { display: grid; grid-template-columns: minmax(0, 1fr); gap: 34px; align-items: center; padding: clamp(32px, 5vw, 64px); border: 3px solid var(--f36-ink); border-radius: 36px; box-shadow: var(--f36-sh-lg); }
.f36-cta-in.has-img, .f36-cta-in:has(.f36-cta-art) { grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); }
.f36-cta-text h2 { font-size: clamp(1.9rem, 4vw, 3.3rem); line-height: 1.05; margin: 0 0 14px; }
.f36-cta-text p { font-size: 1.08rem; max-width: 56ch; margin: 0; opacity: .95; }
.f36-cta-art { position: relative; display: grid; place-items: center; }
.f36-cta-disc { margin: 0; width: min(300px, 100%); aspect-ratio: 1; border-radius: 50%; overflow: hidden; border: 3px solid var(--f36-ink); box-shadow: var(--f36-sh); transform: rotate(4deg); }
.f36-cta-disc img { width: 100%; height: 100%; object-fit: cover; }
.f36-cta-burst { position: absolute; left: -10px; top: -14px; --bs: 120px; transform: rotate(-12deg); }

/* ================= SAYFA BAŞLIĞI ================= */
.fam-sokak .page-hero.f36-ph { padding: clamp(40px, 6vw, 76px) 0; border-bottom: 3px solid var(--f36-ink); overflow: hidden; }
.f36-ph-in { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 30px; align-items: center; }
.f36-ph .page-title { color: inherit; font-size: clamp(2rem, 4.6vw, 3.5rem); line-height: 1.05; margin: 14px 0 12px; }
.f36-ph .page-subtitle { color: inherit; opacity: .92; font-size: 1.06rem; }
.f36-ph .breadcrumb ol { display: inline-flex; background: var(--f36-card); color: var(--f36-ink); border: 2px solid var(--f36-ink); border-radius: 999px; padding: 5px 14px; box-shadow: 2px 2px 0 var(--f36-ink); font-weight: 600; font-size: .82rem; }
.f36-ph .breadcrumb li, .f36-ph .breadcrumb a { color: var(--f36-ink); }
.f36-ph .breadcrumb a:hover { color: var(--primary); }
.f36-ph-disc { margin: 0; width: clamp(150px, 20vw, 250px); aspect-ratio: 1; border-radius: 50%; overflow: hidden; border: 3px solid var(--f36-ink); box-shadow: var(--f36-sh-lg); transform: rotate(5deg); }
.f36-ph-disc img { width: 100%; height: 100%; object-fit: cover; }
.f36-ph-badge { width: clamp(96px, 12vw, 150px); aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; background: var(--accent); color: var(--on-accent); border: 3px solid var(--f36-ink); box-shadow: var(--f36-sh); font-size: clamp(40px, 5vw, 64px); transform: rotate(-10deg); }
.f36-t-pop3 .f36-ph-badge { background: var(--f36-card); color: var(--f36-ink); }

/* ================= MENÜ SAYFASI ================= */
.f36-menu-page { padding-top: 0; }
.f36-mbar { position: sticky; top: var(--f36-hh); z-index: 40; background: var(--bg); border-bottom: 3px solid var(--f36-ink); margin-bottom: 40px; }
html.bkb-on:not(.bkb-min) .f36-mbar { top: calc(var(--f36-hh) + 38px); }
.f36-mbar-in { display: flex; align-items: center; gap: 16px; padding-top: 12px; padding-bottom: 12px; }
.f36-mbar-nav { flex: 1; min-width: 0; display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; padding: 4px 4px 6px; }
.f36-mbar-nav::-webkit-scrollbar { display: none; }
.f36-mchip { display: inline-flex; align-items: center; gap: 7px; flex-shrink: 0; padding: .5em 1em; border: 2px solid var(--f36-ink); border-radius: 999px; background: var(--f36-card); color: var(--f36-ink); font-weight: 700; font-size: .88rem; box-shadow: 2px 2px 0 var(--f36-ink); white-space: nowrap; min-height: 42px; }
.f36-mchip:hover { color: var(--on-accent); background: var(--accent); }
.f36-mchip.is-active { background: var(--dark); color: #fff; box-shadow: 2px 2px 0 var(--accent); }
.f36-mchip b { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 5px; border-radius: 999px; background: var(--accent); color: var(--on-accent); font-size: .7rem; border: 1.5px solid var(--f36-ink); }
.f36-msearch { position: relative; flex: 0 0 240px; }
.f36-msearch i { position: absolute; left: 14px; top: 50%; translate: 0 -50%; color: var(--f36-ink); }
.f36-msearch input { width: 100%; padding: 10px 14px 10px 38px; border: 2px solid var(--f36-ink); border-radius: 999px; background: var(--f36-card); font-weight: 600; min-height: 44px; }
.f36-mempty { text-align: center; font-weight: 700; padding: 30px 0; }
.f36-mgroup { margin-bottom: 64px; scroll-margin-top: calc(var(--f36-hh) + 90px); }
.f36-mgroup[hidden], .f36-mcell[hidden] { display: none; }
.f36-mgroup-head { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; padding: 18px 22px; border: 3px solid var(--f36-ink); border-radius: 24px; box-shadow: var(--f36-sh); margin-bottom: 28px; }
.f36-mgroup-ico { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: var(--f36-card); color: var(--f36-ink); border: 2.5px solid var(--f36-ink); font-size: 26px; flex-shrink: 0; transform: rotate(-8deg); }
.f36-mgroup-t { flex: 1; min-width: 220px; }
.f36-mgroup-t h2 { font-size: clamp(1.35rem, 2.6vw, 2rem); margin: 0; line-height: 1.1; }
.f36-mgroup-t p { margin: 4px 0 0; font-size: .94rem; opacity: .9; }
.f36-mgroup-note { transform: rotate(2deg); white-space: normal; }
.f36-mgrid.is-page { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.f36-mfoot { margin-top: 20px; padding: 28px; border: 3px dashed var(--f36-ink); border-radius: 24px; text-align: center; }
.f36-mfoot p { margin: 0; color: var(--muted); }
.f36-mfoot .f36-btns { justify-content: center; margin-top: 18px; }

/* QR menü (çekirdek) */
.fam-sokak .qr-wrap { max-width: 680px; }
.fam-sokak .qr-head { background: var(--primary); color: var(--on-primary); border: 3px solid var(--f36-ink); border-radius: 0 0 28px 28px; }
.fam-sokak .qr-head :is(h1, p) { color: inherit; }
.fam-sokak .qr-actions a { border: 2px solid var(--f36-ink); background: var(--f36-card); color: var(--f36-ink); border-radius: 999px; font-weight: 700; }
.fam-sokak .qr-nav a { border: 2px solid var(--f36-ink); border-radius: 999px; font-weight: 700; color: var(--f36-ink); background: var(--f36-card); }
.fam-sokak .qr-group h2 { font-family: var(--font-head); }
.fam-sokak .qr-price { font-family: var(--font-head); color: var(--primary); }

/* rezervasyon + formlar */
.fam-sokak main :is(input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="date"], input[type="time"], input[type="url"], input[type="password"], input[type="search"], select, textarea):not(.f36-msearch input) { border: 2px solid var(--f36-ink); border-radius: 12px; background-color: var(--field-bg, #fff); }
.fam-sokak main :is(input, select, textarea):focus { outline: none; box-shadow: 3px 3px 0 var(--accent); border-color: var(--f36-ink); }
.fam-sokak :is(.card-pad, .widget, .fb.fb-style-card, .nl-block, .apt-box, .sh-box) { border: var(--f36-bw) solid var(--f36-ink); border-radius: calc(var(--radius) + 4px); box-shadow: var(--f36-sh); background: var(--f36-card); }
.fam-sokak .widget-title::after { background: var(--accent); height: 4px; }
.fam-sokak .widget-title { border-bottom: 2px solid var(--f36-ink); }
.fam-sokak .contact-cards > * { border: var(--f36-bw) solid var(--f36-ink); box-shadow: var(--f36-sh); border-radius: var(--radius); }
.fam-sokak .map-embed, .fam-sokak .br-map, .fam-sokak .leaflet-container { border-radius: 20px; }

/* çekirdek kartlar (etkinlik, şube, doküman, iş, galeri, randevu) */
.fam-sokak :is(.evt-card, .br-card, .dc-item, .job-card, .gal-card, .apt-svc-card, .card:not(.f36-card)) { border: var(--f36-bw) solid var(--f36-ink); border-radius: var(--radius); box-shadow: var(--f36-sh); background: var(--f36-card); }
.fam-sokak :is(.evt-card, .br-card, .dc-item, .job-card, .gal-card, .apt-svc-card, .card:not(.f36-card)):hover { transform: translate(-3px, -3px); box-shadow: var(--f36-sh-lg); border-color: var(--f36-ink); }
.fam-sokak .chip, .fam-sokak .cl-term-chip, .fam-sokak .cl-fopt { border: 2px solid var(--f36-ink); border-radius: 999px; font-weight: 700; }
.fam-sokak .chip.is-active, .fam-sokak .cl-term-chip.is-active { background: var(--dark); color: #fff; border-color: var(--f36-ink); }
.fam-sokak .pagination a, .fam-sokak .pagination span { border: 2px solid var(--f36-ink); border-radius: 12px; font-weight: 700; }
.fam-sokak .pagination .is-active, .fam-sokak .pagination .current { background: var(--accent); color: var(--on-accent); }
.fam-sokak .prose table { border: var(--f36-bw) solid var(--f36-ink); border-radius: 16px; box-shadow: var(--f36-sh); border-collapse: separate; border-spacing: 0; overflow: hidden; }
.fam-sokak .prose th { background: var(--dark); color: #fff; border: 0; border-bottom: 2px solid var(--f36-ink); font-family: var(--font-head); font-size: .88rem; }
.fam-sokak .prose td { border: 0; border-bottom: 1.5px dashed rgba(0, 0, 0, .18); }
.fam-sokak .prose tr:last-child td { border-bottom: 0; }
.fam-sokak .prose tr:nth-child(even) td { background: var(--surface); }
.fam-sokak .prose blockquote { border-left: 0; border: var(--f36-bw) solid var(--f36-ink); border-radius: 20px; background: var(--accent); color: var(--on-accent); box-shadow: var(--f36-sh); font-style: normal; font-weight: 600; }
.fam-sokak .blk-apt-wizard .sh-head h2, .fam-sokak .dc-wrap .dc-head h2 { font-size: var(--f36-h2); }
.fam-sokak :is(.sh-eyebrow, .dc-eyebrow) { display: inline-block; padding: .38em .95em; border: 2px solid var(--f36-ink); border-radius: 999px; background: var(--accent); color: var(--on-accent); font-weight: 800; font-size: .76rem; letter-spacing: .09em; text-transform: uppercase; box-shadow: 2px 2px 0 var(--f36-ink); transform: rotate(-2deg); }
.fam-sokak .blk-apt-wizard, .fam-sokak .blk-doc-list { background: var(--surface); border-block: 3px solid var(--f36-ink); }

/* ================= FOOTER ================= */
.f36-footer { --f36-shc: var(--accent); background: var(--footer-bg, var(--dark)); color: var(--footer-text, rgba(255, 255, 255, .78)); padding-top: 0; }
.f36-foot-top { background: var(--secondary); color: var(--on-secondary); border-block: 3px solid var(--f36-ink); padding: clamp(40px, 5vw, 64px) 0; --f36-shc: var(--f36-ink); }
.f36-foot-top-in { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: 36px; align-items: center; }
.f36-foot-title { font-family: var(--font-head); font-weight: 900; font-size: clamp(1.8rem, 3.8vw, 3rem); line-height: 1.05; margin: 0; letter-spacing: -.02em; }
.f36-foot-say .f36-btns { margin-top: 22px; }
.f36-foot-nl .nl-block { background: var(--f36-card); color: var(--f36-ink); transform: rotate(1.2deg); }
.f36-foot-nl .nl-title { color: var(--f36-ink); font-family: var(--font-head); }
.f36-foot-nl .nl-desc { color: var(--muted); }
.f36-foot-nl .nl-btn { background: var(--dark); color: #fff; }
.f36-foot-top.f36-t-pop { background: var(--primary); color: var(--on-primary); }
.f36-foot-top.f36-t-pop3 { background: var(--accent); color: var(--on-accent); }
.f36-foot-top.f36-t-ink { background: var(--surface); color: var(--text); }
.f36-foot-main { padding-top: clamp(48px, 6vw, 80px); }
.f36-foot-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); gap: 36px; }
.f36-foot-col h3 { color: var(--accent); font-size: .82rem; text-transform: uppercase; letter-spacing: .12em; margin: 0 0 16px; }
.f36-foot-brand .site-logo, .f36-foot-brand .logo-text strong { color: #fff !important; }
.f36-foot-brand .site-logo { margin-bottom: 14px; }
.f36-foot-brand p { font-size: .92rem; max-width: 38ch; }
.f36-footer .footer-links { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.f36-footer .footer-links a { color: inherit; }
.f36-footer .footer-links a:hover, .f36-foot-list a:hover { color: var(--accent); }
.f36-foot-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.f36-foot-list li { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 8px; font-size: .92rem; }
.f36-foot-list i { color: var(--accent); }
.f36-footer .social-links a { border: 2px solid rgba(255, 255, 255, .5); background: transparent; color: #fff; }
.f36-footer .social-links a:hover { background: var(--accent); color: var(--on-accent) !important; border-color: var(--accent); }
.f36-foot-word { margin: clamp(30px, 5vw, 60px) 0 0; font-family: var(--font-head); font-weight: 900; font-size: clamp(3rem, 10vw, 9.5rem); line-height: .86; letter-spacing: -.03em; color: transparent; -webkit-text-stroke: 2px rgba(255, 255, 255, .28); white-space: nowrap; overflow: hidden; text-align: center; user-select: none; }
.f36-foot-bottom { border-top: 2px dashed rgba(255, 255, 255, .2); margin-top: 18px; }
.f36-foot-legal { display: flex; flex-wrap: wrap; gap: 14px; }

/* yüzen düğmeler + mobil sipariş çubuğu */
.fam-sokak .fc-btn { border: var(--f36-bw) solid var(--f36-ink); box-shadow: 3px 3px 0 var(--f36-ink); }
.f36-obar { --obar-h: 64px; }
@media (max-width: 768px) {
  .fam-sokak .mobile-bar.f36-obar { grid-template-columns: repeat(3, minmax(0, .8fr)) minmax(0, 1.6fr); grid-auto-flow: row; background: var(--dark); border-top: 3px solid var(--f36-ink); box-shadow: 0 -4px 0 var(--accent); padding: 6px 8px calc(6px + env(safe-area-inset-bottom)); gap: 4px; }
  .fam-sokak .f36-obar a { color: #fff; padding: 6px 2px; border-radius: 14px; min-height: 48px; justify-content: center; }
  .fam-sokak .f36-obar .mb-call, .fam-sokak .f36-obar .mb-wa { color: #fff; }
  .fam-sokak .f36-obar .mb-wa i { color: #4ade80; }
  .fam-sokak .f36-obar .f36-obar-go { flex-direction: row; gap: 8px; background: var(--accent); color: var(--on-accent); border: 2.5px solid #000; font-family: var(--font-head); font-size: .82rem; font-weight: 800; box-shadow: 2px 2px 0 var(--primary); }
  .fam-sokak .f36-obar .f36-obar-go i { font-size: 20px; }
  .fam-sokak .f36-obar :is(.mb-menu, .mb-call, .mb-wa, .mb-mail) span { font-size: .66rem; }
  .fam-sokak { padding-bottom: 0; }
  .fam-sokak .site-footer { padding-bottom: 76px; }
}

/* ================= DUYARLI ================= */
@media (max-width: 1100px) {
  .f36-tool-in { grid-template-columns: minmax(0, 1fr); }
  .f36-mgrid, .f36-mgrid.is-page { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .f36-grid-4, .f36-crew { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .f36-feat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .f36-feat:nth-child(even) { transform: none; }
  .f36-steps-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .f36-steps-row::before { display: none; }
  .f36-tix { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .f36-snaps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .f36-rev-track { grid-auto-columns: calc((100% - 26px) / 2); }
  .f36-hb-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "main main" "photo photo" "s1 s2" "p1 p2"; }
  .f36-foot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .f36-hp-in, .f36-hk-in, .f36-about-in, .f36-hl-in, .f36-tool-in, .f36-faq-in, .f36-br-split, .f36-foot-top-in, .f36-tool.is-wide .f36-tool-top { grid-template-columns: minmax(0, 1fr); }
  .f36-hp-art { max-width: 460px; margin: 0 auto; width: 100%; }
  .f36-img-right .f36-about-media { order: 0; }
  .f36-hk-deck { min-height: 0; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 72%); gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 14px 14px 22px 4px; scrollbar-width: none; }
  .f36-hk-deck::-webkit-scrollbar { display: none; }
  .f36-hk-card { position: relative; width: auto !important; inset: auto !important; scroll-snap-align: start; }
  .f36-hk-body { top: auto !important; bottom: 10px; }
  .f36-hk-c1 { transform: rotate(-2deg); } .f36-hk-c2 { transform: rotate(1.5deg); } .f36-hk-c3 { transform: rotate(-1deg); }
  .f36-hk-deck .f36-hero-burst { display: none; }
  .f36-hf-in { grid-template-columns: minmax(0, 1fr); }
  .f36-hf-side { flex-direction: row; justify-content: flex-start; padding: 0; }
  .f36-hf-stk { flex-direction: row; flex-wrap: wrap; }
  .f36-shops, .f36-promo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .f36-stat-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .f36-cta-in.has-img, .f36-cta-in:has(.f36-cta-art) { grid-template-columns: minmax(0, 1fr); }
  .f36-cta-art { justify-self: start; }
  .f36-cta-disc { width: 200px; }
  .f36-msearch { flex-basis: 180px; }
}
@media (max-width: 760px) {
  :root { --f36-bw: 2px; }
  :root, .f36-bg-ink, .f36-t-ink, .f36-footer, .f36-foot-top { --f36-sh: 4px 4px 0 var(--f36-shc); --f36-sh-lg: 6px 6px 0 var(--f36-shc); }
  .f36-head { flex-direction: column; align-items: flex-start; }
  .f36-rev-head { flex-direction: column; align-items: flex-start; gap: 0; }
  .f36-mgrid, .f36-mgrid.is-page { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  :root { --section-y: clamp(52px, 12vw, 72px); }
  .f36-tapes.has-cross { padding: 34px 0; }
  .f36-mtablist { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding: 4px 4px 8px; margin-inline: -4px; }
  .f36-mtablist::-webkit-scrollbar { display: none; }
  .f36-mtab { flex-shrink: 0; }
  .f36-mtab[aria-selected="true"] { transform: none; }
  .f36-grid-3, .f36-grid-4, .f36-tix, .f36-shops, .f36-promo-grid { grid-template-columns: minmax(0, 1fr); }
  .f36-promo:nth-child(n) { transform: none; }
  .f36-snaps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
  .f36-rev-track { grid-auto-columns: 86%; }
  .f36-mbar-in { flex-direction: column; align-items: stretch; gap: 8px; padding-top: 8px; padding-bottom: 8px; }
  .f36-msearch { flex-basis: auto; }
  .f36-ph-in { grid-template-columns: minmax(0, 1fr) auto; }
  .f36-ph-disc { width: 96px; }
  .f36-ph-badge { width: 72px; font-size: 32px; }
  .f36-hero--photo { min-height: 600px; }
  .f36-hf-in { padding-top: 160px; }
  .f36-hb-photo { min-height: 260px; }
  .f36-hb-grid > * { border-radius: 22px; }
  .f36-tool-in .f36-tool-media { display: none; }
  .fam-sokak .prose table { display: block; overflow-x: auto; }
}
@media (max-width: 640px) {
  .fam-sokak :is(.cl-grid-cards-wide, .cl-grid-list) .cl-card-media { border-right: 0 !important; border-bottom: var(--f36-bw) solid var(--f36-ink); border-radius: calc(var(--radius) - 3px) calc(var(--radius) - 3px) 0 0; }
}
@media (max-width: 560px) {
  .f36-mgrid, .f36-mgrid.is-page { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .f36-mi { flex-direction: row; }
  .f36-mi-media { width: 112px; flex-shrink: 0; aspect-ratio: auto; min-height: 112px; border-bottom: 0; border-right: var(--f36-bw) solid var(--f36-ink); }
  .v-cards-block .f36-mi-media { border-right-width: var(--f36-bw); }
  .f36-mi-tags { display: none; }
  .f36-mi.no-img .f36-mi-ph i { width: 62px; height: 62px; font-size: 28px; }
  .f36-mi-body { padding: 12px; }
  .f36-mi-name { font-size: .94rem; }
  .f36-mi-desc { -webkit-line-clamp: 2; font-size: .82rem; }
  .f36-mi-alg { display: none; }
  .f36-mi-meta { display: none; }
  .f36-crew { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
  .f36-stat-row { gap: 14px; }
  .f36-stat-row li { padding: 16px 14px; }
  .f36-hb-grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "main" "photo" "s1" "s2" "p1" "p2"; }
  .f36-hb-promo { grid-template-columns: 64px minmax(0, 1fr); }
  .f36-hb-promo-img { width: 64px; height: 64px; }
  .f36-foot-grid { grid-template-columns: minmax(0, 1fr); }
  .f36-cta-burst { --bs: 96px; }
  .f36-tik { grid-template-columns: 74px minmax(0, 1fr); }
  .f36-hstats li { padding: 8px 12px; }
  .f36-hstat-v b { font-size: 1.25rem; }
  .f36-hp-stk .f36-stk { font-size: .74rem; }
}
@media (prefers-reduced-motion: reduce) {
  .fam-sokak .btn:hover, .f36-mi:hover, .f36-card:hover, .f36-shop:hover, .f36-tik:hover, a.f36-promo:hover, a.f36-hk-card:hover, .f36-snap:hover { transform: none; }
}

/* ================= SİTE İNCE AYARLARI ================= */
/* Bastır: Archivo Black tek ağırlık — sahte kalınlaştırma yok, başlıklar büyük ve sıkı */
.site-bastir { --f36-h1: clamp(2.2rem, 4.6vw, 3.9rem); --f36-h2: clamp(1.8rem, 3.4vw, 2.9rem); }
.site-bastir :is(h1, h2, h3, h4, .f36-burst-t b, .f36-stat-v b, .f36-hstat-v b, .f36-tape-i, .f36-foot-title, .f36-foot-word, .logo-text strong) { font-synthesis: none; letter-spacing: -.01em; }
.site-bastir .f36-h1, .site-bastir .f36-title { text-transform: uppercase; line-height: 1.02; }
/* Yoğurhan: Bricolage Grotesque — sıkı başlık */
.site-yogurhan { --f36-h1: clamp(2.2rem, 4.6vw, 3.9rem); }
.site-yogurhan :is(.f36-h1, .f36-title) { letter-spacing: -.03em; }
/* Şekerkare: Montserrat Alternates */
.site-sekerkare { --f36-h1: clamp(2.1rem, 4.4vw, 3.7rem); }
.fam-sokak .cl-cf dd { overflow: visible; white-space: normal; } .fam-sokak .cl-cf .cl-chip { white-space: normal; max-width: 100%; }