/*
 * Ortak tipografi ölçeği (rol bazlı) ve görsel-başlık boşluğu.
 * Font AİLESİ tema başına kalır (--hp-font-heading); boyut, kalınlık ve satır yüksekliği tüm temalarda ortaktır.
 * Eşik 960 px (masaüstü modu düzeltmesiyle aynı). Yeni blok/tema başlık boyutunu sabit px/rem yazmaz:
 * var(--hp-fs-*) / var(--hp-lh-*) / var(--hp-fw-*) kullanır.
 * Aşağıdaki kurallar @layer içinde !important'tır: sabit px yazan eski blok/tema kuralları (çoğu !important) bu
 * katmana yenilir; bu sayede tek yerden yönetilir. Katman çekirdeğin EN SON stil dosyasıdır.
 * Tema ölçeği büyütmek isterse yalnız :root değişkenlerini değiştirir (ör. --hp-type-scale).
 */
:root {
  --hp-type-scale: 1;
  --hp-fs-card-title: calc(16px * var(--hp-type-scale));  --hp-lh-card-title: calc(22px * var(--hp-type-scale));  --hp-fw-card-title: 600;
  --hp-fs-list-title: calc(14px * var(--hp-type-scale));  --hp-lh-list-title: calc(20px * var(--hp-type-scale));  --hp-fw-list-title: 600;
  --hp-fs-hero-title: calc(22px * var(--hp-type-scale));  --hp-lh-hero-title: calc(28px * var(--hp-type-scale));  --hp-fw-hero-title: 700;
  --hp-fs-sidebar-title: var(--hp-fs-sidebar-list); --hp-lh-sidebar-title: var(--hp-lh-sidebar-list); --hp-fw-sidebar-title: 600;
  --hp-fs-sidebar-list: calc(15px * var(--hp-type-scale)); --hp-lh-sidebar-list: calc(21px * var(--hp-type-scale));
  --hp-fs-meta: calc(12px * var(--hp-type-scale));        --hp-lh-meta: 16px;                                     --hp-fw-meta: 500;
  --hp-fs-block-title: calc(16px * var(--hp-type-scale)); --hp-lh-block-title: calc(22px * var(--hp-type-scale)); --hp-fw-block-title: 700;
  --hp-gap-media-title: 8px;
}
@media (min-width: 960px) {
  :root {
    --hp-fs-card-title: calc(18px * var(--hp-type-scale)); --hp-lh-card-title: calc(24px * var(--hp-type-scale));
    --hp-fs-list-title: calc(15px * var(--hp-type-scale)); --hp-lh-list-title: calc(21px * var(--hp-type-scale));
    --hp-fs-hero-title: calc(30px * var(--hp-type-scale)); --hp-lh-hero-title: calc(36px * var(--hp-type-scale));
    --hp-fs-block-title: calc(18px * var(--hp-type-scale)); --hp-lh-block-title: calc(24px * var(--hp-type-scale));
    --hp-gap-media-title: 12px;
  }
}

