.story-of-design .title{text-align:center;margin:var(--space-s) 0;color:var(--color-black);font-family:var(--typo-heading-family);font-size:var(--typo-heading-3);font-weight:var(--font-weight-400);line-height:var(--typo-line-height-120)}.story-of-design .container{position:relative;padding:0;margin-bottom:var(--space-xl)}.story-of-design .container .carousel{display:flex;flex-direction:row;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;gap:var(--space-xs);padding:var(--space-s) 0 var(--space-xl) 0;margin:0 var(--space-xs)}.story-of-design .container .carousel-controls{position:absolute;bottom:var(--size-xs-xs);left:var(--size-xs);z-index:2}.story-of-design .container .story-block{flex:0 0 var(--size-100-per-100);display:flex;flex-direction:column;align-items:center;scroll-snap-align:start;padding:0}.story-of-design .container .story-block .story-image{width:var(--size-100-per-100);height:auto;max-height:calc(var(--size-xs-xs) * 42.4);overflow:hidden}.story-of-design .container .story-block .story-image img{width:var(--size-100-per-100);height:var(--size-100-per-100);object-fit:cover}.story-of-design .container .story-block .story-text{display:flex;flex-direction:column;gap:var(--space-xs);text-align:center;margin-top:var(--space-xs);padding:0 var(--space-xxs)}.story-of-design .container .story-block .story-text .title{text-align:left;color:var(--color-black);font-family:var(--typo-heading-family);font-size:var(--typo-heading-3);font-weight:var(--font-weight-400);line-height:var(--typo-line-height-120);margin:0}.story-of-design .container .story-block .story-text .description{text-align:left;color:var(--color-gray-4);font-family:var(--typo-body-family);font-size:var(--typo-body-xs);font-weight:var(--font-weight-400);line-height:var(--typo-line-height-150);margin:0}.story-of-design .container .story-block .story-text .title,.story-of-design .container .story-block .story-text .description{white-space:normal;overflow-wrap:break-word;word-break:normal}@media only screen and (min-width: 750px) and (max-width: 989px){.story-of-design .title{margin:var(--space-m) 0}.story-of-design .container:has(.medium-hide){margin-bottom:0}.story-of-design .container .carousel{gap:var(--space-xs);margin:0 var(--space-xs)}.story-of-design .container .story-block{flex:0 0 var(--size-50-per-100);padding:0}.story-of-design .container .story-block .story-text{margin-top:var(--space-s)}.story-of-design .container .story-block:last-child{flex:0 0 calc(var(--size-50-per-100) - var(--space-xs))}.story-of-design .container .story-block .story-image{height:calc(var(--size-xs-xs) * 30)}}@media only screen and (min-width: 990px){.story-of-design .title{margin:var(--space-m) 0;font-size:var(--typo-heading-2)}.story-of-design .container{margin-bottom:0}.story-of-design .container .carousel-controls{display:none}.story-of-design .container .carousel{display:flex;flex-direction:column!important;justify-content:center!important;align-items:center!important;gap:var(--space-xl)!important;padding:var(--space-m) 0 var(--space-3xl) 0!important;overflow:visible;margin:0}.story-of-design .container .story-block{display:flex;flex-direction:row;max-width:calc(var(--size-xs-xs) * 110);width:var(--size-100-per-100);align-items:center;gap:0;padding:0}.story-of-design .container .story-block .story-image{flex:0 0 calc(var(--size-xs-xs) * 55);height:calc(var(--size-xs-xs) * 33)}.story-of-design .container .story-block .story-text{flex:1;max-width:calc(var(--size-xs-xs) * 44);margin-left:auto;text-align:left;margin-top:0}.story-of-design .container .story-block:nth-of-type(2n){flex-direction:row-reverse}.story-of-design .container .story-block:nth-of-type(2n) .story-text{margin-left:0;margin-right:auto;text-align:right}.story-of-design .container .story-block .story-text .description{margin:0}}@media only screen and (min-width: 990px) and (max-width: 1099px){.story-of-design .container .story-block{max-width:calc(var(--size-xs-xs) * 90)}.story-of-design .container .story-block .story-image{flex:0 0 calc(var(--size-xs-xs) * 45)}.story-of-design .container .story-block .story-text{max-width:calc(var(--size-xs-xs) * 34)}}@-moz-document url-prefix(){.story-of-design .container .carousel-controls{bottom:calc(var(--size-xs-xs) * 2)}}
/*# sourceMappingURL=/cdn/shop/t/25/assets/story-of-design.css.map */