/* Compact sales layout: fewer scroll breaks, clearer horizontal reading order. */
:root {
  --compact-gap: clamp(1rem, 2vw, 2rem);
  --compact-pad: clamp(1.25rem, 3vw, 3rem);
}

main section { padding-block: clamp(2.25rem, 4vw, 5rem) !important; }
.page-width { width: min(100% - 3rem, 1280px) !important; }
h1 { font-size: clamp(2.8rem, 6.2vw, 6.8rem) !important; line-height: .9 !important; letter-spacing: -.055em !important; }
h2 { font-size: clamp(2rem, 4.3vw, 4.8rem) !important; line-height: .94 !important; letter-spacing: -.045em !important; }
h3 { letter-spacing: -.035em !important; }
p { line-height: 1.32 !important; }

/* Hero: give the offer copy room instead of stacking narrow text columns. */
.hero-grid { grid-template-columns: minmax(0, 1.05fr) minmax(30rem, .95fr) !important; gap: 2rem !important; align-items: start !important; }
.hero-copy { max-width: none !important; }
.hero-lede { max-width: 46rem !important; }
.hero-offer-stack { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 1rem !important; align-items: stretch !important; }
.hero-offer-stack .offer-panel { min-width: 0 !important; min-height: 0 !important; padding: 1.25rem !important; display: flex !important; flex-direction: column !important; }
.hero-offer-stack .offer-panel h3 { font-size: .78rem !important; margin-bottom: .7rem !important; }
.hero-offer-stack .offer-panel p { max-width: none !important; font-size: 1rem !important; line-height: 1.28 !important; }
.hero-offer-stack .offer-panel .offer-panel-price { margin-top: auto !important; }
.hero-offer-stack .offer-panel .button { margin-top: 1rem !important; }
.hero-offer-stack + .hero-cta-row,
.hero-cta-row { display: flex !important; gap: 1rem !important; align-items: center !important; flex-wrap: wrap !important; margin-top: 1rem !important; }

/* One restrained logo strip below the offer. */
.logo-wall { display: flex !important; flex-wrap: nowrap !important; gap: 0 !important; padding: .7rem 1rem !important; overflow: hidden !important; background: #fff !important; }
.logo-cell { flex: 1 1 0 !important; min-width: 0 !important; min-height: 3rem !important; padding: .35rem .7rem !important; background: #fff !important; border: 0 !important; }
.logo-cell img { max-width: 100% !important; max-height: 2.25rem !important; object-fit: contain !important; filter: grayscale(1) !important; }

/* Deliverables: three equal columns with the visual under its own deliverable. */
.deliverables-list { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 0 !important; }
.deliverables-list > li { display: flex !important; flex-direction: column !important; min-width: 0 !important; padding: 1.25rem !important; border-right: 1px solid currentColor !important; }
.deliverables-list > li:last-child { border-right: 0 !important; }
.deliverable-copy p { max-width: none !important; }
.deliverable-visual { min-height: 7rem !important; margin-top: auto !important; }
.deliverable-visual.deliverable-flow { display: flex !important; align-items: center !important; gap: .35rem !important; }
.deliverable-visual.deliverable-flow > * { flex: 1 1 0 !important; min-width: 0 !important; }
.deliverable-visual.deliverable-loop { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: .3rem !important; }

/* Self-check result sits beside the checklist and updates immediately. */
.self-check-grid { display: grid !important; grid-template-columns: minmax(0, 1.15fr) minmax(18rem, .85fr) !important; gap: 2rem !important; align-items: start !important; }
#self-check-result { grid-column: 2 !important; grid-row: 1 !important; align-self: start !important; position: sticky !important; top: 6rem !important; }
.self-check-list { grid-column: 1 !important; }

/* The four-week Solution Loop is a single readable line. */
.sprint-steps { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 0 !important; }
.sprint-steps > li { min-width: 0 !important; padding: 1rem !important; border-right: 1px solid currentColor !important; }
.sprint-steps > li:last-child { border-right: 0 !important; }
.sprint-steps h4 { font-size: clamp(1.15rem, 2vw, 2rem) !important; line-height: 1 !important; }

/* Benefits/context: compact cards instead of a second oversized narrative section. */
.use-case-grid, .compact-case-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 1rem !important; }
.compact-case-card { min-height: 0 !important; padding: 1.25rem !important; }
.compact-case-card h3 { font-size: clamp(1.25rem, 2vw, 2rem) !important; }

/* FAQ: two columns, common rules and no oversized left rail. */
.faq-grid { display: grid !important; grid-template-columns: minmax(12rem, .35fr) minmax(0, 1fr) !important; gap: 2rem !important; }
.faq-list, .faq-accordion, .accordion-list { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 0 1.5rem !important; align-content: start !important; }
.faq-item, .faq-list > *, .faq-accordion > * { min-width: 0 !important; }

/* Before/after: each case is a compact, repeated horizontal unit. */
.before-after-section .before-after-grid,
.scenario-list { display: grid !important; grid-template-columns: minmax(11rem, .28fr) minmax(16rem, .42fr) minmax(0, .7fr) !important; gap: 1.25rem !important; align-items: start !important; }
.before-after-section .before-after-heading { margin-bottom: 1rem !important; }
.before-after-section .before-after-card { min-height: 0 !important; }
.case-impact, .case-scope { margin-top: .7rem !important; font-size: .95rem !important; }
.before-after-proof { background: #f5f3ef !important; }

/* Platform/old narrative blocks are not the sales-page priority. */
#plattform .platform-trust, #plattform .platform-enablement { display: none !important; }
#use-cases, .use-cases-section:not(.compact-benefits) { padding-block: 2rem !important; }

@media (max-width: 980px) {
  .hero-grid { grid-template-columns: 1fr !important; }
  .hero-offer-stack { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .before-after-section .before-after-grid, .scenario-list { grid-template-columns: 1fr 1fr !important; }
  .scenario-list > *:first-child { grid-column: 1 / -1 !important; }
}

@media (max-width: 700px) {
  main section { padding-block: 2rem !important; }
  .page-width { width: min(100% - 1.5rem, 1280px) !important; }
  h1 { font-size: clamp(2.5rem, 13vw, 4.5rem) !important; }
  h2 { font-size: clamp(1.9rem, 9vw, 3.3rem) !important; }
  .hero-offer-stack, .deliverables-list, .use-case-grid, .compact-case-grid, .sprint-steps, .self-check-grid, .faq-list, .faq-accordion, .accordion-list, .before-after-section .before-after-grid, .scenario-list { grid-template-columns: 1fr !important; }
  .deliverables-list > li, .sprint-steps > li { border-right: 0 !important; border-bottom: 1px solid currentColor !important; }
  #self-check-result { grid-column: 1 !important; grid-row: auto !important; position: static !important; }
  .logo-wall { overflow-x: auto !important; }
  .logo-cell { flex: 0 0 6.5rem !important; }
}