/* A seasonal frame with a short entrance and gentle, user-driven depth. */
.hero{position:relative;isolation:isolate;overflow:hidden}
.hero-copy{position:relative;z-index:1}
.hero-door-scene{width:230px;height:168px;margin:0 auto 18px;pointer-events:none}
.hero h1>em{font-size:clamp(60px,5.8vw,88px);white-space:nowrap}
.hero-description{max-width:50ch!important}
.hero-local{font-family:var(--serif);font-style:italic;font-size:17px!important;color:#69724c!important}
.hero-door-scene svg,.hero-side-scene svg{display:block;width:100%;height:100%;overflow:visible}
.hero-side-scene{position:absolute;z-index:0;pointer-events:none;width:clamp(203px,19.5vw,308px);height:auto;aspect-ratio:360/600;top:auto;bottom:12%}
.hero-side-scene--harvest{left:-12px}
.hero-side-scene--garden{right:-12px}
.hero-frame-back{transform:translate(calc(var(--hero-drift-x,0px)*-.4),calc(var(--hero-drift-y,0px)*-.3));transition:transform .8s ease}
.hero-frame-reveal{animation:hero-frame-reveal 1.5s cubic-bezier(.2,.7,.3,1) both}
.hero-side-scene--garden .hero-frame-reveal{animation-delay:.15s}
.hero-frame-canopy,.hero-frame-stems,.hero-frame-flowers{transform-box:fill-box;transform-origin:50% 100%;animation:hero-frame-breeze 4.6s ease-in-out both}
.hero-frame-canopy{transform-origin:50% 0}
.hero-side-scene--garden .hero-frame-canopy,.hero-frame-flowers{animation-direction:reverse}
.hero-floating-leaf{transform-box:fill-box;transform-origin:center;animation:hero-leaf-welcome 4.8s cubic-bezier(.25,.6,.3,1) both}
.hero-floating-leaf--second{animation-duration:4.4s;animation-delay:.3s}
.hero-butterfly-flight{transform-box:fill-box;transform-origin:center;animation:hero-butterfly-welcome 4.8s ease-in-out both}
.hero-butterfly-wings{transform-origin:0 0;animation:hero-butterfly-flutter .6s ease-in-out 8}
.hero-frame-spark{transform-box:fill-box;transform-origin:center;animation:hero-scene-spark 4.8s ease-in-out both}
.hero-breeze-trail{opacity:.6;animation:hero-trail-arrive 2.8s ease both}
.hero .wd-package-foliage,.hero .wd-package-ribbon,.hero .wd-pumpkin-settle{animation:none}
.hero-art-arrive{animation:hero-scene-arrive 1.2s cubic-bezier(.22,.61,.36,1) both}
.hero-side-scene--garden .hero-art-arrive{animation-delay:.2s}
.hero-scene-sway{transform-box:fill-box;transform-origin:50% 100%;animation:hero-scene-sway 4.8s ease-in-out both}
.hero-scene-drift{transform-box:fill-box;transform-origin:center;animation:hero-scene-drift 4.8s ease-in-out both}
.hero-scene-spark{transform-box:fill-box;transform-origin:center;animation:hero-scene-spark 4.8s ease-in-out both}
.hero .hero-door-scene .wd-package-ribbon{transform-box:fill-box;transform-origin:50% 0;animation:hero-scene-sway 4.8s ease-in-out both}
@keyframes hero-scene-arrive{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes hero-scene-sway{0%,100%{transform:rotate(0)}25%{transform:rotate(-5deg)}60%{transform:rotate(4deg)}80%{transform:rotate(-2deg)}}
@keyframes hero-scene-drift{0%{transform:translate(-12px,-12px) rotate(-18deg);opacity:0}20%{opacity:1}45%{transform:translate(4px,-5px) rotate(12deg)}75%{transform:translate(-3px,2px) rotate(-5deg)}100%{transform:none;opacity:1}}
@keyframes hero-scene-spark{0%,25%{opacity:.3;transform:scale(.65)}50%{opacity:1;transform:scale(1.2)}75%{opacity:.6;transform:scale(.85)}100%{opacity:1;transform:none}}
@keyframes hero-frame-reveal{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes hero-frame-breeze{0%{transform:rotate(-3deg)}30%{transform:rotate(3deg)}65%{transform:rotate(-1.5deg)}100%{transform:rotate(0)}}
@keyframes hero-leaf-welcome{0%{opacity:0;transform:translate(-28px,-64px) rotate(-65deg)}15%{opacity:1}45%{transform:translate(17px,-27px) rotate(28deg)}75%{transform:translate(-9px,-9px) rotate(-15deg)}100%{opacity:1;transform:translate(0,0) rotate(0)}}
@keyframes hero-butterfly-welcome{0%{opacity:0;transform:translate(50px,-60px) rotate(28deg)}15%{opacity:1}45%{transform:translate(-21px,-22px) rotate(-18deg)}72%{transform:translate(8px,4px) rotate(9deg)}100%{opacity:1;transform:translate(0,0) rotate(0)}}
@keyframes hero-butterfly-flutter{0%,100%{transform:scaleX(1)}50%{transform:scaleX(.48)}}
@keyframes hero-trail-arrive{from{opacity:0;stroke-dashoffset:35}to{opacity:.6;stroke-dashoffset:0}}
@media(min-width:1101px){.hero{padding-top:32px;padding-bottom:44px}.hero h1{margin-top:21px}}
@media(max-width:1100px){.hero-side-scene{display:none}}
@media(max-width:760px){.hero-door-scene{width:176px;height:129px;margin-bottom:17px}.hero{padding-top:28px;padding-bottom:36px}.hero h1{font-size:clamp(34px,11.4vw,70px);letter-spacing:-.03em}.hero h1>span,.hero h1>em{font-size:inherit;letter-spacing:inherit;white-space:nowrap}.hero-description{max-width:34ch!important}.hero-local{font-size:15px!important}}
@media(max-width:760px) and (max-height:700px){.hero-door-scene{width:142px;height:104px;margin-bottom:12px}.hero{padding-block:22px}}
@media(prefers-reduced-motion:reduce){.hero .hero-art-arrive,.hero .hero-scene-sway,.hero .hero-scene-drift,.hero .hero-scene-spark,.hero .hero-door-scene .wd-package-ribbon,.hero-frame-reveal,.hero-frame-canopy,.hero-frame-stems,.hero-frame-flowers,.hero-floating-leaf,.hero-butterfly-flight,.hero-butterfly-wings,.hero-frame-spark,.hero-breeze-trail{animation:none}.hero-side-scene,.hero-frame-back{transition:none;transform:none}}

/* Three services: one steady doorway, three distinct arrivals. */
.hero-season-layer{opacity:0;visibility:hidden;transition:opacity 1.4s ease;pointer-events:none}
.hero-season-layer.is-active{opacity:1;visibility:visible}
.hero-season-layer.is-leaving{opacity:0;visibility:visible}
.hero-season-dressing{transform-origin:130px 177px}
.hero-season-layer.is-active .hero-season-dressing{animation:hero-dressing-arrive 1.5s cubic-bezier(.2,.7,.3,1) both}
.hero-season-layer.is-leaving .hero-season-dressing{animation:hero-dressing-leave 1.5s ease both}
.hero-season-layer:is(.is-active,.is-leaving) :is([data-planter],[data-pumpkin],[data-mum]){animation:hero-season-unfold 1.9s cubic-bezier(.2,.7,.3,1) both;animation-delay:var(--arrival-delay);transform-box:fill-box;transform-origin:center bottom}
.hero-season-layer:is(.is-active,.is-leaving) .hero-wreath-arrive{transform-origin:130px 94px;animation:hero-wreath-unfold 1.7s ease both}
.hero .hero-door-scene .wd-package-foliage{transform-box:fill-box;transform-origin:50% 100%;animation:hero-garden-breeze 3.5s ease-in-out infinite}
.hero .hero-door-scene [data-planter]:nth-child(even) .wd-package-foliage{animation-delay:-1.1s;animation-direction:reverse}
.hero .hero-door-scene .wd-package-ribbon{transform-box:fill-box;transform-origin:50% 0;animation:hero-ribbon-breeze 3.2s ease-in-out infinite}
.hero-season-air{opacity:1;transition:opacity .65s}
.hero-season-layer.is-leaving .hero-season-air{opacity:0}
.hero-fall-leaf,.hero-holiday-trail,.hero-holiday-comet,.hero-holiday-snow,.hero-spring-flight,.hero-spring-wings,.hero-spring-petal,.hero-summer-sun,.hero-sun-rays,.hero-summer-bee,.hero-bee-wings,.hero-summer-breeze,.hero-holiday-glint,.hero-garland-arrive{animation:none}
.hero-season-layer:is(.is-active,.is-leaving) .hero-fall-leaf{animation:hero-fall-tumble 5.2s ease-in-out both;animation-delay:var(--air-delay);transform-origin:0 0}
.hero-season-layer:is(.is-active,.is-leaving) .hero-garland-arrive{stroke-dasharray:100;animation:hero-garland-grow 1.7s ease both}
.hero-season-layer:is(.is-active,.is-leaving) .hero-holiday-glint{animation:hero-holiday-twinkle 3s ease-in-out infinite;animation-delay:var(--glint-delay)}
.hero-season-layer:is(.is-active,.is-leaving) .hero-holiday-trail{stroke-dasharray:8 92;animation:hero-holiday-pass 4.5s ease-in-out both}
.hero-season-layer:is(.is-active,.is-leaving) .hero-holiday-comet{animation:hero-winter-sweep 4.5s cubic-bezier(.3,0,.25,1) both}
.hero-season-layer:is(.is-active,.is-leaving) .hero-holiday-snow{animation:hero-mini-snow 4.8s linear both;animation-delay:var(--air-delay)}
.hero-season-layer:is(.is-active,.is-leaving) .hero-spring-flight{animation:hero-butterfly-visit 5.2s cubic-bezier(.4,0,.3,1) both}
.hero-season-layer:is(.is-active,.is-leaving) .hero-spring-wings{transform-origin:3px 4px;animation:hero-spring-flutter .55s ease-in-out infinite}
.hero-season-layer:is(.is-active,.is-leaving) .hero-spring-petal{animation:hero-petal-drift 4.8s ease-in-out both;animation-delay:var(--air-delay);transform-origin:0 0}
.hero-season-layer:is(.is-active,.is-leaving) .hero-summer-sun{animation:hero-sun-rise 2.2s ease both}
.hero-season-layer:is(.is-active,.is-leaving) .hero-sun-rays{animation:hero-sun-turn 10s linear infinite;transform-origin:0 0}
.hero-season-layer:is(.is-active,.is-leaving) .hero-summer-bee{animation:hero-bee-visit 5.2s ease-in-out both}
.hero-season-layer:is(.is-active,.is-leaving) .hero-bee-wings{animation:hero-bee-flutter .16s ease-in-out infinite;transform-origin:0 0}
.hero-season-layer:is(.is-active,.is-leaving) .hero-summer-breeze{stroke-dasharray:25 75;animation:hero-summer-air 3s ease-in-out infinite}
.hero-door-scene[data-motion="paused"] *, .hero-season-layer:not(.is-active):not(.is-leaving) *{animation-play-state:paused!important}
@keyframes hero-dressing-arrive{from{transform:translate(3px,3px)}to{transform:none}}
@keyframes hero-dressing-leave{from{transform:none}to{transform:translate(-3px,-2px)}}
@keyframes hero-season-unfold{from{opacity:0;translate:0 8px;scale:.88}to{opacity:1;translate:0 0;scale:1}}
@keyframes hero-wreath-unfold{from{opacity:0;transform:rotate(-8deg) scale(.85)}to{opacity:1;transform:none}}
@keyframes hero-garden-breeze{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(3deg)}}
@keyframes hero-ribbon-breeze{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(5deg)}}
@keyframes hero-fall-tumble{0%{opacity:0;transform:translate(8px,-12px) rotate(-35deg)}15%{opacity:1}35%{transform:translate(calc(-16px * var(--wind)),12px) rotate(25deg)}65%{opacity:1;transform:translate(calc(7px * var(--wind)),34px) rotate(-25deg)}100%{opacity:0;transform:translate(calc(-13px * var(--wind)),61px) rotate(55deg)}}
@keyframes hero-garland-grow{from{stroke-dashoffset:100;opacity:0}to{stroke-dashoffset:0;opacity:1}}
@keyframes hero-holiday-twinkle{0%{opacity:0}25%{opacity:1}60%{opacity:.5}100%{opacity:.85}}
@keyframes hero-holiday-pass{0%,8%{stroke-dashoffset:8;opacity:0}25%{opacity:.65}85%,100%{stroke-dashoffset:-100;opacity:0}}
@keyframes hero-holiday-flight{0%,8%{opacity:0;transform:translate(44px,113px) scale(.5)}22%{opacity:.9;transform:translate(50px,61px)}43%{transform:translate(90px,20px)}60%{opacity:.9;transform:translate(149px,15px)}76%{transform:translate(197px,42px)}90%,100%{opacity:0;transform:translate(217px,97px) scale(.4)}}
@keyframes hero-mini-snow{0%{opacity:0;transform:translate(0,-8px) rotate(0)}25%{opacity:.7}75%{opacity:.5}100%{opacity:0;transform:translate(7px,24px) rotate(35deg)}}
@keyframes hero-butterfly-visit{0%{opacity:0;transform:translate(62px,98px) rotate(-12deg)}15%{opacity:1;transform:translate(50px,63px) rotate(-20deg)}37%{transform:translate(93px,24px) rotate(10deg)}58%{transform:translate(154px,26px) rotate(20deg)}80%{transform:translate(205px,68px) rotate(12deg)}100%{opacity:1;transform:translate(196px,102px) rotate(-10deg)}}
@keyframes hero-spring-flutter{0%,100%{transform:scaleX(1)}50%{transform:scaleX(.35)}}
@keyframes hero-petal-drift{0%{opacity:0;transform:translate(0,0) rotate(-10deg) scale(.7)}20%{opacity:.85}50%{transform:translate(-12px,12px) rotate(40deg)}100%{opacity:0;transform:translate(6px,32px) rotate(100deg)}}
@keyframes hero-sun-rise{from{opacity:0;transform:translate(-8px,12px) scale(.6)}to{opacity:1;transform:none}}
@keyframes hero-sun-turn{to{transform:rotate(90deg)}}
@keyframes hero-bee-visit{0%{opacity:0;transform:translate(225px,103px) rotate(-15deg)}18%{opacity:1;transform:translate(199px,94px) rotate(-15deg)}38%{transform:translate(184px,73px) rotate(10deg)}60%{transform:translate(211px,63px) rotate(20deg)}80%{transform:translate(223px,86px) rotate(-10deg)}100%{opacity:1;transform:translate(199px,108px) rotate(-18deg)}}
@keyframes hero-bee-flutter{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.4)}}
@keyframes hero-summer-air{0%{opacity:0;stroke-dashoffset:25}30%{opacity:.6}100%{opacity:0;stroke-dashoffset:-100}}
@media(prefers-reduced-motion:reduce){.hero-door-scene *{animation:none!important;transition:none!important}.hero-season-dressing{transform:none}.hero-season-air{display:none}}


