@font-face{font-family:EditorialItalic;src:url(assets/SourceSerif4-It.ttf) format('truetype');font-style:italic;font-weight:400;font-display:swap}
:root{--canvas:#f9f8ed;--ink:#202321;--muted:#51584f;--line:#d8d7c8;--lavender:#efdcf7;--forest:#124d43;--heading:Georgia,'Times New Roman',serif;--outer:clamp(10px,2.1vw,30px)}
html{scroll-padding-top:96px}
body{background:var(--canvas)}
h1,h2,.book-copy h2,.dialog-inner h2{font-family:var(--heading);font-weight:400;letter-spacing:-.055em;line-height:1.04}
.masthead{position:sticky;top:0;z-index:10;background:transparent;color:var(--ink);border:0;padding:14px var(--outer) 0}
.header-inner{width:min(100%,960px);min-height:64px;padding:7px 9px 7px 17px;border:1px solid #cfcebf;border-radius:14px;background:#faf9f0;box-shadow:0 4px 15px #182b2010}
.brand{font-size:1.08rem;letter-spacing:-.06em}
.brand-mark{border-color:#c3cabc;color:#124d43}
.brand-accent{color:#275c4d}
.header-inner nav{margin-left:auto;gap:4px;background:#edeee1;border:1px solid #dedfd1;border-radius:999px;padding:3px}
nav a{color:#313d35;padding:5px 13px;border-radius:999px;font-weight:600}
nav a:hover,nav a:focus-visible{background:#fffdf6;color:#15483d}
.head-cta,.hero .btn-hot,.closing .btn-hot{border:1px solid #292a27;background:var(--lavender);color:#28212a;box-shadow:0 2px 0 #28212a;border-radius:9px}
.head-cta:hover,.hero .btn-hot:hover,.closing .btn-hot:hover{background:#f5e9fa;color:#28212a}
.head-cta{padding:9px 13px;margin-bottom:2px}
.head-cta span{color:inherit}
.hero{position:relative;isolation:isolate;background:var(--canvas);color:var(--ink)}
.hero:before{content:"";position:absolute;inset:22% 0 6%;z-index:-1;background:url(assets/page-turn.svg) center 30%/100% auto no-repeat;pointer-events:none}
.hero-grid{display:block;min-height:0;padding:clamp(72px,9vw,131px) 0 52px;text-align:center}
.hero-copy{margin:auto;width:min(100%,720px)}
.hero .eyebrow{color:#4f594d;font-size:.74rem;letter-spacing:.15em}
.hero h1{font:400 clamp(4rem,8vw,7.25rem)/.93 var(--heading);letter-spacing:-.072em;margin:22px 0 0}
.hero h1 em{display:inline-block;color:#204e43;font:italic 400 1em/1.02 EditorialItalic,var(--heading);letter-spacing:-.075em}
.hero-lead{margin:22px auto 23px;max-width:32rem;color:#414b42;font-size:1.06rem;line-height:1.55}
.hero .btn-hot{min-height:49px;padding-inline:19px}
.hero-note{color:#555e51;font-size:.79rem;margin-top:15px}
.hero-art{display:flex;align-items:center;justify-content:center;gap:clamp(12px,3.4vw,50px);height:auto;max-width:665px;margin:44px auto 0;padding:6px 10px 7px}
.hero-art:before{display:none}
.hero-cover{position:relative;inset:auto;width:clamp(58px,11.5vw,125px);flex:0 0 auto;transform:rotate(var(--angle));border-radius:2px 5px 5px 2px;box-shadow:7px 9px 17px #17262037}
.hc-0{--angle:-7deg}.hc-1{--angle:-2deg}.hc-2{--angle:3deg}.hc-3{--angle:7deg}
.finder,.book,.author,.faq,.closing{margin:0 var(--outer) clamp(12px,2vw,26px);border-radius:clamp(19px,3.7vw,53px)}
.finder{background:var(--forest);color:#fdf9e7;border:0;padding:clamp(45px,6vw,78px) 0}
.finder .section-heading{text-align:center;margin:0 auto 29px}
.finder .section-heading h2{font-size:clamp(2.65rem,5.3vw,4.7rem);letter-spacing:-.058em}
.finder .section-heading>p{color:#e5ece2}
.finder .eyebrow span{color:#e0d7a5}
.finder-grid{gap:11px}
.route{background:#faf7e8;border:1px solid #e7dfc8;color:#202321;border-radius:14px;padding:21px 18px 13px 13px}
.route:hover{background:#fffdf3;border-color:#dfb5e8}
.route-arrow{right:9px}
.book{border:1px solid var(--world-rule);overflow:clip;padding:clamp(43px,7vw,96px) 0}
.book-grid{grid-template-columns:minmax(0,.85fr) minmax(0,1.08fr);gap:clamp(28px,6vw,90px)}
.book-copy h2{font-size:clamp(2.7rem,4.95vw,4.85rem);letter-spacing:-.052em;margin-top:14px}
.book .book-art{border-radius:24px}

.book .btn{border-radius:9px}
.book .btn-plain{border-color:var(--world-muted)}
.book .try{border-radius:0 10px 10px 0}
.sample>summary{min-height:48px}
.author{background:#e8eee2;color:#1c3128;padding:clamp(46px,7vw,86px) 0}
.author .eyebrow,.author p:not(.eyebrow),.author-portrait span{color:#3d5447}
.author .eyebrow span{color:#365d4c}
.author h2{font-size:clamp(2.9rem,5.8vw,5rem)}
.author .btn{background:#faf9ee;border-color:#53695e;border-radius:9px}
.faq{background:#f0eee2;padding:clamp(38px,6vw,73px) 0}
.faq h2{font-size:clamp(2.8rem,5vw,4.35rem)}
.closing{background:#ded3e9;color:#28232e;text-align:center;padding:48px 0}
.closing-inner{display:grid;justify-content:center;justify-items:center;gap:23px}
.closing h2{font-size:clamp(2.9rem,6vw,5rem)}
.closing .eyebrow,.closing .eyebrow span{color:#514457}
.closing .btn-hot{background:#f8f3eb}
footer{background:transparent;color:#404940;border-top:1px solid #d8dbce}
footer a{color:#274c41}
@media(max-width:1000px){.hero-art{height:auto}}
@media(max-width:740px){
 html{scroll-padding-top:84px}
 .masthead{padding-top:8px}
 .header-inner{min-height:56px;padding:5px 8px 5px 12px}
 .header-inner nav{gap:0;padding:2px}
 nav a{padding:5px 9px}
 .hero-grid{padding:64px 0 39px}
 .hero h1{font-size:clamp(3.1rem,12.4vw,5.4rem);letter-spacing:-.067em}
 .hero-lead{margin:18px auto 19px;font-size:.97rem}
 .hero-art{max-width:100%;aspect-ratio:auto;margin-top:29px}
 .hero:before{inset:26% 0 7%;background-size:auto 100%}
 .finder,.book,.author,.faq,.closing{margin-inline:var(--outer)}
 .finder-grid{gap:8px}
 .route{min-height:97px}
 .book-grid{grid-template-columns:1fr;gap:25px}
 .book-copy h2{font-size:clamp(2.4rem,9.8vw,4.1rem)}
 .book .book-art{border-radius:16px}

}

/* Give both title lines room on narrow screens. */
@media(max-width:560px){.finder-grid{grid-template-columns:1fr}}

/* Original PowerUpSkills brand lockup. */
.hero{background:#fff;color:#171717}
.hero:before{display:none}
.hero-grid{padding-top:clamp(48px,7vw,96px)}
.hero-copy{width:min(100%,760px)}
.hero .eyebrow{color:#343434;letter-spacing:.15em}
.hero h1{margin:12px auto 0}
.hero-lockup{width:min(100%,726px);height:auto;margin-inline:auto}
.hero-lead{margin-top:8px;color:#333}
.hero-note{color:#525252}
.hero .btn-hot,.head-cta{background:#ff5b29;border-color:#1d1715;color:#181310}
.hero .btn-hot:hover,.head-cta:hover{background:#ff7c52;color:#181310}
.brand-mark,.brand-accent{color:#a93216}
.brand-mark{border-color:#e9c6ba}
@media(max-width:740px){
 .hero-grid{padding-top:44px}
 .hero h1{margin-top:11px}
 .hero-lead{margin-top:12px}
}
