:root {
  --font-scale: 1;
  --page-width: 1180px;
  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-lg: 30px;
  --transition: 180ms ease;
  --green: #79c900;
  --green-bright: #9aea1f;
  --green-deep: #397800;
  --silver: #d9e1e6;
  --ink: #11171b;
  --bg: #f2f5f6;
  --bg-alt: #e7ecee;
  --surface: rgba(255, 255, 255, 0.86);
  --surface-solid: #ffffff;
  --surface-soft: #eef2f3;
  --text: #172026;
  --muted: #58666f;
  --line: rgba(23, 32, 38, 0.13);
  --line-strong: rgba(23, 32, 38, 0.22);
  --header: rgba(247, 249, 250, 0.86);
  --shadow-sm: 0 10px 30px rgba(17, 27, 33, 0.08);
  --shadow-lg: 0 28px 80px rgba(17, 27, 33, 0.14);
  --focus: #2f7f00;
  color-scheme: light;
  font-size: calc(16px * var(--font-scale));
}

html[data-theme="dark"] {
  --bg: #070a0c;
  --bg-alt: #0c1114;
  --surface: rgba(17, 23, 27, 0.84);
  --surface-solid: #11171b;
  --surface-soft: #151d22;
  --text: #f4f7f8;
  --muted: #aab6bd;
  --line: rgba(255, 255, 255, 0.10);
  --line-strong: rgba(255, 255, 255, 0.18);
  --header: rgba(7, 10, 12, 0.84);
  --shadow-sm: 0 12px 34px rgba(0, 0, 0, 0.26);
  --shadow-lg: 0 30px 90px rgba(0, 0, 0, 0.40);
  --focus: #a6ef39;
  color-scheme: dark;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 7.5rem;
}

body {
  min-width: 320px;
  margin: 0;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 7% 1%, rgba(121, 201, 0, 0.11), transparent 31rem),
    radial-gradient(circle at 94% 22%, rgba(132, 149, 159, 0.11), transparent 34rem),
    linear-gradient(180deg, var(--bg), var(--bg-alt) 52%, var(--bg));
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 52px 52px;
  opacity: 0.18;
  mask-image: linear-gradient(to bottom, #000, transparent 78%);
}

img {
  display: block;
  max-width: 100%;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

a {
  color: inherit;
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  color: inherit;
}

:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}

::selection {
  background: rgba(121, 201, 0, 0.28);
}

.i18n[lang="en"] {
  display: none !important;
}

html[lang="en"] .i18n[lang="de"] {
  display: none !important;
}

html[lang="en"] .i18n[lang="en"] {
  display: revert !important;
}

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.skip-link {
  position: fixed;
  top: -5rem;
  left: 1rem;
  z-index: 1000;
  padding: 0.75rem 1rem;
  border-radius: var(--radius-sm);
  background: var(--green-bright);
  color: #101900;
  font-weight: 900;
  text-decoration: none;
  transition: top var(--transition);
}

.skip-link:focus {
  top: 1rem;
}

.container {
  width: min(calc(100% - 2rem), var(--page-width));
  margin-inline: auto;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  border-bottom: 1px solid var(--line);
  background: var(--header);
  backdrop-filter: blur(18px) saturate(145%);
}

.header-inner {
  min-height: 76px;
  display: flex;
  align-items: center;
  gap: 1rem;
}

.brand {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 0.72rem;
  border-radius: var(--radius-sm);
  color: var(--text);
  font-weight: 950;
  letter-spacing: 0.015em;
  text-decoration: none;
}

.brand img {
  width: 46px;
  height: 46px;
  object-fit: contain;
  filter: drop-shadow(0 7px 12px rgba(0, 0, 0, 0.22));
}

.brand-text {
  font-size: 1.08rem;
  background: linear-gradient(90deg, var(--text), #87949b 56%, var(--green));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.primary-nav {
  margin-left: auto;
}

.nav-list {
  display: flex;
  align-items: center;
  gap: 0.12rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.nav-list a {
  display: block;
  padding: 0.68rem 0.82rem;
  border-radius: 11px;
  color: var(--muted);
  font-size: 0.91rem;
  font-weight: 780;
  text-decoration: none;
  transition: color var(--transition), background-color var(--transition);
}

.nav-list a:hover,
.nav-list a[aria-current="page"] {
  background: var(--surface-soft);
  color: var(--text);
}

.utility-bar {
  display: flex;
  align-items: center;
  gap: 0.42rem;
  margin-left: 0.35rem;
}

.control-group {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}

.control-button,
.menu-button {
  min-width: 2.35rem;
  min-height: 2.35rem;
  display: inline-grid;
  place-items: center;
  padding: 0.35rem 0.55rem;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
  transition: background-color var(--transition), color var(--transition), transform var(--transition);
}

.control-button:hover {
  background: var(--surface-soft);
  color: var(--text);
}

.control-button:active,
.menu-button:active {
  transform: translateY(1px);
}

.control-button[aria-pressed="true"] {
  background: linear-gradient(135deg, var(--green-bright), var(--green));
  color: #102000;
}

.theme-button {
  font-size: 1rem;
}

.menu-button {
  display: none;
  border: 1px solid var(--line);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}

.menu-lines,
.menu-lines::before,
.menu-lines::after {
  width: 1.15rem;
  height: 2px;
  display: block;
  border-radius: 99px;
  background: currentColor;
  transition: transform var(--transition), opacity var(--transition);
}

.menu-lines {
  position: relative;
}

.menu-lines::before,
.menu-lines::after {
  content: "";
  position: absolute;
  left: 0;
}

.menu-lines::before {
  top: -0.35rem;
}

.menu-lines::after {
  top: 0.35rem;
}

.menu-button[aria-expanded="true"] .menu-lines {
  background: transparent;
}

.menu-button[aria-expanded="true"] .menu-lines::before {
  transform: translateY(0.35rem) rotate(45deg);
}

.menu-button[aria-expanded="true"] .menu-lines::after {
  transform: translateY(-0.35rem) rotate(-45deg);
}

.hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(3.1rem, 7vw, 7rem) 0 clamp(4.6rem, 8vw, 8rem);
}

.hero::before,
.hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  filter: blur(18px);
  pointer-events: none;
}

.hero::before {
  width: min(45vw, 36rem);
  aspect-ratio: 1;
  top: 2rem;
  left: -20rem;
  background: radial-gradient(circle, rgba(121, 201, 0, 0.28), transparent 69%);
}

.hero::after {
  width: min(52vw, 42rem);
  aspect-ratio: 1;
  right: -24rem;
  bottom: -13rem;
  background: radial-gradient(circle, rgba(144, 158, 166, 0.22), transparent 69%);
}

.hero-inner {
  display: grid;
  justify-items: center;
  gap: 1.45rem;
  text-align: center;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.58rem;
  margin: 0;
  padding: 0.52rem 0.82rem;
  border: 1px solid rgba(121, 201, 0, 0.32);
  border-radius: 999px;
  background: rgba(121, 201, 0, 0.09);
  color: var(--text);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.eyebrow::before {
  content: "";
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 18px rgba(121, 201, 0, 0.75);
}

.logo-stage {
  width: min(100%, 1120px);
  min-height: clamp(12rem, 37vw, 29rem);
  display: grid;
  place-items: center;
  padding: clamp(0.75rem, 2vw, 1.5rem);
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: clamp(1.4rem, 4vw, 2.6rem);
  background:
    radial-gradient(circle at 20% 45%, rgba(121, 201, 0, 0.11), transparent 29rem),
    radial-gradient(circle at 82% 50%, rgba(255, 255, 255, 0.06), transparent 25rem),
    #030405;
  box-shadow: 0 34px 110px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.09);
}

.logo-stage img {
  width: 100%;
  height: auto;
  max-height: 29rem;
  object-fit: contain;
  filter: drop-shadow(0 24px 32px rgba(0, 0, 0, 0.42));
}

.hero h1,
.legal-hero h1 {
  margin: 0;
  font-weight: 950;
  letter-spacing: -0.055em;
  line-height: 0.98;
  text-wrap: balance;
}

.hero h1 {
  max-width: 980px;
  font-size: clamp(2.7rem, 7vw, 6.2rem);
}

.gradient-text {
  background: linear-gradient(110deg, var(--text) 4%, #98a5ac 42%, var(--green-bright) 77%, var(--green-deep));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.lead {
  max-width: 780px;
  margin: 0;
  color: var(--muted);
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  text-wrap: balance;
}

.actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 0.25rem;
}

.button {
  min-height: 3rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  padding: 0.72rem 1.1rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  color: var(--text);
  font-weight: 850;
  text-decoration: none;
  transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition);
}

.button:hover {
  transform: translateY(-2px);
  border-color: var(--line-strong);
  box-shadow: var(--shadow-lg);
}

.button-primary {
  border-color: rgba(121, 201, 0, 0.52);
  background: linear-gradient(135deg, var(--green-bright), var(--green));
  color: #102000;
}

.button-arrow {
  font-size: 1.1em;
  transition: transform var(--transition);
}

.button:hover .button-arrow {
  transform: translateX(0.18rem);
}

.section {
  padding: clamp(4.5rem, 8vw, 8rem) 0;
}

.section-alt {
  border-block: 1px solid var(--line);
  background: linear-gradient(180deg, transparent, var(--surface-soft), transparent);
}

.section-header {
  max-width: 820px;
  margin-bottom: 2.3rem;
}

.kicker {
  margin: 0 0 0.7rem;
  color: var(--green-deep);
  font-size: 0.76rem;
  font-weight: 950;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

html[data-theme="dark"] .kicker {
  color: var(--green-bright);
}

.section-title {
  margin: 0;
  font-size: clamp(2rem, 4.4vw, 4rem);
  line-height: 1.04;
  letter-spacing: -0.045em;
  text-wrap: balance;
}

.section-intro {
  max-width: 720px;
  margin: 1rem 0 0;
  color: var(--muted);
  font-size: 1.04rem;
}

.card-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.card,
.project-card,
.legal-card,
.quote-card {
  border: 1px solid var(--line);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}

.card {
  min-height: 17rem;
  display: flex;
  flex-direction: column;
  padding: 1.35rem;
  border-radius: var(--radius-md);
  transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition);
}

.card:hover,
.project-card:hover {
  transform: translateY(-4px);
  border-color: rgba(121, 201, 0, 0.34);
  box-shadow: var(--shadow-lg);
}

.card-number,
.project-number {
  width: 2.7rem;
  height: 2.7rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(121, 201, 0, 0.30);
  border-radius: 12px;
  background: rgba(121, 201, 0, 0.10);
  color: var(--green-deep);
  font-size: 0.76rem;
  font-weight: 950;
}

html[data-theme="dark"] .card-number,
html[data-theme="dark"] .project-number {
  color: var(--green-bright);
}

.card h3,
.project-card h3 {
  margin: 1.25rem 0 0.45rem;
  font-size: 1.26rem;
  line-height: 1.2;
}

.card p,
.project-card p {
  margin: 0;
  color: var(--muted);
}

.card-tag {
  margin-top: auto;
  padding-top: 1rem;
  color: var(--text);
  font-size: 0.82rem;
  font-weight: 850;
}

.project-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.project-card {
  position: relative;
  min-height: 18rem;
  padding: clamp(1.4rem, 3vw, 2rem);
  overflow: hidden;
  border-radius: var(--radius-lg);
  transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition);
}

.project-card::after {
  content: "";
  position: absolute;
  width: 13rem;
  height: 13rem;
  right: -5rem;
  bottom: -7rem;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(121, 201, 0, 0.20), transparent 68%);
  pointer-events: none;
}

.project-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.project-badge {
  padding: 0.34rem 0.65rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 850;
}

.project-card h3 {
  margin-top: 1.4rem;
  font-size: clamp(1.5rem, 3vw, 2.35rem);
  letter-spacing: -0.03em;
}

.project-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 1.35rem;
}

.project-meta span {
  padding: 0.35rem 0.58rem;
  border-radius: 8px;
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 780;
}

.principle-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 1rem;
  align-items: stretch;
}

.quote-card,
.principle-copy {
  border-radius: var(--radius-lg);
}

.quote-card {
  position: relative;
  display: grid;
  align-content: center;
  min-height: 25rem;
  padding: clamp(1.6rem, 4vw, 3rem);
  overflow: hidden;
  background:
    radial-gradient(circle at 10% 0%, rgba(121, 201, 0, 0.19), transparent 20rem),
    var(--surface);
}

.quote-mark {
  position: absolute;
  top: -2rem;
  right: 1rem;
  color: rgba(121, 201, 0, 0.16);
  font-family: Georgia, serif;
  font-size: 13rem;
  line-height: 1;
  pointer-events: none;
}

.quote-card blockquote {
  position: relative;
  margin: 0;
  font-size: clamp(1.55rem, 3.7vw, 3rem);
  font-weight: 880;
  line-height: 1.12;
  letter-spacing: -0.035em;
}

.quote-card footer {
  position: relative;
  margin-top: 1.4rem;
  color: var(--muted);
  font-weight: 800;
}

.principle-copy {
  padding: clamp(1.6rem, 4vw, 3rem);
  border: 1px solid var(--line);
  background: var(--surface-soft);
}

.principle-copy h2 {
  margin: 0;
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.05;
  letter-spacing: -0.04em;
}

.principle-copy > p {
  color: var(--muted);
}

.check-list {
  display: grid;
  gap: 0.75rem;
  margin: 1.5rem 0 0;
  padding: 0;
  list-style: none;
}

.check-list li {
  position: relative;
  padding-left: 1.7rem;
}

.check-list li::before {
  content: "";
  position: absolute;
  top: 0.55em;
  left: 0;
  width: 0.7rem;
  height: 0.38rem;
  border-left: 3px solid var(--green);
  border-bottom: 3px solid var(--green);
  transform: rotate(-45deg);
}

.cta {
  padding: 0 0 clamp(4.5rem, 8vw, 8rem);
}

