/* ================================================================
   Görsel Sayfa Düzenleyici — blok stilleri
   Sitenin renk değişkenlerini (main.css :root) kullanır.
   ================================================================ */

.mb-block { position:relative; font-size:18px; line-height:1.65; color:var(--text, #0F1620) }
.mb-inner { max-width:var(--container, 1440px); margin:0 auto; padding:0 32px }
.mb-w-narrow .mb-inner { max-width:840px }
.mb-w-full .mb-inner   { max-width:none; padding:0 }

/* Arka planlar */
.mb-bg-white { background:var(--bg-elevated, #fff) }
.mb-bg-light { background:var(--bg-secondary, #F4F1EA) }
.mb-bg-brand { background:var(--copper, #B8612A); color:#fff }
.mb-bg-dark  { background:var(--bg-inverse, #0F1620); color:var(--text-inverse, #FAFAF6) }

/* Boşluklar */
.mb-pad-s { padding:32px 0 }
.mb-pad-m { padding:64px 0 }
.mb-pad-l { padding:112px 0 }

/* Görünürlük */
@media (max-width: 767px)  { .mb-show-desktop { display:none !important } }
@media (min-width: 768px)  { .mb-show-mobile  { display:none !important } }

/* Başlık + paragraf */
.mb-ht.mb-align-center { text-align:center; margin:0 auto }
.mb-title { font-family:'Manrope', sans-serif; font-weight:800; font-size:clamp(28px, 3.4vw, 44px); line-height:1.15; letter-spacing:-.01em; margin-bottom:16px; color:inherit }
.mb-text { max-width:760px; color:inherit; opacity:.88 }

/* Üst etiket (sitedeki bölüm etiketleriyle aynı) */
.mb-tag { display:inline-flex; align-items:center; gap:10px; margin-bottom:14px; font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--copper, #B8612A) }
.mb-tag::before { content:""; width:24px; height:1px; background:currentColor }
.mb-bg-brand .mb-tag, .mb-bg-dark .mb-tag { color:var(--amber, #E8A958) }
.mb-align-center .mb-tag { justify-content:center }

/* Başlık yazı tipi */
.mb-title.mb-tf-display { font-family:'Bebas Neue',sans-serif; font-weight:400; letter-spacing:.01em; line-height:.95 }
.mb-title.mb-tf-sans    { font-family:'Manrope',sans-serif; font-weight:800 }
.mb-title.mb-tf-serif   { font-family:'Fraunces',serif; font-weight:700; letter-spacing:0 }
/* Başlık boyutu (Bebas daha dar olduğu için bir kademe büyük) */
.mb-title.mb-ts-s { font-size:clamp(22px,2.4vw,30px) }
.mb-title.mb-ts-m { font-size:clamp(28px,3.4vw,44px) }
.mb-title.mb-ts-l { font-size:clamp(36px,4.8vw,64px) }
.mb-title.mb-tf-display.mb-ts-s { font-size:clamp(30px,3.2vw,40px) }
.mb-title.mb-tf-display.mb-ts-m { font-size:clamp(40px,5vw,64px) }
.mb-title.mb-tf-display.mb-ts-l { font-size:clamp(52px,7vw,96px) }
/* *Vurgu*: sitenin başlıklarındaki bakır italik */
.mb-title em, .mb-text em { font-family:'Fraunces',serif; font-style:italic; font-weight:400; color:var(--copper, #B8612A) }
.mb-bg-brand .mb-title em, .mb-bg-brand .mb-text em, .mb-bg-dark .mb-title em, .mb-bg-dark .mb-text em { color:var(--amber, #E8A958) }
.mb-text em { font-size:1.06em }

/* Renkler (auto = arka plana göre otomatik) */
.mb-tc-ink    { color:var(--ink, #0F1620) }
.mb-tc-copper { color:var(--copper, #B8612A) }
.mb-tc-amber  { color:var(--amber, #E8A958) }
.mb-tc-light  { color:var(--text-inverse, #FAFAF6) }
.mb-tc-muted  { color:var(--text-muted, #6B7280) }
.mb-bc-ink, .mb-bc-secondary, .mb-bc-copper, .mb-bc-light { opacity:1 }
.mb-bc-ink       { color:var(--ink, #0F1620) }
.mb-bc-secondary { color:var(--text-secondary, #374151) }
.mb-bc-copper    { color:var(--copper, #B8612A) }
.mb-bc-light     { color:var(--text-inverse, #FAFAF6) }
/* Metin yazı tipi */
.mb-text.mb-bf-sans  { font-family:'Manrope',sans-serif }
.mb-text.mb-bf-serif { font-family:'Fraunces',serif; font-size:1.05em; line-height:1.6 }
.mb-align-center .mb-text { margin:0 auto }
.mb-btn { display:inline-flex; align-items:center; justify-content:center; min-height:48px; margin-top:28px; padding:12px 28px;
  background:var(--copper, #B8612A); color:#fff; font-weight:700; font-size:16px; border-radius:4px; transition:background .2s }
.mb-btn:hover { background:var(--copper-bright, #D97A3A) }
.mb-bg-brand .mb-btn { background:#fff; color:var(--copper, #B8612A) }
.mb-bg-dark .mb-btn  { background:var(--amber, #E8A958); color:var(--ink, #0F1620) }

/* Görsel */
.mb-figure { margin:0 }
.mb-figure img { width:100%; height:auto; display:block; border-radius:4px }
.mb-w-full .mb-figure img { border-radius:0 }
.mb-figure figcaption { margin-top:12px; font-size:15px; opacity:.75; text-align:center }

.mb-empty { padding:24px; text-align:center; border:2px dashed currentColor; opacity:.5; border-radius:6px }

@media (max-width: 767px) {
  .mb-inner { padding:0 20px }
  .mb-pad-m { padding:44px 0 }
  .mb-pad-l { padding:72px 0 }
}

/* ---------- Yalnızca önizleme (admin) ---------- */
.mb-zone { position:relative; outline:2px dashed transparent; outline-offset:-2px; min-height:8px; transition:outline-color .15s }
.mb-zone:hover { outline-color:rgba(184,97,42,.45) }
.mb-zone-add { display:flex; align-items:center; justify-content:center; width:100%; min-height:30px; margin:0; padding:4px 0;
  background:rgba(184,97,42,.07); color:var(--copper, #B8612A); font:600 13px/1 'Manrope', sans-serif; border:0; cursor:pointer; opacity:.55; transition:opacity .15s, background .15s }
.mb-zone-add:hover, .mb-zone.mb-selected .mb-zone-add { opacity:1; background:rgba(184,97,42,.16) }
.mb-zone.mb-selected { outline-color:var(--copper, #B8612A) }
[data-mb-block] { cursor:pointer }
[data-mb-block]:hover { outline:2px solid rgba(11,110,119,.6); outline-offset:-2px }
[data-mb-block].mb-selected { outline:3px solid #0B6E77; outline-offset:-3px }
.mb-is-hidden { opacity:.35 }
.mb-is-hidden::before { content:"GİZLİ"; position:absolute; top:8px; right:8px; z-index:2; background:#0F1620; color:#fff; font:700 11px/1 'Manrope', sans-serif; padding:5px 8px; border-radius:3px }