:root{
  --ff-motion-fast:160ms;
  --ff-motion-base:280ms;
  --ff-motion-slow:620ms;
  --ff-ease-premium:cubic-bezier(.22,1,.36,1);
  --ff-ease-soft:cubic-bezier(.33,1,.68,1);
  --ff-shadow-hover:0 18px 48px rgba(38,48,32,.10);
}

/* Progressive reveal: only active after JS has classified initial viewport elements. */
.ff-motion-ready .ff-reveal{
  opacity:0;
  transform:translate3d(0,22px,0);
  transition:opacity var(--ff-motion-slow) var(--ff-ease-premium),transform var(--ff-motion-slow) var(--ff-ease-premium);
  transition-delay:var(--ff-reveal-delay,0ms);
}
.ff-motion-ready .ff-reveal.is-visible{opacity:1;transform:none;will-change:auto}

/* First-screen choreography: deliberately subtle and independent from scroll reveal. */
.ff-motion-ready .ff-hero__kicker{animation:ffHeroRise .72s var(--ff-ease-premium) both}
.ff-motion-ready .ff-hero__title{animation:ffHeroRise .82s .08s var(--ff-ease-premium) both}
.ff-motion-ready .ff-hero__content>.ff-button{animation:ffHeroRise .82s .16s var(--ff-ease-premium) both}
.ff-motion-ready .ff-hero__dots{animation:ffHeroFade .7s .28s ease both}
@keyframes ffHeroRise{from{opacity:0;transform:translate3d(0,18px,0)}to{opacity:1;transform:none}}
@keyframes ffHeroFade{from{opacity:0}to{opacity:1}}

/* Navigation and text links. */
.ff-primary-menu a,.ff-text-link,.ff-footer__columns a,.ff-mega-menu__links>a,.ff-account-menu a,.ff-account-menu button{
  transition:color var(--ff-motion-fast) ease,opacity var(--ff-motion-fast) ease,transform var(--ff-motion-fast) var(--ff-ease-soft);
}
.ff-primary-menu a,.ff-text-link{position:relative}
.ff-primary-menu a:not([data-ff-mega-trigger])::after,.ff-text-link::after{
  content:"";position:absolute;left:0;right:0;bottom:-4px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right center;
  transition:transform var(--ff-motion-base) var(--ff-ease-premium);
}

/* Buttons and control affordances. */
.ff-button,.ff-outline-button,.ff-filter-apply,.ff-auth-submit,.ff-newsletter-modal__form button,
.ff-checkout-continue,.ff-checkout-payment-wrap #place_order,.ff-checkout-edit-order,.ff-cart-summary__checkout,
.ff-cart-drawer__buttons a,.ff-account-payment-methods .button,.ff-account-downloads .button,.ff-contact-form button{
  transition:transform var(--ff-motion-fast) var(--ff-ease-premium),box-shadow var(--ff-motion-base) ease,
             filter var(--ff-motion-fast) ease,background-color var(--ff-motion-fast) ease,color var(--ff-motion-fast) ease,border-color var(--ff-motion-fast) ease;
}
.ff-icon-button,.ff-slider-arrow,.ff-product-card__wish,.ff-search-close,.ff-newsletter-modal__close,.ff-auth-modal__close,
.ff-cart-drawer__head button,.ff-mobile-nav__close{
  transition:transform var(--ff-motion-fast) var(--ff-ease-premium),background-color var(--ff-motion-fast) ease,
             border-color var(--ff-motion-fast) ease,box-shadow var(--ff-motion-base) ease;
}

