.ar-sek.ar-fragen { padding: 76px 0; }
.ar-fragen__raster { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); margin-top: 44px; }
.ar-frage { padding: 30px 30px 32px; border-right: 1px solid var(--line); display: flex; flex-direction: column; }
.ar-frage:last-child { border-right: 0; }
.ar-frage__nr { font-size: calc(40px * var(--f-zahl)); font-weight: 900; color: var(--magenta); line-height: .8; letter-spacing: -.05em; }
.ar-frage__titel { font-size: calc(21px * var(--f-h3)); margin-top: 16px; letter-spacing: -.025em; line-height: 1.2; }
.ar-frage__text { color: var(--text-2); font-size: calc(16px * var(--f-text)); margin-top: 12px; }
.ar-frage__thema { margin-top: 18px; padding-top: 14px; border-top: 1px solid rgba(65, 64, 66, .12); font-size: calc(14.5px * var(--f-text)); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--anthracite); }
.ar-frage__thema span { color: var(--magenta); }

/* Gleiche Zeilen ueber alle Kacheln: jede Kachel uebernimmt per Subgrid die
   vier Zeilen des Rasters (Nummer, Frage, Text, Thema). Feste Zeilennummern,
   damit ein leeres Nummernfeld die Zuordnung nicht verschiebt. */
@supports (grid-template-rows: subgrid) {
  .ar-frage { display: grid; grid-row: span 4; grid-template-rows: subgrid; row-gap: 0; }
  .ar-frage__nr { grid-row: 1; }
  .ar-frage__titel { grid-row: 2; }
  .ar-frage__text { grid-row: 3; }
  .ar-frage__thema { grid-row: 4; }
}
/* Ohne Subgrid (aeltere Browser): Text waechst, Thema steht unten buendig */
@supports not (grid-template-rows: subgrid) {
  .ar-frage__text { flex: 1 0 auto; }
}

@media (max-width: 1080px) {
  .ar-fragen__raster { grid-template-columns: 1fr; }
  .ar-frage { border-right: 0; border-bottom: 1px solid var(--line); }
  .ar-frage:last-child { border-bottom: 0; }
}
@media (max-width: 860px) {
  .ar-sek.ar-fragen { padding: 60px 0; }
}