@layer hp-type {
  /* --- Haber ızgarası: kart (varsayılan) --- */
  .hp-news-grid .card-title {
    font-size: var(--hp-fs-card-title) !important; line-height: var(--hp-lh-card-title) !important; font-weight: var(--hp-fw-card-title) !important;
  }
  /* liste rolü */
  .hp-news-grid:is(.hp-news-grid--compact-strip, .hp-news-grid--compact-newsbar, .hp-news-grid--compact-cards, .hp-news-grid--compact-overlay, .hp-news-grid--compact-chips, .hp-news-grid--content-editorial-list) .card-title {
    font-size: var(--hp-fs-list-title) !important; line-height: var(--hp-lh-list-title) !important; font-weight: var(--hp-fw-list-title) !important;
  }
  /* yan sütun listesi */
  .hp-news-grid[class*="--sidebar-"] .card-title {
    font-size: var(--hp-fs-sidebar-title) !important; line-height: var(--hp-lh-sidebar-title) !important; font-weight: var(--hp-fw-sidebar-title) !important;
  }
  /* yan sütunun ilk (büyük) kartı: kart rolü */
  .hp-news-grid[class*="--sidebar-"] .hp-news-card--first .card-title {
    font-size: var(--hp-fs-card-title) !important; line-height: var(--hp-lh-card-title) !important; font-weight: var(--hp-fw-card-title) !important;
  }
  /* manşet (büyük kart) */
  .hp-news-grid:is(.hp-news-grid--content-magazine, .hp-news-grid--content-featured-grid, .hp-news-grid--full-hero-overlay, .hp-news-grid--full-split-feature, .hp-news-grid--full-mosaic, .hp-news-grid--full-accent-band) .hp-news-card--first .card-title {
    font-size: var(--hp-fs-hero-title) !important; line-height: var(--hp-lh-hero-title) !important; font-weight: var(--hp-fw-hero-title) !important;
  }
  /* blok başlık şeridi (h2) */
  .hp-global-block-card .hp-section-title h2 {
    font-size: var(--hp-fs-block-title) !important; line-height: var(--hp-lh-block-title) !important; font-weight: var(--hp-fw-block-title) !important;
  }
  /* meta */
  .hp-news-grid .hp-news-card .hp-meta {
    font-size: var(--hp-fs-meta) !important; line-height: var(--hp-lh-meta) !important;
  }

  /* --- Manşet kaydırıcı --- */
  .hp-headline-copy h3 {
    font-size: var(--hp-fs-card-title) !important; line-height: var(--hp-lh-card-title) !important; font-weight: var(--hp-fw-card-title) !important;
  }
  .hp-headline--slider-1 .hp-headline-copy h3 {
    font-size: var(--hp-fs-hero-title) !important; line-height: var(--hp-lh-hero-title) !important; font-weight: var(--hp-fw-hero-title) !important;
  }

  /* --- Çok okunanlar / kategori sekmeleri / paylaşılan haberler --- */
  .hp-popular-tabs__copy h3 {
    font-size: var(--hp-fs-sidebar-title) !important; line-height: var(--hp-lh-sidebar-title) !important; font-weight: var(--hp-fw-sidebar-title) !important;
  }
  .hp-category-news-tabs__copy h3, .hp-block-shared-news .card-body > h3, .hp-block-shared-news .card-title {
    font-size: var(--hp-fs-card-title) !important; line-height: var(--hp-lh-card-title) !important; font-weight: var(--hp-fw-card-title) !important;
  }

  /* Başlık içindeki bağlantı/satır parçaları kendi boyutunu yazmaz, başlıktan miras alır */
  .hp-news-grid .card-title a, .hp-news-grid .card-title .hp-news-title-line,
  .hp-headline-copy h3 a, .hp-popular-tabs__copy h3 a, .hp-category-news-tabs__copy h3 a, .hp-block-shared-news .card-body > h3 a {
    font-size: inherit !important; line-height: inherit !important; font-weight: inherit !important;
  }

  /* --- Görsel ile başlık arası boşluk --- */
  /* görsel üstüne binen (overlay) başlıklar: yan iç boşluk en az 12px, okunabilirlik için tema degradesi korunur */
  .hp-news-grid--content-video-grid .hp-news-card > .card-body,
  body.mars .hp-news-grid--content-cards .hp-news-card--first > .card-body {
    padding-inline: 12px !important;
  }
  @media (min-width: 768px) and (max-width: 959.98px) {
    body.mars .hp-news-grid--content-cards .hp-news-card > .card-body { padding-inline: 12px !important; }
  }
  /* görselin altındaki başlık: en az --hp-gap-media-title */
  body.venus .hp-news-grid--content-video-grid .hp-news-card > .card-body {
    padding-block-start: var(--hp-gap-media-title) !important;
  }
}