/*
 * fallstudie-uniform.css — v1.1 (2026-10-25, edit mode: Original-Belege as rows, block at the
 * end, Vadim's pick of three previews; v1.0 in backups/). v1.0 (2026-10-25, edit mode, Vadim: case-study boxes
 * "mostly square" while the rest of the site uses rounded boxes; feedback
 * screenshots input/feedback/case-study-1/2 vs boxes-main-layout-1/2). v0.1 was the
 * German desktop preview on a StarMoney copy, approved by Vadim the same day.
 * Loaded on every layout-B case study, German and English (inc/enqueue.php v1.4),
 * after readability.css.
 *
 * Layout B keeps its content and order; its boxes take the Konzept B card system
 * of Home/SEO: cards --icc-r-md/lg/xl with --icc-shadow-card, tinted panels
 * --icc-r-panel (44 px; --icc-r-lg on phones, like .icc-cta), pill eyebrows, chips
 * and buttons, round number badges, icon wells for the checks, the navy panel with
 * the .icc-blob circle. No hairline rules between sections.
 *
 * Specificity: every rule is `.icc-fsb …` (0,2,0+), so it beats layout B's
 * single-class rules at every width, including its mobile blocks. That is why
 * the responsive part at the end restates the paddings layout B sets for phones.
 * The KPI cards use `.icc-fsb-kpis__grid > .icc-fsb-kpi:nth-child(n)` (0,4,0) to
 * beat layout B's ≤900 px border rules (up to 0,4,0).
 */

/* ---- Sections: whitespace instead of hairlines ---- */
.icc-fsb .icc-fsb-hero,
.icc-fsb .icc-fsb-kpis,
.icc-fsb .icc-fsb-section { border-bottom: 0; }