.cta-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding: clamp(1.5rem, 4vw, 3rem);
  border: 1px solid rgba(121, 201, 0, 0.30);
  border-radius: var(--radius-lg);
  background:
    linear-gradient(120deg, rgba(121, 201, 0, 0.13), transparent 55%),
    var(--surface);
  box-shadow: var(--shadow-lg);
}

.cta-inner h2 {
  margin: 0;
  font-size: clamp(1.7rem, 3vw, 2.65rem);
  line-height: 1.1;
  letter-spacing: -0.035em;
}

.cta-inner p {
  max-width: 680px;
  margin: 0.6rem 0 0;
  color: var(--muted);
}

.site-footer {
  border-top: 1px solid var(--line);
  background: var(--surface-soft);
}

.footer-inner {
  min-height: 142px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding-block: 2rem;
}

.footer-brand {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

.footer-brand img {
  width: 48px;
  height: 48px;
  object-fit: contain;
}

.footer-brand strong {
  display: block;
}

.footer-brand small,
.footer-copy {
  display: block;
  color: var(--muted);
}

.footer-copy {
  margin-top: 0.45rem;
  font-size: 0.82rem;
}

.footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.4rem;
}

.footer-links a {
  padding: 0.55rem 0.72rem;
  border-radius: 10px;
  color: var(--muted);
  font-weight: 780;
  text-decoration: none;
}

.footer-links a:hover {
  background: var(--surface);
  color: var(--text);
}

.legal-main {
  padding-bottom: clamp(4rem, 8vw, 7rem);
}

.legal-hero {
  padding: clamp(3.5rem, 8vw, 7rem) 0 2.5rem;
}

.legal-hero .eyebrow {
  margin-bottom: 1.2rem;
}

.legal-hero h1 {
  max-width: 900px;
  font-size: clamp(2.7rem, 7vw, 5.8rem);
}

.legal-hero p {
  max-width: 760px;
  margin: 1.25rem 0 0;
  color: var(--muted);
  font-size: 1.08rem;
}

.legal-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 16rem;
  gap: 1.25rem;
  align-items: start;
}

.legal-content {
  display: grid;
  gap: 1rem;
}

.legal-card {
  padding: clamp(1.35rem, 3vw, 2.25rem);
  border-radius: var(--radius-md);
}

.legal-card h2 {
  margin: 0 0 1rem;
  font-size: clamp(1.35rem, 2.5vw, 2rem);
  line-height: 1.2;
  letter-spacing: -0.025em;
}

.legal-card h3 {
  margin: 1.5rem 0 0.45rem;
  font-size: 1.08rem;
}

.legal-card p,
.legal-card ul,
.legal-card dl {
  color: var(--muted);
}

.legal-card p:last-child,
.legal-card ul:last-child,
.legal-card dl:last-child {
  margin-bottom: 0;
}

.legal-card a {
  color: var(--green-deep);
  font-weight: 800;
  text-underline-offset: 0.18em;
}

html[data-theme="dark"] .legal-card a {
  color: var(--green-bright);
}

.placeholder-notice {
  border-color: rgba(214, 142, 0, 0.38);
  background:
    linear-gradient(120deg, rgba(255, 176, 0, 0.12), transparent 52%),
    var(--surface);
}

.placeholder-notice strong {
  color: var(--text);
}

.data-list {
  display: grid;
  grid-template-columns: minmax(10rem, 0.45fr) minmax(0, 1fr);
  gap: 0.45rem 1rem;
  margin: 0;
}

.data-list dt {
  color: var(--text);
  font-weight: 850;
}

.data-list dd {
  margin: 0;
}

.placeholder {
  display: inline-block;
  padding: 0.08rem 0.34rem;
  border: 1px dashed rgba(214, 142, 0, 0.72);
  border-radius: 6px;
  background: rgba(255, 176, 0, 0.09);
  color: var(--text);
  font-weight: 800;
}

.legal-nav {
  position: sticky;
  top: 6.2rem;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}

.legal-nav strong {
  display: block;
  margin-bottom: 0.65rem;
}

.legal-nav a {
  display: block;
  padding: 0.48rem 0.55rem;
  border-radius: 8px;
  color: var(--muted);
  font-size: 0.88rem;
  font-weight: 760;
  text-decoration: none;
}

.legal-nav a:hover {
  background: var(--surface-soft);
  color: var(--text);
}

.back-link {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin-top: 1.5rem;
  color: var(--muted);
  font-weight: 800;
  text-decoration: none;
}

.back-link:hover {
  color: var(--text);
}

[data-reveal] {
  opacity: 1;
  transform: none;
}

html.js [data-reveal] {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 560ms ease, transform 560ms ease;
}

html.js [data-reveal].is-visible {
  opacity: 1;
  transform: none;
}

@media (max-width: 1080px) {
  .primary-nav {
    position: fixed;
    top: 77px;
    left: 1rem;
    right: 1rem;
    display: none;
    margin: 0;
    padding: 0.8rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: var(--surface-solid);
    box-shadow: var(--shadow-lg);
  }

  .primary-nav.is-open {
    display: block;
  }

  .nav-list {
    display: grid;
  }

  .nav-list a {
    padding: 0.78rem;
  }

  .utility-bar {
    margin-left: auto;
  }

  .menu-button {
    display: inline-grid;
  }

  .card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 780px) {
  html {
    scroll-padding-top: 10rem;
  }

  .header-inner {
    min-height: 70px;
    flex-wrap: wrap;
    padding-block: 0.55rem;
  }

  .brand img {
    width: 42px;
    height: 42px;
  }

  .brand-text {
    display: none;
  }

  .utility-bar {
    gap: 0.28rem;
  }

  .control-group {
    padding: 0.14rem;
  }

  .control-button,
  .menu-button {
    min-width: 2.15rem;
    min-height: 2.15rem;
    padding: 0.28rem 0.42rem;
  }

  .primary-nav {
    top: 73px;
  }

  .hero {
    padding-top: 2.8rem;
  }

  .logo-stage {
    min-height: 14rem;
    padding: 0.35rem;
  }

  .project-grid,
  .principle-grid,
  .legal-layout {
    grid-template-columns: 1fr;
  }

  .legal-nav {
    position: static;
    order: -1;
  }

  .cta-inner,
  .footer-inner {
    align-items: flex-start;
    flex-direction: column;
  }

  .footer-links {
    justify-content: flex-start;
  }
}

@media (max-width: 560px) {
  .container {
    width: min(calc(100% - 1.2rem), var(--page-width));
  }

  .font-reset {
    display: none;
  }

  .card-grid {
    grid-template-columns: 1fr;
  }

  .card {
    min-height: auto;
  }

  .actions {
    width: 100%;
  }

  .button {
    width: 100%;
  }

  .data-list {
    grid-template-columns: 1fr;
  }

  .data-list dd {
    margin-bottom: 0.65rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }

  [data-reveal] {
    opacity: 1;
    transform: none;
  }
}

@media print {
  :root,
  html[data-theme="dark"] {
    --bg: #fff;
    --bg-alt: #fff;
    --surface: #fff;
    --surface-solid: #fff;
    --surface-soft: #fff;
    --text: #000;
    --muted: #333;
    --line: #bbb;
    color-scheme: light;
  }

  body {
    background: #fff;
  }

  body::before,
  .site-header,
  .site-footer,
  .legal-nav,
  .back-link {
    display: none !important;
  }

  .legal-layout {
    display: block;
  }

  .legal-card {
    break-inside: avoid;
    box-shadow: none;
  }
}


/* V11 additions ---------------------------------------------------------- */
.brand-mark {
  width: 2.65rem;
  height: 2.65rem;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: .78rem;
  background: linear-gradient(145deg, #4b5860, #10161a 62%, #050708);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.42), 0 10px 25px rgba(0,0,0,.25);
  color: #edf2f4;
  font-size: 1.38rem;
  font-weight: 950;
  line-height: 1;
}
.version-badge,
.version-inline {
  border: 1px solid rgba(121,201,0,.35);
  border-radius: 999px;
  background: rgba(121,201,0,.10);
  color: var(--green-deep);
  font-size: .67rem;
  font-weight: 950;
  letter-spacing: .08em;
  padding: .26rem .48rem;
}
html[data-theme="dark"] .version-badge,
html[data-theme="dark"] .version-inline { color: var(--green-bright); }
.footer-brand-textual { align-items: center; }
.footer-mark { width: 3rem; height: 3rem; }
.card-link {
  margin-top: auto;
  padding-top: 1rem;
  color: var(--green-deep);
  font-weight: 900;
  text-decoration: none;
}
html[data-theme="dark"] .card-link { color: var(--green-bright); }
.feature-card { border-color: rgba(121,201,0,.34); }

.profile-layout {
  display: grid;
  grid-template-columns: minmax(15rem, .68fr) minmax(0, 1.5fr);
  gap: clamp(2rem, 6vw, 5.5rem);
  align-items: center;
}
.profile-portrait { display: grid; justify-items: center; gap: 1rem; }
.portrait-frame {
  width: min(100%, 21rem);
  aspect-ratio: 1;
  display: grid;
  place-items: end center;
  overflow: hidden;
  border: 1px solid rgba(121,201,0,.32);
  border-radius: 42% 42% 28% 28%;
  background:
    radial-gradient(circle at 50% 25%, rgba(121,201,0,.20), transparent 42%),
    linear-gradient(145deg, var(--surface-soft), var(--surface-solid));
  box-shadow: var(--shadow-lg), inset 0 1px 0 rgba(255,255,255,.14);
}
.portrait-frame img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
  filter: drop-shadow(0 1.2rem 1.5rem rgba(0,0,0,.24));
}
.profile-caption { color: var(--muted); font-size: .86rem; font-weight: 850; }
.profile-copy > p:not(.kicker) { color: var(--muted); font-size: 1.05rem; }
.profile-values { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 1.5rem; }
.value-chip {
  padding: .5rem .72rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  color: var(--text);
  font-size: .78rem;
  font-weight: 850;
}

.comparison-main { padding-bottom: 0; }
.comparison-hero { position: relative; overflow: hidden; padding: clamp(4rem, 9vw, 8.5rem) 0 clamp(3.5rem, 7vw, 6rem); }
.comparison-hero::before {
  content: ""; position: absolute; width: 36rem; height: 36rem; left: -18rem; top: -14rem;
  border-radius: 50%; background: radial-gradient(circle, rgba(121,201,0,.22), transparent 70%); pointer-events: none;
}
.comparison-hero-inner { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(17rem,.65fr); gap: clamp(2rem,6vw,5rem); align-items: end; }
.comparison-hero h1 { margin: 1.25rem 0 1.4rem; font-size: clamp(3rem,7vw,6.5rem); line-height: .95; letter-spacing: -.06em; text-wrap: balance; }
.comparison-hero .lead { margin: 0; text-align: left; }
.comparison-callout {
  padding: 1.4rem; border: 1px solid rgba(121,201,0,.30); border-radius: var(--radius-md);
  background: linear-gradient(135deg, rgba(121,201,0,.12), transparent 55%), var(--surface);
  box-shadow: var(--shadow-sm);
}
.comparison-callout strong { display: block; margin-bottom: .45rem; }
.comparison-callout p { margin: 0; color: var(--muted); font-size: .91rem; }
.system-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.system-card {
  min-height: 31rem; padding: 1.45rem; border: 1px solid var(--line); border-radius: var(--radius-lg);
  background: var(--surface); box-shadow: var(--shadow-sm); transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
}
.system-card:hover { transform: translateY(-4px); border-color: rgba(121,201,0,.34); box-shadow: var(--shadow-lg); }
.system-card.mint { background: linear-gradient(155deg, rgba(121,201,0,.13), transparent 42%), var(--surface); }
.system-card.windows { background: linear-gradient(155deg, rgba(70,145,230,.10), transparent 42%), var(--surface); }
.system-card.mac { background: linear-gradient(155deg, rgba(190,202,210,.13), transparent 42%), var(--surface); }
.system-card-head { display: flex; align-items: center; gap: .9rem; }
.system-icon { width: 3.35rem; height: 3.35rem; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 1rem; background: var(--surface-soft); font-weight: 950; }
.system-card h3 { margin: 0; font-size: 1.55rem; }
.status-badge { display: inline-block; margin-top: .2rem; color: var(--muted); font-size: .76rem; font-weight: 850; }
.system-card > p { color: var(--muted); }
.system-facts { display: grid; grid-template-columns: 5.6rem 1fr; gap: .55rem .8rem; margin: 1.35rem 0 0; padding-top: 1.2rem; border-top: 1px solid var(--line); }
.system-facts dt { font-weight: 900; }
.system-facts dd { margin: 0; color: var(--muted); }
.pros-cons-grid { display: grid; gap: 1rem; }
.pros-cons-card { padding: clamp(1.35rem,3vw,2rem); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); }
.pros-cons-card > h3 { margin: 0 0 1.2rem; font-size: clamp(1.7rem,3vw,2.6rem); letter-spacing: -.035em; }
.pros-cons-columns { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.2rem; }
.pros-cons-columns > div { padding: 1.1rem; border-radius: var(--radius-md); background: var(--surface-soft); }
.pros-cons-columns h4 { margin: 0 0 .75rem; }
.positive::before { content: "+ "; color: var(--green); }
.negative::before { content: "− "; color: #d56b59; }
.pros-cons-columns ul { margin: 0; padding-left: 1.15rem; color: var(--muted); }
.pros-cons-columns li + li { margin-top: .45rem; }
.timeline { position: relative; display: grid; gap: 1rem; }
.timeline::before { content: ""; position: absolute; left: 4.4rem; top: 1rem; bottom: 1rem; width: 2px; background: linear-gradient(var(--green), var(--line)); }
.timeline-item { position: relative; display: grid; grid-template-columns: 8.8rem 1fr; gap: 1rem; padding: 1.1rem; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); box-shadow: var(--shadow-sm); }
.timeline-item time { position: relative; z-index: 1; align-self: start; justify-self: start; padding: .48rem .62rem; border: 1px solid rgba(121,201,0,.35); border-radius: .7rem; background: var(--surface-solid); color: var(--text); font-weight: 950; }
.timeline-columns { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .8rem; }
.timeline-columns > div { padding: .8rem; border-radius: 14px; background: var(--surface-soft); }
.timeline-columns h3 { margin: 0 0 .35rem; font-size: 1rem; }
.timeline-columns p { margin: 0; color: var(--muted); font-size: .9rem; }
.timeline-item.current { border-color: rgba(121,201,0,.45); }
.timeline-item.forecast { border-style: dashed; background: linear-gradient(135deg, rgba(121,201,0,.08), transparent 55%), var(--surface); }
.forecast-label { position: absolute; top: -0.62rem; right: 1.2rem; padding: .25rem .55rem; border-radius: 999px; background: var(--green); color: #132000; font-size: .68rem; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; }
.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); box-shadow: var(--shadow-sm); }
.comparison-table { width: 100%; min-width: 850px; border-collapse: collapse; }
.comparison-table th, .comparison-table td { padding: .95rem 1rem; border-bottom: 1px solid var(--line); vertical-align: top; text-align: left; }
.comparison-table thead th { position: sticky; top: 0; background: var(--surface-solid); color: var(--text); font-size: .86rem; }
.comparison-table tbody th { width: 12rem; color: var(--text); }
.comparison-table td { color: var(--muted); }
.comparison-table tr:last-child th, .comparison-table tr:last-child td { border-bottom: 0; }
.decision-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.decision-card { padding: 1.4rem; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); box-shadow: var(--shadow-sm); }
.decision-label { display: inline-block; padding: .3rem .58rem; border-radius: 999px; background: rgba(121,201,0,.12); color: var(--green-deep); font-size: .72rem; font-weight: 950; }
html[data-theme="dark"] .decision-label { color: var(--green-bright); }
.decision-card h3 { margin: 1rem 0 .55rem; }
.decision-card p { margin: 0; color: var(--muted); }
.bottom-line { margin-top: 1rem; padding: clamp(1.4rem,3vw,2.2rem); border: 1px solid rgba(121,201,0,.34); border-radius: var(--radius-lg); background: linear-gradient(135deg, rgba(121,201,0,.13), transparent 55%), var(--surface); }
.bottom-line strong { font-size: 1.1rem; }
.bottom-line p { margin: .55rem 0 0; color: var(--muted); }
.source-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .8rem; }
.source-link { min-height: 7rem; display: flex; flex-direction: column; justify-content: space-between; gap: .5rem; padding: 1rem; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); color: var(--text); text-decoration: none; box-shadow: var(--shadow-sm); transition: transform var(--transition), border-color var(--transition); }
.source-link:hover { transform: translateY(-3px); border-color: rgba(121,201,0,.4); }
.source-link span { color: var(--muted); font-size: .83rem; }
.source-date { margin-top: 1rem; color: var(--muted); font-size: .82rem; }

