/**
 * Hub sayfaları — Figma 03 Kategori (10:1909 / 10:9558 / 10:12409), 04 Alt Kategori (10:5180 / 10:18395 / 27:9089).
 * Konu (eg_topic) ve genel arşiv aynı dili kullanır. Kırılımlar: ≤767 mobil, 768–1023 tablet, ≥1024 masaüstü.
 */

/* ---------------------------------------------------------------- Hero (03: 10:1945, 04: 10:5216) */
.eg-hub-hero {
	position: relative; overflow: hidden;
	background: linear-gradient(180deg, var(--eg-color-background-subtle) 0%, var(--eg-color-background-page) 100%);
}
.eg-hub-hero__inner { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 34px; padding-block: 30px; min-height: 328px; }
.eg-hub-hero__text { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; max-width: 640px; }
.eg-hub-hero__title { font: var(--eg-type-display-xl); letter-spacing: var(--eg-tracking-display-xl); }
.eg-hub-hero__intro { font: var(--eg-type-body-lg); color: var(--eg-color-text-secondary); }
.eg-hub-hero__meta { display: flex; flex-wrap: wrap; gap: 8px 28px; padding-top: 8px; font: var(--eg-type-ui-meta); color: var(--eg-color-text-secondary); }
.eg-hub-hero__meta li { display: inline-flex; align-items: center; gap: 6px; }
.eg-hub-hero__media { position: absolute; top: 0; right: 0; bottom: 0; width: 52%; }
.eg-hub-hero__img { width: 100%; height: 100%; object-fit: cover; }
.eg-hub-hero__media::before {
	content: ""; position: absolute; inset: 0 auto 0 0; width: 38%; z-index: 1;
	background: linear-gradient(90deg, var(--eg-color-background-subtle) 0%, rgba(238, 244, 253, 0) 100%);
}
.eg-hub-hero--sub .eg-hub-hero__inner { gap: 26px; padding-block: 20px 24px; min-height: 271px; }
.eg-hub-hero--sub .eg-hub-hero__text { gap: 10px; }
.eg-hub-hero--sub .eg-hub-hero__title { font: var(--eg-type-display-lg); letter-spacing: var(--eg-tracking-display-lg); }
.eg-hub-hero--sub .eg-hub-hero__intro { font: var(--eg-type-body-md); max-width: 580px; }
.eg-hub-hero--sub .eg-hub-hero__media { width: 50%; }
.eg-hub--archive .eg-hub-hero__inner { min-height: 0; padding-bottom: 32px; }

/* ---------------------------------------------------------------- Terim kutusu (03 şerit, 04 panel) */
.eg-hub-tile {
	display: flex; flex-direction: column; align-items: center; gap: 4px; height: 100%; padding: 14px 6px;
	border-radius: var(--eg-radius-md); background: var(--eg-color-background-page); color: var(--eg-color-text-primary); text-align: center;
	transition: background-color var(--eg-motion-fast) var(--eg-ease), box-shadow var(--eg-motion-base) var(--eg-ease);
}
.eg-hub-tile:hover { color: var(--eg-color-text-primary); background: var(--eg-color-surface-brand-soft); }
.eg-hub-tile__media { display: flex; align-items: center; justify-content: center; width: 76px; height: 69px; margin-bottom: 6px; }
.eg-hub-tile__img { width: 100%; height: 100%; object-fit: contain; }
.eg-hub-tile__media--icon { width: 60px; height: 60px; margin: 4px 0 11px; border-radius: var(--eg-radius-md); background: var(--eg-cat-bg); color: var(--eg-cat-ink); }
.eg-hub-tile__name { font: var(--eg-type-label-md); }
.eg-hub-tile__sub, .eg-hub-tile__count { font: var(--eg-type-body-sm); color: var(--eg-color-text-muted); }
.eg-hub-tile--sm { gap: 2px; padding: 12px 4px; }
.eg-hub-tile--sm .eg-hub-tile__media { width: 62px; height: 58px; }
.eg-hub-tile--sm .eg-hub-tile__media--icon { width: 50px; height: 50px; margin: 4px 0 10px; }
.eg-hub-tile--sm .eg-hub-tile__name { font: var(--eg-type-label-sm); }
.eg-hub-tile--sm .eg-hub-tile__sub, .eg-hub-tile--sm .eg-hub-tile__count { font: var(--eg-type-body-xs); }

