@media (prefers-reduced-motion: no-preference) {
  .brand-hero .hero-copy { animation: brand-rise .7s cubic-bezier(.22,1,.36,1) both; }
  .brand-hero .hero-image { animation: brand-image-in .85s .12s cubic-bezier(.22,1,.36,1) both; }
  .reason-grid article { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
  .reason-grid article:hover { transform: translateY(-6px); border-color: rgba(62,165,157,.34); box-shadow: var(--shadow); }
  .split-image img, .wide-image img { transition: transform .6s cubic-bezier(.22,1,.36,1); }
  .split-image:hover img, .wide-image:hover img { transform: scale(1.025); }
  .button { transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease; }
  @keyframes brand-rise { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
  @keyframes brand-image-in { from { opacity: 0; transform: translateY(16px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
}

:root {
  --motion-fast: 200ms;
  --motion-base: 300ms;
  --motion-enter: 720ms;
  --motion-ease: cubic-bezier(.22, 1, .36, 1);
}

.button:focus-visible,
.taste-button:focus-visible,
.taste-support-note a:focus-visible,
.taste-change-notice-link:focus-visible {
  outline: 3px solid #ef8e7e;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: no-preference) {
  html.motion-ready [data-motion-reveal] {
    opacity: 0;
    transform: translate3d(0, 24px, 0);
    transition: opacity var(--motion-enter) var(--motion-ease), transform var(--motion-enter) var(--motion-ease);
    transition-delay: var(--motion-delay, 0ms);
  }

  html.motion-ready [data-motion-reveal].is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }

  .taste-principles [data-motion-reveal]:nth-child(2),
  .taste-flow [data-motion-reveal]:nth-child(2),
  .taste-sessions [data-motion-reveal]:nth-child(2),
  .taste-guide [data-motion-reveal]:nth-child(2) { --motion-delay: 80ms; }
  .taste-principles [data-motion-reveal]:nth-child(3),
  .taste-flow [data-motion-reveal]:nth-child(3),
  .taste-sessions [data-motion-reveal]:nth-child(3) { --motion-delay: 160ms; }
  .taste-principles [data-motion-reveal]:nth-child(4),
  .taste-flow [data-motion-reveal]:nth-child(4),
  .taste-sessions [data-motion-reveal]:nth-child(4) { --motion-delay: 240ms; }
  .taste-sessions [data-motion-reveal]:nth-child(5) { --motion-delay: 320ms; }

  [data-motion-notice] {
    animation: notice-drop 620ms var(--motion-ease);
  }

  [data-motion-hero-copy] > * {
    opacity: 0;
    animation: taste-rise var(--motion-enter) var(--motion-ease) both;
  }
  [data-motion-hero-copy] > :nth-child(1) { animation-delay: 40ms; }
  [data-motion-hero-copy] > :nth-child(2) { animation-delay: 120ms; }
  [data-motion-hero-copy] > :nth-child(3) { animation-delay: 200ms; }
  [data-motion-hero-copy] > :nth-child(4) { animation-delay: 280ms; }
  [data-motion-hero-copy] > :nth-child(5) { animation-delay: 360ms; }

  [data-motion-hero-visual] {
    animation: taste-visual-in 850ms 140ms var(--motion-ease) both, taste-float 6s 1100ms ease-in-out infinite;
  }

  .taste-session.is-visible .taste-session-change {
    animation: taste-change-pop 520ms 360ms var(--motion-ease) backwards;
  }

  @media (hover: hover) and (pointer: fine) {
    .taste-change-notice,
    .taste-campaign,
    .taste-principle,
    .taste-flow li,
    .taste-session,
    .taste-guide article,
    .taste-application-panel {
      transition: transform var(--motion-base) var(--motion-ease), box-shadow var(--motion-base) ease, border-color var(--motion-base) ease, background-color var(--motion-base) ease;
    }

    .taste-change-notice:hover {
      transform: translateY(-3px);
      box-shadow: 9px 11px 0 #f2a08e;
    }
    .taste-change-notice-link span { display: inline-block; transition: transform var(--motion-fast) ease; }
    .taste-change-notice:hover .taste-change-notice-link span { transform: translateX(4px); }

    .taste-campaign:hover,
    html.motion-ready .taste-campaign[data-motion-reveal].is-visible:hover {
      transform: translateY(-5px);
      box-shadow: 13px 16px 0 #f2a08e;
    }

    .taste-principle:hover,
    html.motion-ready .taste-principle[data-motion-reveal].is-visible:hover {
      transform: translateY(-4px);
      border-color: rgba(209, 240, 235, .5);
      background: rgba(255, 255, 255, .085);
      box-shadow: 0 18px 36px rgba(3, 24, 23, .2);
    }

    .taste-flow li:hover,
    .taste-guide article:hover,
    html.motion-ready .taste-flow li[data-motion-reveal].is-visible:hover,
    html.motion-ready .taste-guide article[data-motion-reveal].is-visible:hover {
      transform: translateY(-4px);
      border-color: rgba(41, 57, 78, .38);
      box-shadow: 0 18px 36px rgba(41, 57, 78, .1);
    }

    .taste-session:hover,
    html.motion-ready .taste-session[data-motion-reveal].is-visible:hover {
      transform: translateY(-4px);
      box-shadow: 12px 15px 0 var(--session-accent), 0 22px 42px rgba(41, 57, 78, .1);
    }
    .taste-session-media img {
      transition: transform 520ms var(--motion-ease), filter var(--motion-base) ease;
    }
    .taste-session-number {
      transition: transform var(--motion-base) var(--motion-ease);
    }
    .taste-session:hover .taste-session-media img { transform: scale(1.025); }
    .taste-session:hover .taste-session-number { transform: rotate(4deg) scale(1.06); }

    .taste-application-panel:hover {
      transform: translateY(-4px);
      box-shadow: 12px 14px 0 #f2a08e;
    }
    .taste-button:hover { transform: translateY(-2px); }
    .taste-button:active { transform: translateY(0) scale(.98); }
  }

  @keyframes notice-drop {
    from { opacity: 0; transform: translateY(-14px); }
    to { opacity: 1; transform: translateY(0); }
  }
  @keyframes taste-rise {
    from { opacity: 0; transform: translateY(22px); }
    to { opacity: 1; transform: translateY(0); }
  }
  @keyframes taste-visual-in {
    from { opacity: 0; transform: translateY(18px) scale(.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
  }
  @keyframes taste-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-7px); }
  }
  @keyframes taste-change-pop {
    from { opacity: 0; transform: scale(.82) rotate(-3deg); }
    to { opacity: 1; transform: scale(1) rotate(0); }
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-motion-reveal],
  [data-motion-notice],
  [data-motion-hero-copy] > *,
  [data-motion-hero-visual],
  .taste-session-change {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
    transition: none !important;
  }
  .taste-button:hover { transform: none !important; box-shadow: none !important; }
}