/* PRÉLUDE 2026.10.31 | quiet editorial motion
   Decorative effects only. Never restyle product imagery, logos or A8 ad content. */

/* A thin reading-position indicator. It never intercepts taps or links. */
.pr-reading-progress{
  position:fixed;inset:0 auto auto 0;width:100%;height:2px;z-index:9998;
  background:linear-gradient(90deg,#b69891 0%,#815663 72%,#d4a59f 100%);
  transform-origin:left center;transform:scaleX(0);pointer-events:none;
  opacity:.82;
}

/* JavaScript activates these only when intersection observers are available. */
.pr-reveal{opacity:0;transform:translate3d(0,17px,0);
  transition:opacity .68s cubic-bezier(.2,.75,.25,1),
             transform .68s cubic-bezier(.2,.75,.25,1);
  transition-delay:var(--pr-motion-delay,0ms);
}
.pr-reveal.pr-visible{opacity:1;transform:none}

/* Editorial first impression (hero photo only, never product photography). */
.pr-motion-on .hero .hero-copy,
.pr-motion-on .budget-hero,
.pr-motion-on .lab-head{
  animation:pr-editorial-entry .48s cubic-bezier(.18,.72,.28,1) both;
}
.pr-motion-on .hero .hero-photo{overflow:hidden}
.pr-motion-on .hero .hero-photo>img{
  animation:pr-editorial-photo .85s ease-out both;
}
@keyframes pr-editorial-entry{
  from{opacity:.15;transform:translate3d(0,18px,0)}
  to{opacity:1;transform:none}
}
@keyframes pr-editorial-photo{
  from{transform:scale(1.012)} to{transform:scale(1)}
}

/* Understated interactions, no perpetual bouncing or flashing CTAs. */
@media (hover:hover) and (pointer:fine){
  :is(.btn,.budget-submit,.budget-btn,.budget-retry,.budget-outro-links a,
      .lab-cta a,.pc-lab a,.fp a,.prelude-edit-cards a,.mag-combo-card a,
      .budget-text-link,.budget-list-add){
    transition-property:transform,box-shadow,background-color,border-color,color;
    transition-duration:.24s;
    transition-timing-function:ease;
  }
  :is(.btn,.budget-submit,.budget-btn--buy,.budget-outro-links a):hover{
    transform:translate3d(0,-2px,0);
  }
  :is(.budget-submit,.budget-btn--buy):hover{
    box-shadow:0 8px 22px rgba(110,65,78,.20);
  }
  :is(.budget-choice,.budget-outro-links a,.lab-cta,.mag-combo-card,.budget-product):hover{
    transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease;
  }
  .budget-choice:not(.is-on):hover{transform:translateY(-2px)}
  .budget-product:hover{box-shadow:0 13px 28px rgba(88,57,62,.09);transform:translateY(-2px)}
}
:is(.btn,.budget-submit,.budget-btn,.budget-choice,.budget-retry):active{
  transform:scale(.985);
}
:where(a,button,input,select,summary):focus-visible{
  outline:2px solid #ac7d88;outline-offset:3px;
}

/* Give the budget tool a tactile response and a more celebratory result. */
.budget-choice.is-on{transition:background-color .24s,border-color .24s,box-shadow .24s,transform .22s}
.budget-results:not([hidden]) .budget-result-heading{
  animation:pr-result-in .52s cubic-bezier(.18,.75,.25,1) both;
}
.budget-results:not([hidden]) .budget-result-guide,
.budget-results:not([hidden]) .budget-no-buy{
  animation:pr-result-in .55s .09s both;
}
.budget-results:not([hidden]) .budget-product{
  animation:pr-result-in .52s cubic-bezier(.18,.75,.25,1) both;
}
.budget-results:not([hidden]) .budget-product:nth-child(1){animation-delay:.11s}
.budget-results:not([hidden]) .budget-product:nth-child(2){animation-delay:.19s}
.budget-results:not([hidden]) .budget-result-circle{
  animation:pr-result-ring .65s .14s cubic-bezier(.18,.75,.25,1) both;
}
@keyframes pr-result-in{
  from{opacity:.05;transform:translate3d(0,14px,0)}
  to{opacity:1;transform:none}
}
@keyframes pr-result-ring{
  from{opacity:.2;transform:scale(.93)}
  to{opacity:1;transform:scale(1)}
}

/* Respect people who opt out of motion and devices under constrained conditions. */
@media (prefers-reduced-motion:reduce){
  .pr-reveal,.pr-reveal.pr-visible{opacity:1!important;transform:none!important;transition:none!important}
  .pr-motion-on .hero .hero-copy,.pr-motion-on .budget-hero,.pr-motion-on .lab-head,
  .pr-motion-on .hero .hero-photo>img,
  .budget-results:not([hidden]) .budget-result-heading,
  .budget-results:not([hidden]) .budget-result-guide,
  .budget-results:not([hidden]) .budget-no-buy,
  .budget-results:not([hidden]) .budget-product,
  .budget-results:not([hidden]) .budget-result-circle{animation:none!important}
  :is(.btn,.budget-submit,.budget-btn,.budget-choice,.budget-retry):active{transform:none!important}
  :is(.btn,.budget-submit,.budget-btn--buy,.budget-outro-links a,.budget-choice,.budget-product):hover{
    transform:none!important;box-shadow:none!important;
  }
  .pr-reading-progress{display:none!important}
}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .product-card.pr-reveal.pr-visible:hover,
  .prelude-edit-cards>a.pr-reveal.pr-visible:hover{transform:translate3d(0,-3px,0)}
}