/* Landing page composition based on the approved August 2026 mockup.
   Section backgrounds remain full bleed; all readable/visual content shares one rail. */
.home-page {
  --landing-gutter: clamp(24px, 5vw, 72px);
  --landing-shell: min(1180px, calc(100vw - (2 * var(--landing-gutter))));
  --landing-green: #00eb1c;
  --landing-ink: #101210;
}

.home-page *,
.home-page *::before,
.home-page *::after {
  box-sizing: border-box;
}

.home-page .minimal-hero-inner,
.home-page .dark-offer-overview,
.home-page .dark-offer-grid,
.home-page .perspectives-inner,
.home-page .perspectives-cta-inner,
.home-page .practice-growth-inner,
.home-page > footer {
  width: var(--landing-shell) !important;
  max-width: var(--landing-shell) !important;
  margin-inline: auto !important;
}

/* Keep the hero photo clear of the fixed navbar, matching every other page.
   The inner grid's height is reduced by the same 86px so the section still
   totals exactly one viewport (100vh), not 100vh + 86px. */
@media (min-width: 761px) {
  .home-page .minimal-hero {
    padding-top: 86px !important;
    background-origin: content-box !important;
  }

  .home-page .minimal-hero-inner {
    min-height: calc(100vh - 86px) !important;
  }
}

/* Typography system supplied by the client. */
.home-page .minimal-hero-copy h1,
.home-page .dark-offer-overview-heading h2,
.home-page .perspectives-heading h2,
.home-page .perspectives-notes h3,
.home-page .perspectives-cta-inner h2,
.home-page .practice-growth-copy h2,
.home-page .dark-offer-copy h3 {
  font-family: "Zilla Slab", Georgia, serif !important;
  font-style: italic !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  line-height: 1 !important;
}

.home-page .minimal-hero-copy p,
.home-page .dark-offer-overview-heading p {
  font-family: "Noto Sans", Arial, sans-serif !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0.04em !important;
  line-height: 1.5 !important;
}

.home-page .dark-offer-overview-copy p,
.home-page .dark-offer-copy p,
.home-page .perspectives-intro p,
.home-page .perspectives-notes p,
.home-page .practice-growth-copy p {
  font-family: "Noto Sans", Arial, sans-serif !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0.005em !important;
  line-height: 1.5 !important;
}

/* Hero */
.home-page .minimal-hero-inner {
  grid-template-columns: minmax(0, 0.88fr) minmax(430px, 1.12fr) !important;
}

.home-page .minimal-hero-copy {
  max-width: 520px !important;
}

.home-page .minimal-hero-copy h1 {
  font-size: clamp(3rem, 4.8vw, 4.65rem) !important;
}

.home-page .minimal-hero-copy p {
  max-width: 46ch !important;
  font-size: clamp(0.9rem, 1.05vw, 1.05rem) !important;
}

.home-page .minimal-hero-link {
  display: none !important;
}

/* Product overview: white full-bleed background, bounded content and three dark cards. */
.home-page .dark-offer-section {
  overflow: hidden !important;
  padding: clamp(54px, 6vw, 86px) 0 clamp(64px, 7vw, 102px) !important;
  color: var(--landing-ink) !important;
  background: #fff !important;
}

.home-page .dark-offer-stage {
  width: 100% !important;
  max-width: none !important;
  background: #fff !important;
}

.home-page .dark-offer-overview {
  padding: 0 !important;
}

.home-page .dark-offer-overview-heading {
  display: grid !important;
  grid-template-columns: minmax(260px, 0.8fr) minmax(0, 1.2fr) !important;
  column-gap: 88px !important;
  row-gap: clamp(42px, 5vw, 72px) !important;
  align-items: start !important;
}

.home-page .dark-offer-overview-heading h2 {
  margin: 0 !important;
  color: var(--landing-ink) !important;
  font-size: clamp(2.5rem, 4vw, 4rem) !important;
  white-space: normal !important;
}

