:root{--columns-gap:clamp(1.25rem,4vw,4rem);--columns-border-radius:9rem;--columns-transition-opacity:0.3s;--columns-transition-height:0.5s}.columns{&.columns-customer_segments{--columns-gap:clamp(1.25rem,4vw,2rem);border-top-left-radius:var(--hero-margin-overlap)}&.columns-product_categories{--columns-gap:4rem}}.columns-content{max-width:1000px}.columns-wrapper{display:grid;grid-gap:var(--columns-gap);grid-template-columns:repeat(auto-fill,1fr);&:not(:first-child){margin-top:5rem}@media (min-width:480px){grid-template-columns:repeat(auto-fill,minmax(18rem,1fr))}@media (min-width:768px){grid-template-columns:repeat(auto-fill,minmax(22rem,1fr))}.columns-customer_segments &{gap:var(--columns-gap);margin-bottom:2rem}}.column-customer-segment{aspect-ratio:4/5;display:grid;grid-template-areas:"a";grid-template-columns:repeat(1,1fr);grid-template-rows:repeat(1,1fr);position:relative}.column-customer-segment-link{position:relative;--link-color:var(--color-white)}.column-customer-segment-media{grid-area:a;overflow:clip;&:after{background:var(--color-blue-800-50);content:"";inset:0;position:absolute;@media (min-width:640px){display:none}}& img{height:100%;object-fit:cover;width:100%}}.column-customer-segment-content{--text-color:var(--color-white);--heading-color:var(--color-white);display:flex;flex-direction:column;grid-area:a;justify-content:flex-end;padding:1.5rem;transition:all var(--columns-transition-opacity) ease-in-out;@media (min-width:480px){.column-customer-segment:hover &{backdrop-filter:brightness(70%) blur(6px)}}& h4{display:flex;justify-content:space-between;margin-bottom:0;width:100%}& hr{border-width:0;border-top:2px solid var(--text-color);margin-bottom:1rem;margin-top:1rem}}.column-customer-segment-content-hidden{@media (min-width:640px){max-height:0;opacity:0;overflow:clip;transition:opacity .5s ease-in-out,max-height .2s ease-in-out}.column-customer-segment-content.expanded &,.column-customer-segment-content:hover &{max-height:500px;opacity:1;transition:opacity var(--columns-transition-opacity) ease-in-out,max-height var(--columns-transition-height) ease-in-out}}.column-product-category{& h5{display:flex;gap:1rem;& img{margin:0}}& p{text-wrap:wrap}}.column-image{aspect-ratio:1;border-radius:var(--columns-border-radius);margin-bottom:1rem;max-width:10rem;@media (min-width:768px){margin-bottom:2rem}& img{height:100%;object-fit:cover;width:100%}}