/* 03 alt kategori şeridi (10:1970): beyaz panel, 12 iç boşluk */
.eg-hub-strip { position: relative; z-index: 2; }
.eg-hub-strip__list {
	display: grid; grid-auto-flow: column; grid-auto-columns: minmax(136px, 1fr); gap: 12px; padding: 12px;
	background: var(--eg-color-surface-default); border-radius: var(--eg-radius-lg); box-shadow: var(--eg-shadow-sm);
	overflow-x: auto; scrollbar-width: thin;
}
.eg-hub-strip .eg-hub-tile__name { white-space: nowrap; }

/* ---------------------------------------------------------------- Ortak kutular (sidebar) */
.eg-hub-box { display: flex; flex-direction: column; gap: 16px; padding: 20px; border-radius: var(--eg-radius-lg); background: var(--eg-color-surface-brand-soft); }
.eg-hub-box--panel { background: var(--eg-color-surface-default); border: 1px solid var(--eg-color-border-default); box-shadow: var(--eg-shadow-xs); }
.eg-hub-box__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.eg-hub-box__title { font: var(--eg-type-heading-h4); letter-spacing: var(--eg-tracking-h4); }
.eg-hub-box__title--sm { font: var(--eg-type-heading-h5); letter-spacing: 0; }
.eg-hub-box__text { margin-top: 4px; font: var(--eg-type-body-xs); color: var(--eg-color-text-secondary); }
.eg-hub-box__link, .eg-hub-box__more { display: inline-flex; align-items: center; gap: 4px; min-height: 28px; font: var(--eg-type-label-sm); color: var(--eg-color-text-link); }
.eg-hub-box__more { gap: 6px; align-self: flex-start; }
.eg-hub-box__lead { display: flex; align-items: center; gap: 14px; }
.eg-hub-box__badge {
	display: inline-flex; align-items: center; justify-content: center; flex: none; width: 40px; height: 40px; border-radius: 50%;
	background: color-mix(in srgb, var(--eg-color-brand-primary) 12%, transparent); color: var(--eg-color-brand-primary);
}
.eg-hub-box__badge--lg { width: 72px; height: 72px; }
.eg-hub-box__badge--md { width: 52px; height: 52px; }
.eg-hub-box__badge--success { background: color-mix(in srgb, var(--eg-color-status-success) 16%, transparent); color: var(--eg-color-status-success); }