.owner-card { border-color: rgba(121,201,0,.35); background: linear-gradient(135deg, rgba(121,201,0,.10), transparent 50%), var(--surface); }
.notice-compact { padding: .8rem 1rem; border-left: 4px solid var(--green); border-radius: 0 .65rem .65rem 0; background: var(--surface-soft); font-size: .88rem; }
.inline-links { display: flex; flex-wrap: wrap; gap: .6rem; }
.inline-links a { padding: .52rem .7rem; border: 1px solid var(--line); border-radius: .7rem; background: var(--surface-soft); text-decoration: none; }
.legal-source { border-style: dashed; }
.footer-links a[aria-current="page"] { background: var(--surface); color: var(--text); }

@media (max-width: 1080px) {
  .system-grid, .decision-grid { grid-template-columns: 1fr; }
  .system-card { min-height: auto; }
  .source-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 900px) {
  .comparison-hero-inner, .profile-layout { grid-template-columns: 1fr; }
  .comparison-callout { max-width: 44rem; }
  .profile-portrait { max-width: 22rem; }
  .timeline-item { grid-template-columns: 1fr; }
  .timeline::before { display: none; }
  .timeline-columns { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .version-badge { display: none; }
  .brand-mark { width: 2.35rem; height: 2.35rem; }
  .pros-cons-columns, .source-grid { grid-template-columns: 1fr; }
  .comparison-hero h1 { font-size: clamp(2.7rem,15vw,4.8rem); }
  .system-facts { grid-template-columns: 1fr; }
  .system-facts dd { margin-bottom: .35rem; }
}


/* Supplied operating-system logos */
.system-logo-box {
  width: 3.75rem;
  height: 3.75rem;
  flex: 0 0 3.75rem;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(15, 24, 29, .14);
  border-radius: 1.05rem;
  background: #f8fafb;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 .45rem 1.2rem rgba(12,20,24,.10);
}
.system-logo {
  display: block;
  width: 2.65rem;
  height: 2.65rem;
  object-fit: contain;
}
.system-logo.apple-logo { width: 2.2rem; height: 2.7rem; }
.system-logo-box.mint-logo { background: #f6fbf1; }
.system-logo-box.windows-logo { background: #f3f8fd; }
.system-logo-box.apple-logo { background: #f7f7f8; }
.email-protected {
  display: inline-flex;
  max-width: min(100%, 38rem);
  flex-direction: column;
  align-items: flex-start;
  gap: .45rem;
}
.email-note {
  display: block;
  max-width: 40rem;
  color: var(--muted);
  font-size: .78rem;
  line-height: 1.5;
}
@media (max-width: 520px) {
  .system-logo-box { width: 3.35rem; height: 3.35rem; flex-basis: 3.35rem; }
  .system-logo { width: 2.3rem; height: 2.3rem; }
}


/* Contact and system-logo adjustments */
.footer-inner-compact { min-height:92px; }
.footer-inner-compact .footer-copy { margin-top:0; }
.pros-cons-heading { display:flex; align-items:center; gap:1rem; margin:0 0 1.2rem; }
.pros-cons-heading h3 { margin:0; font-size:clamp(1.7rem,3vw,2.6rem); letter-spacing:-.035em; }
.pros-cons-heading .system-logo-box { width:3.55rem; height:3.55rem; flex-basis:3.55rem; }
.pros-cons-heading .system-logo { width:2.45rem; height:2.45rem; }
.pros-cons-heading .system-logo.apple-logo { width:2.05rem; height:2.5rem; }
.protected-contact { display:flex; max-width:44rem; flex-direction:column; align-items:flex-start; gap:.65rem; }
.protected-contact p { margin:0; color:var(--muted); }
.contact-button { width:fit-content; }
.contact-protection-note { display:block; color:var(--muted); font-size:.8rem; line-height:1.55; }
.contact-main { padding-bottom:clamp(4rem,8vw,7rem); }
.contact-layout { width:min(calc(100% - 2rem),var(--page-width)); margin-inline:auto; display:grid; grid-template-columns:minmax(0,1.35fr) minmax(18rem,.65fr); gap:1rem; align-items:start; }
.contact-stack { display:grid; gap:1rem; }
.contact-panel { padding:clamp(1.3rem,3vw,2rem); border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface); box-shadow:var(--shadow-sm); }
.contact-panel h2 { margin-top:0; }
.contact-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.form-field { display:grid; gap:.42rem; }
.form-field-full { grid-column:1/-1; }
.form-field label { font-weight:850; }
.form-field input,.form-field textarea { width:100%; padding:.78rem .88rem; border:1px solid var(--line); border-radius:.82rem; background:var(--surface-soft); color:var(--text); font:inherit; }
.form-field input:focus,.form-field textarea:focus { outline:0; border-color:rgba(121,201,0,.7); box-shadow:0 0 0 .23rem rgba(121,201,0,.13); }
.form-field textarea { min-height:12rem; resize:vertical; }
.form-help { margin:0; color:var(--muted); font-size:.8rem; }
.form-check { display:flex; align-items:flex-start; gap:.65rem; color:var(--muted); }
.form-check input { width:auto; margin-top:.25rem; }
.form-actions { display:flex; flex-wrap:wrap; align-items:center; gap:.75rem; }
.form-actions button { border:0; cursor:pointer; }
.form-trap { position:absolute!important; left:-10000px!important; width:1px!important; height:1px!important; overflow:hidden!important; }
.form-notice { margin-bottom:1rem; padding:.9rem 1rem; border:1px solid var(--line); border-radius:.85rem; }
.form-notice.success { border-color:rgba(121,201,0,.55); background:rgba(121,201,0,.10); }
.form-notice.error { border-color:rgba(213,107,89,.55); background:rgba(213,107,89,.08); }
.form-errors { margin:.5rem 0 0; padding-left:1.2rem; }
.protected-address { display:inline-block; padding:.7rem .9rem; border:1px solid rgba(121,201,0,.45); border-radius:.8rem; background:rgba(121,201,0,.1); color:var(--text); font-weight:900; text-decoration:none; }
.contact-security-list { color:var(--muted); }
@media(max-width:900px){ .contact-layout{grid-template-columns:1fr;} }
@media(max-width:620px){ .contact-form-grid{grid-template-columns:1fr;} .pros-cons-heading .system-logo-box{width:3.15rem;height:3.15rem;flex-basis:3.15rem;} }

/* V12: Themenübersicht, Sicherheit und internes Linkverhalten */
.footer-links a {
  display: inline-flex;
  align-items: center;
  gap: .42rem;
}
.topics-main { padding-bottom: 0; }
.topics-hero { padding-bottom: clamp(3rem, 6vw, 5rem); }
.topics-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.topic-card {
  position: relative;
  min-height: 34rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: clamp(1.4rem, 3vw, 2rem);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: linear-gradient(145deg, rgba(121,201,0,.09), transparent 42%), var(--surface);
  box-shadow: var(--shadow-sm);
  transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition);
}
.topic-card::after {
  content: "";
  position: absolute;
  width: 18rem;
  height: 18rem;
  right: -10rem;
  bottom: -11rem;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(121,201,0,.18), transparent 70%);
  pointer-events: none;
}
.topic-card-security {
  background: linear-gradient(145deg, rgba(70,145,230,.10), transparent 42%), var(--surface);
}
.topic-card:hover {
  transform: translateY(-4px);
  border-color: rgba(121,201,0,.42);
  box-shadow: var(--shadow-lg);
}
.topic-card-top {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.topic-number {
  color: var(--green);
  font-size: .82rem;
  font-weight: 950;
  letter-spacing: .13em;
}
.topic-type {
  color: var(--muted);
  font-size: .77rem;
  font-weight: 850;
  text-align: right;
}
.topic-logos {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin: 2rem 0 1.2rem;
}
.topic-logo-wrap {
  width: 3.5rem;
  height: 3.5rem;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(15,24,29,.14);
  border-radius: 1rem;
  background: #f8fafb;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 .45rem 1.2rem rgba(12,20,24,.10);
}
.topic-logo-wrap.mint-logo { background: #f6fbf1; }
.topic-logo-wrap.windows-logo { background: #f3f8fd; }
.topic-logo-wrap.apple-logo { background: #f7f7f8; }
.topic-logo { width: 2.35rem; height: 2.35rem; object-fit: contain; }
.topic-logo.apple-logo { width: 1.95rem; height: 2.42rem; }
.topic-card h3 {
  margin: .25rem 0 .8rem;
  font-size: clamp(1.65rem, 3vw, 2.35rem);
  line-height: 1.08;
  letter-spacing: -.035em;
}
.topic-card > p { margin: 0; color: var(--muted); }
.topic-tags {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin: 1.3rem 0 1.6rem;
}
.topic-tags span {
  padding: .38rem .58rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-soft);
  color: var(--muted);
  font-size: .72rem;
  font-weight: 850;
}
.topic-button { width: fit-content; margin-top: auto; }
.topic-context-section {
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: var(--surface-soft);
}
.topic-context {
  min-height: 4.5rem;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .55rem;
  padding-block: .75rem;
}
.topic-context a,
.topic-context-current {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .55rem .72rem;
  border: 1px solid var(--line);
  border-radius: .75rem;
  background: var(--surface);
  color: var(--muted);
  font-size: .8rem;
  font-weight: 850;
  text-decoration: none;
}
.topic-context a:hover { color: var(--text); border-color: rgba(121,201,0,.4); }
.topic-context-current { color: var(--text); border-color: rgba(121,201,0,.45); background: rgba(121,201,0,.10); }
.topic-context-number { color: var(--green); font-weight: 950; }
.security-main { padding-bottom: 0; }
.security-hero::before { background: radial-gradient(circle, rgba(70,145,230,.17), transparent 70%); }
.security-system-grid .system-card { min-height: 40rem; }
.security-focus,
.security-attention {
  margin-top: 1rem;
  padding: .85rem .9rem;
  border-radius: .85rem;
  background: var(--surface-soft);
}
.security-focus { border-left: 4px solid var(--green); }
.security-attention { border-left: 4px solid #d56b59; }
.security-focus strong,
.security-attention strong { display: block; margin-bottom: .35rem; }
.security-focus p,
.security-attention p { margin: 0; color: var(--muted); font-size: .9rem; }
.security-table td { min-width: 13rem; }
.security-actions-grid { display: grid; gap: 1rem; }
.security-action-card {
  padding: clamp(1.35rem, 3vw, 2rem);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.security-action-primary {
  border-color: rgba(121,201,0,.42);
  background: linear-gradient(135deg, rgba(121,201,0,.11), transparent 48%), var(--surface);
}
.security-priority {
  display: inline-block;
  margin-bottom: .22rem;
  color: var(--green);
  font-size: .69rem;
  font-weight: 950;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.check-list {
  display: grid;
  gap: .7rem;
  margin: .4rem 0 0;
  padding: 0;
  color: var(--muted);
  list-style: none;
}
.check-list li {
  position: relative;
  padding-left: 1.65rem;
}
.check-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--green);
  font-weight: 950;
}
.myth-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}
.myth-card {
  padding: 1.35rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.myth-mark {
  width: 2.2rem;
  height: 2.2rem;
  display: grid;
  place-items: center;
  border-radius: .7rem;
  background: rgba(213,107,89,.12);
  color: #d56b59;
  font-size: 1.25rem;
  font-weight: 950;
}
.myth-card h3 { margin: 1rem 0 .55rem; }
.myth-card p { margin: 0; color: var(--muted); }
.topic-next {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding: clamp(1.5rem, 3vw, 2.4rem);
  border: 1px solid rgba(121,201,0,.36);
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, rgba(121,201,0,.12), transparent 55%), var(--surface);
  box-shadow: var(--shadow-sm);
}
.topic-next h2 { margin: .25rem 0 .55rem; }
.topic-next p { margin: 0; color: var(--muted); }
.topic-next .button { flex: 0 0 auto; }
@media (max-width: 900px) {
  .topics-grid,
  .myth-grid { grid-template-columns: 1fr; }
  .topic-card { min-height: auto; }
  .security-system-grid .system-card { min-height: auto; }
  .topic-next { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 560px) {
  .topic-context { align-items: stretch; flex-direction: column; }
  .topic-context a,
  .topic-context-current { width: 100%; justify-content: flex-start; }
  .topic-button,
  .topic-next .button { width: 100%; }
}


/* V13: PHP-Struktur, privates Impressum und zentrales Quellenverzeichnis */
.legal-title-row {
  display: flex;
  align-items: center;
  gap: clamp(.9rem, 2vw, 1.35rem);
  margin: .35rem 0 .65rem;
}
.legal-title-row h1 { margin: 0; }
.legal-page-mark {
  flex: 0 0 auto;
  width: clamp(3.3rem, 8vw, 5rem);
  height: clamp(3.3rem, 8vw, 5rem);
  display: grid;
  place-items: center;
  border: 1px solid rgba(121, 201, 0, .42);
  border-radius: 1.1rem;
  background:
    linear-gradient(145deg, rgba(255,255,255,.12), transparent 44%),
    linear-gradient(135deg, rgba(121,201,0,.2), rgba(121,201,0,.04)),
    var(--surface);
  color: var(--green);
  box-shadow: var(--shadow-sm);
  font-size: clamp(2rem, 5vw, 3rem);
  font-weight: 950;
  line-height: 1;
}
.private-site-badge {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  margin: 0 0 1rem;
  padding: .48rem .72rem;
  border: 1px solid rgba(121, 201, 0, .35);
  border-radius: 999px;
  background: rgba(121, 201, 0, .09);
  color: var(--text);
  font-size: .78rem;
  font-weight: 850;
  letter-spacing: .02em;
}
.private-site-badge::before {
  content: "";
  width: .52rem;
  height: .52rem;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 0 .26rem rgba(121,201,0,.12);
}
.source-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding: clamp(1.45rem, 3vw, 2.25rem);
  border: 1px solid rgba(121,201,0,.34);
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, rgba(121,201,0,.11), transparent 55%), var(--surface);
  box-shadow: var(--shadow-sm);
}
.source-summary h2 { margin: .2rem 0 .5rem; }
.source-summary p { margin: 0; color: var(--muted); }
.source-summary .button { flex: 0 0 auto; }
.source-catalog-main .comparison-hero { padding-bottom: clamp(3rem, 8vw, 5.5rem); }
.source-section + .source-section { border-top: 1px solid var(--line); }
.image-source-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.image-source-card {
  display: grid;
  grid-template-columns: 5rem minmax(0, 1fr);
  gap: 1rem;
  align-items: center;
  padding: 1.15rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.image-source-preview {
  width: 5rem;
  height: 5rem;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 1rem;
  background: var(--surface-soft);
}
.image-source-preview img {
  width: 82%;
  height: 82%;
  object-fit: contain;
}
.image-source-preview.wide img { width: 94%; height: 94%; }
.image-source-card h3 { margin: 0 0 .35rem; }
.image-source-card p { margin: 0; color: var(--muted); font-size: .9rem; }
.legal-card a.button-primary,
.legal-card a.button-primary:visited,
html[data-theme="dark"] .legal-card a.button-primary,
html[data-theme="dark"] .legal-card a.button-primary:visited {
  color: #102000;
}
.legal-card a.button-primary .i18n {
  color: inherit;
}

.source-note {
  margin-top: 1rem;
  padding: 1rem 1.1rem;
  border-left: 4px solid var(--green);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  background: var(--surface-soft);
  color: var(--muted);
}
@media (max-width: 760px) {
  .source-summary { align-items: flex-start; flex-direction: column; }
  .source-summary .button { width: 100%; }
  .image-source-grid { grid-template-columns: 1fr; }
}
@media (max-width: 430px) {
  .legal-title-row { align-items: flex-start; flex-direction: column; }
  .image-source-card { grid-template-columns: 1fr; }
}


/* Gemeinsame Rechtseiten: geschützte E-Mail-Anzeige */
.legal-hero-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: clamp(1.5rem, 5vw, 4rem);
}
.legal-person-portrait {
  width: clamp(8.5rem, 16vw, 11rem);
  margin: 0;
  display: grid;
  justify-items: center;
  gap: .65rem;
}
.legal-person-portrait img {
  width: 100%;
  height: auto;
  aspect-ratio: 195 / 207;
  object-fit: cover;
  border: 1px solid rgba(121, 201, 0, .38);
  border-radius: 1.35rem;
  background: var(--surface);
  box-shadow: var(--shadow-lg);
}
.legal-person-portrait figcaption {
  color: var(--muted);
  font-size: .82rem;
  font-weight: 850;
}
.email-protection {
  width: min(100%, 42rem);
}
.email-reveal-form {
  width: 100%;
  margin-top: .2rem;
}
.email-challenge-row {
  display: grid;
  grid-template-columns: minmax(12rem, 1fr) minmax(6.5rem, .45fr) auto;
  align-items: end;
  gap: .7rem;
}
.email-challenge-row label {
  color: var(--text);
  font-weight: 850;
}
.email-challenge-row input {
  width: 100%;
  min-height: 2.9rem;
  padding: .72rem .8rem;
  border: 1px solid var(--line);
  border-radius: .78rem;
  background: var(--surface-soft);
  color: var(--text);
  font: inherit;
}
.email-challenge-row input:focus {
  outline: 0;
  border-color: rgba(121, 201, 0, .7);
  box-shadow: 0 0 0 .23rem rgba(121, 201, 0, .13);
}
.email-challenge-row .button {
  min-height: 2.9rem;
  border: 0;
  cursor: pointer;
  white-space: nowrap;
}
.project-download {
  position: relative;
  z-index: 1;
  width: fit-content;
  margin-top: 1.15rem;
}
@media (max-width: 780px) {
  .legal-hero-layout { grid-template-columns: 1fr; }
  .legal-person-portrait { justify-self: start; width: 9rem; }
  .email-challenge-row { grid-template-columns: 1fr; align-items: stretch; }
  .email-challenge-row .button { width: 100%; }
}


/* Personenbild direkt bei Betreiber/Verantwortlichem und Eingabefeld ohne Zahlenpfeile */
.legal-person-data {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: clamp(1.2rem, 4vw, 2.5rem);
}
.legal-person-data .data-list {
  min-width: 0;
}
.legal-inline-portrait {
  width: clamp(6.5rem, 11vw, 8rem);
  margin: 0;
}
.legal-inline-portrait img {
  width: 100%;
  height: auto;
  aspect-ratio: 195 / 207;
  object-fit: cover;
  border: 1px solid rgba(121, 201, 0, .38);
  border-radius: 1rem;
  background: var(--surface);
  box-shadow: var(--shadow-md);
}
.email-challenge-row input[type="number"] {
  appearance: textfield;
  -moz-appearance: textfield;
}
.email-challenge-row input[type="number"]::-webkit-inner-spin-button,
.email-challenge-row input[type="number"]::-webkit-outer-spin-button {
  margin: 0;
  -webkit-appearance: none;
}
@media (max-width: 1050px) {
  .legal-person-data {
    grid-template-columns: 1fr;
  }
  .legal-inline-portrait {
    grid-row: 1;
    width: 7rem;
  }
  .email-challenge-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .email-challenge-row .button {
    width: 100%;
  }
}


/* V16: Partner, Projektanleitungen, Thema PC-Kauf und Rechtseiten-Porträt links oben */
.footer-partners {
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(circle at 18% 0%, rgba(121,201,0,.10), transparent 38%),
    var(--surface);
}
.footer-partners-inner {
  display: grid;
  grid-template-columns: minmax(16rem, .75fr) minmax(0, 1.25fr);
  align-items: center;
  gap: clamp(1.5rem, 4vw, 3rem);
  padding-block: clamp(1.6rem, 4vw, 2.7rem);
}
.footer-partners-copy .kicker { margin-bottom: .45rem; }
.footer-partners-copy h2 {
  margin: 0 0 .55rem;
  font-size: clamp(1.35rem, 2.5vw, 1.9rem);
  letter-spacing: -.025em;
}
.footer-partners-copy p:last-child { margin: 0; color: var(--muted); font-size: .88rem; }
.partner-links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
}
.partner-link {
  min-height: 6.1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .65rem;
  padding: .85rem;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 1rem;
  background: #fff;
  color: #233039;
  text-decoration: none;
  box-shadow: var(--shadow-sm);
  transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition);
}
.partner-link:hover,
.partner-link:focus-visible { transform: translateY(-3px); border-color: rgba(121,201,0,.55); box-shadow: var(--shadow-md); }
.partner-link img { display: block; max-width: 100%; max-height: 4.4rem; width: auto; height: auto; object-fit: contain; }
.partner-ideenfabrik img { max-width: 10.5rem; }
.partner-linux-mint img { width: 3.8rem; height: 3.8rem; }
.partner-linux-mint span:not(.visually-hidden) { font-size: 1rem; font-weight: 900; }
.partner-world4you img { width: min(100%, 12rem); }

.project-actions {
  position: relative;
  z-index: 1;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  margin-top: 1.15rem;
}
.project-actions .project-download,
.project-actions .project-manual { margin-top: 0; }
.project-actions .button { flex: 1 1 11rem; justify-content: center; }
.project-manual { width: fit-content; }

.topics-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.topic-card-purchase { background: linear-gradient(145deg, rgba(226,170,55,.11), transparent 42%), var(--surface); }
.purchase-hero::before { background: radial-gradient(circle, rgba(226,170,55,.16), transparent 70%); }
.purchase-system-grid .system-card { min-height: 43rem; }
.purchase-list { padding-left: 1.15rem; color: var(--muted); }
.purchase-list li + li { margin-top: .72rem; }
.purchase-principles .principle { min-height: 20rem; }
.purchase-avoid-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.purchase-table th:first-child { min-width: 9rem; }
.partner-preview.wide img { width: 100%; height: 100%; object-fit: contain; }

.legal-person-data {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  column-gap: clamp(1.1rem, 3vw, 2rem);
  row-gap: 1rem;
}
.legal-person-data .legal-inline-portrait {
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  justify-self: start;
  width: clamp(6rem, 9vw, 7.2rem);
  position: relative;
  z-index: 1;
  margin-top: clamp(-3.35rem, -3.8vw, -2.5rem);
  margin-left: clamp(-1.75rem, -2vw, -1.1rem);
}
.legal-person-data .data-list {
  grid-column: 2;
  grid-row: 1;
}
.owner-card > h2 {
  margin-left: clamp(6.8rem, 8.4vw, 7.6rem);
}

@media (max-width: 1120px) {
  .topics-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .topic-card-purchase { grid-column: 1 / -1; min-height: 29rem; }
  .footer-partners-inner { grid-template-columns: 1fr; }
  .purchase-system-grid .system-card { min-height: auto; }
}
@media (max-width: 900px) {
  .topics-grid,
  .purchase-avoid-grid { grid-template-columns: 1fr; }
  .topic-card-purchase { grid-column: auto; min-height: auto; }
  .partner-links { grid-template-columns: 1fr 1fr 1fr; }
}
@media (max-width: 720px) {
  .partner-links { grid-template-columns: 1fr; }
  .partner-link { min-height: 5.2rem; }
  .legal-person-data { grid-template-columns: auto minmax(0, 1fr); }
  .legal-person-data .legal-inline-portrait { width: 5.8rem; margin-top: -2.15rem; margin-left: -1rem; }
  .owner-card > h2 { margin-left: 6.4rem; }
}
@media (max-width: 520px) {
  .legal-hero h1 {
    font-size: clamp(1.75rem, 8.8vw, 2.2rem);
    overflow-wrap: normal;
    word-break: normal;
    hyphens: manual;
  }
  .legal-person-data { grid-template-columns: 1fr; }
  .legal-person-data .legal-inline-portrait { grid-column: 1; grid-row: 1; width: 5.7rem; margin: -1.9rem 0 0 -.85rem; }
  .owner-card > h2 { margin-left: 6.1rem; }
  .legal-person-data .data-list { grid-column: 1; grid-row: 2; }
  .project-actions .button { flex-basis: 100%; width: 100%; }
}

/* V16: integrierte Projektanleitungen */
.manual-main {
  padding-bottom: 0;
}
.manual-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(4.25rem, 9vw, 7rem) 0 clamp(3rem, 7vw, 5.4rem);
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(circle at 80% 20%, rgba(121,201,0,.15), transparent 33%),
    linear-gradient(180deg, var(--surface-soft), transparent);
}
.manual-hero::after {
  content: "";
  position: absolute;
  width: 30rem;
  height: 30rem;
  right: -18rem;
  bottom: -22rem;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(121,201,0,.14), transparent 70%);
  pointer-events: none;
}
.manual-hero-lotto {
  background:
    radial-gradient(circle at 80% 20%, rgba(226,170,55,.18), transparent 34%),
    linear-gradient(180deg, var(--surface-soft), transparent);
}
.manual-hero-rsync {
  background:
    radial-gradient(circle at 80% 20%, rgba(176,91,207,.16), transparent 34%),
    linear-gradient(180deg, var(--surface-soft), transparent);
}
.manual-hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(17rem, .65fr);
  align-items: center;
  gap: clamp(2rem, 6vw, 5rem);
}
.manual-hero h1 {
  max-width: 16ch;
  margin: .55rem 0 1.15rem;
  font-size: clamp(2.65rem, 6vw, 5.1rem);
  line-height: .98;
  letter-spacing: -.055em;
}
.manual-hero .lead code { font-size: .9em; }
.manual-badges {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin: 1.35rem 0 0;
}
.manual-badges span {
  padding: .42rem .65rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  color: var(--muted);
  font-size: .75rem;
  font-weight: 850;
}
.manual-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .7rem;
  margin-top: 1.45rem;
}
.manual-actions .project-download { margin-top: 0; }
.manual-summary {
  padding: 1.25rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  box-shadow: var(--shadow-md);
  backdrop-filter: blur(14px);
}
.manual-summary > strong {
  display: block;
  margin-bottom: .9rem;
  font-size: 1.05rem;
}
.manual-summary dl {
  display: grid;
  grid-template-columns: minmax(6rem, .55fr) minmax(0, 1fr);
  gap: .7rem 1rem;
  margin: 0;
}
.manual-summary dt {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 850;
}
.manual-summary dd {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
  font-weight: 850;
}
.manual-layout {
  display: grid;
  grid-template-columns: minmax(12rem, .28fr) minmax(0, 1fr);
  gap: clamp(1.25rem, 4vw, 3rem);
  align-items: start;
  padding-block: clamp(2.3rem, 6vw, 5rem);
}
.manual-toc {
  position: sticky;
  top: calc(var(--header-height, 5rem) + 1rem);
  display: grid;
  gap: .25rem;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.manual-toc > strong {
  margin: .15rem .5rem .55rem;
  font-size: .83rem;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.manual-toc a {
  padding: .58rem .65rem;
  border-radius: .65rem;
  color: var(--muted);
  font-size: .82rem;
  font-weight: 800;
  text-decoration: none;
}
.manual-toc a:hover,
.manual-toc a:focus-visible {
  background: var(--surface-soft);
  color: var(--text);
}
.manual-content {
  min-width: 0;
  display: grid;
  gap: 1rem;
}
.manual-card {
  scroll-margin-top: 7rem;
  padding: clamp(1.35rem, 3vw, 2.2rem);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.manual-card h2 {
  margin: .15rem 0 1rem;
  font-size: clamp(1.65rem, 3.2vw, 2.35rem);
  line-height: 1.08;
  letter-spacing: -.035em;
}
.manual-card h3 { margin: 1.35rem 0 .65rem; }
.manual-card > p:last-child { margin-bottom: 0; }
.manual-step-list,
.manual-check-list {
  display: grid;
  gap: .75rem;
  padding-left: 1.25rem;
  color: var(--muted);
}
.manual-step-list li,
.manual-check-list li { padding-left: .2rem; }
.manual-check-list { list-style: none; padding-left: 0; }
.manual-check-list li {
  position: relative;
  padding-left: 1.65rem;
}
.manual-check-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--green);
  font-weight: 950;
}
.manual-code {
  margin: 1rem 0;
  padding: 1rem 1.1rem;
  overflow-x: auto;
  border: 1px solid rgba(121,201,0,.3);
  border-radius: .85rem;
  background: #0e1519;
  color: #dfffb0;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
.manual-code code {
  padding: 0;
  background: transparent;
  color: inherit;
  font-size: .9rem;
  white-space: pre;
}
.manual-table-wrap {
  width: 100%;
  margin: 1rem 0;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 1rem;
}
.manual-table {
  width: 100%;
  min-width: 38rem;
  border-collapse: collapse;
  background: var(--surface);
}
.manual-table th,
.manual-table td {
  padding: .85rem .95rem;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}
.manual-table th {
  background: var(--surface-soft);
  color: var(--text);
  font-size: .78rem;
  letter-spacing: .035em;
}
.manual-table td { color: var(--muted); }
.manual-table tr:last-child td { border-bottom: 0; }
.manual-tip,
.manual-warning {
  margin-top: 1rem;
  padding: 1rem 1.1rem;
  border-radius: .9rem;
  background: var(--surface-soft);
}
.manual-tip { border-left: 4px solid var(--green); }
.manual-warning { border-left: 4px solid #d56b59; }
.manual-tip > strong,
.manual-warning > strong { display: block; margin-bottom: .35rem; }
.manual-tip p,
.manual-warning p { margin: 0; color: var(--muted); }
.manual-card.manual-warning {
  border: 1px solid rgba(213,107,89,.38);
  border-left: 5px solid #d56b59;
  background: linear-gradient(135deg, rgba(213,107,89,.08), transparent 50%), var(--surface);
}
.manual-token-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin: 1rem 0;
}
.manual-token-grid code {
  min-width: 4.5rem;
  padding: .55rem .7rem;
  border: 1px solid var(--line);
  border-radius: .65rem;
  background: var(--surface-soft);
  text-align: center;
  font-weight: 900;
}

/* Rechtseiten: Porträt deutlicher nach links oben */
.owner-card .legal-person-data {
  margin-top: -.15rem;
}
.owner-card .legal-inline-portrait {
  width: clamp(5.6rem, 8vw, 6.8rem);
  margin-top: clamp(-2.9rem, -3.2vw, -2rem);
  margin-left: clamp(-.85rem, -1.25vw, -.35rem);
}

@media (max-width: 900px) {
  .manual-hero-grid,
  .manual-layout { grid-template-columns: 1fr; }
  .manual-summary { max-width: 38rem; }
  .manual-toc {
    position: static;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .manual-toc > strong { grid-column: 1 / -1; }
}
@media (max-width: 620px) {
  .manual-toc { grid-template-columns: 1fr; }
  .manual-actions .button { width: 100%; justify-content: center; }
  .manual-summary dl { grid-template-columns: 1fr; gap: .25rem; }
  .manual-summary dd + dt { margin-top: .55rem; }
  .owner-card .legal-inline-portrait {
    width: 5.4rem;
    margin: -2.1rem 0 0 -.45rem;
  }
}

/* V16: Bild und Überschrift der Rechtseiten als gemeinsame linke Kopfgruppe */
.owner-card .legal-person-data {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: clamp(1.05rem, 3vw, 1.85rem);
  margin-top: .15rem;
}
.owner-card .legal-inline-portrait {
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  justify-self: start;
  width: clamp(5.8rem, 8vw, 6.8rem);
  margin: clamp(-1.35rem, -1.8vw, -1rem) 0 0 clamp(-1.35rem, -1.8vw, -1rem);
}
.owner-card .legal-person-copy {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
}
.owner-card .legal-person-copy h2 {
  margin: 0 0 1rem;
}
.owner-card .legal-person-copy .data-list {
  grid-column: auto;
  grid-row: auto;
}
@media (max-width: 620px) {
  .owner-card .legal-person-data {
    grid-template-columns: auto minmax(0, 1fr);
    gap: .9rem;
  }
  .owner-card .legal-inline-portrait {
    width: 5.2rem;
    margin: -.9rem 0 0 -.9rem;
  }
}
@media (max-width: 430px) {
  .owner-card .legal-person-data {
    grid-template-columns: 1fr;
  }
  .owner-card .legal-inline-portrait,
  .owner-card .legal-person-copy {
    grid-column: 1;
  }
  .owner-card .legal-inline-portrait {
    grid-row: 1;
    width: 5.3rem;
    margin: -.8rem 0 0 -.75rem;
  }
  .owner-card .legal-person-copy {
    grid-row: 2;
  }
}

/* V18: Namensgeschichte, Kontaktformular und größeres Porträt auf den Rechtseiten */
.about-story {
  position: relative;
  padding: clamp(1.6rem, 4vw, 3rem);
  overflow: hidden;
  border: 1px solid rgba(121, 201, 0, .32);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(circle at 94% 6%, rgba(121, 201, 0, .17), transparent 23rem),
    linear-gradient(145deg, var(--surface), var(--surface-soft));
  box-shadow: var(--shadow-lg);
}
.about-story::after {
  content: "dog + truck";
  position: absolute;
  right: clamp(1rem, 4vw, 3rem);
  bottom: .4rem;
  color: rgba(121, 201, 0, .08);
  font-size: clamp(2.2rem, 7vw, 6.5rem);
  font-weight: 950;
  letter-spacing: -.06em;
  line-height: 1;
  pointer-events: none;
  white-space: nowrap;
}
.about-story .section-title {
  position: relative;
  z-index: 1;
  max-width: 18ch;
}
.about-story-copy {
  position: relative;
  z-index: 1;
  margin-top: clamp(1.4rem, 3vw, 2.2rem);
  columns: 2 27rem;
  column-gap: clamp(1.8rem, 5vw, 4.5rem);
}
.about-story-copy p {
  break-inside: avoid;
  margin: 0 0 1.05rem;
  color: var(--muted);
  line-height: 1.72;
}
.about-story-copy strong { color: var(--text); }
.about-profile {
  margin-top: clamp(3rem, 7vw, 6rem);
  padding-top: clamp(2.5rem, 6vw, 5rem);
  border-top: 1px solid var(--line);
}

.owner-card .legal-person-data.person-card-layout {
  display: block;
  margin: 0;
}
.owner-card .person-card-layout .legal-person-copy {
  display: block;
  min-width: 0;
}
.owner-card .person-card-layout .legal-person-copy h2 {
  margin: 0 0 1rem;
}
.owner-card .person-details-list {
  grid-template-columns: minmax(7.25rem, .34fr) minmax(0, 1fr);
  align-items: start;
  gap: .8rem 1.2rem;
}
.owner-card .person-name-cell {
  width: 100%;
  min-height: 10.8rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(8.8rem, 13vw, 10.4rem);
  align-items: center;
  gap: clamp(1rem, 3vw, 2rem);
}
.owner-card .person-name-cell > strong {
  color: var(--text);
  font-size: clamp(1.08rem, 2vw, 1.25rem);
  font-weight: 900;
}
.owner-card .person-name-photo {
  display: block;
  width: clamp(8.8rem, 13vw, 10.4rem);
  justify-self: end;
  margin-right: -.65rem;
}
.owner-card .person-name-photo img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 195 / 207;
  object-fit: cover;
  border: 1px solid rgba(121, 201, 0, .46);
  border-radius: 1.15rem;
  background: var(--surface);
  box-shadow: var(--shadow-md);
}
.owner-card .person-contact-cell {
  min-width: 0;
  display: grid;
  justify-items: start;
  gap: .65rem;
}
.owner-card .person-contact-cell .contact-protection-note {
  max-width: 38rem;
}
.legal-contact-button { width: fit-content; }

.contact-panel > p { color: var(--muted); }
.contact-panel > p:last-child { margin-bottom: 0; }
.contact-form-grid { margin-top: 1.4rem; }
.form-check a {
  color: var(--green-deep);
  font-weight: 850;
  text-underline-offset: .18em;
}
html[data-theme="dark"] .form-check a { color: var(--green-bright); }
.form-notice strong { display: block; margin-bottom: .25rem; }
.form-notice > span { display: block; }
.form-errors { color: var(--muted); }
.contact-security-list {
  display: grid;
  gap: .55rem;
  margin-bottom: 0;
  padding-left: 1.25rem;
}
.contact-panel .inline-links { margin-top: 1rem; }
.contact-panel button.button { font: inherit; }

@media (max-width: 620px) {
  .about-story { padding: 1.35rem; }
  .about-story::after { right: .7rem; bottom: .2rem; }
  .about-profile { margin-top: 3rem; padding-top: 3rem; }
  .owner-card .person-details-list {
    grid-template-columns: 1fr;
    gap: .32rem;
  }
  .owner-card .person-details-list dd { margin-bottom: .9rem; }
  .owner-card .person-name-cell {
    min-height: 8.6rem;
    grid-template-columns: minmax(0, 1fr) 7.5rem;
    gap: .8rem;
  }
  .owner-card .person-name-photo {
    width: 7.5rem;
    margin-right: -.25rem;
  }
  .owner-card .person-contact-cell,
  .owner-card .person-contact-cell .button {
    width: 100%;
  }
}
@media (max-width: 430px) {
  .owner-card .person-name-cell {
    min-height: 7.5rem;
    grid-template-columns: minmax(0, 1fr) 6.5rem;
  }
  .owner-card .person-name-photo {
    width: 6.5rem;
    margin-right: 0;
  }
}

/* V18 final: Namensgeschichte, kontaktfreundliche E-Mail-Lösung und Rechtseiten-Porträt rechts */
.origin-story {
  position: relative;
  margin-top: .8rem;
  padding: clamp(1.35rem, 3vw, 2.25rem);
  overflow: hidden;
  border: 1px solid rgba(121, 201, 0, .3);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(circle at 96% 4%, rgba(121, 201, 0, .16), transparent 18rem),
    linear-gradient(145deg, var(--surface), var(--surface-soft));
  box-shadow: var(--shadow-sm);
}
.origin-story::after {
  content: "dog + truck";
  position: absolute;
  right: clamp(.65rem, 3vw, 1.8rem);
  bottom: .25rem;
  color: rgba(121, 201, 0, .075);
  font-size: clamp(2rem, 5.7vw, 4.8rem);
  font-weight: 950;
  letter-spacing: -.065em;
  line-height: 1;
  pointer-events: none;
  white-space: nowrap;
}
.origin-story .section-title,
.origin-story p {
  position: relative;
  z-index: 1;
}
.origin-story .section-title {
  max-width: 21ch;
  margin: 0 0 1.15rem;
  font-size: clamp(1.9rem, 4vw, 3.15rem);
}
.origin-story p {
  margin: 0 0 1rem;
  color: var(--muted);
  font-size: 1rem;
  line-height: 1.72;
}
.origin-story p:last-child { margin-bottom: 0; }
.origin-story strong { color: var(--text); }
.origin-story .story-closing {
  margin-top: 1.25rem;
  padding-top: 1.15rem;
  border-top: 1px solid var(--line);
  color: var(--text);
  font-weight: 760;
}
.about-today {
  margin-top: clamp(2rem, 4vw, 3.2rem);
  padding-top: clamp(1.8rem, 4vw, 3rem);
  border-top: 1px solid var(--line);
}
.about-today > p { color: var(--muted); font-size: 1.05rem; }
.profile-layout { align-items: start; }
.profile-portrait { padding-top: .8rem; }

.owner-card .legal-person-data.person-card-layout,
.owner-card .person-card-layout .legal-person-copy {
  display: block;
  margin: 0;
}
.owner-card .person-card-layout .legal-person-copy h2 { margin: 0 0 1.15rem; }
.owner-card .person-card-content {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(10.5rem, 16vw, 13.25rem);
  align-items: start;
  gap: clamp(1.5rem, 4vw, 3.5rem);
}
.owner-card .person-details-list {
  min-width: 0;
  grid-template-columns: minmax(7.5rem, .34fr) minmax(0, 1fr);
  align-items: start;
  gap: .82rem 1.25rem;
}
.owner-card .person-card-photo {
  width: clamp(10.5rem, 16vw, 13.25rem);
  margin: -.6rem -1rem 0 0;
  justify-self: end;
}
.owner-card .person-card-photo img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 195 / 207;
  object-fit: cover;
  border: 1px solid rgba(121, 201, 0, .46);
  border-radius: 1.25rem;
  background: var(--surface);
  box-shadow: var(--shadow-lg);
}
.owner-card .person-email-cell { min-width: 0; }
.owner-card .person-email-cell .protected-contact { max-width: 100%; }

.email-protection { width: min(100%, 44rem); }
.email-action-row {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .7rem;
}
.email-reveal-form { width: auto; margin: 0; }
.email-reveal-form .button {
  min-height: 2.85rem;
  border: 0;
  cursor: pointer;
  font: inherit;
}
.email-contact-link { min-height: 2.85rem; }
.direct-email-panel .email-protection { margin-top: 1rem; }
.direct-email-panel .protected-contact > p:first-child,
.direct-email-panel .protected-contact > p:nth-child(2) { font-size: .9rem; }

@media (max-width: 860px) {
  .owner-card .person-card-content {
    grid-template-columns: minmax(0, 1fr) 10.5rem;
    gap: 1.25rem;
  }
  .owner-card .person-card-photo {
    width: 10.5rem;
    margin-right: -.35rem;
  }
}
@media (max-width: 680px) {
  .origin-story { padding: 1.25rem; }
  .owner-card .person-card-content { grid-template-columns: 1fr; }
  .owner-card .person-card-photo {
    grid-row: 1;
    width: clamp(8.75rem, 38vw, 11rem);
    margin: -.35rem 0 .4rem auto;
  }
  .owner-card .person-details-list {
    grid-template-columns: 1fr;
    gap: .28rem;
  }
  .owner-card .person-details-list dd { margin-bottom: .8rem; }
  .email-action-row,
  .email-reveal-form,
  .email-action-row .button { width: 100%; }
  .email-action-row .button { justify-content: center; }
}

/* V18 Korrektur: Die alte Namenszeile reservierte noch Platz für das frühere Bildlayout. */
.owner-card .person-name-cell {
  width: auto;
  min-height: 0;
  display: block;
}
.owner-card .person-name-cell > strong {
  display: inline;
  font-size: clamp(1.08rem, 2vw, 1.25rem);
}


/* V19: mehr visuelle Unterstützung auf den Themenseiten */
.hero-logo-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .75rem;
  margin-top: 1.15rem;
  padding-top: 1.15rem;
  border-top: 1px solid var(--line);
}
.hero-logo-box {
  width: 4rem;
  height: 4rem;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(15,24,29,.14);
  border-radius: 1.15rem;
  background: #f8fafb;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 .45rem 1.2rem rgba(12,20,24,.10);
}
.hero-logo-box.mint-logo { background: #f6fbf1; }
.hero-logo-box.windows-logo { background: #f3f8fd; }
.hero-logo-box.apple-logo { background: #f7f7f8; }
.hero-logo-box img { display: block; width: 2.75rem; height: 2.75rem; object-fit: contain; }
.hero-logo-box.apple-logo img { width: 2.25rem; height: 2.8rem; }

.topic-logos-featured {
  width: fit-content;
  padding: .7rem;
  border: 1px solid var(--line);
  border-radius: 1.25rem;
  background: linear-gradient(135deg, rgba(121,201,0,.08), transparent 62%), var(--surface-soft);
  box-shadow: var(--shadow-sm);
}

.purchase-principles {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.purchase-principles .purchase-principle {
  position: relative;
  min-height: 24rem;
  overflow: hidden;
  padding: 0 1.35rem 1.45rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.purchase-principles .purchase-principle h3 {
  margin: 0 0 .75rem;
  font-size: clamp(1.45rem, 2.5vw, 2rem);
  letter-spacing: -.03em;
}
.purchase-principles .purchase-principle > p {
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}
.purchase-principle-media {
  position: relative;
  min-height: 9.5rem;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 -1.35rem 1.35rem;
  padding: 1.15rem 1.25rem;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(circle at 90% 12%, rgba(255,255,255,.88), transparent 8rem),
    linear-gradient(135deg, rgba(121,201,0,.19), rgba(70,145,230,.10) 52%, rgba(226,170,55,.12));
}
.purchase-principle-life .purchase-principle-media {
  background:
    radial-gradient(circle at 90% 12%, rgba(255,255,255,.88), transparent 8rem),
    linear-gradient(135deg, rgba(70,145,230,.17), rgba(121,201,0,.10) 58%, rgba(190,202,210,.14));
}
.purchase-principle-cost .purchase-principle-media {
  background:
    radial-gradient(circle at 90% 12%, rgba(255,255,255,.88), transparent 8rem),
    linear-gradient(135deg, rgba(226,170,55,.20), rgba(121,201,0,.09) 56%, rgba(70,145,230,.09));
}
.purchase-principle-number {
  position: relative;
  z-index: 2;
  align-self: flex-start;
  color: var(--text);
  font-size: clamp(2.6rem, 5vw, 4.5rem);
  font-weight: 950;
  line-height: .9;
  letter-spacing: -.08em;
}
.purchase-principle-symbol {
  position: absolute;
  right: .75rem;
  top: -.2rem;
  color: rgba(15,24,29,.09);
  font-size: 7.5rem;
  font-weight: 950;
  line-height: 1;
  pointer-events: none;
}
.purchase-principle-logos {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: .45rem;
}
.purchase-principle-logos img {
  width: 3rem;
  height: 3rem;
  padding: .42rem;
  object-fit: contain;
  border: 1px solid rgba(15,24,29,.12);
  border-radius: .9rem;
  background: rgba(255,255,255,.88);
  box-shadow: 0 .4rem 1rem rgba(12,20,24,.10);
}
.purchase-principle-logos img:last-child { padding: .35rem .55rem; }

.decision-card-head {
  display: flex;
  align-items: center;
  gap: .8rem;
}
.decision-card-head .system-logo-box {
  width: 3.2rem;
  height: 3.2rem;
  flex-basis: 3.2rem;
  border-radius: .9rem;
}
.decision-card-head .system-logo { width: 2.15rem; height: 2.15rem; }
.decision-card-head .system-logo.apple-logo { width: 1.8rem; height: 2.2rem; }
.decision-card-head + h3 { margin-top: 1rem; }

@media (max-width: 1080px) {
  .purchase-principles { grid-template-columns: 1fr; }
  .purchase-principles .purchase-principle { min-height: auto; }
}
@media (max-width: 620px) {
  .hero-logo-row { justify-content: flex-start; }
  .hero-logo-box { width: 3.45rem; height: 3.45rem; }
  .hero-logo-box img { width: 2.35rem; height: 2.35rem; }
  .hero-logo-box.apple-logo img { width: 1.95rem; height: 2.4rem; }
  .purchase-principle-media { min-height: 8.4rem; }
  .purchase-principle-logos img { width: 2.55rem; height: 2.55rem; }
}

/* V21: vier Themen und bebilderte Arbeitsprinzipien */
.topic-card-shortcuts {
  background: linear-gradient(145deg, rgba(131,104,210,.11), transparent 42%), var(--surface);
}
@media (min-width: 1121px) {
  .topics-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.topics-principle-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}
.topics-principle {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.principle-media {
  aspect-ratio: 3 / 2;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
  background: var(--surface-soft);
}
.principle-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.principle-body { padding: 1.35rem; }
.principle-number {
  display: inline-grid;
  place-items: center;
  min-width: 2.7rem;
  height: 2.7rem;
  padding: 0 .55rem;
  border: 1px solid rgba(121,201,0,.30);
  border-radius: 12px;
  background: rgba(121,201,0,.10);
  color: var(--green-deep);
  font-size: .76rem;
  font-weight: 950;
  letter-spacing: .08em;
}
html[data-theme="dark"] .principle-number { color: var(--green-bright); }
.principle-body h3 {
  margin: 1rem 0 .55rem;
  font-size: 1.35rem;
  line-height: 1.15;
}
.principle-body p { margin: 0; color: var(--muted); }
.principle-body .card-link { display: inline-flex; margin-top: 1rem; }
@media (max-width: 1020px) {
  .topics-principle-grid { grid-template-columns: 1fr; }
  .topics-principle { display: grid; grid-template-columns: minmax(15rem, .9fr) minmax(0, 1.1fr); }
  .principle-media { aspect-ratio: auto; min-height: 16rem; border-bottom: 0; border-right: 1px solid var(--line); }
}
@media (max-width: 680px) {
  .topics-principle { display: block; }
  .principle-media { min-height: 0; aspect-ratio: 3 / 2; border-right: 0; border-bottom: 1px solid var(--line); }
}


/* V22: Tastaturkürzel in das gemeinsame Dogtruck-Layout integriert */
.shortcuts-main { padding-bottom: 0; }
.shortcuts-hero { padding-bottom: clamp(3rem, 6vw, 5rem); }
.shortcut-hero-logos {
  display: flex;
  align-items: center;
  gap: .75rem;
  margin-top: 1.6rem;
}
.shortcut-hero-logo,
.shortcut-os-logo {
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--line);
  background: #f8fafb;
  box-shadow: var(--shadow-sm);
}
.shortcut-hero-logo {
  width: 4.2rem;
  height: 4.2rem;
  border-radius: 1.15rem;
}
.shortcut-hero-logo img { width: 2.8rem; height: 2.8rem; object-fit: contain; }
.shortcut-hero-logo:last-child img { width: 2.35rem; height: 2.9rem; }
.shortcuts-workspace { padding-top: clamp(3.8rem, 7vw, 6rem); }
.shortcut-controls {
  display: grid;
  gap: 1.2rem;
  margin-bottom: 1rem;
  padding: clamp(1.2rem, 3vw, 1.75rem);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: linear-gradient(145deg, rgba(121,201,0,.08), transparent 46%), var(--surface);
  box-shadow: var(--shadow-sm);
}
.shortcut-search-row { display: grid; gap: .55rem; }
.shortcut-search-label { font-size: .9rem; font-weight: 850; color: var(--muted); }
.shortcut-search-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .75rem; }
.shortcut-search {
  width: 100%;
  min-height: 3rem;
  padding: .72rem 1rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface-solid);
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
.shortcut-search:focus { border-color: rgba(121,201,0,.7); outline: 3px solid color-mix(in srgb, var(--green) 24%, transparent); outline-offset: 2px; }
.shortcut-print { white-space: nowrap; cursor: pointer; }
.shortcut-os-selector,
.shortcut-filters { display: flex; flex-wrap: wrap; gap: .7rem; }
.shortcut-os-btn,
.shortcut-filter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  min-height: 2.85rem;
  padding: .62rem .9rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface-solid);
  color: var(--text);
  font-weight: 850;
  cursor: pointer;
  transition: transform var(--transition), border-color var(--transition), background-color var(--transition), box-shadow var(--transition);
}
.shortcut-os-btn:hover,
.shortcut-filter:hover { transform: translateY(-2px); border-color: var(--line-strong); box-shadow: var(--shadow-sm); }
.shortcut-os-btn.active,
.shortcut-filter.active {
  border-color: rgba(121,201,0,.62);
  background: linear-gradient(135deg, var(--green-bright), var(--green));
  color: #102000;
}
.shortcut-os-logo { width: 2rem; height: 2rem; border-radius: .62rem; box-shadow: none; }
.shortcut-os-logo img { width: 1.35rem; height: 1.35rem; object-fit: contain; }
.shortcut-os-btn[data-os="macos"] .shortcut-os-logo img { width: 1.1rem; height: 1.4rem; }
.shortcut-filters { margin-top: .1rem; }
.shortcut-filter { min-height: 2.5rem; padding: .48rem .78rem; border-radius: 999px; font-size: .9rem; }
.shortcut-note {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1.4rem;
  align-items: center;
  margin: 1rem 0 1.5rem;
  padding: 1.2rem 1.35rem;
  border: 1px solid var(--line);
  border-left: 4px solid var(--green);
  border-radius: var(--radius-md);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.shortcut-note strong { display: block; margin-bottom: .25rem; }
.shortcut-note p { margin: 0; color: var(--muted); }
.shortcut-active-os {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.4rem;
  padding: .45rem .85rem;
  border: 1px solid rgba(121,201,0,.35);
  border-radius: 999px;
  background: rgba(121,201,0,.1);
  color: var(--text);
  font-size: .86rem;
  font-weight: 900;
  white-space: nowrap;
}
.shortcut-panel { display: none; }
.shortcut-panel.active { display: block; }
.shortcut-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.shortcut-category {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.shortcut-category[hidden] { display: none !important; }
.shortcut-category h2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 0;
  padding: 1rem 1.15rem;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(135deg, rgba(121,201,0,.08), transparent 58%);
  font-size: 1.05rem;
  line-height: 1.25;
}
.shortcut-count { color: var(--muted); font-size: .76rem; font-weight: 780; white-space: nowrap; }
.shortcut-table-wrap { width: 100%; overflow-x: auto; }
.shortcut-table { width: 100%; min-width: 31rem; border-collapse: collapse; }
.shortcut-table th,
.shortcut-table td { padding: .78rem 1rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }
.shortcut-table tr:last-child td { border-bottom: 0; }
.shortcut-table th { color: var(--muted); font-size: .74rem; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.shortcut-table th:first-child,
.shortcut-table td:first-child { width: 44%; }
.shortcut-table td:last-child { color: var(--muted); }
.shortcut-table tr[hidden] { display: none; }
.shortcut-category kbd {
  display: inline-block;
  min-width: 1.85rem;
  margin: .08rem .08rem .08rem 0;
  padding: .18rem .42rem;
  border: 1px solid var(--line-strong);
  border-bottom-width: 3px;
  border-radius: 7px;
  background: var(--surface-soft);
  color: var(--text);
  font: 800 .82rem/1.35 ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  text-align: center;
  white-space: nowrap;
}
.shortcut-plus { margin: 0 .15rem; color: var(--muted); font-weight: 900; }
.shortcut-page-end {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--line);
}
.shortcut-page-end p { margin: 0; color: var(--muted); font-size: .9rem; }
@media (max-width: 820px) {
  .shortcut-grid { grid-template-columns: 1fr; }
  .shortcut-note { grid-template-columns: 1fr; }
  .shortcut-active-os { justify-self: start; }
}
@media (max-width: 620px) {
  .shortcut-search-actions { grid-template-columns: 1fr; }
  .shortcut-print { width: 100%; }
  .shortcut-os-btn { flex: 1 1 9rem; }
  .shortcut-table { min-width: 28rem; }
  .shortcut-page-end { align-items: flex-start; flex-direction: column; }
  .shortcut-hero-logo { width: 3.6rem; height: 3.6rem; }
  .shortcut-hero-logo img { width: 2.35rem; height: 2.35rem; }
}
@media print {
  .site-header,
  .site-footer,
  .shortcut-controls,
  .shortcut-filters,
  .shortcut-print,
  .shortcut-page-end .button { display: none !important; }
  .comparison-hero { padding: 1.5rem 0 1rem; }
  .section { padding: 1rem 0; }
  .shortcut-panel { display: none !important; }
  .shortcut-panel.active { display: block !important; }
  .shortcut-grid { display: block; }
  .shortcut-category { break-inside: avoid; margin-bottom: .8rem; box-shadow: none; }
  .shortcut-table { min-width: 0; }
}

/* V23: Druckvarianten der Tastaturkürzel + APT-Steuerungszentrale -------- */
.shortcut-print-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .55rem;
}
.shortcut-emergency td:last-child strong { color: var(--green); }

.software-hub-hero { padding-bottom: clamp(3rem, 7vw, 5.5rem); }
.software-hub-stat strong { font-size: clamp(1.4rem, 3vw, 2.2rem); }
.software-hub-controls {
  display: grid;
  gap: .9rem;
  margin-bottom: 1.4rem;
  padding: clamp(1.1rem, 3vw, 1.55rem);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: linear-gradient(145deg, rgba(121,201,0,.08), transparent 50%), var(--surface);
  box-shadow: var(--shadow-sm);
}
.software-hub-controls label { color: var(--muted); font-size: .9rem; font-weight: 850; }
.software-hub-search {
  width: 100%;
  min-height: 3rem;
  padding: .72rem 1rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface-solid);
  color: var(--text);
}
.software-hub-search:focus {
  border-color: rgba(121,201,0,.7);
  outline: 3px solid color-mix(in srgb, var(--green) 24%, transparent);
  outline-offset: 2px;
}
.software-hub-filters { display: flex; flex-wrap: wrap; gap: .55rem; }
.software-hub-filter {
  min-height: 2.35rem;
  padding: .42rem .72rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-solid);
  color: var(--text);
  font: inherit;
  font-size: .84rem;
  font-weight: 800;
  cursor: pointer;
}
.software-hub-filter:hover { border-color: var(--line-strong); }
.software-hub-filter.active {
  border-color: rgba(121,201,0,.62);
  background: linear-gradient(135deg, var(--green-bright), var(--green));
  color: #102000;
}
.software-hub-result { margin: 0; color: var(--muted); font-size: .9rem; font-weight: 800; }
.software-hub-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}
.software-hub-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: .75rem;
  padding: 1.2rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.software-hub-card[hidden] { display: none !important; }
