/* Sketch decorations only: original pink/white palette is preserved. */
main{overflow-x:clip}main>section{position:relative;isolation:isolate}
.autumn-scatter{position:absolute;inset:0;pointer-events:none;user-select:none;z-index:-1}
.autumn-sprite{position:absolute;display:block;width:76px;aspect-ratio:1;background:url('assets/autumn-sketch-sprite.webp') no-repeat;background-size:300% 100%}
.autumn-oak{background-position:0 0}.autumn-pink{background-position:50% 0}.autumn-pumpkin{background-position:100% 0;width:150px}
.ornament-1{left:0;top:14px;transform:rotate(-18deg)}.ornament-2{right:0;top:37%;transform:rotate(13deg)}.ornament-3{right:0;top:6px;transform:rotate(80deg)}.ornament-4{left:0;bottom:24px;transform:rotate(-65deg)}.ornament-5{right:0;bottom:0}.ornament-6{left:0;top:55%;transform:rotate(-75deg)}
section.wrap>.autumn-scatter .ornament-1,section.wrap>.autumn-scatter .ornament-4,section.wrap>.autumn-scatter .ornament-6{left:-5vw}
section.wrap>.autumn-scatter .ornament-2,section.wrap>.autumn-scatter .ornament-3{right:-5vw}
section.wrap>.autumn-scatter .ornament-5{right:-4vw;bottom:-28px;width:110px}
.autumn-scatter-1 .ornament-5{right:auto;left:-2vw}.autumn-scatter-1 .ornament-4{left:auto;right:4%;bottom:10px}.autumn-scatter-2 .ornament-5{width:110px}
.autumn-dashes{position:absolute;width:37px;height:38px;color:#bd0045;transform:rotate(-25deg)}
.autumn-dashes:before,.autumn-dashes:after{content:"";position:absolute;background:currentColor;width:5px;height:25px;border-radius:8px;transform:rotate(20deg);left:5px;top:0}
.autumn-dashes:after{left:24px;top:13px;transform:rotate(57deg)}
.dash-1{left:2%;top:27%}.dash-2{right:2%;top:21%;transform:rotate(25deg)}.dash-3{left:2%;bottom:13%;transform:rotate(-78deg)}.dash-4{right:2%;bottom:20%;transform:rotate(12deg)}.dash-5{left:38%;top:9%;transform:rotate(15deg)}.dash-6{right:15%;bottom:3%;transform:rotate(28deg)}
section:not(.hero-sweet) .dash-5,section:not(.hero-sweet) .dash-6{display:none}
.hero-sweet>.autumn-scatter{z-index:2}
.hero-sweet>.autumn-scatter .ornament-1{width:92px;top:15px;left:0}.hero-sweet>.autumn-scatter .ornament-2{top:49%;right:0}.hero-sweet>.autumn-scatter .ornament-3{width:85px;right:0;top:20px}.hero-sweet>.autumn-scatter .ornament-4{left:6px;top:145px;bottom:auto;width:64px;transform:rotate(-15deg)}.hero-sweet>.autumn-scatter .ornament-5{bottom:28px;right:9px;width:170px}.hero-sweet>.autumn-scatter .ornament-6{top:57%;left:0;width:80px}
.hero-sweet-inner{position:relative;z-index:1}.hero-sweet-art .hero-hello{bottom:10%}


.hero-waffle-pair{position:relative}

@media(max-width:1100px){.autumn-sprite{width:54px}.autumn-pumpkin{width:100px}.hero-sweet>.autumn-scatter .ornament-5{width:120px}}
@media(max-width:700px){.autumn-sprite{width:35px}.autumn-pumpkin,section.wrap>.autumn-scatter .ornament-5,.autumn-scatter-2 .ornament-5{width:65px}.autumn-dashes{scale:.55;transform-origin:center}.dash-1,.dash-3{left:-8px}.dash-2,.dash-4{right:-8px}.hero-sweet>.autumn-scatter .ornament-1,.hero-sweet>.autumn-scatter .ornament-3{width:38px;top:4px}.hero-sweet>.autumn-scatter .ornament-4{width:28px;top:120px;left:-5px}.hero-sweet>.autumn-scatter .ornament-6{width:32px;left:-5px}.hero-sweet>.autumn-scatter .ornament-5{width:85px;bottom:24px;right:0}.hero-sweet>.autumn-scatter .dash-5{display:none}}
@media print{.autumn-scatter{display:none}}

/* Reference sketch: marks follow the title, waffles, ice cream and mascot. */
.hero-kicker,.hero-is-word,.hero-waffle-heading{position:relative}
.hero-kicker{width:fit-content}
.sketch-mark{position:absolute;display:block;width:46px;height:39px;overflow:visible;pointer-events:none;color:#bd0045;z-index:3}
.sketch-mark path{fill:none;stroke:currentColor;stroke-width:6;stroke-linecap:round;stroke-linejoin:round}
.mark-kicker{left:100%;top:-12px;margin-left:8px}
.mark-is{left:-52px;bottom:0;top:auto}
.mark-waffle-heading{right:0;bottom:2px;width:26px;height:32px}
.mark-waffles-left{left:-4px;top:12%}
.mark-waffles-middle{left:43%;top:28%;width:34px;height:30px}
.mark-waffles-right{left:84%;top:19%}
.mark-ice{left:71%;top:31%;width:48px;height:43px}
.mark-otter{left:14%;top:48%;transform:rotate(-12deg)}
.hero-hello .mark-hello{left:95%;top:0;width:44px;height:40px}
.mark-pumpkin{right:3%;top:-4%;width:34px;height:33px}
.mark-edge{right:1%;top:31%;width:24px;height:35px;transform:rotate(45deg)}
@media(max-width:1100px){.sketch-mark{width:36px;height:33px}.mark-is{left:-39px}.mark-kicker{margin-left:4px}.mark-waffles-middle{width:28px}.mark-waffle-heading{right:-10px;width:20px}}
@media(max-width:700px){.hero-kicker{margin-left:auto;margin-right:auto}.mark-kicker{width:25px;height:26px;top:-5px;margin-left:3px}.mark-is{left:13%;width:30px;height:30px;bottom:3px}.mark-waffle-heading{right:-5px;bottom:1px;width:18px;height:25px}.mark-waffles-left{left:2%;top:11%}.mark-waffles-middle{left:45%;top:28%;width:25px;height:25px}.mark-waffles-right{left:auto;right:0;top:18%}.mark-ice{left:76%;top:31%;width:34px;height:34px}.mark-otter{left:17%;top:49%;width:32px;height:32px}.hero-hello .mark-hello{width:29px;height:28px;left:91%;top:-12px}.mark-pumpkin{width:25px;height:24px}.mark-edge{top:auto;bottom:38%;right:0;width:18px;height:25px}}
@media print{.sketch-mark{display:none}}

/* Keep ornaments hidden until their positions have been checked against content. */
.autumn-sprite,.autumn-dashes,.sketch-mark{visibility:hidden}
/* Keep the two title sparkles at the proportions shown in the approved sketch. */
.hero-is-word .hero-title-star-one{width:38px;height:48px}
.hero-is-word .hero-title-star-two{width:28px;height:36px}
@media(max-width:700px){.hero-is-word .hero-title-star-one{width:25px;height:32px}.hero-is-word .hero-title-star-two{width:19px;height:26px}}

/* Title decoration follows the compact, staggered grouping in the approved sketch. */
.hero-is-word{width:max-content}
.hero-is-word .hero-title-star-one{left:calc(100% + 28px);top:0;width:34px;height:46px}
.hero-is-word .hero-title-star-two{left:calc(100% + 67px);top:47%;width:25px;height:34px}
.hero-is-word .mark-is{left:-48px;bottom:2px;width:36px;height:35px}
@media(max-width:700px){
 .hero-is-word{margin-inline:auto}
 .hero-is-word .hero-title-star-one{left:calc(100% + 19px);top:0;width:24px;height:32px}
 .hero-is-word .hero-title-star-two{left:calc(100% + 49px);top:47%;width:18px;height:25px}
 .hero-is-word .mark-is{left:-43px;bottom:0;width:29px;height:28px}
}