/* ---- Eyebrows → site pill (.icc-eyebrow) ---- */
.icc-fsb .icc-fsb-label,
.icc-fsb .icc-fsb-eyebrow {
  display: inline-flex;
  max-width: 100%;
  font-family: var(--icc-font-body);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: var(--icc-ls-eyebrow);
  line-height: 1.4;
  color: var(--icc-primary);
  background: var(--icc-tint);
  padding: 8px 16px;
  border-radius: var(--icc-r-pill);
}
.icc-fsb .icc-fsb-eyebrow--hero,
.icc-fsb .icc-fsb-section--tint .icc-fsb-label { background: #fff; }
.icc-fsb .icc-fsb-label--on-dark { color: #fff; background: rgba(255, 255, 255, .12); }
.icc-fsb .icc-fsb-eyebrow__rule { display: none; }

/* ---- Hero: profile card + chips ---- */
.icc-fsb .icc-fsb-profile {
  border: 0;
  border-radius: var(--icc-r-xl);
  box-shadow: var(--icc-shadow-lg);
}
.icc-fsb .icc-fsb-profile__top { border-bottom-color: var(--icc-border); }
.icc-fsb .icc-fsb-tags { gap: 8px; }
.icc-fsb .icc-fsb-tag {                           /* .icc-chip */
  background: #fff;
  border: 1px solid var(--icc-border-2);
  border-radius: var(--icc-r-pill);
  padding: 6px 14px;
}

/* ---- KPIs: stat cards floating on the hero edge (Home/SEO "Warum") ---- */
.icc-fsb .icc-fsb-kpis { background: linear-gradient(180deg, var(--fsb-tint) 0 50%, #fff 50% 100%); }
.icc-fsb .icc-fsb-kpis__grid { gap: 20px; }
.icc-fsb .icc-fsb-kpis__grid > .icc-fsb-kpi:nth-child(n) {
  position: relative;
  overflow: hidden;
  padding: 30px 30px 28px;
  background: #fff;
  border: 1px solid var(--icc-border);
  border-radius: var(--icc-r-md);
  box-shadow: var(--icc-shadow-card);
}
.icc-fsb .icc-fsb-kpis__grid > .icc-fsb-kpi:first-child {   /* .icc-stat--dark */
  background: var(--icc-primary);
  border-color: var(--icc-primary);
}
.icc-fsb .icc-fsb-kpi:first-child::after {        /* .icc-blob */
  content: "";
  position: absolute;
  top: -30px;
  right: -30px;
  width: 110px;
  height: 110px;
  border-radius: 50%;
  background: rgba(91, 174, 222, .25);
  pointer-events: none;
}
.icc-fsb .icc-fsb-kpi:first-child .icc-fsb-kpi__label { color: var(--icc-accent); }
.icc-fsb .icc-fsb-kpi:first-child .icc-fsb-kpi__value { color: #fff; }
.icc-fsb .icc-fsb-kpi:first-child .icc-fsb-kpi__text { color: rgba(255, 255, 255, .85); }

/* ---- 02 Ausgangslage: white card + tinted panel with cards ---- */
.icc-fsb .icc-fsb-challenge {
  border: 1px solid var(--icc-border);
  border-radius: var(--icc-r-xl);
  box-shadow: var(--icc-shadow-card);
  padding: 44px 48px;
}
.icc-fsb .icc-fsb-challenge__num {                /* round badge */
  width: 32px;
  height: 32px;
  margin-top: -1px;
  border-radius: 50%;
  background: var(--icc-tint);
  color: var(--icc-primary);
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.icc-fsb .icc-fsb-measures {
  background: var(--icc-tint);
  border: 0;
  border-radius: var(--icc-r-panel);
  padding: 56px;
}
.icc-fsb .icc-fsb-measures__list { gap: 20px; }
.icc-fsb .icc-fsb-measure {                       /* .icc-card--feature */
  border: 0;
  border-radius: var(--icc-r-lg);
  padding: 30px 28px;
  gap: 16px;
  box-shadow: var(--icc-shadow-card);
}
.icc-fsb .icc-fsb-measure__check {                /* icon well */
  width: 48px;
  height: 48px;
  border: 0;
  border-radius: 16px;
  background: var(--icc-tint-2);
}
.icc-fsb .icc-fsb-measure__check svg { width: 18px; height: 18px; }

/* ---- 03 Ergebnisse: rounded tinted panel inside the content width ---- */
.icc-fsb .icc-fsb-section--tint { background: #fff; padding: 0 0 32px; }
.icc-fsb .icc-fsb-section--tint > .icc-fsb__wrap {
  width: calc(100% - 2 * var(--fsb-gutter));
  max-width: 1240px;
  padding: 88px 56px;
  background: var(--icc-tint);
  border-radius: var(--icc-r-panel);
}
.icc-fsb .icc-fsb-card {
  border: 0;
  border-radius: var(--icc-r-xl);
  box-shadow: var(--icc-shadow-card);
  padding: 36px 38px 28px;
}
.icc-fsb .icc-fsb-beleg { border-color: var(--icc-border); border-radius: var(--icc-r-sm); }
.icc-fsb .icc-fsb-compare__bar,
.icc-fsb .icc-fsb-kw__bar,
.icc-fsb .icc-fsb-legend__swatch { border-radius: var(--icc-r-pill); }

/* Result points → cards with filled round numbers (.icc-step__num--filled) */
.icc-fsb .icc-fsb-points {
  gap: 20px;
  margin-top: 20px !important;                    /* layout B sets 44px / 32px !important */
  border-top: 0;
}
.icc-fsb .icc-fsb-point,
.icc-fsb .icc-fsb-point:last-child,
.icc-fsb .icc-fsb-point:nth-last-child(2):nth-child(odd) {
  background: #fff;
  border: 0;
  border-radius: var(--icc-r-xl);
  padding: 32px 34px;
  gap: 20px;
  box-shadow: var(--icc-shadow-card);
}
.icc-fsb .icc-fsb-point__num {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--icc-primary);
  color: #fff;
  font-size: 18px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ---- 04 Fazit: navy panel with the blob (SEO "Neu: GEO" banner, CTA band) ---- */
.icc-fsb .icc-fsb-fazit { background: #fff; padding: 0; }
.icc-fsb .icc-fsb-fazit > .icc-fsb__wrap {
  position: relative;
  overflow: hidden;
  width: calc(100% - 2 * var(--fsb-gutter));
  max-width: 1240px;
  padding: 80px 64px;
  background: var(--icc-primary);
  border-radius: var(--icc-r-panel);
}
.icc-fsb .icc-fsb-fazit > .icc-fsb__wrap::after {   /* bottom-left: the empty corner under the title */
  content: "";
  position: absolute;
  bottom: -70px;
  left: -70px;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: rgba(91, 174, 222, .25);
  pointer-events: none;
}
.icc-fsb .icc-fsb-fazit__grid { position: relative; z-index: 1; }

/* ---- 05 Weitere Erfolgsgeschichten ---- */
.icc-fsb .icc-fsb-story {
  border-color: var(--icc-border);
  border-radius: var(--icc-r-xl);
  box-shadow: var(--icc-shadow-card);
  transition: transform .25s, border-color .25s, box-shadow .25s;
}
.icc-fsb a.icc-fsb-story:hover { transform: translateY(-4px); box-shadow: var(--icc-shadow-card-hover); }
.icc-fsb .icc-fsb-story__media { border-bottom-color: var(--icc-border); }
.icc-fsb .icc-fsb-story--cta {
  position: relative;
  background: var(--icc-primary);
  border-color: var(--icc-primary);
}
.icc-fsb .icc-fsb-story--cta::after {
  content: "";
  position: absolute;
  top: -30px;
  right: -30px;
  width: 110px;
  height: 110px;
  border-radius: 50%;
  background: rgba(91, 174, 222, .25);
  pointer-events: none;
}

/* ---- Buttons, form ---- */
.icc-fsb .icc-fsb-btn {
  position: relative;
  z-index: 1;
  border-radius: var(--icc-r-pill);
  padding-left: 26px;
  padding-right: 26px;
}
.icc-fsb .icc-fsb-btn--accent { align-self: flex-start; }
.icc-fsb .icc-fsb-form {
  border: 1px solid var(--icc-border);
  border-radius: var(--icc-r-xl);
  box-shadow: var(--icc-shadow-lg);
}
.icc-fsb .icc-fsb-input {
  border-color: var(--icc-border-3);
  border-radius: var(--icc-r-input);
  background: #FBFDFE;
}

/* ---- Motion ---- */
@media (prefers-reduced-motion: reduce) {
  .icc-fsb a.icc-fsb-story:hover { transform: none; }
}

/* ---- Responsive ---- */
@media (max-width: 1100px) {
  .icc-fsb .icc-fsb-kpis__grid { gap: 14px; }
  .icc-fsb .icc-fsb-kpis__grid > .icc-fsb-kpi:nth-child(n) { padding: 26px 22px 24px; }
  .icc-fsb .icc-fsb-kpi__value { font-size: 36px; }      /* EN Prestije "+29,000 %" fits the narrower card */
  .icc-fsb .icc-fsb-section--tint > .icc-fsb__wrap { padding: 72px 32px; }
  .icc-fsb .icc-fsb-results__grid { grid-template-columns: 1fr; }  /* inside the panel two result cards are too narrow for the DBK keyword table */
}
@media (max-width: 960px) {
  .icc-fsb .icc-fsb-section--tint > .icc-fsb__wrap { padding: 64px 32px; }
  .icc-fsb .icc-fsb-fazit > .icc-fsb__wrap { padding: 64px 40px; }
  .icc-fsb .icc-fsb-measures { padding: 40px 32px; }
}
@media (max-width: 900px) {
  /* two rows of cards: the tint behind the first row only */
  .icc-fsb .icc-fsb-kpis { background: linear-gradient(180deg, var(--fsb-tint) 0 72px, #fff 72px 100%); }
  .icc-fsb .icc-fsb-kpis__grid { gap: 12px; }
}
@media (max-width: 768px) {
  .icc-fsb .icc-fsb-kpis__grid > .icc-fsb-kpi:nth-child(n) { padding: 22px 18px 20px; border-radius: var(--icc-r-sm); }
  .icc-fsb .icc-fsb-kpi:first-child::after { top: -26px; right: -26px; width: 76px; height: 76px; }  /* keeps the label clear */
  .icc-fsb .icc-fsb-challenge { padding: 28px 22px; border-radius: var(--icc-r-lg); }
  .icc-fsb .icc-fsb-measures { padding: 28px 18px; border-radius: var(--icc-r-lg); }
  .icc-fsb .icc-fsb-measures__list { gap: 12px; }
  .icc-fsb .icc-fsb-measure { padding: 22px 20px; border-radius: var(--icc-r-md); }
  .icc-fsb .icc-fsb-section--tint { padding-bottom: 20px; }
  .icc-fsb .icc-fsb-section--tint > .icc-fsb__wrap { padding: 48px 18px; border-radius: var(--icc-r-lg); }
  .icc-fsb .icc-fsb-card { padding: 24px 20px 18px; border-radius: var(--icc-r-lg); }
  .icc-fsb .icc-fsb-points { gap: 12px; }
  .icc-fsb .icc-fsb-point,
  .icc-fsb .icc-fsb-point:last-child,
  .icc-fsb .icc-fsb-point:nth-last-child(2):nth-child(odd) { padding: 24px 20px; gap: 14px; border-radius: var(--icc-r-lg); }
  .icc-fsb .icc-fsb-point__num { width: 36px; height: 36px; font-size: 16px; flex-shrink: 0; }
  .icc-fsb .icc-fsb-fazit > .icc-fsb__wrap { padding: 48px 24px; border-radius: var(--icc-r-lg); }
  .icc-fsb .icc-fsb-fazit > .icc-fsb__wrap::after { top: -60px; bottom: auto; left: auto; right: -60px; width: 140px; height: 140px; } /* one column: the empty corner is top right */
  .icc-fsb .icc-fsb-story,
  .icc-fsb .icc-fsb-form { border-radius: var(--icc-r-lg); }
  .icc-fsb .icc-fsb-profile { border-radius: var(--icc-r-lg); }
}
@media (max-width: 560px) {
  .icc-fsb .icc-fsb-measure { flex-direction: row; gap: 14px; padding: 18px; }
  .icc-fsb .icc-fsb-measure__check { width: 40px; height: 40px; border-radius: 14px; }
}
@media (max-width: 480px) {
  .icc-fsb .icc-fsb-kpis__grid { gap: 10px; }
  .icc-fsb .icc-fsb-kpis__grid > .icc-fsb-kpi:nth-child(n) { padding: 18px 14px 16px; }
  .icc-fsb .icc-fsb-kpi__text { font-size: 14px; }   /* DBK "Suchanfragen/Monat" fits the 375 px card (task-critic MINOR) */
  .icc-fsb .icc-fsb-kpi__text,
  .icc-fsb .icc-fsb-kpi__value,
  .icc-fsb .icc-fsb-beleg__source { hyphens: auto; overflow-wrap: anywhere; white-space: normal; }
  .icc-fsb .icc-fsb-kpi__value { font-size: 28px; }
  .icc-fsb .icc-fsb-eyebrow--hero { font-size: 11px; letter-spacing: .1em; padding: 8px 12px; }  /* EN DBK hero eyebrow on one line */
  .icc-fsb .icc-fsb-section--tint > .icc-fsb__wrap { padding: 40px 14px; }
  .icc-fsb .icc-fsb-challenge { padding: 24px 18px; }
}
@media (max-width: 360px) {
  /* small phones: one KPI card per row, so "+29.000 %" and long KPI lines fit */
  .icc-fsb .icc-fsb-kpis__grid { grid-template-columns: 1fr; }
  /* the Ergebnisse panel goes edge to edge so its cards keep layout B's 320 px width */
  .icc-fsb .icc-fsb-section--tint > .icc-fsb__wrap { width: 100%; border-radius: 0; padding: 40px var(--fsb-gutter); }
  .icc-fsb .icc-fsb-measures { padding: 24px 12px; }
  .icc-fsb .icc-fsb-card { padding: 22px 16px 16px; }
}

/* ==========================================================================
   v1.1 Original-Belege as rows (template-parts/fallstudie-layout-b.php v1.5).
   Each screenshot (max --fsb-shot-max, set per image from its pixel width so a
   1x capture is never stretched) beside its title, text and metric tiles;
   alternating sides; a wide, large capture gets a full row. The old one-per-row
   grid rules in fallstudie-layout-b.css no longer match any markup.
   ========================================================================== */
.icc-fsb .icc-fsb-belege__rows { display: flex; flex-direction: column; gap: 56px; margin-top: 8px; }
.icc-fsb-brow { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, var(--fsb-shot-max, 560px)); gap: 48px; align-items: center; }
.icc-fsb-brow--flip { grid-template-columns: minmax(0, var(--fsb-shot-max, 560px)) minmax(0, 1fr); }
.icc-fsb-brow--flip .icc-fsb-brow__body { order: 2; }
.icc-fsb-brow--wide { grid-template-columns: 1fr; gap: 24px; }
.icc-fsb-brow--wide .icc-fsb-brow__body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); column-gap: 48px; align-items: start; }
.icc-fsb-brow--wide .icc-fsb-brow__title,
.icc-fsb-brow--wide .icc-fsb-brow__text { grid-column: 1; }
.icc-fsb-brow--wide .icc-fsb-brow__metrics { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
.icc-fsb-brow--wide .icc-fsb-brow__shot { margin: 0 auto; }
.icc-fsb-brow__body { min-width: 0; }
.icc-fsb-brow__meta { grid-column: 1 / -1; display: flex; align-items: center; gap: 14px; } /* 2026-10-26: the row's head line, a direct child of the row */
.icc-fsb-brow__num {                              /* 2026-10-26: navy pill (was a round tint badge) */
  padding: 7px 14px;
  border-radius: var(--icc-r-pill);
  background: var(--icc-navy);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .06em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.icc-fsb-brow__src { font-size: 12.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--icc-primary); }
.icc-fsb .icc-fsb-brow__title {
  font-family: var(--icc-font-head);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.25;
  color: var(--fsb-navy);
  margin: 0 0 10px;
  text-wrap: balance;
}
.icc-fsb .icc-fsb-brow__text { font-size: 17px; line-height: 1.6; color: var(--fsb-ink); margin: 0 0 20px; text-wrap: pretty; }
.icc-fsb .icc-fsb-brow__text:last-child { margin-bottom: 0; }
.icc-fsb .icc-fsb-brow__metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.icc-fsb-brow__metric {
  background: var(--icc-tint);
  border-radius: var(--icc-r-sm);
  padding: 14px 16px 15px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.icc-fsb-brow__value {
  font-family: var(--icc-font-head);
  font-size: 26px;
  font-weight: 720;
  letter-spacing: var(--icc-ls-h2);
  line-height: 1.05;
  color: var(--icc-primary);
  overflow-wrap: anywhere;
}
.icc-fsb-brow__label { font-size: 14px; line-height: 1.4; color: var(--fsb-ink); }
.icc-fsb-brow__metric--lead { background: var(--icc-primary); }
.icc-fsb-brow__metric--lead .icc-fsb-brow__value { color: #fff; }
.icc-fsb-brow__metric--lead .icc-fsb-brow__label { color: rgba(255, 255, 255, .85); }
.icc-fsb .icc-fsb-brow__shot { margin: 0; min-width: 0; width: 100%; max-width: var(--fsb-shot-max, 560px); }
.icc-fsb .icc-fsb-brow__link {
  display: block;
  background: #fff;
  border: 1px solid var(--icc-border);
  border-radius: var(--icc-r-sm);
  overflow: hidden;
  box-shadow: var(--icc-shadow-card);
  transition: box-shadow .25s, transform .25s;
}
.icc-fsb .icc-fsb-brow__link:hover { box-shadow: var(--icc-shadow-card-hover); transform: translateY(-2px); }
.icc-fsb-brow__img { display: block; width: 100%; height: auto; }
/* Edit round 2026-10-26 (Vadim): one short line under the screenshot with the source and
   the data shown, the gallery link on the line below. */
.icc-fsb-brow__cap { margin-top: 12px; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.icc-fsb .icc-fsb-brow__note { font-size: 14px; line-height: 1.5; color: var(--fsb-ink); text-wrap: pretty; }
.icc-fsb .icc-fsb-brow__open { display: inline-flex; align-items: center; gap: 6px; font-size: 14.5px; font-weight: 600; color: var(--icc-primary); text-decoration: none; white-space: nowrap; }
.icc-fsb .icc-fsb-brow__open:hover { color: var(--icc-accent); }

/* Gallery of the case study's Belege (<dialog>, assets/js/main.js block 3). */
html.icc-lb-open { overflow: hidden; }
.icc-fsb-lb { width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: transparent; color: #fff; overflow: hidden; }
.icc-fsb-lb::backdrop { background: rgba(11, 30, 50, .95); }
.icc-fsb-lb__panel { position: relative; height: 100%; display: grid; grid-template-rows: auto minmax(0, 1fr); padding: 20px 96px 28px; }
.icc-fsb-lb__bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 48px; }
.icc-fsb-lb__count { margin: 0; font-size: 14px; font-weight: 600; letter-spacing: .04em; color: rgba(255, 255, 255, .8); }
.icc-fsb-lb__stage { margin: 0; min-height: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; }
.icc-fsb-lb__img { display: block; width: auto; height: auto; max-width: 100%; max-height: calc(100% - 72px); min-height: 0; object-fit: contain; background: #fff; border-radius: 10px; box-shadow: 0 30px 80px -30px rgba(0, 0, 0, .6); }
.icc-fsb-lb__cap { max-width: 760px; text-align: center; font-size: 14.5px; line-height: 1.5; color: rgba(255, 255, 255, .8); }
.icc-fsb-lb__title { display: block; font-size: 16px; color: #fff; }
.icc-fsb-lb__close,
.icc-fsb-lb__nav { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; padding: 0; border: 0; border-radius: 50%; background: #fff; color: var(--icc-navy); cursor: pointer; box-shadow: 0 10px 30px -10px rgba(0, 0, 0, .5); transition: background var(--icc-ease), transform var(--icc-ease); }
.icc-fsb-lb__close:hover,
.icc-fsb-lb__nav:hover { background: var(--fsb-chip); }
.icc-fsb-lb__close:focus-visible,
.icc-fsb-lb__nav:focus-visible { outline: 3px solid var(--icc-accent); outline-offset: 3px; }
.icc-fsb-lb__nav { position: absolute; top: 50%; transform: translateY(-50%); }
.icc-fsb-lb__nav--prev { left: 24px; }
.icc-fsb-lb__nav--next { right: 24px; }
.icc-fsb-lb__nav[hidden] { display: none; }
.icc-fsb-lb[open] .icc-fsb-lb__panel { animation: icc-fsb-lb-in .2s ease-out; }
@keyframes icc-fsb-lb-in { from { opacity: 0; transform: scale(.98); } to { opacity: 1; transform: none; } }
@media (max-width: 767px) {
  .icc-fsb-lb__panel { padding: 12px 12px 84px; }
  .icc-fsb-lb__img { max-height: calc(100% - 96px); }
  .icc-fsb-lb__cap { font-size: 13.5px; }
  .icc-fsb-lb__nav { top: auto; bottom: 20px; transform: none; }
  .icc-fsb-lb__nav--prev { left: calc(50% - 60px); }
  .icc-fsb-lb__nav--next { right: calc(50% - 60px); }
}
@media (prefers-reduced-motion: reduce) {
  .icc-fsb-lb[open] .icc-fsb-lb__panel { animation: none; }
}
@media (prefers-reduced-motion: reduce) {
  .icc-fsb .icc-fsb-brow__link:hover { transform: none; }
}
@media (min-width: 961px) and (max-width: 1839px) {   /* laptop widths: running text +1 px, as readability.css block 3 */
  .icc-fsb .icc-fsb-brow__text { font-size: 18px; }
}
/* Edit round 2026-10-26 (Vadim, variant "Kopfzeile + Trennlinie"): each row opens
   with its number + source line (.icc-fsb-brow__meta above) across both columns;
   from row 2 on a 2 px rule above that line separates the rows (32 px above the
   line ≤960, 44 px desktop). */
.icc-fsb-brow + .icc-fsb-brow > .icc-fsb-brow__meta { padding-top: 32px; border-top: 2px solid var(--icc-border-2); }
@media (min-width: 961px) {
  .icc-fsb-brow { row-gap: 28px; }
  .icc-fsb-brow + .icc-fsb-brow > .icc-fsb-brow__meta { padding-top: 44px; }
}
@media (max-width: 1199px) {
  /* one column below 1200 px (beside a 560 px screenshot the text column would drop
     under ~340 px): text first, then the screenshot */
  .icc-fsb .icc-fsb-belege__rows { gap: 44px; }
  .icc-fsb-brow,
  .icc-fsb-brow--flip,
  .icc-fsb-brow--wide { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .icc-fsb-brow--flip .icc-fsb-brow__body { order: 0; }
  .icc-fsb-brow--wide .icc-fsb-brow__body { display: block; }
  .icc-fsb .icc-fsb-brow__metrics { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
  .icc-fsb .icc-fsb-brow__shot { margin: 0 auto; }
}
@media (max-width: 960px) {
  .icc-fsb .icc-fsb-brow__text { font-size: 16.5px; }
}
@media (max-width: 480px) {
  .icc-fsb .icc-fsb-brow__title { font-size: 20px; }
  .icc-fsb .icc-fsb-brow__metrics { grid-template-columns: 1fr 1fr; gap: 8px; }
  .icc-fsb-brow__metric { padding: 12px 12px 13px; }
  .icc-fsb-brow__value { font-size: 21px; }
  .icc-fsb-brow__label { font-size: 13px; }
}