.home-page .dark-offer-overview-heading p {
  margin: 0 !important;
  color: var(--landing-ink) !important;
  font-size: clamp(0.92rem, 1.14vw, 1.12rem) !important;
}

.home-page .dark-offer-timeline {
  position: relative !important;
  display: block !important;
  height: 22px !important;
  margin: clamp(28px, 3.2vw, 46px) 0 24px !important;
}

.home-page .dark-offer-timeline-line {
  position: absolute !important;
  top: 50% !important;
  right: 0 !important;
  left: 0 !important;
  height: 1px !important;
  background: rgba(0, 235, 28, 0.42) !important;
}

.home-page .dark-offer-node {
  position: absolute !important;
  top: 50% !important;
  width: 12px !important;
  height: 12px !important;
  margin: 0 !important;
  border: 2px solid var(--landing-green) !important;
  border-radius: 50% !important;
  background: #fff !important;
  transform: translate(-50%, -50%) !important;
}

.home-page .dark-offer-node-active {
  width: 14px !important;
  height: 14px !important;
  background: var(--landing-green) !important;
  box-shadow: 0 0 0 5px rgba(0, 235, 28, 0.13) !important;
}

.home-page .dark-offer-node:nth-of-type(2) { left: 0 !important; }
.home-page .dark-offer-node:nth-of-type(3) { left: 33.333% !important; }
.home-page .dark-offer-node:nth-of-type(4) { left: 66.666% !important; }
.home-page .dark-offer-node:nth-of-type(5) { left: 100% !important; }

.home-page .dark-offer-overview-copy {
  position: relative !important;
  display: grid !important;
  min-height: 112px !important;
  padding: 0 !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(18px, 3vw, 44px) !important;
}

.home-page .dark-offer-overview-copy p {
  position: static !important;
  width: auto !important;
  margin: 0 !important;
  color: var(--landing-ink) !important;
  font-size: clamp(0.78rem, 0.92vw, 0.92rem) !important;
  text-align: left !important;
  transform: none !important;
}

.home-page .dark-offer-overview-copy p:nth-child(1) { grid-column: 2 !important; }
.home-page .dark-offer-overview-copy p:nth-child(2) { grid-column: 3 !important; }
.home-page .dark-offer-overview-copy p:nth-child(3) { grid-column: 4 !important; }

.home-page .dark-offer-grid {
  display: grid !important;
  min-height: 0 !important;
  padding: 0 !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
  background: transparent !important;
}

.home-page .dark-offer-card {
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 20px 22px 30px !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  border-radius: 4px !important;
  overflow: hidden !important;
  color: #fff !important;
  background: #080a09 !important;
}

.home-page .dark-product-brand {
  height: 36px !important;
}

.home-page .dark-product-logo {
  width: auto !important;
  max-width: 245px !important;
  height: 26px !important;
  object-fit: contain !important;
}

.home-page .dark-product-logo-tools,
.home-page .dark-product-logo-dashboard {
  height: 30px !important;
}

.home-page .dark-product-logo-ai {
  margin-bottom: 1px;
}

.home-page .dark-product-visual {
  width: 100% !important;
  height: clamp(190px, 20vw, 255px) !important;
  margin: 12px 0 18px !important;
}

.home-page .dark-product-animation-image {
  max-width: 100% !important;
}

.home-page .dark-offer-copy h3 {
  margin: 0 0 18px !important;
  color: #fff !important;
  font-size: clamp(1rem, 1.2vw, 1.18rem) !important;
}

.home-page .dark-offer-copy p {
  max-width: none !important;
  margin: 0 !important;
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: clamp(0.78rem, 0.9vw, 0.9rem) !important;
}

/* Interface section */
.home-page .perspectives-section {
  overflow: hidden !important;
  background: #fff !important;
}

.home-page .perspectives-inner {
  display: grid !important;
  padding: clamp(76px, 8vw, 116px) 0 !important;
  grid-template-columns: minmax(260px, 0.8fr) minmax(0, 1.2fr) !important;
  column-gap: clamp(56px, 8vw, 118px) !important;
  row-gap: clamp(42px, 5vw, 72px) !important;
}

