/* selcuksports.stream — site-distinct visual identity.
   Light mode. Bosphorus-green/white palette. Serif headlines.
   Tabular content density. Distinct from taraftarium24's dark sans-serif. */

:root {
  --sx-green: #0e8a6f;
  --sx-green-deep: #086654;
  --sx-green-light: #e8f5f1;
  --sx-gold: #c89b3c;
  --sx-ink: #1a1a1a;
  --sx-ink-soft: #4a4a4a;
  --sx-line: #d8dcd9;
  --sx-line-soft: #ecefed;
  --sx-bg: #ffffff;
  --sx-bg-tint: #fafaf7;
  --sx-red: #c1121f;
  --sx-radius: 4px;
  --sx-shadow: 0 1px 2px rgba(0,0,0,0.04);
  --sx-font-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --sx-font-sans: "Source Sans 3", system-ui, -apple-system, sans-serif;
  --sx-max: 1180px;
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body.sx-body {
  margin: 0;
  font-family: var(--sx-font-sans);
  font-size: 16px;
  line-height: 1.55;
  color: var(--sx-ink);
  background: var(--sx-bg);
}

img { max-width: 100%; height: auto; display: block; }

a {
  color: var(--sx-green-deep);
  text-decoration: underline;
  text-decoration-color: rgba(14,138,111,0.3);
  text-underline-offset: 2px;
}
a:hover { text-decoration-color: var(--sx-green); }

h1, h2, h3, h4 {
  font-family: var(--sx-font-serif);
  font-weight: 700;
  line-height: 1.2;
  margin: 0 0 0.6em;
  color: var(--sx-ink);
}
h1 { font-size: 2.1rem; }
h2 { font-size: 1.5rem; }
h3 { font-size: 1.2rem; }
h4 { font-size: 1.05rem; }

p { margin: 0 0 1em; }

ul, ol { margin: 0 0 1em; padding-left: 1.4em; }
li { margin-bottom: 0.25em; }

table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.2em 0;
  font-size: 0.95rem;
}
th, td {
  text-align: left;
  padding: 0.55em 0.8em;
  border-bottom: 1px solid var(--sx-line);
  vertical-align: top;
}
th {
  background: var(--sx-green-light);
  color: var(--sx-green-deep);
  font-weight: 600;
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-bottom: 2px solid var(--sx-green);
}
tbody tr:nth-child(even) { background: var(--sx-bg-tint); }

code, pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.9em;
}

/* Disclaimer */
.sx-disclaimer {
  background: var(--sx-green-light);
  color: var(--sx-green-deep);
  padding: 0.6em 1em;
  font-size: 0.85rem;
  text-align: center;
  border-bottom: 1px solid var(--sx-green);
}
.sx-disclaimer strong { color: var(--sx-green-deep); }

/* Header */
.sx-header {
  background: var(--sx-bg);
  border-bottom: 1px solid var(--sx-line);
}
.sx-header__top {
  background: var(--sx-ink);
  color: #fff;
  font-size: 0.78rem;
  padding: 0.4em 1.2em;
  display: flex;
  justify-content: space-between;
  max-width: var(--sx-max);
  margin: 0 auto;
  letter-spacing: 0.02em;
}
.sx-header__nav {
  max-width: var(--sx-max);
  margin: 0 auto;
  padding: 0.8em 1.2em;
  display: flex;
  align-items: center;
  gap: 1.5em;
}
.sx-logo {
  display: flex;
  align-items: center;
  gap: 0.55em;
  text-decoration: none;
  color: var(--sx-ink);
}
.sx-logo__mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background: var(--sx-green);
  color: var(--sx-gold);
  font-family: var(--sx-font-serif);
  font-weight: 700;
  font-size: 1.4rem;
  border-radius: var(--sx-radius);
}
.sx-logo__text {
  font-family: var(--sx-font-serif);
  font-weight: 700;
  font-size: 1.25rem;
  color: var(--sx-ink);
}
.sx-logo__a { color: var(--sx-green-deep); }
.sx-logo__b { color: var(--sx-ink); }