.software-hub-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: .85rem; }
.software-hub-icon-wrap {
  flex: 0 0 4.5rem;
  width: 4.5rem;
  height: 4.5rem;
  display: grid;
  place-items: center;
  padding: .55rem;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: color-mix(in srgb, var(--surface-solid) 92%, #fff 8%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
}
.software-hub-icon { width: 100%; height: 100%; object-fit: contain; }
.software-hub-icon-fallback { font-size: .8rem; font-weight: 950; letter-spacing: .08em; color: var(--green); }
.software-hub-meta { display: flex; min-width: 0; flex: 1; flex-direction: column; align-items: flex-end; gap: .45rem; }
.apt-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.8rem;
  padding: .2rem .58rem;
  border: 1px solid rgba(121,201,0,.5);
  border-radius: 999px;
  background: rgba(121,201,0,.12);
  color: var(--text);
  font-size: .76rem;
  font-weight: 950;
  letter-spacing: .08em;
}
.software-category { color: var(--muted); font-size: .78rem; font-weight: 800; text-align: right; }
.software-hub-card h3 { margin: 0; font-size: 1.22rem; }
.software-hub-card p { margin: 0; color: var(--muted); }
.software-package {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  margin-top: auto;
  padding-top: .7rem;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: .82rem;
  font-weight: 800;
}
.software-package code,
.apt-command-row code,
.apt-detail-hero code {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
  color: var(--text);
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
}
.software-package code { padding: .22rem .42rem; }
.software-hub-actions { margin-top: .1rem; }
.software-hub-actions .button { width: 100%; }

