/* Progressive, bounded entrances. No essential text is hidden without JS. */
.slf-home .practice-transition { --bridge-progress: 1; position: relative; height: 150px; overflow: hidden; max-width: 1600px; margin: auto; }
.slf-home .transition-rule { position: absolute; top: 75px; left: 5.7vw; right: 5.7vw; border-top: 1px solid #c9acbc; transform: scaleX(calc(.25 + var(--bridge-progress)*.75)); transform-origin: center; }
.slf-home .bridge-mark { position: absolute; width: 112px; height: 112px; right: calc(16% + var(--bridge-progress)*28%); top: 19px; transform: rotate(calc((1 - var(--bridge-progress))*-18deg)); overflow: visible; }
.slf-home.has-home-motion:not(.has-scrolled) .bridge-mark { opacity: 0; visibility: hidden; }
.slf-home :is(.bridge-piece, .bridge-shell) { transform-box: fill-box; transform-origin: center; }
.slf-home.has-home-motion .bridge-shell { opacity: 0; transform: scale(.85); transition: opacity .45s .1s, transform .5s .1s var(--ease-out); }
.slf-home.has-home-motion .is-assembled .bridge-shell { opacity: 1; transform: none; }
.slf-home .bridge-1 { transform: translate(calc((1 - var(--bridge-progress))*-70px), calc((1 - var(--bridge-progress))*-30px)) rotate(calc((1 - var(--bridge-progress))*-25deg)); }
.slf-home .bridge-2 { transform: translate(calc((1 - var(--bridge-progress))*65px), calc((1 - var(--bridge-progress))*-35px)) rotate(calc((1 - var(--bridge-progress))*22deg)); }
.slf-home .bridge-3 { transform: translate(calc((1 - var(--bridge-progress))*65px), calc((1 - var(--bridge-progress))*30px)) rotate(calc((1 - var(--bridge-progress))*18deg)); }
.slf-home .bridge-4 { transform: translate(calc((1 - var(--bridge-progress))*-65px), calc((1 - var(--bridge-progress))*35px)) rotate(calc((1 - var(--bridge-progress))*-22deg)); }
.slf-home.has-home-motion .home-reveal { opacity: 0; transform: translateY(28px); transition: opacity .75s var(--ease-out), transform .85s var(--ease-out), background .25s, color .25s; transition-delay: var(--stagger, 0ms); }
.slf-home.has-home-motion [data-reveal="logo"] { transform: translateY(24px) scale(.84); }
.slf-home.has-home-motion [data-reveal="card"] { transform: translateY(42px) scale(.97); }
.slf-home.has-home-motion [data-reveal="portrait"] { transform: translateX(-35px) scale(.96); }
.slf-home.has-home-motion :is(.home-reveal.is-visible, .home-reveal:focus-within) { opacity: 1; transform: none; }
.slf-home.has-home-motion .home-reveal:focus-within { transition: none; }
.slf-home .approach-card::after { content: ''; position: absolute; top: -2px; left: 0; width: 100%; height: 2px; background: var(--plum); transform: scaleX(1); transform-origin: left; }
.slf-home.has-home-motion .approach-card::after { transform: scaleX(0); transition: transform .8s .2s var(--ease-out); }
.slf-home.has-home-motion .approach-card.is-visible::after { transform: scaleX(1); }
.slf-home.has-home-motion :is(.rating-star, .reviews-score) { opacity: 0; }
.slf-home.has-home-motion .rating-revealed .rating-star { animation: home-star-light .45s calc(.1s + var(--star-order)*.24s) var(--ease-out) both; }
.slf-home.has-home-motion .rating-revealed .reviews-score { animation: home-score-reveal .5s 1.62s var(--ease-out) both; }
.slf-home .mascot-hat { transform-box: view-box; transform-origin: 45% 20%; }
.slf-home .is-tipping .mascot-hat { animation: home-hat-tip .9s var(--ease-out); }
.slf-home .is-tipping .mascot { animation: home-mascot-bow .9s var(--ease-out); }
.slf-home.animate-intro .entrance { animation: home-appear .85s .15s var(--ease-out) both; }
.slf-home.animate-intro h1.entrance { animation-delay: .25s; }
.slf-home.animate-intro .intro.entrance, .slf-home.animate-intro .film-stage.entrance { animation-delay: .35s; }
.slf-home.animate-intro .hero-actions.entrance { animation-delay: .45s; }
@keyframes home-appear { from { opacity: 0; transform: translateY(15px); } to { opacity: 1; transform: none; } }
@keyframes home-star-light { 0% { opacity: 0; transform: translateY(10px) scale(.5) rotate(-12deg); } 65% { opacity: 1; transform: translateY(-2px) scale(1.25) rotate(4deg); } 100% { opacity: 1; transform: none; } }
@keyframes home-score-reveal { from { opacity: 0; transform: translateY(12px) scale(.92); } to { opacity: 1; transform: none; } }
@keyframes home-hat-tip { 0%, 100% { transform: none; } 35% { transform: translate(-5px, -25px) rotate(-12deg); } 65% { transform: translate(-3px, -18px) rotate(-8deg); } }
@keyframes home-mascot-bow { 0%, 100% { rotate: 0deg; } 40% { rotate: 2deg; } }
@media (max-width: 800px) {
  .slf-home .practice-transition { height: 120px; }
  .slf-home .transition-rule { top: 60px; left: 24px; right: 24px; }
  .slf-home .bridge-mark { width: 88px; height: 88px; top: 16px; }
  .slf-home.has-home-motion [data-reveal="portrait"] { transform: translateY(30px) scale(.97); }
  .slf-home.has-home-motion [data-reveal="portrait"].is-visible { transform: none; }
}
.slf-home.motion-paused :is(.home-reveal, .rating-star, .reviews-score) { opacity: 1 !important; transform: none !important; }
.slf-home.motion-paused .approach-card::after { transform: scaleX(1); }
@media (prefers-reduced-motion: reduce) {
  .slf-home.has-home-motion :is(.home-reveal, .rating-star, .reviews-score) { opacity: 1; transform: none; }
  .slf-home .approach-card::after { transform: scaleX(1); }
  .slf-home :is(.mascot-hat, .bridge-piece) { transform: none; }
}
@media print {
  .slf-home :is(.film-stage, .practice-transition) { display: none; }
  .slf-home.has-home-motion :is(.home-reveal, .rating-star, .reviews-score) { opacity: 1; transform: none; }
}