.home-page .perspectives-heading h2 {
  margin: 0 !important;
  color: var(--landing-ink) !important;
  font-size: clamp(2.7rem, 4vw, 4rem) !important;
}

.home-page .perspectives-intro {
  max-width: 55ch !important;
}

.home-page .perspectives-intro p {
  margin: 0 !important;
  color: var(--landing-ink) !important;
  font-size: clamp(0.86rem, 1vw, 1rem) !important;
}

.home-page .perspectives-intro p + p {
  margin-top: 26px !important;
}

.home-page .perspectives-visual {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  grid-column: 1 / -1 !important;
}

.home-page .perspectives-image-frame {
  width: 75% !important;
  max-width: 100% !important;
  border-radius: 0 !important;
}

.home-page .perspectives-image-surface {
  width: 100% !important;
  max-width: 100% !important;
  border-radius: 0 !important;
}

.home-page .perspectives-notes {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  grid-column: 1 / -1 !important;
}

.home-page .perspectives-notes article:first-child {
  display: grid !important;
  grid-template-columns: minmax(260px, 0.8fr) minmax(0, 1.2fr) !important;
  column-gap: clamp(56px, 8vw, 118px) !important;
}

.home-page .perspectives-notes article:nth-child(2) {
  display: none !important;
}

.home-page .perspectives-notes h3 {
  max-width: 14ch !important;
  margin: 0 !important;
  color: var(--landing-ink) !important;
  font-size: clamp(2rem, 3.2vw, 3.1rem) !important;
}

.home-page .perspectives-notes p {
  max-width: 55ch !important;
  margin: 0 !important;
  color: var(--landing-ink) !important;
  font-size: clamp(0.86rem, 1vw, 1rem) !important;
}

/* Static statement; the former scroll-fill animation is intentionally disabled. */
.home-page .perspectives-cta-section {
  overflow: hidden !important;
  background: #fff !important;
}

.home-page .perspectives-cta-inner {
  min-height: 0 !important;
  padding: clamp(88px, 10vw, 150px) 0 clamp(92px, 10vw, 148px) !important;
}

.home-page .perspectives-cta-inner h2 {
  max-width: 18ch !important;
  margin: 0 auto !important;
  color: var(--landing-green) !important;
  background: none !important;
  font-size: clamp(2.8rem, 5vw, 4.7rem) !important;
  text-align: center !important;
  -webkit-text-fill-color: var(--landing-green) !important;
}

.home-page .scroll-fill-line {
  display: block !important;
  color: inherit !important;
  background: none !important;
  -webkit-text-fill-color: inherit !important;
}

.home-page .scroll-fill-char {
  color: inherit !important;
  opacity: 1 !important;
  transform: none !important;
  -webkit-text-fill-color: inherit !important;
}

.home-page .perspectives-cta-actions {
  margin-top: clamp(48px, 5vw, 72px) !important;
  gap: clamp(48px, 7vw, 88px) !important;
}

.home-page .perspectives-cta-icon {
  width: 66px !important;
  height: 66px !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #050505 !important;
}

.home-page .perspectives-cta-euro {
  width: 32px !important;
  height: 32px !important;
  object-fit: contain !important;
  filter: invert(1) grayscale(1) contrast(1000%) !important;
  mix-blend-mode: screen;
  transform: scale(0.78);
}

/* Practice section: bounded text above a full-bleed visual background. */
.home-page .practice-growth-section {
  position: relative !important;
  min-height: clamp(700px, 69vw, 900px) !important;
  overflow: hidden !important;
  isolation: isolate !important;
  background: #fff !important;
}

.home-page .practice-growth-section::before {
  position: absolute !important;
  z-index: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 58% !important;
  content: "" !important;
  background: url("assets/glass-pane-practice-background.png") center center / cover no-repeat !important;
  transform: scaleX(-1) !important;
}

