.hs-module-product-hero{& .product-hero__grid{display:grid;gap:var(--Layout-Gutter-Desktop);grid-template-columns:1fr 1fr;@media (max-width:1024px){gap:var(--Spacing-M);grid-template-columns:1fr}}& .product-hero__media{display:flex;flex-direction:column;gap:var(--Spacing-XS);min-width:0}& .product-hero__stage{aspect-ratio:1;background-color:var(--Other-Placeholder-Media);border:none;cursor:zoom-in;display:block;overflow:hidden;padding:0;position:relative;width:100%;& .product-hero__stage-img{display:block;height:100%;object-fit:cover;width:100%}&.product-hero__stage--placeholder{cursor:default}}& .product-hero__play{align-items:center;background-color:var(--Other-Button-Default-Button-Fill);border:1px solid var(--Other-Button-Default-Button-Stroke);border-radius:var(--Components-Button-Corners);box-shadow:var(--Button-Default-Button-Shadow);color:var(--Icon-Default);display:inline-flex;height:var(--Components-Component-Height);justify-content:center;left:50%;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);width:var(--Components-Component-Height);&[hidden]{display:none}}& .product-hero__carousel{position:relative;& .product-hero__thumbs{display:flex;gap:var(--Spacing-XS);overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;&::-webkit-scrollbar{display:none}}& .product-hero__thumb{background-color:var(--Other-Placeholder-Media);border:2px solid transparent;cursor:pointer;flex:0 0 auto;height:80px;overflow:hidden;padding:0;position:relative;width:80px;& img{display:block;height:100%;object-fit:cover;width:100%}&.is-active{border-color:var(--State-Indicator-Active)}}& .product-hero__thumbs-next{align-items:center;background-color:var(--Other-Button-Default-Button-Fill);border:1px solid var(--Other-Button-Default-Button-Stroke);border-radius:var(--Components-Button-Corners);box-shadow:var(--Button-Default-Button-Shadow);color:var(--Icon-Default);cursor:pointer;display:inline-flex;height:var(--Components-Component-Height);justify-content:center;position:absolute;right:var(--Spacing-XS);top:50%;transform:translateY(-50%);transition:opacity .2s ease;width:var(--Components-Component-Height);&.is-hidden{opacity:0;pointer-events:none}}}& .product-hero__intro{display:flex;flex-direction:column;gap:var(--Spacing-M);max-width:var(--Layout-8-Col-Text-Max);min-width:0;padding-left:var(--Layout-1-Col-Indent);@media (max-width:1024px){max-width:none;padding-left:0}}& .product-hero__title{display:flex;flex-direction:column;gap:var(--Spacing-XS);& :is(h1,h2){margin:0}}& .product-hero__breadcrumbs{align-items:center;display:flex;flex-wrap:wrap;row-gap:var(--Spacing-XXS);& .product-hero__crumb{color:var(--Text-Description);font-family:var(--font-family-body);font-size:var(--Form-Description-Size);line-height:var(--Form-Description-Line-Height);text-decoration:underline;white-space:nowrap;&:hover{color:var(--Text-Default)}}& .product-hero__crumb-sep{color:var(--Text-Description);flex-shrink:0}}& .product-hero__description{align-items:flex-start;display:flex;flex-direction:column;gap:var(--Spacing-XXS);& .product-hero__description-text{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;& p{margin:0 0 var(--Spacing-XXS);&:last-child{margin-bottom:0}}}& .product-hero__read-more{flex:0 0 auto}}& .product-hero__variants{display:flex;flex-direction:column;gap:var(--Spacing-XS)}& .product-hero__field{display:flex;flex-direction:column;gap:var(--Spacing-XXS)}& .product-hero__field-title{align-items:center;display:flex;gap:var(--Spacing-XXS);& .product-hero__field-label{color:var(--Text-Default)}& .product-hero__field-label,& .product-hero__field-value{font-family:var(--font-family-body);font-size:var(--Form-Description-Size);line-height:var(--Form-Description-Line-Height)}& .product-hero__field-value{color:var(--Text-Description)}& .product-hero__field-info{color:var(--Icon-Disabled);cursor:help;display:flex;& .hs-icon{height:16px;width:16px}}}& .product-hero__swatches{align-items:center;display:flex;flex-wrap:wrap;gap:var(--Spacing-XXS);min-height:var(--Components-Component-Height)}& .product-hero__swatch{align-items:center;background-color:var(--Other-Button-Default-Button-Fill);border:1px solid var(--State-Indicator-Inactive);border-radius:32px;cursor:pointer;display:inline-flex;height:var(--Components-Component-Height);justify-content:center;padding:0;transition:border-color .2s ease;width:var(--Components-Component-Height);& .product-hero__swatch-fallback,& img{border-radius:50%;display:block;height:32px;object-fit:cover;width:32px}& .product-hero__swatch-fallback{background-color:var(--Other-Placeholder-Media)}&.is-selected{border:2px solid var(--State-Indicator-Active)}&:focus-visible{outline:2px solid var(--State-Indicator-Active);outline-offset:2px}}& .product-hero__dropdown{position:relative;& .product-hero__select{appearance:none;background-color:var(--Other-Dropdown-Fill);border:1px solid var(--Other-Dropdown-Stroke);border-radius:var(--Components-Form-Field-Corners);box-shadow:var(--Dropdown-Shadow);color:var(--Text-Default);cursor:pointer;font-family:var(--font-family-body);font-size:var(--Form-Input-Size);height:var(--Components-Component-Height);line-height:var(--Form-Input-Line-Height);padding:0 calc(var(--Spacing-XS)*2 + 20px) 0 var(--Spacing-XS);width:100%;&:has(option[value=""]:checked),&:invalid{color:var(--Text-Description)}&:focus-visible{outline:1px solid var(--State-Indicator-Active)}}& .product-hero__dropdown-icon{color:var(--Icon-Default);pointer-events:none;position:absolute;right:var(--Spacing-XS);top:50%;transform:translateY(-50%)}}& .product-hero__anchors{display:flex;flex-direction:column;gap:var(--Spacing-XXS);& .product-hero__anchor{align-items:center;background-color:var(--Other-Background-Alternative);border-left:2px solid transparent;display:flex;gap:var(--Spacing-XS);padding:var(--Spacing-XS);text-decoration:none;transition:border-color .2s ease;& .product-hero__anchor-label{color:var(--Text-Default);flex:1;font-family:var(--font-family-body);font-size:var(--Button-Button-Size);font-weight:var(--Font-Weight-Medium);line-height:var(--Button-Button-Line-Height);min-width:0;overflow-wrap:break-word}& .product-hero__anchor-icon{color:var(--Icon-Branded);display:block;flex-shrink:0;transition:transform .2s ease}&:focus-visible,&:hover{border-left-color:var(--Colours-Brand-Moso-Green-WCAG)}&:focus-visible .product-hero__anchor-icon,&:hover .product-hero__anchor-icon{transform:rotate(90deg)}}}}