/* Bu kategoride neler var? (10:2151) */
.eg-hub-inside { gap: 6px; }
.eg-hub-inside__row { display: flex; align-items: center; gap: 14px; padding: 11px 0; border-bottom: 1px solid var(--eg-color-border-default); color: var(--eg-color-text-primary); }
.eg-hub-inside__row:hover { color: var(--eg-color-brand-primary); }
.eg-hub-inside__media { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 46px; height: 46px; border-radius: var(--eg-radius-sm); overflow: hidden; background: var(--eg-color-background-page); }
.eg-hub-inside__media.is-icon { background: var(--eg-cat-bg); color: var(--eg-cat-ink); }
.eg-hub-inside__img { width: 100%; height: 100%; object-fit: cover; }
.eg-hub-inside__text { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.eg-hub-inside__name { font: var(--eg-type-label-md); }
.eg-hub-inside__count { font: var(--eg-type-body-sm); color: var(--eg-color-text-muted); }
.eg-hub-inside__chev { flex: none; color: var(--eg-color-text-primary); }
.eg-hub-inside .eg-hub-box__more { padding-top: 10px; }

/* Marka ızgarası (10:2193 / 10:5616) */
.eg-hub-brands { gap: 14px; }
.eg-hub-brands__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.eg-hub-brands__item { display: flex; flex-direction: column; align-items: center; gap: 4px; color: var(--eg-color-text-muted); }
.eg-hub-brands__item:hover { color: var(--eg-color-text-primary); }
.eg-hub-brands__logo {
	display: flex; align-items: center; justify-content: center; width: 100%; height: 52px; padding: 6px 8px;
	background: var(--eg-color-surface-default); border: 1px solid var(--eg-color-border-default); border-radius: 10px;
}
.eg-hub-brands__item:hover .eg-hub-brands__logo { border-color: var(--eg-color-border-brand); }
.eg-hub-brands__img { max-width: 50px; max-height: 40px; width: auto; height: auto; object-fit: contain; }
.eg-hub-brands__initial { font: var(--eg-type-heading-h4); color: var(--eg-color-text-primary); }
.eg-hub-brands__name { font: var(--eg-type-body-xs); text-align: center; overflow-wrap: anywhere; }
.eg-hub-brands--sm .eg-hub-brands__logo { height: 50px; }
.eg-hub-brands--sm .eg-hub-brands__img { max-width: 38px; max-height: 38px; }

/* Rehber arama (10:2235) — global arama formunu kutuya uyarlar */
.eg-hub-find .eg-search { height: auto; padding: 0; gap: 8px; background: transparent; border: 0; box-shadow: none; }
.eg-hub-find .eg-search:focus-within { box-shadow: none; }
.eg-hub-find .eg-search__icon { display: none; }
.eg-hub-find .eg-search__input {
	height: 44px; padding: 0 14px; border-radius: 10px; background: var(--eg-color-surface-default);
	border: 1px solid var(--eg-color-border-default); font: var(--eg-type-body-sm);
}
.eg-hub-find .eg-search__input:focus { border-color: var(--eg-color-border-focus); box-shadow: var(--eg-focus-ring); }
.eg-hub-find .eg-search__clear { position: absolute; right: 56px; }
.eg-hub-find .eg-search__submit--icon { width: 44px; height: 44px; border-radius: 10px; }
.eg-hub-news { background: var(--eg-color-surface-success-soft); }

/* ---------------------------------------------------------------- Filtreler (10:2015 / 10:5411) */
.eg-hub-filters { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.eg-hub-filters__chips { gap: 10px; }
.eg-hub-sort {
	position: relative; display: inline-flex; align-items: center; gap: 4px; flex: none; height: 44px; padding: 0 16px;
	background: var(--eg-color-surface-default); border: 1px solid var(--eg-color-border-default); border-radius: 10px;
	font: var(--eg-type-body-sm); color: var(--eg-color-text-primary);
}
.eg-hub-sort:focus-within { border-color: var(--eg-color-border-focus); box-shadow: var(--eg-focus-ring); }
.eg-hub-sort__select {
	-webkit-appearance: none; appearance: none; height: 42px; padding: 0 28px 0 0; margin-right: -24px; border: 0; background: transparent;
	font: var(--eg-type-body-sm); color: var(--eg-color-text-primary); cursor: pointer; outline: none; position: relative; z-index: 1;
}
.eg-hub-sort__chev { pointer-events: none; flex: none; margin-left: 8px; }
.eg-hub-sort__submit { margin-left: 12px; padding: 4px 10px; border-radius: var(--eg-radius-xs); background: var(--eg-color-brand-primary); color: var(--eg-color-text-inverse); font: var(--eg-type-label-sm); }

/* ---------------------------------------------------------------- 03 gövde */
.eg-hub-main { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 40px; align-items: start; padding-block: 40px 0; }
.eg-hub-main__content { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.eg-hub-main__content .eg-pagination { margin-top: 20px; }
.eg-hub-side { display: flex; flex-direction: column; gap: 16px; }

/* Öne çıkan (10:2029) */
.eg-hub-feature { position: relative; display: flex; align-items: center; min-height: 284px; overflow: hidden; border-radius: var(--eg-radius-lg); background: var(--eg-color-background-footer); color: var(--eg-color-text-inverse); }
.eg-hub-feature__media { position: absolute; top: 0; right: 0; bottom: 0; width: 480px; max-width: 56%; }
.eg-hub-feature__media::before { content: ""; position: absolute; inset: 0 auto 0 -2px; width: 170px; z-index: 1; background: linear-gradient(90deg, var(--eg-color-background-footer), rgba(11, 23, 52, 0)); }
.eg-hub-feature__media img, .eg-hub-feature__media .eg-media__ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.eg-hub-feature__body { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; gap: 14px; width: 390px; max-width: 52%; padding: 24px 0 24px 28px; }
.eg-hub-feature__tag.eg-eyebrow { padding: 3px 8px; background: var(--eg-color-surface-muted); color: var(--eg-color-text-primary); }
.eg-hub-feature__title { font: 800 30px/1.22 var(--eg-font-family); color: var(--eg-color-text-inverse); }
.eg-hub-feature__title a { color: inherit; }
.eg-hub-feature__title a::after { content: ""; position: absolute; inset: 0; z-index: 3; }
.eg-hub-feature:has(a:focus-visible) { outline: 2px solid var(--eg-color-border-focus); outline-offset: 2px; }
.eg-hub-feature__title a:focus-visible { outline: none; }
.eg-hub-feature__excerpt { font: var(--eg-type-body-md); }
.eg-hub-feature__meta { display: flex; flex-wrap: wrap; gap: 24px; padding-top: 4px; font: var(--eg-type-ui-meta); }
.eg-hub-feature__meta > span { display: inline-flex; align-items: center; gap: 6px; }

/* Kart ızgarası (10:2048) — Card/Article'ın hub varyantı: 112 yükseklik görsel, özetsiz */
.eg-hub-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.eg-hub-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.eg-hub-grid > li { display: flex; min-width: 0; }
.eg-hub-gcard { width: 100%; border: 0; border-radius: var(--eg-radius-md); }
.eg-hub-gcard .eg-media { aspect-ratio: auto; height: 112px; }
.eg-hub-gcard .eg-card__body { gap: 8px; padding: 12px 16px 16px; }
.eg-hub-gcard .eg-card__eyebrow { padding: 3px 8px; background: var(--eg-color-surface-muted); color: var(--eg-color-text-primary); }
.eg-hub-gcard .eg-card__title { font: var(--eg-type-heading-h4); letter-spacing: var(--eg-tracking-h4); }
.eg-hub-gcard .eg-card__meta { gap: 6px 18px; padding-top: 4px; }

/* İlginizi çekebilir (10:2259 / 10:5687) */
.eg-hub-rel { display: flex; flex-direction: column; gap: 14px; margin-block: 48px 64px; padding: 20px 16px 22px; border-radius: var(--eg-radius-lg); background: var(--eg-color-surface-muted); }
.eg-hub-rel__title { padding-left: 12px; font: var(--eg-type-heading-h3); letter-spacing: var(--eg-tracking-h3); }
.eg-hub-rel__row { display: flex; align-items: center; gap: 16px; }
.eg-hub-rel__list { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 60px) / 4); gap: 20px; flex: 1; min-width: 0; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 2px; margin: -2px; }
.eg-hub-rel__list::-webkit-scrollbar { display: none; }
.eg-hub-rel__item { scroll-snap-align: start; display: flex; }
.eg-hub-rel__card { display: flex; align-items: stretch; width: 100%; height: 96px; overflow: hidden; border-radius: var(--eg-radius-md); background: var(--eg-color-surface-default); box-shadow: var(--eg-shadow-xs); color: var(--eg-color-text-primary); }
.eg-hub-rel__card:hover { color: var(--eg-color-brand-primary); box-shadow: var(--eg-shadow-sm); }
.eg-hub-rel__name { display: flex; align-items: center; flex: 1; min-width: 0; padding: 0 14px 0 18px; font: var(--eg-type-label-md); }
.eg-hub-rel__media { position: relative; flex: none; width: 104px; background: var(--eg-color-surface-brand-soft); }
.eg-hub-rel__media img, .eg-hub-rel__media .eg-media__ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.eg-hub-rel__arrow {
	display: inline-flex; align-items: center; justify-content: center; flex: none; width: 44px; height: 44px; border-radius: 50%;
	background: var(--eg-color-surface-default); color: var(--eg-color-brand-primary); box-shadow: 0 4px 7px rgba(11, 23, 52, 0.06);
}
.eg-hub-rel__arrow:hover { background: var(--eg-color-surface-brand-soft); }
.eg-hub-rel__arrow[disabled] { color: var(--eg-color-text-muted); cursor: default; }
.eg-hub-rel--sub { margin-top: 40px; }
.eg-hub-rel--sub .eg-hub-rel__row { gap: 14px; }
.eg-hub-rel--sub .eg-hub-rel__list { grid-auto-columns: calc((100% - 56px) / 5); gap: 14px; }
.eg-hub-rel--sub .eg-hub-rel__card { flex-direction: row-reverse; height: 90px; }
.eg-hub-rel--sub .eg-hub-rel__media { width: 80px; }
.eg-hub-rel--sub .eg-hub-rel__name { padding: 0 12px 0 14px; }

/* ---------------------------------------------------------------- 04 gövde: 232 | 680 | 288 */
.eg-hub-cuts { position: relative; z-index: 2; }
.eg-hub-cuts__row { display: flex; align-items: center; gap: 12px; }
.eg-hub-cuts__list { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 84px) / 8); gap: 12px; flex: 1; min-width: 0; overflow-x: auto; scrollbar-width: none; padding: 2px; margin: -2px; }
.eg-hub-cuts__list::-webkit-scrollbar { display: none; }
.eg-hub-cuts__item {
	display: flex; flex-direction: column; align-items: center; gap: 3px; height: 125px; padding: 16px 6px 14px; text-align: center;
	background: var(--eg-color-surface-default); border-radius: 14px; box-shadow: var(--eg-shadow-xs); color: var(--eg-color-text-primary);
}
.eg-hub-cuts__item:hover { color: var(--eg-color-brand-primary); box-shadow: var(--eg-shadow-sm); }
.eg-hub-cuts__logo { display: flex; align-items: center; justify-content: center; width: 46px; height: 40px; margin-bottom: 6px; color: var(--eg-color-text-primary); }
.eg-hub-cuts__img { max-width: 46px; max-height: 40px; width: auto; height: auto; object-fit: contain; }
.eg-hub-cuts__name { font: var(--eg-type-label-md); }
.eg-hub-cuts__count { font: var(--eg-type-body-xs); color: var(--eg-color-text-muted); }
.eg-hub-cuts__arrow { box-shadow: var(--eg-shadow-xs); }