.home-page .practice-growth-inner {
  position: relative !important;
  z-index: 1 !important;
  min-height: inherit !important;
  display: block !important;
}

.home-page .practice-growth-copy {
  display: grid !important;
  width: 100% !important;
  max-width: none !important;
  padding: clamp(76px, 8vw, 116px) 0 0 !important;
  grid-template-columns: minmax(260px, 0.8fr) minmax(0, 1.2fr) !important;
  column-gap: clamp(56px, 8vw, 118px) !important;
}

.home-page .practice-growth-copy h2 {
  max-width: none !important;
  margin: 0 !important;
  color: var(--landing-ink) !important;
  font-size: clamp(2.6rem, 4vw, 4rem) !important;
}

.home-page .practice-growth-copy p {
  max-width: 55ch !important;
  margin: 0 !important;
  color: var(--landing-ink) !important;
  font-size: clamp(0.86rem, 1vw, 1rem) !important;
  grid-column: 2 !important;
}

.home-page .practice-growth-copy p + p {
  margin-top: 24px !important;
}

.home-page > footer {
  min-height: 80px !important;
  padding: 24px 0 !important;
}

@media (max-width: 760px) {
  .home-page {
    --landing-gutter: 18px;
    --landing-shell: calc(100vw - (2 * var(--landing-gutter)));
  }

  .home-page .minimal-hero-inner {
    display: block !important;
    width: var(--landing-shell) !important;
    padding-top: 156px !important;
  }

  .home-page .minimal-hero-copy {
    width: min(100%, 24rem) !important;
  }

  .home-page .minimal-hero-copy h1 {
    font-size: clamp(2.45rem, 11.5vw, 3.45rem) !important;
  }

  .home-page .minimal-hero-copy p {
    font-size: 0.9rem !important;
  }

  .home-page .dark-offer-section {
    padding: 52px 0 64px !important;
  }

  .home-page .dark-offer-overview-heading,
  .home-page .perspectives-inner,
  .home-page .perspectives-notes article:first-child,
  .home-page .practice-growth-copy {
    display: block !important;
  }

  .home-page .dark-offer-overview-heading h2,
  .home-page .perspectives-heading h2,
  .home-page .perspectives-notes h3,
  .home-page .practice-growth-copy h2 {
    font-size: clamp(2.25rem, 10vw, 3rem) !important;
  }

  .home-page .dark-offer-overview-heading p {
    margin-top: 22px !important;
    font-size: 0.9rem !important;
  }

  .home-page .dark-offer-timeline {
    display: none !important;
  }

  .home-page .dark-offer-overview-copy {
    display: grid !important;
    min-height: 0 !important;
    padding: 0 !important;
    grid-template-columns: 1fr !important;
    gap: 26px !important;
    margin-top: 44px !important;
  }

  .home-page .dark-offer-overview-copy p:nth-child(n) {
    grid-column: 1 !important;
  }

  .home-page .dark-offer-overview-copy p {
    position: relative !important;
    padding-left: 32px !important;
  }

  .home-page .dark-offer-overview-copy p::before {
    content: "" !important;
    position: absolute !important;
    top: 2px !important;
    left: 0 !important;
    z-index: 1 !important;
    display: block !important;
    width: 16px !important;
    height: 16px !important;
    border: none !important;
    border-radius: 50% !important;
    background: #00eb1c !important;
  }

  .home-page .dark-offer-overview-copy p:not(:last-child)::after {
    content: "" !important;
    position: absolute !important;
    top: 18px !important;
    left: 7px !important;
    width: 2px !important;
    height: calc(100% + 10px) !important;
    background: rgba(0, 235, 28, 0.36) !important;
  }

  .home-page .dark-offer-grid {
    display: flex !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch !important;
    margin-top: 38px !important;
    grid-template-columns: unset !important;
    gap: 14px !important;
  }

  .home-page .dark-offer-grid::-webkit-scrollbar {
    display: none !important;
  }

  .home-page .dark-offer-card {
    flex: 0 0 82% !important;
    min-width: 0 !important;
    padding: 20px 18px 28px !important;
    border-radius: 4px !important;
    overflow: hidden !important;
    scroll-snap-align: center !important;
  }

  .home-page .dark-product-visual {
    height: max(150px, 54vw) !important;
  }

  .home-page .perspectives-inner {
    padding: 25px 0 76px !important;
  }

  .home-page .perspectives-intro,
  .home-page .perspectives-visual,
  .home-page .perspectives-notes {
    margin-top: 34px !important;
  }

  .home-page .perspectives-image-frame {
    min-height: 250px !important;
  }

  .home-page .perspectives-notes p {
    margin-top: 20px !important;
  }

  .home-page .perspectives-cta-inner {
    padding: 26px 0 92px !important;
  }

  .home-page .perspectives-cta-inner h2 {
    width: 100% !important;
    max-width: 100% !important;
    font-size: clamp(1.75rem, 7.8vw, 2.2rem) !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }

  .home-page .scroll-fill-line {
    white-space: normal !important;
  }

  .home-page .perspectives-cta-actions {
    margin-top: 46px !important;
    gap: 34px !important;
  }

  .home-page .perspectives-cta-icon {
    width: 58px !important;
    height: 58px !important;
  }

  .home-page .perspectives-cta-action {
    min-width: 104px !important;
    font-size: 0.78rem !important;
  }

  .home-page .practice-growth-section {
    min-height: 760px !important;
  }

  .home-page .practice-growth-section::before {
    height: 50% !important;
    background-position: 58% center !important;
  }

  .home-page .practice-growth-copy {
    padding-top: 68px !important;
  }

  .home-page .practice-growth-copy p {
    margin-top: 22px !important;
  }

  .home-page .practice-growth-copy p + p {
    margin-top: 18px !important;
  }

  .home-page > footer {
    width: var(--landing-shell) !important;
    padding: 24px 0 32px !important;
  }
}

