@import url("fonts.css?v=20261017a"); /* Versionszusatz mit VERSION in build.py erhöhen */

/* Corporate Design 2.0.2 (KRNR-Brand/KRNR-CD.md, Stand 17.10.2026).
   Leinen als Grund, Tinte als Text, Indigo für Marke und Links, Indigo dunkel nur für das Kapitelband mit Foto
   und die Fußzeile. Messing nur als Schlusspunkt der Headlines und als der eine Datenpunkt, Altgold nur auf Indigo dunkel.
   Source Serif 4 für Headlines, Kennzahlen und Zitate, Schibsted Grotesk für Text. Keine Dachzeilen, keine Linien unter
   Headlines, keine Karten, Schatten, Verläufe, runden Ecken. */
:root {
  --leinen: #F1F0EC;
  --tinte: #151A29;
  --grau: #5E6370;
  --linie: #D9D8D2;
  --indigo: #1E346B;
  --indigo-dunkel: #101F45;
  --indigo-hell: #5672B5;
  --indigo-ton: #C8D1E5;
  --linie-dunkel: #2F4078;
  --nebel: #B7C0D8;
  --messing: #AD811F;
  --altgold: #D4A736;
  --serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --text: "Schibsted Grotesk", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  margin: 0;
  font-family: var(--text);
  font-weight: 400;
  color: var(--tinte);
  background: var(--leinen);
  -webkit-font-smoothing: antialiased;
  line-height: 1.5;
  overflow-x: hidden;
}
a { color: var(--indigo); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { color: var(--tinte); }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 3px solid var(--indigo); outline-offset: 2px; }
img { max-width: 100%; display: block; }
picture { display: contents; }
picture > source { display: none; }
figure { margin: 0; }
h1, h2, h3 { font-family: var(--serif); font-weight: 700; margin: 0; letter-spacing: -0.01em; color: var(--tinte); }
h1, h2, h3 { text-wrap: balance; }
h1, h2 { hyphens: auto; -webkit-hyphens: auto; hyphenate-limit-chars: 12 5 5; overflow-wrap: break-word; }
p { margin: 0; }
.punkt { color: var(--messing); }

.wrap { max-width: 1240px; margin: 0 auto; padding: 0 48px; }

/* Schaltflächen: dünn umrandet, ohne Füllung, Normalschreibung, mindestens 44 px hoch */
.btn {
  display: inline-flex; align-items: center; justify-content: center; text-align: center;
  min-height: 48px; padding: 0 22px; border-radius: 0; border: 1.5px solid var(--indigo); background: transparent;
  font-family: var(--text); font-size: 16px; font-weight: 500; line-height: 1.2; color: var(--indigo);
  text-decoration: none; cursor: pointer;
}
.btn:hover { border-color: var(--tinte); color: var(--tinte); }
.btn-small { min-height: 44px; padding: 0 18px; font-size: 15px; }
.actions { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }

/* Kopfzeile */
.nav { border-bottom: 1px solid var(--linie); background: var(--leinen); position: sticky; top: 0; z-index: 10; }
.nav .wrap { height: 80px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: flex; align-items: center; text-decoration: none; }
.brand img { height: 30px; width: auto; }
.nav-links { display: flex; align-items: center; gap: 28px; font-size: 15px; font-weight: 500; }
.nav-links > a:not(.btn) { color: var(--tinte); text-decoration: none; }
.nav-links > a:not(.btn):hover { color: var(--indigo); text-decoration: underline; }
.lang { display: flex; gap: 14px; font-size: 14px; font-weight: 500; color: var(--grau); }
.lang span { color: var(--tinte); }
.lang a { color: var(--grau); text-decoration: none; }
.lang a:hover { color: var(--tinte); text-decoration: underline; }
.nav-toggle { display: none; background: none; border: none; font: inherit; font-size: 15px; font-weight: 500; color: var(--tinte); cursor: pointer; min-height: 44px; padding: 0; }

/* Kopfbereich: Text links, Freisteller rechts aus der Indigo-dunkel-Fläche */
.hero { overflow-x: clip; }
.hero .wrap { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 56px; align-items: end; padding-top: 80px; padding-bottom: 64px; }
.hero-text { display: flex; flex-direction: column; gap: 26px; min-width: 0; }
.hero h1 { font-size: 58px; line-height: 1.1; }
.hero .lead { font-size: 19px; line-height: 1.55; max-width: 58ch; }
.hero-foto { position: relative; margin-top: 110px; height: 400px; background: var(--indigo-dunkel); }
.hero-foto img { position: absolute; bottom: 0; left: -12%; width: 124%; max-width: none; height: auto; }

