/* Decorative only: optional, monochrome and limited to Home. */
#page-home{position:relative}
.seasonal-scene{position:absolute;inset:0 0 auto;height:240px;overflow:hidden;pointer-events:none;user-select:none;color:var(--text2);opacity:.13;z-index:1}
.seasonal-flyer{position:absolute;left:0;top:0;width:65px;height:50px;animation:seasonal-travel 26s linear infinite;animation-delay:-8s}
.seasonal-flyer:nth-child(2){width:100px;animation-name:seasonal-glide;animation-duration:34s;animation-delay:-21s}
.seasonal-flyer:nth-child(3){width:44px;animation-name:seasonal-drift;animation-duration:32s;animation-delay:-11s}
.seasonal-flyer:nth-child(4){width:35px;animation-duration:23s;animation-delay:-17s}
.seasonal-flyer:nth-child(5){width:50px;animation-name:seasonal-glide;animation-duration:37s;animation-delay:-5s}
.seasonal-flyer svg{width:100%;height:100%;fill:currentColor;animation:seasonal-bob 3.6s ease-in-out infinite;overflow:visible}
.seasonal-wing{transform-box:view-box;animation:seasonal-flap-left .85s ease-in-out infinite}
.seasonal-wing-left{transform-origin:39px 24px}
.seasonal-wing-right{transform-origin:41px 24px;animation-name:seasonal-flap-right;animation-delay:-.04s}
.seasonal-flyer:nth-child(4) .seasonal-wing{animation-duration:.65s}
.seasonal-flyer:nth-child(5) .seasonal-wing{animation-duration:1.1s}
.seasonal-flyer:nth-child(2) svg{animation-duration:5s}
.seasonal-witch-body{transform-origin:55px 50px;animation:seasonal-balance 2.8s ease-in-out infinite}
.seasonal-cape{transform-origin:52px 45px;animation:seasonal-cape 1.3s ease-in-out infinite}
.seasonal-broom{transform-origin:55px 54px;animation:seasonal-balance 2.8s ease-in-out infinite reverse}
.seasonal-flyer:nth-child(3) svg{animation-name:seasonal-ghost;animation-duration:4.2s;transform-origin:center}
.seasonal-ghost-tail{transform-origin:25px 44px;animation:seasonal-tail 1.7s ease-in-out infinite}
.seasonal-ghost-eyes{transform-origin:25px 29px;animation:seasonal-blink 7s linear infinite}
@keyframes seasonal-travel{0%{transform:translate(-150px,125px) rotate(-7deg)}25%{transform:translate(23vw,55px) rotate(-3deg)}50%{transform:translate(50vw,105px) rotate(5deg)}75%{transform:translate(78vw,40px) rotate(-5deg)}100%{transform:translate(calc(100vw + 150px),110px) rotate(2deg)}}
@keyframes seasonal-glide{0%{transform:translate(-150px,35px) rotate(5deg)}35%{transform:translate(30vw,120px) rotate(-4deg)}65%{transform:translate(68vw,65px) rotate(3deg)}100%{transform:translate(calc(100vw + 150px),150px) rotate(-3deg)}}
@keyframes seasonal-drift{0%{transform:translate(-100px,145px)}30%{transform:translate(30vw,75px)}65%{transform:translate(62vw,125px)}100%{transform:translate(calc(100vw + 100px),50px)}}
@keyframes seasonal-bob{25%{transform:translateY(-5px) rotate(-2deg)}75%{transform:translateY(9px) rotate(2deg)}}
@keyframes seasonal-flap-left{0%,100%{transform:rotate(-8deg) scaleY(1)}50%{transform:rotate(25deg) scaleY(.4)}}
@keyframes seasonal-flap-right{0%,100%{transform:rotate(8deg) scaleY(1)}50%{transform:rotate(-25deg) scaleY(.4)}}
@keyframes seasonal-balance{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(4deg)}}
@keyframes seasonal-cape{0%,100%{transform:rotate(-5deg) scaleX(.96)}50%{transform:rotate(9deg) scaleX(1.06)}}
@keyframes seasonal-ghost{0%,100%{transform:translateY(-5px) rotate(-5deg)}50%{transform:translateY(10px) rotate(6deg)}}
@keyframes seasonal-tail{0%,100%{transform:skewX(-8deg) scaleX(.93)}50%{transform:skewX(9deg) scaleX(1.06)}}
@keyframes seasonal-blink{0%,90%,95%,100%{transform:scaleY(1)}92%,93%{transform:scaleY(.1)}}
@media(prefers-reduced-motion:reduce){.seasonal-scene{display:none}.seasonal-scene *{animation:none!important}}