.apt-detail-hero .eyebrow { display: flex; align-items: center; gap: .6rem; }
.apt-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.apt-detail-card {
  padding: clamp(1.2rem, 3vw, 1.7rem);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.apt-detail-card h2 { margin: .35rem 0 1rem; }
.apt-command-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .7rem; align-items: center; }
.apt-command-row code { display: block; overflow-x: auto; padding: .82rem 1rem; white-space: nowrap; }
.apt-copy-status { min-height: 1.35rem; margin: .55rem 0 0; color: var(--muted); font-size: .86rem; }

@media (max-width: 980px) {
  .software-hub-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .shortcut-print-actions { display: grid; grid-template-columns: 1fr; width: 100%; }
  .shortcut-print-actions .button { width: 100%; }
  .software-hub-grid, .apt-detail-grid { grid-template-columns: 1fr; }
  .apt-command-row { grid-template-columns: 1fr; }
}

@media print {
  @page { size: A4 portrait; margin: 12mm 11mm 13mm; }

  html,
  body {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
    color: #000 !important;
  }

  .shortcuts-main,
  .shortcuts-main .container,
  .shortcuts-main .comparison-hero-inner,
  .shortcuts-main .section-header,
  .shortcuts-main .shortcut-panel,
  .shortcuts-main .shortcut-grid,
  .shortcuts-main .shortcut-category,
  .shortcuts-main .shortcut-table-wrap,
  .shortcuts-main .shortcut-table {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: none !important;
  }

  .shortcuts-main [data-reveal],
  html.js .shortcuts-main [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .shortcuts-main .comparison-hero {
    overflow: visible !important;
    padding: 0 0 6mm !important;
    background: #fff !important;
  }
  .shortcuts-main .comparison-hero::before { display: none !important; }
  .shortcuts-main .comparison-hero-inner { display: block !important; padding: 0 !important; }
  .shortcuts-main .comparison-hero h1 {
    margin: 3mm 0 3mm !important;
    font-size: 20pt !important;
    line-height: 1.08 !important;
    letter-spacing: -.025em !important;
    text-wrap: wrap !important;
  }
  .shortcuts-main .gradient-text {
    background: none !important;
    color: #000 !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    -webkit-text-fill-color: #000 !important;
  }
  .shortcuts-main .eyebrow { margin: 0 0 2mm !important; font-size: 8pt !important; }
  .shortcuts-main .lead { max-width: none !important; font-size: 9.5pt !important; line-height: 1.42 !important; }
  .shortcuts-main .shortcut-hero-logos { margin-top: 4mm !important; }
  .shortcuts-main .shortcut-hero-logo { width: 10mm !important; height: 10mm !important; border-radius: 2.5mm !important; box-shadow: none !important; }
  .shortcuts-main .shortcut-hero-logo img,
  .shortcuts-main .shortcut-hero-logo:last-child img { width: 7mm !important; height: 7mm !important; object-fit: contain !important; }
  .shortcuts-main .comparison-callout {
    margin-top: 5mm !important;
    padding: 4mm !important;
    border: 1px solid #bbb !important;
    box-shadow: none !important;
    break-inside: avoid !important;
  }
  .shortcuts-main .comparison-callout p { margin: 1.5mm 0 0 !important; font-size: 8.7pt !important; line-height: 1.35 !important; }

  .shortcuts-main .shortcuts-workspace,
  .shortcuts-main .section { padding: 5mm 0 0 !important; }
  .shortcuts-main .section-header { padding: 0 !important; }
  .shortcuts-main .section-title { margin: 1.5mm 0 2mm !important; font-size: 16pt !important; line-height: 1.15 !important; }
  .shortcuts-main .section-intro { max-width: none !important; margin-bottom: 4mm !important; font-size: 9pt !important; }
  .shortcuts-main .shortcut-note {
    display: block !important;
    margin: 0 0 5mm !important;
    padding: 3.5mm !important;
    border: 1px solid #aaa !important;
    border-left: 1.2mm solid #5f8f2f !important;
    box-shadow: none !important;
    break-inside: avoid !important;
  }
  .shortcuts-main .shortcut-note p { font-size: 8.5pt !important; line-height: 1.35 !important; }
  .shortcuts-main .shortcut-active-os { margin-top: 2mm !important; min-height: 0 !important; padding: 1mm 2mm !important; font-size: 7.5pt !important; }

  .shortcuts-main .shortcut-panel { display: none !important; }
  .shortcuts-main .shortcut-panel.active { display: block !important; }
  .shortcuts-main .shortcut-grid { display: block !important; }
  .shortcuts-main .shortcut-category {
    overflow: visible !important;
    margin: 0 0 4mm !important;
    border: 1px solid #aaa !important;
    border-radius: 2.5mm !important;
    box-shadow: none !important;
    break-inside: avoid-page !important;
    page-break-inside: avoid !important;
  }
  .shortcuts-main .shortcut-category h2 {
    padding: 2.5mm 3mm !important;
    background: #f3f3f3 !important;
    color: #000 !important;
    font-size: 10pt !important;
  }
  .shortcuts-main .shortcut-table-wrap { overflow: visible !important; }
  .shortcuts-main .shortcut-table { table-layout: fixed !important; border-collapse: collapse !important; font-size: 8.2pt !important; }
  .shortcuts-main .shortcut-table th,
  .shortcuts-main .shortcut-table td { padding: 2mm 2.5mm !important; border-bottom: 1px solid #ccc !important; }
  .shortcuts-main .shortcut-table th:first-child,
  .shortcuts-main .shortcut-table td:first-child { width: 39% !important; }
  .shortcuts-main .shortcut-category kbd {
    min-width: 5mm !important;
    padding: .5mm 1.2mm !important;
    border: 1px solid #777 !important;
    border-bottom-width: 1.5px !important;
    background: #f7f7f7 !important;
    color: #000 !important;
    font-size: 7.5pt !important;
  }
  .shortcuts-main .shortcut-count { font-size: 7pt !important; }

  .shortcut-controls,
  .shortcut-filters,
  .shortcut-print,
  .shortcut-print-actions,
  .shortcut-page-end .button { display: none !important; }

  body.print-with-graphics .shortcuts-main,
  body.print-with-graphics .shortcuts-main * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  body.print-text-only .shortcuts-main img,
  body.print-text-only .shortcut-hero-logos,
  body.print-text-only .shortcut-os-logo { display: none !important; }
  body.print-text-only .shortcuts-main .comparison-hero { padding-bottom: 4mm !important; }
  body.print-text-only .shortcuts-main .shortcut-category h2,
  body.print-text-only .shortcuts-main .comparison-callout,
  body.print-text-only .shortcuts-main .shortcut-note,
  body.print-text-only .shortcuts-main kbd {
    background: #fff !important;
  }
}


/* V25: allgemeine Themen-Drucksteuerung --------------------------------- */
.topic-print-bar {
  position: relative;
  z-index: 2;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--surface) 88%, transparent);
}
.topic-print-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .6rem;
  padding-top: .75rem;
  padding-bottom: .75rem;
}
.topic-print-label {
  margin-right: .15rem;
  color: var(--muted);
  font-size: .84rem;
  font-weight: 850;
}
.topic-print-button {
  min-height: 2.55rem;
  padding: .5rem .78rem;
}