/* August 16 finishing details: preserve the locked landing composition while
   giving the image/notes transition and closing copy a little more air. */
@media (min-width: 761px) {
  .home-page .perspectives-notes {
    margin-top: 34px !important;
  }

  .home-page .dark-offer-overview-heading > p,
  .home-page .perspectives-intro,
  .home-page .perspectives-notes-copy {
    padding-top: 18px !important;
  }

  .home-page .practice-growth-copy p:first-of-type {
    padding-top: 18px !important;
  }

  .home-page .dark-offer-section {
    padding-bottom: 68px !important;
  }

  .home-page .perspectives-inner {
    padding-top: 76px !important;
  }

  .home-page .perspectives-cta-inner {
    padding-top: 96px !important;
    padding-bottom: 100px !important;
  }
}

.home-page .perspectives-cta-euro {
  font-weight: 200 !important;
  transform: translateY(-1px) scaleX(0.72) !important;
  transform-origin: center !important;
}

/* Final closing-section spacing. */
@media (min-width: 761px) {
  .home-page .perspectives-cta-inner {
    padding-bottom: 72px !important;
  }

  .home-page .practice-growth-section {
    padding-top: 72px !important;
  }
}

@media (max-width: 760px) {
  .home-page .perspectives-cta-inner {
    padding-bottom: 64px !important;
  }

  .home-page .practice-growth-section {
    padding-top: 56px !important;
  }
}

/* Keep the green statement and the closing practice section visually closer. */
@media (min-width: 761px) {
  .home-page .perspectives-cta-inner {
    padding-bottom: 72px !important;
  }

  .home-page .practice-growth-section {
    padding-top: 72px !important;
  }
}

@media (max-width: 760px) {
  .home-page .perspectives-cta-inner {
    padding-bottom: 64px !important;
  }

  .home-page .practice-growth-section {
    padding-top: 56px !important;
  }
}

/* Final spacing override — kept last so the fixed desktop canvas cannot
   restore the older, larger gap between the final two sections. */