/* Kennzahlen */
.proof { border-top: 1px solid var(--linie); border-bottom: 1px solid var(--linie); }
.proof .wrap { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 48px; padding-top: 36px; padding-bottom: 36px; }
.proof strong, .findings strong, .kz strong { display: block; font-family: var(--serif); font-weight: 700; font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; color: var(--tinte); letter-spacing: -0.01em; }
.proof strong { font-size: 52px; line-height: 1; margin-bottom: 10px; }
.proof span { font-size: 15px; line-height: 1.5; color: var(--tinte); }

/* Referenzzeile */
.stages .wrap { display: flex; flex-direction: column; gap: 14px; padding-top: 36px; padding-bottom: 36px; }
.stages-label { font-size: 14px; color: var(--grau); }
.stages ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 44px; font-size: 18px; font-weight: 600; color: var(--grau); }
.stages ul li { display: flex; align-items: center; height: 30px; }
.stages ul img { height: 100%; width: auto; max-width: 150px; object-fit: contain; object-position: left center; filter: grayscale(1); opacity: 0.6; }
.stages ul li.mehr { font-size: 15px; font-weight: 400; color: var(--grau); }

/* Abschnitte */
.section { border-top: 1px solid var(--linie); }
.section .wrap { padding-top: 72px; padding-bottom: 72px; display: flex; flex-direction: column; gap: 44px; }
.section-head { display: flex; flex-direction: column; gap: 18px; max-width: 860px; }
.section-head-row { max-width: none; flex-direction: row; justify-content: space-between; align-items: flex-end; gap: 40px; }
.section-head-row > div { display: flex; flex-direction: column; gap: 18px; }
.section h2 { font-size: 40px; line-height: 1.14; }
.sub { font-size: 19px; line-height: 1.55; max-width: 62ch; }
.small { font-size: 14px; line-height: 1.6; color: var(--grau); }
.small a { color: var(--grau); }
.more { font-size: 16px; font-weight: 500; white-space: nowrap; }
.box { border-top: 1px solid var(--linie); padding-top: 32px; }
figcaption { font-size: 13px; line-height: 1.4; color: var(--grau); }

/* Keynotes: Liste mit Haarlinien statt Karten */
.topics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 40px; }
.topic { display: flex; flex-direction: column; gap: 14px; padding-top: 22px; border-top: 1px solid var(--linie); }
.topic-wide { grid-column: span 2; }
.topic-top { display: flex; align-items: baseline; gap: 14px; }
.num { font-family: var(--serif); font-weight: 700; font-variant-numeric: tabular-nums; font-size: 18px; color: var(--indigo); }
.tag { font-size: 14px; font-weight: 500; color: var(--grau); }
.topic h3 { font-size: 24px; line-height: 1.2; }
.topic-wide h3 { font-size: 30px; }
.topic p { font-size: 16px; line-height: 1.6; }
.fit { margin-top: auto; font-size: 14px; line-height: 1.5; color: var(--grau); }
.fit span { font-weight: 600; color: var(--tinte); margin-right: 6px; }
.formats { display: flex; flex-direction: column; gap: 22px; padding-top: 28px; border-top: 1px solid var(--linie); }
.formats-label { font-size: 17px; font-weight: 600; }
.formats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
.format-title { font-weight: 600; font-size: 17px; margin-bottom: 8px; }
.formats-grid p { font-size: 15px; line-height: 1.6; }
.formats-foot { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.formats-foot p { font-size: 16px; line-height: 1.6; }

/* Auf der Bühne: auf Leinen, Bildunterschrift unter dem Bild */
.stage-top { display: grid; grid-template-columns: 2fr 1fr; gap: 24px; align-items: start; }
.stage-side { display: grid; grid-template-rows: auto auto; gap: 24px; }
.gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; }
.shot { display: flex; flex-direction: column; gap: 10px; }
.shot img { width: 100%; height: auto; object-fit: cover; }
.shot-main img { aspect-ratio: 16 / 9; }
.shot-side img { aspect-ratio: 16 / 9; }
.shot-gallery img { aspect-ratio: 3 / 2; }
.shot figcaption { font-size: 14px; color: var(--grau); }
.shot .kind { font-weight: 600; color: var(--tinte); }
.shot .credit { display: block; font-size: 12px; color: var(--grau); }

/* Stimmen */
.quotes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; }
.quote { display: flex; flex-direction: column; gap: 18px; padding-top: 22px; border-top: 1px solid var(--linie); }
.quote blockquote { margin: 0; font-family: var(--serif); font-style: italic; font-weight: 600; font-size: 18px; line-height: 1.5; color: var(--tinte); }
.quote figcaption { display: flex; flex-direction: column; gap: 2px; font-size: 14px; font-weight: 600; color: var(--tinte); }
.quote figcaption span { font-weight: 400; color: var(--grau); }

