/* Black Friday is a special edition of the same illustrated book. */
:root { --edition-gold: #d9bc88; --edition-forest: #293f34; --edition-brown: #825e39; }
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.season-ribbon{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:42px;padding:9px 20px;color:#fff8e8;background:var(--edition-forest);font:600 .6875rem/1.45 var(--sans);letter-spacing:.025em;border-bottom:1px solid #a88d60}
.season-ribbon>span{display:flex;align-items:center;gap:7px}.season-ribbon>span:first-child{color:#e7cd9e}.season-ribbon strong{font-weight:700;white-space:nowrap;color:inherit}.season-ribbon .icon{width:14px;height:14px}.season-ribbon>span:last-child>.icon{display:none}
.site-header{height:68px}
.hero-copy{padding-top:22px}
.hero .eyebrow{margin-bottom:14px}
.hero h1{font-size:clamp(2.125rem,9.2vw,3.1rem);line-height:1.1}
.hero h1>em{margin-top:8px}
.hero-film{margin:20px -10px 27px;padding:0;isolation:isolate}
.film-intro{padding:0 8px 13px}
.film-eyebrow{display:flex;align-items:center;gap:7px;font:700 .5625rem/1.6 var(--sans);letter-spacing:.09em;color:#796040;margin-bottom:7px}
.film-eyebrow>span:last-child{margin-left:auto;font-size:.6875rem;font-weight:500;letter-spacing:0;color:#655d4e}
.film-dot{width:5px;height:5px;background:#9a7448;border-radius:50%;flex:none}
.film-intro h2{font:400 1.375rem/1.25 var(--serif);letter-spacing:-.015em;text-wrap:balance;margin:0;color:var(--ink)}
.film-intro>p:last-child{font-size:.875rem;line-height:1.5;color:#625647;margin-top:7px}
.hero-film-frame{border:4px solid #fff9e9;border-radius:4px 16px 16px 4px;box-shadow:0 0 0 1px #b79a6f,0 5px 0 #cfbd98,0 15px 30px #634b2c16}
.hero-film-play{background:linear-gradient(90deg,#293f3421,transparent 65%)}
.hero-film-invitation{left:23%;top:50%;gap:7px}
.hero-film-play-icon{width:62px;height:62px;background:#2c463bf2;color:#fff8e8;border:1px solid #e8d9b4;box-shadow:0 0 0 5px #fffaed57,0 7px 18px #2d392a30}
.hero-film-play:hover .hero-film-play-icon{background:#405c49;transform:scale(1.04)}
.hero-film-play-label{font-weight:700;font-size:.8125rem;padding:5px 10px}
.film-sound-hint{font:500 .5625rem/1.3 var(--sans);color:#fffaf0;text-shadow:0 1px 5px #263e33;background:#304638bd;padding:3px 5px;border-radius:3px}
.hero-film figcaption{margin:12px 0 0;padding:0 8px;font:italic 400 .875rem/1.5 var(--sans);color:#667052;transform:none}
.film-offer{margin-top:14px;padding:14px 9px 0;border-top:1px solid #cbb895}
.film-offer-price{display:flex;align-items:center;justify-content:space-between;gap:9px;margin:0 0 10px;line-height:1.3}
.edition-label{font:700 .5625rem/1.5 var(--sans);letter-spacing:.09em;color:#7b5935;position:relative;padding:5px 7px;background:#e8d6b5;border-radius:2px 7px 7px 2px}
.film-price-values{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.reference-price{color:#796a57;font-size:.8125rem}.reference-price del,.offer-reference del,.dock-prices del{text-decoration-thickness:1px;text-decoration-color:currentColor}
.film-price-values>strong{font:400 1.625rem/1 var(--serif);letter-spacing:-.035em;color:#293f34}
.film-payment{font-size:.6875rem;color:#625a4a}
.film-purchase{display:flex;width:100%;min-height:54px;font-size:1rem;gap:20px;box-shadow:0 3px 0 #172e21,0 7px 16px #293f3417}
.film-offer-note{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));text-align:center;font-size:.6875rem;line-height:1.5;color:#625c4c;margin:17px 0 0;gap:6px}
.film-offer-note>span{display:block}.film-offer-note>span+span{border-left:1px solid #d6c7ac}.film-offer-note strong{display:block;font:400 1.3125rem/1.25 var(--serif);color:#4c6248;margin-bottom:2px}
.hero-description{margin-top:24px}.hero-actions{margin-top:12px}.hero-details{margin-top:12px}
.hero-actions>.text-link{font-size:.9375rem;gap:10px}
.offer-edition{display:inline-flex;align-items:center;gap:8px;margin:22px 0 0;background:#304638;color:#f8e4bc;padding:8px 12px;border-radius:2px 9px 9px 2px;font:600 .75rem/1.4 var(--sans);letter-spacing:.015em}
.offer-edition .icon{width:16px;height:16px}
.offer-reference{font-size:.875rem;line-height:1.5;margin:20px 0 10px;color:#78684f}
.offer-reference del{margin-left:8px;color:#78684f;font-size:1.125rem}
.offer-card .price{margin-top:0;align-items:center;gap:12px}.price-number{font-size:5rem;line-height:1.1;letter-spacing:-.055em}
.offer-card .subscription-note{margin-top:5px}.offer-button{font-size:.9375rem;gap:12px}
.offer-card:target{outline:2px solid #a18252;outline-offset:6px}
.dock-edition{display:block;color:#e3c391;font-size:.5rem;letter-spacing:.08em;line-height:1.5;margin-top:4px}
.dock-prices{display:inline-flex;align-items:baseline;gap:7px}.dock-prices del{font-size:.6875rem;font-weight:400;color:#6b6b55}.dock-prices strong{font-weight:700;color:inherit;white-space:nowrap}
.button{transition:background .18s,box-shadow .18s,transform .18s}.button .icon{transition:transform .18s}.button:active{transform:translateY(2px);box-shadow:0 1px 0 #233a2a}.text-link .icon{transition:transform .18s}
.sample-step,.showroom-tabs [role=tab],.age-tabs button{transition:color .2s,background .2s,border-color .2s,box-shadow .2s}
.showroom-tabs [role=tab][aria-selected=true]{box-shadow:inset 0 -1px #8d6044}
.section-copy h2 em,.section-heading h2 em,.care-copy h2 em,.offer-copy h2 em,.faq h2 em,.learning-heading h3 em{background-image:linear-gradient(#b89a6361,#b89a6361);background-position:0 96%;background-size:0 2px;background-repeat:no-repeat;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.chapter-ink em{background-size:100% 2px!important;transition:background-size .65s cubic-bezier(.22,1,.36,1)}

@media(max-width:359px){
 .season-ribbon{padding-inline:14px;gap:7px;font-size:.625rem}.season-ribbon>span{gap:5px}.season-ribbon>span:last-child{font-size:0;gap:0}.season-ribbon strong{font-size:.6875rem}
 .hero-copy{padding-top:22px}.hero h1{font-size:2.125rem}.hero-film{margin-top:20px;margin-inline:-9px}
 .film-intro{padding-inline:6px}.film-intro h2{font-size:1.25rem}.film-intro>p:last-child{font-size:.8125rem}
 .hero-film-play-icon{width:50px;height:50px}.hero-film-play-label{font-size:.75rem}.film-sound-hint{font-size:.5rem}.hero-film-invitation{gap:6px}
 .film-offer{padding-inline:4px}.film-offer-price{gap:6px}.edition-label{font-size:.5rem;padding:5px}.film-price-values{gap:6px}.film-price-values>strong{font-size:1.5rem}.film-payment{font-size:.625rem}
 .film-purchase{font-size:.9375rem}.film-offer-note{font-size:.625rem}
 .mobile-purchase{gap:8px}.mobile-purchase .button{gap:6px;padding-inline:9px;font-size:.8125rem;max-width:none}.dock-prices{gap:5px}
 .offer-button{font-size:.875rem;padding-inline:12px;gap:9px}
}
@media(min-width:600px){
 .season-ribbon{padding-inline:40px;font-size:.8125rem;min-height:46px}.season-ribbon>span:last-child>.icon{display:block}
 .hero-film{margin-inline:0}.film-intro{padding:0 0 17px}.film-intro h2{font-size:1.875rem}.film-intro>p:last-child{font-size:1rem}.film-eyebrow{font-size:.625rem}
 .hero-film-play-icon{width:84px;height:84px}.hero-film-play-label{font-size:1rem}.film-sound-hint{font-size:.6875rem}
 .film-offer{padding-inline:0}.film-offer-price{margin-bottom:15px}.edition-label{font-size:.6875rem}.film-price-values>strong{font-size:2rem}.reference-price{font-size:1rem}.film-payment{font-size:.8125rem}.film-offer-note{font-size:.8125rem}
 .hero-film figcaption{font-size:1rem}
}
@media(min-width:1000px){
 .season-ribbon{padding-inline:max(6.5vw,40px)}.site-header{height:84px}
 .hero-copy{grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:0 50px;padding:54px 55px 100px;min-height:830px}
 .hero-copy>h1{font-size:clamp(3rem,4vw,4.1rem);line-height:1.1}.hero-copy>.eyebrow{margin-bottom:22px}
 .hero-copy>.hero-film{align-self:start;margin:0}.film-intro h2{font-size:clamp(1.625rem,2.2vw,2rem)}
 .hero-description{font-size:1.0625rem}.hero-reading-path{margin-top:19px}.hero-actions{margin-top:12px}
 .hero-film-play-icon{width:78px;height:78px}.film-purchase{min-height:56px}.hero-film figcaption{font-size:.9375rem}.film-offer-note{font-size:.75rem}
 .hero-note{margin-top:20px}.film-offer{padding-top:20px}
}
@media(hover:hover) and (pointer:fine){.button:hover .icon,.text-link:hover .icon{transform:translateX(4px)}.season-ribbon:hover>span:last-child>.icon{transform:translateX(3px)}.season-ribbon>span:last-child>.icon{transition:transform .18s}}
@media(prefers-reduced-motion:reduce){
 .button,.button .icon,.text-link .icon,.sample-step,.showroom-tabs [role=tab],.age-tabs button,.chapter-ink em{transition:none!important}
 .chapter-ink em{background-size:100% 2px}
}
