.surfstr-sensory{--ss-purple: var(--surfstr-lovable-purple, #8047e1);--ss-deep: var(--surfstr-lovable-purple-deep, oklch(.32 .18 295));--ss-mid: var(--surfstr-lovable-purple-mid, oklch(.48 .2 295));--ss-yellow: var(--surfstr-lovable-yellow, #ffea5b);--ss-soft: var(--surfstr-lovable-yellow-soft, oklch(.96 .12 100));--ss-orange: var(--surfstr-lovable-orange, #ff682f);--ss-display: var(--surfstr-font-display, "Bagel Fat One", "Sniglet", system-ui, sans-serif);--ss-body: var(--surfstr-font-body, "DM Sans", system-ui, sans-serif);--ss-shadow: var(--surfstr-shadow-yellow-on-purple, 0 .02em .08em oklch(.28 .16 295 / .5), 0 .05em .18em oklch(.24 .14 295 / .32));background:var(--ss-purple);color:var(--ss-soft);font-family:var(--ss-body)}.surfstr-sensory__inner{padding-block:clamp(3.5rem,8vw,6rem)}.surfstr-sensory__head{max-width:48rem;margin-bottom:clamp(2rem,5vw,3.25rem)}.surfstr-sensory__eyebrow{font-size:.875rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin:0 0 1rem;color:var(--ss-soft)}.surfstr-sensory__title{font-family:var(--ss-display);font-weight:400;font-size:clamp(2.5rem,5.5vw,4.5rem);line-height:.95;letter-spacing:-.02em;text-transform:lowercase;color:var(--surfstr-lovable-yellow-on-purple, var(--ss-yellow));text-shadow:var(--ss-shadow);margin:0 0 1.5rem;padding-bottom:.14em;text-wrap:balance}.surfstr-sensory__lead{font-size:1.125rem;line-height:1.55;max-width:36rem;margin:0}.surfstr-sensory__grid{display:grid;gap:2.5rem}@media(min-width:990px){.surfstr-sensory__grid{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:3.5rem;align-items:center}}.surfstr-sensory__rows{list-style:none;margin:0;padding:0;display:grid;gap:1.1rem}.surfstr-sensory__row{display:grid;grid-template-columns:7rem minmax(0,1fr) 2.75rem;align-items:center;gap:.9rem}@media(max-width:479px){.surfstr-sensory__row{grid-template-columns:5.75rem minmax(0,1fr) 2.5rem;gap:.6rem}}.surfstr-sensory__label{font-family:var(--ss-display);font-size:1.05rem;line-height:1.1;text-transform:lowercase;color:var(--ss-soft)}.surfstr-sensory__track{position:relative;display:block;height:.75rem;border-radius:9999px;background:#3f008038;background:oklch(.32 .18 295 / 22%);overflow:hidden}.surfstr-sensory__fill{display:block;height:100%;width:0;border-radius:9999px;background:var(--ss-yellow);transition:width 1s cubic-bezier(.22,1,.36,1) var(--d)}.surfstr-sensory__value{font-family:var(--ss-display);font-size:1.125rem;line-height:1;color:var(--ss-yellow);font-variant-numeric:tabular-nums;text-align:right;opacity:0;transition:opacity .4s ease calc(var(--d) + .5s)}.surfstr-sensory.is-in-view .surfstr-sensory__fill{width:var(--v)}.surfstr-sensory.is-in-view .surfstr-sensory__value{opacity:1}.surfstr-sensory__card{background:var(--ss-yellow);color:var(--ss-deep);border-radius:1.5rem;padding:1.5rem;display:grid;grid-template-columns:auto minmax(0,1fr);gap:1.25rem;align-items:center}.surfstr-sensory__img{width:auto;height:9rem;max-width:100%;object-fit:contain;filter:drop-shadow(0 .75rem 1.25rem oklch(.24 .14 295 / .35))}@media(min-width:990px){.surfstr-sensory__card{grid-template-columns:1fr;text-align:center;justify-items:center;padding:2rem}.surfstr-sensory__img{height:14rem}}.surfstr-sensory__card-title{font-family:var(--ss-display);font-size:1.5rem;line-height:1;text-transform:lowercase;margin:0 0 .85rem;padding-bottom:.1em}.surfstr-sensory__chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}@media(min-width:990px){.surfstr-sensory__chips{justify-content:center}}.surfstr-sensory__chip{display:inline-flex;align-items:center;min-height:2.25rem;padding:.3rem .85rem;border-radius:9999px;background:var(--ss-deep);color:var(--ss-yellow);font-size:.875rem;font-weight:600}.surfstr-sensory__colour{margin:1rem 0 0;font-size:.9375rem;line-height:1.5;color:color-mix(in oklch,var(--ss-deep) 82%,var(--ss-yellow))}.surfstr-sensory__note{margin:2rem 0 0;font-size:.875rem;max-width:60ch;color:var(--ss-soft)}@media(prefers-reduced-motion:reduce){.surfstr-sensory__fill,.surfstr-sensory__value{transition:none!important}.surfstr-sensory__fill{width:var(--v)!important}.surfstr-sensory__value{opacity:1!important}}
/*# sourceMappingURL=/cdn/shop/t/21/assets/surfstr-sensory.css.map */