.sx-nav {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 1.4em;
  margin-left: auto;
}
.sx-nav li { margin: 0; }
.sx-nav a {
  text-decoration: none;
  font-weight: 500;
  font-size: 0.95rem;
  color: var(--sx-ink-soft);
  padding: 0.3em 0;
  border-bottom: 2px solid transparent;
}
.sx-nav a:hover { color: var(--sx-green-deep); border-bottom-color: var(--sx-green); }

.sx-nav-toggle {
  display: none;
  background: none;
  border: 1px solid var(--sx-line);
  padding: 0.4em 0.55em;
  margin-left: auto;
  cursor: pointer;
  border-radius: var(--sx-radius);
}
.sx-nav-toggle span {
  display: block;
  width: 18px;
  height: 2px;
  background: var(--sx-ink);
  margin: 3px 0;
}

/* Breadcrumb */
.sx-breadcrumb {
  max-width: var(--sx-max);
  margin: 0 auto;
  padding: 0.8em 1.2em;
  font-size: 0.85rem;
  color: var(--sx-ink-soft);
}
.sx-breadcrumb ol {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4em;
}
.sx-breadcrumb li:not(:last-child)::after {
  content: " / ";
  color: var(--sx-line);
  margin-left: 0.4em;
}
.sx-breadcrumb a { text-decoration: none; }

/* Main */
.sx-main {
  max-width: var(--sx-max);
  margin: 0 auto;
  padding: 1.5em 1.2em 3em;
}

/* Hero (homepage) — small banner, NOT full-bleed */
.sx-hero {
  background: var(--sx-green);
  color: #fff;
  padding: 2.2em 1.2em;
  margin: -1.5em -1.2em 1.5em;
  border-bottom: 4px solid var(--sx-gold);
}
.sx-hero__inner {
  max-width: var(--sx-max);
  margin: 0 auto;
}
.sx-hero__eyebrow {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--sx-gold);
  margin: 0 0 0.5em;
  font-weight: 600;
}
.sx-hero__title {
  font-family: var(--sx-font-serif);
  font-size: 2.6rem;
  color: #fff;
  margin: 0 0 0.3em;
}
.sx-hero__lede {
  font-size: 1.05rem;
  max-width: 640px;
  margin: 0 0 1.2em;
  color: rgba(255,255,255,0.92);
}
.sx-hero__cta {
  display: flex;
  gap: 0.7em;
  flex-wrap: wrap;
}

.sx-btn {
  display: inline-block;
  padding: 0.6em 1.2em;
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  border-radius: var(--sx-radius);
  border: 1px solid transparent;
  transition: background 0.15s;
}
.sx-btn--primary { background: var(--sx-gold); color: var(--sx-ink); }
.sx-btn--primary:hover { background: #d4a747; }
.sx-btn--ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,0.5); }
.sx-btn--ghost:hover { background: rgba(255,255,255,0.12); }

/* Stat bar */
.sx-stat-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--sx-line);
  border: 1px solid var(--sx-line);
  margin: 0 0 2em;
}
.sx-stat-bar__item {
  background: var(--sx-bg);
  padding: 1em 0.8em;
  text-align: center;
}
.sx-stat-bar__item strong {
  display: block;
  font-family: var(--sx-font-serif);
  font-size: 1.8rem;
  color: var(--sx-green-deep);
  font-weight: 700;
}
.sx-stat-bar__item span {
  font-size: 0.78rem;
  color: var(--sx-ink-soft);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* Widget section */
.sx-widget-section {
  margin: 2em 0;
  background: var(--sx-bg-tint);
  padding: 1.5em;
  border: 1px solid var(--sx-line);
  border-radius: var(--sx-radius);
}
.sx-widget-section__head { margin-bottom: 1em; }
.sx-widget-section__head h2 { margin-bottom: 0.2em; }
.sx-widget-section__head p { color: var(--sx-ink-soft); margin: 0; font-size: 0.92rem; }
.sx-soccer-widget { min-height: 220px; }

/* Broadcasters grid */
.sx-broadcasters { margin: 2.5em 0; }
.sx-broadcasters__head { margin-bottom: 1.2em; }
.sx-broadcasters__head p { color: var(--sx-ink-soft); margin: 0; }
.sx-broadcasters__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1em;
}
.sx-broadcaster-card {
  display: block;
  padding: 1.1em;
  background: var(--sx-bg);
  border: 1px solid var(--sx-line);
  text-decoration: none;
  color: inherit;
  border-radius: var(--sx-radius);
  transition: border-color 0.15s, box-shadow 0.15s;
}
.sx-broadcaster-card:hover {
  border-color: var(--sx-green);
  box-shadow: var(--sx-shadow);
}
.sx-broadcaster-card h3 { margin: 0 0 0.2em; color: var(--sx-green-deep); font-size: 1.1rem; }
.sx-broadcaster-card__type {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--sx-ink-soft);
  margin: 0 0 0.5em;
}
.sx-broadcaster-card__desc { font-size: 0.9rem; margin: 0 0 0.7em; color: var(--sx-ink-soft); }
.sx-broadcaster-card__rights { font-size: 0.85rem; margin: 0; padding-left: 1.1em; color: var(--sx-ink); }

