/* Decoration layer: wave dividers, full-screen hero, paper and aeroplane art, cards. */
:root{--hh:72px;--wave:clamp(44px,7vw,92px)}
@media (max-width:1150px){:root{--hh:65px}}
/* Wave dividers: the div shows the section above, the path is the section below */
.wave{block-size:var(--wave);line-height:0;margin-block:-1px;overflow:hidden;background:var(--from)}
.wave svg{display:block;inline-size:112%;margin-inline:-6%;block-size:100%;animation:sway 12s ease-in-out infinite alternate}
.wave path{fill:var(--to)}
@keyframes sway{from{transform:translateX(-4%)}to{transform:translateX(4%)}}
.wave[data-from=indigo]{--from:#4F5BEA}.wave[data-from=navy]{--from:#0F0F4D}.wave[data-from=white]{--from:#fff}.wave[data-from=tint]{--from:#F3F4FE}
.wave[data-to=indigo]{--to:#4F5BEA}.wave[data-to=navy]{--to:#0F0F4D}.wave[data-to=white]{--to:#fff}.wave[data-to=tint]{--to:#F3F4FE}
/* Full-screen hero */
.hero.full{border-radius:0;min-block-size:calc(100vh - var(--hh) - var(--wave));min-block-size:calc(100svh - var(--hh) - var(--wave));align-content:center;padding-block:clamp(32px,6vh,80px) clamp(64px,10vh,110px)}
.hero-text,.hero-art{z-index:1}
.hero-logo{inline-size:clamp(64px,8vw,92px);block-size:auto;margin-block-end:18px;filter:drop-shadow(0 8px 16px rgba(8,10,60,.35))}
.hero-text>:nth-child(5){animation-delay:.32s}
.scroll-cue{position:absolute!important;inset-block-end:22px;inset-inline:0;margin-inline:auto;inline-size:max-content;z-index:2;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:.9rem;font-weight:500}
.scroll-cue svg{inline-size:22px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;animation:bob 1.6s ease-in-out infinite}
@keyframes bob{50%{translate:0 7px}}
/* Paper planes */
.plane{position:absolute!important;pointer-events:none;z-index:0}
.p1{inline-size:clamp(70px,9vw,130px);inset-block-start:12%;inset-inline-start:-140px;animation:fly 26s linear infinite}
.p2{inline-size:clamp(44px,5vw,76px);inset-block-start:64%;inset-inline-start:-100px;opacity:.75;animation:fly 34s linear -12s infinite}
.p3{inline-size:clamp(34px,4vw,56px);inset-block-start:34%;inset-inline-start:-80px;opacity:.55;animation:fly 42s linear -27s infinite}
.p1.small{inline-size:clamp(46px,6vw,84px);inset-block-start:22%;animation-duration:30s}
@keyframes fly{0%{transform:translate(0,0) rotate(6deg)}25%{transform:translate(30vw,-3vh) rotate(-4deg)}50%{transform:translate(60vw,4vh) rotate(8deg)}75%{transform:translate(90vw,-5vh) rotate(-3deg)}100%{transform:translate(125vw,0) rotate(6deg)}}
.trail{position:absolute!important;inset:auto 0 14% 0;inline-size:100%;block-size:36%;opacity:.28;pointer-events:none}
/* Welcome */
.welcome{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(24px,5vw,72px);align-items:center}
.welcome-text p{max-inline-size:38rem}
.welcome-art{position:relative;min-block-size:340px}
.welcome-art img{position:absolute}
.sheet{inline-size:min(72%,290px);inset:0 auto auto 6%;rotate:-6deg;filter:drop-shadow(0 18px 28px rgba(15,15,77,.18))}
.sheet.b{inset:40px 4% auto auto;rotate:5deg}
.pencil{inline-size:min(80%,300px);inset:auto 2% 8% auto;rotate:-16deg;filter:drop-shadow(0 8px 10px rgba(15,15,77,.2))}
.sheet,.pencil{animation:hover 7s ease-in-out infinite alternate}
.sheet.b{animation-delay:-3s}
@keyframes hover{to{translate:0 -10px}}
.sec-intro{max-inline-size:40rem;color:#4b4f86;margin-block:-6px 22px}
.page-intro{font-size:1.2rem;max-inline-size:44rem;margin-block-end:28px;color:#2b2e6b}
/* Explore cards */
.explore{position:relative;overflow:hidden;background:var(--tint)}
.explore .pat{position:absolute;right:-3%;top:-4%;inline-size:min(34%,380px);pointer-events:none}
.explore>:not(.pat){position:relative}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));gap:16px}
.card{display:block;background:#fff;border-radius:20px;padding:24px;transition:transform .25s var(--ease),box-shadow .25s}
.card:hover{transform:translateY(-4px);box-shadow:0 18px 36px color-mix(in oklab,var(--indigo) 20%,transparent)}
.card svg{inline-size:34px;block-size:34px;fill:none;stroke:var(--indigo);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;margin-block-end:14px}
.card h3{margin-block-end:4px}.card p{margin:0;color:#4b4f86}
/* Section colours + small art */
.band.notices{background:#fff}
.notices .books{inline-size:min(100%,220px);margin-block-start:30px}
.find{position:relative;overflow:hidden}
.find-plane{position:absolute;inline-size:82px;inset-inline-end:7%;inset-block-start:16%;animation:hover 4s ease-in-out infinite alternate}
.page-head,.page-head .tri{border-radius:0}
.top .logo img,.site-foot img,.badge-row img{border-radius:50%;border:0;background:none}
@media (max-width:900px){.welcome{grid-template-columns:1fr}.welcome-art{min-block-size:270px}.explore .pat{opacity:.35}}
@media (prefers-reduced-motion:reduce){.plane,.wave svg,.scroll-cue svg,.sheet,.pencil,.find-plane{animation:none!important}}