/* Product and editorial media: motion is confined to compositor-friendly transform/opacity. */
.ff-product-card__media,.ff-category-card__media,.ff-search-card__image,.ff-mega-product__image,.ff-wishlist-card__image,
.ff-contact-card,.ff-about-value-card,.ff-delivery-method-card,.ff-promo,.ff-editorial-card{
  transition:transform var(--ff-motion-base) var(--ff-ease-premium),box-shadow var(--ff-motion-base) ease,border-color var(--ff-motion-base) ease;
}
.ff-product-card__media img,.ff-category-card__media img,.ff-search-card__image img,.ff-mega-product__image img,
.ff-wishlist-card__image img,.ff-editorial-card__media img,.ff-about-hero__media img,.ff-about-story__media img,.ff-about-craft__media img,
.ff-contact-hero__image img,.ff-promo{
  transition:transform 760ms var(--ff-ease-premium),filter var(--ff-motion-base) ease;
}
.ff-product-card__title,.ff-category-card,.ff-search-card h3{transition:color var(--ff-motion-fast) ease}
.ff-product-card__wish img{transition:transform var(--ff-motion-base) var(--ff-ease-premium),filter var(--ff-motion-fast) ease}
.ff-product-card__media.has-hover-image>a:first-child{position:relative;display:block;overflow:hidden}
.ff-product-card__media.has-hover-image .ff-product-card__primary-image{position:relative;transform:translateY(0);transition:transform 520ms var(--ff-ease-premium)}
.ff-product-card__media.has-hover-image .ff-product-card__hover-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:1;transform:translateY(100%);transition:transform 520ms var(--ff-ease-premium)}
@media (hover:hover){
  .ff-product-card__media.has-hover-image:hover .ff-product-card__primary-image{opacity:1;transform:translateY(-100%) scale(1)}
  .ff-product-card__media.has-hover-image:hover .ff-product-card__hover-image{opacity:1;transform:translateY(0)}
}
.ff-product-card__wish.is-active img{transform:scale(1.08)}
.ff-feature__icon{transition:transform var(--ff-motion-base) var(--ff-ease-premium),box-shadow var(--ff-motion-base) ease}

/* Form focus feels responsive without changing layout. */
input,select,textarea,.ff-password-field{
  transition:border-color var(--ff-motion-fast) ease,box-shadow var(--ff-motion-fast) ease,background-color var(--ff-motion-fast) ease;
}
input:focus-visible,select:focus-visible,textarea:focus-visible,.ff-password-field:focus-within{
  outline:none;box-shadow:0 0 0 4px rgba(56,71,46,.08);border-color:rgba(56,71,46,.42)!important;
}

/* Existing overlays keep their behavior; this only improves the visual interpolation. */
.ff-overlay{transition:opacity var(--ff-motion-base) ease,visibility var(--ff-motion-base) ease}
.ff-overlay__backdrop{opacity:0;transition:opacity var(--ff-motion-base) ease}
.ff-overlay.is-open .ff-overlay__backdrop{opacity:1}
.ff-cart-drawer{transform:translate3d(32px,0,0);opacity:0;transition:transform var(--ff-motion-base) var(--ff-ease-premium),opacity var(--ff-motion-base) ease}
.ff-cart-overlay.is-open .ff-cart-drawer{transform:none;opacity:1}
.ff-auth-modal,.ff-newsletter-modal{transform:translate3d(0,14px,0) scale(.985);opacity:0;transition:transform var(--ff-motion-base) var(--ff-ease-premium),opacity var(--ff-motion-base) ease}
.ff-auth-overlay.is-open .ff-auth-modal,.ff-newsletter-overlay.is-open .ff-newsletter-modal{transform:none;opacity:1}
.ff-search-panel{transform:translate3d(0,-8px,0);opacity:0;transition:transform var(--ff-motion-base) var(--ff-ease-premium),opacity var(--ff-motion-base) ease}
.ff-search-overlay.is-open .ff-search-panel{transform:none;opacity:1}
.ff-mega-menu{transition-duration:var(--ff-motion-base);transition-timing-function:var(--ff-ease-premium)}
.ff-language-switcher__menu{transform-origin:top right;animation:ffMenuIn var(--ff-motion-fast) var(--ff-ease-premium) both}
.ff-language-switcher--footer .ff-language-switcher__menu{transform-origin:bottom left}
@keyframes ffMenuIn{from{opacity:0;transform:translate3d(0,-6px,0) scale(.985)}to{opacity:1;transform:none}}

