/* ═══════════════════════════════════════════════════════════════════════
   BRUTAL-GRID — harter, fotojournalistischer Look
   Geladen wenn theme_pack = 'brutal-grid'.
   Scoped an body.theme-brutal-grid damit es nur wirkt wo aktiviert.
   DNA-Marker: keine Rundungen, keine Shadows, Uppercase, 1px-Borders,
   Grayscale-Covers mit Farbe-bei-Hover, 2px-Mosaik-Gaps, Monospace-Meta.
   ═══════════════════════════════════════════════════════════════════════ */

body.theme-brutal-grid {
  --radius-sm: 0;
  --radius-md: 0;
  --radius-lg: 0;
  --radius-xl: 0;
  --shadow-card: none;
  --shadow-hover: none;
  --grid-gap: 2px;
}

/* Alles eckig */
body.theme-brutal-grid *,
body.theme-brutal-grid *::before,
body.theme-brutal-grid *::after {
  border-radius: 0 !important;
}

/* Uppercase-Treatments fuer alles was "label"-haft ist */
body.theme-brutal-grid .site-nav__link,
body.theme-brutal-grid .hero__badge,
body.theme-brutal-grid .section__title,
body.theme-brutal-grid .hero__btn,
body.theme-brutal-grid .btn,
body.theme-brutal-grid .taxonomy-pill,
body.theme-brutal-grid .filter-pill {
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-weight: 700;
}

/* Monospace fuer Meta-Daten (Laufzeit, Jahr, Rating) */
body.theme-brutal-grid .film-card__meta,
body.theme-brutal-grid .film-card-ext__meta,
body.theme-brutal-grid .hero__meta,
body.theme-brutal-grid .hero__meta-item,
body.theme-brutal-grid time,
body.theme-brutal-grid .meta,
body.theme-brutal-grid .stats,
body.theme-brutal-grid .stats-summary {
  font-family: 'JetBrains Mono', 'Courier New', 'Courier', monospace;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Cards: 1px-Rahmen, keine Shadows, keine Scale-Hovers */
body.theme-brutal-grid .film-card,
body.theme-brutal-grid .film-card-ext {
  border: 1px solid rgba(255,255,255,0.12);
  background: transparent;
  transition: border-color .2s ease;
}
body.theme-brutal-grid .film-card:hover,
body.theme-brutal-grid .film-card-ext:hover {
  transform: none !important;
  box-shadow: none !important;
  border-color: var(--color-accent, #c0392b);
  z-index: auto !important;
}

/* Grayscale-Cover: Farbe erst auf Hover */
body.theme-brutal-grid .film-card__image img,
body.theme-brutal-grid .film-card-ext__image img {
  filter: grayscale(100%) contrast(1.08);
  transition: filter .45s ease !important;
}
body.theme-brutal-grid .film-card:hover .film-card__image img,
body.theme-brutal-grid .film-card-ext:hover .film-card-ext__image img {
  filter: grayscale(0%) contrast(1.05);
}

/* 2px-Mosaik-Gaps */
body.theme-brutal-grid .film-grid,
body.theme-brutal-grid .carousel__track,
body.theme-brutal-grid .fp-grid,
body.theme-brutal-grid .tax-grid {
  gap: 2px !important;
}

/* Nav-Links mit harten Separatoren statt Hintergrund-Pills */
body.theme-brutal-grid .site-nav__link {
  border-right: 1px solid rgba(255,255,255,0.08);
  padding-left: 16px;
  padding-right: 16px;
  font-size: 12px;
}
body.theme-brutal-grid .site-nav__link:last-child {
  border-right: none;
}
body.theme-brutal-grid .site-nav__link--active {
  background: transparent;
  color: var(--color-accent, #c0392b);
  border-bottom: 2px solid var(--color-accent, #c0392b);
}

/* Header-Titel aggressiv */
body.theme-brutal-grid .site-header__title {
  text-transform: uppercase;
  letter-spacing: -0.01em;
  font-weight: 900;
}
body.theme-brutal-grid .site-header__title a {
  color: #fff;
  border-left: 4px solid var(--color-accent, #c0392b);
  padding-left: 12px;
}

/* Hero brutaler: harter Text, kein Gradient-Softening */
body.theme-brutal-grid .hero__title {
  text-transform: uppercase;
  font-weight: 900;
  letter-spacing: -0.02em;
  line-height: 0.95;
}
body.theme-brutal-grid .hero__badge {
  background: var(--color-accent, #c0392b);
  color: #fff;
  padding: 6px 14px;
  font-weight: 900;
  font-size: 10px;
}
body.theme-brutal-grid .hero__btn {
  font-weight: 900;
  border: 2px solid transparent;
}
body.theme-brutal-grid .hero__btn--secondary {
  background: transparent;
  border-color: #fff;
}
body.theme-brutal-grid .hero__btn--primary:hover {
  background: transparent;
  border-color: var(--color-accent, #c0392b);
  color: var(--color-accent, #c0392b);
  box-shadow: none;
}

/* Section-Titel: harte Unterstreichung, kein Fluff */
body.theme-brutal-grid .section__title {
  font-size: clamp(18px, 2.6vw, 28px);
  font-weight: 900;
  padding-bottom: 8px;
  margin-bottom: 20px;
  border-bottom: 2px solid var(--color-accent, #c0392b);
  display: flex;
  align-items: baseline;
  gap: 12px;
}
body.theme-brutal-grid .section__title::before {
  content: '//';
  color: var(--color-accent, #c0392b);
  font-family: 'JetBrains Mono', 'Courier New', monospace;
  font-weight: 400;
}

/* Search-Form rechteckig */
body.theme-brutal-grid .search-form__input,
body.theme-brutal-grid .search-form__button {
  border-radius: 0 !important;
}

/* Footer nuechterner */
body.theme-brutal-grid .site-footer {
  border-top: 1px solid rgba(255,255,255,0.12);
}

/* Hero-flat: wenn hero_style=flat, Bild entfernen */
body.theme-brutal-grid.hero-flat .hero__backdrop,
body.theme-brutal-grid.hero-flat .hero__gradient {
  display: none;
}
body.theme-brutal-grid.hero-flat .hero {
  background: var(--color-bg, #0a0a12);
  border-bottom: 1px solid rgba(255,255,255,0.12);
}

/* Taxonomy-Term-Pills: rechteckig, border-only */
body.theme-brutal-grid .tax-pill,
body.theme-brutal-grid .taxonomy-pill,
body.theme-brutal-grid .filter-pill,
body.theme-brutal-grid .tag-badge {
  background: transparent !important;
  border: 1px solid rgba(255,255,255,0.25) !important;
  color: rgba(255,255,255,0.9) !important;
  padding: 4px 10px;
}
body.theme-brutal-grid .tax-pill:hover,
body.theme-brutal-grid .taxonomy-pill:hover,
body.theme-brutal-grid .tag-badge:hover {
  border-color: var(--color-accent, #c0392b) !important;
  color: var(--color-accent, #c0392b) !important;
}

/* Links bekommen harte Unterstreichung */
body.theme-brutal-grid main a:not(.film-card__link):not(.film-card-ext__link):not(.site-nav__link):not(.hero__btn):not(.btn):hover {
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 2px;
  text-decoration-color: var(--color-accent, #c0392b);
}