.coloring-home{background:#f4f1ea;padding-top:36px;padding-bottom:48px}
.coloring-home-intro{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:8%;margin-bottom:38px}
.coloring-home h2,.coloring-opening-lead{font:clamp(2rem,3.6vw,3rem)/1.15 Georgia,serif;letter-spacing:-.025em}
.coloring-home-intro>div{max-width:680px}.coloring-home-intro p{max-width:43ch;color:var(--muted)}
.coloring-home .format-note,.coloring-opening .format-note{font-size:.875rem!important;font-weight:600;letter-spacing:.02em;color:#176a70!important}
.coloring-home-art{display:flex;justify-content:center;align-items:center}
.coloring-home-art{min-width:0;width:100%}.coloring-home-art img{width:100%;max-width:660px;max-height:none;height:auto;aspect-ratio:auto;object-fit:contain;margin:auto}
.coloring-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7%;padding-top:36px;border-top:1px solid #c8c3b8}
.coloring-card{min-width:0;display:flex;flex-direction:column}
.coloring-card-cover{display:block;max-width:240px;transition:transform .18s ease}
.coloring-card-cover:hover{transform:translateY(-4px)}
.coloring-card-cover img{width:100%;aspect-ratio:17/22;object-fit:contain;box-shadow:0 9px 20px #00000018}
.coloring-card h3{font:1.5rem/1.2 Georgia,serif;margin:0 0 10px}
.coloring-count{font-size:.875rem;color:var(--muted);margin-bottom:10px}
.coloring-opening{padding:30px 6% 38px;max-width:1080px}
.coloring-opening .breadcrumbs{margin-bottom:30px}
.coloring-opening .eyebrow{color:#176a70;margin-bottom:16px}
.coloring-opening h1{font:clamp(2.5rem,5vw,4.5rem)/1.08 Georgia,serif;margin-bottom:20px;letter-spacing:-.04em}
.coloring-opening-lead{font-size:1.8rem;margin-bottom:18px}
.coloring-opening>p:last-of-type{color:var(--muted);max-width:65ch;font-size:1.0625rem}
.coloring-jump{gap:12px 26px;margin-top:26px}
.coloring-jump a{padding:10px 0;border-bottom:1px solid #176a7060;min-height:44px}
.coloring-jump a:hover{color:#176a70}
.coloring-volumes{padding:0 6%}
.coloring-volume{display:grid;grid-template-columns:minmax(180px,.65fr) minmax(0,1.35fr);gap:8%;padding:44px 0;border-top:1px solid var(--line);scroll-margin-top:25px}
.coloring-volume-cover{max-width:310px;width:100%}
.coloring-volume-cover img{width:100%;box-shadow:0 12px 28px #00000018}
.coloring-volume-copy{align-self:center;max-width:710px;min-width:0}
.coloring-volume-copy h2{font:clamp(2rem,3.2vw,3rem)/1.12 Georgia,serif;letter-spacing:-.025em;margin-bottom:22px}
.coloring-volume-copy .eyebrow{color:#176a70;margin-bottom:16px}
.coloring-volume-copy>p:not(.eyebrow):not(.story-lead):not(.purchase-note){font-size:1.0625rem;line-height:1.8;color:var(--muted)}
.coloring-volume .book-facts{font-size:.9375rem;margin-bottom:0}
.coloring-editions{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:16px}
.coloring-volume-copy .book-details-link{display:inline-block;margin-top:18px}
.coloring-detail .story-description h2,.coloring-detail-editions>h2{font:1.65rem/1.25 Georgia,serif;margin:30px 0 14px}
.coloring-detail-editions{margin-top:26px}
.coloring-detail-edition{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px 0;border-top:1px solid var(--line)}
.coloring-detail-edition:last-child{border-bottom:1px solid var(--line)}
.coloring-detail-edition h3{font:1.25rem/1.25 Georgia,serif;margin:0 0 5px}
.coloring-detail-edition p{margin:0;color:var(--muted)}
.edition-identifiers{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:.78rem!important;margin-top:8px!important;letter-spacing:.03em}
.coloring-detail-edition .button{flex:0 0 auto}
.coloring-previews{margin:12px 6% 40px;padding:38px 0 12px;border-top:1px solid var(--line)}
.coloring-previews-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,.7fr);gap:8%;align-items:end;margin-bottom:26px}
.coloring-previews-heading h2{font:clamp(2rem,3.4vw,3rem)/1.12 Georgia,serif;letter-spacing:-.025em;margin:0}
.coloring-previews-heading p{margin:0;color:var(--muted);line-height:1.65}
.coloring-preview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3.5%}
.coloring-preview{margin:0;min-width:0}
.coloring-preview a{display:block;background:#fff;border:1px solid #d8d2c8;padding:10px;transition:transform .18s ease,box-shadow .18s ease}
.coloring-preview a:hover{transform:translateY(-4px);box-shadow:0 14px 30px #00000018}
.coloring-preview a:focus-visible{outline:3px solid #176a70;outline-offset:4px}
.coloring-preview img{display:block;width:100%;height:auto;aspect-ratio:17/22;object-fit:contain;background:#fff}
.coloring-preview figcaption{font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:11px}
.coloring-preview-note{font-size:.78rem;color:var(--muted);margin:24px 0 0}
.coloring-back{margin:18px 6% 0;padding:30px 0 48px;border-top:1px solid var(--line)}
.coloring-back h2{font:2rem/1.2 Georgia,serif;margin-bottom:18px}
.coloring-weird-entry{margin:0 6% 48px;padding:28px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.coloring-weird-entry h2{font:2rem Georgia,serif;margin-bottom:14px}
.coloring-weird-entry p{max-width:62ch;color:var(--muted)}
@media(max-width:700px){.coloring-cards{gap:24px}.coloring-card h3{font-size:1.3rem}.coloring-card .book-number{font-size:.75rem}.coloring-volume{gap:6%;grid-template-columns:minmax(150px,.65fr) minmax(0,1.35fr)}}
@media(max-width:600px){.coloring-home-intro{grid-template-columns:1fr;gap:24px}.coloring-cards{grid-template-columns:1fr;gap:30px}.coloring-card{display:grid;grid-template-columns:105px minmax(0,1fr);column-gap:20px;align-content:start}.coloring-card-cover{grid-column:1;grid-row:1/5}.coloring-card .book-number,.coloring-card h3,.coloring-card .coloring-count,.coloring-card .book-details-link{grid-column:2;margin-top:0}.coloring-card .book-number{margin-bottom:8px;line-height:1.4}.coloring-card .book-details-link{align-self:start;margin-top:0;padding-top:0}.coloring-opening{padding-top:26px}.coloring-opening h1{font-size:2.6rem}.coloring-opening-lead{font-size:1.6rem}.coloring-jump{gap:4px 20px}.coloring-volume{grid-template-columns:1fr;gap:30px;padding:32px 0}.coloring-volume-cover{max-width:230px}.coloring-volume-copy h2{font-size:2rem}.coloring-volume-copy .story-lead{font-size:1.25rem}.coloring-volume-copy>p:not(.eyebrow):not(.story-lead):not(.purchase-note){font-size:1rem}.coloring-back h2{font-size:1.75rem}.coloring-home-art img{max-width:430px;max-height:none;aspect-ratio:auto;margin:auto}.coloring-editions .button{gap:12px}.coloring-detail-edition{align-items:flex-start;flex-direction:column;gap:14px}.coloring-detail-edition .button{width:100%;justify-content:space-between}.coloring-previews{margin-top:4px;padding-top:30px;overflow:hidden}.coloring-previews-heading{grid-template-columns:1fr;gap:12px;margin-bottom:22px}.coloring-preview-grid{grid-template-columns:none;grid-auto-columns:82%;grid-auto-flow:column;gap:16px;overflow-x:auto;padding:3px 6px 18px 1px;scroll-snap-type:x mandatory;overscroll-behavior-inline:contain}.coloring-preview{scroll-snap-align:start}.coloring-preview-note{margin-top:10px}}
@media(prefers-reduced-motion:reduce){.coloring-preview a{transition:none}}
@media(prefers-reduced-motion:reduce){.coloring-card-cover{transition:none}}

/* White collection lettering follows the classic WEIRDVERSVM panoramic header. */
.coloring-banner{position:relative;isolation:isolate}
.coloring-banner::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 35%,rgba(0,15,20,.65) 100%)}
.coloring-banner-title{position:absolute;z-index:1;right:6%;bottom:7%;width:clamp(210px,35vw,420px);max-width:65%;line-height:1}
.coloring-banner .coloring-banner-title img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain;filter:none;mix-blend-mode:normal}
@media(max-width:600px){.coloring-banner-title{width:clamp(155px,47vw,235px);right:5%;bottom:6%;max-width:62%}}

/* Samsung Internet can expose a desktop-sized viewport on a phone. */
@media(max-width:1000px),(hover:none) and (pointer:coarse){.coloring-home-intro{grid-template-columns:1fr;gap:24px}.coloring-home-art img{max-width:660px;max-height:none;aspect-ratio:auto;margin:auto}}