/* Mobile drawer already slides; use the same premium curve. */
.ff-mobile-nav__backdrop{transition-duration:var(--ff-motion-base)!important}
.ff-mobile-nav__panel{transition-duration:var(--ff-motion-base)!important;transition-timing-function:var(--ff-ease-premium)!important}

@media (hover: hover) and (pointer: fine){
  .ff-primary-menu a:not([data-ff-mega-trigger]):hover::after,.ff-text-link:hover::after{transform:scaleX(1);transform-origin:left center}
  .ff-footer__columns a:hover,.ff-mega-menu__links>a:hover,.ff-account-menu a:hover,.ff-account-menu button:hover{opacity:.72;transform:translateX(2px)}
  .ff-button:hover,.ff-filter-apply:hover,.ff-auth-submit:hover,.ff-newsletter-modal__form button:hover,
  .ff-checkout-continue:hover,.ff-checkout-payment-wrap #place_order:hover,.ff-cart-summary__checkout:hover,
  .ff-cart-drawer__buttons .is-primary:hover,.ff-contact-form button:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(56,71,46,.16)}
  .ff-button:active,.ff-filter-apply:active,.ff-auth-submit:active,.ff-checkout-continue:active,.ff-checkout-payment-wrap #place_order:active{transform:translateY(0) scale(.985)}
  .ff-icon-button:hover,.ff-search-close:hover,.ff-newsletter-modal__close:hover,.ff-auth-modal__close:hover,.ff-cart-drawer__head button:hover,.ff-mobile-nav__close:hover{transform:scale(1.07)}
  .ff-slider-arrow:not(:disabled):hover{transform:translateY(-2px) scale(1.04);box-shadow:var(--ff-shadow-hover)}
  .ff-slider-arrow:not(:disabled):active{transform:scale(.96)}
  .ff-product-card__media:hover{transform:translateY(-3px);box-shadow:var(--ff-shadow-hover)}
  .ff-product-card__media:hover>a:first-child img{transform:scale(1.028)}
  .ff-product-card:hover .ff-product-card__title{color:var(--ff-green)}
  .ff-product-card__wish:hover{transform:scale(1.06);box-shadow:0 8px 20px rgba(38,48,32,.12)}
  .ff-category-card:hover .ff-category-card__media{transform:translateY(-3px);box-shadow:var(--ff-shadow-hover)}
  .ff-category-card:hover .ff-category-card__media img{transform:scale(1.045)}
  .ff-category-card:hover{color:var(--ff-green)}
  .ff-promo:hover{transform:translateY(-3px) scale(1.003);box-shadow:var(--ff-shadow-hover)}
  .ff-editorial-card:hover,.ff-contact-card:hover,.ff-about-value-card:hover,.ff-delivery-method-card:hover{transform:translateY(-3px);box-shadow:var(--ff-shadow-hover)}
  .ff-editorial-card:hover .ff-editorial-card__media img,.ff-about-hero:hover .ff-about-hero__media img,.ff-about-story:hover .ff-about-story__media img,
  .ff-about-craft:hover .ff-about-craft__media img,.ff-contact-hero:hover .ff-contact-hero__image img{transform:scale(1.018)}
  .ff-feature:hover .ff-feature__icon{transform:translateY(-3px) rotate(-2deg);box-shadow:0 10px 24px rgba(184,142,54,.12)}
  .ff-search-card:hover .ff-search-card__image,.ff-mega-product:hover .ff-mega-product__image{transform:translateY(-2px);box-shadow:0 12px 28px rgba(38,48,32,.10)}
  .ff-search-card:hover .ff-search-card__image img,.ff-mega-product:hover .ff-mega-product__image img{transform:scale(1.035)}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{animation-duration:.001ms!important;animation-delay:0ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .ff-motion-ready .ff-reveal{opacity:1!important;transform:none!important;transition:none!important}
}