/* Pageflow uses the shared case-study structure with its own native brand. */
.pageflow-case{--yellow:#d4e5d8;--cream:#f3f5ef;--mint:#e2ede4;--ink:#1b2520;--muted:#5d6a61;--rule:#e1e7df}.pageflow-case .pf-brand-banner{height:auto;aspect-ratio:16/6.2;background:#f5f7f2}.pf-brand-banner .hero-art{width:100%;height:100%;object-fit:cover;object-position:center 49%}.pageflow-case .project-avatar{background:#2e574a;border-radius:28px;padding:20px}.pageflow-case .project-avatar img{width:100%;height:100%;object-fit:contain}.pageflow-case .project-badge{background:#dce9e1;color:#2e574a}.pageflow-case .chapter-nav a.active{color:#244737}.pageflow-case .chapter-nav a.active:after{background:#2e574a}.pageflow-case .project-brief{background:#edf2e8}.pageflow-case .goal.rose{background:#f3eee5}.pageflow-case .goal.lilac{background:#eeedf5}.pageflow-case .goal.mint{background:#e9f2ed}.pageflow-case .goal .mini-icon{color:#426b58}.pageflow-case .research-number{color:#6b806d}.pf-reader-profile{grid-template-columns:100px 1fr 220px}.reader-profile-symbol{width:86px;height:110px;display:grid;place-items:center;background:#dce9e1;border-radius:20px}.reader-profile-symbol svg{width:45px;height:45px;fill:none;stroke:#2e574a;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.pageflow-case .persona-question{background:#e4eddd}.pageflow-case .persona-question>span{color:#496442}.pageflow-case .diagram .zoom{background:white}.pageflow-case .diagram img[src*="reader-journey"]{aspect-ratio:1500/710}.pageflow-case .diagram img[src*="story-map.svg"]{aspect-ratio:1500/1260}.pageflow-case .diagram img[src*="app-structure"]{aspect-ratio:1400/850}.pageflow-case .diagram img[src*="reading-flow"]{aspect-ratio:1400/940}.pageflow-case .takeaways article>b{background:#e2edda}.pageflow-case .story-follow-through{background:#f1f4ed}.pageflow-case .story-screens figcaption b{font-size:11px}.iteration-case{margin-top:46px;padding-bottom:38px;border-bottom:1px solid var(--rule)}.iteration-three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;padding:30px;background:#f3f5ef;border-radius:18px;margin-top:27px}.iteration-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:44px;padding:30px max(30px,12%);background:#f3f5ef;border-radius:18px;margin-top:27px}.iteration-three .phone,.iteration-two .phone{max-width:210px;margin:0 auto;width:100%;padding:5px;border-radius:28px}.iteration-three .phone img,.iteration-two .phone img{width:100%;height:auto;border-radius:23px}.iteration-three figcaption,.iteration-two figcaption{margin-top:13px;max-width:220px;margin-left:auto;margin-right:auto}.iteration-three figcaption b,.iteration-three figcaption span,.iteration-two figcaption b,.iteration-two figcaption span{display:block}.iteration-three figcaption b,.iteration-two figcaption b{font-size:12px;line-height:1.5;color:#263c2e}.iteration-three figcaption span,.iteration-two figcaption span{font-size:11px;line-height:1.6;color:#5d6a61;margin-top:4px}.iteration-reason{display:grid;grid-template-columns:130px 1fr;gap:28px;margin-top:24px;align-items:start}.iteration-reason>b{font-size:12px;color:#395442}.iteration-reason p{font-size:13px;line-height:1.8;color:#5c695e;max-width:640px}.pageflow-case .sketch-grid{margin-top:20px;background:#f5f6f1}.pageflow-case .wireframe-grid{margin-top:20px;background:#f5f6f1}.pageflow-case .artifact-label{font-size:10px;color:#5d6a61;letter-spacing:.06em;margin-top:26px}.pageflow-case .wireframe-grid img,.pageflow-case .sketch-grid img{aspect-ratio:390/820;height:auto}.pageflow-case .brand-system>div{min-width:0}.pf-logo-lockup{display:flex;gap:16px;align-items:center;margin:28px 0}.pf-logo-lockup>span{width:84px;height:84px;border-radius:18px;padding:14px;background:#2e574a;display:grid;place-items:center}.pf-logo-lockup img{width:100%;height:auto}.pf-logo-lockup strong{font-size:clamp(28px,3vw,42px);font-weight:700;letter-spacing:-.055em;color:#244b3b}.pf-small{font-size:12px;line-height:1.8;color:#5d6a61;margin-top:20px}.pf-serif{font-family:Georgia,'Times New Roman',serif;letter-spacing:-.03em}.pf-icon-preview{display:flex;justify-content:space-between;gap:10px;background:#f0f4eb;border-radius:16px;padding:25px 20px;margin:26px 0}.pf-icon-preview svg{width:33px;height:33px;fill:none;stroke:#2e574a;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.pageflow-case .component-detail{background:#f2f5ee}.pageflow-case .component-detail svg{overflow:hidden}.pageflow-case .component-detail:hover{background:#e9efe3}.pageflow-case .product-screens{background:#f1f4ed}.pageflow-case .phone{background:#202923}.pageflow-case .phone:after{display:none}.pageflow-case .walkthrough{background:#edf2e6}.pageflow-case .video-shell{background:#243b2d}.pageflow-case .reflection-intro h2{font-size:clamp(35px,3.8vw,53px)}.pf-reflection-mark{display:flex;align-items:center;gap:18px;max-width:300px;flex-shrink:0}.pf-reflection-mark>img{width:85px;height:70px;background:#2e574a;padding:12px;border-radius:14px}.pf-reflection-mark>span{font-size:16px;font-weight:600;line-height:1.5;letter-spacing:-.03em;color:#365c46}.pageflow-case .takeaway-cards article:nth-child(1){background:#bfd6c1}.pageflow-case .takeaway-cards article:nth-child(2){background:#dde7bf}.pageflow-case .takeaway-cards article:nth-child(3){background:#f0dfaa}.pageflow-case .takeaway-cards article:nth-child(4){background:#bfdadb}.pageflow-case .takeaway-cards article:nth-child(5){background:#d4cfe5}.pageflow-case .takeaway-cards article:nth-child(6){background:#c3d4cb}.pageflow-case .takeaway-cards article>p{color:#20352a}.pageflow-case .takeaway-cards article span svg{width:19px;height:19px;fill:none;stroke:#2e574a;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.pageflow-case .reflection-next>span{background:#e2edda}.pageflow-case .source-details>div{background:#f2f5ed}.pageflow-case .source-details{color:#57654f}.pageflow-case .enlarge{background:#2e574a;color:#fff}
@media(max-width:1100px){.pf-reflection-mark{gap:10px;max-width:230px}.pf-reflection-mark>img{width:60px;height:58px}.pf-reflection-mark>span{font-size:13px}.iteration-three{gap:18px;padding:24px}.pf-reader-profile{grid-template-columns:85px 1fr}.pf-reader-profile .persona-question{grid-column:1/-1}}
@media(max-width:700px){.iteration-three{grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;padding:20px 14px}.iteration-three .phone,.iteration-two .phone{border-radius:19px;padding:4px}.iteration-three .phone img,.iteration-two .phone img{border-radius:15px}.iteration-three figcaption b{font-size:11px}.iteration-three figcaption span{font-size:10px}.iteration-two{gap:24px;padding:24px}.iteration-reason{grid-template-columns:1fr;gap:8px}.pageflow-case .reflection-intro{display:block}.pf-reflection-mark{margin-top:25px;max-width:none}.pf-reflection-mark>span{font-size:14px}}
@media(max-width:600px){.pageflow-case .pf-brand-banner{aspect-ratio:16/9}.pageflow-case .pf-brand-banner img{object-fit:contain}.pageflow-case .project-avatar{width:95px;height:95px;padding:13px;border-radius:22px}.pageflow-case .profile-description{font-size:16px}.pageflow-case .project-name h1{font-size:34px}.pageflow-case .pf-reader-profile{grid-template-columns:1fr}.reader-profile-symbol{width:60px;height:60px;border-radius:15px}.reader-profile-symbol svg{width:30px;height:30px}.pageflow-case .pf-reader-profile .persona-question{grid-column:auto}.iteration-case{margin-top:34px;padding-bottom:27px}.pageflow-case .process-intro h3{font-size:25px}.iteration-three{grid-template-columns:1fr;gap:25px;padding:22px}.iteration-three figure{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:18px;align-items:center}.iteration-three figure>button{max-width:none}.iteration-three figcaption{margin:0}.iteration-three figcaption b{font-size:13px}.iteration-three figcaption span{font-size:12px}.iteration-two{padding:20px 15px;gap:18px}.iteration-two figcaption b{font-size:11px}.iteration-two figcaption span{font-size:10px}.iteration-reason p{font-size:13px}.pf-logo-lockup strong{font-size:37px}.pf-logo-lockup>span{width:75px;height:75px}.pf-icon-preview{justify-content:space-around;padding:22px 15px}.pf-icon-preview svg{width:28px;height:28px}.pageflow-case .story-screens figure{min-width:0}.pageflow-case .story-screens figcaption b{font-size:9px}.pageflow-case .reflection-intro h2{font-size:33px}.pf-reflection-mark>img{width:68px;height:62px}.pageflow-case .product-screens{gap:23px 14px}.pageflow-case .takeaway-cards article>p{font-size:16px}}
@media(prefers-reduced-motion:reduce){.pageflow-case *{scroll-behavior:auto!important;transition:none!important}}
.pf-type-captures{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:25px 0}.pf-type-captures>div{min-width:0}.pf-type-captures b,.pf-type-captures span{display:block}.pf-type-captures b{font-size:12px}.pf-type-captures span{font-size:10px;color:#5d6a61;margin-top:3px}.pf-type-captures svg{display:block;width:100%;height:80px;margin-top:12px;overflow:hidden;border-radius:8px;background:#e6e9e3}.pf-native-icons{margin:26px 0;background:#e6e9e3;border-radius:16px;padding:12px 3px}.pf-native-icons svg{display:block;width:100%;height:auto;overflow:hidden}
.pf-recorded-screens{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;padding:32px;background:#f1f4ed;border-radius:18px}.pf-recorded-screens .phone{padding:5px;border-radius:27px}.pf-recorded-screens .phone img{border-radius:22px}.pf-recorded-screens figcaption b,.pf-recorded-screens figcaption span{display:block}.pf-recorded-screens figcaption b{font-size:12px}.pf-recorded-screens figcaption span{font-size:11px;color:#5d6a61}
@media(max-width:600px){.pf-recorded-screens{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 16px;padding:24px 17px}.pf-recorded-screens .phone{border-radius:22px}.pf-recorded-screens .phone img{border-radius:17px}}
.pageflow-case dialog.diagram-view .viewer-scroll{max-height:70vh;overflow:auto}.pageflow-case dialog.diagram-view .viewer-scroll img{width:1400px;min-width:1400px;max-width:none;max-height:none;height:auto}
@media(max-width:600px){.pageflow-case dialog.diagram-view .viewer-scroll{max-height:65vh}.pageflow-case dialog.diagram-view .viewer-scroll img{width:1100px;min-width:1100px}}
.pf-failure-state{display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:50px;align-items:center;margin-top:40px;padding:30px;background:#f2f5ee;border-radius:18px}.pf-failure-state h3{font-size:29px;margin-top:12px}.pf-failure-state p:not(.eyebrow){font-size:14px;line-height:1.8;color:#5d6a61;margin-top:18px}.pf-failure-state figcaption b,.pf-failure-state figcaption span{display:block;font-size:11px}.pf-failure-state figcaption span{font-size:10px;color:#5d6a61}.pf-failure-state .phone{padding:4px;border-radius:25px}.pf-failure-state .phone img{border-radius:21px}
@media(max-width:600px){.pf-failure-state{grid-template-columns:1fr;gap:25px;padding:24px}.pf-failure-state h3{font-size:25px}.pf-failure-state figure{max-width:210px;margin:auto}.pf-failure-state p:not(.eyebrow){font-size:13px}}
.pageflow-case .component-detail,.pageflow-case .component-detail:hover{background:#e6e9e3}.pageflow-case .component-detail:hover{box-shadow:inset 0 0 0 1px #2e574a40}
.pageflow-case .close-viewer{width:44px;height:44px;display:grid;place-items:center;top:5px;right:8px;padding:0}
.pageflow-case .product-note{border-left-color:#9bb99f}