/* Page cards (homepage list) */
.sx-pages { margin-top: 2.5em; }
.sx-pages__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 0.8em;
  margin-top: 1em;
}
.sx-page-card {
  display: block;
  padding: 0.9em 1em;
  background: var(--sx-bg);
  border: 1px solid var(--sx-line);
  text-decoration: none;
  color: var(--sx-ink);
  border-radius: var(--sx-radius);
}
.sx-page-card:hover { border-color: var(--sx-green); background: var(--sx-bg-tint); }
.sx-page-card h3 { font-size: 1rem; margin: 0 0 0.3em; color: var(--sx-green-deep); }
.sx-page-card p { font-size: 0.85rem; margin: 0; color: var(--sx-ink-soft); }

/* Article */
.sx-article { max-width: 760px; margin: 0 auto; }
.sx-article__header { margin-bottom: 1.2em; }
.sx-article__title { font-size: 2.2rem; margin-bottom: 0.3em; }
.sx-article__lede {
  font-size: 1.1rem;
  color: var(--sx-ink-soft);
  font-family: var(--sx-font-serif);
  font-style: italic;
  margin-bottom: 0.6em;
}
.sx-article__meta { font-size: 0.85rem; color: var(--sx-ink-soft); }
.sx-article__sep { margin: 0 0.4em; color: var(--sx-line); }

.sx-article__hero {
  margin: 0 0 1.5em;
  border-radius: var(--sx-radius);
  overflow: hidden;
  border: 1px solid var(--sx-line);
}
.sx-article__hero img { width: 100%; height: auto; aspect-ratio: 1200/627; object-fit: cover; }

.sx-article__body { font-size: 1.02rem; }
.sx-article__body h2 { margin-top: 1.6em; padding-bottom: 0.3em; border-bottom: 1px solid var(--sx-line-soft); }
.sx-article__body h3 { margin-top: 1.4em; color: var(--sx-green-deep); }

/* List page */
.sx-list { max-width: 960px; margin: 0 auto; }
.sx-list__header { margin-bottom: 1.2em; }
.sx-list__title { font-size: 2rem; }
.sx-list__lede { color: var(--sx-ink-soft); font-size: 1.05rem; }
.sx-list__intro { margin-bottom: 1.5em; padding-bottom: 1em; border-bottom: 1px solid var(--sx-line-soft); }
.sx-list__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1em;
}
.sx-list__card {
  padding: 1em;
  background: var(--sx-bg);
  border: 1px solid var(--sx-line);
  border-radius: var(--sx-radius);
}
.sx-list__card:hover { border-color: var(--sx-green); }
.sx-list__card-title { margin: 0 0 0.3em; font-size: 1.1rem; }
.sx-list__card-title a { text-decoration: none; color: var(--sx-green-deep); }
.sx-list__card-desc { font-size: 0.9rem; color: var(--sx-ink-soft); margin: 0 0 0.5em; }
.sx-list__card-meta { font-size: 0.8rem; color: var(--sx-ink-soft); }

