/* Paisaje original reinterpretado: una sola escala, suelo y objetos con apoyo. */
.hero .landscape-scene { display: flex; align-items: center; justify-content: center; min-height: 0; height: auto; aspect-ratio: 480 / 440; top: 50%; bottom: auto; transform: translateY(-50%); background: #79c4e5; border-radius: 16px 16px 40px 16px; }
.klipa-landscape { display: block; width: 100%; height: auto; }
.land-cloud { animation: landscape-cloud 16s ease-in-out infinite; }
.land-birds { animation: landscape-birds 24s steps(200,end) infinite -10s; }
/* Dos fotogramas sobre una cuadrícula de 3 unidades, sin escalar las alas. */
.bird-up { animation: bird-frame-up 1.2s steps(1,end) infinite; }
.bird-down { animation: bird-frame-down 1.2s steps(1,end) infinite; }
.bird-late .bird-frame { animation-delay: -.3s; }
.land-chart { transform-origin: 360px 278px; animation: landscape-chart 8s ease-in-out infinite; }
.land-leaves { transform-origin: 436px 258px; animation: landscape-leaves 10s ease-in-out infinite; }
:root[data-theme="night"] .hero .landscape-scene { background: #141c3b; }
:root[data-theme="night"] .land-sky { fill: #1f2b50; }
:root[data-theme="night"] .land-sky-top { fill: #141c3b; }
:root[data-theme="night"] .land-haze { fill: #344768; }
:root[data-theme="night"] .land-hill-back { fill: #496c68; }
:root[data-theme="night"] .land-hill-front { fill: #315b54; }
:root[data-theme="night"] .land-cloud { fill: #697b9c; }
:root[data-theme="night"] .land-birds { display: none; }
:root[data-theme="night"] .land-sun { visibility: hidden; }
:root[data-theme="night"] .land-moon,:root[data-theme="night"] .land-stars { visibility: visible; }
:root[data-theme="night"] .land-door,:root[data-theme="night"] .land-window { fill: #ead399; }
:root[data-theme="night"] .land-screen { fill: #e2ddbb; }
@keyframes landscape-cloud { 0%,100% { transform: translateX(0); } 50% { transform: translateX(12px); } }
@keyframes landscape-birds { from { transform: translateX(-261px); } to { transform: translateX(339px); } }
@keyframes bird-frame-up { 0%,100% { opacity: 1; } 50% { opacity: 0; } }
@keyframes bird-frame-down { 0%,100% { opacity: 0; } 50% { opacity: 1; } }
@keyframes landscape-chart { 0%,100% { transform: scaleY(.8); } 50% { transform: scaleY(1); } }
@keyframes landscape-leaves { 0%,100% { transform: rotate(-1deg); } 50% { transform: rotate(1deg); } }
@media(max-width:600px) { .hero .landscape-scene { top: auto; transform: none; height: auto; aspect-ratio: 480 / 440; min-height: 0; } }
@media(prefers-reduced-motion:reduce) { .klipa-landscape * { animation: none !important; } }
