/* New Car — motion layer (C2 Profit inspired) */
:root{--ease:cubic-bezier(.22,.61,.36,1)}

/* Hero: slow breathe/ken burns */
@keyframes hero-breathe{0%{transform:scale(1)}100%{transform:scale(1.08)}}
.hero-media img{animation:hero-breathe 18s var(--ease) infinite alternate;will-change:transform}

/* Ticker: continuous ribbon */
@keyframes ticker{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.ribbon-track{display:flex;gap:2.5rem;width:max-content;animation:ticker 22s linear infinite}
.ribbon-track:hover{animation-play-state:paused}

/* Reveal on scroll */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* Micro-interactions */
.button,.header-link,.text-link,.service-list a,summary,.map,.contact-info a,footer a{transition:color .45s var(--ease),background .45s var(--ease),border-color .45s var(--ease),transform .45s var(--ease),padding .45s var(--ease)}
.service-list a:hover strong{color:var(--red)}
.button:hover{transform:translateY(-2px)}
.hero-actions .button:hover{background:#e2e6ea}
.details-summary-arrow,summary:after{transition:transform .45s var(--ease)}
details[open] summary:after{transform:rotate(180deg)}

/* Hero cue: floating arrow */
@keyframes cue-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
.hero-cue{display:inline-flex;align-items:center;gap:.6rem;position:absolute;bottom:4.5rem;left:8vw;font:10px 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.12em;color:#dce4ee;z-index:2}
.hero-cue span{animation:cue-bounce 2s ease-in-out infinite;color:#f0a09a}
@media(max-width:760px){.hero-cue{display:none}}

/* Photo break subtle pan */
@keyframes photo-pan{0%{transform:scale(1.02) translateX(0)}100%{transform:scale(1.08) translateX(-1.2%)}}
.photo-break img{animation:photo-kenburns 18s var(--ease) infinite alternate;will-change:transform}

/* Ticker strip */
.ticker{background:var(--red);color:var(--navy);overflow:hidden;padding:.9rem 0;white-space:nowrap}
.ticker .ribbon-track{display:flex;align-items:center;gap:1.6rem;width:max-content;padding-left:1.6rem;animation:ticker 26s linear infinite}
.ticker span{font:11px 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.12em}
.ticker b{color:var(--cream);font-size:1rem}
.ribbon-track:hover{animation-play-state:paused}
/* WhatsApp floating button */
@keyframes wa-pulse{0%{transform:scale(1)}45%{transform:scale(1.1)}100%{transform:scale(1)}}
.wa-float{position:fixed;right:1.2rem;bottom:1.2rem;z-index:90;display:flex;align-items:center;justify-content:center;background:#25d366;color:#fff;width:62px;height:62px;border-radius:50%;box-shadow:0 8px 26px rgba(0,0,0,.28);animation:wa-pulse 2s ease-in-out infinite;transition:transform .45s var(--ease);will-change:transform}
.wa-float::after{content:"";position:absolute;inset:0;border-radius:50%;background:#25d366;z-index:-1;animation:wa-ring 2s ease-out infinite;opacity:0}
@keyframes wa-ring{0%{transform:scale(1);opacity:.45}100%{transform:scale(1.7);opacity:0}}
.wa-float:hover{animation-play-state:paused;transform:scale(1.08)}
.wa-float svg{display:block;flex:none}
.wa-float span{display:none}
@media(max-width:760px){.wa-float{bottom:1rem;right:1rem;width:60px;height:60px}}
@media (prefers-reduced-motion: reduce){.wa-float{animation:none;transition:none}.wa-float::after{animation:none}.ticker .ribbon-track{animation:none}}

/* Map click-to-load */
.map-load{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;width:100%;min-height:260px;border:0;cursor:pointer;background:linear-gradient(180deg,#0e2a4a,#123458);color:#f5f7fa;font:600 13px 'Space Grotesk',Arial,sans-serif;text-transform:uppercase;letter-spacing:.08em;transition:background .45s var(--ease)}
.map-load:hover{background:linear-gradient(180deg,#13355c,#163f6e)}
.map-load svg{margin-bottom:.2rem;opacity:.95}
.map-load small{font:10px 'DM Mono',monospace;text-transform:none;letter-spacing:.05em;color:#b9c8da}
@media (prefers-reduced-motion: reduce){.map-load{transition:none}}

/* Staggered steps */
.reveal:nth-child(2){transition-delay:.1s}
.reveal:nth-child(3){transition-delay:.2s}
.reveal:nth-child(4){transition-delay:.3s}

@media (prefers-reduced-motion: reduce){
  .hero-media img,.photo-break img,.ribbon-track,.hero-cue span{animation:none}
  .reveal{opacity:1;transform:none;transition:none}
}