
/* ===== Movimiento fino ===== */
:root{--ease:cubic-bezier(.22,.61,.36,1)}

/* Portada: fundido entre fotos + acercamiento lento */
.hero-slides{position:absolute;inset:0;background:#2b3a42}
.slide{position:absolute;inset:0;background:center/cover no-repeat;opacity:0;transition:opacity 2.2s ease;will-change:opacity,transform}
.slide.on{opacity:1;animation:kenburns 14s linear forwards}
@keyframes kenburns{from{transform:scale(1.1)}to{transform:scale(1.0)}}

/* Entrada de la portada y del logo */
.intro{opacity:0;transform:translateY(24px);transition:opacity 1.4s var(--ease),transform 1.4s var(--ease)}
.finder.intro{transition-delay:.5s}
body.ready .intro{opacity:1;transform:none}
.nav .logo{clip-path:inset(0 100% 0 0);transition:clip-path 1.8s var(--ease) .2s}
body.ready .nav .logo{clip-path:inset(0 0 0 0)}

/* Aparición al bajar */
.reveal{opacity:0;transform:translateY(32px);transition:opacity 1.1s var(--ease),transform 1.1s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* Línea dorada que se dibuja bajo cada título */
.section-head h2::after,.about-text h2::after{content:"";display:block;width:56px;height:1px;background:var(--accent);margin:1.3rem auto 0;transform:scaleX(0);transition:transform 1.2s var(--ease) .45s}
.about-text h2::after{margin-left:0;transform-origin:left}
.reveal.in h2::after{transform:scaleX(1)}

/* Tarjetas: foto que se acerca apenas y línea bajo el título */
.card-img img.bg{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.4s var(--ease)}
.card:hover .card-img img.bg{transform:scale(1.045)}
.card-body h3{display:inline;background:linear-gradient(var(--ink),var(--ink)) left bottom/0 1px no-repeat;transition:background-size .7s var(--ease)}
.card:hover .card-body h3{background-size:100% 1px}
.card-body h3+p{margin-top:.5rem}

/* Si la persona pidió menos movimiento en su equipo, se respeta */
@media (prefers-reduced-motion: reduce){
  .intro,.reveal{opacity:1!important;transform:none!important;transition:none!important}
  .nav .logo{clip-path:none!important}
  .slide.on{animation:none}
  .section-head h2::after,.about-text h2::after{transform:scaleX(1)}
}
.card-body .place{margin-bottom:.35rem}

/* Ajustes de celular */
.card-img img.bg{color:transparent}
.finder label{min-width:0}
.finder select{width:100%;min-width:0;text-overflow:ellipsis}
@media (max-width:960px){
  .hero .kicker{letter-spacing:.16em;font-size:.68rem}
  .dorita-btn{opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .6s var(--ease),transform .6s var(--ease)}
  body.scrolled .dorita-btn{opacity:1;transform:none;pointer-events:auto}
}