/* Report */
.report-top { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 64px; align-items: start; }
.cover { width: 280px; height: auto; aspect-ratio: 900 / 1273; border: 1px solid var(--linie); }
.report-text { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.wordmark { height: 30px; width: auto; align-self: flex-start; }
.report .report-text h2 { font-size: 44px; }
.facts { font-size: 15px; line-height: 1.7; color: var(--grau); }
.punktreihe { display: flex; gap: 10px; align-items: center; }
.punktreihe i { width: 10px; height: 10px; border-radius: 50%; background: var(--indigo); display: block; }
.punktreihe i:last-child { background: var(--messing); }
.findings-block { display: flex; flex-direction: column; gap: 22px; }
.findings-label, .forecasts-label { font-size: 17px; font-weight: 600; }
.findings { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; }
.findings > div { display: flex; flex-direction: column; gap: 10px; padding-top: 22px; border-top: 1px solid var(--linie); }
.findings strong { font-size: 52px; line-height: 1; }
.findings p { font-size: 16px; line-height: 1.55; }
.findings small { font-size: 13px; line-height: 1.5; color: var(--grau); }
.forecasts { display: flex; flex-direction: column; gap: 20px; }
.forecasts ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 18px; }
.forecasts li { display: flex; gap: 20px; align-items: baseline; }
.forecasts li span:last-child { font-family: var(--serif); font-weight: 600; font-size: 20px; line-height: 1.4; }
.forecasts > p { font-size: 15px; line-height: 1.6; color: var(--grau); max-width: 70ch; }

/* Analysen und Newsletter */
.cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; }
.card { display: flex; flex-direction: column; gap: 12px; padding-top: 22px; border-top: 1px solid var(--linie); color: var(--tinte); text-decoration: none; }
.card:hover { color: var(--tinte); border-top-color: var(--indigo); }
.card:hover h3 { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.card .meta { font-size: 14px; font-weight: 500; color: var(--grau); }
.card h3 { font-size: 23px; line-height: 1.25; }
.card p { font-size: 15px; line-height: 1.6; }
.card .read { margin-top: auto; font-size: 15px; font-weight: 500; color: var(--indigo); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.feed-note { font-size: 16px; }
.newsletter { display: flex; gap: 56px; align-items: center; }
.newsletter-text { flex: 1; display: flex; flex-direction: column; gap: 12px; }
.newsletter h3 { font-size: 26px; line-height: 1.25; }
.newsletter-text > p:not(.small) { font-size: 16px; line-height: 1.6; }
.subscribe { display: flex; flex-direction: column; gap: 10px; width: 460px; max-width: 100%; }
.subscribe label { font-size: 14px; font-weight: 600; }
.subscribe-row { display: flex; gap: 10px; }
.subscribe input { flex: 1; min-width: 0; height: 48px; padding: 0 16px; border: 1.5px solid var(--grau); border-radius: 0; background: var(--leinen); font: inherit; font-size: 16px; color: var(--tinte); }
.subscribe input:focus { border-color: var(--indigo); }

/* Über Gerhard */
.about .wrap { flex-direction: row; gap: 64px; align-items: flex-start; }
.about-pics { display: flex; flex-direction: column; gap: 28px; width: 360px; flex-shrink: 0; }
.about-pics figure { display: flex; flex-direction: column; gap: 8px; }
.about-pics img { width: 100%; height: auto; }
.about-pics strong { font-weight: 600; color: var(--tinte); }
.about-body { display: flex; flex-direction: column; gap: 20px; min-width: 0; max-width: 760px; }
.about-body p { font-size: 17px; line-height: 1.6; }
.social { display: flex; flex-wrap: wrap; gap: 4px 28px; padding-top: 4px; }
.social a { display: inline-flex; align-items: center; min-height: 44px; font-size: 16px; font-weight: 500; }

/* Unterlagen für Veranstalter und Medien */
.dates .wrap { gap: 24px; }
.media-box { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); grid-template-areas: "h3 list" "note list"; grid-template-rows: auto 1fr; gap: 14px 64px; }
.media-box > h3 { grid-area: h3; font-size: 28px; line-height: 1.25; }
.media-box > .media-list { grid-area: list; }
.media-box > .small { grid-area: note; }
.media-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--linie); }
.media-list li { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--linie); }
.media-name { font-size: 16px; font-weight: 600; color: var(--tinte); }
.media-links { display: flex; gap: 14px; flex-shrink: 0; }
.media-links a { font-size: 14px; font-weight: 500; white-space: nowrap; }

