/* ==========================================================================
   Çavuşlu Belediyesi — "cx" düzeni · TEMEL
   Açık zemin · koyu mavi (#013c8d) ana renk · renkli kutular · mavi-mor bantlar
   Tasarım ölçeği: 1440 px genişlikte referans (görsel 941 px → ×1,53). Kap genişliği %85 (en çok 1280 px).
   ========================================================================== */
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:400 800;font-display:swap;src:url('/assets/cx/fonts/pjs-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:400 800;font-display:swap;src:url('/assets/cx/fonts/pjs-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* İç sayfa içerik bileşenleri (cv-*.css) bu adlarla yazılmıştır → Plus Jakarta Sans */
@font-face{font-family:'Cerebri Sans';font-weight:300 900;font-display:swap;src:url('/assets/cx/fonts/pjs-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Cerebri Sans';font-weight:300 900;font-display:swap;src:url('/assets/cx/fonts/pjs-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Quicksand';font-weight:300 900;font-display:swap;src:url('/assets/cx/fonts/pjs-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Quicksand';font-weight:300 900;font-display:swap;src:url('/assets/cx/fonts/pjs-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Cerebri Sans Heavy';font-weight:800;font-display:swap;src:url('/assets/cx/fonts/pjs-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Cerebri Sans Heavy';font-weight:800;font-display:swap;src:url('/assets/cx/fonts/pjs-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Bebas Neue';font-weight:800;font-display:swap;src:url('/assets/cx/fonts/pjs-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Bebas Neue';font-weight:800;font-display:swap;src:url('/assets/cx/fonts/pjs-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow Condensed';font-weight:300 900;font-display:swap;src:url('/assets/cx/fonts/pjs-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Barlow Condensed';font-weight:300 900;font-display:swap;src:url('/assets/cx/fonts/pjs-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Başlık yazı tipi (anasayfa bölüm başlıkları + site geneli alt bölüm) — Montserrat değişken, 100-900 */
@font-face{font-family:'Montserrat';font-style:normal;font-weight:100 900;font-display:swap;src:url('/assets/cx/fonts/montserrat-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:100 900;font-display:swap;src:url('/assets/cx/fonts/montserrat-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root {
  /* mavi ailesi */
  --cx-blue-950: #00265a;
  --cx-blue-900: #003068;
  --cx-blue-800: #003c81;
  --cx-blue-700: #0a3d91;
  --cx-blue: #013c8d;            /* ana: düğme, tarih rozeti, bağlantı */
  --cx-blue-500: #1f63c9;
  --cx-blue-100: #e6eefb;
  --cx-purple: #6b1cac;          /* bant geçişinin mor ucu */
  /* metin / yüzey */
  --cx-ink: #0a2a63;             /* başlıklar */
  --cx-text: #3d5278;
  --cx-muted: #7186a8;
  --cx-line: #e2e9f4;
  --cx-bg: #f4f7fc;
  --cx-soft: #eef3fa;
  --cx-card: #ffffff;
  /* renkli hizmet kutuları */
  --cx-cyan: #2fa6e6;
  --cx-violet: #8f4fa0;
  --cx-green: #4cb085;
  --cx-orange: #e59a5d;
  --cx-sky: #6b9be0;
  --cx-teal: #3c9a9a;
  --cx-slate: #5a72a4;
  --cx-steel: #2f6c99;
  --cx-ice: #8dc2e4;
  /* etiketler */
  --cx-tag-proje: #26a99a;
  --cx-tag-hizmet: #a43aa0;
  --cx-tag-etkinlik: #2f98d6;
  --cx-tag-haber: #d63a6a;
  /* ölçüler */
  --cx-radius: 16px;
  --cx-shadow: 0 14px 34px -24px rgba(8, 45, 110, .45);
  --cx-shadow-sm: 0 8px 22px -16px rgba(8, 45, 110, .4);
  --cx-font: "Plus Jakarta Sans", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;

  /* ── TEMA STÜDYOSU jetonları (config/theme_tokens.php; varsayılanlar burada, yönetici değerleri
        layouts/cx.php → <style id="cx-theme"> ile body.cx-body.cx-body üzerine yazılır) ── */
  --ax-navy: #1f3263; --ax-navy2: #162550; --ax-navy3: #2a4078;
  --ax-or: #f47b20; --ax-or2: #e8650f; --ax-or3: #ff9545; --ax-orlt: #ffb27a; --ax-orl: #fff1e6; --ax-orink: #c25a0c;
  --ax-ink: #1b2a52; --ax-text: #4b5672; --ax-muted: #8a93a8; --ax-bg: #f3f5f9; --ax-line: #e4e8f0;
  --ax-c1a: #2aa3e0; --ax-c1b: #1679b8; --ax-c1l: #e2f1fb;
  --ax-c2a: #63b04f; --ax-c2b: #3f8a30; --ax-c2l: #e6f3e0;
  --ax-c3a: #a26bb6; --ax-c3b: #764189; --ax-c3l: #f1e7f5;
  --ax-c4a: #22b3b5; --ax-c4b: #0f8789; --ax-c5a: #b8844e; --ax-c5b: #8c5b2f;
  --ax-head: "Montserrat", "Plus Jakarta Sans", system-ui, sans-serif;
  --ax-hw: 900; --ax-tt: uppercase; --ax-mtt: uppercase;
  --ax-fz: 1; --ax-fzh: 1; --ax-fzm: 1; --ax-rs: 1;
  --ax-wrap: 1480px; --ax-ihero: 500px; --ax-shade: 1; --ax-logo: 58px;
}

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body.cx-body {
  margin: 0; font-family: var(--cx-font); font-size: calc(15px * var(--ax-fz, 1)); line-height: 1.5; color: var(--cx-text);
  background: var(--cx-bg); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
:where(body.cx-body) *, :where(body.cx-body) *::before, :where(body.cx-body) *::after { box-sizing: border-box; }
:where(body.cx-body) img { max-width: 100%; }
:where(body.cx-body) ul, :where(body.cx-body) ol { margin: 0; padding: 0; list-style: none; }
:where(body.cx-body) a { color: inherit; text-decoration: none; }
:where(body.cx-body) button { font: inherit; color: inherit; cursor: pointer; }
:where(body.cx-body) h1, :where(body.cx-body) h2, :where(body.cx-body) h3, :where(body.cx-body) p { margin: 0; }
:where(body.cx-body) :focus-visible { outline: 3px solid #2f98d6; outline-offset: 2px; }

/* ── Yerleşim ─────────────────────────────────────────────────────────── */
.cx-wrap { width: 85%; max-width: 1280px; margin-inline: auto; }
.cx-s { position: relative; }
.cx-sr { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.cx-skip { position: fixed; left: 12px; top: -60px; z-index: 1000; padding: 10px 16px; border-radius: 10px; background: var(--cx-blue); color: #fff; font-weight: 700; transition: top .2s; }
.cx-skip:focus { top: 12px; }

/* ── Bölüm başlığı: sol başlık + alt yazı, sağ "Tümünü gör" ──────────────── */
.cx-sec-h { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.cx-sec-h__t { display: flex; align-items: center; gap: 12px; min-width: 0; }
.cx-sec-h__ic { flex: none; font-size: 24px; color: var(--cx-blue); line-height: 1; }
.cx-sec-h h2 { font-size: 26px; line-height: 1.15; font-weight: 800; color: var(--cx-ink); letter-spacing: -.01em; }
.cx-sec-h p { margin-top: 3px; font-size: 12.5px; color: var(--cx-muted); }
.cx-sec-h--inline { align-items: baseline; justify-content: flex-start; flex-wrap: wrap; gap: 6px 18px; }
.cx-sec-h--inline .cx-more { margin-left: auto; }
.cx-more { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; color: var(--cx-blue); white-space: nowrap; }
.cx-more i { font-size: 11px; transition: transform .2s; }
.cx-more:hover i { transform: translateX(3px); }

/* ── Düğmeler ─────────────────────────────────────────────────────────── */
.cx-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 44px; padding: 0 24px; border-radius: 10px; border: 1.5px solid transparent; font-size: 13px; font-weight: 700; line-height: 1; white-space: nowrap; transition: background .2s, color .2s, border-color .2s, transform .2s, box-shadow .2s; }
.cx-btn i { font-size: 12px; transition: transform .2s; }
.cx-btn:hover i { transform: translateX(3px); }
.cx-btn--blue { background: var(--cx-blue); color: #fff; box-shadow: 0 12px 24px -14px rgba(1, 60, 141, .8); }
.cx-btn--blue:hover { background: #0a4fb3; transform: translateY(-1px); }
.cx-btn--white { background: #fff; color: var(--cx-blue); }
.cx-btn--white:hover { background: var(--cx-blue-100); }
.cx-btn--line { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .7); }
.cx-btn--line:hover { background: rgba(255, 255, 255, .14); border-color: #fff; }
.cx-btn--pill { border-radius: 999px; }
.cx-btn--sm { height: 36px; padding: 0 18px; font-size: 12px; }

/* ── Etiket ve tarih rozeti ───────────────────────────────────────────── */
.cx-tag { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 999px; font-size: 9.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; line-height: 1.2; color: #fff; background: var(--cx-tag-etkinlik); }
.cx-tag--proje { background: var(--cx-tag-proje); }
.cx-tag--hizmet { background: var(--cx-tag-hizmet); }
.cx-tag--etkinlik { background: var(--cx-tag-etkinlik); }
.cx-tag--haber { background: var(--cx-tag-haber); }
.cx-tag--gundem { background: var(--cx-blue); }
.cx-date { flex: none; width: 56px; padding: 8px 4px 7px; border-radius: 10px; text-align: center; line-height: 1; background: var(--cx-blue); color: #fff; }
.cx-date b { display: block; font-size: 20px; font-weight: 800; }
.cx-date small { display: block; margin-top: 3px; font-size: 11px; font-weight: 600; opacity: .9; }

/* ── Kart ─────────────────────────────────────────────────────────────── */
.cx-card { background: var(--cx-card); border: 1px solid #e8eef8; border-radius: var(--cx-radius); box-shadow: var(--cx-shadow-sm); }
.cx-empty { padding: 18px 4px; font-size: 13px; color: var(--cx-muted); }

/* ── Anasayfa ana kabuğu ──────────────────────────────────────────────── */
.cx-main { display: block; }


/* Erişilebilirlik (üst çubuktaki panel) */
html.cx-ul body.cx-body a:not(.cx-btn) { text-decoration: underline; text-underline-offset: 3px; }
html.cx-hc body.cx-body { background: #fff; color: #000; }
html.cx-hc body.cx-body .cx-card { border-color: #000; }

/* ── Çerez bandı (partials/cookie-banner.php) ─────────────────────────── */
body.cx-body .ck-banner { background: #fff; color: var(--cx-ink); border: 1px solid var(--cx-line); border-radius: 16px; padding: 18px 20px 16px; box-shadow: 0 30px 70px -28px rgba(0, 30, 80, .55); font-family: var(--cx-font); }
body.cx-body .ck-banner__txt { font-size: 12.8px; line-height: 1.6; color: var(--cx-text); margin-bottom: 12px; }
body.cx-body .ck-banner__txt a { color: var(--cx-blue); font-weight: 700; text-decoration: underline; }
body.cx-body .ck-banner__btns { gap: 8px; justify-content: flex-start; }
body.cx-body .ck-btn { border-radius: 10px; padding: 10px 18px; font-size: 12.5px; font-weight: 700; }
body.cx-body .ck-btn--light { background: var(--cx-soft); color: var(--cx-ink); }
body.cx-body .ck-btn--light:hover { background: var(--cx-blue-100); }
body.cx-body .ck-btn--dark { background: transparent; color: var(--cx-blue); border: 1.5px solid var(--cx-blue); }
body.cx-body .ck-btn--dark:hover { background: var(--cx-blue-100); }
body.cx-body .ck-btn[data-action="accept-all"] { background: var(--cx-blue); color: #fff; border-color: var(--cx-blue); }
body.cx-body .ck-btn[data-action="accept-all"]:hover { background: #0a4fb3; }

/* ── Form bildirimleri (partials/cv/flash.php) ────────────────────────── */
.cv-flash { position: fixed; top: 110px; left: 50%; z-index: 30000; width: min(92vw, 640px); transform: translateX(-50%); display: flex; flex-direction: column; gap: 10px; transition: opacity .4s, visibility .4s; }
.cv-flash.is-hidden { opacity: 0; visibility: hidden; }
.cv-flash__item { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 14px; color: #fff; font-size: 14.5px; font-weight: 600; line-height: 1.4; background: #1f7a4d; box-shadow: 0 24px 50px -20px rgba(0, 20, 60, .6); }
.cv-flash__item--err { background: #c0392b; }
.cv-flash__item > i { font-size: 20px; flex: 0 0 auto; }
.cv-flash__item > span { flex: 1 1 auto; min-width: 0; }
.cv-flash__x { flex: 0 0 auto; width: 30px; height: 30px; border: 0; border-radius: 9px; background: rgba(255, 255, 255, .18); color: #fff; display: inline-flex; align-items: center; justify-content: center; }
.cv-sr { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

@media (max-width: 1100px) {
  .cx-wrap { width: calc(100% - 32px); }
  .cx-sec-h h2 { font-size: 22px; }
}
/* Windows "animasyon efektleri kapalı" (prefers-reduced-motion) — 2026-10-19 düzeltmesi:
   Eskiden TÜM süreler .01ms'ye iniyordu → geçişler anında "zıplıyor", SONSUZ döngüler (kayan şerit, nabız, yüzen rozet,
   ses çubukları) saniyede yüzlerce kez dönüp titriyordu ("her şey çok hızlı hareket ediyor"). Artık süreler korunur;
   yalnız yumuşak kaydırma kapanır ve yerinde zıplayan süs döngüleri durur. Kayan haber şeritleri yavaş akmaya devam eder. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  body.cx-body .ax-eq i, body.cx-body .ax-lap__badge, body.cx-body .ax-gtk em i { animation: none !important; }
}

/* Üst çubuk ve karşılama slaytı içeriği, bölümlerden daha dar kapta durur (hedef görselde %75) */
.cx-wrap--head { width: 75.5%; max-width: 1120px; }
@media (max-width: 1100px) { .cx-wrap--head { width: calc(100% - 32px); } }
.cx-wrap--head { width: 80%; max-width: 1180px; }
@media (max-width: 1360px) { .cx-wrap--head { width: 90%; max-width: 1180px; } }
@media (max-width: 1100px) { .cx-wrap--head { width: calc(100% - 32px); } }
body.cx-home { background: #fff; }
.cx-wrap--head { width: 75.7%; max-width: 1090px; }
@media (max-width: 1360px) { .cx-wrap--head { width: 90%; max-width: 1100px; } }
@media (max-width: 1100px) { .cx-wrap--head { width: calc(100% - 32px); } }