/* Phase 15: premium, road-inspired motion for the Dolfin homepage. */
.dolfin-home-motion { overflow: clip; }

.dolfin-home-motion .hero-copy img { transition: transform 1400ms cubic-bezier(.16, 1, .3, 1), filter 1200ms ease; }
.dolfin-home-motion .hero:hover .hero-copy img { transform: translateY(-.35rem) rotate(-1deg); filter: drop-shadow(0 1.4rem 1.4rem rgb(0 0 0 / 25%)); }
.dolfin-home-motion .hero-pages i { transform-origin: left; }
.dolfin-home-motion .outline-button,
.dolfin-home-motion .solid-button { transition: color 280ms ease, background-color 280ms ease, border-color 280ms ease, transform 380ms cubic-bezier(.16, 1, .3, 1), box-shadow 380ms ease; }
.dolfin-home-motion .outline-button:hover,
.dolfin-home-motion .solid-button:hover { transform: translateY(-.2rem); }

.dolfin-home-motion .tyre-finder { box-shadow: 0 1.4rem 3.4rem rgb(3 25 35 / 13%); }
.dolfin-home-motion .finder-tabs button { transition: color 260ms ease, background-color 300ms ease; }
.dolfin-home-motion .finder-fields label { transition: transform 320ms ease; }
.dolfin-home-motion .finder-fields label:focus-within { transform: translateY(-.16rem); }
.dolfin-home-motion .finder-fields select { transition: border-color 260ms ease, box-shadow 300ms ease, background-color 300ms ease; }
.dolfin-home-motion .finder-fields label:focus-within select { box-shadow: 0 .7rem 1.5rem rgb(0 93 133 / 10%); }

