/* Content stays readable when JavaScript or animation support is unavailable. */
:root { --motion-ease: cubic-bezier(.22,1,.36,1); }
@keyframes enter-section { from { opacity: 0; transform: translateY(42px); } to { opacity: 1; transform: none; } }
@keyframes enter-dialog { from { opacity: 0; transform: translateY(16px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes pop-step { from { opacity: 0; transform: scale(.45) rotate(-16deg); } to { opacity: 1; transform: none; } }
@keyframes fade-backdrop { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: no-preference) {
  html.motion-ready [data-reveal].is-visible { animation: enter-section 900ms var(--motion-ease) var(--reveal-delay, 0ms) both; }
  html.motion-ready .hero-copy.is-visible { animation-duration: 1100ms; }
  html.motion-ready .day-schedule.is-visible { --reveal-delay: 120ms; animation-duration: 1100ms; }
  .hero-copy.is-visible > .eyebrow { animation: enter-section 560ms var(--motion-ease) both; }
  .hero-copy.is-visible > h1 { animation: enter-section 950ms var(--motion-ease) 110ms both; }
  .hero-copy.is-visible > .lead { animation: enter-section 850ms var(--motion-ease) 280ms both; }
  .hero-copy.is-visible > .hero-actions { animation: enter-section 850ms var(--motion-ease) 420ms both; }
  .day-schedule.is-visible .appointment { animation: enter-section 720ms var(--motion-ease) both; }
  .day-schedule.is-visible .appointment:nth-child(3) { animation-delay: 300ms; }
  .day-schedule.is-visible .appointment:nth-child(5) { animation-delay: 470ms; }
  .day-schedule.is-visible .appointment:nth-child(6) { animation-delay: 640ms; }
  .section-heading.is-visible h2 { animation: enter-section 850ms var(--motion-ease) 130ms both; }
  .booking-step.is-visible header > span { animation: pop-step 650ms var(--motion-ease) 270ms both; }
  .confirm-step.is-visible .confirmation > i { animation: pop-step 750ms var(--motion-ease) 430ms both; }
  .final-cta-inner.is-visible .cta-icon { animation: pop-step 750ms var(--motion-ease) 250ms both; }
  dialog[open] { animation: enter-dialog 260ms var(--motion-ease); }
  dialog[open]::backdrop { animation: fade-backdrop 220ms ease; }
  .faq details[open] p { animation: enter-section 250ms var(--motion-ease); }
  .site-header nav.is-open { animation: enter-section 230ms var(--motion-ease); }
}
.hero-copy h1 span { display: inline; background-image: linear-gradient(transparent 88%, rgba(255,89,31,.16) 88%); background-size: 0% 100%; background-repeat: no-repeat; }
@media (prefers-reduced-motion: no-preference) { .hero-copy.is-visible h1 span { animation: underline-reveal 1.1s ease-out .5s both; } }
@keyframes underline-reveal { to { background-size: 100% 100%; } }
.site-header { transition: box-shadow 240ms ease; }
.site-header.is-scrolled { box-shadow: 0 5px 22px rgba(26,22,18,.06); }
.site-header nav a { position: relative; }
.site-header nav a::after { content: ''; position: absolute; bottom: -7px; left: 0; right: 0; height: 2px; background: var(--orange); transform: scaleX(0); transform-origin: left; transition: transform 220ms var(--motion-ease); }
.site-header nav a:hover::after, .site-header nav a:focus-visible::after { transform: scaleX(1); }
.day-schedule, .menu-card, .plan-card, .channel-card { transition: box-shadow 280ms ease, border-color 280ms ease; }
.button i, .booking-link a i:last-child, .segment-grid article span, .results article > span, .machine img { transition: transform 260ms var(--motion-ease); }
.choice-list button, .time-list button, .social-links a, .icon-button { transition: background 180ms ease, border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease; }
.button:active, .choice-list button:active, .time-list button:active, .icon-button:active { transform: scale(.98); }
@media (hover: hover) and (pointer: fine) {
  .day-schedule:hover, .menu-card:hover, .plan-card:hover, .channel-card:hover { box-shadow: 0 20px 45px rgba(26,22,18,.09); border-color: #efbca6; }
  .button:hover .ph-arrow-right, .booking-link a:hover i:last-child { transform: translateX(4px); }
  .segment-grid article:hover span, .results article:hover > span { transform: translateY(-4px) rotate(-4deg); }
  .machine:hover img { transform: translateY(-5px) rotate(-1deg); }
  .choice-list button:hover, .time-list button:hover, .icon-button:hover { background: var(--soft); border-color: #edbaa4; }
  .social-links a:hover { transform: translateY(-3px); background: var(--soft); border-color: #edbaa4; }
}
@media (max-width: 860px) { .site-header nav a::after { bottom: 0; } }
@media (max-width: 600px) {
  @keyframes enter-section { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
  html.motion-ready [data-reveal].is-visible { animation-duration: 680ms; animation-delay: 0ms; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .button:hover, .button:active, .choice-list button:active, .time-list button:active, .icon-button:active,
  .machine:hover img, .segment-grid article:hover span, .results article:hover > span,
  .social-links a:hover, .button:hover i, .booking-link a:hover i:last-child { transform: none; }
}
