/* Full honey-coloured cover between subpages; home exit can opt into a swarm. */
@view-transition { navigation:auto; }
:root { --swarm-duration:2.2s; --swarm-ease:cubic-bezier(.32,.05,.34,1); }
::view-transition { background:var(--gold-light); }
::view-transition-group(root) { z-index:0; animation-duration:.85s; }
::view-transition-image-pair(root) { isolation:isolate; }
::view-transition-old(root) { z-index:2; opacity:1; mix-blend-mode:normal; animation:page-cover .85s cubic-bezier(.65,0,.35,1) both; }
::view-transition-new(root) { z-index:1; animation:page-open .85s cubic-bezier(.65,0,.35,1) both; opacity:1; mix-blend-mode:normal; }
@keyframes page-cover {
 0% { clip-path:inset(0 0 0 0); }
 44%,100% { clip-path:inset(0 0 0 100%); }
}
@keyframes page-open {
 0%,56% { clip-path:inset(0 100% 0 0); }
 100% { clip-path:inset(0 0 0 0); }
}
:root[data-page-transition="swarm"]::view-transition-new(root) { animation:none; clip-path:none; }
:root[data-page-transition="swarm"]::view-transition-group(root) { animation-duration:var(--swarm-duration); }
:root[data-page-transition="swarm"]::view-transition-old(root) { animation:var(--swarm-mask) var(--swarm-duration) var(--swarm-ease) both; }
::view-transition-group(swarm-far),::view-transition-group(swarm-main),::view-transition-group(swarm-near) { animation:none; overflow:visible; }
::view-transition-group(swarm-far) { z-index:3; }
::view-transition-group(swarm-main) { z-index:4; }
::view-transition-group(swarm-near) { z-index:5; }
::view-transition-image-pair(swarm-far),::view-transition-image-pair(swarm-main),::view-transition-image-pair(swarm-near) { overflow:visible; }
::view-transition-old(swarm-far),::view-transition-old(swarm-main),::view-transition-old(swarm-near) { display:none; }
:root[data-page-transition="swarm"]::view-transition-old(swarm-far),
:root[data-page-transition="swarm"]::view-transition-old(swarm-main),
:root[data-page-transition="swarm"]::view-transition-old(swarm-near) {
 display:block; opacity:1; mix-blend-mode:normal;
 animation:swarm-flight var(--swarm-duration) var(--swarm-ease) both;
}
@keyframes swarm-flight { from { transform:translate(0,0); } to { transform:translate(var(--swarm-end-x),var(--swarm-end-y)); } }
:root[data-swarm-direction="ne"] { --swarm-mask:swarm-uncover-ne; --swarm-end-x:160vw; --swarm-end-y:-160vh; }
@keyframes swarm-uncover-ne {
 0% { clip-path:polygon(0.00vw 0.00vh,100.00vw 0.00vh,100.00vw 260.00vh,90.00vw 253.00vh,80.00vw 238.60vh,70.00vw 232.20vh,60.00vw 216.80vh,50.00vw 211.80vh,40.00vw 197.60vh,30.00vw 193.80vh,20.00vw 178.40vh,10.00vw 172.50vh,0.00vw 160.00vh); }
 100% { clip-path:polygon(0.00vw 0.00vh,100.00vw 0.00vh,100.00vw -60.00vh,90.00vw -67.00vh,80.00vw -81.40vh,70.00vw -87.80vh,60.00vw -103.20vh,50.00vw -108.20vh,40.00vw -122.40vh,30.00vw -126.20vh,20.00vw -141.60vh,10.00vw -147.50vh,0.00vw -160.00vh); }
}
:root[data-swarm-direction="se"] { --swarm-mask:swarm-uncover-se; --swarm-end-x:160vw; --swarm-end-y:160vh; }
@keyframes swarm-uncover-se {
 0% { clip-path:polygon(0.00vw 100.00vh,100.00vw 100.00vh,100.00vw -160.00vh,90.00vw -153.00vh,80.00vw -138.60vh,70.00vw -132.20vh,60.00vw -116.80vh,50.00vw -111.80vh,40.00vw -97.60vh,30.00vw -93.80vh,20.00vw -78.40vh,10.00vw -72.50vh,0.00vw -60.00vh); }
 100% { clip-path:polygon(0.00vw 100.00vh,100.00vw 100.00vh,100.00vw 160.00vh,90.00vw 167.00vh,80.00vw 181.40vh,70.00vw 187.80vh,60.00vw 203.20vh,50.00vw 208.20vh,40.00vw 222.40vh,30.00vw 226.20vh,20.00vw 241.60vh,10.00vw 247.50vh,0.00vw 260.00vh); }
}
:root[data-swarm-direction="sw"] { --swarm-mask:swarm-uncover-sw; --swarm-end-x:-160vw; --swarm-end-y:160vh; }
@keyframes swarm-uncover-sw {
 0% { clip-path:polygon(100.00vw 100.00vh,0.00vw 100.00vh,0.00vw -160.00vh,10.00vw -153.00vh,20.00vw -138.60vh,30.00vw -132.20vh,40.00vw -116.80vh,50.00vw -111.80vh,60.00vw -97.60vh,70.00vw -93.80vh,80.00vw -78.40vh,90.00vw -72.50vh,100.00vw -60.00vh); }
 100% { clip-path:polygon(100.00vw 100.00vh,0.00vw 100.00vh,0.00vw 160.00vh,10.00vw 167.00vh,20.00vw 181.40vh,30.00vw 187.80vh,40.00vw 203.20vh,50.00vw 208.20vh,60.00vw 222.40vh,70.00vw 226.20vh,80.00vw 241.60vh,90.00vw 247.50vh,100.00vw 260.00vh); }
}
:root[data-swarm-direction="nw"] { --swarm-mask:swarm-uncover-nw; --swarm-end-x:-160vw; --swarm-end-y:-160vh; }
@keyframes swarm-uncover-nw {
 0% { clip-path:polygon(100.00vw 0.00vh,0.00vw 0.00vh,0.00vw 260.00vh,10.00vw 253.00vh,20.00vw 238.60vh,30.00vw 232.20vh,40.00vw 216.80vh,50.00vw 211.80vh,60.00vw 197.60vh,70.00vw 193.80vh,80.00vw 178.40vh,90.00vw 172.50vh,100.00vw 160.00vh); }
 100% { clip-path:polygon(100.00vw 0.00vh,0.00vw 0.00vh,0.00vw -60.00vh,10.00vw -67.00vh,20.00vw -81.40vh,30.00vw -87.80vh,40.00vw -103.20vh,50.00vw -108.20vh,60.00vw -122.40vh,70.00vw -126.20vh,80.00vw -141.60vh,90.00vw -147.50vh,100.00vw -160.00vh); }
}
@media(max-width:600px) { :root { --swarm-duration:2s; } }
/* A few clusters of the existing wax contours, restricted to the left margin. */
.page-content { position:relative; isolation:isolate; }
.page-content::before {
 content:""; position:absolute; pointer-events:none; z-index:-1;
 top:38px; bottom:80px; left:min(0px,calc((1240px - 100vw)/2));
 width:clamp(180px,26vw,380px);
 background:url('assets/honeycomb-margin.svg') left top / 360px 850px repeat-y;
 opacity:.22;
 -webkit-mask-image:linear-gradient(to right,#000 0%,#0008 45%,transparent 100%),linear-gradient(to bottom,transparent,#000 100px,#000 calc(100% - 150px),transparent);
 -webkit-mask-composite:source-in;
 mask-image:linear-gradient(to right,#000 0%,#0008 45%,transparent 100%),linear-gradient(to bottom,transparent,#000 100px,#000 calc(100% - 150px),transparent);
 mask-composite:intersect;
}
/* The anchor is still a link: larger touch target and a small wax-shaped marker. */
.section-navigation { gap:10px 12px; }
.section-navigation a {
 position:relative; gap:10px; min-height:46px; max-width:100%;
 padding:11px 15px 11px 13px; color:#322f1c;
 background:var(--gold); border:1px solid #fff5cf9c;
 border-radius:6px 13px 7px 10px;
 box-shadow:0 3px 0 #17271935;
 font-size:1.0625rem; line-height:1.25;
 transition:background .2s,box-shadow .2s;
}
.section-navigation a:nth-child(3n+2) { border-radius:12px 6px 11px 7px; background:var(--gold-light); }
.section-navigation a::before {
 content:""; display:block; flex:0 0 19px; width:19px; height:22px;
 background:url('assets/honeycomb-mark.svg') center / contain no-repeat;
 transition:transform .28s cubic-bezier(.2,.8,.2,1);
}
.section-navigation a:hover,.section-navigation a:focus-visible { color:#252b1a; background:var(--gold-pale); box-shadow:0 4px 0 #17271945; }
.section-navigation a:hover::before,.section-navigation a:focus-visible::before { transform:rotate(12deg); }
.section-navigation a>span[aria-hidden] { margin-left:3px; opacity:.7; transition:transform .2s; }
.section-navigation a:hover>span[aria-hidden] { transform:translateY(2px); }
.section-navigation a:active { box-shadow:0 1px 0 #17271935; }
@media(max-width:1000px) {
 .page-content::before { width:210px; background-size:270px 680px; opacity:.15; }
}
@media(max-width:600px) {
 .page-content::before { top:20px; width:155px; opacity:.13; background-size:230px 610px; }
 .section-navigation { gap:9px; }
 .section-navigation a { padding:10px 12px; font-size:1rem; min-height:44px; gap:8px; }
 .section-navigation a::before { flex-basis:17px; width:17px; height:20px; }
}
@media(prefers-reduced-motion:reduce) {
 @view-transition { navigation:none; }
 ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*) { animation:none!important; }
 .section-navigation a,.section-navigation a::before,.section-navigation a>span[aria-hidden] { transition:none; }
 .section-navigation a:hover::before,.section-navigation a:focus-visible::before,.section-navigation a:hover>span[aria-hidden] { transform:none; }
}
