/* Aparición al hacer scroll */
.rv { opacity: 0; transform: translateY(34px); transition: opacity 1s cubic-bezier(.2,.7,.2,1), transform 1s cubic-bezier(.2,.7,.2,1); }
.rv.is-in { opacity: 1; transform: none; }
.rv.d1 { transition-delay: .1s; } .rv.d2 { transition-delay: .2s; } .rv.d3 { transition-delay: .3s; }
.clip { clip-path: inset(12% 0 12% 0); transition: clip-path 1.3s cubic-bezier(.2,.7,.2,1); }
.clip.is-in { clip-path: inset(0 0 0 0); }

/* Ola que corre bajo el título de la marea */
@keyframes wave-run { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.tide-wave { animation: wave-run 7s linear infinite; }

/* Pantalla de carga: la casa se dibuja y se abre como agua (0,8 s, una vez por visita) */
.load-splash { position: fixed; inset: 0; z-index: 300; background: var(--navy); display: grid; place-items: center; animation: splash-out .45s ease .55s forwards; pointer-events: none; }
.load-splash svg { width: 74px; height: 74px; color: var(--white); }
.load-splash svg .roof { stroke-dasharray: 1; stroke-dashoffset: 1; animation: draw .5s ease forwards; }
.load-splash svg .waterline { transform-origin: 50% 100%; transform: scaleY(0); animation: fill .45s ease .25s forwards; }
@keyframes draw { to { stroke-dashoffset: 0; } }
@keyframes fill { to { transform: scaleY(1); } }
@keyframes splash-out { to { opacity: 0; visibility: hidden; clip-path: inset(0 0 100% 0); } }
.no-splash .load-splash { display: none; }

@media (prefers-reduced-motion: reduce) {
  .rv, .clip { opacity: 1; transform: none; clip-path: none; transition: none; }
  .tide-wave { animation: none; }
  .load-splash { display: none; }
}
@keyframes line-draw { to { stroke-dashoffset: 0; } }
@keyframes line-run { from { transform: translateX(0); } to { transform: translateX(-450px); } }
@keyframes mq { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes ph-rise { to { clip-path: inset(0 0 0 0); } }
@media (prefers-reduced-motion: reduce) {
  .hero-line path { animation: none; stroke-dashoffset: 0; }
  .mq-track, .tide-foam svg { animation: none; }
  .page-hero .ph-media { animation: none; clip-path: none; }
  .svc-float, .hero-ripple, .curtain { display: none; }
}
