/* Compact information architecture pass: fewer oversized blocks, more usable density. */
:root {
  --compact-width: min(1220px, calc(100% - 52px));
  --compact-gap: clamp(18px, 2.2vw, 34px);
}

html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
.page-width { width: var(--compact-width) !important; max-width: none !important; }
section { padding-block: clamp(42px, 5vw, 76px) !important; }
h1 { font-size: clamp(3rem, 6.6vw, 7rem) !important; line-height: .92 !important; letter-spacing: -.055em !important; }
h2 { font-size: clamp(2.2rem, 4.5vw, 5rem) !important; line-height: .94 !important; letter-spacing: -.045em !important; }
h3 { letter-spacing: -.03em !important; }
p { max-width: 70ch; }

/* Hero: one clear message, two offers with enough room for their copy. */
#top { padding-top: clamp(42px, 5vw, 72px) !important; }
#top .hero-grid { grid-template-columns: minmax(0, 1fr) minmax(400px, .86fr) !important; gap: clamp(30px, 5vw, 76px) !important; align-items: start; }
#top .hero-copy { max-width: 760px; }
#top .hero-copy > h1 { max-width: 760px; }
#top .hero-lede { max-width: 720px !important; font-size: clamp(1.12rem, 1.7vw, 1.5rem) !important; line-height: 1.2 !important; }
#top .hero-offer-stack { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; align-items: stretch; }
#top .offer-panel { min-width: 0; height: auto !important; min-height: 0 !important; padding: 22px !important; display: flex; flex-direction: column; gap: 12px; }
#top .offer-panel h3 { font-size: 1.05rem !important; margin: 0 !important; }
#top .offer-panel .offer-price { font-size: clamp(2.8rem, 4vw, 4.8rem) !important; line-height: .88 !important; }
#top .offer-panel p { font-size: 1rem !important; line-height: 1.2 !important; margin: 0 !important; }
#top .offer-panel .button { margin-top: auto !important; }
#top .hero-offer-stack .offer-panel-hub { grid-column: auto !important; }
#top .hero-offer-stack .offer-panel-build { grid-column: auto !important; }
#top .hero-offer-stack .offer-panel .button { display: none !important; }
#top .hero-offer-stack:after { content: "SOLUTION LOOP STARTEN  ↗     ·     BUILD SPRINT ANSEHEN  ↗"; grid-column: 1 / -1; display: block; padding: 15px 2px 0; color: var(--yellow, #ffeb00); font-size: .83rem; font-weight: 800; letter-spacing: .08em; }

/* Proof/logo strip: one quiet, horizontal line. */
.logo-wall { display: flex !important; flex-wrap: nowrap !important; gap: 0 !important; background: #fff !important; border: 1px solid #111 !important; overflow: hidden; }
.logo-wall .logo-cell { flex: 1 1 0 !important; min-width: 0 !important; height: 72px !important; padding: 10px !important; background: #fff !important; border: 0 !important; border-right: 1px solid #ddd !important; }
.logo-wall .logo-cell:last-child { border-right: 0 !important; }
.logo-wall img { max-width: 100% !important; max-height: 34px !important; filter: grayscale(1) !important; }

/* Deliverables: always a readable three-column row. */
.deliverables-section .deliverables-list, .deliverables-section ol { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 0 !important; border-top: 1px solid currentColor; border-bottom: 1px solid currentColor; }
.deliverables-section .deliverables-list > li, .deliverables-section ol > li { display: flex !important; flex-direction: column !important; gap: 14px !important; min-width: 0 !important; padding: 22px 24px !important; border: 0 !important; border-right: 1px solid currentColor !important; }
.deliverables-section .deliverables-list > li:last-child, .deliverables-section ol > li:last-child { border-right: 0 !important; }
.deliverables-section .deliverable-visual { min-height: 104px !important; margin-top: auto !important; }
.deliverables-section h3, .deliverables-section h4 { font-size: clamp(1.35rem, 2.2vw, 2rem) !important; }
.deliverables-section p { font-size: .98rem !important; line-height: 1.25 !important; }

/* Self-check: result stays beside the checklist and reacts immediately. */
.self-check-section .self-check-grid { display: grid !important; grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr) !important; gap: 28px !important; align-items: start !important; }
#self-check-result { position: sticky; top: 100px; margin: 0 !important; }

/* First month: a clean timeline, no staggered cards. */
#erster-monat .sprint-steps, .sensemaking-sprint .sprint-steps { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 0 !important; border-top: 1px solid currentColor; border-bottom: 1px solid currentColor; }
#erster-monat .sprint-steps > li, .sensemaking-sprint .sprint-steps > li { min-width: 0; min-height: 0 !important; padding: 20px 18px !important; border: 0 !important; border-right: 1px solid currentColor !important; }
#erster-monat .sprint-steps > li:last-child, .sensemaking-sprint .sprint-steps > li:last-child { border-right: 0 !important; }
#erster-monat .sprint-steps h4, .sensemaking-sprint .sprint-steps h4 { font-size: clamp(1.25rem, 2vw, 1.8rem) !important; }

/* Compact benefit tiles, not a separate oversized manifesto section. */
.use-cases-section .use-case-grid, .use-cases-section .compact-case-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 14px !important; }
.use-cases-section .compact-case-card, .use-cases-section article { min-height: 0 !important; padding: 20px !important; }
.use-cases-section article h3 { font-size: 1.35rem !important; }
.use-cases-section article p { font-size: .95rem !important; line-height: 1.22 !important; }