/* A deliberately tiny footer easter egg: never an overlay, never audio. */
.footer-flags{position:relative;display:inline-flex;align-items:center;gap:3px;vertical-align:middle}
.footer-flag-btn{display:inline-grid;place-items:center;width:22px;height:22px;margin:-6px -4px;padding:0;border:0;border-radius:5px;background:none;color:inherit;cursor:pointer}
.footer-flag-btn:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.footer-flag-btn:hover .footer-flag,.footer-flag-btn:focus-visible .footer-flag{filter:none;opacity:1}
.celtic-moment-art{position:relative;display:flex;align-items:flex-end;justify-content:center;width:72px;height:64px;flex:none}
.celtic-cow{width:60px;height:52px}
.celtic-pipes{width:54px;height:50px;animation:celtic-pipes-sway var(--mo-long) var(--mo-io) both}
.pipes-play i{position:absolute;font-size:10px;font-style:normal;color:var(--accent);animation:celtic-note var(--mo-long) var(--mo-out) both}
.pipes-play i:first-of-type{right:6px;top:13px}.pipes-play i:last-of-type{right:0;top:4px;animation-delay:var(--mo-fast)}
.cows-meet{width:122px}.cows-meet .celtic-cow{position:absolute;width:54px;height:47px;bottom:0}.cows-meet .cow-left{left:0;transform:rotate(7deg);animation:celtic-cow-left var(--mo-long) var(--mo-out) both}.cows-meet .cow-right{right:0;transform:rotate(-7deg);animation:celtic-cow-right var(--mo-long) var(--mo-out) both}
@keyframes celtic-pipes-sway{0%{transform:rotate(-5deg) scale(.94)}55%{transform:rotate(4deg) scale(1)}100%{transform:rotate(0)}}
@keyframes celtic-note{0%{opacity:0;transform:translateY(5px)}45%{opacity:1}100%{opacity:0;transform:translateY(-8px)}}
@keyframes celtic-cow-left{0%{transform:translateX(-10px) rotate(-4deg)}60%{transform:translateX(2px) rotate(11deg)}100%{transform:translateX(0) rotate(7deg)}}
@keyframes celtic-cow-right{0%{transform:translateX(10px) rotate(4deg)}60%{transform:translateX(-2px) rotate(-11deg)}100%{transform:translateX(0) rotate(-7deg)}}

.celtic-flagmorph,.celtic-rain,.celtic-queimada,.celtic-santiago,.celtic-nessie,.celtic-thistle{width:60px;height:52px;overflow:visible}
.celtic-rain *,.celtic-queimada *,.celtic-santiago *,.celtic-nessie *,.celtic-thistle *{transform-box:fill-box}
/* queimada: the flames breathe out of phase, sparks rise and fade */
.qm-flame{transform-origin:50% 100%;animation:celtic-flame calc(var(--mo-base) * 2) var(--mo-io) infinite alternate}
.qm-f2{animation-delay:calc(var(--mo-fast) * -1)}.qm-f3{animation-delay:calc(var(--mo-fast) * -2)}
.qm-spark{animation:celtic-spark var(--mo-loop) var(--mo-out) infinite}.qm-s2{animation-delay:calc(var(--mo-loop) * .33)}.qm-s3{animation-delay:calc(var(--mo-loop) * .66)}
/* cathedral: windows light up one after another, the star twinkles */
.sant-win{opacity:0;animation:celtic-window var(--mo-long) var(--mo-out) forwards}
.sw1{animation-delay:var(--mo-base)}.sw2{animation-delay:calc(var(--mo-base) * 2)}.sw3{animation-delay:calc(var(--mo-base) * 3)}
.sant-star{transform-origin:50% 50%;animation:celtic-twinkle var(--mo-loop) var(--mo-io) infinite}
/* nessie: neck and humps surface in turn, ripples drift */
.ness-neck{transform-origin:50% 100%;animation:celtic-surface var(--mo-long) var(--mo-out) both,celtic-bob var(--mo-loop) var(--mo-io) var(--mo-long) infinite}
.ness-hump{animation:celtic-surface var(--mo-long) var(--mo-out) both}.nh1{animation-delay:var(--mo-fast)}.nh2{animation-delay:calc(var(--mo-fast) * 2)}
.ness-rip{animation:celtic-ripple var(--mo-loop) linear infinite}
/* thistle: the spines fan open from the calyx */
.th-spike{transform-origin:32px 27px;transform-box:view-box;animation:celtic-fan var(--mo-long) var(--mo-out) both}
.t2,.t6{animation-delay:calc(var(--mo-fast) * .4)}.t3,.t5{animation-delay:calc(var(--mo-fast) * .8)}.t4{animation-delay:calc(var(--mo-fast) * 1.2)}
@keyframes celtic-flame{0%{transform:scale(1,.92) skewX(-3deg)}100%{transform:scale(.94,1.08) skewX(3deg)}}
@keyframes celtic-spark{0%{opacity:0;transform:translateY(4px)}30%{opacity:1}100%{opacity:0;transform:translateY(-12px)}}
@keyframes celtic-window{from{opacity:0}to{opacity:1}}
@keyframes celtic-twinkle{0%,100%{opacity:.55;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}
@keyframes celtic-surface{from{transform:translateY(12px);opacity:0}to{transform:none;opacity:1}}
@keyframes celtic-bob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-2px) rotate(-2deg)}}
@keyframes celtic-ripple{from{transform:translateX(-3px)}to{transform:translateX(3px)}}
@keyframes celtic-fan{from{transform:scale(.35);opacity:0}to{transform:scale(1);opacity:1}}
/* The figure rises from behind the footer line: a clipping window sits on top of the line,
   the art slides up out of it, waits a moment and sinks back. No bubble, no text. */