/* Häufige Fragen */
.faq-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 56px; }
.faq-grid > div { display: flex; flex-direction: column; gap: 10px; padding-top: 22px; border-top: 1px solid var(--linie); }
.faq-grid h3 { font-size: 21px; line-height: 1.3; }
.faq-grid p { font-size: 16px; line-height: 1.6; }

/* Kontakt */
.contact { border-top: 1px solid var(--linie); }
.contact .wrap { padding-top: 80px; padding-bottom: 80px; }
.contact-box { display: flex; gap: 56px; align-items: center; justify-content: space-between; border-top: 0; padding-top: 0; }
.contact-text { display: flex; flex-direction: column; gap: 18px; max-width: 720px; }
.contact-text h2 { font-size: 40px; line-height: 1.14; }
.contact-text .small { font-size: 15px; }
.contact-actions { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; flex-shrink: 0; }
.contact-actions .btn { margin-bottom: 10px; }
.contact-actions .mail { font-size: 16px; font-weight: 500; min-height: 44px; display: inline-flex; align-items: center; }
.contact-actions .contact-link { font-size: 15px; min-height: 44px; display: inline-flex; align-items: center; }

/* Fußzeile: Indigo dunkel */
.footer { background: var(--indigo-dunkel); color: var(--leinen); }
.footer .wrap { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 24px 40px; align-items: start; padding-top: 48px; padding-bottom: 40px; font-size: 14px; color: var(--nebel); }
.footer .foot-brand { display: flex; flex-direction: column; gap: 16px; }
.footer .foot-brand img { height: 60px; width: auto; align-self: flex-start; }
.footer a { color: var(--leinen); }
.footer a:hover { color: var(--altgold); }
.footer nav { display: flex; flex-wrap: wrap; gap: 4px 28px; font-size: 15px; }
.footer nav a { display: inline-flex; align-items: center; min-height: 44px; }
.footer .foot-line { grid-column: 1 / -1; padding-top: 18px; border-top: 1px solid var(--linie-dunkel); }

/* Impressum, Datenschutz */
.legal .wrap { max-width: 1100px; padding-top: 72px; padding-bottom: 80px; display: flex; flex-direction: column; gap: 24px; font-size: 17px; line-height: 1.6; }
.legal h1 { font-size: 40px; line-height: 1.15; }
.legal h2 { font-size: 24px; margin-top: 16px; }