.eg-hub-sub { display: grid; grid-template-columns: 232px minmax(0, 1fr) 288px; gap: 20px; align-items: start; padding-top: 28px; }
.eg-hub-sub__col { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.eg-hub--topic .eg-hub-sub, .eg-hub-hero + .eg-hub-sub { padding-top: 28px; }

.eg-hub-back {
	display: flex; align-items: center; gap: 8px; min-height: 46px; padding: 14px 16px; border-radius: var(--eg-radius-md);
	background: var(--eg-color-background-subtle); font: var(--eg-type-label-sm); color: var(--eg-color-text-link);
}
.eg-hub-back:hover { background: var(--eg-color-surface-brand-soft); }

.eg-hub-menu { gap: 2px; padding: 16px 10px 12px; }
.eg-hub-menu__title { padding: 0 10px 8px; font: var(--eg-type-heading-h5); }
.eg-hub-menu__list { display: flex; flex-direction: column; gap: 2px; }
.eg-hub-menu__item { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 11px 12px; border-radius: 10px; font: var(--eg-type-body-sm); color: var(--eg-color-text-primary); }
.eg-hub-menu__item:hover { background: var(--eg-color-background-page); color: var(--eg-color-text-primary); }
.eg-hub-menu__item svg { flex: none; color: var(--eg-color-text-secondary); }
.eg-hub-menu__item.is-current { background: var(--eg-color-surface-brand-soft); font: var(--eg-type-label-sm); color: var(--eg-color-brand-primary); }
.eg-hub-menu__item.is-current svg { color: var(--eg-color-brand-primary); }

.eg-hub-promo { display: flex; flex-direction: column; overflow: hidden; border-radius: var(--eg-radius-lg); background: var(--eg-color-surface-default); box-shadow: var(--eg-shadow-sm); }
.eg-hub-promo__media { position: relative; height: 236px; background: var(--eg-color-surface-brand-soft); }
.eg-hub-promo__media img, .eg-hub-promo__media .eg-media__ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.eg-hub-promo__body { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 16px 16px 18px; }
.eg-hub-promo__kicker { font: var(--eg-type-label-xs); letter-spacing: var(--eg-tracking-label-xs); color: var(--eg-color-brand-primary-strong); text-transform: uppercase; }
.eg-hub-promo__title { font: var(--eg-type-heading-h4); letter-spacing: var(--eg-tracking-h4); }
.eg-hub-promo__text { font: var(--eg-type-body-sm); color: var(--eg-color-text-secondary); }
.eg-hub-navy-btn {
	display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border-radius: 10px;
	background: var(--eg-color-brand-navy); color: var(--eg-color-text-inverse); font: var(--eg-type-label-sm);
}
.eg-hub-navy-btn:hover { background: var(--eg-color-brand-primary-strong); color: var(--eg-color-text-inverse); }
.eg-hub-navy-btn--sm { gap: 6px; min-height: 44px; padding: 0 12px; font: var(--eg-type-label-xs); letter-spacing: var(--eg-tracking-label-xs); }

.eg-hub-kids { gap: 12px; padding: 16px 16px 16px; }
.eg-hub-kids__title { font: var(--eg-type-heading-h3); letter-spacing: var(--eg-tracking-h3); }
.eg-hub-kids__list { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }

.eg-hub-list { display: flex; flex-direction: column; gap: 16px; }
.eg-hub-row { position: relative; display: flex; align-items: flex-start; gap: 18px; padding: 12px; border-radius: 14px; background: var(--eg-color-surface-default); box-shadow: var(--eg-shadow-xs); transition: box-shadow var(--eg-motion-base) var(--eg-ease); }
.eg-hub-row:hover { box-shadow: var(--eg-shadow-sm); }
.eg-hub-row:has(a:focus-visible) { outline: 2px solid var(--eg-color-border-focus); outline-offset: 2px; }
.eg-hub-row__media { position: relative; flex: none; width: 220px; height: 128px; overflow: hidden; border-radius: 10px; background: var(--eg-color-surface-brand-soft); }
.eg-hub-row__media img, .eg-hub-row__media .eg-media__ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.eg-hub-row__body { display: flex; flex-direction: column; gap: 6px; flex: 1; min-width: 0; padding: 2px 32px 0 0; }
.eg-hub-row__tags { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font: var(--eg-type-label-xs); letter-spacing: var(--eg-tracking-label-xs); }
.eg-hub-row__tag { padding: 3px 8px; border-radius: var(--eg-radius-xs); background: var(--eg-color-surface-brand-soft); color: var(--eg-color-text-link); }
.eg-hub-row__sep { color: var(--eg-color-text-secondary); }
.eg-hub-row__tag2 { color: var(--eg-color-text-secondary); }
.eg-hub-row__title { font: var(--eg-type-heading-h4); letter-spacing: var(--eg-tracking-h4); }
.eg-hub-row__title a { color: var(--eg-color-text-primary); }
.eg-hub-row__title a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.eg-hub-row__title a:focus-visible { outline: none; }
.eg-hub-row__excerpt { font: var(--eg-type-body-sm); color: var(--eg-color-text-secondary); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.eg-hub-row__meta { display: flex; flex-wrap: wrap; gap: 6px 18px; padding-top: 4px; font: var(--eg-type-ui-meta); color: var(--eg-color-text-muted); }
.eg-hub-row__meta > span { display: inline-flex; align-items: center; gap: 6px; }

.eg-hub-more { display: flex; justify-content: center; }
.eg-hub-more__btn { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 22px; border-radius: 10px; background: var(--eg-color-surface-brand-soft); font: var(--eg-type-label-sm); color: var(--eg-color-text-link); }
.eg-hub-more__btn:hover { background: var(--eg-color-border-brand); color: var(--eg-color-brand-primary); }
.eg-hub-more__btn[aria-busy="true"] { opacity: 0.6; }
.eg-hub-sub__col--main .eg-pagination { margin-top: 8px; }

.eg-hub-pop { gap: 0; padding: 19px; }
.eg-hub-pop__title { padding-bottom: 8px; font: var(--eg-type-heading-h5); }
.eg-hub-pop__item { display: flex; align-items: center; gap: 12px; min-height: 39px; padding: 7px 0; border-bottom: 1px solid var(--eg-color-border-default); font: var(--eg-type-body-sm); color: var(--eg-color-text-primary); }
.eg-hub-pop__list li:last-child .eg-hub-pop__item { border-bottom: 0; }
.eg-hub-pop__item:hover { color: var(--eg-color-brand-primary); }
.eg-hub-pop__n { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 24px; height: 24px; border-radius: var(--eg-radius-xs); background: var(--eg-color-surface-brand-soft); font: var(--eg-type-label-xs); letter-spacing: var(--eg-tracking-label-xs); color: var(--eg-color-brand-primary); }
.eg-hub-pop__name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

.eg-hub-suggest { gap: 14px; padding: 18px; }
.eg-hub-suggest__btn {
	display: inline-flex; align-items: center; gap: 10px; align-self: center; min-height: 44px; padding: 0 18px; border-radius: 10px;
	background: var(--eg-color-surface-default); box-shadow: var(--eg-shadow-xs); font: var(--eg-type-label-md); color: var(--eg-color-text-primary);
}
.eg-hub-suggest__btn svg:first-child { color: var(--eg-color-brand-primary); }
.eg-hub-suggest__btn:hover { color: var(--eg-color-brand-primary); }
.eg-hub-buy { gap: 12px; padding: 18px 18px 0; overflow: hidden; }
.eg-hub-buy__foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; }
.eg-hub-buy__foot .eg-hub-navy-btn { margin-bottom: 18px; }
.eg-hub-buy__media { flex: none; width: 50px; height: 70px; overflow: hidden; }
.eg-hub-buy__media img { width: 100%; height: 100%; object-fit: cover; }

.eg-hub-archive { padding-top: 32px; }
.eg-hub-archive .eg-pagination { margin-top: 32px; }
.eg-hub--archive { padding-bottom: 64px; }

/* ---------------------------------------------------------------- Tablet (768–1023) */
@media (max-width: 1023px) {
	.eg-hub-hero, .eg-hub-hero.has-image { display: flex; flex-direction: column; padding-bottom: 28px; }
	.eg-hub-hero__inner, .eg-hub-hero--sub .eg-hub-hero__inner { min-height: 0; padding-bottom: 20px; gap: 26px; }
	.eg-hub-hero__text { max-width: none; }
	.eg-hub-hero__title, .eg-hub-hero--sub .eg-hub-hero__title { font: var(--eg-type-display-lg); letter-spacing: var(--eg-tracking-display-lg); }
	.eg-hub-hero__intro, .eg-hub-hero--sub .eg-hub-hero__intro { font: var(--eg-type-body-lg); max-width: none; }
	.eg-hub-hero__media, .eg-hub-hero--sub .eg-hub-hero__media {
		position: relative; order: 2; width: min(100% - 2 * var(--eg-gutter), var(--eg-container-desktop)); margin-inline: auto;
		aspect-ratio: 704 / 298; border-radius: var(--eg-radius-lg); overflow: hidden;
	}
	.eg-hub-hero__media::before { display: none; }
	.eg-hub--archive .eg-hub-hero { padding-bottom: 0; }

	.eg-hub-strip__list { grid-auto-flow: row; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: visible; }
	.eg-hub-strip .eg-hub-tile__name { white-space: normal; }

	.eg-hub-main { grid-template-columns: minmax(0, 1fr); gap: 32px; padding-top: 32px; }
	.eg-hub-side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px; align-items: start; }
	.eg-hub-grid, .eg-hub-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.eg-hub-gcard .eg-media { height: 140px; }
	.eg-hub-feature__body { max-width: 50%; }

	.eg-hub-rel { margin-block: 40px 56px; }
	.eg-hub-rel__row { display: block; }
	.eg-hub-rel__arrow { display: none; }
	.eg-hub-rel__list, .eg-hub-rel--sub .eg-hub-rel__list { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-columns: auto; gap: 12px; overflow: visible; }
	.eg-hub-rel--sub .eg-hub-rel__card { height: 88px; }
	.eg-hub-rel__card { height: 96px; }

	.eg-hub-cuts__row { display: block; }
	.eg-hub-cuts__list { grid-auto-flow: row; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-columns: auto; gap: 12px; overflow: visible; }
	.eg-hub-cuts__arrow { display: none; }

	.eg-hub-sub { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px; padding-top: 28px; }
	.eg-hub-sub__col { display: contents; }
	.eg-hub-sub > * > *, .eg-hub-sub__col--main > * { grid-column: 1 / -1; }
	.eg-hub-back { order: 1; justify-self: start; grid-column: 1 / -1; }
	.eg-hub-sub__col--main > * { order: 2; }
	.eg-hub-sub__col--right > *, .eg-hub-menu, .eg-hub-promo { grid-column: auto; align-self: start; }
	.eg-hub-sub__col--right > * { order: 3; }
	.eg-hub-menu, .eg-hub-promo { order: 4; }
	.eg-hub-sub__col--right > .eg-hub-suggest, .eg-hub-sub__col--right > .eg-hub-buy { order: 5; }
	.eg-hub-sub .eg-sr { position: absolute !important; }
	.eg-hub-sub__col--main > .eg-hub-list + .eg-hub-more { margin-top: 0; }
	.eg-hub-row__media { width: 200px; height: 122px; }
}