@media (min-width: 761px) {
  .home-page .perspectives-cta-inner {
    padding-bottom: 72px !important;
  }

  .home-page .practice-growth-section {
    padding-top: 72px !important;
  }
}

@media (max-width: 760px) {
  .home-page .perspectives-cta-inner {
    padding-bottom: 64px !important;
  }

  .home-page .practice-growth-section {
    padding-top: 56px !important;
  }
}

/* Side accents shared with the approved Über-uns composition. They sit on
   section boundaries and therefore do not alter the landing-page rhythm. */
.home-page .landing-edge-marker {
  position: relative;
  z-index: 4;
  order: 2;
  width: 100%;
  height: 0;
  pointer-events: none;
}

.home-page .landing-edge-marker::before {
  position: absolute;
  top: -23px;
  width: clamp(45px, 6vw, 82px);
  height: 46px;
  content: "";
  background: #00eb1c;
}

.home-page .landing-edge-marker-right::before {
  right: 0;
}

.home-page .landing-edge-marker-left::before {
  left: 0;
}

@media (max-width: 760px) {
  .home-page .landing-edge-marker::before {
    top: -12px;
    width: 34px;
    height: 24px;
  }
}

/* Tighter handoff from the green statement into the closing practice block. */
@media (min-width: 761px) {
  .home-page .perspectives-cta-inner {
    padding-bottom: 72px !important;
  }

  .home-page .practice-growth-section {
    padding-top: 72px !important;
  }
}

@media (max-width: 760px) {
  .home-page .perspectives-cta-inner {
    padding-bottom: 64px !important;
  }

  .home-page .practice-growth-section {
    padding-top: 56px !important;
  }
}

/* August 14 precision pass: fixed mockup rails, exact timeline alignment and
   a text-only closing composition. Kept last so it wins over legacy layers. */
.home-page {
  --landing-gutter: clamp(42px, 7vw, 112px);
  --landing-shell: min(1040px, calc(100vw - (2 * var(--landing-gutter))));
}

.home-page .perspectives-cta-euro {
  display: block !important;
  width: auto !important;
  height: auto !important;
  color: #fff !important;
  filter: none !important;
  font-family: "Noto Sans", Arial, sans-serif !important;
  font-size: 1.7rem !important;
  font-style: normal !important;
  font-weight: 300 !important;
  line-height: 1 !important;
  mix-blend-mode: normal !important;
  transform: translateY(-1px) !important;
}

.home-page .practice-growth-section {
  min-height: 0 !important;
  padding: clamp(84px, 9vw, 120px) 0 clamp(92px, 10vw, 136px) !important;
  background: #fff !important;
}

.home-page .practice-growth-section::before {
  display: none !important;
  content: none !important;
}

.home-page .practice-growth-inner {
  min-height: 0 !important;
}

.home-page .practice-growth-copy {
  padding: 0 !important;
  grid-template-columns: minmax(260px, 0.8fr) minmax(0, 1.2fr) !important;
  column-gap: clamp(56px, 8vw, 118px) !important;
}

.home-page .practice-growth-copy h2 {
  font-size: 3rem !important;
  white-space: nowrap !important;
}

.home-page .practice-growth-copy p {
  max-width: none !important;
  font-size: 0.86rem !important;
  white-space: nowrap !important;
}

.home-page > footer {
  display: flex !important;
  justify-content: flex-end !important;
}

