/* =========================================================
   Haliç Çevre – base.css  (v5 Premium)
   ========================================================= */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* Google Fonts — Raleway display + Inter body */
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@700;800;900&family=Inter:wght@400;500;600;700&display=swap');

:root {
  /* ── Renk Sistemi — Derin lacivert kurumsal ── */
  --color-primary:        #0C4DA2;   /* Daha derin, prestijli mavi */
  --color-primary-dark:   #093d87;
  --color-primary-light:  #1668c8;
  --color-secondary:      #0FAE6A;   /* Canlı yeşil */
  --color-secondary-dark: #0c9559;
  --color-accent:         #003f8a;

  --color-text:           #0a1222;   /* Neredeyse siyah, net */
  --color-text-mid:       #2d3a4e;
  --color-text-light:     #687080;
  --color-text-muted:     #a0aab4;

  --color-bg:             #ffffff;
  --color-surface:        #f7f9fc;
  --color-surface-2:      #eef2f8;
  --color-dark:           #060d1c;
  --color-dark-2:         #091526;
  --color-border:         rgba(12,18,40,.065);
  --color-border-strong:  rgba(12,18,40,.12);

  /* ── Tipografi — Raleway başlıklar, Inter gövde ── */
  --font-family:      'Inter', system-ui, -apple-system, sans-serif;
  --font-display:     'Raleway', system-ui, sans-serif;
  --base-font-size:   16px;
  --line-height:      1.7;

  --fw-regular:   400;
  --fw-medium:    500;
  --fw-semibold:  600;
  --fw-bold:      700;
  --fw-extrabold: 800;
  --fw-black:     900;

  /* ── Boşluk ── */
  --space-xs:  .25rem;
  --space-sm:  .5rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2rem;
  --space-2xl: 3rem;
  --space-3xl: 5rem;
  --space-4xl: 8rem;

  /* ── Radius ── */
  --radius-sm:   .375rem;
  --radius-md:   .625rem;
  --radius-lg:   1rem;
  --radius-xl:   1.375rem;
  --radius-2xl:  2rem;
  --radius-3xl:  3rem;
  --radius-full: 9999px;

  /* ── Gölgeler ── */
  --shadow-xs:       0 1px 3px rgba(6,13,28,.05);
  --shadow-sm:       0 2px 10px rgba(6,13,28,.07);
  --shadow-md:       0 6px 24px rgba(6,13,28,.09);
  --shadow-lg:       0 12px 44px rgba(6,13,28,.11);
  --shadow-xl:       0 22px 72px rgba(6,13,28,.14);
  --shadow-primary:  0 8px 32px rgba(12,77,162,.28);
  --shadow-secondary:0 8px 32px rgba(15,174,106,.24);

  /* ── Geçişler ── */
  --ease-out:    cubic-bezier(.2, 0, 0, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --ease-smooth: cubic-bezier(.4, 0, .2, 1);
  --ease-enter:  cubic-bezier(.22, 1, .36, 1);

  --transition-fast:   150ms var(--ease-out);
  --transition-base:   260ms var(--ease-out);
  --transition-slow:   420ms var(--ease-out);
  --transition-spring: 380ms var(--ease-spring);

  /* ── Gradientler ── */
  --grad-primary:  linear-gradient(135deg, #0C4DA2 0%, #093d87 100%);
  --grad-secondary: linear-gradient(135deg, #0FAE6A 0%, #0c9559 100%);
  --grad-hero:     linear-gradient(155deg, #060d1c 0%, #08142a 35%, #0e2450 75%, #070f1e 100%);
  --grad-surface:  linear-gradient(180deg, #f7f9fc 0%, #eef2f8 100%);
  --grad-mesh:
    radial-gradient(at 30% 20%, rgba(12,77,162,.07) 0, transparent 55%),
    radial-gradient(at 80% 80%, rgba(15,174,106,.05) 0, transparent 50%),
    radial-gradient(at 5% 75%, rgba(12,77,162,.05) 0, transparent 50%);

  /* ── Layout ── */
  --header-height:  64px;
  --container-max:  1300px;
  --container-pad:  1.5rem;
}

html, body {
  margin: 0; padding: 0;
}
html {
  font-size: var(--base-font-size);
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  background: #ffffff;
  overflow-x: hidden;
}

body {
  font-family: var(--font-family);
  font-size: 1rem; line-height: var(--line-height);
  color: var(--color-text);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
  font-weight: var(--fw-regular);
  /* Flex layout — footer alta yapışır, beyaz boşluk kalmaz */
  display: flex; flex-direction: column; min-height: 100dvh;
}
.site-footer { margin-top: auto; }
/* Fixed header offset — her sayfa şablonu kendi padding'ini yönetir */
/* Tüm HTML elementlerinde box-sizing border-box */
*, *::before, *::after { box-sizing: border-box; }

/* ── Tipografi — Raleway başlık, Inter gövde ── */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  line-height: 1.14;
  letter-spacing: -.025em;
  color: var(--color-text);
  font-weight: var(--fw-bold);
}
h1 { font-size: clamp(2.5rem, 6vw, 4.25rem); font-weight: var(--fw-black); }
h2 { font-size: clamp(1.75rem, 4vw, 2.75rem); font-weight: var(--fw-bold); }
h3 { font-size: clamp(1.125rem, 2vw, 1.4rem); font-weight: var(--fw-semibold); letter-spacing: -.015em; }
h4 { font-size: 1.0625rem; font-weight: var(--fw-semibold); }
h5 { font-size: .9375rem; font-weight: var(--fw-semibold); }

p { color: var(--color-text-mid); line-height: 1.78; }

a { color: var(--color-primary); text-decoration: none; transition: color var(--transition-fast); }
a:hover { color: var(--color-primary-dark); }
a:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 3px; border-radius: var(--radius-sm); }

ul, ol { list-style: none; }
/* Görseller — taşmasın ama HTML attribute boyutuna müdahale etme */
img { max-width: 100%; display: block; }
video { max-width: 100%; height: auto; display: block; }
svg { display: block; }
/* HTML width attribute varsa CSS height:auto ekleme — oranı korumak WordPress'e bırak */
img:not([width]) { height: auto; }

.screen-reader-text {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
::selection { background: rgba(12,77,162,.12); }
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: var(--color-surface); }
::-webkit-scrollbar-thumb { background: var(--color-primary); border-radius: 99px; }

/* ══════════════════════════════════════════════════════════
   GLOBAL İÇERİK TİPOGRAFİSİ (Gutenberg, Klasik, Tüm İçerikler)
   Gerekli yerlerde override sağlamak için specificity artırıldı.
   ══════════════════════════════════════════════════════════ */
.entry-content, 
.hc-article__content,
.post-content,
.page-content,
.wp-block-post-content { 
  max-width: 100%;
  color: #4b5563 !important; 
  line-height: 1.95 !important;
  font-weight: 400;
}

/* Genel ardışık boşluk bırakma mekanizması */
.entry-content > *, 
.hc-article__content > *, 
.post-content > *,
.wp-block-post-content > * { 
  margin-top: 1.8em !important; 
}

/* -- Başlıklar: Dengeli, premium, kurumsal, abartıdan uzak hiyerarşi -- */
.entry-content h1, .hc-article__content h1, .post-content h1, .wp-block-post-content h1,
.entry-content h1.wp-block-heading, .hc-article__content h1.wp-block-heading,
.entry-content .hc-article__title {
  font-size: clamp(1.75rem, 3.2vw, 2.5rem) !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: -.025em;
  color: #111827 !important;
  margin: 0 0 2.2rem !important;
}
.entry-content h2, .hc-article__content h2, .post-content h2, .wp-block-post-content h2,
.entry-content h2.wp-block-heading, .hc-article__content h2.wp-block-heading {
  font-size: clamp(1.35rem, 2vw, 1.65rem) !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  letter-spacing: -.02em;
  color: #111827 !important;
  margin-top: 2.2em !important; 
  margin-bottom: 0.8em !important;
}
.entry-content h3, .hc-article__content h3, .post-content h3, .wp-block-post-content h3,
.entry-content h3.wp-block-heading, .hc-article__content h3.wp-block-heading {
  font-size: clamp(1.15rem, 1.6vw, 1.35rem) !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  letter-spacing: -.01em;
  color: #1f2937 !important;
  margin-top: 1.8em !important; 
  margin-bottom: 0.6em !important;
}
.entry-content h4, .hc-article__content h4, .post-content h4, .wp-block-post-content h4,
.entry-content h4.wp-block-heading, .hc-article__content h4.wp-block-heading {
  font-size: clamp(1.05rem, 1.3vw, 1.15rem) !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  color: #374151 !important;
  margin-top: 1.6em !important; 
  margin-bottom: 0.5em !important;
}

/* -- Kalın Metin Vurguları: Gövde içinde belirgin kontrast -- */
.entry-content strong, .hc-article__content strong, .post-content strong, .wp-block-post-content strong,
.entry-content b, .hc-article__content b, .post-content b, .wp-block-post-content b {
  font-weight: 700 !important;
  color: #111827 !important;
}

/* -- Paragraflar ve Listeler -- */
.entry-content p, .hc-article__content p, .post-content p, .wp-block-post-content p,
.entry-content p.wp-block-paragraph, .hc-article__content p.wp-block-paragraph { 
  margin: 0 0 .5em !important; 
  color: #4b5563 !important;
  line-height: 1.95 !important;
}
.entry-content ul, .entry-content ol,
.hc-article__content ul, .hc-article__content ol,
.post-content ul, .post-content ol,
.wp-block-post-content ul, .wp-block-post-content ol { 
  list-style: revert; 
  padding-left: 1.4em !important; 
  margin: 1.5em 0 !important; 
}
.entry-content li, .hc-article__content li, .post-content li, .wp-block-post-content li { 
  margin-bottom: .6em !important; 
  line-height: 1.85 !important;
}
.entry-content li + li, .hc-article__content li + li, .post-content li + li, .wp-block-post-content li + li { 
  margin-top: 0 !important; 
}

/* -- Premium Ayraç (Divider) -- */
.entry-content hr, .hc-article__content hr, .post-content hr, .wp-block-post-content hr {
  border: 0 !important;
  height: 1px !important;
  background: rgba(17, 24, 39, 0.08) !important;
  margin: 3.5em 0 !important;
}

/* -- Linkler -- */
.entry-content a, .hc-article__content a, .post-content a, .wp-block-post-content a {
  color: var(--color-primary) !important; 
  text-decoration: underline !important; 
  text-underline-offset: 3px !important; 
  font-weight: 500 !important; 
}

/* -- Alıntı Kutuları (Blockquote) -- */
.entry-content blockquote, .hc-article__content blockquote, .post-content blockquote, .wp-block-post-content blockquote {
  border-left: 3px solid var(--color-primary) !important;
  padding: 1rem 1.5rem !important; 
  color: #4b5563 !important;
  font-style: italic !important; 
  background: rgba(17, 24, 39, 0.02) !important;
  border-radius: 0 var(--radius-md) var(--radius-md) 0 !important;
  margin: 2em 0 !important;
}

/* ══ WordPress görsel boyutu — editörde seçilen boyutu koru ══ */
/*
   WordPress editöründe görsel boyutu değiştirilince:
   - Gutenberg: <img width="300" height="200" ...> şeklinde HTML attribute yazar
   - Klasik editör: aynı şekilde width/height attribute yazar
   - CSS'in bu attribute'ları EZMEMESİ gerekiyor
*/

/* İçerik görselleri — sadece taşmayı engelle, boyuta müdahale etme */
.entry-content img,
.hc-article__content img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Gutenberg figure — max-width kapsayıcıdan taşmasın */
.entry-content figure,
.hc-article__content figure {
  max-width: 100%;
  margin: 1.4em 0;
}

/* alignleft / alignright / aligncenter */
.entry-content .alignleft,
.hc-article__content .alignleft {
  float: left;
  margin: .4em 1.6em 1em 0;
  max-width: 50%;
}
.entry-content .alignright,
.hc-article__content .alignright {
  float: right;
  margin: .4em 0 1em 1.6em;
  max-width: 50%;
}
.entry-content .aligncenter,
.hc-article__content .aligncenter {
  margin-left: auto;
  margin-right: auto;
}
.entry-content::after,
.hc-article__content::after {
  content: ""; display: table; clear: both;
}

/* alignfull / alignwide — tam genişlik */
.entry-content .alignfull img,
.hc-article__content .alignfull img,
.entry-content .wp-block-image.alignfull img,
.hc-article__content .wp-block-image.alignfull img {
  width: 100%;
  max-width: 100%;
}
.entry-content .alignwide img,
.hc-article__content .alignwide img,
.entry-content .wp-block-image.alignwide img,
.hc-article__content .wp-block-image.alignwide img {
  width: 100%;
  max-width: 100%;
}

/* figcaption */
.entry-content figcaption,
.hc-article__content figcaption {
  font-size: .8rem;
  color: var(--color-text-muted, #a0aab4);
  text-align: center;
  margin-top: .4em;
}
