/* Seasonal decorations for every page (Allan, 2026-10-23: "anything falling on the
   site needs to fall through the entire site, as well as the theme of the overall
   holiday"). seasonal.js adds the pieces and sets <html data-season-fx> only for
   a season the site has built; without it nothing
   here applies, and every other season wears the normal look. Colours come from
   the --fx-* properties below, per season and per look, matching the app's
   palettes. Reduced motion: everything stays, nothing moves. */

:root[data-season-fx="christmas"]{
  --fx-ribbon-1:#8F1F3A; --fx-ribbon-2:#C73A58;
  --fx-a:#C73A58; --fx-b:#D9A21B; --fx-c:#2F6B4F; --fx-d:#F5849A; --fx-e:#8F1F3A;
  --fx-tree:#2F6B4F; --fx-tree-2:#245740; --fx-wire:#3A4A40; --fx-shadow:120 150 185;
  --fx-sky-1:#1E2F27; --fx-sky-2:#3B1A2A;
}
:root[data-season-fx="christmas"][data-look="men"]{
  --fx-ribbon-1:#14402B; --fx-ribbon-2:#1F5A3E;
  --fx-a:#B3262E; --fx-b:#D9A21B; --fx-c:#1F5A3E; --fx-d:#4F7396; --fx-e:#9CC3E3;
  --fx-tree:#1F5A3E; --fx-tree-2:#174631; --fx-wire:#2E3A34; --fx-shadow:110 140 170;
  --fx-sky-1:#0A1C14; --fx-sky-2:#14263A;
}
:root[data-season-fx="fall"]{
  --fx-ribbon-1:#8E3450; --fx-ribbon-2:#C4694F;
  --fx-a:#9E3D5A; --fx-b:#C0566E; --fx-c:#D9826B; --fx-d:#E0A27A; --fx-e:#A8789A;
  --fx-pumpkin-1:#F3E1C7; --fx-pumpkin-2:#E8A598; --fx-pumpkin-3:#F0B27A; --fx-stem:#6B4A3A; --fx-hay:#E8CFA0;
  --fx-wire:#7A5A4A;
}
:root[data-season-fx="fall"][data-look="men"]{
  --fx-ribbon-1:#8A2E22; --fx-ribbon-2:#C4581A;
  --fx-a:#B3392B; --fx-b:#C4581A; --fx-c:#9A7012; --fx-d:#5F7029; --fx-e:#7E4E2A;
  --fx-pumpkin-1:#D9772B; --fx-pumpkin-2:#E8A33D; --fx-pumpkin-3:#C4581A; --fx-stem:#5A3A22; --fx-hay:#DDBD72;
  --fx-wire:#6B4A30;
}
:root[data-season-fx="newYear"]{
  --fx-ribbon-1:#4A2A5E; --fx-ribbon-2:#6B3A78;
  --fx-a:#D4A537; --fx-b:#C25D7E; --fx-c:#4A2A5E; --fx-d:#8A92A8; --fx-e:#B5636A;
  --fx-ink:#2E1F45; --fx-win:#F4DC94; --fx-shadow:90 70 110; --fx-glow:212 165 55; --fx-sticker-bg:#D4A537;
  --fx-night1:#0D0A1F; --fx-night2:#3B2A5C; --fx-night-ink:#140E26; --fx-night-far:#271C40;
}
:root[data-season-fx="newYear"][data-look="men"]{
  --fx-ribbon-1:#1F3157; --fx-ribbon-2:#2A4A78;
  --fx-a:#D4A537; --fx-b:#22707E; --fx-c:#1F3157; --fx-d:#8A92A8; --fx-e:#9C7A1C;
  --fx-ink:#1B2745; --fx-win:#F2D77E; --fx-shadow:70 90 130; --fx-glow:212 165 55; --fx-sticker-bg:#D4A537;
  --fx-night1:#060B1C; --fx-night2:#1F3462; --fx-night-ink:#0A1226; --fx-night-far:#16264A;
}
:root[data-season-fx="winter"]{
  --fx-ribbon-1:#4F5FA6; --fx-ribbon-2:#675796;
  --fx-a:#6F5FA3; --fx-b:#3F6F9A; --fx-c:#7E4E78; --fx-d:#5A6FB8; --fx-e:#6B7280;
  --fx-ice:#E6EFF8; --fx-wood:#A8765A; --fx-roof:#5E4B54; --fx-win:#FBD77A; --fx-shadow:120 140 185; --fx-glow:143 184 224;
  --fx-tree:#3D6B5C; --fx-tree-2:#2F5849;
}
:root[data-season-fx="winter"][data-look="men"]{
  --fx-ribbon-1:#2F6690; --fx-ribbon-2:#2C5A4C;
  --fx-a:#2F6690; --fx-b:#4A5866; --fx-c:#2C5A4C; --fx-d:#3C7FA3; --fx-e:#5B6878;
  --fx-ice:#E3EEF4; --fx-wood:#7B5B45; --fx-roof:#4A4A52; --fx-win:#FBD77A; --fx-shadow:110 140 170; --fx-glow:143 184 224;
  --fx-tree:#2F5A4C; --fx-tree-2:#24483C;
}
:root[data-season-fx="valentines"]{
  --fx-ribbon-1:#A3174D; --fx-ribbon-2:#C2395E;
  --fx-a:#C2395E; --fx-b:#B3122E; --fx-c:#E6729A; --fx-d:#6E2A5E; --fx-e:#F28CA6;
  --fx-leaf:#3C7A4E; --fx-leaf2:#2F6B42; --fx-shadow:163 23 77; --fx-glow:230 114 154; --fx-sticker-bg:#C2395E;
}
:root[data-season-fx="valentines"][data-look="men"]{
  --fx-ribbon-1:#6B1E2E; --fx-ribbon-2:#9E1B32;
  --fx-a:#9E1B32; --fx-b:#6B1E2E; --fx-c:#C9283E; --fx-d:#8A4A3E; --fx-e:#D49A8C;
  --fx-leaf:#35603F; --fx-leaf2:#274A31; --fx-shadow:107 30 46; --fx-glow:201 40 62; --fx-sticker-bg:#9E1B32;
}
:root[data-season-fx="stPatricks"]{
  --fx-ribbon-1:#1E7B4F; --fx-ribbon-2:#277A32;
  --fx-a:#1E7B4F; --fx-b:#2F8F3A; --fx-c:#2E8A6E; --fx-d:#D9A21B; --fx-e:#B5476A;
  --fx-g1:#6CC47C; --fx-g2:#3FA457; --fx-g3:#2F8F3A; --fx-gold:#E3AE22; --fx-gold2:#9A7414;
  --fx-shadow:28 113 73; --fx-glow:217 162 27; --fx-sticker-bg:#2F8F3A;
}
:root[data-season-fx="stPatricks"][data-look="men"]{
  --fx-ribbon-1:#1A6E46; --fx-ribbon-2:#287531;
  --fx-a:#1A6E46; --fx-b:#2C7F35; --fx-c:#24503A; --fx-d:#D9A21B; --fx-e:#8A5A2B;
  --fx-g1:#6BB88A; --fx-g2:#3C9A5F; --fx-g3:#2C7F35; --fx-gold:#E3AE22; --fx-gold2:#8A5A2B;
  --fx-shadow:26 110 70; --fx-glow:217 162 27; --fx-sticker-bg:#2C7F35;
}
:root[data-season-fx="spring"]{
  --fx-ribbon-1:#A33D6C; --fx-ribbon-2:#7557A9;
  --fx-a:#E883B3; --fx-b:#A98BE0; --fx-c:#F5A9C9; --fx-d:#6FB0EA; --fx-e:#EDC94F;
  --fx-g1:#8FD08A; --fx-g2:#5DB85F; --fx-g3:#3C8A3F; --fx-leaf:#3C8A3F; --fx-sun:#F2C94C; --fx-ink:#4A2A4A;
  --fx-shadow:163 61 108; --fx-glow:242 155 195; --fx-sticker-bg:#E883B3;
}
:root[data-season-fx="spring"][data-look="men"]{
  --fx-ribbon-1:#2F6E34; --fx-ribbon-2:#2D6BA1;
  --fx-a:#EBC85A; --fx-b:#8DBBEB; --fx-c:#7FCFC4; --fx-d:#9BCB8A; --fx-e:#C2A288;
  --fx-g1:#9AD38E; --fx-g2:#6BBB6A; --fx-g3:#357D3A; --fx-leaf:#357D3A; --fx-sun:#EBC85A; --fx-ink:#3A3A2A;
  --fx-shadow:47 110 52; --fx-glow:134 201 127; --fx-sticker-bg:#E5B73B;
}
:root[data-season-fx="easter"]{
  --fx-ribbon-1:#7054A2; --fx-ribbon-2:#8C56A8;
  --fx-a:#B69AE8; --fx-b:#EE95BC; --fx-c:#6FCBA8; --fx-d:#EBC95B; --fx-e:#7FB2E8;
  --fx-g1:#A6DC9C; --fx-g2:#7CC77A; --fx-g3:#5DAE5A; --fx-leaf:#4E9E55; --fx-sun:#F5DE8A;
  --fx-shadow:112 84 162; --fx-glow:245 222 138;
  --fx-sticker-bg:linear-gradient(180deg,var(--fx-b) 0 32%,#fff 32% 40%,var(--fx-a) 40% 68%,var(--fx-d) 68% 76%,var(--fx-c) 76%);
}
:root[data-season-fx="easter"][data-look="men"]{
  --fx-ribbon-1:#386C49; --fx-ribbon-2:#66569E;
  --fx-a:#6FB487; --fx-b:#78AEE0; --fx-c:#9C8DD6; --fx-d:#E5C158; --fx-e:#CDB99C;
  --fx-g1:#A9D8A0; --fx-g2:#7DBF84; --fx-g3:#4E9A5A; --fx-leaf:#3E7A52; --fx-sun:#EFD27A;
  --fx-shadow:56 108 73; --fx-glow:239 210 122;
  --fx-sticker-bg:linear-gradient(180deg,var(--fx-b) 0 32%,#fff 32% 40%,var(--fx-a) 40% 68%,var(--fx-d) 68% 76%,var(--fx-c) 76%);
}
:root[data-season-fx="summer"]{
  --fx-ribbon-1:#A53A36; --fx-ribbon-2:#B8306E;
  --fx-a:#F07A6A; --fx-b:#F2C94C; --fx-c:#3FB8BD; --fx-d:#F27AAE; --fx-e:#5CC9A3;
  --fx-bub1:#3FB8BD; --fx-bub2:#5CC9A3; --fx-bub3:#4FA3E0;
  --fx-sea:#35BCC4; --fx-sea2:#14848F; --fx-sand:#F2D9A4; --fx-palm:#2F8F58; --fx-trunk:#8B5E3C;
  --fx-shadow:165 58 54; --fx-glow:242 201 76; --fx-sticker-bg:#F2B72A;
}
:root[data-season-fx="summer"][data-look="men"]{
  --fx-ribbon-1:#1F5F9E; --fx-ribbon-2:#2F7A3E;
  --fx-a:#4F95DA; --fx-b:#F2A15E; --fx-c:#5CB36A; --fx-d:#D9BE8C; --fx-e:#8E9FD0;
  --fx-bub1:#4F95DA; --fx-bub2:#5AB0C4; --fx-bub3:#7FA6E6;
  --fx-sea:#3C8FD0; --fx-sea2:#1F5F9E; --fx-sand:#E8D2A0; --fx-palm:#2F7A3E; --fx-trunk:#7B5A3A;
  --fx-shadow:31 95 158; --fx-glow:242 161 94; --fx-sticker-bg:#F2A15E;
}
:root[data-season-fx="fourthOfJuly"]{
  --fx-ribbon-1:#2B3A67; --fx-ribbon-2:#B8213D;
  --fx-a:#B8213D; --fx-b:#2B3A67; --fx-c:#3D6FB0; --fx-d:#D9A21B; --fx-e:#FFFFFF;
  --fx-ink:#1F2A52; --fx-win:#F4D77A; --fx-shadow:43 58 103; --fx-glow:184 33 61; --fx-glow2:61 111 176; --fx-sticker-bg:#B8213D;
}
:root[data-season-fx="fourthOfJuly"][data-look="men"]{
  --fx-ribbon-1:#24305E; --fx-ribbon-2:#B22234;
  --fx-a:#B22234; --fx-b:#24305E; --fx-c:#35628F; --fx-d:#D9A21B; --fx-e:#FFFFFF;
  --fx-ink:#1B2446; --fx-win:#F2D77E; --fx-shadow:36 48 94; --fx-glow:178 34 52; --fx-glow2:53 98 143; --fx-sticker-bg:#B22234;
}

/* ── The greeting ribbon across the very top ── */
.fx-ribbon{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:10px;
  min-height:32px;padding:6px 16px;background:linear-gradient(90deg,var(--fx-ribbon-1),var(--fx-ribbon-2) 50%,var(--fx-ribbon-1));
  color:#fff;font:600 13.5px/1.2 var(--sans);letter-spacing:.02em;text-align:center}
.fx-ribbon svg{width:18px;height:18px;flex:none}
.fx-ribbon .fx-count{opacity:.85;font-weight:500}
html[data-season-fx] .hero{padding-top:calc(144px + env(safe-area-inset-top))}

/* ── The garland under the menu bar: lights at Christmas, a leaf swag in Fall ── */
.fx-garland{position:absolute;left:0;right:0;top:100%;height:40px;pointer-events:none;overflow:visible;z-index:1}
.fx-garland svg{display:block;width:100%;height:40px;overflow:visible}
.fx-bulb{animation:fx-twinkle 2.4s ease-in-out infinite}
@keyframes fx-twinkle{0%,100%{opacity:1;filter:drop-shadow(0 0 5px currentColor)}50%{opacity:.55;filter:none}}
header.top{position:relative}

/* ── Hero scene: things hanging from the top, a scene along the foot ── */
.fx-hero{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.fx-hang{position:absolute;top:0;transform-origin:50% 0;animation:fx-swing 5s ease-in-out infinite}
@keyframes fx-swing{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}
.fx-ground{position:absolute;left:0;right:0;bottom:0;height:clamp(90px,14vw,170px)}
.fx-ground svg{width:100%;height:100%;display:block}
@media (max-width:1000px){.fx-hang.far{display:none}}
/* A phone has no margin beside the logo and headline: the garland carries it there. */
@media (max-width:700px){.fx-hang{display:none}}

/* ── Section edges and the band above the footer ── */
.fx-edge{position:relative;height:0;z-index:2;pointer-events:none}
.fx-edge svg{position:absolute;left:0;width:100%;height:34px;top:-17px;display:block}
.fx-band{position:relative;height:clamp(70px,10vw,120px);pointer-events:none;margin-top:-1px}
.fx-band svg{width:100%;height:100%;display:block}

/* ── Snow caps on the cards (Christmas), a pinned leaf on each (Fall) ── */
html[data-season-fx] :is(.card,.why-card,.plan,.look-card){position:relative}
html[data-season-fx="christmas"] :is(.card,.why-card,.plan,.look-card)::before{
  content:"";position:absolute;left:10px;right:10px;top:-11px;height:24px;z-index:1;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 24' preserveAspectRatio='none'%3E%3Cpath d='M0 14 C6 4 18 3 26 9 C34 2 48 1 56 8 C64 1 80 2 88 9 C96 3 110 2 118 9 C126 2 142 1 150 8 C158 2 172 3 180 9 C188 4 196 6 200 12 L200 15 C192 16 190 22 184 21 C178 20 178 15 168 16 C160 17 160 23 152 22 C146 21 144 15 132 16 C120 17 122 21 112 21 C102 21 104 15 92 16 C80 17 82 23 72 22 C64 21 64 15 52 16 C40 17 42 22 32 21 C22 20 22 15 12 16 C6 17 4 19 0 18 Z' fill='white'/%3E%3C/svg%3E") center/100% 100% no-repeat;
  filter:drop-shadow(0 2px 2px rgb(var(--fx-shadow) / .45))}
html[data-season-fx="fall"] :is(.card,.why-card,.plan,.look-card)::after{
  content:"";position:absolute;top:-12px;right:14px;width:30px;height:30px;z-index:1;pointer-events:none;transform:rotate(18deg);
  background:var(--fx-a);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32.0 3.6 L34.1 7.8 L36.8 6.6 L36.5 11.4 L40.1 10.2 L38.0 16.8 L39.5 19.2 L35.6 24.6 L41.0 22.8 L43.4 18.6 L45.2 21.6 L50.6 16.8 L51.2 21.0 L60.8 19.8 L56.0 25.2 L58.4 28.8 L53.0 29.4 L51.8 33.0 L45.8 31.8 L41.6 35.4 L47.0 37.2 L50.6 42.0 L44.6 41.4 L42.8 44.4 L38.0 40.8 L33.5 45.0 L30.5 45.0 L26.0 40.8 L21.2 44.4 L19.4 41.4 L13.4 42.0 L17.0 37.2 L22.4 35.4 L18.2 31.8 L12.2 33.0 L11.0 29.4 L5.6 28.8 L8.0 25.2 L3.2 19.8 L12.8 21.0 L13.4 16.8 L18.8 21.6 L20.6 18.6 L23.0 22.8 L28.4 24.6 L24.5 19.2 L26.0 16.8 L23.9 10.2 L27.5 11.4 L27.2 6.6 L29.9 7.8 Z M31 44 L33 44 L33.5 61 L30.5 61 Z'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32.0 3.6 L34.1 7.8 L36.8 6.6 L36.5 11.4 L40.1 10.2 L38.0 16.8 L39.5 19.2 L35.6 24.6 L41.0 22.8 L43.4 18.6 L45.2 21.6 L50.6 16.8 L51.2 21.0 L60.8 19.8 L56.0 25.2 L58.4 28.8 L53.0 29.4 L51.8 33.0 L45.8 31.8 L41.6 35.4 L47.0 37.2 L50.6 42.0 L44.6 41.4 L42.8 44.4 L38.0 40.8 L33.5 45.0 L30.5 45.0 L26.0 40.8 L21.2 44.4 L19.4 41.4 L13.4 42.0 L17.0 37.2 L22.4 35.4 L18.2 31.8 L12.2 33.0 L11.0 29.4 L5.6 28.8 L8.0 25.2 L3.2 19.8 L12.8 21.0 L13.4 16.8 L18.8 21.6 L20.6 18.6 L23.0 22.8 L28.4 24.6 L24.5 19.2 L26.0 16.8 L23.9 10.2 L27.5 11.4 L27.2 6.6 L29.9 7.8 Z M31 44 L33 44 L33.5 61 L30.5 61 Z'/%3E%3C/svg%3E") center/contain no-repeat;
  filter:drop-shadow(0 2px 2px rgb(0 0 0 / .18))}
html[data-season-fx="fall"] :is(.why-card,.look-card)::after{background:var(--fx-d);transform:rotate(-14deg)}
html[data-season-fx="fall"] .plan::after{background:var(--fx-c)}
/* The plan's own "Most popular" tag sits on its top edge; keep it in front. */
html[data-season-fx] .plan .tag{z-index:2}

/* ── Buttons get a festive glow ── */
html[data-season-fx="christmas"] .btn-berry{box-shadow:0 0 0 3px rgb(217 162 27 / .35),0 8px 22px -8px rgb(var(--shadow-tint) / .6)}
html[data-season-fx="fall"] .btn-berry{box-shadow:0 0 0 3px rgb(224 162 122 / .4),0 8px 22px -8px rgb(var(--shadow-tint) / .6)}

/* ── The newer seasons: one small sticker on each card, and a glow on the main buttons ── */
html[data-fx-sticker] :is(.card,.why-card,.plan,.look-card)::after{
  content:"";position:absolute;top:-13px;right:14px;width:34px;height:34px;z-index:1;pointer-events:none;transform:rotate(14deg);
  background:var(--fx-sticker-bg);
  -webkit-mask:var(--fx-sticker) center/contain no-repeat; mask:var(--fx-sticker) center/contain no-repeat;
  filter:drop-shadow(0 2px 2px rgb(0 0 0 / .2))}
html[data-fx-sticker] :is(.why-card,.look-card)::after{transform:rotate(-12deg)}
html[data-fx-new] .btn-berry{box-shadow:0 0 0 3px rgb(var(--fx-glow) / .4),0 0 24px 2px rgb(var(--fx-glow) / .45),0 8px 22px -8px rgb(var(--shadow-tint) / .6)}
/* Winter: a thin frost cap along the top of each card, icy where Christmas's is white. */
html[data-season-fx="winter"] :is(.card,.why-card,.plan,.look-card)::before{
  content:"";position:absolute;left:12px;right:12px;top:-8px;height:17px;z-index:1;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 24' preserveAspectRatio='none'%3E%3Cpath d='M0 14 C6 4 18 3 26 9 C34 2 48 1 56 8 C64 1 80 2 88 9 C96 3 110 2 118 9 C126 2 142 1 150 8 C158 2 172 3 180 9 C188 4 196 6 200 12 L200 15 C192 16 190 22 184 21 C178 20 178 15 168 16 C160 17 160 23 152 22 C146 21 144 15 132 16 C120 17 122 21 112 21 C102 21 104 15 92 16 C80 17 82 23 72 22 C64 21 64 15 52 16 C40 17 42 22 32 21 C22 20 22 15 12 16 C6 17 4 19 0 18 Z' fill='%23E4F1FB'/%3E%3C/svg%3E") center/100% 100% no-repeat;
  filter:drop-shadow(0 1px 1.5px rgb(var(--fx-shadow) / .55))}
/* Summer: the waves along the beach slide sideways, slowly; one layer the other way. */
.fx-wave{animation:fx-wave 8s linear infinite}
.fx-wave.b{animation-duration:13s;animation-direction:reverse}
@keyframes fx-wave{to{transform:translateX(-320px)}}
/* Summer's sun sits half off the top corner of the hero, its rays turning slowly. */
.fx-sky{position:absolute;left:clamp(-150px,-6vw,-60px);top:clamp(10px,4vw,60px);width:clamp(220px,30vw,440px);aspect-ratio:1}
.fx-sky svg{width:100%;height:100%;display:block;overflow:visible}
.fx-rays{animation:fx-spin 60s linear infinite;transform-box:fill-box;transform-origin:center}
@keyframes fx-spin{to{transform:rotate(360deg)}}
@media (max-width:700px){.fx-sky{left:-90px;top:-40px;width:230px;opacity:.85}}
@media (prefers-reduced-motion:reduce){.fx-wave,.fx-rays{animation:none}}
/* 4th of July: a red-and-blue glow on the main buttons. */
html[data-season-fx="fourthOfJuly"] .btn-berry{box-shadow:0 0 0 3px rgb(var(--fx-glow) / .4),0 0 0 6px rgb(var(--fx-glow2) / .28),0 8px 22px -8px rgb(var(--shadow-tint) / .6)}
/* New Year: the footer city stands under a night sky, so the strip is a little taller. */
html[data-season-fx="newYear"] .fx-band{height:clamp(96px,12vw,160px)}
.fx-twinkle{animation:fx-star 3.6s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes fx-star{0%,100%{opacity:1}50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){.fx-twinkle{animation:none}}
/* ...and the footer below it is the same night, so the city sits in it. No stars here: they belong in the sky, not under the street. */
html[data-season-fx="newYear"] footer{position:relative;border-top:0;color:#C8C3D9;
  background:linear-gradient(180deg,var(--fx-night-ink),var(--fx-night1));
  box-shadow:0 0 0 100vmax var(--fx-night1);clip-path:inset(0 -100vmax)}
html[data-season-fx="newYear"] footer a{color:#EEDFAE}
html[data-season-fx="newYear"] footer :is(p,.legal){color:#C8C3D9}
html[data-season-fx="newYear"] footer .copyright{color:#E2DDF0}
html[data-season-fx="newYear"] footer a:hover{color:#fff}
/* St Patrick's: the footer's fields, cottage and rainbow get a taller strip. */
html[data-season-fx="stPatricks"] .fx-band{height:clamp(110px,14vw,200px)}
html[data-season-fx="stPatricks"] :is(.fx-band,.fx-cluster) svg{overflow:visible}
/* Summer: a taller footer strip so its sky and clouds have room above the sea. */
html[data-season-fx="summer"] .fx-band{height:clamp(120px,14vw,200px)}
/* 4th of July: a taller footer strip, so its sky can melt into the page above the town. */
html[data-season-fx="fourthOfJuly"] .fx-band{height:clamp(110px,14vw,200px)}
/* Fall and Christmas: taller footer scenes. */
html[data-season-fx="fall"] .fx-band,html[data-season-fx="christmas"] .fx-band{height:clamp(120px,15vw,210px)}
/* Christmas: the footer's gingerbread folk follow the look, women in the Women look and men in the Men look. */
:root:not([data-look="men"]) .fx-gb-m,:root[data-look="men"] .fx-gb-w{display:none}
/* Winter: icicles under the menu bar, taller than Christmas's lights, with the odd drop of meltwater falling. */
.fx-icicles,.fx-icicles svg{height:84px}
/* Winter: the menu bar is solid ice, so the hero's monstera no longer shows through it or the icicles (Allan, 2026-10-25). */
html[data-season-fx="winter"] .nav{background:#F4FAFF}
.fx-drip{transform-box:fill-box;animation:fx-drip 6s ease-in infinite;opacity:0}
@keyframes fx-drip{0%,70%{transform:translateY(0);opacity:0}74%{opacity:.9}100%{transform:translateY(60px);opacity:0}}
@media (prefers-reduced-motion:reduce){.fx-drip{animation:none;opacity:0}}
/* Fall: the hero's farm scene needs a taller strip than the other seasons' grounds. */
.fx-ground-fall{height:clamp(130px,16vw,230px)}
/* @@NEW-RULES (per-season extras go above this line) */

/* ── The falling layer over the whole site ── */
#fxFall{position:fixed;inset:0;width:100%;height:100%;z-index:45;pointer-events:none}
html[data-season-fx] #leavesFall{display:none}

/* Chimney smoke: each puff rises, drifts, grows and fades, one after another */
.fx-smoke{transform-box:fill-box;transform-origin:center;opacity:0;filter:blur(2px);animation:fx-smoke 6.4s ease-out infinite}
@keyframes fx-smoke{0%{transform:translate(0,0) scale(.5);opacity:0}12%{opacity:.7}60%{opacity:.4}100%{transform:translate(-30px,-120px) scale(3);opacity:0}}
/* Winter: a taller footer strip, and the smoke may rise above the scene's own box. */
html[data-season-fx="winter"] .fx-band{height:clamp(130px,15vw,210px)}
html[data-season-fx="winter"] :is(.fx-band,.fx-cluster) svg{overflow:visible}
@media (prefers-reduced-motion:reduce){
  .fx-bulb,.fx-hang{animation:none}
  .fx-smoke{animation:none;opacity:.6}
  #fxFall{display:none}
}
@media print{.fx-ribbon,.fx-garland,.fx-hero,.fx-edge,.fx-band,#fxFall{display:none}}