@media (max-width: 620px) {
  .topic-print-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .topic-print-label { grid-column: 1 / -1; }
  .topic-print-button { width: 100%; }
}

@media print {
  .topic-print-bar,
  [data-print-controls] {
    display: none !important;
  }

  body.print-with-graphics main,
  body.print-with-graphics main * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  body.print-with-graphics main [data-reveal],
  body.print-text-only main [data-reveal],
  html.js body.print-with-graphics main [data-reveal],
  html.js body.print-text-only main [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  body.print-with-graphics main .container,
  body.print-text-only main .container {
    width: 100% !important;
    max-width: none !important;
  }

  body.print-with-graphics main .comparison-hero,
  body.print-text-only main .comparison-hero {
    overflow: visible !important;
    padding: 0 0 6mm !important;
  }

  body.print-with-graphics main .comparison-hero-inner,
  body.print-text-only main .comparison-hero-inner {
    display: block !important;
  }

  body.print-with-graphics main .comparison-callout,
  body.print-text-only main .comparison-callout {
    margin-top: 4mm !important;
    box-shadow: none !important;
    break-inside: avoid !important;
  }

  body.print-with-graphics main .section,
  body.print-text-only main .section {
    padding: 6mm 0 !important;
  }

  body.print-with-graphics main .topic-context-section,
  body.print-text-only main .topic-context-section {
    padding: 3mm 0 !important;
  }

  body.print-with-graphics main .topic-context,
  body.print-text-only main .topic-context {
    flex-wrap: wrap !important;
    gap: 2mm !important;
  }

  body.print-with-graphics main .topics-grid,
  body.print-text-only main .topics-grid,
  body.print-with-graphics main .principle-grid,
  body.print-text-only main .principle-grid,
  body.print-with-graphics main .system-grid,
  body.print-text-only main .system-grid,
  body.print-with-graphics main .security-system-grid,
  body.print-text-only main .security-system-grid,
  body.print-with-graphics main .security-actions-grid,
  body.print-text-only main .security-actions-grid,
  body.print-with-graphics main .myth-grid,
  body.print-text-only main .myth-grid,
  body.print-with-graphics main .decision-grid,
  body.print-text-only main .decision-grid,
  body.print-with-graphics main .pros-cons-grid,
  body.print-text-only main .pros-cons-grid {
    grid-template-columns: 1fr !important;
  }

  body.print-with-graphics main .topic-card,
  body.print-text-only main .topic-card,
  body.print-with-graphics main .principle,
  body.print-text-only main .principle,
  body.print-with-graphics main .system-card,
  body.print-text-only main .system-card,
  body.print-with-graphics main .myth-card,
  body.print-text-only main .myth-card,
  body.print-with-graphics main .decision-card,
  body.print-text-only main .decision-card,
  body.print-with-graphics main .security-action-card,
  body.print-text-only main .security-action-card,
  body.print-with-graphics main .pros-cons-card,
  body.print-text-only main .pros-cons-card {
    min-height: 0 !important;
    box-shadow: none !important;
    break-inside: avoid-page !important;
  }

  body.print-with-graphics main .table-wrap,
  body.print-text-only main .table-wrap {
    overflow: visible !important;
  }

  body.print-with-graphics main table,
  body.print-text-only main table {
    width: 100% !important;
    font-size: 8.5pt !important;
  }

  body.print-with-graphics main th,
  body.print-with-graphics main td,
  body.print-text-only main th,
  body.print-text-only main td {
    padding: 1.8mm 2mm !important;
  }

  body.print-text-only main img,
  body.print-text-only main picture,
  body.print-text-only main svg,
  body.print-text-only main .hero-logo-row,
  body.print-text-only main .topic-logos,
  body.print-text-only main .principle-media,
  body.print-text-only main .purchase-principle-media,
  body.print-text-only main .purchase-principle-logos,
  body.print-text-only main .system-logo-box {
    display: none !important;
  }

  body.print-text-only main,
  body.print-text-only main section,
  body.print-text-only main article,
  body.print-text-only main aside,
  body.print-text-only main .comparison-callout,
  body.print-text-only main .topic-card,
  body.print-text-only main .principle,
  body.print-text-only main .system-card,
  body.print-text-only main .myth-card,
  body.print-text-only main .decision-card,
  body.print-text-only main .security-action-card,
  body.print-text-only main .pros-cons-card {
    background: #fff !important;
    box-shadow: none !important;
  }
}


/* V30: Startkarten mit zuverlässig sichtbaren Hintergrundbildern -------- */
.home-focus-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-color: rgba(255,255,255,.18);
  background: #0b1114;
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), var(--shadow-sm);
}
.home-focus-card::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  filter: brightness(1.75) saturate(1.18) contrast(1.04);
  transform: scale(1.015);
  opacity: .98;
  pointer-events: none;
}
.home-focus-linux::before { background-image: url('../bilder/home-linux-mint.webp'); }
.home-focus-programme::before { background-image: url('../bilder/home-programme.webp'); }
.home-focus-themen::before { background-image: url('../bilder/home-themen.webp'); }
.home-focus-web::before { background-image: url('../bilder/home-web-netzwerk.webp'); }
.home-focus-card::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(4,7,9,.08), rgba(4,7,9,.22) 38%, rgba(4,7,9,.58) 72%, rgba(4,7,9,.76) 100%),
    linear-gradient(90deg, rgba(4,7,9,.12), transparent 72%);
  pointer-events: none;
}
.home-focus-card > * { position: relative; z-index: 2; }
.home-focus-card h3,
.home-focus-card p,
.home-focus-card .card-tag,
.home-focus-card .card-link { color: #fff; text-shadow: 0 1px 5px rgba(0,0,0,.96); }
.home-focus-card p { color: rgba(255,255,255,.96); }
.home-focus-card .card-number {
  color: #e5ffb7 !important;
  border-color: rgba(216,255,154,.55);
  background: rgba(7,18,8,.68);
  backdrop-filter: blur(6px);
}
.home-focus-card .card-tag,
.home-focus-card .card-link {
  display: inline-flex;
  width: fit-content;
  padding: .34rem .55rem;
  border-radius: .55rem;
  background: rgba(5,8,10,.52);
  backdrop-filter: blur(5px);
}
.home-focus-card .card-link { text-decoration-color: rgba(255,255,255,.7); }

/* V26: APT + Flatpak Software-Zentrale ----------------------------------- */
.flatpak-badge {
  display: inline-flex;
  align-items: center;
  min-height: 1.7rem;
  padding: .26rem .55rem;
  border: 1px solid rgba(68,150,220,.35);
  border-radius: 999px;
  background: rgba(68,150,220,.12);
  color: #2b80c6;
  font-size: .72rem;
  font-weight: 950;
  letter-spacing: .03em;
}
html[data-theme="dark"] .flatpak-badge { color: #83c9ff; }
.software-source-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
}
.software-source-filter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.45rem;
  padding: .45rem .8rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-size: .82rem;
  font-weight: 850;
  cursor: pointer;
}
.software-source-filter.active { border-color: rgba(121,201,0,.55); box-shadow: 0 0 0 3px rgba(121,201,0,.1); }
.software-source-badges { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .35rem; }
.software-package-list { display: grid; gap: .45rem; margin-top: auto; }
.software-hub-actions { display: grid; grid-template-columns: 1fr; gap: .5rem; }

