body.playbook-example-page{--pb12-ink:#112a38;--pb12-deep:#0b202d;--pb12-teal:#26756c;--pb12-gold:#cbb274;--pb12-paper:#f3f1e8;--pb12-muted:#a9bcb8;overflow-x:hidden}
.playbook-example-page .pb12-hero{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(350px,.78fr);gap:8%;align-items:center;padding:74px max(7vw,32px) 82px;background:radial-gradient(ellipse at 10% 0,#34505b70,transparent 55%),var(--pb12-deep);color:#edf0e5;border-bottom:1px solid #cbb27452}
.pb12-hero-copy{max-width:670px}.pb12-back,.pb12-quiet-link{color:#d5c28e;text-decoration:none}.pb12-back{font-size:13px}.pb12-back:hover,.pb12-quiet-link:hover{text-decoration:underline}.pb12-eyebrow{font-size:11px;font-weight:700;letter-spacing:.16em;color:#c8b276;margin:34px 0 13px}.pb12-hero h1,.pb12-section-intro h2,.pb12-path h2{font-family:var(--font-heading);font-size:clamp(43px,6vw,76px);letter-spacing:-.055em;line-height:.99;margin:0;color:#f1efe5}.pb12-hero h1 span,.pb12-section-intro h2 span,.pb12-path h2 span{color:#b6c8b8}.pb12-lede{font-size:18px;line-height:1.75;color:#c1cfca;max-width:590px;margin:26px 0}.pb12-hero-note{display:flex;gap:13px;align-items:flex-start;max-width:570px;padding:15px 17px;border:1px solid #d4bd7840;background:#f0e4c60b;border-radius:4px}.pb12-hero-note>span{color:#d6bf81;font-size:20px}.pb12-hero-note p{font-size:13px;line-height:1.7;color:#c4d0c9;margin:0}.pb12-hero-note strong{color:#f0e7c9}.pb12-hero-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:27px}.pb12-button{display:inline-flex;align-items:center;gap:15px;padding:15px 20px;background:#d3bd83;color:#152d35;text-decoration:none;font-weight:700;font-size:14px;border-radius:3px;transition:transform .2s ease,background .2s ease}.pb12-button:hover{transform:translateY(-2px);background:#e0ce9f}.pb12-cover{max-width:480px;width:100%;justify-self:center;position:relative;aspect-ratio:.82;padding:25px 28px 22px;background:linear-gradient(145deg,#fbf7e9,#dce4d8);color:#23403e;box-shadow:15px 25px 48px #0005;border:1px solid #fff9;transform:rotate(1.5deg);display:flex;flex-direction:column}.pb12-cover::before{content:"";position:absolute;inset:13px;border:1px solid #49665b35;pointer-events:none}.pb12-cover-top{display:flex;justify-content:space-between;font-size:8px;letter-spacing:.12em;color:#7a7155}.pb12-cover-mark{margin:clamp(36px,6vw,72px) 0 17px;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#1b5550;color:#e5d19a;font:600 26px var(--font-heading)}.pb12-cover-mark span{font-size:12px;vertical-align:top}.pb12-cover-label{font-size:9px;letter-spacing:.16em;color:#97794a;margin:0 0 8px}.pb12-cover h2{font:600 clamp(34px,4vw,48px)/1 var(--font-heading);letter-spacing:-.05em;margin:0 0 13px}.pb12-cover>p:not(.pb12-cover-label){font-size:13px;line-height:1.65;color:#536961;margin:0;max-width:270px}.pb12-cover-lines{display:grid;gap:11px;margin-top:auto;padding-top:22px;border-top:1px solid #344f4630;font-size:9px;letter-spacing:.1em;color:#756b4c}.pb12-cover>small{position:relative;margin-top:20px;font-size:8px;letter-spacing:.1em;color:#718078}
.pb12-story{padding:96px max(7vw,30px) 105px;background:#e8e9df;color:#263f3e}.pb12-section-intro{max-width:700px;margin-bottom:42px}.pb12-section-intro .pb12-eyebrow{margin:0 0 14px;color:#8a7445}.pb12-section-intro h2,.pb12-path h2{font-size:clamp(38px,4.5vw,58px);color:#17383b;line-height:1.04}.pb12-section-intro h2 span{color:#55857a}.pb12-section-intro>p:last-child{font-size:16px;line-height:1.75;color:#586d65;max-width:600px;margin:19px 0 0}.pb12-story-layout{display:grid;grid-template-columns:minmax(220px,.68fr) minmax(0,1.32fr);gap:34px;align-items:start}.pb12-story-nav{display:grid;border-top:1px solid #536d6135}.pb12-story-nav button{border:0;border-bottom:1px solid #536d6135;background:transparent;color:#53695f;padding:17px 10px;display:grid;grid-template-columns:30px 1fr 20px;gap:9px;align-items:center;text-align:left;cursor:pointer;font:inherit;min-height:76px}.pb12-story-nav button>span:first-child{align-self:start;padding-top:3px;font:11px var(--font-heading);color:#927b4b}.pb12-story-nav button strong,.pb12-story-nav button small{display:block}.pb12-story-nav button strong{font-size:14px;color:#334c46}.pb12-story-nav button small{font-size:11px;line-height:1.5;margin-top:4px;color:#77857b}.pb12-story-nav button i{font-style:normal;opacity:0;transition:opacity .2s}.pb12-story-nav button.is-active{background:#f5f4eb}.pb12-story-nav button.is-active strong{color:#145d54}.pb12-story-nav button.is-active i{opacity:1;color:#957a44}.pb12-story-nav button:focus-visible,.pb12-toc a:focus-visible{outline:3px solid #26756c;outline-offset:2px;position:relative;z-index:1}.pb12-screen-wrap{min-width:0}.pb12-screen{background:#f5f4ec;border:1px solid #c8d0c3;box-shadow:0 22px 42px #173b311c;overflow:hidden}.pb12-screen-head{height:56px;padding:0 18px;border-bottom:1px solid #d8ddd2;display:flex;align-items:center;justify-content:space-between}.pb12-app-brand{display:flex;align-items:center;gap:9px;color:#29433d;font-size:13px}.pb12-mini-mark{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#1e5f55;color:#e6d198;font-size:12px}.pb12-concept-chip{font-size:8px;letter-spacing:.11em;color:#8e784a;border:1px solid #c5b37e;padding:6px 8px}.pb12-screen-content{display:grid;grid-template-columns:150px minmax(0,1fr);min-height:340px}.pb12-screen-side{padding:22px 14px;background:#e9eee5;border-right:1px solid #d9dfd4}.pb12-screen-side>span{display:block;font-size:8px;letter-spacing:.12em;color:#75847b;margin-bottom:12px}.pb12-screen-side strong{display:block;font-size:12px;color:#294b42;margin-bottom:19px}.pb12-screen-side a{display:block;padding:9px;font-size:10px;color:#718178;text-decoration:none;border-radius:2px}.pb12-screen-side a.selected{background:#d1e0d4;color:#245c50}.pb12-screen-main{padding:25px clamp(17px,3vw,34px)}.pb12-screen-kicker{font-size:8px;letter-spacing:.12em;color:#98804d}.pb12-screen-main h3{font:600 clamp(23px,3vw,32px)/1.15 var(--font-heading);letter-spacing:-.03em;color:#1e413d;margin:12px 0 9px}.pb12-screen-main>p{font-size:12px;line-height:1.65;color:#65776d;max-width:500px;margin:0}.pb12-mock-card{margin-top:18px;padding:15px 16px;background:#fff;border:1px solid #dce1d7;box-shadow:0 5px 13px #183c3210}.pb12-mock-card-top,.pb12-mock-foot{display:flex;justify-content:space-between;gap:12px;align-items:center}.pb12-mock-card-top{font-size:8px;letter-spacing:.1em;color:#877448}.pb12-mock-card-top span:last-child{color:#829087}.pb12-mock-card>strong{display:block;font:600 18px var(--font-heading);color:#25433d;margin:12px 0 4px}.pb12-mock-card>p{font-size:10px;line-height:1.5;color:#6d7d72;margin:0}.pb12-progress{height:4px;background:#e4e8df;margin:15px 0 9px;border-radius:3px;overflow:hidden}.pb12-progress span{display:block;width:0;height:100%;background:#328276;transition:width .3s ease}.pb12-mock-foot{font-size:9px;color:#738179}.pb12-mock-foot span:last-child{font-size:8px;letter-spacing:.08em;color:#2e7165}.pb12-screen-caption{margin-top:13px!important;font-size:10px!important;font-style:italic;color:#879087!important}.pb12-story-caption{padding:18px 2px 0}.pb12-story-caption>span{font-size:9px;letter-spacing:.12em;color:#947d4b}.pb12-story-caption>p{font-size:13px;line-height:1.65;color:#52665d;max-width:700px;margin:9px 0}.pb12-story-caption .pb12-value-line{display:flex;gap:12px;padding-top:10px;border-top:1px solid #b9c7b8}.pb12-value-line b{flex:0 0 90px;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#2c6056}.pb12-value-line span{font-size:12px}
.pb12-decisions{padding:96px max(7vw,30px) 102px;background:#f5f3e9;color:#1b3938}.pb12-decisions .pb12-section-intro{margin-bottom:30px}.pb12-toc{padding:19px 21px;background:#e7e8dd;border-left:3px solid #b79d61;margin-bottom:30px}.pb12-toc>strong{display:block;font-size:11px;letter-spacing:.08em;color:#39584e;margin-bottom:12px}.pb12-toc>div{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}.pb12-toc a{padding:6px 7px;text-decoration:none;color:#51675e;font-size:10px;line-height:1.35;border-radius:2px}.pb12-toc a:hover{background:#d8e2d7;color:#1d6259}.pb12-toc a span{display:inline-block;margin-right:5px;color:#9a8048;font-variant-numeric:tabular-nums}.pb12-sections{border-top:1px solid #cdd5c8}.pb12-sections>section{display:grid;grid-template-columns:48px minmax(0,1fr);gap:13px;padding:21px 8px;border-bottom:1px solid #d8ddd2;scroll-margin-top:90px}.pb12-sections>section>span{font:12px var(--font-heading);color:#9a8049;padding-top:3px}.pb12-sections h3{font:600 18px/1.35 var(--font-heading);color:#294b43;margin:0 0 5px}.pb12-sections p{max-width:890px;font-size:14px;line-height:1.72;color:#586b62;margin:0}.pb12-sections b{color:#35574c}.pb12-path{display:flex;align-items:center;justify-content:space-between;gap:40px;padding:72px max(7vw,30px);background:radial-gradient(ellipse at 80% 30%,#31535955,transparent 55%),#102b37;color:#dce8df}.pb12-path .pb12-eyebrow{margin:0 0 13px}.pb12-path h2{font-size:clamp(34px,4vw,51px);color:#f0eee2}.pb12-path h2 span{color:#c3d2c2}.pb12-path>div>p:not(.pb12-eyebrow){max-width:730px;font-size:15px;line-height:1.75;color:#c1d0c8;margin:18px 0 0}.pb12-path em{font-style:normal;color:#dfc785;font-weight:700;white-space:nowrap}.pb12-path .pb12-path-note{font-size:12px!important;color:#93aca5!important}.pb12-path>.pb12-button{flex:0 0 auto}
@media(max-width:900px){.playbook-example-page .pb12-hero{grid-template-columns:1fr minmax(270px,.7fr);gap:5%;padding-inline:6%}.pb12-story,.pb12-decisions,.pb12-path{padding-inline:6%}.pb12-story-layout{grid-template-columns:1fr;gap:20px}.pb12-story-nav{grid-template-columns:1fr 1fr;border-left:1px solid #536d6135}.pb12-story-nav button{border-left:0;padding-inline:13px}.pb12-toc>div{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:620px){.playbook-example-page .pb12-hero{grid-template-columns:1fr;padding:34px 22px 54px;gap:39px}.pb12-hero .pb12-eyebrow{margin-top:27px}.pb12-hero h1{font-size:clamp(42px,12vw,62px)}.pb12-lede{font-size:16px}.pb12-cover{max-width:390px;aspect-ratio:.94;padding:23px}.pb12-cover-mark{margin-top:37px}.pb12-story,.pb12-decisions{padding:66px 22px}.pb12-section-intro h2{font-size:40px}.pb12-story-nav{grid-template-columns:1fr}.pb12-story-nav button{min-height:67px}.pb12-screen-content{grid-template-columns:1fr;min-height:0}.pb12-screen-side{display:none}.pb12-screen-main{padding:22px 17px}.pb12-screen-main h3{font-size:27px}.pb12-screen-main>p{font-size:12px}.pb12-mock-card{padding:13px}.pb12-story-caption .pb12-value-line{display:block}.pb12-value-line b{display:block;margin-bottom:4px}.pb12-toc{padding:15px}.pb12-toc>div{grid-template-columns:repeat(2,minmax(0,1fr));gap:3px}.pb12-toc a{font-size:11px;padding:8px 5px}.pb12-sections>section{grid-template-columns:33px minmax(0,1fr);gap:9px;padding:18px 2px}.pb12-sections h3{font-size:17px}.pb12-sections p{font-size:13px}.pb12-path{display:block;padding:55px 22px}.pb12-path h2{font-size:36px}.pb12-path>.pb12-button{margin-top:22px}}
@media(prefers-reduced-motion:reduce){.playbook-example-page *, .playbook-example-page *::before,.playbook-example-page *::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}