.expect-hotspots{--hotspot-dog-w: var(--hotspot-dog-mobile, 24rem);--hotspot-dog-h: calc(var(--hotspot-dog-w) / var(--hotspot-dog-ratio, .877));--hotspot-paws: calc(var(--hotspot-dog-h) * var(--hotspot-paws-share, 3.5) / 100);--hotspot-pill-max: 30rem;padding-block:4.8rem;color:rgb(var(--color-foreground))}@media screen and (min-width:750px){.expect-hotspots{padding-block:8rem}}@media screen and (min-width:990px){.expect-hotspots{--hotspot-dog-w: var(--hotspot-dog-tablet, 29rem);--hotspot-pill-max: 34rem}}@media screen and (min-width:1200px){.expect-hotspots{--hotspot-dog-w: var(--hotspot-dog-desktop, 34rem);--hotspot-pill-max: 44rem}}.expect-hotspots__intro{display:flex;flex-direction:column;gap:2.4rem;max-width:72rem;margin-inline:auto;text-align:center}.expect-hotspots__heading+.expect-hotspots__text{margin-top:calc(var(--stay-space-heading-text) - 2.4rem)}.expect-hotspots__heading,.expect-hotspots__text>:first-child{margin:0;color:inherit}.expect-hotspots__stage{display:grid;grid-template-areas:"dog" "card" "list";grid-template-columns:minmax(0,1fr);justify-items:center;margin-top:4rem}.expect-hotspots__dog{grid-area:dog;position:relative;z-index:1;width:var(--hotspot-dog-w)}.expect-hotspots__dog-image{display:block;width:100%;height:auto}.expect-hotspots__card{grid-area:card;width:calc(var(--hotspot-dog-w) * 1.16);margin-top:calc(-1 * var(--hotspot-paws));padding:calc(var(--hotspot-paws) + 2rem) 1.6rem 2.4rem;border-radius:var(--stay-radius-m);background:rgb(var(--stay-color-depth));color:rgb(var(--stay-color-cream));text-align:center}.expect-hotspots__card--link{position:relative;isolation:isolate;display:block;overflow:hidden;text-decoration:none}.expect-hotspots__card--link:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;background:rgba(var(--stay-color-cream),.14);transform:translate3d(-101%,0,0);transition:transform var(--stay-motion-duration-swap) var(--stay-motion-ease-state)}@media(hover:hover){.expect-hotspots__card--link:hover:before{transform:none}}.expect-hotspots__card--link:focus-visible:before{transform:none}@media(prefers-reduced-motion:reduce){.expect-hotspots__card--link:before{transition:none}}.expect-hotspots__dog{pointer-events:none}.expect-hotspots__dot-button{pointer-events:auto}.expect-hotspots__card-title{display:block;margin:0;font-size:1.6rem;font-weight:600;line-height:1.3;letter-spacing:-.01em}.expect-hotspots__list{display:none;margin:0;padding:0;list-style:none}.expect-hotspots__pill{display:flex;align-items:center;gap:1.2rem;padding:.6rem 1.8rem .6rem 1.4rem;border-radius:var(--stay-radius-pill);background:rgb(var(--stay-color-grey));color:rgb(var(--stay-color-depth));font-size:1.6rem;font-weight:500;line-height:1.3}.expect-hotspots--labels-semibold .expect-hotspots__pill{font-weight:600}.expect-hotspots__icon{display:grid;flex:none;place-items:center;width:3.2rem;height:3.2rem;border-radius:50%;background:rgb(var(--stay-color-depth));color:rgb(var(--stay-color-warmth))}.expect-hotspots__icon svg,.expect-hotspots__icon-mask{display:block;width:2rem;height:2rem}.expect-hotspots__icon-mask{background:currentColor;-webkit-mask:var(--hotspot-icon-mask) center / contain no-repeat;mask:var(--hotspot-icon-mask) center / contain no-repeat}.expect-hotspots__dots{position:absolute;top:0;right:0;bottom:0;left:0}.expect-hotspots__dot-button{position:absolute;top:calc(var(--hotspot-y) * 1%);left:calc(var(--hotspot-x) * 1%);display:grid;place-items:center;width:4.4rem;height:4.4rem;margin:-2.2rem 0 0 -2.2rem;padding:0;border:0;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent;--stay-reveal-duration: .48s;--stay-motion-stagger: .16s}.expect-hotspots__dot-button:focus-visible{outline:none}.expect-hotspots__dot-mark{position:relative;display:block;width:1.4rem;height:1.4rem;border-radius:50%;background:rgb(var(--stay-color-depth));box-shadow:0 0 0 .2rem rgb(var(--stay-color-cream));opacity:.55;transition:opacity var(--stay-motion-duration-state) var(--stay-motion-ease-state),transform var(--stay-motion-duration-state) var(--stay-motion-ease-state)}.expect-hotspots__dot-mark:before,.expect-hotspots__dot-mark:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;opacity:0}.expect-hotspots__dot-mark:after{background:rgb(var(--stay-color-warmth));transition:opacity var(--stay-motion-duration-state) var(--stay-motion-ease-state)}.expect-hotspots__dot-button[aria-current=true] .expect-hotspots__dot-mark{opacity:1;transform:scale(1.3)}.expect-hotspots__dot-button[aria-current=true] .expect-hotspots__dot-mark:after{opacity:1}.expect-hotspots__dot-button:focus-visible .expect-hotspots__dot-mark{outline:.2rem solid rgb(var(--stay-color-depth));outline-offset:.4rem}@media(prefers-reduced-motion:no-preference){.expect-hotspots__dot-button[aria-current=true] .expect-hotspots__dot-mark:before{background:rgb(var(--stay-color-warmth));animation:expect-hotspots-pulse 2.4s var(--stay-motion-ease) infinite}}@media(prefers-reduced-motion:reduce){.expect-hotspots__dot-mark,.expect-hotspots__dot-mark:after{transition:none}}@keyframes expect-hotspots-pulse{0%{opacity:.5;transform:scale(1)}70%,to{opacity:0;transform:scale(2.4)}}.expect-hotspots__benefits{--hotspot-card-share: 85%;grid-area:list;display:flex;gap:1.2rem;margin:calc(3.2rem - .4rem) calc(-1 * var(--stay-gutter)) -.4rem;padding:.4rem var(--stay-gutter);list-style:none;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--stay-gutter);scrollbar-width:none;justify-self:stretch}.expect-hotspots__benefits::-webkit-scrollbar{display:none}.expect-hotspots__benefits:after{content:"";flex:0 0 calc(100% - var(--hotspot-card-share) - 1.2rem)}@media screen and (min-width:750px){.expect-hotspots__benefits{gap:1.6rem}.expect-hotspots__benefits:after{flex-basis:calc(100% - var(--hotspot-card-share) - 1.6rem)}}.expect-hotspots__benefit{display:flex;flex:0 0 var(--hotspot-card-share);flex-direction:column;align-items:flex-start;min-width:0;padding:2rem;border-radius:var(--stay-radius-m);background:rgb(var(--stay-color-grey));color:rgb(var(--stay-color-depth));scroll-snap-align:start}.expect-hotspots__benefit:focus-visible{outline:.2rem solid rgb(var(--stay-color-depth));outline-offset:-.2rem}.expect-hotspots__benefit-title{margin:1.6rem 0 0;font-size:1.8rem;font-weight:600;line-height:1.3;letter-spacing:-.01em;text-wrap:balance}.expect-hotspots__benefit-title:first-child{margin-top:0}.expect-hotspots__benefit-text{margin:.8rem 0 0;font-size:1.5rem;line-height:1.5}@media screen and (min-width:990px){.expect-hotspots__dots,.expect-hotspots__benefits{display:none}.expect-hotspots__stage{position:relative;margin-top:5.6rem}.expect-hotspots__list{grid-area:dog;position:absolute;display:grid;gap:.8rem;top:0;right:0;bottom:0;left:0;z-index:2;width:auto;max-width:none;margin:0;pointer-events:none}.expect-hotspots__item{--stay-draw-stagger: .16s;position:absolute;top:0;right:0;bottom:0;left:0}.expect-hotspots__item [data-stay-draw]{--stay-draw-duration: .12s}.expect-hotspots__line{--stay-draw-at: .12s}.expect-hotspots__item .expect-hotspots__dot{position:absolute;z-index:1;top:calc(var(--hotspot-y) * 1%);left:calc(50% - var(--hotspot-dog-w) / 2 + var(--hotspot-dog-w) * var(--hotspot-x) / 100);display:block;width:1rem;height:1rem;margin:-.5rem 0 0 -.5rem;border-radius:50%;background:rgb(var(--stay-color-warmth));box-shadow:0 0 0 .2rem rgb(var(--stay-color-cream))}.expect-hotspots__lines{position:absolute;top:0;left:calc(50% - var(--hotspot-dog-w) / 2);display:block;width:var(--hotspot-dog-w);height:100%;overflow:visible;opacity:.5}.expect-hotspots__line{stroke:rgb(var(--stay-color-depth));stroke-width:1.5;stroke-linecap:round;vector-effect:non-scaling-stroke;transform-box:fill-box}.expect-hotspots__line--level{--stay-draw-at: .24s}.expect-hotspots__pill{--stay-draw-at: .36s;position:absolute;top:calc(var(--hotspot-label-y) * 1%);width:max-content;max-width:var(--hotspot-pill-max);padding:.8rem 2rem;text-wrap:balance;font-size:1.6rem;transform:translateY(-50%);pointer-events:auto}.expect-hotspots__pill:has(.expect-hotspots__icon){padding:.4rem 2rem .4rem .4rem}.expect-hotspots__item--left .expect-hotspots__pill{right:calc(50% + var(--hotspot-dog-w) / 2 - var(--hotspot-dog-w) * var(--hotspot-edge) / 100);flex-direction:row-reverse;text-align:right}.expect-hotspots__item--left .expect-hotspots__pill:has(.expect-hotspots__icon){padding:.4rem .4rem .4rem 2rem}.expect-hotspots__item--right .expect-hotspots__pill{left:calc(50% - var(--hotspot-dog-w) / 2 + var(--hotspot-dog-w) * var(--hotspot-edge) / 100)}.expect-hotspots__card-title{font-size:1.8rem}}@media screen and (min-width:1200px){.expect-hotspots__item .expect-hotspots__pill{font-size:1.8rem}}
/*# sourceMappingURL=/cdn/shop/t/27/assets/section-expect-hotspots.css.map */