/* Leticia Suites — concept: copper-dusk (auto-generated recolor) */
/* ————————————————————————————————
   Leticia Suites · v12 wow layer
   Structural + motion upgrades on top of style.css
———————————————————————————————— */

/* ===== 1 · Hero: masked line reveal + slow Ken Burns ===== */
.hero h1 .l{display:block;overflow:hidden}
.hero h1 .l>span{display:block;transform:translateY(110%);}
@media(prefers-reduced-motion:no-preference){
  .hero h1 .l>span{animation:lineUp 1.15s var(--ease) forwards}
  .hero h1 .l:nth-child(2)>span{animation-delay:.16s}
  .hero-photo{transform:scale(1.09);animation:kenburns 7.5s var(--ease) forwards}
  /* replace the old whole-h1 rise: the lines carry the entrance now */
  .hero-copy h1{opacity:1;transform:none;animation:none}
}
@keyframes lineUp{to{transform:none}}
@keyframes kenburns{to{transform:scale(1)}}

/* ===== 2 · Kicker hairline draws in when section becomes visible ===== */
.reveal .kicker.line::before{width:0;transition:width .9s var(--ease) .15s}
.reveal.visible .kicker.line::before{width:44px}

/* ===== 3 · Gallery images wipe in with stagger ===== */
@media(prefers-reduced-motion:no-preference){
  .reveal .gallery button{clip-path:inset(0 0 100% 0);transition:clip-path 1s var(--ease)}
  .reveal.visible .gallery button{clip-path:inset(0 0 0% 0)}
  .reveal.visible .gallery button:nth-child(2){transition-delay:.1s}
  .reveal.visible .gallery button:nth-child(3){transition-delay:.18s}
  .reveal.visible .gallery button:nth-child(4){transition-delay:.26s}
  .reveal.visible .gallery button:nth-child(5){transition-delay:.34s}
}

/* ===== 5 · Neighbourhood chart draws itself ===== */
.nbhd-chart .ring{stroke-dasharray:4 7;transition:none}
@media(prefers-reduced-motion:no-preference){
  .nbhd-chart .rings circle{transform-origin:280px 280px;transform:scale(.6);opacity:0;
    transition:transform 1.1s var(--ease),opacity .9s}
  .nbhd-chart.visible .rings circle{transform:none;opacity:1}
  .nbhd-chart.visible .rings .r2{transition-delay:.12s}
  .nbhd-chart.visible .rings .r3{transition-delay:.24s}
  .nbhd-chart .ring-label{opacity:0;transition:opacity .7s .7s}
  .nbhd-chart.visible .ring-label{opacity:1}
  .nbhd-chart .spot{opacity:0;transform:translateY(8px);transition:opacity .6s,transform .6s var(--ease)}
  .nbhd-chart.visible .spot{opacity:1;transform:none}
  .nbhd-chart.visible .s1{transition-delay:.45s}.nbhd-chart.visible .s2{transition-delay:.55s}
  .nbhd-chart.visible .s3{transition-delay:.65s}.nbhd-chart.visible .s4{transition-delay:.75s}
  .nbhd-chart.visible .s5{transition-delay:.85s}.nbhd-chart.visible .s6{transition-delay:.95s}
  .nbhd-chart.visible .s7{transition-delay:1.05s}.nbhd-chart.visible .s8{transition-delay:1.15s}
}

/* ===== 6 · Grand CTA band before contact ===== */
.grand-cta{position:relative;background:var(--paper);padding:130px 0 140px;overflow:hidden;border-top:1px solid var(--line)}
.grand-marquee{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%);white-space:nowrap;pointer-events:none;opacity:.07}
.grand-marquee span{display:inline-block;font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:500;font-size:11rem;line-height:1;padding-right:60px;animation:grandDrift 38s linear infinite}
@keyframes grandDrift{to{transform:translateX(-50%)}}
.grand-inner{position:relative;z-index:2;text-align:center}
.grand-inner .kicker{justify-content:center}
.grand-inner h2{font-size:clamp(2.6rem,5vw,4.8rem);line-height:1.05;margin-bottom:18px}
.grand-inner h2 em{color:var(--gold)}
.grand-inner p{max-width:520px;margin:0 auto 34px;color:#574b4c;line-height:1.75}
.grand-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
@media(prefers-reduced-motion:reduce){.grand-marquee{display:none}}

/* ===== 7 · Reviews: quote ink-sweep on activation ===== */
@media(prefers-reduced-motion:no-preference){
  .review.is-on blockquote{background:linear-gradient(100deg,#f6f1ee 45%, rgba(246,241,238,.25) 55%);
    background-size:250% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;
    -webkit-text-fill-color:transparent;color:transparent;animation:inkSweep 1.6s var(--ease) .15s forwards}
}
@keyframes inkSweep{to{background-position:0 0}}

/* ===== 8 · Micro-interactions ===== */
.button{will-change:transform}
.hero-facts strong,.review-badges strong{font-variant-numeric:tabular-nums}
.included-grid article{transform-style:preserve-3d}
.included-grid article:hover{box-shadow:0 30px 60px rgba(0,0,0,.38)}

/* mobile: shorten CTA band type */
@media(max-width:700px){
  .grand-cta{padding:90px 0}
  .grand-marquee span{font-size:6rem}
}