/* Report-, Offenlegungs- und Begriffsseiten */
.doc .wrap { gap: 20px; }
.doc h1 { font-size: clamp(34px, 4.5vw, 50px); line-height: 1.1; }
.doc h2 { font-size: 28px; margin-top: 32px; }
.doc .subtitle { font-size: 21px; line-height: 1.45; color: var(--grau); }
.doc .facts { font-size: 15px; color: var(--grau); }
.doc .actions .btn { min-height: 48px; padding: 0 22px; }
.kz { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.kz > div { display: flex; flex-direction: column; gap: 8px; padding-top: 20px; border-top: 1px solid var(--linie); }
.kz strong { font-size: 36px; line-height: 1.1; }
.kz p { font-size: 16px; line-height: 1.5; }
.kz small { font-size: 13px; color: var(--grau); line-height: 1.4; }
.kb { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 22px; counter-reset: kb; }
.kb li { position: relative; padding-left: 52px; scroll-margin-top: 96px; }
.kb li::before { counter-increment: kb; content: counter(kb, decimal-leading-zero); position: absolute; left: 0; top: 0; font-family: var(--serif); font-weight: 700; font-variant-numeric: tabular-nums; font-size: 19px; color: var(--indigo); }
.kb h3 { font-family: var(--text); font-size: 19px; font-weight: 600; letter-spacing: 0; line-height: 1.35; margin-bottom: 6px; }
.prog { margin: 0; padding-left: 24px; display: flex; flex-direction: column; gap: 12px; }
.prog li { scroll-margin-top: 96px; }
.plain { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 10px; }
.versions { width: 100%; border-collapse: collapse; font-size: 16px; }
.versions th, .versions td { text-align: left; vertical-align: top; padding: 10px 12px 10px 0; border-bottom: 1px solid var(--linie); }
.versions th { font-size: 14px; font-weight: 600; color: var(--grau); }
.versions td:first-child { font-weight: 600; white-space: nowrap; }
.cite { border-top: 1px solid var(--linie); border-bottom: 1px solid var(--linie); padding: 18px 0; font-size: 16px; }
.terms { margin: 0; }
.terms dt { font-family: var(--serif); font-weight: 700; font-size: 24px; margin-top: 28px; scroll-margin-top: 96px; }
.terms dd { margin: 8px 0 0; }

/* Breite Bildschirme bis Tablet */
@media (max-width: 1280px) {
  .wrap { padding: 0 40px; }
  .nav-links { gap: 20px; }
  .hero h1 { font-size: 50px; }
}
@media (max-width: 1080px) {
  .nav-toggle { display: block; }
  .nav-links { display: none; position: absolute; top: 80px; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 0; padding: 8px 40px 24px; background: var(--leinen); border-bottom: 1px solid var(--linie); font-size: 17px; }
  .nav-links > a:not(.btn) { padding: 14px 0; border-bottom: 1px solid var(--linie); }
  .nav-links .lang { align-self: flex-start; margin: 16px 0; }
  .nav-links.open { display: flex; }
  .topics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .formats-grid, .proof .wrap { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .findings { grid-template-columns: 1fr; gap: 28px; }
  .quotes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .newsletter, .contact-box { flex-direction: column; align-items: stretch; }
  .subscribe { width: 100%; }
  .about-pics { width: 300px; }
}
@media (max-width: 860px) {
  .hero .wrap { grid-template-columns: 1fr; padding-top: 48px; padding-bottom: 48px; gap: 32px; }
  .hero-foto { margin-top: 70px; height: 320px; max-width: 460px; }
  .hero-foto img { left: -8%; width: 116%; }
  .stage-top { grid-template-columns: 1fr; }
  .stage-side { grid-template-rows: none; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .report-top { grid-template-columns: 1fr; gap: 32px; }
  .about .wrap { flex-direction: column; }
  .about-pics { width: 100%; max-width: 420px; }
  .faq-grid { grid-template-columns: 1fr; }
  .section-head-row { flex-direction: column; align-items: flex-start; gap: 16px; }
  .media-box { grid-template-columns: 1fr; grid-template-areas: "h3" "list" "note"; grid-template-rows: auto; }
  .footer .wrap { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .wrap { padding: 0 20px; }
  .nav .wrap { height: 68px; }
  .nav-links { top: 68px; padding: 8px 20px 24px; }
  .brand img { height: 26px; }
  .hero h1 { font-size: 36px; line-height: 1.12; }
  .hero .lead { font-size: 18px; }
  .hero-foto { height: 260px; margin-top: 60px; }
  .actions .btn { width: 100%; }
  .proof .wrap { gap: 24px 20px; padding-top: 32px; padding-bottom: 32px; }
  .proof strong { font-size: 38px; }
  .proof span { font-size: 14px; }
  .stages .wrap { padding-top: 32px; padding-bottom: 36px; }
  .stages ul { gap: 10px 28px; font-size: 16px; }
  .stages ul li { height: 24px; }
  .stages ul img { max-width: 120px; }
  .section .wrap { padding-top: 52px; padding-bottom: 52px; gap: 32px; }
  .section h2 { font-size: 30px; }
  .sub { font-size: 17px; }
  .media-list li { flex-direction: column; align-items: flex-start; gap: 6px; }
  .topics { grid-template-columns: 1fr; }
  .topic-wide { grid-column: auto; }
  .quotes { grid-template-columns: 1fr; }
  .topic h3, .topic-wide h3 { font-size: 22px; }
  .formats-grid { grid-template-columns: 1fr; gap: 20px; }
  .formats-foot .btn { width: 100%; }
  .stage-side, .gallery { gap: 20px 12px; }
  .cover { width: 200px; }
  .wordmark { height: 28px; }
  .report .report-text h2 { font-size: 32px; }
  .findings strong { font-size: 42px; }
  .forecasts li { gap: 14px; }
  .forecasts li span:last-child { font-size: 18px; }
  .cards { grid-template-columns: 1fr; }
  .card h3 { font-size: 21px; }
  .subscribe-row { flex-direction: column; }
  .subscribe .btn { width: 100%; }
  .faq-grid h3 { font-size: 19px; }
  .contact .wrap { padding-top: 52px; padding-bottom: 52px; }
  .contact-box { gap: 32px; }
  .contact-text h2 { font-size: 30px; }
  .contact-actions { align-items: stretch; }
  .contact-actions .btn { width: 100%; }
  .legal .wrap { padding-top: 48px; padding-bottom: 56px; }
  .legal h1 { font-size: 32px; }
  .kz { grid-template-columns: 1fr; }
  .versions { font-size: 15px; }
  .versions td:first-child { white-space: normal; }
}
@media (min-width: 1081px) and (max-width: 1280px) {
  .topics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}