/* landtag.frank-kemper.com – Onlinefassung von Franks Bewerbung für die Landesliste (seit 02.11.2026).
   Keine fremden Schriften: Systemschrift wie in der Word-Datei (Arial/Helvetica). Farben wie in der Bewerbung. */
:root {
  color-scheme: light;
  --violett: #792351; --violett-dunkel: #5e1a3f; --pink: #b11949; --orange: #f49800; --kasten: #f6ecf1;
  --tinte: #1f1f22; --leise: #5c5c66; --papier: #ffffff; --grund: #f4f1f3;
  --text: Arial, Helvetica, "Liberation Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--grund); color: var(--tinte); font-family: var(--text); font-size: 18px; line-height: 1.6; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--violett); text-underline-offset: .18em; }
a:hover { color: var(--pink); }
:focus-visible { outline: 3px solid var(--orange); outline-offset: 2px; }
p { margin: 0 0 1em; }

.blatt { max-width: 1060px; margin: 0 auto; background: var(--papier); }

/* Kopf: Foto (freigestellt) auf Violett, Name und Bewerbung */
.kopf { background: var(--violett); color: #fff; padding: 22px 22px 0; display: flex; flex-direction: column; align-items: center; }
.kopf .foto { width: min(280px, 72vw); }
.kopf .foto.mit-rand { border-radius: 6px; margin-bottom: 18px; }
.titel { background: var(--papier); padding: 20px 22px 4px; }
h1 { color: var(--violett); font-size: 2.1rem; line-height: 1.1; margin: 0 0 .25em; letter-spacing: -.01em; }
.unterzeile { color: var(--pink); font-weight: 700; font-size: 1.12rem; line-height: 1.35; margin: 0;
  padding-bottom: .7em; border-bottom: 3px solid var(--orange); }
.sprung { font-size: .95rem; margin: .8em 0 0; }

/* Direktkandidatur (nur online, Frank 08.11.2026) */
.direkt { margin: 14px 22px 4px; padding: .8em 1em .9em; background: var(--violett); color: #fff; border-radius: 6px;
  border-left: 8px solid var(--orange); }
.direkt-marke { display: inline-block; margin: 0 0 .45em; padding: .1em .6em; background: var(--orange); color: var(--violett-dunkel);
  font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; border-radius: 3px; }
.direkt h2 { margin: 0 0 .35em; font-size: 1.3rem; line-height: 1.2; color: #fff; }
.direkt p:last-child { margin: 0; }

/* Text */
.text { padding: 14px 22px 8px; }
.text strong { color: var(--violett); }
.text .hervor { background: var(--kasten); border-left: 6px solid var(--pink); padding: .7em .9em; font-size: 1.04em; }
.text .hervor strong { color: var(--pink); }
.gruss { margin-bottom: .2em; }
.name { color: var(--violett); font-weight: 700; }

/* Werdegang (Seitenspalte der Word-Datei) */
.spalte { background: var(--violett); color: #fff; padding: 8px 22px 26px; font-size: .95rem; line-height: 1.45; }
.spalte h2 { color: var(--orange); text-transform: uppercase; font-size: 1rem; letter-spacing: .02em; margin: 1.3em 0 .6em;
  padding-bottom: .25em; border-bottom: 1px solid var(--orange); }
.spalte ul { list-style: none; margin: 0; padding: 0; }
.spalte li { margin: 0 0 .65em; }
.spalte .zeit { display: block; font-weight: 700; }
.spalte a { color: #fff; }

.fuss { padding: 18px 22px 30px; font-size: .9rem; color: var(--leise); }
.fuss a { color: var(--leise); }
.fuss p { margin: 0 0 .5em; }

/* Breite Bildschirme: wie das Blatt – Spalte links, Text rechts */
@media (min-width: 860px) {
  body { padding: 28px 0; }
  .blatt { display: grid; grid-template-columns: 320px 1fr; grid-template-rows: auto 1fr auto;
    box-shadow: 0 2px 30px rgba(60, 20, 40, .12); }
  .kopf { grid-column: 1; grid-row: 1; padding: 28px 26px 0; }
  .kopf .foto { width: 100%; }
  .haupt { grid-column: 2; grid-row: 1 / 3; }
  .titel { padding: 30px 38px 4px; }
  .text { padding: 16px 38px 0; }
  .direkt { margin: 18px 38px 4px; }
  .spalte { grid-column: 1; grid-row: 2 / 4; padding: 0 26px 30px; }
  .fuss { grid-column: 2; grid-row: 3; padding: 10px 38px 30px; }
  .sprung { display: none; }
  h1 { font-size: 2.6rem; }
}

/* Impressum, Datenschutz */
.seite { max-width: 760px; margin: 0 auto; background: var(--papier); padding: 26px 22px 34px; }
.seite h1 { font-size: 1.8rem; }
.seite h2 { color: var(--violett); font-size: 1.15rem; margin: 1.4em 0 .4em; }
.zurueck { font-size: .95rem; margin-bottom: 1.2em; }

@media print {
  body { background: #fff; padding: 0; }
  .blatt { box-shadow: none; }
  .sprung, .fuss { display: none; }
}