/* V26: Logo zur Verlinkung ------------------------------------------------ */
.logo-share-grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: 1rem;
}
.logo-share-card {
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.logo-share-card h2 { margin: .5rem 0 1rem; font-size: clamp(1.25rem, 2.4vw, 1.7rem); }
.logo-share-preview {
  display: grid;
  min-height: 16rem;
  place-items: center;
  padding: 2rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background:
    linear-gradient(45deg, rgba(127,127,127,.08) 25%, transparent 25%, transparent 75%, rgba(127,127,127,.08) 75%),
    linear-gradient(45deg, rgba(127,127,127,.08) 25%, transparent 25%, transparent 75%, rgba(127,127,127,.08) 75%),
    var(--surface-solid);
  background-position: 0 0, 12px 12px;
  background-size: 24px 24px;
}
.logo-share-preview img { width: min(100%, 34rem); height: auto; }
.logo-code { max-height: 17rem; }
.logo-copy-status { min-height: 1.5em; margin: .65rem 0 0; color: var(--muted); font-size: .88rem; }
.logo-rule-grid code { overflow-wrap: anywhere; }
.logo-preview-note { margin: .85rem 0 0; color: var(--muted); font-size: .9rem; }
.logo-share-preview a { display: block; line-height: 0; border-radius: calc(var(--radius-md) - 2px); }
.logo-share-preview a:focus-visible { outline: 3px solid rgba(121,201,0,.55); outline-offset: 5px; }
.logo-address-section { padding-top: clamp(2rem, 4vw, 3.5rem); }
.logo-address-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, .95fr);
  gap: clamp(1rem, 3vw, 2rem);
  align-items: center;
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.logo-address-card h2 { margin: .35rem 0 .7rem; font-size: clamp(1.25rem, 2.4vw, 1.7rem); }
.logo-address-card p:last-child { margin-bottom: 0; }
.logo-address-box {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .65rem;
  border: 1px solid var(--line);
  border-radius: 1rem;
  background: var(--surface-solid);
}
.logo-address-box code {
  flex: 1 1 auto;
  min-width: 0;
  padding: .25rem .35rem;
  color: var(--text);
  font-size: clamp(.82rem, 1.6vw, .95rem);
  overflow-wrap: anywhere;
}
.logo-address-box .button { flex: 0 0 auto; }

