/* The opening is a composition on the page, rather than another framed UI. */
.hero-opening { grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); align-items: center; gap: 80px; }
.hero h1 { font-size: clamp(48px,5.4vw,76px); line-height: 1.12; }
.hero p.lede { max-width: 42ch; }
.hero .journey-map { background: transparent; border: 0; box-shadow: none; padding: 0; margin-top: 60px; color: var(--ink); }
.journey-map-heading { display: none; }
.hero .cloud-flow-art { margin: 0; }
.hero .cloud-flow-canvas { height: 340px; }
.hero .cloud-flow-art figcaption { color: var(--ink-soft); border-color: var(--line-2); padding: 12px 0 24px; font-size: 12px; }
.hero .journey-map-stages { padding-block: 20px; }
.hero .journey-map-stages button { color: var(--ink); }
.hero .journey-map-number { background: transparent; border-color: #c4cbe5; color: var(--blue); }
.hero .journey-map-stages button:focus-visible { outline-color: var(--blue); }
.hero .proof { padding-top: 20px; }
/* Genuine marks; a continuous strip pauses for pointer, touch, and keyboard use. */
section.logos { padding-top: 44px; }
.logos .customer-logo-heading { margin-bottom: 20px; }
.customer-carousel { overflow: hidden; padding-block: 18px; }
.customer-carousel-track { display: flex; width: max-content; }
.customer-carousel-group { display: flex; flex-shrink: 0; align-items: center; gap: 64px; padding-right: 64px; }
.customer-logo-item { display: flex; align-items: center; justify-content: center; width: 140px; min-height: 64px; flex-shrink: 0; }
section.logos .customer-logo-item img { width: 140px; height: 44px; max-width: 140px; object-fit: contain; filter: none; opacity: 1; mix-blend-mode: normal; }
.customer-carousel.is-running .customer-carousel-track { animation: customer-roster-drift 65s linear infinite; }
.customer-carousel:hover .customer-carousel-track,
.customer-carousel:focus-within .customer-carousel-track,
.customer-carousel.is-touched .customer-carousel-track { animation-play-state: paused; }
@keyframes customer-roster-drift { to { transform: translateX(-50%); } }
/* The provider marks stay on one line at every viewport size. */
.product-story .marketplace-coverage { margin: 48px 0 0; display: block; padding: 32px 0 8px; }
.product-story .marketplace-coverage > div { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); align-items: center; gap: clamp(16px,4vw,64px); max-width: 900px; margin-inline: auto; }
.product-story .marketplace-coverage > div > :is(a,span) { display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 72px; padding: 4px; }
.product-story .marketplace-coverage img { display: block; max-width: 100%; height: auto; object-fit: contain; }
.product-story .coverage-aws img { width: clamp(44px,6vw,84px); }
.product-story .coverage-azure img { width: clamp(34px,5vw,66px); }
.product-story .coverage-google img { width: clamp(38px,5vw,70px); }
.product-story .coverage-redhat img { width: clamp(66px,11vw,144px); }
/* Scroll distance is distributed equally among four product stages. */
.product-scroll-sequence { position: relative; margin-top: 36px; }
.product-scroll-sequence.is-scroll-sequence { height: var(--product-sequence-height); }
.product-scroll-sequence.is-scroll-sequence .feature-explorer { position: sticky; top: 88px; margin-top: 0; padding-block: 12px 24px; background: #0d1436; }
.product-scroll-sequence.is-scroll-sequence .fe-tabs { margin-bottom: 28px; }
.product-scroll-sequence.is-scroll-sequence .fe-panels { min-height: 0; height: 520px; }
.product-scroll-sequence.is-scroll-sequence .fe-panel { grid-template-columns: minmax(0,.85fr) minmax(0,1.25fr); gap: 40px; align-items: center; }
.product-scroll-sequence.is-scroll-sequence .fe-panel-text { display: block; }
.product-scroll-sequence.is-scroll-sequence .fe-panel-text h3 { margin: 16px 0; font-size: clamp(26px,2.5vw,34px); }
.product-scroll-sequence.is-scroll-sequence .fe-panel-text p { margin: 0 0 16px; font-size: 15px; line-height: 1.65; }
.product-scroll-sequence.is-scroll-sequence .feature-details { margin-top: 20px; }
.product-scroll-sequence.is-scroll-sequence .real-product-view { min-height: 0; height: 500px; padding: 20px; }
.product-scroll-sequence.is-scroll-sequence .real-product-view > :is(img,video) { min-height: 0; max-height: 420px; width: 100%; object-fit: contain; }
.product-scroll-sequence.is-scroll-sequence .offer-product-view > img { width: auto; max-width: 100%; }
.product-scroll-sequence.is-scroll-sequence .program-path { margin-bottom: 16px; }
.product-scroll-sequence.is-scroll-sequence .program-path li { padding: 12px; }
.product-scroll-sequence.is-scroll-sequence .program-path h4 { font-size: 17px; margin: 8px 0; }
.product-scroll-sequence.is-scroll-sequence .program-path p { font-size: 12px; }
/* Each chapter gets its own reading space, including the shorter account step. */
.partner-chapter { min-height: 0; padding-block: 40px 64px; }
.partner-working-sheet { padding: 24px; }
.partner-working-sheet h4 { margin-bottom: 18px; }
.working-provider { margin-top: 14px; }
.working-checklist li { margin-top: 5px; }
.working-document-note { margin-top: 18px; }
/* One source branches into a choice of CRM. The marks retain their proportions. */
.working-crm-route { display: grid; grid-template-columns: minmax(0,1fr) 28px minmax(0,1fr); gap: 0; align-items: center; margin: 20px 0 28px; }
.working-crm-route .crm-route-source { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 16px 10px; background: #fff; border: 1px solid #d9deee; border-radius: 6px; }
.crm-route-source img { width: 130px; height: auto; max-width: 100%; object-fit: contain; }
.crm-route-source > span { font-size: 10px; line-height: 1.6; text-align: center; color: var(--ink-soft); }
.working-crm-route .crm-route-branches { display: block; position: relative; height: 92px; }
.crm-route-branches::before { content: ''; position: absolute; top: 50%; left: 0; width: 50%; border-top: 1px solid #7c88bb; }
.crm-route-branches span { position: absolute; right: 0; width: 50%; height: 35%; border-left: 1px solid #7c88bb; }
.crm-route-branches span:first-child { top: 15%; border-top: 1px solid #7c88bb; border-radius: 5px 0 0; }
.crm-route-branches span:last-child { bottom: 15%; border-bottom: 1px solid #7c88bb; border-radius: 0 0 0 5px; }
.working-crm-route .crm-route-destinations { display: grid; gap: 4px; }
.crm-route-destinations > div { display: flex; align-items: center; justify-content: flex-start; gap: 9px; padding: 12px 10px; background: #fff; border: 1px solid #d9deee; border-radius: 6px; font-size: 11px; }
.crm-route-destinations img { flex-shrink: 0; width: 26px; height: 24px; object-fit: contain; }
.crm-route-or { text-align: center; font-size: 10px; color: var(--ink-soft); }
@media(max-height:850px) and (min-width:901px) {
  .product-scroll-sequence.is-scroll-sequence .fe-panels { height: 450px; }
  .product-scroll-sequence.is-scroll-sequence .real-product-view { height: 430px; }
  .product-scroll-sequence.is-scroll-sequence .real-product-view > :is(img,video) { max-height: 350px; }
}
@media(max-width:900px) {
  .hero-opening { grid-template-columns: 1fr; gap: 28px; }
  .hero-intro { display: block; }
  .hero .ctas { margin-top: 24px; }
  .hero .journey-map { margin-top: 40px; }
  .hero .cloud-flow-canvas { height: 350px; }
  .hero h1 { font-size: clamp(40px,7vw,60px); }
  .partner-chapter { min-height: 0; padding-block: 32px 52px; }
  .product-scroll-sequence.is-scroll-sequence .feature-explorer { top: 72px; padding-top: 12px; }
  .product-scroll-sequence.is-scroll-sequence .fe-tabs { margin-bottom: 16px; }
  .product-scroll-sequence.is-scroll-sequence .fe-panels { height: 590px; margin-top: 0; }
  .product-scroll-sequence.is-scroll-sequence .fe-panel { grid-template-columns: 1fr; gap: 20px; }
  .product-scroll-sequence.is-scroll-sequence .fe-panel-text h3 { font-size: 25px; margin: 10px 0; }
  .product-scroll-sequence.is-scroll-sequence .fe-panel-text p { font-size: 14px; margin-bottom: 8px; }
  .product-scroll-sequence.is-scroll-sequence .feature-details { margin-top: 10px; }
  .product-scroll-sequence.is-scroll-sequence .real-product-view { height: 290px; padding: 14px; }
  .product-scroll-sequence.is-scroll-sequence .real-product-view > :is(img,video) { max-height: 225px; }
  .product-scroll-sequence.is-scroll-sequence .program-path { display: block; padding: 16px; }
  .product-scroll-sequence.is-scroll-sequence .program-path > figcaption { font-size: 12px; }
  .product-scroll-sequence.is-scroll-sequence .program-path > figcaption > span { display: none; }
  .product-scroll-sequence.is-scroll-sequence .program-path-clouds { margin-top: 14px; padding-bottom: 12px; gap: 16px; }
  .product-scroll-sequence.is-scroll-sequence .program-path-clouds > span { font-size: 11px; }
  .product-scroll-sequence.is-scroll-sequence .program-path ol { grid-template-columns: 1fr; gap: 8px; margin: 12px 0; }
  .product-scroll-sequence.is-scroll-sequence .program-path li { padding: 0; display: grid; grid-template-columns: 24px 1fr; gap: 3px 8px; }
  .product-scroll-sequence.is-scroll-sequence .program-path h4 { font-size: 14px; margin: 0; }
  .product-scroll-sequence.is-scroll-sequence .program-path li p { grid-column: 2; font-size: 11px; margin: 0; }
  .product-scroll-sequence.is-scroll-sequence .program-boundary { font-size: 10px; padding-top: 10px; }
  .product-scroll-sequence.is-scroll-sequence .crm-handoff { display: none; }
}
@media(max-width:600px) {
  .hero > .container { width: calc(100% - 48px); }
  .hero h1 { font-size: clamp(34px,11vw,44px); }
  .hero .journey-map-stages strong { font-size: 12px; }
  .customer-carousel-group { gap: 32px; padding-right: 32px; }
  .customer-logo-item,section.logos .customer-logo-item img { width: 120px; }
  .customer-logo-heading { flex-direction: column; gap: 8px; }
  .working-crm-route { grid-template-columns: minmax(0,1fr) 24px minmax(0,1fr); }
  .crm-route-destinations > div { padding: 10px 6px; gap: 5px; font-size: 10px; }
}
@media(prefers-reduced-motion:reduce) {
  .customer-carousel { overflow-x: auto; }
  .customer-carousel.is-running .customer-carousel-track { animation: none; transform: none; }
  .customer-carousel-group[aria-hidden] { display: none; }
  .customer-logo-item img { transition: none; }
}
.product-tour-skip { display: inline-flex; align-items: center; min-height: 36px; margin-top: 8px; font-size: 12px; color: #c1d3ef; text-decoration: underline; text-underline-offset: 4px; }
.product-tour-skip[hidden] { display: none; }
#after-product-tour { scroll-margin-top: 100px; }

.working-crm-route .crm-route-source img { width: 130px; max-width: 100%; height: auto; }
.working-crm-route .crm-route-destinations { color: var(--ink); }
@media(max-width:900px) {
  .working-crm-route .crm-route-source { color: var(--ink); }
  .working-crm-route .crm-route-destinations > div { flex-direction: row; }
}
@media(max-width:900px) {
  .partner-working-sheet { padding: 0; }
  .working-crm-route .crm-route-source img { width: 108px; }
}
@media(max-width:900px) { .crm-route-or { color: #e1e6f5; } }
@media(min-width:901px) {
  .partner-working-sheet h4 { font-size: 24px; line-height: 1.25; }
  .working-brief > div { padding-block: 10px; }
}
@media(min-width:901px) and (max-height:850px) {
  .partner-story-visual { top: 84px; padding: 20px; }
  .partner-visual-heading { margin-bottom: 14px; }
  .partner-working-sheet { padding: 20px; }
  .partner-working-sheet h4 { font-size: 22px; margin-bottom: 14px; }
  .working-document-type { display: none; }
  .working-crm-route { margin-block: 12px 20px; }
  .partner-visual-progress { margin-top: 18px; }
}

.partner-focus-checks { margin: 24px 0 12px; padding: 0; list-style: none; }
.partner-focus-checks li { color: var(--ink-soft); font-size: 14px; line-height: 1.75; padding: 12px 0; border-top: 1px solid var(--line-2); }
.partner-focus-checks strong { color: var(--ink); font-weight: 500; }
@media(min-width:901px) {
  [data-story-sheet="accounts"] .working-account dl > div { grid-template-columns: 64px minmax(0,1fr); gap: 14px; margin-top: 14px; }
}
@media(max-width:900px) {
  [data-story-sheet="accounts"] .working-account dl > div { display: grid; grid-template-columns: 54px minmax(0,1fr); margin-top: 7px; }
  .partner-focus-checks { margin-top: 16px; }
  .partner-focus-checks li { font-size: 13px; padding-block: 10px; }
}

.partner-chapter:last-child { min-height: var(--story-end-min,0px); }
.journey-stage-short { display: none; }
.cosell-action-flow { list-style: none; margin: 0; padding: 0; }
.cosell-action-flow li { display: grid; grid-template-columns: 28px minmax(0,1fr); column-gap: 12px; position: relative; padding-bottom: 22px; }
.cosell-action-flow li:last-child { padding-bottom: 0; }
.cosell-action-flow li:not(:last-child)::before { content: ''; position: absolute; top: 28px; bottom: 0; left: 13px; border-left: 1px solid #c5cce3; }
.cosell-action-number { display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid #bcc5e1; border-radius: 50%; font-size: 11px; color: var(--blue); }
.cosell-action-flow strong { display: block; font-size: 14px; font-weight: 500; line-height: 1.55; color: var(--ink); }
.cosell-action-flow p { margin: 5px 0 0; font-size: 12px; line-height: 1.65; color: var(--ink-soft); }
@media(max-width:900px) {
  .cosell-action-flow li { grid-template-columns: 23px minmax(0,1fr); gap: 10px; padding-bottom: 12px; }
  .cosell-action-number { width: 23px; height: 23px; border-color: #586c9b; color: var(--cyan); font-size: 10px; }
  .cosell-action-flow li:not(:last-child)::before { top: 23px; left: 11px; border-color: #465779; }
  .cosell-action-flow strong { color: #fff; font-size: 13px; }
  .cosell-action-flow p { color: #e1e6f5; font-size: 12px; margin-top: 2px; line-height: 1.55; }
}
@media(max-width:600px) {
  .hero > .container { display: flex; flex-direction: column; }
  .hero-opening { order: 0; }
  .hero .journey-map { display: contents; }
  .hero .journey-map-stages { order: 1; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; width: 100%; padding-block: 24px 12px; }
  .hero .journey-map-stages button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 9px; min-height: 64px; padding: 0; text-align: center; }
  .hero .journey-map-stages strong { font-size: 12px; font-weight: 500; line-height: 1.4; white-space: nowrap; }
  .hero .journey-map-number { width: 27px; height: 27px; font-size: 10px; }
  .journey-stage-full { display: none; }
  .journey-stage-short { display: inline; }
  .hero .cloud-flow-art { order: 2; margin-top: 24px; }
  .hero .proof { order: 3; }
}
@media(max-width:360px) { .hero .journey-map-stages strong { font-size: 11px; } }
.partner-example-note + p { margin-top: 24px; }
/* Separate journey navigation from customer evidence, with one clear rhythm. */
@media(min-width:601px) {
  .hero .journey-map-stages { padding-block: 24px 28px; gap: 24px; }
  .hero .journey-map-stages strong { font-size: 14px; line-height: 1.45; }
}
.hero .proof { margin-top: 0; padding-block: 36px; border-top: 1px solid var(--line-2); border-bottom: 0; gap: 0; }
.hero .proof-stat { padding-inline: 36px; }
.hero .proof-stat:first-child { padding-left: 0; }
.hero .proof-stat:last-child { padding-right: 0; }
.hero .proof-stat + .proof-stat { border-left: 1px solid var(--line-2); }
.hero .proof-n { font-size: clamp(30px,3vw,42px); line-height: 1.15; }
.hero .proof-context { margin-top: 12px; line-height: 1.6; }
@media(max-width:600px) {
  .hero .proof { border-top: 0; padding-block: 28px 12px; }
  .hero .proof-stat { padding-inline: 12px; }
  .hero .proof-n { font-size: clamp(24px,6.7vw,30px); }
  .hero .proof-context { margin-top: 8px; font-size: 11px; max-width: 13ch; }
}
@media(max-width:600px) {
  .hero .proof-stat { padding-inline: 8px; }
  .hero .proof-n { font-size: clamp(20px,6vw,28px); }
}
/* Desktop tells the promise and shows the flow in one shared composition. */
@media(min-width:1101px) {
  .hero > .container { display: grid; grid-template-columns: minmax(0,.92fr) minmax(0,1.15fr); column-gap: 56px; align-items: center; }
  .hero-opening, .hero .journey-map { display: contents; }
  .hero-title { grid-column: 1; grid-row: 1; align-self: end; }
  .hero-intro { grid-column: 1; grid-row: 2; align-self: start; margin-top: 24px; display: block; }
  .hero h1 { font-size: clamp(48px,4.4vw,64px); line-height: 1.12; }
  .hero p.lede { max-width: 40ch; }
  .hero .ctas { margin-top: 24px; }
  .hero .cloud-flow-art { grid-column: 2; grid-row: 1 / span 2; align-self: center; margin: 0; min-width: 0; }
  .hero .cloud-flow-canvas { height: 470px; }
  .hero .cloud-flow-art figcaption { border: 0; padding: 12px 12px 0; max-width: 46ch; margin-inline: auto; text-align: center; font-size: 11px; line-height: 1.6; }
  .hero .journey-map-stages { grid-column: 1 / -1; grid-row: 3; margin-top: 40px; border-top: 1px solid var(--line-2); }
  .hero .proof { grid-column: 1 / -1; grid-row: 4; }
}

/* Original brand colours, including mobile; logo displays are informational. */
.product-story .marketplace-coverage > div > span { background: #fbf9f4; border-radius: 8px; padding: 12px; }
.product-story .marketplace-coverage img { filter: none; }
.working-provider:first-of-type img { filter: none; }
@media(max-width:900px) {
  .partner-working-sheet .working-provider:first-of-type img,
  .partner-working-sheet .working-account img[src*="logo-aws"],
  .partner-working-sheet .crm-route-source img { filter: none; background: #fbf9f4; padding: 6px; border-radius: 4px; box-sizing: content-box; }
}
@media(max-width:600px) {
  .product-story .marketplace-coverage > div { gap: 10px; }
  .product-story .marketplace-coverage > div > span { min-height: 62px; padding: 9px; }
}