/* Progressive enhancements. Additive only: nothing here restyles existing elements at rest. */
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* scroll reveal (class is added by JS only, so no-JS visitors see everything) */
.js-reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.js-reveal.is-in{opacity:1;transform:none}

/* images fade in once loaded */
img.js-fade{opacity:0}
img.js-fade.is-loaded{opacity:1;transition:opacity .5s ease}

/* header gains a soft shadow after scrolling */
header{transition:box-shadow .25s}
.site-header{position:sticky;top:0;z-index:100;background:var(--paper);max-width:none;margin:0;padding:0}
.site-header>header{box-sizing:border-box;padding-inline:max(6%,calc((100% - 1440px)/2 + 86px))}
body.is-scrolled .wrap>header{box-shadow:0 8px 14px -14px #292b27}

/* back to top */
.to-top{position:fixed;right:34px;bottom:112px;width:44px;height:44px;border:1px solid var(--ink);background:var(--paper);color:var(--ink);font-size:18px;line-height:1;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .25s,transform .25s,visibility .25s;z-index:30}
.to-top.show{opacity:1;visibility:visible;transform:none}
.to-top:hover{background:var(--ink);color:#fff}

/* finish search */
.finish-search{margin:10px 0 24px;max-width:420px}
.finish-search input{border-radius:30px;padding:11px 19px;font-size:14px}
.search-hide{display:none!important}
.search-empty{grid-column:1/-1}

/* form feedback */
#enquiry .is-invalid{border-color:var(--orange)}
#enquiry .field-hint{font-size:12px;color:var(--orange)}
.char-count{font-size:12px;color:var(--muted);text-align:right}
@media(max-width:720px){.to-top{right:26px;bottom:104px}}

/* hero: original two-column layout, larger uncropped image */
.story-hero{grid-template-columns:1fr 1.3fr;min-height:0}
.story-hero .hero-art{min-height:0}
.story-hero .hero-art>img{position:static;display:block;width:100%;height:auto;object-fit:initial}
@media(max-width:1000px){.story-hero{grid-template-columns:1fr}}

/* mobile: hamburger button + menu flush under the header */
@media(max-width:720px){
.menu{width:44px;height:44px;padding:0;display:flex;align-items:center;justify-content:center;background:none;cursor:pointer}
.menu .bars,.menu .bars::before,.menu .bars::after{display:block;width:22px;height:2px;background:var(--ink);transition:transform .25s,background .25s}
.menu .bars{position:relative}
.menu .bars::before,.menu .bars::after{content:"";position:absolute;left:0}
.menu .bars::before{top:-7px}
.menu .bars::after{top:7px}
.menu[aria-expanded="true"] .bars{background:transparent}
.menu[aria-expanded="true"] .bars::before{top:0;transform:rotate(45deg)}
.menu[aria-expanded="true"] .bars::after{top:0;transform:rotate(-45deg)}
.site-header nav{top:100%}
}
