/* Homepage narrative: one product journey, without nested presentation cards. */
.home-page--narrative {
  --story-ink: #123b34;
  --story-ink-soft: #536861;
  --story-paper: #fffefa;
  --story-ivory: #f8f8f3;
  --story-line: #dce2db;
  --home-narrative-green: #123e34;
  --home-narrative-gold: #edda9e;
}

.home-page--narrative main { background: var(--story-paper); }
.home-page--narrative main .container { max-width: 1360px; }
.home-page--narrative main :is(section, article, aside)[id] { scroll-margin-top: 120px; }
.home-page--narrative .home-calculator-ribbon__inner { min-height: 72px; padding-block: 12px; }
.home-page--narrative .story-hero {
  min-height: 0;
  padding: clamp(48px, 6vw, 88px) 24px 0;
  background: linear-gradient(115deg, #0b302d, #123e34);
}
.home-page--narrative .story-hero::before,
.home-page--narrative .story-hero__product-stage::before { content: none; }
.home-page--narrative .story-hero__grid {
  grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr);
  gap: clamp(28px, 4vw, 64px);
  padding-bottom: 52px;
}
.home-page--narrative .story-hero__copy { padding: 0; max-width: 580px; }
.home-page--narrative .story-hero h1 {
  max-width: 620px;
  font-size: clamp(2.6rem, 4.5vw, 4.5rem);
  letter-spacing: -.045em;
  line-height: 1.06;
  text-wrap: balance;
}
.home-page--narrative .story-hero h1 > span { color: var(--home-narrative-gold); }
.home-page--narrative .story-hero__lead { font-size: 1.07rem; line-height: 1.8; color: #d8e5de; }
.home-page--narrative .story-actions { gap: 14px; margin-top: 30px; }
.home-page--narrative .story-button { min-height: 52px; padding: 14px 22px; line-height: 1.4; }
.home-narrative__hero-note { max-width: 440px; margin: 22px 0 0; color: #afc7bd; font-size: .82rem; line-height: 1.65; }
.home-page--narrative .story-hero__visual { width: 100%; margin: 0; }
.home-page--narrative .story-hero__product-stage { min-height: 0; padding: 24px 52px 96px 0; }
.home-page--narrative .story-hero__phone { width: 25%; max-width: 166px; min-width: 108px; }
.home-page--narrative .story-hero__product-proof { left: 0; bottom: 20px; background: transparent; border: 0; box-shadow: none; padding: 0; max-width: 70%; backdrop-filter: none; }
.home-page--narrative .story-hero__web-window { box-shadow: 0 22px 48px #031e2b38; }
.home-page--narrative .story-hero__web-toolbar small { font-size: .58rem; }

.home-narrative__route { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid #ffffff26; }
.home-narrative__route a { display: grid; grid-template-columns: auto 1fr auto; column-gap: 16px; align-items: center; padding: 24px 26px; color: #fffefa; text-decoration: none; transition: background .2s; }
.home-narrative__route a + a { border-inline-start: 1px solid #ffffff26; }
.home-narrative__route a > span:first-child { grid-row: span 2; color: var(--home-narrative-gold); font-size: .85rem; }
.home-narrative__route a > strong { font-size: 1rem; font-weight: 600; }
.home-narrative__route a > small { grid-column: 2; margin-top: 4px; color: #b6cbc1; font-size: .77rem; }
.home-narrative__route a > .material-symbols-outlined { grid-column: 3; grid-row: 1 / 3; font-size: 21px; color: var(--home-narrative-gold); }
.home-narrative__route a:hover { background: #ffffff0a; }

.home-narrative__trust {
  padding: 80px 24px 42px;
  border-bottom: 1px solid #dce6df;
  background: linear-gradient(180deg, #f7faf8 0%, #eff5f1 100%);
}
.home-narrative__trust-heading { max-width: 920px; margin-inline: auto; text-align: center; }
.home-narrative__trust-heading .story-eyebrow { margin: 0 0 18px; color: #237a69; }
.home-narrative__trust-heading h2 { margin: 0 auto; max-width: 900px; color: var(--story-ink); font-size: clamp(2rem, 3.2vw, 3rem); font-weight: 600; letter-spacing: -.035em; line-height: 1.16; text-wrap: balance; }
.home-narrative__trust-heading h2 > span { color: #218773; }
.home-narrative__trust-intro { margin: 22px auto 0; max-width: 800px; color: var(--story-ink-soft); font-size: 1rem; line-height: 1.8; }
.home-narrative__logos { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 20px; list-style: none; padding: 0; margin: 44px 0 0; }
.home-narrative__logos li { display: grid; align-items: center; justify-items: center; min-width: 0; min-height: 160px; padding: 26px 24px; border: 1px solid #d8e3dc; border-radius: 12px; background: #fff; box-shadow: 0 6px 18px #163f3406, 0 1px 2px #163f3403; transition: border-color .2s, box-shadow .2s, transform .2s; }
.home-narrative__logos img { display: block; width: 100%; max-width: 180px; height: 100px; object-fit: contain; }
.home-narrative__logos img[src$="billig-box.png"] { max-width: 150px; }
.home-narrative__trust-proof { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 20px 38px; margin-top: 36px; padding-top: 28px; border-top: 1px solid #d4e0d7; }
.home-narrative__trust-proof p { display: flex; align-items: center; gap: 12px; margin: 0; color: #536b5d; font-size: .83rem; line-height: 1.6; }
.home-narrative__trust-proof p strong { color: var(--story-ink); font-size: 1.45rem; font-weight: 600; letter-spacing: -.035em; white-space: nowrap; }
.home-narrative__trust-proof a { display: inline-flex; align-items: center; gap: 8px; padding-inline-start: 38px; border-inline-start: 1px solid #ccd9cf; color: #346857; font-size: .85rem; font-weight: 600; text-decoration: none; }
.home-narrative__trust-proof a:hover { color: #103b31; }
.home-narrative__trust-proof a:hover > span:nth-child(2) { text-decoration: underline; text-underline-offset: 5px; }
.home-narrative__trust-proof .material-symbols-outlined { font-size: 20px; }
.home-narrative__trust-proof .material-symbols-outlined:last-child { font-size: 17px; }

@media (hover: hover) and (pointer: fine) {
  .home-narrative__logos li:hover { border-color: #8fb7a6; box-shadow: 0 12px 26px #163f340e; transform: translateY(-3px); }
}

.home-narrative__journey { padding: 100px 24px 72px; }
.home-narrative__heading { max-width: 880px; margin: 0 auto 12px; text-align: center; }
.home-narrative__heading h2,
.home-narrative__adoption h2 { margin: 0; font-size: clamp(2rem, 3.4vw, 3.25rem); line-height: 1.12; letter-spacing: -.04em; font-weight: 600; text-wrap: balance; }
.home-narrative__heading h2 { max-width: 760px; margin-inline: auto; }
.home-narrative__intro { max-width: 800px; margin: 28px auto 0; color: var(--story-ink-soft); font-size: 1rem; line-height: 1.8; text-wrap: pretty; }
.home-narrative__intro-lead { display: block; max-width: 720px; margin-inline: auto; color: #34574b; font-size: clamp(1.08rem, 1.4vw, 1.2rem); line-height: 1.65; }
.home-narrative__intro-detail { display: block; margin-top: 14px; }
.home-narrative__intro strong { color: var(--story-ink); font-weight: 600; }
.home-narrative__chapter { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); align-items: center; gap: 40px clamp(32px, 6vw, 88px); padding: 72px 0; }
.home-narrative__chapter + .home-narrative__chapter { border-top: 1px solid var(--story-line); }
.home-narrative__chapter--reverse { grid-template-columns: minmax(0, 1.18fr) minmax(0, .82fr); }
.home-narrative__chapter--reverse .home-narrative__chapter-copy { grid-column: 2; grid-row: 1; }
.home-narrative__chapter--reverse .home-narrative__media { grid-column: 1; grid-row: 1; }
.home-narrative__chapter-copy { min-width: 0; }
.home-narrative__chapter-label { display: flex; align-items: center; gap: 14px; color: #287364; font-size: .8rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; margin: 0 0 24px; }
.home-narrative__chapter-label > span { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid #d5c695; border-radius: 50%; color: #8d6a23; font-size: .73rem; letter-spacing: 0; }
.home-narrative__chapter h3 { margin: 0 0 22px; font-size: clamp(1.9rem, 2.9vw, 2.8rem); line-height: 1.13; letter-spacing: -.035em; font-weight: 600; color: var(--story-ink); }
.home-narrative__chapter-copy > p:not([class]),
.home-narrative__adoption-grid > div > p:not([class]) { margin: 0 0 24px; font-size: 1rem; line-height: 1.8; color: var(--story-ink-soft); }
.home-narrative__points { display: grid; gap: 10px; list-style: none; padding: 0; margin: 0 0 28px; color: #38564c; font-size: .92rem; line-height: 1.6; }
.home-narrative__points li { position: relative; padding-inline-start: 23px; }
.home-narrative__points li::before { content: ""; position: absolute; inset-inline-start: 2px; top: .6em; width: 6px; height: 6px; border-radius: 50%; background: #b29650; }
.home-page--narrative .home-narrative__link { display: inline-flex; align-items: center; gap: 12px; width: fit-content; max-width: 100%; padding-block: 7px; color: #146858; font-size: .94rem; font-weight: 600; line-height: 1.5; text-decoration: none; text-underline-offset: 7px; text-decoration-thickness: 1px; }
.home-page--narrative .home-narrative__link .material-symbols-outlined { flex: none; font-size: 21px; transition: transform .18s; }
.home-page--narrative .home-narrative__link:hover { color: #092f28; text-decoration: underline; }
.home-page--narrative .home-narrative__link:hover .material-symbols-outlined { transform: translateX(3px); }
.home-page--narrative .home-narrative__link--light { color: #f0dda3; }
.home-page--narrative .home-narrative__link--light:hover { color: #fff4cf; }
.home-page--narrative .home-narrative__small { margin: 18px 0 0; max-width: 440px; color: #6a7971; font-size: .79rem; line-height: 1.7; }
.home-narrative__media { min-width: 0; margin: 0; }
.home-narrative__media img { display: block; width: 100%; height: auto; }
.home-narrative__window,
.home-narrative__media > .story-browser { overflow: hidden; border: 1px solid #ccd8d0; border-radius: 14px; background: #f4f8f5; box-shadow: 0 16px 36px #163f3410; }
.home-narrative__toolbar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; min-height: 38px; padding: 8px 14px; background: #f5f7f5; border-bottom: 1px solid #dce5df; color: #52675b; font-size: .65rem; font-weight: 600; }
.home-narrative__toolbar > .material-symbols-outlined { justify-self: end; font-size: 17px; color: #6c8c7d; }
.home-narrative__dots { display: flex; gap: 5px; }
.home-narrative__dots i { width: 7px; height: 7px; background: #d2b25a; border-radius: 50%; }
.home-narrative__dots i:nth-child(2) { background: #8cb7a4; }
.home-narrative__dots i:nth-child(3) { background: #c5d9cf; }
.home-narrative__media--composite img { border-radius: 16px; }
.home-narrative__media figcaption { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 16px; padding: 18px 2px 0; color: #718078; font-size: .73rem; line-height: 1.6; }
.home-narrative__media figcaption > span:first-child { color: #3c6557; font-weight: 600; }
.home-narrative__insight { grid-column: 1 / -1; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 20px; margin-top: 4px; padding: 28px 32px; border: 1px solid #dce5dc; border-radius: 16px; background: #f1f5ef; }
.home-narrative__insight > .material-symbols-outlined { color: #2b7965; font-size: 30px; }
.home-narrative__insight h4 { margin: 0 0 8px; color: var(--story-ink); font-size: 1rem; line-height: 1.5; font-weight: 600; }
.home-narrative__insight p { max-width: 770px; margin: 0; color: var(--story-ink-soft); font-size: .88rem; line-height: 1.7; }
.home-narrative__scope { margin: -25px auto 0; max-width: 850px; color: #6b7b72; font-size: .78rem; line-height: 1.7; text-align: center; }

.home-narrative__adoption { padding: 86px 24px; background: #123e34; color: #fffefa; }
.home-narrative__adoption-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(44px, 8vw, 128px); align-items: center; }
.home-narrative__adoption h2 { color: #fffefa; margin-bottom: 24px; }
.home-narrative__adoption-grid > div > p:not([class]) { color: #c2d4c9; }
.home-narrative__fit { display: grid; gap: 22px; list-style: none; padding: 0; margin: 28px 0; }
.home-narrative__fit li { display: flex; gap: 16px; align-items: flex-start; font-size: .88rem; color: #b7cec0; line-height: 1.6; }
.home-narrative__fit .material-symbols-outlined { color: #e8d69c; font-size: 23px; margin-top: 2px; }
.home-narrative__fit strong { display: block; color: #f7faf5; font-size: .95rem; margin-bottom: 4px; font-weight: 600; }
.home-narrative__timeline { margin: 0; padding: 0; list-style: none; }
.home-narrative__timeline li { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 20px; padding: 29px 0; border-bottom: 1px solid #ffffff24; }
.home-narrative__timeline li:first-child { border-top: 1px solid #ffffff24; }
.home-narrative__timeline li > span { color: #e8d69c; font-size: .84rem; line-height: 1.7; }
.home-narrative__timeline h3 { margin: 0 0 8px; color: #f7faf5; font-size: 1.15rem; font-weight: 600; line-height: 1.35; letter-spacing: -.01em; }
.home-narrative__timeline p { margin: 0; max-width: 440px; color: #b7cec0; font-size: .92rem; line-height: 1.7; }

/* One continuous rental journey, rather than a separate grid of provider cards. */
.home-connections { padding: 92px 24px 64px; background: var(--story-paper); }
.home-connections__heading { max-width: 800px; }
.home-connections__heading h2 { margin: 0; color: var(--story-ink); font-size: clamp(2rem, 3.4vw, 3.25rem); line-height: 1.12; letter-spacing: -.04em; font-weight: 600; text-wrap: balance; }
.home-connections__heading > p:last-child { max-width: 760px; margin: 24px 0 0; color: var(--story-ink-soft); font-size: 1rem; line-height: 1.8; }
.home-connections__journey { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 42px; margin: 48px 0 40px; padding: 0; list-style: none; }
.home-connections__step { position: relative; display: flex; flex-direction: column; min-width: 0; }
.home-connections__step::before { content: ""; position: absolute; inset-block-start: 27px; inset-inline-start: 0; width: calc(100% + 42px); height: 1px; background: #d2dcd2; }
.home-connections__step:last-child::before { width: 100%; background: linear-gradient(90deg, #d2dcd2, transparent); }
.home-connections__marker { position: relative; display: flex; align-items: center; gap: 12px; width: fit-content; padding-inline-end: 16px; background: var(--story-paper); }
.home-connections__marker > .material-symbols-outlined { display: grid; place-items: center; width: 54px; height: 54px; border: 1px solid #c7d7cb; border-radius: 50%; background: #f1f6ef; color: #286754; font-size: 25px; }
.home-connections__marker > span:last-child { color: #8d6a23; font-size: .75rem; font-weight: 600; }
.home-connections__category { margin: 26px 0 12px; color: #287364; font-size: .76rem; font-weight: 700; line-height: 1.6; letter-spacing: .08em; text-transform: uppercase; }
.home-connections__step h3 { margin: 0 0 16px; color: var(--story-ink); font-size: clamp(1.4rem, 1.75vw, 1.7rem); font-weight: 600; line-height: 1.25; letter-spacing: -.025em; text-wrap: balance; }
.home-connections__description { flex: 1; margin: 0 0 26px; color: var(--story-ink-soft); font-size: .94rem; line-height: 1.8; }
.home-connections__providers { padding-top: 18px; border-top: 1px solid var(--story-line); }
.home-connections__providers > p { margin: 0 0 10px; color: #62756b; font-size: .73rem; line-height: 1.6; }
.home-connections__providers ul { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; min-height: 64px; margin: 0 0 12px; padding: 0; list-style: none; }
.home-connections__providers li { display: flex; align-items: center; justify-content: center; width: 118px; height: 58px; }
.home-connections__providers img { display: block; width: 100%; height: 100%; object-fit: contain; }
.home-connections__providers img[src$="sensorberg.svg"] { filter: brightness(0); opacity: .78; }
.home-connections__next { display: flex; align-items: center; justify-content: space-between; gap: 24px 48px; padding: 28px 32px; border: 1px solid #d6e0d3; border-inline-start: 3px solid #b99c53; border-radius: 0 12px 12px 0; background: #f3f6ee; }
.home-connections__next > div { max-width: 770px; }
.home-connections__next h3 { margin: 0 0 8px; color: var(--story-ink); font-size: 1.12rem; font-weight: 600; line-height: 1.5; }
.home-connections__next p { margin: 0; color: var(--story-ink-soft); font-size: .9rem; line-height: 1.75; }
.home-page--narrative .home-connections__next > a { flex-shrink: 0; max-width: 280px; }
.home-connections__scope { max-width: 1030px; margin: 20px 0 0; color: #65756b; font-size: .76rem; line-height: 1.8; }
html[dir="rtl"] .home-connections__category { letter-spacing: normal; }
html[dir="rtl"] .home-connections__step:last-child::before { background: linear-gradient(270deg, #d2dcd2, transparent); }
html[dir="rtl"] .home-connections__next { border-radius: 12px 0 0 12px; }

.home-page--narrative .story-pricing { padding: 90px 24px 76px; background: #f8f8f3; }
.home-page--narrative .story-pricing__heading { gap: 42px; margin-bottom: 34px; }
.home-page--narrative .story-pricing__heading h2 { max-width: 640px; font-size: clamp(2rem, 3.3vw, 3rem); }
.home-page--narrative .story-pricing__calculator { border-color: #c8d3c5; box-shadow: none; border-radius: 18px; background: #174b40; }
.home-page--narrative .story-pricing__card { box-shadow: none; border-radius: 18px; border-color: #d8e0d5; }
.home-page--narrative .story-pricing__featured { background: #123e34; }
.home-narrative__pricing-links { display: flex; justify-content: center; gap: 16px 36px; flex-wrap: wrap; padding-top: 28px; }
.home-page--narrative .home-faq-section { padding: 80px 24px; background: #fffefa; }
.home-page--narrative .home-faq-intro { position: static; }
.home-page--narrative .home-faq-intro h2 { font-size: clamp(2rem, 3vw, 2.8rem); }
.home-page--narrative .story-final { padding: 80px 24px; background: #123e34; }
.home-page--narrative .story-final::before,
.home-page--narrative .story-final::after { content: none; }
.home-page--narrative .story-final h2 { color: #fffefa; font-size: clamp(2.1rem, 3.8vw, 3.5rem); }
.home-page--narrative .story-final p:not(.story-eyebrow) { max-width: 650px; color: #c2d4c9; }
.home-page--narrative main a:focus-visible { outline: 3px solid #bc9033; outline-offset: 5px; border-radius: 4px; }
.home-page--narrative :is(.story-hero, .home-narrative__adoption, .story-final) a:focus-visible { outline-color: #f1dc98; }

/* Allow translated labels to wrap without squeezing the product imagery. */
.home-page--narrative :is(.story-button, .home-narrative__route strong, .home-narrative__chapter-label, .story-pricing__channels) { white-space: normal; overflow-wrap: anywhere; }
.home-page--narrative .story-button .material-symbols-outlined { flex-shrink: 0; }
.home-page--narrative [dir="auto"] { unicode-bidi: isolate; }
html[dir="rtl"] .home-page--narrative :is(h1, h2, h3, .story-eyebrow, .home-narrative__chapter-label) { letter-spacing: normal; }
html[dir="rtl"] .home-page--narrative :is(.story-button, .home-narrative__link, .home-narrative__route a, .story-pricing__card > a) > .material-symbols-outlined:last-child { scale: -1 1; }
html[dir="rtl"] .home-page--narrative .home-narrative__link:hover .material-symbols-outlined { transform: translateX(3px); }
html[dir="rtl"] .home-page--narrative .home-calculator-ribbon__arrow svg { transform: scaleX(-1); }
html[dir="rtl"] .home-page--narrative .story-hero__web-toolbar,
html[dir="rtl"] .home-page--narrative .story-browser__toolbar { direction: ltr; }
html[dir="rtl"] .home-page--narrative .story-hero__product-proof { direction: rtl; text-align: start; }

/* Longer localized navigation labels must fit before the wide-screen layout. */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .home-page--narrative #site-navigation .navbar-nav .nav-link { padding-inline: 4px; }
}
@media (min-width: 1200px) and (max-width: 1599.98px) {
  .home-page--narrative #site-navigation .navbar-brand img { width: 160px; }
  .home-page--narrative #site-navigation .navbar-nav .nav-link { padding-inline: 10px; font-size: .9rem; }
  .home-page--narrative #site-navigation .btn-request-demo { padding-inline: 16px; font-size: .88rem; }
}

@media (max-width: 1199.98px) {
  .home-page--narrative .story-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 30px; }
  .home-page--narrative .story-hero__web-toolbar small { display: none; }
  .home-page--narrative .story-hero__copy { max-width: none; }
  .home-page--narrative .story-hero h1 { font-size: 3.3rem; }
  .home-page--narrative .story-hero__lead { font-size: 1rem; }
  .home-page--narrative .story-hero .story-actions { align-items: flex-start; flex-direction: column; gap: 12px; }
  .home-narrative__logos { gap: 16px; }
  .home-narrative__logos li { min-height: 146px; padding: 22px 18px; }
  .home-narrative__logos img { height: 92px; }
  .home-narrative__insight { grid-template-columns: auto minmax(0, 1fr); }
  .home-narrative__insight > a { grid-column: 2; }
}

@media (max-width: 991.98px) {
  .home-page--narrative .story-hero { padding-top: 48px; }
  .home-page--narrative .story-hero__grid { grid-template-columns: 1fr; max-width: 760px; padding-bottom: 28px; }
  .home-page--narrative .story-hero__copy { text-align: center; }
  .home-page--narrative .story-hero h1 { max-width: 650px; margin-inline: auto; font-size: clamp(2.6rem, 6vw, 3.6rem); }
  .home-page--narrative .story-hero__lead { max-width: 590px; margin-inline: auto; }
  .home-page--narrative .story-hero .story-actions { flex-direction: row; justify-content: center; }
  .home-narrative__hero-note { margin-inline: auto; }
  .home-page--narrative .story-hero__product-stage { padding-top: 12px; padding-bottom: 88px; }
  .home-page--narrative .story-hero__product-proof { text-align: start; }
  .home-narrative__route a { padding: 22px 14px; column-gap: 10px; }
  .home-narrative__route a > strong { font-size: .87rem; }
  .home-narrative__route a > .material-symbols-outlined { display: none; }
  .home-narrative__trust { padding-top: 64px; }
  .home-narrative__logos { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 640px; margin-inline: auto; }
  .home-narrative__logos li { min-height: 152px; }
  .home-narrative__chapter, .home-narrative__chapter--reverse { grid-template-columns: 1fr; gap: 32px; max-width: 780px; margin-inline: auto; padding-block: 48px; }
  .home-narrative__chapter--reverse .home-narrative__chapter-copy,
  .home-narrative__chapter--reverse .home-narrative__media { grid-column: auto; grid-row: auto; }
  .home-narrative__chapter h3 br { display: none; }
  .home-narrative__chapter-copy { max-width: 620px; }
  .home-narrative__chapter h3 { max-width: 530px; font-size: 2.3rem; }
  .home-narrative__chapter-label { margin-bottom: 20px; }
  .home-narrative__scope { margin-top: -10px; }
  .home-narrative__adoption-grid { grid-template-columns: 1fr; gap: 40px; }
  .home-narrative__adoption-grid > div { max-width: 680px; }
  .home-narrative__timeline { display: grid; grid-template-columns: 1fr 1fr; gap: 0 36px; }
  .home-narrative__timeline li:nth-child(2) { border-top: 1px solid #ffffff24; }
  .home-connections__journey { grid-template-columns: 1fr; gap: 0; max-width: 760px; }
  .home-connections__step { padding-inline-start: 84px; padding-bottom: 40px; }
  .home-connections__step:last-child { padding-bottom: 0; }
  .home-connections__step::before,
  .home-connections__step:last-child::before { inset-block-start: 0; inset-inline-start: 27px; width: 1px; height: 100%; background: #d2dcd2; }
  .home-connections__step:last-child::before,
  html[dir="rtl"] .home-connections__step:last-child::before { background: linear-gradient(#d2dcd2, transparent); }
  .home-connections__marker { position: absolute; inset-inline-start: 0; top: 0; flex-direction: column; gap: 8px; padding: 0 0 14px; }
  .home-connections__category { margin-top: 0; }
  .home-connections__description { margin-bottom: 20px; }
  .home-connections__step h3 { font-size: 1.65rem; }
  .home-connections__next { align-items: flex-start; flex-direction: column; gap: 16px; }
}

@media (max-width: 575.98px) {
  .home-page--narrative main .container { padding-inline: 0; }
  .home-page--narrative .story-hero { padding: 38px 20px 0; }
  .home-page--narrative .story-hero__grid { gap: 28px; }
  .home-page--narrative .story-hero__copy { text-align: start; }
  .home-page--narrative .story-hero h1 { font-size: clamp(2.5rem, 9.7vw, 3.2rem); }
  .home-page--narrative .story-hero .story-actions { display: grid; grid-template-columns: 1fr; }
  .home-page--narrative .story-hero__lead { margin-top: 22px; font-size: 1rem; }
  .home-page--narrative .story-hero .story-eyebrow { font-size: .68rem; }
  .home-page--narrative .story-hero__product-stage { min-height: 0; padding: 10px 38px 98px 0; }
  .home-page--narrative .story-hero__phone { width: 28%; min-width: 94px; bottom: 8px; }
  .home-page--narrative .story-hero__product-proof { bottom: 24px; max-width: 65%; }
  .home-page--narrative .story-hero__web-toolbar strong { font-size: .52rem; }
  .home-narrative__route { grid-template-columns: 1fr; }
  .home-narrative__route a { grid-template-columns: 24px 1fr auto; padding: 17px 2px; gap: 5px 12px; }
  .home-narrative__route a + a { border-inline-start: 0; border-top: 1px solid #ffffff26; }
  .home-narrative__route a > strong { font-size: .9rem; }
  .home-narrative__route a > small { font-size: .72rem; }
  .home-narrative__route a > .material-symbols-outlined { display: block; }
  .home-narrative__trust { padding: 52px 20px 30px; }
  .home-narrative__trust-heading h2 { font-size: clamp(1.8rem, 7vw, 2.25rem); }
  .home-narrative__trust-intro { margin-top: 20px; font-size: .92rem; line-height: 1.75; }
  .home-narrative__logos { gap: 12px; margin-top: 30px; }
  .home-narrative__logos li { min-height: 124px; padding: 18px 14px; border-radius: 10px; }
  .home-narrative__logos img { height: 86px; }
  .home-narrative__trust-proof { flex-direction: column; gap: 16px; margin-top: 28px; padding-top: 22px; }
  .home-narrative__trust-proof p { max-width: 300px; font-size: .76rem; }
  .home-narrative__trust-proof a { border: 0; padding-inline-start: 0; font-size: .8rem; }
  .home-narrative__journey { padding: 58px 20px 48px; }
  .home-narrative__heading { text-align: start; margin-bottom: 0; }
  .home-narrative__intro { font-size: .96rem; margin-top: 22px; line-height: 1.75; }
  .home-narrative__intro-lead { font-size: 1.08rem; }
  .home-narrative__intro-detail { margin-top: 12px; }
  .home-narrative__chapter h3 { font-size: 2rem; }
  .home-narrative__chapter-copy > p:not([class]) { font-size: .96rem; }
  .home-narrative__insight { grid-template-columns: 1fr; gap: 12px; padding: 24px; }
  .home-narrative__insight > a { grid-column: 1; }
  .home-narrative__media figcaption { display: block; padding-top: 14px; }
  .home-narrative__media figcaption span { display: block; }
  .home-narrative__adoption { padding: 58px 20px; }
  .home-connections { padding: 58px 20px 42px; }
  .home-connections__heading > p:last-child { font-size: .96rem; }
  .home-connections__journey { margin-top: 36px; margin-bottom: 32px; }
  .home-connections__step { padding-inline-start: 62px; }
  .home-connections__marker > .material-symbols-outlined { width: 42px; height: 42px; font-size: 22px; }
  .home-connections__step::before,
  .home-connections__step:last-child::before { inset-inline-start: 21px; }
  .home-connections__category { font-size: .7rem; }
  .home-connections__step h3 { font-size: 1.45rem; }
  .home-connections__providers ul { gap: 8px 14px; }
  .home-connections__providers li { width: min(100px, calc((100% - 14px) / 2)); height: 52px; }
  .home-connections__next { padding: 24px; }
  .home-narrative__timeline { grid-template-columns: 1fr; }
  .home-narrative__timeline li:nth-child(2) { border-top: 0; }
  .home-page--narrative .story-pricing,
  .home-page--narrative .home-faq-section,
  .home-page--narrative .story-final { padding: 58px 20px; }
  .home-page--narrative .story-pricing__heading { gap: 8px; }
  .home-page--narrative .story-pricing__calculator-intro,
  .home-page--narrative .story-pricing__capacity-control,
  .home-page--narrative .story-pricing__annual-saving { padding: 22px; }
  .home-narrative__pricing-links { align-items: flex-start; flex-direction: column; gap: 6px; }
  .home-page--narrative .story-final .home-narrative__link { margin-inline: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .home-page--narrative .home-narrative__link .material-symbols-outlined,
  .home-narrative__route a,
  .home-narrative__logos li { transition: none; }
  .home-narrative__logos li:hover { transform: none; }
}
