/* © 2026 Dennis Andres */
.news-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--cc-gap); }
.news-card { display: flex; flex-direction: column; overflow: hidden; padding: 0; }
.news-card.is-lead { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); }
.news-card-media { aspect-ratio: 16 / 9; overflow: hidden; background: var(--cc-plum-deep); }
.news-card.is-lead .news-card-media { aspect-ratio: auto; min-height: 320px; }
.news-card-media img { width: 100%; height: 100%; object-fit: cover; transition: scale var(--cc-dur-slow) var(--cc-ease); }
.news-card:hover .news-card-media img { scale: 1.04; }
.news-card-body { display: grid; align-content: start; gap: 12px; padding: clamp(20px, 2.4vw, 30px); }
.news-card.is-lead .news-card-body { align-content: center; }
.news-card.is-lead .card-title { font-size: var(--cc-fs-h2); }
.news-link::after { content: ""; position: absolute; z-index: 2; inset: 0; }
.news-link:focus-visible { outline: none; }
.news-more { color: var(--cc-pink-soft); font-size: .875rem; font-weight: 800; }
.news-more::after { content: ""; display: inline-block; width: 7px; height: 7px; margin-left: 8px; border-top: 2px solid currentColor; border-right: 2px solid currentColor; rotate: 45deg; translate: 0 -1px; transition: translate var(--cc-dur) var(--cc-ease); }
.news-card:hover .news-more::after { translate: 4px -1px; }
.news-empty { display: grid; justify-items: start; gap: 14px; max-width: 720px; }
.news-feed { margin-top: 28px; }
.news-feed a, .news-meta { color: var(--cc-on-sky); font-weight: 800; }
.news-prose .news-meta { color: var(--cc-pink-soft); font-size: .875rem; }
.news-body { display: grid; gap: var(--cc-gap); }
.news-cover-frame { width: min(920px, 100%); margin: 0 auto; overflow: hidden; border-radius: var(--cc-r-xl); box-shadow: 0 46px 90px -40px rgba(22, 9, 29, .85); }
.news-cover-frame img { width: 100%; height: auto; }
.news-back { width: min(920px, 100%); margin-inline: auto; }
.pager { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 30px; color: var(--cc-on-sky); font-weight: 800; }

.faction-toc { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: clamp(24px, 3vw, 36px); }
.faction-toc a { padding: 6px 0; color: var(--cc-on-sky); font-size: .9375rem; font-weight: 800; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 5px; transition: color var(--cc-dur) ease; }
.faction-toc a:hover { color: #7d0c49; }
.faction-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--cc-gap); }
.faction-public { display: grid; align-content: start; gap: 14px; padding: clamp(22px, 2.6vw, 32px); scroll-margin-top: calc(var(--cc-header) + 24px); }
.faction-head { display: grid; justify-items: start; gap: 10px; }
.faction-kind { display: inline-flex; color: #8fe3f7; font-size: .75rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.faction-public.is-illegal .faction-kind { color: var(--cc-pink-soft); }
.faction-public.is-unternehmen .faction-kind { color: var(--lime); }
.faction-protected { margin-left: 8px; }
.faction-text { color: var(--cc-snow-soft); line-height: 1.7; overflow-wrap: anywhere; }
.faction-text :is(h1, h2, h3, h4) { margin: 16px 0 8px; color: #fff; font-size: 1.1rem; }
.faction-text :is(p, ul, ol) { margin: 0 0 10px; }
.faction-text :is(ul, ol) { padding-left: 22px; }
.faction-text a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.faction-text strong { color: #fff; }
.faction-rules { border-top: 1px solid var(--cc-line); }
.faction-rules > summary { padding: 14px 0 6px; color: #fff; font-weight: 800; cursor: pointer; }

.contact-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); align-items: start; gap: var(--cc-gap); }
.contact-form { display: grid; gap: 16px; max-width: none; }
.contact-form .card-title { margin-bottom: 4px; }
.field-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.field { display: grid; gap: 8px; }
.field label { color: #fff; font-size: .875rem; font-weight: 800; }
.field :is(input, textarea, select), .contact-form :is(input, textarea, select) { width: 100%; min-height: 50px; padding: 13px 16px; border: 1px solid var(--cc-line-strong); border-radius: 14px; color: #fff; background: rgba(255, 255, 255, .06); transition: border-color var(--cc-dur) ease, background-color var(--cc-dur) ease; }
.field textarea, .contact-form textarea { min-height: 160px; resize: vertical; }
.field :is(input, textarea, select):focus, .contact-form :is(input, textarea, select):focus { border-color: var(--cyan); background-color: rgba(255, 255, 255, .09); outline: none; }
.field select option { color: var(--cc-ink); }
.field .muted, .form-note { color: var(--cc-snow-soft); font-size: .8125rem; line-height: 1.6; }
.form-note a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.contact-form .btn { justify-self: start; }
.form-errors { margin: 0 0 18px; padding: 16px 22px 16px 40px; border: 1px solid rgba(255, 59, 141, .5); border-radius: var(--cc-r); color: #ffd2e4; background: rgba(36, 10, 30, .9); }
.contact-aside { display: grid; gap: 16px; padding: clamp(22px, 2.6vw, 32px); }
.contact-ways { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.contact-ways li { display: grid; gap: 4px; padding: 14px 16px; border-radius: 14px; background: rgba(255, 255, 255, .06); }
.contact-ways strong { color: #fff; }
.contact-ways span { color: var(--cc-snow-soft); font-size: .9375rem; }
.contact-ways a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }

.error-page { min-height: 72svh; display: grid; align-items: center; }
.error-card { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .8fr); align-items: center; gap: 24px; overflow: hidden; padding: clamp(28px, 4.4vw, 64px); }
.error-code { position: absolute; z-index: -1; right: -12px; bottom: -40px; color: transparent; font-size: clamp(9rem, 6rem + 12vw, 18rem); font-weight: 900; letter-spacing: -.08em; line-height: .8; -webkit-text-stroke: 2px rgba(255, 140, 192, .22); }
.error-copy { display: grid; justify-items: start; gap: 16px; }
.error-copy h1 { color: #fff; font-size: var(--cc-fs-h1); }
.error-copy .lead { color: var(--cc-snow-soft); }
.error-links { display: flex; flex-wrap: wrap; gap: 8px; }
.error-links a { padding: 6px 0; color: #fff; font-size: .9375rem; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; transition: color var(--cc-dur) ease; }
.error-links a:hover { color: var(--cc-pink-soft); }
.error-art { width: 100%; height: auto; animation: error-fly 6s ease-in-out infinite alternate; }
@keyframes error-fly { from { translate: -10px 8px; rotate: -2deg; } to { translate: 14px -10px; rotate: 1deg; } }

@media (max-width: 1023px) {
  .news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .news-card.is-lead { grid-template-columns: minmax(0, 1fr); }
  .contact-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
  .news-grid, .faction-grid, .field-row { grid-template-columns: minmax(0, 1fr); }
  .news-card.is-lead .news-card-media { min-height: 0; aspect-ratio: 16 / 9; }
  .error-card { grid-template-columns: minmax(0, 1fr); }
  .error-art { width: 80%; justify-self: end; }
}