.celtic-footer-host{position:relative}
.celtic-footer-scene{position:absolute;left:50%;bottom:calc(100% - 3px);transform:translateX(-50%);overflow:hidden;display:grid;place-items:end center;width:240px;pointer-events:none;z-index:8;line-height:0}
.celtic-footer-scene>*{grid-area:1/1}
.celtic-footer-scene .celtic-moment-art{animation:celtic-peek var(--celtic-dur,2800ms) var(--mo-io) both}
@keyframes celtic-peek{0%{transform:translateY(105%)}22%,78%{transform:translateY(0)}100%{transform:translateY(105%)}}
/* rain: the cloud drifts a little, the drops fall into the footer line one after another */
.rain-cloud{animation:celtic-drift calc(var(--mo-loop) * 1.5) var(--mo-io) infinite alternate}
.rain-drop{animation:celtic-drop calc(var(--mo-base) * 3) linear infinite}
.rd2{animation-delay:calc(var(--mo-fast) * -1)}.rd3{animation-delay:calc(var(--mo-fast) * -2)}.rd4{animation-delay:calc(var(--mo-fast) * -3)}.rd5{animation-delay:calc(var(--mo-fast) * -4)}.rd6{animation-delay:calc(var(--mo-fast) * -.5)}.rd7{animation-delay:calc(var(--mo-fast) * -2.500)}.rd8{animation-delay:calc(var(--mo-fast) * -3.500)}
:root[data-theme="dark"] .celtic-rain{--rain-cloud:#6d7d92}
@keyframes celtic-drift{from{transform:translateX(-2px)}to{transform:translateX(2px)}}
@keyframes celtic-drop{0%{opacity:0;transform:translateY(-3px)}15%{opacity:1}100%{opacity:0;transform:translateY(20px)}}
/* flags: the Galician band turns into one arm of the Scottish saltire while the other arm is drawn in */
.celtic-flagmorph{width:68px;height:54px;overflow:visible}
.fm-wave{transform-box:fill-box;transform-origin:0 50%;animation:fm-wave calc(var(--mo-base) * 4) var(--mo-io) infinite alternate}
.fm-bg{fill:#fff;animation:fm-bg var(--celtic-dur,2800ms) linear both}
.fm-arm1{fill:none;stroke:#0099cc;stroke-width:5.500;animation:fm-arm1 var(--celtic-dur,2800ms) var(--mo-io) both}
.fm-arm2{fill:none;stroke:#fff;stroke-width:7;stroke-dasharray:75;stroke-dashoffset:75;animation:fm-arm2 var(--celtic-dur,2800ms) var(--mo-io) both}
@keyframes fm-bg{0%,30%{fill:#fff}56%,100%{fill:#005eb8}}
@keyframes fm-arm1{0%,30%{stroke:#0099cc;stroke-width:5.500}56%,100%{stroke:#fff;stroke-width:7}}
@keyframes fm-arm2{0%,32%{stroke-dashoffset:75}58%,100%{stroke-dashoffset:0}}
@keyframes fm-wave{from{transform:skewY(-2.500deg)}to{transform:skewY(2.500deg)}}
@media(prefers-reduced-motion:reduce){.celtic-footer-scene,.celtic-footer-scene *{animation:none!important}.sant-win{opacity:1}}