/* FAQ: two compact columns with matching rules. */
.faq-section .faq-grid { display: grid !important; grid-template-columns: 220px minmax(0, 1fr) !important; gap: 34px !important; }
.faq-section .faq-list { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; column-gap: 28px !important; align-content: start; }
.faq-section .faq-item { min-width: 0; border-top: 1px solid currentColor !important; }
.faq-section .faq-item:last-child { border-bottom: 1px solid currentColor !important; }
.faq-section .faq-question { font-size: 1rem !important; padding: 15px 0 !important; }
.faq-section .faq-answer { font-size: .92rem !important; line-height: 1.3 !important; }

/* Before/after: context and comparison carry equal visual weight. */
.before-after-section .before-after-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 0 !important; }
.before-after-section .before-after-grid > * { min-width: 0; padding: 22px !important; }
.before-after-section h2 { font-size: clamp(1.75rem, 3vw, 3rem) !important; }
.before-after-section p { font-size: .98rem !important; line-height: 1.3 !important; }
.case-impact, .case-scope { display: block !important; margin-top: 14px !important; padding-top: 12px !important; border-top: 1px solid currentColor !important; font-size: .92rem !important; }

/* Missing context section, deliberately dense and scannable. */
.context-section { background: #f7f6f1; color: #111; }
.context-intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, .55fr); gap: 36px; align-items: end; margin-bottom: 28px; }
.context-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid #111; }
.context-card { min-width: 0; padding: 22px 20px 24px; border-right: 1px solid #bbb; border-bottom: 1px solid #bbb; }
.context-card:nth-child(3n) { border-right: 0; }
.context-card .context-kicker { font-size: .74rem; font-weight: 800; letter-spacing: .1em; color: #666; }
.context-card h3 { font-size: 1.45rem; line-height: 1.02; margin: 24px 0 8px; }
.context-card p { color: #666; font-size: .95rem; line-height: 1.24; margin: 0; }
.boundary-strip { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 24px; align-items: start; padding: 20px 0; border-top: 1px solid currentColor; border-bottom: 1px solid currentColor; }
.boundary-strip strong { font-size: .8rem; letter-spacing: .1em; }
.boundary-strip p { margin: 0; font-size: 1.05rem; line-height: 1.25; }

/* Keep the platform section from duplicating the offer narrative. */
#plattform .platform-trust, #plattform .platform-enablement, #plattform .platform-overview-footer { display: none !important; }

@media (max-width: 850px) {
  :root { --compact-width: min(100% - 32px, 720px); }
  #top .hero-grid, #top .hero-offer-stack, .self-check-section .self-check-grid, .faq-section .faq-grid, .context-intro { grid-template-columns: 1fr !important; }
  #top .hero-offer-stack:after { grid-column: auto; }
  .deliverables-section .deliverables-list, .deliverables-section ol, #erster-monat .sprint-steps, .sensemaking-sprint .sprint-steps, .use-cases-section .use-case-grid, .use-cases-section .compact-case-grid, .context-grid { grid-template-columns: 1fr !important; }
  .deliverables-section .deliverables-list > li, .deliverables-section ol > li, #erster-monat .sprint-steps > li, .sensemaking-sprint .sprint-steps > li, .context-card { border-right: 0 !important; border-bottom: 1px solid currentColor !important; }
  .faq-section .faq-list { grid-template-columns: 1fr !important; }
  .before-after-section .before-after-grid { grid-template-columns: 1fr !important; }
  .logo-wall .logo-cell { height: 56px !important; padding: 7px !important; }
  .logo-wall img { max-height: 24px !important; }
}