/* ════════════════════════════════════════════════════════════════════
   thesen19 — Aufsatz auf thesen17
   1) Seiten-Grund einen Tick heller (war #ECEEF1)
   2) „DEMNÄCHST" — ruhige Teaser (wie #13, ohne Zitat), linksbündig,
      zweispaltig: Inhalt links · hellblaue Letter-Einheit rechts.
      Headline in Flecha M Medium, größer & luftiger. Gelbe Linie + Hashtags.
   ════════════════════════════════════════════════════════════════════ */

/* Flecha M — Medium (aufrecht), neu; weight 500 / normal war frei */
@font-face{
  font-family:'Flecha M';
  src:url('../fonts/FlechaM-Medium.woff2') format('woff2'),
      url('../fonts/FlechaM-Medium.woff') format('woff');
  font-weight:500; font-style:normal; font-display:swap;
}

/* 1) Hintergrund ein kleines Stück heller ───────────────────────────── */
.v6-fx-drift{--paper:#F1F3F6;}
body{background-color:#F1F3F6;}

/* ── Sektion „DEMNÄCHST" — linksbündig (gleiche Kante wie Header/Thesen) ── */
.v6-upstack{
  max-width:1320px; margin:0 auto; padding:0 40px;
  display:flex; flex-direction:column; align-items:flex-start; gap:16px;
}
.v6-up{width:100%; max-width:880px;}

/* Zweispaltig: Inhalt links · hellblaue Einheit rechts */
.v6-up-inner{
  background:var(--paper-pure); border:1px dashed rgba(0,0,254,.30);
  border-radius:5px; overflow:hidden;
  display:grid; grid-template-columns:1fr minmax(230px,290px); align-items:stretch;
}
.v6-up-main{padding:24px 30px; display:flex; flex-direction:column;}
.v6-up-head{display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px;}
.v6-up-num{
  font-family:var(--font-wide); font-weight:700; font-size:24px; line-height:1;
  color:var(--blue); letter-spacing:-.02em;
}
.v6-up-kw{
  font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--blue);
  border:1px solid var(--blue); border-radius:999px; padding:4px 10px; white-space:nowrap;
}
/* Headline: Flecha M Medium, größer, mehr Abstand oben/unten */
/* .v6-fx-drift-Prefix: höhere Spezifität als der Reset .v6-fx-drift h3{margin:0} */
.v6-fx-drift .v6-up-title{
  font-family:var(--font-serif); font-weight:500;
  font-size:28px; line-height:1.1; letter-spacing:-.015em;
  color:var(--ink); margin:29px 0 10px; text-transform:none; text-wrap:balance;
}
.v6-up-line{
  display:block; width:60px; height:0; border:none; border-top:3px solid var(--yellow);
  border-radius:2px; margin:0;
}
.v6-up-tags{display:inline-flex; flex-wrap:wrap; gap:6px; align-items:center;}
.v6-up .v6-ptag{font-size:10px; padding:3px 8px; opacity:.85;}

/* Rechte hellblaue Einheit (Nudge + CTA) */
.v6-up-nudge{
  background:rgba(0,0,254,.05); border-left:1px solid rgba(0,0,254,.12);
  padding:24px 26px; display:flex; flex-direction:column; justify-content:center; gap:14px;
}
.v6-up-nudge-text{margin:0; font-family:var(--font-sans); font-size:13px; line-height:1.5; color:var(--graphite);}
.v6-up-cta{
  font-family:var(--font-mono); font-size:12px; letter-spacing:.02em; color:var(--blue);
  text-decoration:none; display:inline-flex; align-items:center; gap:7px; align-self:flex-start;
  border-bottom:2px solid var(--blue); padding-bottom:2px;
}
.v6-up-arr{display:inline-block; transition:transform var(--d-fast) var(--ease-out);}
.v6-up-cta:hover .v6-up-arr{transform:translate(3px,-3px);}

/* ── Index: kommende Zeilen sind jetzt klickbar (→ Letter) ───────────── */
.v6-row-up .v6-rowbtn-up{cursor:pointer; text-decoration:none;}
.v6-row-up:hover{background:rgba(0,0,254,.05);}
.v6-row-up:hover .v6-rowkw{background:var(--blue); color:#fff;}
.v6-rowkw{transition:background var(--d-fast) var(--ease-out), color var(--d-fast) var(--ease-out);}

/* ── Responsive ──────────────────────────────────────────────────────── */
@media (max-width:1020px){ .v6-upstack{padding:0 28px;} .v6-up{max-width:none;} }
@media (max-width:680px){
  .v6-upstack{padding:0 20px; gap:14px;}
  .v6-up-inner{grid-template-columns:1fr;}
  .v6-up-main{padding:20px 20px;}
  .v6-fx-drift .v6-up-title{font-size:24px; margin:24px 0 10px;}
  .v6-up-nudge{border-left:none; border-top:1px solid rgba(0,0,254,.12); padding:18px 20px;}
}

/* ════════════════════════════════════════════════════════════════════
   Hero / Marquee / Thesen-Boxen — Feinschliff
   ════════════════════════════════════════════════════════════════════ */

/* Hero straffen: weniger große Abstände, Linie + Lead-Text höher */
.v6-hero{padding:54px 40px 38px;}            /* war 88 40 64 */
.v6-heroeyebrow{margin-bottom:16px;}         /* war 28 */
.v6-h1bottom{margin-top:10px;}               /* war 18 */
.v6-herofoot{margin-top:22px; padding-top:16px;}  /* war 40 / 20 → ein Stück hoch */

/* „·" (Divis) im hellen Marken-Gelb statt im tiefen Gelb */
.v6-h1slash{color:var(--yellow);}
/* „bald" in Schwarz statt verblasstem Blau */
.v6-h1bottomblue{color:var(--ink); opacity:1;}

/* Laufband ein Stück höher */
.v6-marqueewrap{margin-top:16px;}            /* war 32 */

/* Headline-Umbruch, wenn schmaler: KI·ARBEITS-/WELT bleibt groß
   (sonst schrumpft das eine lange Wort unter die zweite Headline) */
@media (max-width:860px){
  .v6-h1big{font-size:clamp(54px, 11vw, 90px); line-height:.96;}
  .v6-h1underline{display:none;}             /* Strich beim Umbruch ausblenden */
}

/* Thesennummern einen Tick kleiner */
.v6-pnum{font-size:46px;}

/* Thesen-Box zugeklappt: Bild höher, Button tiefer, weniger Weißraum unten */
.v6-poster .v6-pimg{width:72%; height:72%;}
.v6-fx-drift .v6-poster:not(.is-open) .v6-pfig{min-height:260px;}
.v6-fx-drift .v6-poster:not(.is-open) .v6-pinner{padding-bottom:20px;}