/* ---------------------------------------------------------------- Mobil (≤767) */
@media (max-width: 767px) {
	.eg-hub-hero, .eg-hub-hero.has-image { padding-bottom: 20px; }
	.eg-hub-hero__inner, .eg-hub-hero--sub .eg-hub-hero__inner { gap: 20px; padding-block: 18px 16px; }
	.eg-hub-hero__text, .eg-hub-hero--sub .eg-hub-hero__text { gap: 10px; }
	.eg-hub-hero__title, .eg-hub-hero--sub .eg-hub-hero__title { font: var(--eg-type-mobile-h1); letter-spacing: var(--eg-tracking-mobile-h1); }
	.eg-hub-hero__intro, .eg-hub-hero--sub .eg-hub-hero__intro { font: var(--eg-type-mobile-body); }
	.eg-hub-hero__meta { gap: 6px 20px; padding-top: 4px; }
	.eg-hub-hero__media, .eg-hub-hero--sub .eg-hub-hero__media { aspect-ratio: 358 / 150; }

	.eg-hub-strip__list { gap: 8px; padding: 10px; }
	.eg-hub-strip .eg-hub-tile { gap: 2px; padding: 10px 2px; }
	.eg-hub-strip .eg-hub-tile__media { width: 44px; height: 40px; margin-bottom: 4px; }
	.eg-hub-strip .eg-hub-tile__media--icon { width: 40px; height: 40px; }
	.eg-hub-strip .eg-hub-tile__name { font: var(--eg-type-label-xs); font-size: 12px; line-height: 16px; }
	.eg-hub-strip .eg-hub-tile__count { font: var(--eg-type-body-xs); }

	.eg-hub-filters { flex-wrap: wrap; justify-content: flex-start; }
	.eg-hub-filters__chips { width: 100%; }
	.eg-hub-main { gap: 24px; padding-top: 24px; }
	.eg-hub-main__content { gap: 16px; }
	.eg-hub-side { grid-template-columns: minmax(0, 1fr); }

	.eg-hub-feature { flex-direction: column; align-items: stretch; min-height: 0; }
	.eg-hub-feature__media { position: relative; width: 100%; max-width: none; aspect-ratio: 358 / 190; }
	.eg-hub-feature__media::before { display: none; }
	.eg-hub-feature__body { width: auto; max-width: none; padding: 16px 18px 20px; gap: 10px; }
	.eg-hub-feature__title { font-size: 24px; }
	.eg-hub-feature__excerpt { font: var(--eg-type-body-sm); }

	.eg-hub-grid, .eg-hub-grid--4 { grid-template-columns: minmax(0, 1fr); gap: 16px; }
	.eg-hub-gcard .eg-media { height: 160px; }

	.eg-hub-rel { margin-block: 32px 48px; padding: 16px 16px 16px; }
	.eg-hub-rel__title { padding-left: 0; font: var(--eg-type-mobile-h2); letter-spacing: var(--eg-tracking-mobile-h2); }
	.eg-hub-rel__list, .eg-hub-rel--sub .eg-hub-rel__list { grid-template-columns: minmax(0, 1fr); }
	.eg-hub-rel__card, .eg-hub-rel--sub .eg-hub-rel__card { height: 88px; }
	.eg-hub-rel__media { width: 88px; }
	.eg-hub-rel--sub .eg-hub-rel__media { width: 76px; }

	.eg-hub-cuts__list { gap: 8px; }
	.eg-hub-cuts__item { height: auto; min-height: 96px; padding: 12px 2px 10px; gap: 2px; border-radius: var(--eg-radius-md); }
	.eg-hub-cuts__logo { width: 32px; height: 28px; margin-bottom: 4px; }
	.eg-hub-cuts__img { max-width: 32px; max-height: 28px; }
	.eg-hub-cuts__name { font: 600 12px/16px var(--eg-font-family); }
	.eg-hub-cuts__count { font-size: 12px; }

	.eg-hub-sub { grid-template-columns: minmax(0, 1fr); gap: 16px; padding-top: 20px; }
	.eg-hub-sub__col--right > *, .eg-hub-menu, .eg-hub-promo { grid-column: 1 / -1; }
	.eg-hub-kids { padding: 16px; }
	.eg-hub-kids__title { font: var(--eg-type-mobile-h2); letter-spacing: var(--eg-tracking-mobile-h2); }
	.eg-hub-kids__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.eg-hub-row { gap: 12px; padding: 10px; }
	.eg-hub-row__media { width: 104px; height: 104px; }
	.eg-hub-row__body { gap: 4px; padding-right: 0; }
	.eg-hub-row__title { font: var(--eg-type-heading-h5); font-size: 17px; }
	.eg-hub-row__excerpt, .eg-hub-row__meta > .eg-hub-row__date { display: none; }
	.eg-hub-row__meta { gap: 6px 14px; padding-top: 2px; }
	.eg-hub-promo__media { height: auto; aspect-ratio: 358 / 222; }
}

/* Dar sidebar (04, 288) marka kutusu: başlık h5, ad tek satır */
.eg-hub-brands--sm { padding: 19px; }
.eg-hub-brands--sm .eg-hub-box__title { font: var(--eg-type-heading-h5); letter-spacing: 0; }
.eg-hub-box__head .eg-hub-box__title, .eg-hub-box__link { white-space: nowrap; }
.eg-hub-brands__name { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; overflow-wrap: normal; }