/* A single curved path keeps the winter flourish smooth and legible. */
.hero-holiday-comet{offset-path:path('M173 26Q210 12 218 65');offset-rotate:0deg;offset-anchor:0 0;transform:none}
.hero-season-layer:is(.is-active,.is-leaving) .hero-holiday-trail{stroke-width:1.4;stroke-dasharray:18 82;animation:hero-winter-trail 4.5s cubic-bezier(.3,0,.25,1) both}
@keyframes hero-winter-sweep{0%,8%{offset-distance:0%;opacity:0}20%{opacity:1}78%{opacity:1}100%{offset-distance:100%;opacity:0}}
@keyframes hero-winter-trail{0%,8%{stroke-dashoffset:18;opacity:0}22%{opacity:.7}75%{opacity:.6}100%{stroke-dashoffset:-100;opacity:0}}

/* Spring: separate hinged wings leave the body steady during each wingbeat. */
.hero-season-layer:is(.is-active,.is-leaving) .hero-wing-left{transform-origin:3px 5px;animation:hero-wing-left-beat .48s ease-in-out infinite}
.hero-season-layer:is(.is-active,.is-leaving) .hero-wing-right{transform-origin:3px 5px;animation:hero-wing-right-beat .48s ease-in-out -.035s infinite}
.hero-season-layer:is(.is-active,.is-leaving) .hero-butterfly-body{transform-origin:3px 5px;animation:hero-butterfly-bob 1.45s ease-in-out infinite}
@keyframes hero-wing-left-beat{0%,100%{transform:scaleX(1) rotate(-3deg)}42%{transform:scaleX(.22) rotate(8deg)}70%{transform:scaleX(.85) rotate(-2deg)}}
@keyframes hero-wing-right-beat{0%,100%{transform:scaleX(.95) rotate(3deg)}42%{transform:scaleX(.25) rotate(-8deg)}70%{transform:scaleX(1) rotate(2deg)}}
@keyframes hero-butterfly-bob{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-3px) rotate(3deg)}}

