/* Full-scale illustrated stories. Native document scrolling controls the scene. */
.pg-scroll-page { --story-paper: #f7f6f2; --story-navy: #262262; --story-orange: #f1592a; --story-header: 95px; color: var(--story-navy); background: var(--story-paper); }
.pg-scroll-hero { max-width: 1440px; margin: 0 auto; padding: 64px 7vw 76px; }
.pg-scroll-hero .pg-breadcrumb { margin-bottom: 55px; }
.pg-scroll-hero .pg-eyebrow { margin-bottom: 24px; }
.pg-scroll-page .pg-scroll-hero h1 { max-width: 1000px; margin: 0 0 30px; font-size: clamp(3.4rem, 7.9vw, 7.8rem); line-height: .99; font-weight: 600; letter-spacing: -.07em; }
.pg-scroll-hero h1 em { color: var(--story-orange); font-style: normal; }
.pg-scroll-hero > p:not(.pg-eyebrow), .pg-scroll-hero .pg-scroll-lead { max-width: 52ch; color: #61616f; font-size: 1.1rem; line-height: 1.7; }
.pg-scroll-hint { display: inline-flex; align-items: center; gap: 14px; margin-top: 24px; color: var(--story-navy); font-size: .84rem; text-decoration: none; }
.pg-scroll-hint::before { content: '↓'; display: grid; place-items: center; width: 38px; height: 48px; border: 1px solid #c7c6ce; border-radius: 30px; font-size: 1.2rem; }
.pg-scroll-story { position: relative; border-top: 1px solid #dddcdf; border-bottom: 1px solid #dddcdf; }
.pg-scroll-stage { display: none; }
.pg-scroll-step { position: relative; margin: 0; padding: 64px max(24px, 7vw); border-bottom: 1px solid #dddcdf; }
.pg-scroll-step:last-child { border-bottom: 0; }
.pg-step-copy { max-width: 560px; }
.pg-scroll-page .pg-step-copy h2 { margin: 0 0 24px; font-size: clamp(2.4rem, 4.2vw, 4.5rem); line-height: 1.04; letter-spacing: -.055em; font-weight: 600; }
.pg-step-copy .pg-eyebrow { margin-bottom: 23px; font-size: .72rem; color: #646472; }
.pg-step-copy > p:not(.pg-eyebrow) { color: #61616f; font-size: 1.02rem; line-height: 1.75; max-width: 32ch; }
.pg-step-copy a { color: var(--story-navy); text-underline-offset: 4px; }
.pg-step-fallback { display: block; width: min(100%, 1000px); height: auto; margin: 20px auto 0; overflow: visible; }
.pg-scroll-art { display: block; width: 100%; height: 100%; overflow: visible; }
.pg-scroll-art [data-scene] { transform-origin: 500px 310px; }
.pg-scroll-story.is-scroll-enhanced { --story-height: calc(100svh - var(--story-header)); }
.pg-scroll-story.is-scroll-enhanced .pg-scroll-stage { display: block; position: sticky; top: var(--story-header); height: var(--story-height); min-height: 540px; overflow: hidden; z-index: 1; }
.pg-scroll-story.is-scroll-enhanced .pg-scroll-canvas { position: absolute; inset: 3% 1vw 11% 29%; display: flex; align-items: center; justify-content: center; }
.pg-scroll-story.is-scroll-enhanced .pg-scroll-art { max-height: 780px; }
.pg-scroll-story.is-scroll-enhanced .pg-scroll-steps { position: relative; margin-top: calc(-1 * max(540px, var(--story-height))); pointer-events: none; }
.pg-scroll-story.is-scroll-enhanced .pg-scroll-step { min-height: max(540px, var(--story-height)); display: flex; align-items: center; padding: 9vh 0 12vh 6.5vw; border: 0; pointer-events: none; }
.pg-scroll-story.is-scroll-enhanced .pg-step-copy { width: 25%; max-width: 350px; position: relative; z-index: 2; }
.pg-scroll-story.is-scroll-enhanced .pg-step-copy a { pointer-events: auto; }
.pg-scroll-story.is-scroll-enhanced .pg-step-fallback { display: none; }
.pg-scroll-nav { position: absolute; bottom: 26px; left: max(6.5vw, 190px); right: 6.5vw; display: flex; align-items: center; gap: 24px; z-index: 3; }
.pg-scroll-nav ol, .pg-scroll-nav ul { display: flex; align-items: center; gap: 8px; margin: 0; padding: 0; list-style: none; }
.pg-scroll-jump { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; border: 1px solid #d0cfd6; border-radius: 50%; background: var(--story-paper); color: #646472; font-size: .73rem; font-weight: 600; text-decoration: none; font-variant-numeric: tabular-nums; }
.pg-scroll-jump:hover { color: var(--story-navy); border-color: var(--story-navy); }
.pg-scroll-jump.is-active { color: #fff; border-color: var(--story-navy); background: var(--story-navy); }
.pg-scroll-track { height: 2px; flex: 1; background: #d9d7df; overflow: hidden; }
[data-scroll-progress] { display: block; width: 100%; height: 100%; background: var(--story-orange); transform: scaleX(0); transform-origin: left; }
[data-scroll-counter] { font-size: .72rem; color: #646472; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pg-scroll-outro { max-width: 1240px; margin: 0 auto; padding: 100px 24px 110px; }
.pg-scroll-page .pg-scroll-outro h2 { max-width: 760px; font-size: clamp(2.6rem, 5vw, 5rem); line-height: 1.02; letter-spacing: -.055em; margin: 0 0 28px; }
.pg-scroll-outro > p { max-width: 64ch; color: #61616f; line-height: 1.75; }
.pg-scroll-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; margin-top: 30px; }
.pg-scroll-actions > a:not(.btn) { color: var(--story-navy); font-size: .9rem; text-underline-offset: 5px; }
.pg-scroll-fine { font-size: .78rem; margin-top: 34px; }
@media (min-width: 1600px) {
 .pg-scroll-story.is-scroll-enhanced .pg-step-copy { max-width: 420px; }
 .pg-scroll-story.is-scroll-enhanced .pg-scroll-canvas { right: 5vw; }
}
@media (max-width: 1023px) {
 .pg-scroll-page { --story-header: 79px; }
 .pg-scroll-hero { padding: 42px 6vw 58px; }
 .pg-scroll-hero .pg-breadcrumb { margin-bottom: 38px; }
 .pg-scroll-page .pg-step-copy h2 { font-size: clamp(2rem, 4.4vw, 3.3rem); }
 .pg-scroll-story.is-scroll-enhanced .pg-step-copy { width: 29%; }
 .pg-scroll-story.is-scroll-enhanced .pg-scroll-canvas { left: 31%; right: -3%; }
 .pg-step-copy > p:not(.pg-eyebrow) { font-size: .9rem; }
}
@media (max-width: 767px) {
 .pg-scroll-page { --story-header: 79px; }
 .pg-scroll-hero { padding: 35px 24px 48px; }
 .pg-scroll-hero .pg-breadcrumb { font-size: .72rem; margin-bottom: 40px; }
 .pg-scroll-page .pg-scroll-hero h1 { font-size: clamp(3rem, 11.8vw, 5.2rem); letter-spacing: -.06em; }
 .pg-scroll-hero > p:not(.pg-eyebrow), .pg-scroll-hero .pg-scroll-lead { font-size: 1rem; }
 .pg-scroll-story.is-scroll-enhanced .pg-scroll-stage { height: var(--story-mobile-stage, var(--story-height)); min-height: 0; }
 .pg-scroll-story.is-scroll-enhanced .pg-scroll-steps { margin-top: calc(-1 * var(--story-mobile-stage, var(--story-height))); }
 .pg-scroll-story.is-scroll-enhanced .pg-scroll-step { min-height: var(--story-mobile-stage, var(--story-height)); align-items: flex-start; padding: 38px 24px 0; }
 .pg-scroll-story.is-scroll-enhanced .pg-step-copy { width: 100%; max-width: 480px; }
 .pg-scroll-page .pg-step-copy h2 { font-size: clamp(1.8rem, 7.7vw, 2.65rem); max-width: none; margin-bottom: 13px; line-height: 1.08; }
 .pg-step-copy .pg-eyebrow { font-size: .66rem; margin-bottom: 13px; }
 .pg-step-copy > p:not(.pg-eyebrow) { max-width: 36ch; font-size: .87rem; line-height: 1.6; }
 .pg-scroll-story.is-scroll-enhanced .pg-scroll-canvas { inset: var(--story-copy-space, 300px) -5% 78px; }
 .pg-scroll-story.is-scroll-enhanced .pg-scroll-art { width: 100%; height: 100%; }
 .pg-scroll-nav { left: 80px; right: 24px; bottom: 23px; gap: 0; justify-content: flex-end; }
 .pg-scroll-nav ol, .pg-scroll-nav ul { gap: 5px; }
 .pg-scroll-jump { min-width: 36px; height: 36px; font-size: .68rem; }
 [data-scroll-counter] { font-size: .64rem; }
 .pg-scroll-nav .pg-scroll-track, .pg-scroll-nav [data-scroll-counter] { display: none; }
 .pg-scroll-outro { padding: 66px 24px 76px; }
 .pg-scroll-step { padding: 44px 24px; }
 .pg-step-fallback { width: calc(100% + 30px); max-width: none; margin-left: -15px; }
}
@media (prefers-reduced-motion: reduce) {
 .pg-scroll-page *, .pg-scroll-page *::before, .pg-scroll-page *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media print {
 .pg-scroll-page [data-scene] { opacity: 1 !important; visibility: visible !important; }
 .pg-scroll-page [data-scroll-layer] { transform: none !important; opacity: 1 !important; }
 .pg-scroll-page .pg-step-copy { transform: none !important; opacity: 1 !important; visibility: visible !important; }
 .pg-scroll-stage { display: none !important; }
 .pg-scroll-story.is-scroll-enhanced .pg-scroll-steps { margin: 0; }
 .pg-scroll-story.is-scroll-enhanced .pg-scroll-step { min-height: auto; display: block; padding: 28px; break-inside: avoid; }
 .pg-scroll-story.is-scroll-enhanced .pg-step-copy { width: 100%; max-width: none; }
 .pg-scroll-story.is-scroll-enhanced .pg-step-fallback { display: block; max-height: 300px; }
}