.dolfin-home-motion .range-panel { position: relative; }
.dolfin-home-motion .section-heading i { transform-origin: left; }
.dolfin-home-motion .dolfin-home-card { transition: opacity 720ms ease, transform 950ms cubic-bezier(.16, 1, .3, 1), box-shadow 420ms ease; }
.dolfin-home-motion .dolfin-home-card:hover { transform: translateY(-.45rem); box-shadow: 0 1.4rem 2.8rem rgb(0 75 112 / 15%); }
.dolfin-home-motion .dolfin-home-card img { transition: transform 800ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-home-motion .dolfin-home-card:hover img { transform: scale(1.035) rotate(-1deg); }

.dolfin-home-motion .feature-panel .feature-copy,
.dolfin-home-motion .advice-body .feature-copy { transition: transform 1100ms cubic-bezier(.16, 1, .3, 1), opacity 800ms ease; }
.dolfin-home-motion .clipped-media { overflow: hidden; }
.dolfin-home-motion .clipped-media img { transition: transform 1400ms cubic-bezier(.16, 1, .3, 1), filter 1000ms ease; }
.dolfin-home-motion .feature-panel:hover .clipped-media img,
.dolfin-home-motion .advice-panel:hover .clipped-media img { transform: scale(1.035); }
.dolfin-home-motion .testing-banner > video { transition: transform 1800ms cubic-bezier(.16, 1, .3, 1), filter 1200ms ease; }
.dolfin-home-motion .testing-banner:hover > video { transform: scale(1.025); }
.dolfin-home-motion .testing-card { transition: transform 1100ms cubic-bezier(.16, 1, .3, 1), opacity 850ms ease; }

.dolfin-home-motion .dolfin-blog-home-card { transition: opacity 720ms ease, transform 950ms cubic-bezier(.16, 1, .3, 1), box-shadow 400ms ease; }
.dolfin-home-motion .dolfin-blog-home-card:hover { transform: translateY(-.45rem); }
.dolfin-home-motion .everton-brand,
.dolfin-home-motion .everton-lockup { transition: transform 900ms cubic-bezier(.16, 1, .3, 1), opacity 750ms ease; }

.dolfin-motion-ready [data-dolfin-reveal] { opacity: 0; transform: translateY(2.6rem); }
.dolfin-motion-ready [data-dolfin-reveal="hero"] { transform: scale(1.015); transition: opacity 1100ms ease, transform 1600ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-motion-ready [data-dolfin-reveal="hero"] [data-dolfin-hero-copy] { opacity: 0; transform: translateX(-3rem); transition: opacity 900ms 220ms ease, transform 1250ms 220ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-motion-ready [data-dolfin-reveal="hero"] .hero-pages i { transform: scaleX(0); transition: transform 1200ms 850ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-motion-ready [data-dolfin-reveal="finder"] { transform: translateY(-2rem); transition: opacity 850ms ease, transform 1100ms cubic-bezier(.16, 1, .3, 1), box-shadow 420ms ease; }
.dolfin-motion-ready [data-dolfin-reveal="range"] { transition: opacity 850ms ease, transform 1100ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-motion-ready [data-dolfin-reveal="range"] .section-heading i { transform: scaleX(0); transition: transform 1150ms 400ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-motion-ready [data-dolfin-reveal="split"] { transform: translateY(3rem); transition: opacity 900ms ease, transform 1200ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-motion-ready [data-dolfin-reveal="split"] .feature-copy { opacity: 0; transform: translateX(-2.4rem); }
.dolfin-motion-ready [data-dolfin-reveal="split"] .clipped-media { clip-path: inset(0 0 0 100%); transition: clip-path 1300ms 180ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-motion-ready [data-dolfin-reveal="banner"] { transform: scale(.985); transition: opacity 950ms ease, transform 1300ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-motion-ready [data-dolfin-reveal="banner"] [data-dolfin-banner-card] { opacity: 0; transform: translateX(2.6rem); }
.dolfin-motion-ready [data-dolfin-reveal="advice"] { transform: translateY(2.5rem); transition: opacity 900ms ease, transform 1200ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-motion-ready [data-dolfin-reveal="guides"] { transition: opacity 900ms ease, transform 1200ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-motion-ready [data-dolfin-reveal="brands"] { transform: translateY(2rem) scale(.985); transition: opacity 850ms ease, transform 1100ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-motion-ready [data-dolfin-reveal].dolfin-is-visible { opacity: 1; transform: none; }
.dolfin-motion-ready [data-dolfin-reveal="hero"].dolfin-is-visible [data-dolfin-hero-copy],
.dolfin-motion-ready [data-dolfin-reveal="split"].dolfin-is-visible .feature-copy,
.dolfin-motion-ready [data-dolfin-reveal="banner"].dolfin-is-visible [data-dolfin-banner-card] { opacity: 1; transform: none; }
.dolfin-motion-ready [data-dolfin-reveal="hero"].dolfin-is-visible .hero-pages i,
.dolfin-motion-ready [data-dolfin-reveal="range"].dolfin-is-visible .section-heading i { transform: scaleX(1); }
.dolfin-motion-ready [data-dolfin-reveal="split"].dolfin-is-visible .clipped-media { clip-path: inset(0); }

.dolfin-motion-ready [data-dolfin-card] { opacity: 0; transform: perspective(60rem) translateY(2.5rem) rotateX(5deg); transform-origin: bottom; transition-delay: calc(300ms + var(--dolfin-card-delay, 0ms)); }
.dolfin-motion-ready .dolfin-is-visible [data-dolfin-card] { opacity: 1; transform: none; }
.dolfin-motion-ready [data-dolfin-guide-card] { opacity: 0; transform: translateY(2rem); transition-delay: calc(280ms + var(--dolfin-guide-delay, 0ms)); }
.dolfin-motion-ready .dolfin-is-visible [data-dolfin-guide-card] { opacity: 1; transform: none; }
.dolfin-motion-ready [data-dolfin-reveal="brands"] .everton-brand { opacity: 0; transform: translateX(-2rem); }
.dolfin-motion-ready [data-dolfin-reveal="brands"] .everton-lockup { opacity: 0; transform: translateX(2rem); }
.dolfin-motion-ready [data-dolfin-reveal="brands"].dolfin-is-visible :is(.everton-brand, .everton-lockup) { opacity: 1; transform: none; }
.dolfin-motion-ready [data-dolfin-reveal="brands"].dolfin-is-visible .everton-lockup { transition-delay: 180ms; }

@media (max-width: 47.99rem) {
  .dolfin-motion-ready [data-dolfin-reveal="hero"] [data-dolfin-hero-copy],
  .dolfin-motion-ready [data-dolfin-reveal="split"] .feature-copy,
  .dolfin-motion-ready [data-dolfin-reveal="banner"] [data-dolfin-banner-card] { transform: translateY(1.8rem); }
  .dolfin-motion-ready [data-dolfin-reveal="split"] .clipped-media { clip-path: inset(100% 0 0); }
  .dolfin-motion-ready [data-dolfin-reveal="split"].dolfin-is-visible .clipped-media { clip-path: inset(0); }
}

@media (prefers-reduced-motion: reduce) {
  .dolfin-home-motion *,
  .dolfin-home-motion *::before,
  .dolfin-home-motion *::after { animation: none !important; transition-duration: .01ms !important; transition-delay: 0ms !important; scroll-behavior: auto !important; }
  .dolfin-motion-ready [data-dolfin-reveal],
  .dolfin-motion-ready [data-dolfin-reveal] *,
  .dolfin-motion-ready [data-dolfin-card],
  .dolfin-motion-ready [data-dolfin-guide-card] { opacity: 1; transform: none; clip-path: none; }
}
