/* Loaded after the existing hero styles. Animate wrappers, not video frames. */
.farm-hero::after{background:linear-gradient(180deg,#102c355c 0%,#102c3526 40%,transparent 66%),linear-gradient(0deg,#132e2460,transparent 44%)}
.hero-copy h1{text-shadow:0 2px 18px #102c354d}
.hero-copy p{text-shadow:0 1px 8px #102c3559}
.hero-hint{grid-column:2;grid-row:4;display:flex;align-items:center;gap:8px;margin:0;color:#fff8df;font-size:12px;font-weight:650}
.hero-hint::before{content:'';width:7px;height:7px;flex:none;border-radius:50%;background:#f7d18b;box-shadow:0 0 0 5px #f7d18b26}
.animal-stage .animal-sprite{transform-origin:50% 100%;animation:animal-breathe 4.8s ease-in-out infinite}
.animal-stage .animal-sprite:nth-child(2){animation-delay:-1.1s}
.animal-stage .animal-sprite:nth-child(3){animation-delay:-2.3s}
.animal-stage .animal-sprite:nth-child(4){animation-delay:-3.2s}
.animal-stage .animal-sprite:nth-child(5){animation-delay:-.7s}
.animal-stage .animal-sprite.playing{animation:none}
.animal-stage .animal-sprite.is-highlighted{animation:animal-greet .55s ease-out}
@keyframes animal-breathe{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-3px) scale(1.012)}}
@keyframes animal-greet{0%,100%{transform:translateY(0) scale(1)}45%{transform:translateY(-10px) scale(1.035)}}
.animal-stage button[data-animal] span{background:linear-gradient(145deg,#fffef8d9,#e6eedfc7);border-color:#ffffffbd;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 6px 20px #102e3026,inset 0 1px #fff9;transition:transform .16s,background .2s,box-shadow .2s}
.animal-stage button[data-animal]:active span{transform:translateX(-50%) scale(.94);background:#fff5da}
.hero-actions .button{position:relative;overflow:hidden;transition:transform .15s,box-shadow .2s}
.hero-actions .button:active{transform:scale(.96)}
.hero-actions .touch-wave{position:absolute;width:24px;height:24px;margin:-12px;border-radius:50%;background:#fff7;pointer-events:none;animation:hero-ripple .55s ease-out forwards}
@keyframes hero-ripple{to{transform:scale(24);opacity:0}}
.animal-stage .animal-sound{display:flex;align-items:center;gap:8px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.animal-sound::before{content:'';width:7px;height:7px;border-radius:50%;background:#f7d18b;box-shadow:0 0 0 0 #f7d18b66}
.animal-sound[aria-pressed="false"]::before{animation:sound-wave 2.8s ease-out infinite}
.animal-sound[aria-pressed="true"]::before{background:#c6d3ca}
@keyframes sound-wave{70%,100%{box-shadow:0 0 0 8px #f7d18b00}}
/* Natural height removes the empty flex track on narrow screens. */
@media(max-width:760px){
 .farm-hero{height:auto;min-height:0;max-height:none;grid-template-rows:auto auto;padding:88px 18px 14px;gap:14px}
 .hero-copy{gap:12px}
 .hero-copy h1{font-size:clamp(29px,7.4vw,40px);line-height:1.04;max-width:560px}
 .hero-copy p{font-size:13px;line-height:1.45}
 .hero-copy .kicker{font-size:10px;letter-spacing:.19em}
 .hero-copy .hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}
 .hero-copy .hero-actions .button{padding:12px 8px;min-height:44px;text-align:center;justify-content:center;font-size:12px}
 .hero-hint{font-size:11px}
 .farm-hero .animal-stage{height:246px;min-height:246px;max-height:246px;width:100%}
 .farm-hero .animal-stage .animal-art{bottom:92px}
 .farm-hero .animal-stage>img{height:154px}
 .animal-stage button[data-animal]{bottom:42px;height:calc(100% - 42px)}
 .animal-stage button[data-animal] span{min-height:42px;border-radius:14px;padding:8px 4px}
 .animal-stage .animal-sound{font-size:10px;min-height:30px;padding:6px 10px}
 .farm-bg{object-position:60% center}
}
@media(prefers-reduced-motion:reduce){
 .animal-stage .animal-sprite,.animal-stage .animal-sprite.is-highlighted,.animal-sound[aria-pressed="false"]::before,.hero-actions .touch-wave{animation:none}
 .hero-actions .button,.animal-stage button[data-animal] span{transition:none}
}
