/* riport.css — GVM Haus HU riport (article) + homepage teaser card.
   All selectors are prefixed .rp- (article, only on body.rp-page) or .riport-card (homepage card).
   Tokens reuse the site's :root variables (--navy, --red, --beige, --border, --mid, --font). */

/* ========== ARTICLE ========== */
.rp-page { background: #fff; }
.rp-hero { position: relative; min-height: min(86vh, 820px); display: flex; align-items: flex-end; color: #fff; background: #1B2A3B; overflow: hidden; }
.rp-hero-media, .rp-hero-media picture { position: absolute; inset: 0; }
.rp-hero-media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 55%; display: block; transform: scale(1.02); animation: rp-zoom 14s ease-out forwards; }
@keyframes rp-zoom { to { transform: scale(1); } }
.rp-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(16,26,36,0.15) 0%, rgba(16,26,36,0.05) 35%, rgba(16,26,36,0.72) 78%, rgba(16,26,36,0.9) 100%); pointer-events: none; }
.rp-hero-copy { position: relative; z-index: 1; width: 100%; max-width: 1160px; margin: 0 auto; padding: 140px 48px 56px; }
.rp-crumbs { position: static; height: auto; padding: 0; background: none; backdrop-filter: none; display: flex; justify-content: flex-start; gap: 8px; font-size: 13px; color: rgba(255,255,255,0.75); margin-bottom: 18px; }
.rp-crumbs a { color: rgba(255,255,255,0.9); text-decoration: none; }
.rp-crumbs a:hover { text-decoration: underline; }
.rp-kicker { display: inline-flex; align-items: center; gap: 8px; background: var(--red); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; padding: 6px 14px; margin-bottom: 20px; }
.rp-dot { width: 7px; height: 7px; border-radius: 50%; background: #fff; animation: rp-pulse 1.8s ease-in-out infinite; }
@keyframes rp-pulse { 50% { opacity: .35; } }
.rp-hero h1 { font-size: clamp(32px, 5.2vw, 64px); font-weight: 800; line-height: 1.06; letter-spacing: -1.2px; max-width: 18ch; text-wrap: balance; margin-bottom: 20px; text-shadow: 0 2px 24px rgba(0,0,0,.25); }
.rp-byline { display: flex; flex-wrap: wrap; gap: 6px 10px; font-size: 14px; font-weight: 600; color: rgba(255,255,255,0.88); }
.rp-sep { color: var(--red); }

.rp-body { max-width: 720px; margin: 0 auto; padding: 64px 24px 24px; font-size: 18px; line-height: 1.75; color: var(--anthracite); }
.rp-body p { margin-bottom: 1.25em; }
.rp-body .rp-lead { font-size: clamp(20px, 2.1vw, 23px); line-height: 1.6; color: var(--navy); font-weight: 500; padding-left: 20px; border-left: 3px solid var(--red); margin-bottom: 1.6em; }
.rp-body h2 { font-size: clamp(24px, 3vw, 32px); margin: 1.8em 0 .6em; scroll-margin-top: 90px; }
.rp-body h2::before { content: ""; display: block; width: 36px; height: 3px; background: var(--red); margin-bottom: 14px; }

.rp-fig { margin: 36px 0; }
.rp-fig img { width: 100%; height: auto; display: block; border-radius: 4px; background: var(--light); }
.rp-fig figcaption { font-size: 13px; line-height: 1.5; color: var(--mid); margin-top: 10px; padding-left: 10px; border-left: 2px solid var(--border); }
.rp-wide { width: min(960px, calc(100vw - 48px)); margin-left: 50%; transform: translateX(-50%); }
.rp-mid { max-width: 560px; margin-left: auto; margin-right: auto; }
.rp-narrow { max-width: 300px; margin-left: auto; margin-right: auto; }
.rp-narrow img { aspect-ratio: 3 / 5; object-fit: cover; object-position: 50% 40%; }
.rp-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 36px 0; width: min(800px, calc(100vw - 48px)); margin-left: 50%; transform: translateX(-50%); }
.rp-pair .rp-fig { margin: 0; }
.rp-pair img { aspect-ratio: 3 / 4; object-fit: cover; }
.rp-float { float: right; width: 280px; margin: 6px 0 20px 28px; }
.rp-float img { aspect-ratio: 2 / 3; object-fit: cover; }
.rp-body h2 { clear: both; }

.rp-quote { clear: both; margin: 48px 0; padding: 26px 0 26px 64px; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); position: relative; }
.rp-quote::before { content: "„"; position: absolute; left: 0; top: 4px; font-size: 88px; line-height: 1; font-weight: 800; color: var(--red); }
.rp-quote p { margin: 0; font-size: clamp(22px, 2.6vw, 28px); line-height: 1.35; font-weight: 700; color: var(--navy); letter-spacing: -0.3px; }
@media (max-width: 700px) { .rp-quote { padding-left: 48px; } .rp-quote::before { font-size: 68px; } }