/* Outdoor Lighting combines warm branch lights, uplighting, and a clear lit approach. */
.hero-outdoor-backdrop{opacity:0;transition:opacity 1.4s ease}
.hero-door-scene[data-season="outdoor"] .hero-outdoor-backdrop{opacity:1}
.hero-season-layer:is(.is-active,.is-leaving) .hero-outdoor-tree{transform-box:fill-box;transform-origin:50% 100%;animation:hero-outdoor-breeze 4.2s ease-in-out infinite}
.hero-season-layer:is(.is-active,.is-leaving) .hero-outdoor-glimmer{animation:hero-outdoor-glimmer 3.2s ease-in-out infinite;animation-delay:var(--glint-delay)}
.hero-season-layer:is(.is-active,.is-leaving) .hero-outdoor-uplight{animation:hero-outdoor-warmth 3.8s ease-in-out infinite}
.hero-season-layer:is(.is-active,.is-leaving) .hero-outdoor-moon{animation:hero-outdoor-moon 1.8s ease both}
@keyframes hero-outdoor-breeze{0%,100%{rotate:-1deg}50%{rotate:1.2deg}}
@keyframes hero-outdoor-glimmer{0%,100%{opacity:.75}45%{opacity:1}70%{opacity:.55}}
@keyframes hero-outdoor-warmth{0%,100%{opacity:.76}50%{opacity:1}}
@keyframes hero-outdoor-moon{from{opacity:0;translate:0 4px}to{opacity:1;translate:0 0}}
@media(prefers-reduced-motion:reduce){.hero-outdoor-backdrop{transition:none}.hero-door-scene .hero-outdoor-tree,.hero-door-scene .hero-outdoor-glimmer,.hero-door-scene .hero-outdoor-uplight,.hero-door-scene .hero-outdoor-moon{animation:none!important}}