/* === from: index.json (kh77) === */
/* ── Know-how Index 77 – Premium Topic Hub ── */

.kh77-hero {
  padding-bottom: 24px;
  text-align: center;
  background: linear-gradient(180deg, rgba(237,243,249,0.6) 0%, rgba(245,248,252,0) 100%);
}
.kh77-hero .eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 14px;
  border: 1px solid rgba(13,78,136,0.12);
  background: rgba(13,78,136,0.06);
  color: var(--brand-main-darker, #083A66);
  border-radius: var(--radius-full, 999px);
  font-size: var(--type-xs); font-weight: 700;
  letter-spacing: 0.04em; text-transform: uppercase;
  margin-bottom: 28px;
}
.kh77-hero h1 {
  color: var(--text-primary, #122033);
  margin: 0 0 20px;
}
.kh77-hero .hero-sub {
  font-size: var(--type-md); color: var(--text-secondary, #42566E);
  max-width: 560px; margin: 0 auto; line-height: var(--lh-relaxed);
}
@media (max-width: 575.98px) {
  .kh77-hero { padding-bottom: 16px; }
}

/* Grid */
.kh77-grid-section {
  padding: var(--space-system-48, 48px) 0 var(--space-system-96, 96px);
}
.kh77-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  max-width: 960px;
  margin: 0 auto;
}
@media (max-width: 767.98px) {
  .kh77-grid { grid-template-columns: 1fr; gap: 16px; }
  .kh77-grid-section { padding: var(--space-system-36, 36px) 0 var(--space-system-48, 48px); }
}

/* Article Card */
.kh77-card {
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-subtle, #DCE4EC);
  border-radius: var(--radius-xl, 22px);
  box-shadow: var(--shadow-soft, 0 16px 40px rgba(10,36,67,0.08));
  padding: 32px 28px;
  display: flex; flex-direction: column;
  text-decoration: none;
  color: inherit;
  transition: transform 260ms ease, box-shadow 260ms ease;
}
.kh77-card:hover {
  box-shadow: var(--shadow-strong, 0 24px 60px rgba(9,34,63,0.16));
  transform: translateY(-3px);
  text-decoration: none;
  color: inherit;
}
.kh77-card-icon {
  width: 48px; height: 48px;
  border-radius: var(--radius-md, 12px);
  background: rgba(13,78,136,0.07);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 20px; flex-shrink: 0;
}
.kh77-card-icon svg {
  width: 22px; height: 22px;
  stroke: var(--brand-main-color, #0D4E88);
  fill: none; stroke-width: 2;
}
.kh77-card h3 {
  font-size: var(--type-md); font-weight: 800;
  color: var(--brand-main-color, #0D4E88);
  letter-spacing: -0.015em; line-height: var(--lh-normal);
  margin: 0 0 10px;
  transition: color 150ms ease;
}
.kh77-card:hover h3 {
  color: var(--brand-main-darker, #083A66);
}
.kh77-card p {
  font-size: var(--type-sm); color: var(--text-secondary, #42566E);
  line-height: var(--lh-relaxed); margin: 0;
  flex-grow: 1;
}
.kh77-card .kh77-read {
  margin-top: 18px;
  font-size: var(--type-sm);
  font-weight: 700;
  color: var(--brand-main-color, #0D4E88);
  display: inline-flex; align-items: center; gap: 6px;
}
.kh77-card .kh77-read svg {
  width: 14px; height: 14px;
  stroke: currentColor; fill: none; stroke-width: 2.5;
  transition: transform 150ms ease;
}
.kh77-card:hover .kh77-read svg {
  transform: translateX(3px);
}

/* Footer hint */
.kh77-footer-hint {
  max-width: 640px; margin: 0 auto;
  padding: 24px 28px;
  background: rgba(13,78,136,0.04);
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-md, 12px);
  text-align: center;
  font-size: var(--type-sm);
  color: var(--text-muted, #6A7C93);
  line-height: var(--lh-normal);
}
.kh77-footer-hint a {
  color: var(--brand-main-color, #0D4E88);
  font-weight: 600; text-decoration: none;
}
.kh77-footer-hint a:hover { text-decoration: underline; }
.kh77-bottom {
  padding: 0 0 var(--space-system-120, 120px);
}
@media (max-width: 575.98px) {
  .kh77-bottom { padding-bottom: var(--space-system-72, 72px); }
  .kh77-footer-hint { padding: 18px 16px; font-size: var(--type-sm); }
}

/* === from: tipps-sichere-kennwoerter.json === */
/* -- Tipps sichere Passwoerter 77 -- Editorial Know-how Page -- */

.tp77-hero {
  padding-bottom: 24px;
  text-align: center;
  background: linear-gradient(180deg, rgba(237,243,249,0.6) 0%, rgba(245,248,252,0) 100%);
}
.tp77-hero .eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 14px;
  border: 1px solid rgba(13,78,136,0.12);
  background: rgba(13,78,136,0.06);
  color: var(--brand-main-darker, #083A66);
  border-radius: var(--radius-full, 999px);
  font-size: var(--type-xs); font-weight: 700;
  letter-spacing: 0.04em; text-transform: uppercase;
  margin-bottom: 28px;
}
.tp77-hero h1 {
  color: var(--text-primary, #122033);
  margin: 0 0 20px;
}
.tp77-hero .hero-sub {
  font-size: var(--type-md); color: var(--text-secondary, #42566E);
  max-width: 520px; margin: 0 auto; line-height: var(--lh-relaxed);
}
@media (max-width: 575.98px) {
  .tp77-hero { padding-bottom: 16px; }
}

/* Article body */
.tp77-article {
  padding: var(--space-system-48, 48px) 0 var(--space-system-120, 120px);
}
.tp77-inner {
  max-width: 740px; margin: 0 auto;
}
.tp77-inner p {
  font-size: var(--type-base); color: var(--text-secondary, #42566E);
  line-height: var(--lh-relaxed); margin: 0 0 20px;
}
.tp77-inner p:last-child { margin-bottom: 0; }
.tp77-inner a {
  color: var(--brand-main-color, #0D4E88); font-weight: 600;
  text-decoration: none; border-bottom: 1px solid rgba(13,78,136,0.25);
  transition: border-color 150ms ease;
}
.tp77-inner a:hover { border-bottom-color: var(--brand-main-color, #0D4E88); }
.tp77-inner strong { color: var(--text-primary, #122033); }
.tp77-inner mark {
  background: rgba(250,105,35,0.10);
  color: inherit; padding: 2px 6px; border-radius: 3px;
}

/* Section dividers */
.tp77-section {
  margin-top: 48px; padding-top: 40px;
  border-top: 1px solid var(--border-subtle, #DCE4EC);
}
.tp77-section h2 {
  font-weight: 800; color: var(--text-primary, #122033);
  letter-spacing: -0.025em; line-height: var(--lh-normal);
  margin: 0 0 24px;
}

/* Aside / callout */
.tp77-aside {
  padding: 20px 24px;
  background: rgba(13,78,136,0.04);
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-md, 12px);
  margin: 24px 0 36px;
}
.tp77-aside p {
  font-size: var(--type-sm); color: var(--text-muted, #6A7C93);
  line-height: var(--lh-relaxed); margin: 0 0 12px;
}
.tp77-aside p:last-child { margin-bottom: 0; }
.tp77-aside strong { color: var(--text-secondary, #42566E); }
.tp77-aside mark {
  background: rgba(250,105,35,0.10);
  color: inherit; padding: 2px 6px; border-radius: 3px;
}

/* Lists */
.tp77-list {
  list-style: none; padding: 0; margin: 0 0 28px;
}
.tp77-list li {
  position: relative; padding: 8px 0 8px 18px;
  font-size: var(--type-base);
  color: var(--text-secondary, #42566E); line-height: var(--lh-relaxed);
}
.tp77-list li::before {
  content: ""; position: absolute; left: 0; top: 18px;
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--brand-main-color, #0D4E88); opacity: 0.35;
}
.tp77-list li strong { color: var(--text-primary, #122033); }
.tp77-list li a {
  color: var(--brand-main-color, #0D4E88); font-weight: 600;
  text-decoration: none; border-bottom: 1px solid rgba(13,78,136,0.25);
  transition: border-color 150ms ease;
}
.tp77-list li a:hover { border-bottom-color: var(--brand-main-color, #0D4E88); }

/* Formula / monospace callout for passphrase examples */
.tp77-formula {
  padding: 20px 28px;
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-subtle, #DCE4EC);
  border-radius: var(--radius-md, 12px);
  text-align: center;
  font-family: 'Courier New', Courier, monospace;
  font-size: var(--type-base); font-weight: 700;
  color: var(--text-primary, #122033);
  margin: 20px 0 28px;
  box-shadow: 0 4px 12px rgba(10,36,67,0.04);
  overflow-wrap: break-word;
  word-break: break-all;
}
.tp77-formula .tp77-phrase-label {
  display: block; font-family: var(--font-base, 'Inter', sans-serif);
  font-size: var(--type-sm); font-weight: 400;
  color: var(--text-muted, #6A7C93);
  margin-bottom: 8px; text-transform: none; letter-spacing: 0;
}

/* Sources */
.tp77-sources h2 { margin-bottom: 20px; }
.tp77-sources .tp77-list li {
  padding: 10px 0 10px 18px;
  border-bottom: 1px solid rgba(196,208,220,0.2);
  font-size: var(--type-sm);
}
.tp77-sources .tp77-list li:last-child { border-bottom: none; }

/* CTA */
.tp77-cta {
  margin-top: 56px; padding: 40px 36px;
  background: linear-gradient(180deg, rgba(237,243,249,0.8), rgba(245,248,252,0.6));
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-2xl, 28px);
  text-align: center;
}
.tp77-cta h3 {
  color: var(--text-primary, #122033);
  letter-spacing: -0.025em; margin: 0 0 12px;
}
.tp77-cta p {
  font-size: var(--type-base); max-width: 440px; margin: 0 auto 24px;
}
.tp77-cta .button {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 0 28px;
  border-radius: var(--radius-full, 999px);
  border: 1px solid var(--border, #C4D0DC);
  background: var(--bg-surface, #fff);
  color: var(--text-primary, #122033);
  font-weight: 700; font-size: var(--type-base);
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(9,34,63,0.08);
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}
.tp77-cta .button:hover {
  color: var(--brand-main-color, #0D4E88);
  background: var(--bg-subtle, #EDF3F9);
  border-color: var(--brand-main-lighter, #3B7BB9);
  transform: translateY(-1px); text-decoration: none;
}
@media (max-width: 575.98px) {
  .tp77-cta { padding: 28px 20px; margin-top: 40px; }
  .tp77-inner { padding: 0 4px; }
  .tp77-section { margin-top: 36px; padding-top: 32px; }
  .tp77-article { padding-bottom: var(--space-system-72, 72px); }
}

/* === from: blowfish-und-rijndael.json === */
/* ── Rijndael 77 – Editorial Know-how Page ── */

.rj77-hero {
  padding-bottom: 24px;
  text-align: center;
  background: linear-gradient(180deg, rgba(237,243,249,0.6) 0%, rgba(245,248,252,0) 100%);
}
.rj77-hero .eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 14px;
  border: 1px solid rgba(13,78,136,0.12);
  background: rgba(13,78,136,0.06);
  color: var(--brand-main-darker, #083A66);
  border-radius: var(--radius-full, 999px);
  font-size: var(--type-xs); font-weight: 700;
  letter-spacing: 0.04em; text-transform: uppercase;
  margin-bottom: 28px;
}
.rj77-hero h1 {
  color: var(--text-primary, #122033);
  margin: 0 0 20px;
}
.rj77-hero .hero-sub {
  font-size: var(--type-md); color: var(--text-secondary, #42566E);
  max-width: 520px; margin: 0 auto; line-height: var(--lh-relaxed);
}
@media (max-width: 575.98px) {
  .rj77-hero { padding-bottom: 16px; }
}

/* Article body */
.rj77-article {
  padding: var(--space-system-48, 48px) 0 var(--space-system-120, 120px);
}
.rj77-inner {
  max-width: 740px; margin: 0 auto;
}
.rj77-inner p {
  font-size: var(--type-base); color: var(--text-secondary, #42566E);
  line-height: var(--lh-relaxed); margin: 0 0 20px;
}
.rj77-inner p:last-child { margin-bottom: 0; }
.rj77-inner a {
  color: var(--brand-main-color, #0D4E88); font-weight: 600;
  text-decoration: none; border-bottom: 1px solid rgba(13,78,136,0.25);
  transition: border-color 150ms ease;
}
.rj77-inner a:hover { border-bottom-color: var(--brand-main-color, #0D4E88); }
.rj77-inner strong { color: var(--text-primary, #122033); }

/* Section dividers */
.rj77-section {
  margin-top: 48px; padding-top: 40px;
  border-top: 1px solid var(--border-subtle, #DCE4EC);
}
.rj77-section h2 {
  font-weight: 800; color: var(--text-primary, #122033);
  letter-spacing: -0.025em; line-height: var(--lh-normal);
  margin: 0 0 24px;
}
.rj77-section h3 {
  font-weight: 700; color: var(--text-primary, #122033);
  letter-spacing: -0.015em; line-height: var(--lh-normal);
  margin: 32px 0 16px;
}

/* Aside / callout */
.rj77-aside {
  padding: 20px 24px;
  background: rgba(13,78,136,0.04);
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-md, 12px);
  margin: 24px 0 36px;
}
.rj77-aside p {
  font-size: var(--type-sm); color: var(--text-muted, #6A7C93);
  line-height: var(--lh-relaxed); margin: 0;
}
.rj77-aside strong { color: var(--text-secondary, #42566E); }

/* Lists */
.rj77-list {
  list-style: none; padding: 0; margin: 0 0 28px;
}
.rj77-list li {
  position: relative; padding: 8px 0 8px 18px;
  font-size: var(--type-base);
  color: var(--text-secondary, #42566E); line-height: var(--lh-relaxed);
}
.rj77-list li::before {
  content: ""; width: 5px; height: 5px; border-radius: 50%;
  background: var(--brand-main-color, #0D4E88); opacity: 0.35;
  position: absolute; left: 0; top: 18px;
}
.rj77-list li strong { color: var(--text-primary, #122033); }

/* Nested list inside list item */
.rj77-list .rj77-sublist {
  list-style: none; padding: 0; margin: 8px 0 0;
}
.rj77-list .rj77-sublist li {
  padding: 4px 0 4px 16px; font-size: var(--type-sm);
}
.rj77-list .rj77-sublist li::before {
  width: 4px; height: 4px; opacity: 0.25; top: 14px;
}

/* Sources */
.rj77-sources h2 { margin-bottom: 20px; }
.rj77-sources .rj77-list li {
  padding: 10px 0 10px 18px;
  border-bottom: 1px solid rgba(196,208,220,0.2);
  font-size: var(--type-sm);
}
.rj77-sources .rj77-list li:last-child { border-bottom: none; }

/* CTA */
.rj77-cta {
  margin-top: 56px; padding: 40px 36px;
  background: linear-gradient(180deg, rgba(237,243,249,0.8), rgba(245,248,252,0.6));
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-2xl, 28px);
  text-align: center;
}
.rj77-cta h3 {
  color: var(--text-primary, #122033);
  letter-spacing: -0.025em; margin: 0 0 12px;
}
.rj77-cta p {
  font-size: var(--type-base); max-width: 440px; margin: 0 auto 24px;
}
.rj77-cta .button {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 0 28px;
  border-radius: var(--radius-full, 999px);
  border: 1px solid var(--border, #C4D0DC);
  background: var(--bg-surface, #fff);
  color: var(--text-primary, #122033);
  font-weight: 700; font-size: var(--type-base);
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(9,34,63,0.08);
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}
.rj77-cta .button:hover {
  color: var(--brand-main-color, #0D4E88);
  background: var(--bg-subtle, #EDF3F9);
  border-color: var(--brand-main-lighter, #3B7BB9);
  transform: translateY(-1px); text-decoration: none;
}
@media (max-width: 575.98px) {
  .rj77-cta { padding: 28px 20px; margin-top: 40px; }
  .rj77-inner { padding: 0 4px; }
  .rj77-section { margin-top: 36px; padding-top: 32px; }
  .rj77-article { padding-bottom: var(--space-system-72, 72px); }
}

/* === from: brute-force-angriffe.json === */
/* ── Brute-Force 77 – Editorial Know-how Page ── */

.bf77-hero {
  padding-bottom: 24px;
  text-align: center;
  background: linear-gradient(180deg, rgba(237,243,249,0.6) 0%, rgba(245,248,252,0) 100%);
}
.bf77-hero .eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 14px;
  border: 1px solid rgba(13,78,136,0.12);
  background: rgba(13,78,136,0.06);
  color: var(--brand-main-darker, #083A66);
  border-radius: var(--radius-full, 999px);
  font-size: var(--type-xs); font-weight: 700;
  letter-spacing: 0.04em; text-transform: uppercase;
  margin-bottom: 28px;
}
.bf77-hero h1 {
  color: var(--text-primary, #122033);
  margin: 0 0 20px;
}
.bf77-hero .hero-sub {
  font-size: var(--type-md); color: var(--text-secondary, #42566E);
  max-width: 520px; margin: 0 auto; line-height: var(--lh-relaxed);
}
@media (max-width: 575.98px) {
  .bf77-hero { padding-bottom: 16px; }
}

/* Article body */
.bf77-article {
  padding: var(--space-system-48, 48px) 0 var(--space-system-120, 120px);
}
.bf77-inner {
  max-width: 740px; margin: 0 auto;
}
.bf77-inner p {
  font-size: var(--type-base); color: var(--text-secondary, #42566E);
  line-height: var(--lh-relaxed); margin: 0 0 20px;
}
.bf77-inner p:last-child { margin-bottom: 0; }
.bf77-inner a {
  color: var(--brand-main-color, #0D4E88); font-weight: 600;
  text-decoration: none; border-bottom: 1px solid rgba(13,78,136,0.25);
  transition: border-color 150ms ease;
}
.bf77-inner a:hover { border-bottom-color: var(--brand-main-color, #0D4E88); }
.bf77-inner strong { color: var(--text-primary, #122033); }

/* Section dividers */
.bf77-section {
  margin-top: 48px; padding-top: 40px;
  border-top: 1px solid var(--border-subtle, #DCE4EC);
}
.bf77-section h2 {
  font-weight: 800; color: var(--text-primary, #122033);
  letter-spacing: -0.025em; line-height: var(--lh-normal);
  margin: 0 0 24px;
}

/* Aside / callout */
.bf77-aside {
  padding: 20px 24px;
  background: rgba(13,78,136,0.04);
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-md, 12px);
  margin: 24px 0 36px;
}
.bf77-aside p {
  font-size: var(--type-sm); color: var(--text-muted, #6A7C93);
  line-height: var(--lh-relaxed); margin: 0;
}
.bf77-aside strong { color: var(--text-secondary, #42566E); }

/* Lists */
.bf77-list {
  list-style: none; padding: 0; margin: 0 0 28px;
}
.bf77-list li {
  position: relative; padding: 8px 0 8px 18px;
  font-size: var(--type-base);
  color: var(--text-secondary, #42566E); line-height: var(--lh-relaxed);
}
.bf77-list li::before {
  content: ""; width: 5px; height: 5px; border-radius: 50%;
  background: var(--brand-main-color, #0D4E88); opacity: 0.35;
  position: absolute; left: 0; top: 18px;
}
.bf77-list li strong { color: var(--text-primary, #122033); }

/* Formula callout */
.bf77-formula {
  padding: 20px 28px;
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-subtle, #DCE4EC);
  border-radius: var(--radius-md, 12px);
  text-align: center;
  font-family: 'Courier New', Courier, monospace;
  font-size: var(--type-base); font-weight: 700;
  color: var(--text-primary, #122033);
  margin: 20px 0 28px;
  box-shadow: 0 4px 12px rgba(10,36,67,0.04);
}

/* Table */
.bf77-table-wrap {
  margin: 28px 0 32px;
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-subtle, #DCE4EC);
  border-radius: var(--radius-xl, 22px);
  box-shadow: var(--shadow-soft, 0 16px 40px rgba(10,36,67,0.08));
  overflow: hidden;
}
.bf77-table-wrap .table-responsive { margin: 0; }
.bf77-table {
  width: 100%; border-collapse: collapse; margin: 0;
}
.bf77-table thead th {
  background: linear-gradient(135deg, var(--brand-main-color, #0D4E88), var(--brand-main-darker, #083A66));
  color: #fff; font-weight: 700; font-size: var(--type-sm);
  letter-spacing: 0.02em; text-transform: uppercase;
  padding: 16px 20px; text-align: left;
  border: none;
}
.bf77-table thead th:first-child { border-radius: 0; }
.bf77-table thead th:last-child { border-radius: 0; }
.bf77-table tbody td {
  padding: 18px 20px; vertical-align: top;
  border-bottom: 1px solid rgba(196,208,220,0.3);
  font-size: var(--type-sm); line-height: var(--lh-normal);
  color: var(--text-secondary, #42566E);
}
.bf77-table tbody tr:last-child td { border-bottom: none; }
.bf77-table tbody tr:hover { background: rgba(13,78,136,0.02); }
.bf77-table tbody td strong {
  color: var(--text-primary, #122033); font-weight: 700;
}
.bf77-table tbody td .bf77-result {
  display: inline-block; padding: 3px 10px;
  background: rgba(13,78,136,0.06);
  border-radius: var(--radius, 4px);
  font-weight: 700; color: var(--brand-main-color, #0D4E88);
  font-size: var(--type-sm); white-space: nowrap;
}
.bf77-table .bf77-formula-cell {
  font-size: var(--type-sm); color: var(--text-muted, #6A7C93);
  line-height: var(--lh-normal); word-break: break-word;
}
.bf77-table .bf77-combo-num {
  display: block; font-weight: 700; font-size: var(--type-sm);
  color: var(--text-primary, #122033); margin-top: 4px;
}
.binom { display:inline-block; vertical-align:middle; text-align:center; line-height: var(--lh-dense); }
.binom .top { display:block; }
.binom .bot { display:block; border-top:1px solid currentColor; margin-top:2px; }

@media (max-width: 767.98px) {
  .bf77-table thead th { padding: 12px 14px; font-size: var(--type-xs); }
  .bf77-table tbody td { padding: 14px 14px; font-size: var(--type-sm); }
  .bf77-table .bf77-formula-cell { font-size: var(--type-xs); }
}
@media (max-width: 575.98px) {
  .bf77-table-wrap { border-radius: var(--radius-lg, 16px); }
  .bf77-inner { padding: 0 4px; }
  .bf77-section { margin-top: 36px; padding-top: 32px; }
  .bf77-article { padding-bottom: var(--space-system-72, 72px); }
}

/* Takeaway */
.bf77-takeaway {
  padding: 24px 28px;
  background: linear-gradient(180deg, rgba(237,243,249,0.7), rgba(245,248,252,0.5));
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-xl, 22px);
  margin: 32px 0 0;
}
.bf77-takeaway p {
  font-size: var(--type-base); line-height: var(--lh-relaxed); margin: 0;
  color: var(--text-secondary, #42566E);
}

/* Practice box */
.bf77-practice {
  padding: 24px 28px;
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-subtle, #DCE4EC);
  border-radius: var(--radius-xl, 22px);
  box-shadow: 0 8px 24px rgba(10,36,67,0.05);
  margin: 28px 0 0;
}
.bf77-practice-title {
  font-size: var(--type-base); font-weight: 800;
  color: var(--text-primary, #122033);
  margin: 0 0 12px; letter-spacing: -0.01em;
}
.bf77-practice p { font-size: var(--type-sm); margin: 0; }
.bf77-practice .bf77-list { margin-bottom: 0; }
.bf77-practice .bf77-list li { font-size: var(--type-sm); padding: 6px 0 6px 18px; }

/* Sources */
.bf77-sources h2 { margin-bottom: 20px; }
.bf77-sources .bf77-list li {
  padding: 10px 0 10px 18px;
  border-bottom: 1px solid rgba(196,208,220,0.2);
  font-size: var(--type-sm);
}
.bf77-sources .bf77-list li:last-child { border-bottom: none; }

/* CTA */
.bf77-cta {
  margin-top: 56px; padding: 40px 36px;
  background: linear-gradient(180deg, rgba(237,243,249,0.8), rgba(245,248,252,0.6));
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-2xl, 28px);
  text-align: center;
}
.bf77-cta h3 {
  color: var(--text-primary, #122033);
  letter-spacing: -0.025em; margin: 0 0 12px;
}
.bf77-cta p {
  font-size: var(--type-base); max-width: 440px; margin: 0 auto 24px;
}
.bf77-cta .button {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 0 28px;
  border-radius: var(--radius-full, 999px);
  border: 1px solid var(--border, #C4D0DC);
  background: var(--bg-surface, #fff);
  color: var(--text-primary, #122033);
  font-weight: 700; font-size: var(--type-base);
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(9,34,63,0.08);
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}
.bf77-cta .button:hover {
  color: var(--brand-main-color, #0D4E88);
  background: var(--bg-subtle, #EDF3F9);
  border-color: var(--brand-main-lighter, #3B7BB9);
  transform: translateY(-1px); text-decoration: none;
}
@media (max-width: 575.98px) {
  .bf77-cta { padding: 28px 20px; margin-top: 40px; }
}

/* === from: identische-kennwoerter.json === */
/* ── Identische Kennwörter 77 – Editorial Know-how Page ── */

.ik77-hero {
  padding-bottom: 24px;
  text-align: center;
  background: linear-gradient(180deg, rgba(237,243,249,0.6) 0%, rgba(245,248,252,0) 100%);
}
.ik77-hero .eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 14px;
  border: 1px solid rgba(13,78,136,0.12);
  background: rgba(13,78,136,0.06);
  color: var(--brand-main-darker, #083A66);
  border-radius: var(--radius-full, 999px);
  font-size: var(--type-xs); font-weight: 700;
  letter-spacing: 0.04em; text-transform: uppercase;
  margin-bottom: 28px;
}
.ik77-hero h1 {
  color: var(--text-primary, #122033);
  margin: 0 0 20px;
}
.ik77-hero .hero-sub {
  font-size: var(--type-md); color: var(--text-secondary, #42566E);
  max-width: 520px; margin: 0 auto; line-height: var(--lh-relaxed);
}
@media (max-width: 575.98px) {
  .ik77-hero { padding-bottom: 16px; }
}

/* Article body */
.ik77-article {
  padding: var(--space-system-48, 48px) 0 var(--space-system-120, 120px);
}
.ik77-inner {
  max-width: 740px; margin: 0 auto;
}
.ik77-inner p {
  font-size: var(--type-base); color: var(--text-secondary, #42566E);
  line-height: var(--lh-relaxed); margin: 0 0 20px;
}
.ik77-inner p:last-child { margin-bottom: 0; }
.ik77-inner a {
  color: var(--brand-main-color, #0D4E88); font-weight: 600;
  text-decoration: none; border-bottom: 1px solid rgba(13,78,136,0.25);
  transition: border-color 150ms ease;
}
.ik77-inner a:hover { border-bottom-color: var(--brand-main-color, #0D4E88); }
.ik77-inner strong { color: var(--text-primary, #122033); }
.ik77-inner mark {
  background: rgba(250,105,35,0.10);
  color: inherit; padding: 2px 4px; border-radius: 3px;
}

/* Section dividers */
.ik77-section {
  margin-top: 48px; padding-top: 40px;
  border-top: 1px solid var(--border-subtle, #DCE4EC);
}
.ik77-section h2 {
  font-weight: 800; color: var(--text-primary, #122033);
  letter-spacing: -0.025em; line-height: var(--lh-normal);
  margin: 0 0 24px;
}

/* Aside / callout */
.ik77-aside {
  padding: 20px 24px;
  background: rgba(13,78,136,0.04);
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-md, 12px);
  margin: 24px 0 36px;
}
.ik77-aside p {
  font-size: var(--type-sm); color: var(--text-muted, #6A7C93);
  line-height: var(--lh-relaxed); margin: 0;
}
.ik77-aside strong { color: var(--text-secondary, #42566E); }

/* Lists */
.ik77-list {
  list-style: none; padding: 0; margin: 0 0 28px;
}
.ik77-list li {
  position: relative; padding: 8px 0 8px 18px;
  font-size: var(--type-base);
  color: var(--text-secondary, #42566E); line-height: var(--lh-relaxed);
}
.ik77-list li::before {
  content: ""; width: 5px; height: 5px; border-radius: 50%;
  background: var(--brand-main-color, #0D4E88); opacity: 0.35;
  position: absolute; left: 0; top: 18px;
}
.ik77-list li strong { color: var(--text-primary, #122033); }

/* Colored-border cards */
.ik77-card {
  padding: 24px 28px;
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-subtle, #DCE4EC);
  border-radius: var(--radius-md, 12px);
  box-shadow: 0 4px 12px rgba(10,36,67,0.04);
  margin: 24px 0 36px;
}
.ik77-card--green { border-left: 4px solid #10b981; }
.ik77-card--blue { border-left: 4px solid #3b82f6; }
.ik77-card--amber { border-left: 4px solid #f59e0b; }
.ik77-card h3 {
  font-size: var(--type-md); font-weight: 800;
  color: var(--text-primary, #122033);
  margin: 0 0 16px; letter-spacing: -0.01em;
}
.ik77-card .ik77-list { margin-bottom: 0; }

/* Practice box (dashed border) */
.ik77-practice {
  padding: 24px 28px;
  background: #f8fbff;
  border: 1px dashed #2563eb;
  border-radius: var(--radius-md, 12px);
  margin: 24px 0 36px;
}
.ik77-practice-title {
  font-size: var(--type-base); font-weight: 800;
  color: var(--text-primary, #122033);
  margin: 0 0 12px; letter-spacing: -0.01em;
}
.ik77-practice .ik77-list { margin-bottom: 0; }
.ik77-practice .ik77-list li { font-size: var(--type-sm); padding: 6px 0 6px 18px; }

/* Blockquote */
.ik77-blockquote {
  padding: 24px 28px;
  background: linear-gradient(180deg, rgba(237,243,249,0.7), rgba(245,248,252,0.5));
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-xl, 22px);
  margin: 32px 0 36px;
}
.ik77-blockquote p {
  font-size: var(--type-base); line-height: var(--lh-relaxed); margin: 0;
  color: var(--text-secondary, #42566E);
}

/* Sources */
.ik77-sources h2 { margin-bottom: 20px; }
.ik77-sources .ik77-list li {
  padding: 10px 0 10px 18px;
  border-bottom: 1px solid rgba(196,208,220,0.2);
  font-size: var(--type-sm);
}
.ik77-sources .ik77-list li:last-child { border-bottom: none; }

/* CTA */
.ik77-cta {
  margin-top: 56px; padding: 40px 36px;
  background: linear-gradient(180deg, rgba(237,243,249,0.8), rgba(245,248,252,0.6));
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-2xl, 28px);
  text-align: center;
}
.ik77-cta h3 {
  color: var(--text-primary, #122033);
  letter-spacing: -0.025em; margin: 0 0 12px;
}
.ik77-cta p {
  font-size: var(--type-base); max-width: 440px; margin: 0 auto 24px;
}
.ik77-cta .button {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 0 28px;
  border-radius: var(--radius-full, 999px);
  border: 1px solid var(--border, #C4D0DC);
  background: var(--bg-surface, #fff);
  color: var(--text-primary, #122033);
  font-weight: 700; font-size: var(--type-base);
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(9,34,63,0.08);
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}
.ik77-cta .button:hover {
  color: var(--brand-main-color, #0D4E88);
  background: var(--bg-subtle, #EDF3F9);
  border-color: var(--brand-main-lighter, #3B7BB9);
  transform: translateY(-1px); text-decoration: none;
}
@media (max-width: 575.98px) {
  .ik77-cta { padding: 28px 20px; margin-top: 40px; }
  .ik77-inner { padding: 0 4px; }
  .ik77-section { margin-top: 36px; padding-top: 32px; }
  .ik77-article { padding-bottom: var(--space-system-72, 72px); }
}

/* === from: iso27001-zertifizierung-passwort-manager.json === */
/* ── ISO 27001 77 – Editorial Know-how Page ── */

.iso77-hero {
  padding-bottom: 24px;
  text-align: center;
  background: linear-gradient(180deg, rgba(237,243,249,0.6) 0%, rgba(245,248,252,0) 100%);
}
.iso77-hero .eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 14px;
  border: 1px solid rgba(13,78,136,0.12);
  background: rgba(13,78,136,0.06);
  color: var(--brand-main-darker, #083A66);
  border-radius: var(--radius-full, 999px);
  font-size: var(--type-xs); font-weight: 700;
  letter-spacing: 0.04em; text-transform: uppercase;
  margin-bottom: 28px;
}
.iso77-hero h1 {
  color: var(--text-primary, #122033);
  margin: 0 0 20px;
}
.iso77-hero .hero-sub {
  font-size: var(--type-md); color: var(--text-secondary, #42566E);
  max-width: 560px; margin: 0 auto; line-height: var(--lh-relaxed);
}
@media (max-width: 575.98px) {
  .iso77-hero { padding-bottom: 16px; }
}

/* Article body */
.iso77-article {
  padding: var(--space-system-48, 48px) 0 var(--space-system-120, 120px);
}
.iso77-inner {
  max-width: 740px; margin: 0 auto;
}
.iso77-inner p {
  font-size: var(--type-base); color: var(--text-secondary, #42566E);
  line-height: var(--lh-relaxed); margin: 0 0 20px;
}
.iso77-inner p:last-child { margin-bottom: 0; }
.iso77-inner a {
  color: var(--brand-main-color, #0D4E88); font-weight: 600;
  text-decoration: none; border-bottom: 1px solid rgba(13,78,136,0.25);
  transition: border-color 150ms ease;
}
.iso77-inner a:hover { border-bottom-color: var(--brand-main-color, #0D4E88); }
.iso77-inner strong { color: var(--text-primary, #122033); }

/* Section dividers */
.iso77-section {
  margin-top: 48px; padding-top: 40px;
  border-top: 1px solid var(--border-subtle, #DCE4EC);
}
.iso77-section h2 {
  font-weight: 800; color: var(--text-primary, #122033);
  letter-spacing: -0.025em; line-height: var(--lh-normal);
  margin: 0 0 24px;
}

/* Aside / callout (Auf einen Blick) */
.iso77-aside {
  padding: 20px 24px;
  background: rgba(13,78,136,0.04);
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-md, 12px);
  margin: 24px 0 36px;
}
.iso77-aside p,
.iso77-aside strong.iso77-aside-title {
  font-size: var(--type-base); color: var(--text-primary, #122033);
  line-height: var(--lh-relaxed); margin: 0 0 12px; font-weight: 800;
}
.iso77-aside .iso77-list li {
  font-size: var(--type-sm); color: var(--text-secondary, #42566E);
}
.iso77-aside .iso77-list li mark {
  background: rgba(13,78,136,0.07); color: inherit;
  padding: 2px 6px; border-radius: 3px;
}

/* Lists */
.iso77-list {
  list-style: none; padding: 0; margin: 0 0 28px;
}
.iso77-list li {
  position: relative; padding: 8px 0 8px 18px;
  font-size: var(--type-base);
  color: var(--text-secondary, #42566E); line-height: var(--lh-relaxed);
}
.iso77-list li::before {
  content: ""; width: 5px; height: 5px; border-radius: 50%;
  background: var(--brand-main-color, #0D4E88); opacity: 0.35;
  position: absolute; left: 0; top: 18px;
}
.iso77-list li strong { color: var(--text-primary, #122033); }

/* Ordered list */
.iso77-ol {
  list-style: none; padding: 0; margin: 0 0 28px;
  counter-reset: iso77-counter;
}
.iso77-ol li {
  display: flex; align-items: baseline; gap: 14px;
  padding: 10px 0 10px 18px; font-size: var(--type-base);
  color: var(--text-secondary, #42566E); line-height: var(--lh-relaxed);
  counter-increment: iso77-counter;
}
.iso77-ol li::before {
  content: counter(iso77-counter) ".";
  font-weight: 800; font-size: var(--type-sm);
  color: var(--brand-main-color, #0D4E88);
  flex-shrink: 0; min-width: 20px;
}
.iso77-ol li strong { color: var(--text-primary, #122033); }

/* Control cards (colored left border) */
.iso77-control-card {
  padding: 20px 24px;
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-subtle, #DCE4EC);
  border-radius: var(--radius-md, 12px);
  border-left: 4px solid var(--card-accent, #0D4E88);
  margin: 0 0 20px;
  box-shadow: 0 4px 12px rgba(10,36,67,0.04);
}
.iso77-control-card h3 {
  font-size: var(--type-md); font-weight: 800;
  color: var(--text-primary, #122033);
  margin: 0 0 10px; letter-spacing: -0.01em;
}
.iso77-control-card p {
  font-size: var(--type-sm); margin: 0 0 8px;
  line-height: var(--lh-relaxed);
}
.iso77-control-card p:last-child { margin-bottom: 0; }

/* Table */
.iso77-table-wrap {
  margin: 28px 0 32px;
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-subtle, #DCE4EC);
  border-radius: var(--radius-xl, 22px);
  box-shadow: var(--shadow-soft, 0 16px 40px rgba(10,36,67,0.08));
  overflow: hidden;
}
.iso77-table-wrap .table-responsive { margin: 0; }
.iso77-table {
  width: 100%; border-collapse: collapse; margin: 0;
}
.iso77-table thead th {
  background: linear-gradient(135deg, var(--brand-main-color, #0D4E88), var(--brand-main-darker, #083A66));
  color: #fff; font-weight: 700; font-size: var(--type-sm);
  letter-spacing: 0.02em; text-transform: uppercase;
  padding: 16px 20px; text-align: left;
  border: none;
}
.iso77-table thead th:first-child { border-radius: 0; }
.iso77-table thead th:last-child { border-radius: 0; }
.iso77-table tbody td {
  padding: 18px 20px; vertical-align: top;
  border-bottom: 1px solid rgba(196,208,220,0.3);
  font-size: var(--type-sm); line-height: var(--lh-normal);
  color: var(--text-secondary, #42566E);
}
.iso77-table tbody tr:last-child td { border-bottom: none; }
.iso77-table tbody tr:hover { background: rgba(13,78,136,0.02); }
.iso77-table tbody td strong {
  color: var(--text-primary, #122033); font-weight: 700;
}
@media (max-width: 767.98px) {
  .iso77-table thead th { padding: 12px 14px; font-size: var(--type-xs); }
  .iso77-table tbody td { padding: 14px 14px; font-size: var(--type-sm); }
}
@media (max-width: 575.98px) {
  .iso77-table-wrap { border-radius: var(--radius-lg, 16px); }
  .iso77-inner { padding: 0 4px; }
  .iso77-section { margin-top: 36px; padding-top: 32px; }
  .iso77-article { padding-bottom: var(--space-system-72, 72px); }
}

/* Practice box (Audit checklist) */
.iso77-practice {
  padding: 24px 28px;
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-subtle, #DCE4EC);
  border-radius: var(--radius-xl, 22px);
  box-shadow: 0 8px 24px rgba(10,36,67,0.05);
  margin: 28px 0 0;
}
.iso77-practice-title {
  font-size: var(--type-base); font-weight: 800;
  color: var(--text-primary, #122033);
  margin: 0 0 12px; letter-spacing: -0.01em;
}
.iso77-practice p { font-size: var(--type-sm); margin: 0; }
.iso77-practice .iso77-list { margin-bottom: 0; }
.iso77-practice .iso77-list li { font-size: var(--type-sm); padding: 6px 0 6px 18px; }

/* Takeaway */
.iso77-takeaway {
  padding: 24px 28px;
  background: linear-gradient(180deg, rgba(237,243,249,0.7), rgba(245,248,252,0.5));
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-xl, 22px);
  margin: 32px 0 0;
}
.iso77-takeaway p {
  font-size: var(--type-base); line-height: var(--lh-relaxed); margin: 0;
  color: var(--text-secondary, #42566E);
}

/* Sources */
.iso77-sources h2 { margin-bottom: 20px; }
.iso77-sources .iso77-list li {
  padding: 10px 0 10px 18px;
  border-bottom: 1px solid rgba(196,208,220,0.2);
  font-size: var(--type-sm);
}
.iso77-sources .iso77-list li:last-child { border-bottom: none; }

/* CTA */
.iso77-cta {
  margin-top: 56px; padding: 40px 36px;
  background: linear-gradient(180deg, rgba(237,243,249,0.8), rgba(245,248,252,0.6));
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-2xl, 28px);
  text-align: center;
}
.iso77-cta h3 {
  color: var(--text-primary, #122033);
  letter-spacing: -0.025em; margin: 0 0 12px;
}
.iso77-cta p {
  font-size: var(--type-base); max-width: 440px; margin: 0 auto 24px;
}
.iso77-cta .button {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 0 28px;
  border-radius: var(--radius-full, 999px);
  border: 1px solid var(--border, #C4D0DC);
  background: var(--bg-surface, #fff);
  color: var(--text-primary, #122033);
  font-weight: 700; font-size: var(--type-base);
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(9,34,63,0.08);
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}
.iso77-cta .button:hover {
  color: var(--brand-main-color, #0D4E88);
  background: var(--bg-subtle, #EDF3F9);
  border-color: var(--brand-main-lighter, #3B7BB9);
  transform: translateY(-1px); text-decoration: none;
}
@media (max-width: 575.98px) {
  .iso77-cta { padding: 28px 20px; margin-top: 40px; }
}

/* === from: passwoerter-in-unternehmen.json === */
/* ── Passwortverwaltung Unternehmen 77 – Editorial Know-how Page ── */

.pu77-hero {
  padding-bottom: 24px;
  text-align: center;
  background: linear-gradient(180deg, rgba(237,243,249,0.6) 0%, rgba(245,248,252,0) 100%);
}
.pu77-hero .eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 14px;
  border: 1px solid rgba(13,78,136,0.12);
  background: rgba(13,78,136,0.06);
  color: var(--brand-main-darker, #083A66);
  border-radius: var(--radius-full, 999px);
  font-size: var(--type-xs); font-weight: 700;
  letter-spacing: 0.04em; text-transform: uppercase;
  margin-bottom: 28px;
}
.pu77-hero h1 {
  color: var(--text-primary, #122033);
  margin: 0 0 20px;
}
.pu77-hero .hero-sub {
  font-size: var(--type-md); color: var(--text-secondary, #42566E);
  max-width: 520px; margin: 0 auto; line-height: var(--lh-relaxed);
}
@media (max-width: 575.98px) {
  .pu77-hero { padding-bottom: 16px; }
}

/* Article body */
.pu77-article {
  padding: var(--space-system-48, 48px) 0 var(--space-system-120, 120px);
}
.pu77-inner {
  max-width: 740px; margin: 0 auto;
}
.pu77-inner p {
  font-size: var(--type-base); color: var(--text-secondary, #42566E);
  line-height: var(--lh-relaxed); margin: 0 0 20px;
}
.pu77-inner p:last-child { margin-bottom: 0; }
.pu77-inner a {
  color: var(--brand-main-color, #0D4E88); font-weight: 600;
  text-decoration: none; border-bottom: 1px solid rgba(13,78,136,0.25);
  transition: border-color 150ms ease;
}
.pu77-inner a:hover { border-bottom-color: var(--brand-main-color, #0D4E88); }
.pu77-inner strong { color: var(--text-primary, #122033); }
.pu77-inner mark {
  background: rgba(250,105,35,0.12); color: inherit;
  padding: 2px 6px; border-radius: 3px;
}

/* Section dividers */
.pu77-section {
  margin-top: 48px; padding-top: 40px;
  border-top: 1px solid var(--border-subtle, #DCE4EC);
}
.pu77-section h2 {
  font-weight: 800; color: var(--text-primary, #122033);
  letter-spacing: -0.025em; line-height: var(--lh-normal);
  margin: 0 0 24px;
}

/* Aside / callout */
.pu77-aside {
  padding: 20px 24px;
  background: rgba(13,78,136,0.04);
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-md, 12px);
  margin: 24px 0 36px;
}
.pu77-aside p {
  font-size: var(--type-sm); color: var(--text-muted, #6A7C93);
  line-height: var(--lh-relaxed); margin: 0;
}
.pu77-aside p + p { margin-top: 12px; }
.pu77-aside strong { color: var(--text-secondary, #42566E); }

/* Lists */
.pu77-list {
  list-style: none; padding: 0; margin: 0 0 28px;
}
.pu77-list li {
  position: relative; padding: 8px 0 8px 18px;
  font-size: var(--type-base);
  color: var(--text-secondary, #42566E); line-height: var(--lh-relaxed);
}
.pu77-list li::before {
  content: ""; width: 5px; height: 5px; border-radius: 50%;
  background: var(--brand-main-color, #0D4E88); opacity: 0.35;
  position: absolute; left: 0; top: 18px;
}
.pu77-list li strong { color: var(--text-primary, #122033); }

/* Practice / sub-topic box */
.pu77-practice {
  padding: 24px 28px;
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-subtle, #DCE4EC);
  border-radius: var(--radius-xl, 22px);
  box-shadow: 0 8px 24px rgba(10,36,67,0.05);
  margin: 28px 0 0;
}
.pu77-practice-title {
  font-size: var(--type-base); font-weight: 800;
  color: var(--text-primary, #122033);
  margin: 0 0 12px; letter-spacing: -0.01em;
}
.pu77-practice p { font-size: var(--type-sm); margin: 0 0 12px; }
.pu77-practice p:last-child { margin-bottom: 0; }
.pu77-practice .pu77-list { margin-bottom: 0; }
.pu77-practice .pu77-list li { font-size: var(--type-sm); padding: 6px 0 6px 18px; }

/* CTA */
.pu77-cta {
  margin-top: 56px; padding: 40px 36px;
  background: linear-gradient(180deg, rgba(237,243,249,0.8), rgba(245,248,252,0.6));
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-2xl, 28px);
  text-align: center;
}
.pu77-cta h3 {
  color: var(--text-primary, #122033);
  letter-spacing: -0.025em; margin: 0 0 12px;
}
.pu77-cta p {
  font-size: var(--type-base); max-width: 440px; margin: 0 auto 24px;
}
.pu77-cta .button {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 0 28px;
  border-radius: var(--radius-full, 999px);
  border: 1px solid var(--border, #C4D0DC);
  background: var(--bg-surface, #fff);
  color: var(--text-primary, #122033);
  font-weight: 700; font-size: var(--type-base);
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(9,34,63,0.08);
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}
.pu77-cta .button:hover {
  color: var(--brand-main-color, #0D4E88);
  background: var(--bg-subtle, #EDF3F9);
  border-color: var(--brand-main-lighter, #3B7BB9);
  transform: translateY(-1px); text-decoration: none;
}
@media (max-width: 575.98px) {
  .pu77-cta { padding: 28px 20px; margin-top: 40px; }
  .pu77-inner { padding: 0 4px; }
  .pu77-section { margin-top: 36px; padding-top: 32px; }
  .pu77-article { padding-bottom: var(--space-system-72, 72px); }
}

/* === from: sicherheitsstandard.json === */
/* ── Sicherheitsstandard 77 – Editorial Know-how Page ── */

.ss77-hero {
  padding-bottom: 24px;
  text-align: center;
  background: linear-gradient(180deg, rgba(237,243,249,0.6) 0%, rgba(245,248,252,0) 100%);
}
.ss77-hero .eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 14px;
  border: 1px solid rgba(13,78,136,0.12);
  background: rgba(13,78,136,0.06);
  color: var(--brand-main-darker, #083A66);
  border-radius: var(--radius-full, 999px);
  font-size: var(--type-xs); font-weight: 700;
  letter-spacing: 0.04em; text-transform: uppercase;
  margin-bottom: 28px;
}
.ss77-hero h1 {
  color: var(--text-primary, #122033);
  margin: 0 0 20px;
}
.ss77-hero .hero-sub {
  font-size: var(--type-md); color: var(--text-secondary, #42566E);
  max-width: 520px; margin: 0 auto; line-height: var(--lh-relaxed);
}
@media (max-width: 575.98px) {
  .ss77-hero { padding-bottom: 16px; }
}

/* Article body */
.ss77-article {
  padding: var(--space-system-48, 48px) 0 var(--space-system-120, 120px);
}
.ss77-inner {
  max-width: 740px; margin: 0 auto;
}
.ss77-inner p {
  font-size: var(--type-base); color: var(--text-secondary, #42566E);
  line-height: var(--lh-relaxed); margin: 0 0 20px;
}
.ss77-inner p:last-child { margin-bottom: 0; }
.ss77-inner a {
  color: var(--brand-main-color, #0D4E88); font-weight: 600;
  text-decoration: none; border-bottom: 1px solid rgba(13,78,136,0.25);
  transition: border-color 150ms ease;
}
.ss77-inner a:hover { border-bottom-color: var(--brand-main-color, #0D4E88); }
.ss77-inner strong { color: var(--text-primary, #122033); }

/* Section dividers */
.ss77-section {
  margin-top: 48px; padding-top: 40px;
  border-top: 1px solid var(--border-subtle, #DCE4EC);
}
.ss77-section h2 {
  font-weight: 800; color: var(--text-primary, #122033);
  letter-spacing: -0.025em; line-height: var(--lh-normal);
  margin: 0 0 24px;
}

/* Aside / callout (Kurzfassung) */
.ss77-aside {
  padding: 20px 24px;
  background: rgba(13,78,136,0.04);
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-md, 12px);
  margin: 24px 0 36px;
}
.ss77-aside h2 {
  font-size: var(--type-2xl);
  font-weight: 800; color: var(--text-primary, #122033);
  letter-spacing: -0.02em; line-height: var(--lh-normal);
  margin: 0 0 16px;
}
.ss77-aside p {
  font-size: var(--type-sm); color: var(--text-muted, #6A7C93);
  line-height: var(--lh-relaxed); margin: 0;
}
.ss77-aside strong { color: var(--text-secondary, #42566E); }
.ss77-aside .ss77-list { margin-bottom: 0; }
.ss77-aside .ss77-list li { font-size: var(--type-sm); }

/* Lists */
.ss77-list {
  list-style: none; padding: 0; margin: 0 0 28px;
}
.ss77-list li {
  position: relative; padding: 8px 0 8px 18px;
  font-size: var(--type-base);
  color: var(--text-secondary, #42566E); line-height: var(--lh-relaxed);
}
.ss77-list li::before {
  content: ""; width: 5px; height: 5px; border-radius: 50%;
  background: var(--brand-main-color, #0D4E88); opacity: 0.35;
  position: absolute; left: 0; top: 18px;
}
.ss77-list li strong { color: var(--text-primary, #122033); }

/* Practice box (Hinweis / Checkliste) */
.ss77-practice {
  padding: 24px 28px;
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-subtle, #DCE4EC);
  border-radius: var(--radius-xl, 22px);
  box-shadow: 0 8px 24px rgba(10,36,67,0.05);
  margin: 28px 0 0;
}
.ss77-practice-title {
  font-size: var(--type-base); font-weight: 800;
  color: var(--text-primary, #122033);
  margin: 0 0 12px; letter-spacing: -0.01em;
}
.ss77-practice p { font-size: var(--type-sm); margin: 0; }
.ss77-practice .ss77-list { margin-bottom: 0; }
.ss77-practice .ss77-list li { font-size: var(--type-sm); padding: 6px 0 6px 18px; }

/* CTA */
.ss77-cta {
  margin-top: 56px; padding: 40px 36px;
  background: linear-gradient(180deg, rgba(237,243,249,0.8), rgba(245,248,252,0.6));
  border: 1px solid rgba(13,78,136,0.08);
  border-radius: var(--radius-2xl, 28px);
  text-align: center;
}
.ss77-cta h3 {
  color: var(--text-primary, #122033);
  letter-spacing: -0.025em; margin: 0 0 12px;
}
.ss77-cta p {
  font-size: var(--type-base); max-width: 440px; margin: 0 auto 24px;
}
.ss77-cta .button {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 0 28px;
  border-radius: var(--radius-full, 999px);
  border: 1px solid var(--border, #C4D0DC);
  background: var(--bg-surface, #fff);
  color: var(--text-primary, #122033);
  font-weight: 700; font-size: var(--type-base);
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(9,34,63,0.08);
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}
.ss77-cta .button:hover {
  color: var(--brand-main-color, #0D4E88);
  background: var(--bg-subtle, #EDF3F9);
  border-color: var(--brand-main-lighter, #3B7BB9);
  transform: translateY(-1px); text-decoration: none;
}
@media (max-width: 575.98px) {
  .ss77-cta { padding: 28px 20px; margin-top: 40px; }
  .ss77-inner { padding: 0 4px; }
  .ss77-section { margin-top: 36px; padding-top: 32px; }
  .ss77-article { padding-bottom: var(--space-system-72, 72px); }
}