@media (min-width: 761px) {
  .home-page .minimal-hero-copy {
    width: 510px !important;
    max-width: 510px !important;
  }

  .home-page .minimal-hero-copy h1 {
    max-width: none !important;
    font-size: 3.55rem !important;
    white-space: nowrap !important;
  }

  .home-page .dark-offer-timeline-line {
    right: 12.5% !important;
    left: 12.5% !important;
  }

  .home-page .dark-offer-node:nth-of-type(2) { left: 12.5% !important; }
  .home-page .dark-offer-node:nth-of-type(3) { left: 37.5% !important; }
  .home-page .dark-offer-node:nth-of-type(4) { left: 62.5% !important; }
  .home-page .dark-offer-node:nth-of-type(5) { left: 87.5% !important; }

  .home-page .dark-offer-overview-copy p {
    font-size: 0.78rem !important;
    text-align: center !important;
    white-space: nowrap !important;
  }

  .home-page .dark-offer-overview-copy {
    gap: 0 !important;
  }

  .home-page .perspectives-cta-inner h2 {
    width: 100% !important;
    max-width: 920px !important;
    font-size: 3.5rem !important;
  }

  .home-page .scroll-fill-line {
    white-space: nowrap !important;
  }

  .home-page .perspectives-notes article:first-child {
    grid-template-columns: minmax(430px, 0.92fr) minmax(0, 1.08fr) !important;
    column-gap: 72px !important;
  }

  .home-page .perspectives-notes h3 {
    max-width: none !important;
    font-size: 3rem !important;
    white-space: nowrap !important;
  }

  .home-page .perspectives-notes-copy p {
    max-width: none !important;
    font-size: 0.86rem !important;
    white-space: nowrap !important;
  }

  .home-page .perspectives-notes-copy p + p {
    margin-top: 26px !important;
  }
}

@media (max-width: 760px) {
  .home-page {
    --landing-gutter: 24px;
    --landing-shell: calc(100vw - (2 * var(--landing-gutter)));
  }

  .home-page .perspectives-cta-inner h2 {
    font-size: 1.45rem !important;
  }

  .home-page .minimal-hero-copy h1 {
    max-width: none !important;
    font-size: 2.05rem !important;
    white-space: nowrap !important;
  }

  .home-page .scroll-fill-line {
    white-space: nowrap !important;
  }

  .home-page .practice-growth-section {
    min-height: 0 !important;
    padding: 26px 0 82px !important;
  }

  .home-page .practice-growth-copy h2 {
    font-size: 2.2rem !important;
    white-space: nowrap !important;
  }

  .home-page .practice-growth-copy p {
    font-size: 0.74rem !important;
    white-space: normal !important;
  }

  .home-page .perspectives-notes-copy {
    margin-top: 24px !important;
  }

  .home-page .perspectives-notes-copy p + p {
    margin-top: 20px !important;
  }
}

/* Desktop uses one locked 1200px composition. Narrow desktop windows scale
   this canvas uniformly in script instead of triggering layout reflow. */
@media (min-width: 761px) {
  .home-page {
    --landing-gutter: 80px;
    --landing-shell: 1040px;
  }

  html.desktop-canvas-active {
    overflow-x: hidden !important;
  }

  .home-page.desktop-canvas-scaled {
    width: 1200px !important;
    min-width: 1200px !important;
    max-width: 1200px !important;
    overflow-x: hidden !important;
  }

  .home-page .dark-offer-overview-heading h2,
  .home-page .perspectives-heading h2,
  .home-page .perspectives-notes h3,
  .home-page .practice-growth-copy h2 {
    font-size: 3rem !important;
  }

  .home-page .minimal-hero-copy h1 {
    font-size: 3.55rem !important;
  }

  .home-page .minimal-hero-copy p,
  .home-page .dark-offer-overview-heading p {
    font-size: 1rem !important;
  }

  .home-page .dark-offer-section {
    padding: 72px 0 71px !important;
  }

  .home-page .dark-product-visual {
    height: 225px !important;
  }

  .home-page .dark-offer-copy h3 {
    font-size: 1.08rem !important;
  }

  .home-page .dark-offer-copy p,
  .home-page .dark-offer-overview-copy p {
    font-size: 0.78rem !important;
  }

  .home-page .perspectives-inner {
    padding: 96px 0 !important;
    column-gap: 88px !important;
    row-gap: 58px !important;
  }

  .home-page .perspectives-intro p,
  .home-page .perspectives-notes-copy p,
  .home-page .practice-growth-copy p {
    font-size: 0.86rem !important;
  }

  .home-page .perspectives-notes article:first-child {
    grid-template-columns: minmax(260px, 0.8fr) minmax(0, 1.2fr) !important;
    column-gap: 88px !important;
  }

  .home-page .perspectives-cta-inner {
    padding: 118px 0 72px !important;
  }

  .home-page .perspectives-cta-actions {
    margin-top: 60px !important;
    gap: 72px !important;
  }

  .home-page .practice-growth-section {
    padding: 72px 0 120px !important;
  }

  .home-page .practice-growth-copy {
    column-gap: 88px !important;
  }
}