@media (max-width: 820px) {
  .logo-address-card { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .logo-address-box { align-items: stretch; flex-direction: column; }
  .logo-address-box .button { width: 100%; }
}

@media (max-width: 820px) {
  .logo-share-grid { grid-template-columns: 1fr; }
}

/* V26: Druckdarstellung für Projektanleitungen ---------------------------- */
@media print {
  body.print-with-graphics .manual-main,
  body.print-text-only .manual-main,
  body.print-with-graphics .manual-main *,
  body.print-text-only .manual-main * {
    max-width: 100% !important;
  }
  body.print-with-graphics .manual-main [data-reveal],
  body.print-text-only .manual-main [data-reveal],
  html.js body.print-with-graphics .manual-main [data-reveal],
  html.js body.print-text-only .manual-main [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  body.print-with-graphics .manual-main .manual-hero,
  body.print-text-only .manual-main .manual-hero {
    padding: 0 0 6mm !important;
    background: #fff !important;
    color: #000 !important;
  }
  body.print-with-graphics .manual-main .manual-hero::after,
  body.print-text-only .manual-main .manual-hero::after { display: none !important; }
  body.print-with-graphics .manual-main .manual-hero-grid,
  body.print-text-only .manual-main .manual-hero-grid,
  body.print-with-graphics .manual-main .manual-layout,
  body.print-text-only .manual-main .manual-layout {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
  }
  body.print-with-graphics .manual-main .manual-summary,
  body.print-text-only .manual-main .manual-summary {
    margin-top: 4mm !important;
    padding: 4mm !important;
    border: 1px solid #bbb !important;
    background: #fff !important;
    box-shadow: none !important;
    break-inside: avoid !important;
  }
  body.print-with-graphics .manual-main .manual-toc,
  body.print-text-only .manual-main .manual-toc,
  body.print-with-graphics .manual-main .manual-actions,
  body.print-text-only .manual-main .manual-actions { display: none !important; }
  body.print-with-graphics .manual-main .manual-content,
  body.print-text-only .manual-main .manual-content { width: 100% !important; }
  body.print-with-graphics .manual-main .manual-card,
  body.print-text-only .manual-main .manual-card {
    margin: 0 0 5mm !important;
    padding: 4mm 0 !important;
    border: 0 !important;
    border-top: 1px solid #bbb !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    break-inside: auto !important;
  }
  body.print-with-graphics .manual-main .manual-card h2,
  body.print-text-only .manual-main .manual-card h2 { font-size: 14pt !important; }
  body.print-with-graphics .manual-main .manual-code,
  body.print-text-only .manual-main .manual-code {
    white-space: pre-wrap !important;
    overflow-wrap: anywhere !important;
    border: 1px solid #bbb !important;
    background: #f7f7f7 !important;
    color: #000 !important;
    box-shadow: none !important;
  }
  body.print-with-graphics .manual-main .manual-table-wrap,
  body.print-text-only .manual-main .manual-table-wrap { overflow: visible !important; }
  body.print-with-graphics .manual-main .manual-table,
  body.print-text-only .manual-main .manual-table { width: 100% !important; font-size: 8.5pt !important; }
  body.print-with-graphics .manual-main .manual-table th,
  body.print-with-graphics .manual-main .manual-table td,
  body.print-text-only .manual-main .manual-table th,
  body.print-text-only .manual-main .manual-table td { padding: 1.8mm 2mm !important; }
  body.print-text-only .manual-main img,
  body.print-text-only .manual-main picture,
  body.print-text-only .manual-main svg { display: none !important; }
  body.print-with-graphics .manual-main,
  body.print-with-graphics .manual-main * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }
}


/* V30: Über-Text und Porträt als gemeinsamer Inhaltsblock ---------------- */
#ueber .profile-layout { display: block; }
#ueber .profile-copy { display: block; }
#ueber .origin-story { display: flow-root; }
#ueber .profile-portrait-inline {
  position: relative;
  z-index: 2;
  float: right;
  width: clamp(12rem, 22vw, 17.5rem);
  margin: .1rem 0 1.25rem clamp(1.35rem, 3vw, 2.5rem);
  padding-top: 0;
}
#ueber .profile-portrait-inline .portrait-frame {
  width: 100%;
  background:
    radial-gradient(circle at 50% 25%, rgba(121,201,0,.24), transparent 44%),
    linear-gradient(145deg, var(--surface-soft), var(--surface-solid));
}
#ueber .profile-portrait-inline .profile-caption {
  display: block;
  width: 100%;
  margin-top: .55rem;
  text-align: center;
}
@media (max-width: 760px) {
  #ueber .profile-portrait-inline {
    float: none;
    width: min(100%, 17rem);
    margin: .75rem auto 1.4rem;
  }
}