/* Related pages — TABULAR (distinct from taraftarium24's card grid) */
.sx-related {
  margin: 2.5em 0 1em;
  padding-top: 1.5em;
  border-top: 2px solid var(--sx-green);
}
.sx-related__title {
  font-size: 1.2rem;
  margin-bottom: 0.6em;
  color: var(--sx-green-deep);
}
.sx-related__table {
  width: 100%;
  font-size: 0.92rem;
}
.sx-related__chip {
  display: inline-block;
  padding: 0.15em 0.5em;
  background: var(--sx-green-light);
  color: var(--sx-green-deep);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  border-radius: 2px;
}
.sx-related__link {
  font-weight: 600;
  text-decoration: none;
  color: var(--sx-ink);
}
.sx-related__link:hover { color: var(--sx-green-deep); text-decoration: underline; text-decoration-color: var(--sx-green); }
.sx-related__label { color: var(--sx-ink-soft); font-size: 0.88rem; }

/* Footer */
.sx-footer {
  background: var(--sx-ink);
  color: #d4d4d4;
  margin-top: 3em;
}
.sx-footer__inner {
  max-width: var(--sx-max);
  margin: 0 auto;
  padding: 2.2em 1.2em 1.2em;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5em;
}
.sx-footer__col h4 {
  color: var(--sx-gold);
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 0.6em;
  font-family: var(--sx-font-sans);
}
.sx-footer__col ul { list-style: none; margin: 0; padding: 0; }
.sx-footer__col li { margin-bottom: 0.35em; }
.sx-footer__col a {
  color: #d4d4d4;
  text-decoration: none;
  font-size: 0.9rem;
}
.sx-footer__col a:hover { color: #fff; text-decoration: underline; }
.sx-footer__legal {
  max-width: var(--sx-max);
  margin: 0 auto;
  padding: 1em 1.2em;
  border-top: 1px solid #333;
  font-size: 0.8rem;
  color: #999;
}
.sx-footer__legal strong { color: var(--sx-gold); }
.sx-footer__bottom {
  max-width: var(--sx-max);
  margin: 0 auto;
  padding: 0.8em 1.2em 1.5em;
  font-size: 0.78rem;
  color: #888;
  border-top: 1px solid #333;
}
.sx-footer__bottom p { margin: 0; }

/* Responsive */
@media (max-width: 768px) {
  .sx-nav-toggle { display: block; }
  .sx-nav {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    flex-direction: column;
    background: var(--sx-bg);
    border-top: 1px solid var(--sx-line);
    padding: 0.8em 1.2em;
    gap: 0;
  }
  .sx-nav--open { display: flex; }
  .sx-nav li { padding: 0.4em 0; border-bottom: 1px solid var(--sx-line-soft); }
  .sx-header__nav { position: relative; }
  .sx-stat-bar { grid-template-columns: repeat(2, 1fr); }
  .sx-footer__inner { grid-template-columns: repeat(2, 1fr); }
  .sx-hero__title { font-size: 2rem; }
  .sx-article__title, .sx-list__title { font-size: 1.7rem; }
  .sx-related__table thead { display: none; }
  .sx-related__row { display: block; padding: 0.6em 0; border-bottom: 1px solid var(--sx-line); }
  .sx-related__row td { display: block; border: none; padding: 0.15em 0; }
}

/* Comparison tables — used heavily in TERSE TURKISH SPORTS-PRESS voice */
.sx-compare {
  width: 100%;
  margin: 1.4em 0;
  font-size: 0.92rem;
  border: 1px solid var(--sx-line);
}
.sx-compare th { background: var(--sx-green); color: #fff; border-bottom-color: var(--sx-gold); }
.sx-compare td { padding: 0.6em 0.8em; }
.sx-compare tbody tr:hover { background: var(--sx-green-light); }

/* Stat block (numbered list with stat-density) */
.sx-stats {
  background: var(--sx-bg-tint);
  border-left: 3px solid var(--sx-green);
  padding: 1em 1.2em;
  margin: 1.2em 0;
}
.sx-stats h3 { margin-top: 0; font-size: 1rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--sx-green-deep); }
.sx-stats ul, .sx-stats ol { margin: 0; padding-left: 1.4em; }
.sx-stats li { margin-bottom: 0.3em; }