.rp-note { max-width: 720px; margin: 8px auto 0; padding: 0 24px; }
.rp-note p { font-size: 13px; line-height: 1.55; color: var(--mid); padding: 14px 16px; background: var(--light); border-radius: 4px; }

.rp-note .rp-credit { display: block; margin-top: 4px; font-weight: 600; color: var(--anthracite); }

.rp-cta { padding: 56px 24px 88px; }
.rp-cta-inner { max-width: 720px; margin: 0 auto; background: var(--navy); color: #fff; border-radius: 4px; padding: 36px; position: relative; overflow: hidden; }
.rp-cta-inner::after { content: ""; position: absolute; right: -60px; top: -60px; width: 180px; height: 180px; border: 28px solid rgba(200,35,44,.9); border-radius: 50%; opacity: .25; }
.rp-cta-title { font-size: clamp(22px, 3vw, 30px); font-weight: 800; letter-spacing: -0.4px; margin-bottom: 22px; }
.rp-cta-actions { display: flex; flex-wrap: wrap; gap: 12px; position: relative; z-index: 1; }

@media (max-width: 900px) {
  .rp-hero-copy { padding: 120px 20px 36px; }
  .rp-body { padding-top: 44px; font-size: 17px; }
  .rp-float { float: none; width: auto; max-width: 340px; margin: 32px auto; }
}
@media (max-width: 700px) {
  .rp-hero { min-height: 88vh; }
  .rp-hero-media img { object-position: 50% 40%; }
  .rp-pair { grid-template-columns: 1fr 1fr; gap: 8px; }
  .rp-pair figcaption { font-size: 12px; }
  .rp-cta-inner { padding: 28px 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .rp-hero-media img, .rp-dot { animation: none; transform: none; }
}

/* ========== HOMEPAGE TEASER CARD (hu/index.html) ========== */
.riport-band { padding: 72px 48px; background: var(--beige); }
.riport-card { max-width: 1160px; margin: 0 auto; display: grid; grid-template-columns: 1.15fr 1fr; background: #fff; border-radius: 4px; overflow: hidden; text-decoration: none; color: inherit; box-shadow: 0 1px 0 var(--border), 0 18px 40px -24px rgba(45,62,80,.45); transition: transform .25s ease, box-shadow .25s ease; }
.riport-card:hover { transform: translateY(-3px); box-shadow: 0 1px 0 var(--border), 0 26px 50px -24px rgba(45,62,80,.55); }
.riport-card:focus-visible { outline: 3px solid var(--navy); outline-offset: 4px; }
.riport-card-media { position: relative; overflow: hidden; min-height: 340px; background: #1B2A3B; }
.riport-card-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s ease; }
.riport-card:hover .riport-card-media img { transform: scale(1.04); }
.riport-card-flag { position: absolute; left: 16px; top: 16px; z-index: 1; display: inline-flex; align-items: center; gap: 8px; background: var(--red); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; padding: 6px 12px; }
.riport-card-flag i { width: 7px; height: 7px; border-radius: 50%; background: #fff; animation: rp-pulse 1.8s ease-in-out infinite; }
.riport-card-body { padding: 40px 40px 36px; display: flex; flex-direction: column; justify-content: center; }
.riport-card-kicker { font-size: 11px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase; color: var(--red); margin-bottom: 14px; }
.riport-card-title { font-size: clamp(24px, 2.8vw, 34px); font-weight: 800; line-height: 1.12; letter-spacing: -0.6px; color: var(--navy); margin-bottom: 16px; text-wrap: balance; }
.riport-card-lead { font-size: 16px; line-height: 1.65; color: var(--mid); margin-bottom: 18px; }
.riport-card-meta { font-size: 13px; font-weight: 600; color: var(--anthracite); margin-bottom: 24px; }
.riport-card-go { align-self: flex-start; display: inline-flex; align-items: center; gap: 10px; font-weight: 700; font-size: 15px; color: var(--navy); padding-bottom: 4px; border-bottom: 2px solid var(--red); }
.riport-card-go span { transition: transform .2s ease; }
.riport-card:hover .riport-card-go span { transform: translateX(4px); }
@media (max-width: 900px) {
  .riport-band { padding: 48px 20px; }
  .riport-card { grid-template-columns: 1fr; }
  .riport-card-media { min-height: 0; aspect-ratio: 4 / 3; }
  .riport-card-body { padding: 26px 22px 28px; }
}
@media (prefers-reduced-motion: reduce) {
  .riport-card, .riport-card-media img, .riport-card-go span { transition: none; }
  .riport-card-flag i { animation: none; }
}