/* Content stays visible without JavaScript or animation support. */
.brand-note{padding-top:62px;padding-bottom:42px}
.feature-heading{max-width:720px;margin:0 auto 36px}
.featured{padding-bottom:56px}
.product .art,.feature .art{overflow:hidden}
.product .photo,.feature .photo{transition:transform .6s cubic-bezier(.2,.65,.3,1)}
.hero-link span{transition:transform .25s ease}
nav a{position:relative;padding-bottom:5px}
nav a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
nav a:hover{text-decoration:none}
nav a:hover::after,nav a:focus-visible::after{transform:scaleX(1)}
.filters button{transition:color .2s ease,border-color .2s ease}
.feeling-stories>a{transition:border-color .25s ease}
.feeling-stories>a:hover{border-color:#892e48}
.close{transition:background-color .2s ease;border-radius:50%}
.close:hover{background:#f1e3e8}
html:has(dialog[open]){overflow:hidden}
@media(hover:hover) and (pointer:fine){.product:hover .photo,.feature:hover .photo{transform:scale(1.035)}.hero-link:hover span{transform:translateX(5px)}}
@media(prefers-reduced-motion:no-preference){
 .hero-image{animation:hero-settle 2.4s cubic-bezier(.2,.65,.3,1) both}
 .hero-copy>*{animation:soft-arrive .85s cubic-bezier(.2,.65,.3,1) both}
 .hero-copy>:nth-child(2){animation-delay:.08s}.hero-copy>:nth-child(3){animation-delay:.16s}.hero-copy>:nth-child(4){animation-delay:.24s}.hero-copy>:nth-child(5){animation-delay:.32s}
 dialog[open]{animation:dialog-arrive .28s ease both}
 dialog[open]::backdrop{animation:backdrop-arrive .25s ease both}
}
@keyframes soft-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes hero-settle{from{transform:scale(1.025)}to{transform:scale(1)}}
@keyframes dialog-arrive{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
@keyframes backdrop-arrive{from{opacity:0}to{opacity:1}}
@media(max-width:600px){.brand-note{padding-top:34px;padding-bottom:26px}.featured{padding-bottom:34px}.hero-copy{padding-top:28px}.hero-copy .hero-description{max-width:280px}.hero-image{animation:none}.hero-copy>*{animation-duration:.5s}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
