:root{--ink:#171412;--red:#f32820;--orange:#ff782d;--yellow:#ffc528;--line:#d7d0c8;--paper:#fff;--soft:#fff8ea}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--paper);font:16px/1.55 Arial,Helvetica,sans-serif}
img{display:block;max-width:100%}
a{color:inherit}
a:focus-visible{outline:3px solid #122f42;outline-offset:5px}
.wrap{width:min(1120px,calc(100% - 48px));margin-inline:auto}
.skip-link{position:absolute;left:16px;top:-100px;z-index:20;padding:10px 16px;background:#fff;border:2px solid var(--ink)}
.skip-link:focus{top:12px}
.banner-art,.inner-banner,.inner-bottom{background-repeat:no-repeat;background-size:cover;overflow:hidden}
.banner-art{position:relative;background-color:#fff}
.banner-art-top{height:clamp(150px,19vw,295px);background-image:url("assets/banner-top-outline.webp");background-position:left top}
.banner-art-bottom{height:clamp(160px,19vw,290px);background-image:url("assets/banner-bottom-outline.webp");background-position:right bottom}
.colour-layer{position:absolute;inset:0;display:block;background-repeat:no-repeat;background-size:inherit;background-position:inherit;opacity:1}
.art-managed .banner-art:not(.art-active):not(.art-fallback) .colour-layer{opacity:0}
.art-active .colour-layer{animation:colour-in .85s ease-out both}
.art-fallback.banner-art-top{background-image:url("assets/banner-top.webp")}
.art-fallback.banner-art-bottom{background-image:url("assets/banner-bottom.webp")}
.art-fallback .colour-layer{display:none}
.site-header{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:12px 0;border-bottom:1px solid var(--line)}
.header-brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-weight:900;letter-spacing:-.04em}
.header-brand img{width:48px;height:48px;object-fit:contain}
.site-header nav{display:flex;gap:30px;align-items:center}
.site-header nav a{font-size:.9rem;font-weight:800;text-decoration:none;text-underline-offset:5px}
.site-header nav a:hover,.site-header nav a[aria-current="page"]{text-decoration:underline;text-decoration-thickness:3px;text-decoration-color:var(--red)}
.home-main{min-height:390px;display:grid;grid-template-columns:270px 1fr;gap:48px;align-items:center;padding-block:24px 38px}
.home-logo{display:flex;justify-content:center}
.home-logo img{width:min(100%,242px);height:auto}
.overline{margin:0 0 11px;color:#b9221c;font-size:.72rem;line-height:1.35;letter-spacing:.16em;text-transform:uppercase;font-weight:900}
.home-copy h1,.page-heading h1,.book-details h2,.sample-heading h2,.social-entry h2{font-family:"Arial Black",Arial,Helvetica,sans-serif;font-weight:900;letter-spacing:-.055em;line-height:1.03}
.home-copy h1{font-size:clamp(2.7rem,4.7vw,4.7rem);margin:0 0 15px}
.home-subtitle{font-size:1.1rem;margin:0 0 26px}
.home-actions{display:flex;flex-wrap:wrap;gap:13px}
.colour-controls{display:flex;flex-wrap:wrap;gap:19px;margin-top:20px}.motion-toggle,.replay-toggle{padding:3px 0;border:0;border-bottom:2px solid var(--ink);background:transparent;color:var(--ink);font:800 .82rem Arial,Helvetica,sans-serif;cursor:pointer}
.motion-toggle:hover,.replay-toggle:hover{border-bottom-color:var(--red)}
.motion-toggle:focus-visible,.replay-toggle:focus-visible{outline:3px solid #122f42;outline-offset:5px}
.motion-paused .colour-layer,.art-page-hidden .colour-layer{animation-play-state:paused}
.action{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;min-height:54px;padding:12px 19px;text-decoration:none;font-weight:900;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);transition:transform .2s,box-shadow .2s}
.action:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink)}
.action-red{background:#d51c15;color:#fff}
.action-outline{background:#fff;color:var(--ink)}
.site-footer{display:flex;justify-content:space-between;gap:20px;padding-block:17px 24px;font-size:.76rem;font-weight:800}
.site-footer a{text-decoration:none}
.site-footer a:hover{text-decoration:underline;text-underline-offset:4px}
.inner-banner{height:155px;background-image:url("assets/banner-top.webp");background-position:center 22%}
.inner-bottom{height:145px;margin-top:60px;background-image:url("assets/banner-bottom.webp");background-position:center bottom}
.inner-main{padding-top:28px}
.back-link{display:inline-block;font-size:.84rem;font-weight:900;text-decoration:none}
.back-link:hover{text-decoration:underline}
.page-heading{padding-block:55px 60px}
.page-heading h1{font-size:clamp(3.2rem,6.8vw,6.8rem);margin:0 0 12px}
.period{color:var(--red)}
.page-heading>p:last-child{font-size:1.14rem;margin:0;max-width:560px}
.book-entry{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center;border-top:3px solid var(--ink);padding-block:55px}
.book-entry-reverse .book-image{order:2}
.book-entry-reverse .book-details{order:1}
.book-image{min-height:520px;display:grid;place-items:center;padding:42px}
.road-image{background:#ffe8b5}
.digger-image{background:#fff1da}
.book-image img{width:auto;max-height:460px;box-shadow:11px 13px 0 #17141224}
.entry-number{display:block;color:#b9221c;font-size:.75rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase}
.book-details h2{font-size:clamp(3rem,5.1vw,5.5rem);margin:20px 0}
.book-details>p{font-size:1.08rem;max-width:440px;margin:0 0 24px}
.book-facts{display:flex;gap:10px;margin-bottom:30px;flex-wrap:wrap}
.book-facts span{border:1.5px solid var(--ink);padding:5px 11px;font-weight:800;font-size:.78rem}
.social-list{display:grid;grid-template-columns:1fr 1fr;border-top:3px solid var(--ink);border-bottom:3px solid var(--ink)}
.social-entry{padding:48px 38px 55px 0}
.social-entry+ .social-entry{border-left:1px solid var(--line);padding-left:38px}
.social-entry h2{font-size:clamp(2.7rem,4.4vw,4.5rem);margin:17px 0}
.social-entry p{max-width:350px;min-height:57px}
.pending{display:inline-block;border-bottom:3px solid var(--yellow);padding-bottom:4px;font-weight:800;font-size:.9rem}
.social-next{display:flex;align-items:center;justify-content:space-between;gap:25px;padding-top:55px}
.social-next p{font-size:1.1rem;font-weight:700;margin:0}
@keyframes colour-in{from{opacity:0}to{opacity:1}}
@media(max-width:800px){.home-main{grid-template-columns:180px 1fr;gap:28px}.home-logo img{width:180px}.home-copy h1{font-size:clamp(2.35rem,5vw,3.4rem)}.book-image{min-height:400px}.book-image img{max-height:350px}}
@media(max-width:620px){.wrap{width:min(500px,calc(100% - 32px))}.banner-art-top{height:145px;background-size:auto 160px;background-position:left top}.banner-art-bottom{height:165px;background-size:auto 175px;background-position:right bottom}.site-header{padding:7px 0}.header-brand img{width:39px;height:39px}.header-brand span{font-size:.87rem}.site-header nav{gap:17px}.site-header nav a{font-size:.82rem}.home-main{min-height:0;display:block;text-align:center;padding-block:24px 34px}.home-logo img{width:145px}.home-copy h1{font-size:clamp(2.22rem,9.2vw,3.4rem);margin-top:7px}.home-copy h1 br{display:none}.home-subtitle{font-size:1rem}.home-actions{display:grid;gap:12px;max-width:300px;margin-inline:auto}.action{width:100%}.site-footer{font-size:.68rem}.inner-banner{height:105px;background-size:auto 130px;background-position:left top}.inner-bottom{height:125px;background-size:auto 140px;background-position:right bottom}.inner-main{padding-top:19px}.page-heading{padding-block:36px 43px}.page-heading h1{font-size:clamp(2.8rem,12vw,4rem)}.page-heading>p:last-child{font-size:1rem}.book-entry{grid-template-columns:1fr;gap:24px;padding-block:35px}.book-entry-reverse .book-image,.book-entry-reverse .book-details{order:initial}.book-image{min-height:0;padding:30px}.book-image img{max-height:325px}.book-details h2{font-size:3.2rem;margin:12px 0}.book-details>p{font-size:1rem}.social-list{grid-template-columns:1fr}.social-entry{padding:35px 0}.social-entry+ .social-entry{border-left:0;border-top:1px solid var(--line);padding-left:0}.social-entry h2{font-size:3.25rem}.social-entry p{min-height:0}.social-next{display:block;padding-top:40px}.social-next p{margin-bottom:20px}.social-next .action{max-width:300px}}
@media(max-width:350px){.site-header nav{gap:12px}.header-brand span{display:none}.home-copy h1{font-size:2.12rem}}
@media(max-width:620px){.banner-art-top{background-size:auto 175px;background-position:left top}.banner-art-bottom{background-size:auto 190px;background-position:right bottom}.colour-controls{justify-content:center;margin-top:18px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.colour-controls{display:none}.colour-layer{opacity:1!important}}