@media (max-width: 760px) {
  .home-page .dark-offer-overview-heading h2,
  .home-page .perspectives-heading h2,
  .home-page .perspectives-notes h3,
  .home-page .practice-growth-copy h2 {
    font-size: 2.05rem !important;
  }
}

/* August 16 finishing details: preserve the locked landing composition while
   giving the image/notes transition and closing copy a little more air. */
@media (min-width: 761px) {
  .home-page .perspectives-notes {
    margin-top: 34px !important;
  }

  .home-page .practice-growth-copy p:first-of-type {
    padding-top: 18px !important;
  }
}

.home-page .perspectives-cta-euro {
  font-weight: 200 !important;
  transform: translateY(-1px) scaleX(0.72) !important;
  transform-origin: center !important;
}

/* Uniform 72px rhythm between every section on the landing page. Padding
   moves to the section itself; each inner wrapper sits flush at 0 so no
   nested padding (or leftover reveal transform) can add hidden extra gap. */
@media (min-width: 761px) {
  .home-page .perspectives-section {
    padding: 1px 0 36px !important;
  }

  .home-page .perspectives-inner {
    padding: 0 !important;
    transform: none !important;
  }

  .home-page .perspectives-cta-section {
    padding: 36px 0 72px !important;
  }

  .home-page .perspectives-cta-inner {
    padding: 0 !important;
    transform: none !important;
  }

  .home-page .practice-growth-section {
    padding-top: 0 !important;
  }

  .home-page .minimal-hero-copy p {
    font-size: 15px !important;
  }
}

/* Rebuilt clean: the two landing final-CTA buttons, byte-for-byte matched to
   the river-ai/dashboard/tools final-cta icon buttons (58px circle, #090909,
   22px glyph, same euro-glyph treatment, same hover). Legacy/duplicate rules
   for this component elsewhere in this file are superseded by this block. */
@media (min-width: 761px) {
  .home-page .perspectives-cta-actions {
    gap: clamp(40px, 5vw, 72px) !important;
  }

  .home-page .perspectives-cta-action {
    min-width: 0 !important;
    font-size: 0.82rem !important;
    letter-spacing: normal !important;
  }

  .home-page .perspectives-cta-icon {
    width: 58px !important;
    height: 58px !important;
    margin-bottom: 12px !important;
    background: #090909 !important;
  }

  .home-page .perspectives-cta-icon svg {
    width: 22px !important;
    height: 22px !important;
    stroke-width: 1.8 !important;
  }

  .home-page .perspectives-cta-euro {
    display: block !important;
    width: auto !important;
    height: auto !important;
    object-fit: initial !important;
    filter: none !important;
    mix-blend-mode: normal !important;
    font-family: "Zilla Slab", Georgia, serif !important;
    font-style: italic !important;
    font-weight: 400 !important;
    font-size: 27px !important;
    color: #fff !important;
    transform: translateY(-1px) !important;
    transform-origin: center !important;
  }

  .home-page .perspectives-cta-action:hover .perspectives-cta-icon,
  .home-page .perspectives-cta-action:focus-visible .perspectives-cta-icon {
    color: #08110a !important;
    background: #00eb1c !important;
    box-shadow: 0 13px 30px rgba(0, 235, 28, 0.18) !important;
  }
}

/* Equal heading height across the three dark cards, so shorter titles
   (like "Klarheit auf einen Blick") don't push their paragraph text up. */
@media (max-width: 760px) {
  .home-page .dark-offer-copy h3 {
    min-height: 32px !important;
  }
}
