:root {
  --navy: #0a1539;
  --ink: #131b37;
  --muted: #55617d;
  --paper: #ffffff;
  --line: #dce2ed;
  --purple: #8c52ff;
  --blue: #0599ef;
  --green: #0cab10;
  --lavender: #f5f0ff;
  --sky: #eef9ff;
  --mint: #effbf0;
  --heading: 'DM Sans', Arial, sans-serif;
  --sans: 'Inter', Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 6.25rem; }
body { background: var(--paper); color: var(--ink); font-family: var(--sans); font-size: 16px; line-height: 1.55; margin: 0; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--heading); font-weight: 600; letter-spacing: -.02em; line-height: 1.05; }
h1 { font-size: clamp(3.1rem, 5vw, 5.5rem); margin-bottom: 1.5rem; max-width: 730px; }
h2 { font-size: clamp(2.35rem, 3.75vw, 4.1rem); margin-bottom: 1.35rem; }
h3 { font-size: 1.22rem; margin-bottom: .65rem; }

.sr-only { border: 0; clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; white-space: nowrap; width: 1px; }
.skip-link { background: #fff; border: 1px solid var(--purple); border-radius: .25rem; color: var(--navy); font-weight: 700; left: 1rem; padding: .7rem 1rem; position: fixed; top: -4rem; z-index: 100; }
.skip-link:focus { top: 1rem; }

.site-header { backdrop-filter: blur(12px); background: rgba(255, 255, 255, .95); border-bottom: 1px solid rgba(19, 27, 55, .10); position: sticky; top: 0; z-index: 20; }
.nav-shell { align-items: center; display: flex; gap: 26px; justify-content: space-between; margin: auto; max-width: 1240px; min-height: 84px; padding: 0 32px; }
.brand { align-items: center; display: flex; min-width: 92px; }
.brand img { height: 74px; object-fit: contain; object-position: center; width: 74px; }
.brand-name { color: var(--ink); display: flex; flex-direction: column; font-size: .87rem; font-weight: 800; letter-spacing: -.055em; line-height: .92; text-transform: uppercase; }
.brand-name strong { color: var(--purple); font-size: 1.25rem; font-weight: 800; }
.brand-name span { color: #2755d9; font-size: 1rem; letter-spacing: -.06em; }
.site-nav { align-items: center; display: flex; gap: 24px; margin-left: auto; }
.site-nav > a, .stage-nav-menu summary { border-bottom: 2px solid transparent; color: #26304c; cursor: pointer; font-size: .88rem; font-weight: 600; list-style: none; padding: .5rem 0; }
.site-nav > a:hover, .site-nav > a.active, .stage-nav-menu summary:hover, .stage-nav-menu[open] summary { border-color: var(--purple); color: var(--purple); }
.stage-nav-menu { position: relative; }
.stage-nav-menu summary { align-items: center; display: flex; gap: .38rem; }
.stage-nav-menu summary::-webkit-details-marker { display: none; }
.stage-nav-menu summary span { font-size: .9rem; line-height: 1; transition: transform .18s ease; }
.stage-nav-menu[open] summary span { transform: rotate(180deg); }
.stage-nav-panel { background: #fff; border: 1px solid #e0e5f0; box-shadow: 0 16px 32px rgba(21, 34, 76, .12); display: grid; gap: 0; left: -22px; min-width: 315px; padding: 10px; position: absolute; top: calc(100% + 13px); z-index: 10; }
.stage-nav-panel a { align-items: center; border-bottom: 0; color: #26304c; display: flex; font-size: .83rem; font-weight: 600; gap: 11px; padding: 10px 11px; }
.stage-nav-panel a:hover { background: #f5f2ff; color: #4d2da5; }
.stage-nav-panel a span { color: var(--purple); font-size: .66rem; font-weight: 800; letter-spacing: .08em; min-width: 20px; }
.stage-nav-panel .stage-nav-overview { border-bottom: 1px solid #e5e7f0; color: #4d2da5; margin-bottom: 4px; padding-bottom: 13px; }
.stage-nav-panel .stage-nav-overview span { margin-left: auto; min-width: auto; }
.stage-nav-panel .stage-nav-subitem { color: #64708a; font-size: .78rem; margin: -4px 0 3px 31px; padding-top: 4px; }
.library-nav-panel { min-width: 292px; }
.stage-nav-panel .library-nav-soon { color: #75809a; display: block; font-size: .72rem; font-weight: 600; line-height: 1.38; margin: 6px 8px 4px 31px; }
.menu-toggle { background: transparent; border: 0; display: none; padding: .5rem; }
.menu-toggle span:not(.sr-only) { background: var(--navy); display: block; height: 2px; margin: 4px 0; width: 23px; }

.button { align-items: center; border: 0; cursor: pointer; display: inline-flex; font-family: var(--sans); font-size: .95rem; font-weight: 700; gap: .55rem; justify-content: center; line-height: 1; padding: 1rem 1.2rem; text-align: center; transition: transform .18s ease, background .18s ease; }
.button:active { transform: scale(.98); }
.button-primary { background: linear-gradient(105deg, var(--purple), var(--blue)); box-shadow: 0 11px 25px rgba(92, 82, 190, .16); color: #fff; }
.button-primary:hover { background: linear-gradient(105deg, #7944e5, #0588d5); }
.button-small { font-size: .82rem; padding: .8rem 1rem; }

.section { padding: 110px max(32px, calc((100% - 1180px) / 2)); }
.section-dark { background: #fff; color: var(--ink); }

.hero { background: #fff; border-bottom: 1px solid var(--line); overflow: hidden; padding: 105px max(32px, calc((100% - 1180px) / 2)) 115px; position: relative; }
.hero::before { background: radial-gradient(circle, rgba(140, 82, 255, .13) 0, rgba(140, 82, 255, .04) 38%, transparent 70%); content: ''; height: 700px; position: absolute; right: -260px; top: -220px; width: 700px; }
.hero::after { background: radial-gradient(circle, rgba(5, 153, 239, .10) 0, transparent 66%); bottom: -370px; content: ''; height: 650px; left: -300px; position: absolute; width: 650px; }
.hero-grid { align-items: center; display: grid; gap: 72px; grid-template-columns: 1.05fr .95fr; margin: auto; max-width: 1180px; min-height: 500px; position: relative; }
.eyebrow { color: var(--purple); font-size: .73rem; font-weight: 800; letter-spacing: .13em; margin: 0 0 1rem; text-transform: uppercase; }
.eyebrow.light { color: var(--blue); }
.eyebrow.blue { color: var(--blue); }
.eyebrow.green { color: var(--green); }
.eyebrow.purple { color: var(--purple); }
.hero-lead { color: var(--muted); font-size: 1.15rem; max-width: 620px; }
.hero-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 26px; margin: 2rem 0 1.4rem; }
.text-link { color: var(--blue); font-size: .93rem; font-weight: 700; }
.text-link.light { color: #215cc5; }
.text-link.dark { color: #3f2ca9; }
.text-link:hover, .stage a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em; }
.hero-note { color: #65708d; font-size: .82rem; max-width: 520px; }

.hero-visual { height: 480px; min-width: 0; position: relative; }
.orb { border-radius: 50%; filter: blur(.5px); position: absolute; }
.orb-one { background: rgba(140, 82, 255, .17); height: 290px; right: 10px; top: 43px; width: 290px; }
.orb-two { background: rgba(5, 153, 239, .15); bottom: 15px; height: 170px; left: 28px; width: 170px; }
.journey-card { background: rgba(255, 255, 255, .96); border: 1px solid rgba(140, 82, 255, .18); box-shadow: 0 18px 44px rgba(39, 47, 108, .15); color: var(--ink); display: flex; flex-direction: column; gap: .32rem; padding: 21px; position: absolute; width: 245px; }
.journey-card strong { font-size: .92rem; }
.journey-card span:last-child { color: #5f6c88; font-size: .74rem; line-height: 1.42; }
.card-number { color: var(--purple); font-size: .68rem; font-weight: 800; letter-spacing: .1em; }
.journey-book { left: 25px; top: 47px; }
.journey-method { right: 5px; top: 187px; }
.journey-impact { bottom: 11px; left: 100px; }
.journey-line { border-left: 1px solid rgba(83, 105, 200, .38); height: 95px; position: absolute; transform: rotate(-35deg); }
.line-one { left: 256px; top: 112px; }
.line-two { right: 239px; top: 266px; transform: rotate(28deg); }
.hero-mark { align-items: center; background: linear-gradient(135deg, var(--purple), var(--blue)); border: 5px solid #fff; border-radius: 50%; bottom: 67px; box-shadow: 0 8px 20px rgba(71, 92, 207, .22); color: #fff; display: flex; font-size: .65rem; font-weight: 800; height: 53px; justify-content: center; letter-spacing: .06em; position: absolute; right: 65px; width: 53px; }

.thesis-band { background: linear-gradient(90deg, #fbf9ff 0%, #f3faff 48%, #f9fcff 100%); border-bottom: 1px solid #e3eaf7; color: #28284b; font-family: var(--heading); font-size: clamp(1.45rem, 2.25vw, 2.3rem); font-weight: 600; line-height: 1.35; padding: 72px max(32px, calc((100% - 980px) / 2)); text-align: center; }
.thesis-band p { margin: 0 auto; max-width: 980px; }
.trust-badge-band { background: #fff; border-bottom: 1px solid #e7ebf2; padding: 28px max(24px, calc((100% - 980px) / 2)); }
.trust-badge-wrap { margin: 0 auto; max-width: 980px; }
.trust-badge-frame { border: 0; display: block; height: 205px; overflow: hidden; width: 100%; }
.section-heading { max-width: 675px; }
.section-heading.centered { margin: 0 auto 58px; text-align: center; }
.section-heading p:not(.eyebrow) { color: var(--muted); font-size: 1.03rem; }

.roadmap { counter-reset: roadmap; display: grid; gap: 18px; grid-template-columns: repeat(4, 1fr); list-style: none; margin: 0; padding: 0; }
.stage { border-top: 5px solid; min-height: 355px; padding: 25px 22px; position: relative; }
.stage::after { background: currentColor; content: ''; height: 1px; left: 0; opacity: .22; position: absolute; right: 0; top: 0; }
.stage-purple { background: #f8f5ff; border-color: var(--purple); color: #43218d; }
.stage-blue { background: #f1faff; border-color: var(--blue); color: #075e94; }
.stage-green { background: #f3fcf3; border-color: var(--green); color: #176d22; }
.stage-navy { background: #f5f7fd; border-color: #5771b9; color: var(--navy); }
.stage-number { font-family: var(--heading); font-size: 2.25rem; font-weight: 700; opacity: .65; }
.stage-kicker { font-size: .66rem; font-weight: 800; letter-spacing: .11em; margin: 1.4rem 0 .65rem; text-transform: uppercase; }
.stage h3 { font-family: var(--heading); font-size: 1.55rem; }
.stage p:not(.stage-kicker) { color: #4d5875; font-size: .86rem; }
.stage > a { bottom: 22px; font-size: .76rem; font-weight: 800; position: absolute; }
.stage-links { bottom: 22px; display: grid; gap: 8px; left: 22px; position: absolute; }
.stage-links a { color: inherit; font-size: .76rem; font-weight: 800; }

.audience-section { background: linear-gradient(112deg, #fbf8ff 0%, #fff 48%, #f7fbff 100%); border-bottom: 1px solid #e7e1f4; border-top: 1px solid #e7e1f4; }
.audience-intro { align-items: start; display: grid; gap: 70px; grid-template-columns: .8fr 1.2fr; margin-bottom: 52px; }
.audience-intro h2 { margin-bottom: 0; }
.audience-copy p { color: var(--muted); font-size: 1.06rem; max-width: 610px; }
.audience-copy .audience-breakthrough { color: #3f4963; font-size: 1rem; line-height: 1.62; }
.audience-breakthrough strong { color: #493197; display: inline-block; font-family: var(--heading); font-size: 1.25rem; line-height: 1.2; margin-bottom: 8px; }
.audience-principles { display: grid; gap: 20px; grid-template-columns: repeat(4, 1fr); }
.audience-principles article { background: #fff; border: 1px solid #e0daef; border-top: 5px solid var(--purple); min-height: 218px; padding: 27px 24px; }
.audience-principles article:nth-child(2) { border-top-color: var(--blue); }
.audience-principles article:nth-child(3) { border-top-color: var(--green); }
.audience-principles article:nth-child(4) { border-top-color: #7f8ab8; }
.audience-principles span { color: #7b61ba; font-family: var(--heading); font-size: .72rem; font-weight: 800; letter-spacing: .1em; }
.audience-principles h3 { font-size: 1.32rem; margin: 1.45rem 0 .7rem; }
.audience-principles p { color: var(--muted); font-size: .89rem; margin-bottom: 0; }
.audience-language { align-items: start; background: #fff; border: 1px solid #e2e7f2; display: grid; gap: 70px; grid-template-columns: 1.15fr .85fr; margin-top: 34px; padding: 36px; }
.audience-language h3 { color: #43218d; font-size: clamp(1.45rem, 2vw, 2rem); }
.audience-language p { color: var(--muted); margin-bottom: 0; max-width: 650px; }
.audience-from-to { border-left: 3px solid var(--purple); display: grid; gap: 15px; padding-left: 21px; }
.audience-from-to div { display: grid; gap: 4px; }
.audience-from-to div + div { border-top: 1px solid #e5e2ee; padding-top: 15px; }
.audience-from-to span { color: #7c679e; font-size: .65rem; font-weight: 800; letter-spacing: .12em; }
.audience-from-to strong { color: #3e4a68; font-family: var(--heading); font-size: 1rem; line-height: 1.35; }
.audience-benefits { border-top: 1px solid #e2dff0; margin-top: 48px; padding-top: 46px; }
.audience-benefits-heading { align-items: start; display: grid; gap: 44px; grid-template-columns: .8fr 1.2fr; margin-bottom: 30px; }
.audience-benefits-heading .eyebrow { grid-column: 1; margin-bottom: 0; }
.audience-benefits-heading h3 { font-size: clamp(1.55rem, 2.35vw, 2.35rem); grid-column: 1; margin: -22px 0 0; }
.audience-benefits-heading p:not(.eyebrow) { color: var(--muted); font-size: 1.03rem; grid-column: 2; grid-row: 1 / span 2; margin: 0; max-width: 610px; }
.audience-benefit-grid { display: grid; gap: 1px; grid-template-columns: repeat(4, 1fr); }
.audience-benefit-grid article { background: rgba(255, 255, 255, .84); border: 1px solid #e0ddec; min-height: 205px; padding: 24px 21px; }
.audience-benefit-grid article:nth-child(1) { border-top: 4px solid var(--purple); }
.audience-benefit-grid article:nth-child(2) { border-top: 4px solid var(--blue); }
.audience-benefit-grid article:nth-child(3) { border-top: 4px solid var(--green); }
.audience-benefit-grid article:nth-child(4) { border-top: 4px solid #7f8ab8; }
.audience-benefit-grid h4 { color: #384565; font-family: var(--heading); font-size: 1.1rem; line-height: 1.2; margin: 0 0 .75rem; }
.audience-benefit-grid p { color: var(--muted); font-size: .84rem; line-height: 1.52; margin: 0; }
.audience-close { color: #503b86; font-family: var(--heading); font-size: clamp(1.4rem, 2.25vw, 2rem); font-weight: 600; line-height: 1.37; margin: 44px auto 0; max-width: 780px; text-align: center; }

.ecosystem-section { background: #fff; border-top: 1px solid #eef0f5; }
.ecosystem-intro { align-items: start; display: grid; gap: 70px; grid-template-columns: .8fr 1.2fr; margin-bottom: 55px; }
.ecosystem-intro h2 { margin-bottom: 0; }
.ecosystem-intro p:not(.eyebrow) { color: var(--muted); font-size: 1.06rem; max-width: 590px; }
.ecosystem-intro .ecosystem-lead { color: #3f4963; font-family: var(--heading); font-size: 1.18rem; font-weight: 600; line-height: 1.46; }
.ecosystem-visual { background: #fff; border: 1px solid #e3e5ec; margin: 28px 0 0; max-width: 360px; padding: 6px; }
.ecosystem-visual img { display: block; height: auto; object-fit: contain; width: 100%; }
.ecosystem-network { height: 370px; margin: 0 auto; max-width: 920px; position: relative; }
.ecosystem-tile { align-items: center; background: #fff; border: 1px solid var(--line); color: #384665; display: flex; font-family: var(--heading); font-size: .9rem; font-weight: 600; justify-content: center; min-height: 76px; padding: 14px; position: absolute; text-align: center; width: 190px; z-index: 1; }
.ecosystem-center { background: linear-gradient(130deg, #f5efff, #eef9ff); border: 2px solid var(--purple); color: #4a288d; font-size: 1.08rem; left: calc(50% - 95px); top: calc(50% - 38px); }
.companion-top { left: calc(50% - 95px); top: 0; }
.companion-right { right: 0; top: calc(50% - 38px); }
.companion-bottom { bottom: 0; left: calc(50% - 95px); }
.companion-left { left: 0; top: calc(50% - 38px); }
.network-line { background: linear-gradient(90deg, rgba(140, 82, 255, .42), rgba(5, 153, 239, .42)); height: 1px; left: 50%; position: absolute; top: 50%; transform-origin: left center; width: 250px; }
.network-center-top { transform: rotate(-90deg); width: 147px; }
.network-center-right { transform: rotate(0); width: 270px; }
.network-center-bottom { transform: rotate(90deg); width: 147px; }
.network-center-left { transform: rotate(180deg); width: 270px; }
.network-cross-top-right { left: 50%; top: 38px; transform: rotate(37deg); width: 344px; }
.network-cross-right-bottom { left: calc(50% + 100px); top: 50%; transform: rotate(52deg); width: 268px; }
.network-cross-bottom-left { left: 50%; top: calc(100% - 38px); transform: rotate(143deg); width: 344px; }
.network-cross-left-top { left: calc(50% - 100px); top: 50%; transform: rotate(128deg); width: 268px; }
.pipeline-section { background: #f8fbff; border-bottom: 1px solid #e1ebf7; border-top: 1px solid #e1ebf7; }
.pipeline-intro { align-items: start; display: grid; gap: 70px; grid-template-columns: .8fr 1.2fr; margin-bottom: 55px; }
.pipeline-intro h2 { margin-bottom: 0; }
.pipeline-intro p:not(.eyebrow) { color: var(--muted); font-size: 1.06rem; max-width: 590px; }
.pipeline-path { align-items: stretch; display: grid; gap: 16px; grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr; }
.pipeline-item { background: #fff; border: 1px solid var(--line); display: flex; flex-direction: column; min-height: 250px; padding: 25px 21px; }
.pipeline-reader { border-top: 5px solid var(--purple); }
.pipeline-self-paced { border-top: 5px solid #6f72d8; }
.pipeline-customer { border-top: 5px solid var(--blue); }
.pipeline-client { border-top: 5px solid var(--green); }
.path-label { font-size: .65rem; font-weight: 800; letter-spacing: .11em; margin-bottom: 1.7rem; text-transform: uppercase; }
.pipeline-reader .path-label { color: var(--purple); }
.pipeline-self-paced .path-label { color: #5f62c2; }
.pipeline-customer .path-label { color: var(--blue); }
.pipeline-client .path-label { color: var(--green); }
.pipeline-item h3 { font-family: var(--heading); font-size: 1.25rem; }
.pipeline-item p { color: var(--muted); font-size: .85rem; }
.path-business { border-top: 1px solid var(--line); color: #394764; font-size: .76rem; margin-top: auto; padding-top: 16px; }
.path-arrow { align-self: center; color: #7b8cb7; font-size: 1.6rem; }
.ecosystem-close { color: #46516c; font-family: var(--heading); font-size: 1.35rem; font-weight: 600; line-height: 1.38; margin: 40px auto 0; max-width: 700px; text-align: center; }

.traffic-section { background: #f8fcf8; border-bottom: 1px solid #dfeee0; border-top: 1px solid #dfeee0; }
.traffic-intro { align-items: start; display: grid; gap: 70px; grid-template-columns: .8fr 1.2fr; margin-bottom: 54px; }
.traffic-intro h2 { margin-bottom: 0; }
.traffic-intro > p, .traffic-block-heading > p, .traffic-trust-block p, .bridging-block p { color: var(--muted); font-size: 1.06rem; margin-bottom: 0; max-width: 630px; }
.traffic-trust-block { background: #fff; border: 1px solid #d8eadb; border-top: 5px solid var(--green); margin-bottom: 28px; padding: 31px 34px; }
.traffic-trust-block h3, .traffic-block-heading h3, .bridging-block h3 { font-size: clamp(1.45rem, 2vw, 2rem); }
.traffic-transition { border-bottom: 1px solid #dce8df; margin: 0; max-width: 920px; padding: 16px 0 40px; text-align: left; }
.traffic-transition .eyebrow { margin-bottom: .85rem; }
.traffic-transition h3 { color: #295474; font-size: clamp(1.7rem, 2.7vw, 2.7rem); line-height: 1.12; margin: 0 0 .85rem; max-width: 860px; }
.traffic-transition p:not(.eyebrow) { color: var(--muted); margin: 0; max-width: 800px; }
.multicasting-block { border-bottom: 1px solid #d9e8dc; border-top: 1px solid #d9e8dc; padding: 45px 0 42px; }
.multicasting-grid { align-items: center; display: grid; gap: 58px; grid-template-columns: 1.1fr .9fr; }
.traffic-block-heading { align-items: start; display: grid; gap: 38px; grid-template-columns: .8fr 1.2fr; }
.traffic-block-heading h3 { margin: 0; }
.traffic-wheel-visual { background: #fff; border: 1px solid #d8e6db; margin: 0; padding: 12px; }
.traffic-wheel-visual img { aspect-ratio: 1 / 1; object-fit: contain; width: 100%; }
.traffic-wheel-visual figcaption { color: #50715a; font-family: var(--heading); font-size: .82rem; font-weight: 600; line-height: 1.38; padding: 12px 7px 3px; text-align: center; }
.format-strip { display: grid; gap: 1px; grid-template-columns: repeat(8, 1fr); margin-top: 35px; }
.format-strip span { align-items: center; background: #fff; border: 1px solid #dce8df; color: #35643d; display: flex; font-family: var(--heading); font-size: .72rem; font-weight: 600; justify-content: center; line-height: 1.24; min-height: 72px; padding: 10px; text-align: center; }
.format-caption { color: #52705a; font-family: var(--heading); font-size: .9rem; font-weight: 600; margin: 15px 0 0; text-align: center; }
.traffic-cards { display: grid; gap: 15px; grid-template-columns: repeat(4, 1fr); margin: 32px 0; }
.traffic-cards article { background: #fff; border: 1px solid #d8e6db; border-top: 4px solid #a8d9ae; min-height: 190px; padding: 25px 23px; }
.traffic-cards article:nth-child(2) { border-top-color: #b9dff5; }
.traffic-cards article:nth-child(3) { border-top-color: #d8c8ff; }
.traffic-cards article:nth-child(4) { border-top-color: #7f8ab8; }
.traffic-cards h3 { font-size: 1.3rem; }
.traffic-cards p { color: var(--muted); font-size: .9rem; margin: 0; }
.bridging-block { align-items: start; background: linear-gradient(105deg, #f7f3ff, #f5fbff); border: 1px solid #dde3f1; display: grid; gap: 70px; grid-template-columns: 1.2fr .8fr; padding: 35px; }
.bridging-block h3 { color: #4a328f; }
.bridging-block ul { color: #405579; font-family: var(--heading); font-size: 1rem; font-weight: 600; line-height: 1.55; list-style: none; margin: 0; padding: 0; }
.bridging-block li { border-bottom: 1px solid #dce4ef; padding: 15px 0; }
.bridging-block li:first-child { padding-top: 0; }
.bridging-block li::before { color: var(--purple); content: '•'; padding-right: 10px; }
.ecosystem-bridge { margin: 48px auto 0; max-width: 1020px; }
.ecosystem-bridge .eyebrow { margin-bottom: .7rem; }
.traffic-parent-note { border-top: 1px solid #d9e8dc; color: #52705a; font-size: .82rem; margin: 36px auto 0; max-width: 760px; padding-top: 18px; text-align: center; }
.traffic-parent-note a { color: #365e9f; font-weight: 700; text-decoration: underline; text-underline-offset: .2em; }
.traffic-close { color: #305b39; font-family: var(--heading); font-size: clamp(1.45rem, 2.3vw, 2.1rem); font-weight: 600; margin: 42px auto 0; max-width: 650px; text-align: center; }

.transformation-section { background: #f7f4ff; border-bottom: 1px solid #e7defb; border-top: 1px solid #e7defb; color: var(--ink); }
.transformation-grid { display: grid; gap: 80px; grid-template-columns: .85fr 1.15fr; margin: auto; max-width: 1180px; }
.transformation-grid > div > p:not(.eyebrow) { color: var(--muted); font-size: 1.05rem; }
.transformation-intro h2 { max-width: 540px; }
.transformation-visual { margin: 0; }
.transformation-visual img { object-fit: cover; width: 100%; }
.transformation-visual-primary { border: 1px solid #e3daf9; margin-top: 30px; max-width: 470px; padding: 10px; }
.transformation-visual-primary img { aspect-ratio: 3 / 2; }
.transformation-steps { display: grid; gap: 0; }
.transformation-steps article { border-bottom: 1px solid rgba(88, 75, 174, .17); display: grid; gap: 15px; grid-template-columns: 45px 150px 1fr; padding: 20px 0; }
.transformation-steps article:first-child { border-top: 1px solid rgba(88, 75, 174, .17); }
.transformation-steps span { color: var(--purple); font-size: .74rem; font-weight: 800; }
.transformation-steps h3 { font-family: var(--heading); font-size: 1.4rem; margin: 0; }
.transformation-steps p { color: var(--muted); font-size: .87rem; margin: 0; }
.transformation-principles { display: grid; gap: 1px; grid-template-columns: repeat(3, 1fr); margin: 68px auto 0; max-width: 1180px; }
.transformation-principles article { background: rgba(255, 255, 255, .78); border: 1px solid #dfd9f1; border-top: 4px solid #bca6ee; min-height: 205px; padding: 25px 23px; }
.transformation-principles article:nth-child(2) { border-top-color: #a5d8f6; }
.transformation-principles article:nth-child(3) { border-top-color: #a8d9ae; }
.transformation-principles span { color: #7b61ba; font-size: .65rem; font-weight: 800; letter-spacing: .11em; }
.transformation-principles h3 { color: #3f2b84; font-size: 1.3rem; margin: 1.55rem 0 .75rem; }
.transformation-principles p { color: var(--muted); font-size: .88rem; margin: 0; }
.transformation-journey { align-items: center; border-top: 1px solid #ded8ef; display: grid; gap: 68px; grid-template-columns: .95fr 1.05fr; margin: 68px auto 0; max-width: 1180px; padding-top: 52px; }
.transformation-visual-secondary { border: 1px solid #e3daf9; padding: 10px; }
.transformation-visual-secondary img { aspect-ratio: 3 / 2; }
.transformation-diagram-pair { display: grid; gap: 16px; }
.transformation-diagram { background: #fff; border: 1px solid #e0d9ef; margin: 0; padding: 8px; }
.transformation-diagram img { display: block; height: auto; object-fit: contain; width: 100%; }
.transformation-journey h3 { color: #3f2b84; font-size: clamp(1.45rem, 2vw, 2.05rem); }
.transformation-journey p:not(.eyebrow) { color: var(--muted); font-size: .98rem; max-width: 560px; }

.resources-section { background: #fff; }
.resources-top { align-items: center; display: grid; gap: 65px; grid-template-columns: .85fr 1.15fr; }
.author-work-visual { background: #fff; border: 1px solid #e1e8f5; margin: 0; padding: 0; }
.author-work-visual img { display: block; width: 100%; }
.author-work-visual figcaption { color: #55617d; font-family: var(--heading); font-size: 1.08rem; font-weight: 600; line-height: 1.35; padding: 18px 20px 21px; }
.coming-soon-grid { display: grid; gap: 22px; grid-template-columns: repeat(3, 1fr); margin-top: 45px; }
.coming-soon-grid article { background: #fbfcff; border: 1px solid #dce3ef; border-top: 4px solid #d9ccff; min-height: 220px; padding: 29px; }
.coming-soon-grid article:nth-child(2) { border-top-color: #bde9ff; }
.coming-soon-grid article:nth-child(3) { border-top-color: #c9f0cb; }
.coming-label { color: #546380; font-size: .64rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.coming-soon-grid h3 { font-family: var(--heading); font-size: 1.5rem; margin: 1.7rem 0 .7rem; }
.coming-soon-grid p { color: var(--muted); font-size: .9rem; }

.about-section { background: #fbfcff; border-top: 1px solid #edf0f7; }
.about-grid { align-items: center; display: grid; gap: 95px; grid-template-columns: .8fr 1.2fr; margin: auto; max-width: 1060px; }
.about-image-wrap { background: linear-gradient(155deg, var(--purple), var(--blue)); padding: 18px 18px 0 0; position: relative; }
.about-image-wrap::before { border: 1px solid rgba(140, 82, 255, .35); bottom: 18px; content: ''; left: 18px; position: absolute; right: -18px; top: -18px; }
.about-image-wrap img { aspect-ratio: 4 / 5; object-fit: cover; object-position: center top; position: relative; width: 100%; }
.about-copy p:not(.eyebrow) { color: var(--muted); max-width: 590px; }
.about-note { font-family: var(--heading); font-size: 1.2rem; font-weight: 600; line-height: 1.4; }

.results-section { background: linear-gradient(110deg, #faf8ff 0%, #fff 46%, #f5fbff 100%); border-bottom: 1px solid #e3e8f4; border-top: 1px solid #e3e8f4; }
.results-heading { margin-bottom: 45px; max-width: 780px; }
.results-grid { display: grid; gap: 20px; grid-template-columns: repeat(3, 1fr); margin: 0 auto; max-width: 1180px; }
.results-grid article { background: #fff; border: 1px solid #dfe5f0; border-top: 5px solid var(--purple); min-height: 272px; padding: 28px 26px; }
.results-grid article:nth-child(2) { border-top-color: var(--blue); }
.results-grid article:nth-child(3) { border-top-color: var(--green); }
.result-amount { color: #3f2ca9; font-family: var(--heading); font-size: clamp(2rem, 3.4vw, 3.5rem); font-weight: 700; letter-spacing: -.05em; line-height: 1; margin-bottom: 1.3rem; }
.results-grid h3 { font-size: 1.35rem; }
.result-type { color: #5f6e8b; font-size: .73rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.results-grid article > p:last-child { color: var(--muted); font-size: .88rem; margin-bottom: 0; }
.results-disclaimer { border-top: 1px solid #dbe2ee; color: #5a6580; font-size: .9rem; line-height: 1.55; margin: 34px auto 0; max-width: 940px; padding-top: 22px; text-align: center; }

.playbook-section { background: linear-gradient(120deg, #faf7ff 0%, #fff 45%, #f4fbff 100%); border-bottom: 1px solid #e2e6f0; border-top: 1px solid #e2e6f0; color: var(--ink); padding: 92px max(32px, calc((100% - 980px) / 2)); }
.playbook-grid { align-items: center; display: grid; gap: 80px; grid-template-columns: 1fr 1fr; margin: auto; max-width: 980px; }
.playbook-section h2 { margin-bottom: .65rem; }
.playbook-subhead { color: #5840c6; font-family: var(--heading); font-size: 1.35rem; font-weight: 600; }
.playbook-start { color: #235abf; font-family: var(--heading); font-size: 1.08rem; font-weight: 700; margin-bottom: .55rem; }
.playbook-grid > div > p:last-child { color: var(--muted); max-width: 420px; }
.playbook-form { background: #fff; border: 1px solid #dfe6f2; box-shadow: 0 14px 34px rgba(58, 83, 153, .10); display: grid; gap: 14px; padding: 27px; }
.playbook-form label { color: #36405c; display: grid; font-size: .74rem; font-weight: 700; gap: 6px; }
.playbook-form input { background: #fff; border: 1px solid #cbd5e5; border-radius: 0; color: var(--ink); font: inherit; padding: .9rem .85rem; }
.playbook-form input:focus { outline: 3px solid rgba(5, 153, 239, .35); outline-offset: 2px; }
.playbook-form .button { margin-top: 4px; width: 100%; }
.form-consent { color: #68738d; font-size: .7rem; line-height: 1.45; margin: 0; }
.form-status { font-size: .78rem; font-weight: 700; margin: 0; min-height: 1.2em; }
.form-status.success { color: #188423; }
.form-status.error { color: #bd2940; }
.honeypot, .form-target { display: none; }

.site-footer { background: #fff; border-top: 1px solid var(--line); color: #58647e; padding: 54px max(32px, calc((100% - 1180px) / 2)) 26px; }
.footer-top { align-items: center; display: grid; gap: 30px; grid-template-columns: 112px 1fr auto; }
.footer-brand img { height: 96px; object-fit: contain; object-position: left; width: 96px; }
.footer-top p { font-size: .75rem; margin: 0; max-width: 330px; }
.footer-top nav { display: flex; flex-wrap: wrap; gap: 15px; }
.footer-top nav a, .footer-bottom a { color: #516280; font-size: .72rem; font-weight: 600; }
.footer-top nav a:hover, .footer-bottom a:hover { color: var(--purple); }
.footer-bottom { border-top: 1px solid #e2e7f0; display: flex; font-size: .69rem; justify-content: space-between; margin-top: 34px; padding-top: 20px; }

/* Library and permanent resource pages */
.library-hero { background: linear-gradient(120deg, #fbf8ff 0%, #fff 47%, #f2fbff 100%); border-bottom: 1px solid #e1e7f2; padding: 84px max(32px, calc((100% - 1180px) / 2)) 74px; }
.library-hero-inner { margin: auto; max-width: 1180px; }
.library-hero h1 { color: #23274a; font-size: clamp(3rem, 5.2vw, 5.25rem); margin-bottom: 1.3rem; max-width: 780px; }
.library-hero p:not(.eyebrow) { color: var(--muted); font-size: 1.15rem; max-width: 690px; }
.library-breadcrumbs { color: #66718c; display: flex; flex-wrap: wrap; font-size: .78rem; font-weight: 700; gap: 8px; margin-bottom: 30px; }
.library-breadcrumbs a { color: #4754a5; }
.library-breadcrumbs a:hover { color: var(--purple); text-decoration: underline; text-underline-offset: .2em; }
.library-breadcrumbs span[aria-hidden="true"] { color: #9aa4ba; }
.library-overview { background: #fff; }
.library-feature-grid { align-items: stretch; display: grid; gap: 50px; grid-template-columns: 1.02fr .98fr; margin: auto; max-width: 1060px; }
.library-feature-visual { background: linear-gradient(135deg, #f6f1ff, #f0faff); border: 1px solid #e0e4f1; margin: 0; padding: 12px; }
.library-feature-visual img { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; }
.library-feature-content { align-self: center; }
.library-feature-content h2 { color: #312b5b; font-size: clamp(1.95rem, 3vw, 3.1rem); }
.library-feature-content > p:not(.eyebrow) { color: var(--muted); font-size: 1.04rem; max-width: 500px; }
.library-meta { color: #63708c; font-size: .75rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.library-meta span + span::before { color: #a2abc0; content: '•'; margin: 0 8px; }
.library-meta span + span { display: none; }
.library-card-link { color: #3f2ca9; font-size: .88rem; font-weight: 800; }
.library-card-link:hover { text-decoration: underline; text-underline-offset: .22em; }
.library-collection { background: #f8fbff; border-bottom: 1px solid #e1e8f4; border-top: 1px solid #e1e8f4; }
.library-collection-heading { align-items: end; display: flex; gap: 28px; justify-content: space-between; margin: 0 auto 32px; max-width: 1060px; }
.library-collection-heading h2 { margin-bottom: 0; }
.library-collection-heading p:not(.eyebrow) { color: var(--muted); margin: 0; max-width: 430px; }
.library-grid { display: grid; gap: 22px; grid-template-columns: repeat(3, 1fr); margin: auto; max-width: 1060px; }
.library-card { background: #fff; border: 1px solid #dce4f0; display: flex; flex-direction: column; min-height: 232px; padding: 27px 25px; }
.library-card:first-child { border-top: 5px solid var(--purple); }
.library-card h3 { color: #37425f; font-size: 1.35rem; margin-top: 1.45rem; }
.library-card p { color: var(--muted); font-size: .89rem; }
.library-card .library-card-link { margin-top: auto; }
.library-next-formats { border-top: 1px solid #e1e8f4; margin: 52px auto 0; max-width: 1060px; padding-top: 42px; }
.library-next-formats h2 { color: #36415e; font-size: clamp(1.75rem, 2.5vw, 2.45rem); max-width: 520px; }
.library-next-formats p { color: var(--muted); max-width: 680px; }
.library-format-list { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; margin: 24px 0 0; padding: 0; }
.library-format-list li { background: #fff; border: 1px solid #dce5f0; color: #53607e; font-family: var(--heading); font-size: .82rem; font-weight: 700; padding: 10px 14px; }
.articles-page .library-hero { padding-bottom: 64px; }
.article-list { background: #fff; }
.article-list-inner { margin: auto; max-width: 900px; }
.article-list-card { align-items: center; border-bottom: 1px solid #e0e6f0; display: grid; gap: 46px; grid-template-columns: 220px 1fr; padding: 30px 0; }
.article-list-card:first-child { padding-top: 0; }
.article-list-card img { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; }
.article-list-card h2 { color: #303c5c; font-size: clamp(1.55rem, 2.55vw, 2.3rem); margin: 1.2rem 0 .8rem; }
.article-list-card p:not(.library-meta) { color: var(--muted); margin-bottom: 1.05rem; max-width: 590px; }
.article-page .article-hero { background: linear-gradient(125deg, #faf8ff 0%, #fff 55%, #eefaff 100%); border-bottom: 1px solid #e0e6f0; padding: 62px max(32px, calc((100% - 980px) / 2)) 56px; }
.article-hero-inner { margin: auto; max-width: 980px; }
.article-hero h1 { color: #242a4c; font-size: clamp(2.65rem, 4.9vw, 4.8rem); margin-bottom: 1.35rem; max-width: 900px; }
.article-dek { color: #4f5c78; font-family: var(--heading); font-size: clamp(1.2rem, 2vw, 1.55rem); line-height: 1.4; max-width: 800px; }
.article-meta-row { align-items: center; color: #67728d; display: flex; flex-wrap: wrap; font-size: .77rem; font-weight: 700; gap: 10px; letter-spacing: .03em; text-transform: uppercase; }
.article-meta-row .article-format { color: #5134a1; }
.article-meta-row time, .article-meta-row time + span[aria-hidden="true"] { display: none; }
.article-layout { align-items: start; display: grid; gap: 70px; grid-template-columns: minmax(0, 1fr) 220px; margin: auto; max-width: 1080px; padding: 68px 0 84px; }
.article-content { font-size: 1.04rem; min-width: 0; }
.article-feature { background: #f8f5ff; border: 1px solid #e0d8f5; margin: 0 0 44px; padding: 10px; }
.article-feature img { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; }
.article-feature figcaption { color: #5e6781; font-size: .78rem; padding: 12px 4px 2px; }
.article-content h2 { color: #342d5c; font-size: clamp(1.75rem, 2.7vw, 2.65rem); margin: 2.6rem 0 .9rem; }
.article-content h3 { color: #384363; font-size: 1.38rem; margin: 2rem 0 .75rem; }
.article-content p { color: #4f5a73; margin-bottom: 1.25rem; max-width: 720px; }
.article-content ul { color: #4f5a73; margin: 0 0 1.35rem; padding-left: 1.2rem; }
.article-content li { margin: .45rem 0; }
.article-note { background: #f2fbf3; border-left: 4px solid var(--green); color: #315b3b; font-family: var(--heading); font-size: 1.13rem; font-weight: 600; line-height: 1.45; margin: 2.3rem 0; padding: 22px 24px; }
.article-aside { border-left: 1px solid #dde4ef; color: #64708b; font-size: .79rem; padding-left: 22px; }
.article-aside h2 { color: #3d4765; font-size: 1.1rem; line-height: 1.2; margin-bottom: 1rem; }
.article-aside a { color: #4655a6; display: block; font-weight: 700; margin: .75rem 0; }
.article-aside a:hover { color: var(--purple); text-decoration: underline; text-underline-offset: .2em; }
.article-cta { background: #f7f4ff; border: 1px solid #dfd7f3; margin-top: 18px; padding: 34px; }
.article-cta h2 { color: #3f2b84; font-size: clamp(1.5rem, 2.45vw, 2.25rem); margin: 0 0 .7rem; }
.article-cta p { margin-bottom: 1.35rem; }
.article-source { border-top: 1px solid #dfe6ef; color: #75809a; font-size: .76rem; margin-top: 44px; padding-top: 18px; }

@media (max-width: 1000px) {
  .nav-shell { gap: 17px; padding: 0 22px; }
  .site-nav { gap: 15px; }
  .header-cta { display: none; }
  .hero-grid, .transformation-grid, .audience-intro, .ecosystem-intro, .pipeline-intro, .traffic-intro, .traffic-block-heading, .multicasting-grid, .bridging-block, .transformation-journey, .about-grid, .resources-top { gap: 46px; }
  .roadmap { grid-template-columns: repeat(2, 1fr); }
  .audience-principles { grid-template-columns: repeat(2, 1fr); }
  .audience-benefit-grid { grid-template-columns: repeat(2, 1fr); }
  .pipeline-path { grid-template-columns: repeat(4, 1fr); }
  .path-arrow { display: none; }
  .pipeline-item { min-height: 240px; }
  .format-strip { grid-template-columns: repeat(4, 1fr); }
  .traffic-cards { grid-template-columns: repeat(2, 1fr); }
  .results-grid { grid-template-columns: repeat(3, 1fr); }
  .transformation-principles { grid-template-columns: repeat(3, 1fr); }
  .footer-top { grid-template-columns: 112px 1fr; }
  .footer-top nav { grid-column: 1 / -1; }
  .library-feature-grid { gap: 36px; }
  .article-layout { gap: 46px; }
}

@media (max-width: 700px) {
  .site-header { position: relative; }
  .nav-shell { min-height: 72px; }
  .brand { min-width: 0; }
  .brand img { height: 58px; width: 58px; }
  .brand-name strong { font-size: 1.05rem; }
  .brand-name span { font-size: .82rem; }
  .menu-toggle { display: block; margin-left: auto; }
  .site-nav { background: #fff; border-bottom: 1px solid var(--line); box-shadow: 0 10px 22px rgba(10, 21, 57, .08); display: none; left: 0; padding: 18px 24px 22px; position: absolute; right: 0; top: 72px; }
  .site-nav.open { display: grid; gap: 13px; }
  .site-nav > a, .stage-nav-menu summary { font-size: .95rem; width: max-content; }
  .stage-nav-menu { width: 100%; }
  .stage-nav-panel { box-shadow: none; left: 0; margin-top: 5px; min-width: 0; position: static; width: 100%; }
  .stage-nav-panel a { width: 100%; }
  .stage-nav-panel .library-nav-soon { margin-left: 11px; }
  .hero, .section { padding-left: 24px; padding-right: 24px; }
  .hero { padding-bottom: 65px; padding-top: 65px; }
  .hero-grid, .playbook-grid { grid-template-columns: 1fr; }
  .hero-grid { gap: 31px; }
  .hero-visual { height: 400px; transform: scale(.92); transform-origin: top left; width: 109%; }
  .journey-book { left: 0; }
  .journey-method { right: 0; }
  .journey-impact { left: 58px; }
  .roadmap, .audience-principles, .coming-soon-grid { grid-template-columns: 1fr; }
  .stage { min-height: 280px; }
  .stage > a { bottom: auto; display: inline-block; margin-top: 15px; position: relative; }
  .stage-links { bottom: auto; margin-top: 15px; position: relative; left: auto; }
  .audience-intro, .audience-language, .ecosystem-intro, .pipeline-intro, .traffic-intro, .traffic-block-heading, .multicasting-grid, .bridging-block, .pipeline-path, .transformation-grid, .transformation-journey, .about-grid, .playbook-grid, .resources-top { grid-template-columns: 1fr; }
  .audience-intro, .audience-language, .ecosystem-intro, .traffic-intro, .traffic-block-heading, .multicasting-grid, .bridging-block, .transformation-grid, .transformation-journey, .about-grid { gap: 28px; }
  .traffic-transition { padding-bottom: 32px; }
  .audience-language { padding: 26px 21px; }
  .audience-benefits-heading { display: block; }
  .audience-benefits-heading h3 { margin: 0 0 1rem; }
  .audience-benefits-heading .eyebrow { margin-bottom: 1rem; }
  .audience-benefits-heading p:not(.eyebrow) { margin: 0; }
  .audience-benefit-grid { grid-template-columns: 1fr; }
  .pipeline-path { gap: 12px; }
  .pipeline-item { min-height: auto; }
  .traffic-trust-block, .bridging-block { padding: 25px 21px; }
  .format-strip { grid-template-columns: repeat(2, 1fr); margin-top: 28px; }
  .format-strip span { min-height: 60px; }
  .traffic-cards, .results-grid, .transformation-principles { grid-template-columns: 1fr; }
  .traffic-cards article, .results-grid article { min-height: auto; }
  .transformation-principles { margin-top: 46px; }
  .transformation-journey { margin-top: 46px; padding-top: 38px; }
  .ecosystem-visual { margin-top: 24px; max-width: 430px; padding: 5px; }
  .transformation-diagram-pair { gap: 12px; }
  .transformation-diagram { padding: 4px; }
  .transformation-steps article { gap: 8px; grid-template-columns: 33px 1fr; }
  .transformation-steps p { grid-column: 2; }
  .about-grid { gap: 48px; }
  .about-image-wrap { max-width: 390px; }
  .playbook-form { padding: 22px; }
  .footer-top { grid-template-columns: 1fr; }
  .footer-top nav { flex-direction: column; gap: 9px; grid-column: auto; }
  .footer-bottom { align-items: flex-start; flex-direction: column; gap: 10px; }
  .thesis-band { padding: 55px 24px; }
  .trust-badge-band { padding: 22px 24px; }
  .trust-badge-frame { height: 198px; }
  .playbook-section { padding: 66px 24px; }
  .library-hero { padding: 58px 24px 50px; }
  .library-feature-grid, .article-layout { grid-template-columns: 1fr; }
  .library-feature-grid { gap: 30px; }
  .library-collection-heading { align-items: start; flex-direction: column; margin-bottom: 26px; }
  .library-grid { grid-template-columns: 1fr; }
  .article-list-card { gap: 22px; grid-template-columns: 1fr; }
  .article-list-card img { max-width: 370px; }
  .article-page .article-hero { padding: 46px 24px 42px; }
  .article-layout { gap: 35px; padding: 48px 0 58px; }
  .article-aside { border-left: 0; border-top: 1px solid #dde4ef; padding: 25px 0 0; }
  .article-cta { padding: 27px 22px; }
}