@keyframes appear-translate-left{from{opacity:0;
transform:translateX(-50%)}}
@keyframes appear-translate-right{from{opacity:0;
transform:translateX(50%)}}
@keyframes appear-scale{from{opacity:0;
transform:scale(0.8)}}
:root{--spacing:clamp(10px,2vw,20px);--spacing-xs:calc(var(--spacing) * 0.50);--spacing-sm:calc(var(--spacing) * 0.75);--spacing-lg:calc(var(--spacing) * 1.50);--spacing-xl:calc(var(--spacing) * 2.00);--spacing-xxl:calc(var(--spacing) * 3.00);--border-radius:10px;--fw-border-radius:var(--border-radius);--fw-margin-inline:0;--feature-background:#f0f0f6;--hero-title-color:#fff;--hero-title-size:min(8vw,60px);--hero-subtitle-color:#f33;--hero-subtitle-size:min(5vw,40px);--headline-color:#08f;--highlights-label-color:#07e;--highlights-value-color:#036;--product-link-color:#07e;--product-link-hover:#06d}@media screen and (max-width:800px){:root{--fw-border-radius:0;--fw-margin-inline:-2rem}}@media screen and (max-width:640px){:root{--fw-margin-inline:-1.5rem}}body,main.content{overflow-x:clip}.hero-content{text-align:center;position:relative;margin-inline:var(--spacing-lg);margin-block:var(--spacing-xxl)}.hero-content h1{margin:0;font-weight:bold;color:var(--hero-title-color);font-size:var(--hero-title-size)}.hero-content p{line-height:1.1;font-weight:bold;margin:0.25em 0 0 0;color:var(--hero-subtitle-color);font-size:var(--hero-subtitle-size)}.hero-logos{display:flex;gap:var(--spacing-lg);justify-content:center;margin-top:var(--spacing-xl)}.hero-logos img{width:auto;height:clamp(20px,5vw,40px)}.features{display:grid;flex-wrap:wrap;font-size:14px;gap:var(--spacing);margin-block:var(--spacing);grid-template-columns:1fr 1fr 1fr}@media screen and (max-width:960px){.features{grid-template-columns:1fr 1fr}}@media screen and (max-width:640px){.features{grid-template-columns:1fr}}.feature{display:flex;align-items:center;box-sizing:border-box;border-radius:var(--border-radius);background-color:var(--feature-background)}.feature p{margin:var(--spacing);margin-left:0}.gallery{gap:10px;display:flex;align-items:center;flex-direction:column;margin-block:var(--spacing-lg)}.gallery-photos{padding:0;display:flex;margin-block:0;max-width:800px;list-style:none;overflow-x:hidden;scroll-snap-type:x mandatory;max-height:calc(100vh - 100px);margin-inline:var(--fw-margin-inline)}.gallery-photos li{margin:0;padding:0;flex:1 0 100%;scroll-snap-stop:always;scroll-snap-align:start}.gallery-photos img{width:100%;height:100%;-o-object-fit:contain;object-fit:contain}.gallery-thumbs{gap:5px;display:flex;max-width:100%;overflow-x:scroll;scroll-snap-type:x mandatory}.gallery-thumbs button{margin:0;padding:9px;background:none;border-radius:5px;border:1px solid #E0E0E6;scroll-snap-stop:always;scroll-snap-align:start}.gallery-thumbs button.selected{background-color:#E0E0E6}.gallery-thumbs img{height:auto;width:clamp(40px,5.5vw,60px)}@media (pointer:coarse) and (max-width:800px){.gallery-photos{max-height:100vh;overflow-x:scroll}.gallery-thumbs{display:none}}.section{display:flex;flex-direction:column;gap:var(--spacing-xxl);padding-block:var(--spacing-xxl)}.headline{opacity:0;display:flex;text-align:center;gap:var(--spacing-lg);flex-direction:column;transform:translateY(var(--spacing-xxl));transition:transform 0.5s ease-out,opacity 0.5s ease-out}.headline.in-view{opacity:1;transform:translateY(0)}.headline h2{margin:0;font-weight:bold;color:var(--headline-color);font-size:clamp(28px,6vw,50px)}.headline p{margin:0 auto;font-size:18px;max-width:750px;line-height:1.5;text-wrap:balance}@media screen and (max-width:480px){.headline p{font-size:16px}}.headline small{opacity:0.5;font-size:13px}.highlights{padding:0;display:flex;margin:0 auto;gap:0.75em 1em;flex-wrap:wrap;max-width:800px;list-style:none;text-align:center;justify-content:center;font-size:clamp(22px,4vw,36px)}.highlights li{margin:0;padding:0;opacity:0;transform:scale(0.8);transition:transform 0.5s ease-out,opacity 0.5s ease-out}.highlights li.in-view{opacity:1;transform:scale(1)}.highlights li span{display:block;font-size:14px;color:var(--highlights-label-color)}.highlights li b{font-weight:bold;letter-spacing:-0.03em;color:var(--highlights-value-color)}.figures,.cards{display:flex;overflow-x:scroll;gap:var(--spacing);border-radius:10px;margin-top:var(--spacing);scroll-snap-type:x mandatory}.figure{flex:1 0 80%;color:#FFF;position:relative;background:#000;aspect-ratio:1.75;border-radius:10px;scroll-snap-stop:always;scroll-snap-align:center}.figure img{inset:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;position:absolute;-o-object-position:top;object-position:top;border-radius:inherit}.figure figcaption{display:flex;min-height:100%;position:relative;box-sizing:border-box;flex-direction:column;justify-content:center;padding:var(--spacing-xxl)}.figure figcaption h3{color:inherit;font-weight:bold;margin:0 0 0.5em 0;font-size:clamp(24px,5vw,40px)}.figure figcaption p{margin:0;width:70%;font-size:16px;line-height:1.5;max-width:500px}.figure figcaption p+p{margin-top:0.5em}.figure figcaption small{opacity:0.8;display:block}.card{flex:1 0 40%;color:#FFF;font-size:16px;overflow:hidden;position:relative;background:#000;border-radius:10px;scroll-snap-stop:always;scroll-snap-align:start}.card img{width:100%;height:auto;display:block;margin:0 auto;max-width:480px}.card figcaption{padding:var(--spacing-xl)}.card figcaption p{margin:0;line-height:1.5}@media screen and (max-width:800px){.figures,.cards{border-radius:0;margin-inline:-2rem;padding-inline:2rem}.cards{scroll-padding-inline:4rem}.figure{flex-basis:calc(100% - 2rem)}.figure img{height:auto;-o-object-fit:contain;object-fit:contain}.figure figcaption{padding-top:20vw;justify-content:flex-end}.figure figcaption p{width:unset}.card{font-size:14px;flex-basis:calc(50% - var(--spacing) / 2 - 2rem)}}@media screen and (max-width:640px){.figures,.cards{margin-inline:-1.5rem;padding-inline:1.5rem}.cards{scroll-padding-inline:unset}.figure{flex-basis:calc(100% - 1.5rem)}.figure figcaption{padding-top:30vw}.figure figcaption p{max-width:unset}.card{scroll-snap-align:center;flex-basis:calc(100% - 1.5rem)}}@media screen and (max-width:480px){.figure figcaption p{font-size:14px}}[data-video]{position:relative}[data-video] [data-playback]{--size:clamp(32px,5vw,48px);opacity:0.5;border-radius:50%;position:absolute;width:var(--size);height:var(--size);background-size:60%;background-color:unset;transition:opacity 0.2s;border:2px solid #fff;right:var(--spacing-xl);bottom:var(--spacing-xl);background-position:center;background-repeat:no-repeat}[data-video] [data-playback]:hover{opacity:1}[data-video] [data-playback="play"]{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36'%3E%3Cpolygon fill='white' points='9 4 9 32 33.5 18'/%3E%3C/svg%3E")}[data-video] [data-playback="pause"]{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36'%3E%3Cpath fill='white' d='M7,4 L15,4 L15,32 L7,32 Z M21,4 L29,4 L29,32 L21,32 Z'/%3E%3C/svg%3E")}.connectivity{width:100%;margin:0 auto;max-width:925px}.connectivity img{width:100%;height:auto}.connectivity figcaption{gap:8px 20px;display:grid;font-size:14px;color:#606066;line-height:1.1;margin:10px 20%;grid-template-columns:auto auto}@media screen and (max-width:800px){.connectivity figcaption{margin-inline:10%}}@media screen and (max-width:640px){.connectivity figcaption{margin-inline:5%}}@media screen and (max-width:480px){.connectivity figcaption{grid-template-columns:auto}}@media (prefers-reduced-motion:no-preference){.connectivity-left img{animation:appear-translate-left linear both;animation-timeline:view();animation-range:20vh 50vh}.connectivity-right img{animation:appear-translate-right linear both;animation-timeline:view();animation-range:20vh 50vh}}.products-stack{--items:4;--gap:15px;--gap-inner:20px;display:flex;gap:var(--gap);overflow-x:scroll;scroll-snap-type:x mandatory}@media screen and (max-width:1024px){.products-stack{--items:3}}@media screen and (max-width:800px){.products-stack{--items:2}}@media screen and (max-width:480px){.products-stack{--items:1;--gap:0px;margin-inline:var(--fw-margin-inline)}}.products-pager{gap:5px;padding:0;display:flex;list-style:none;justify-content:center;margin:var(--spacing) 0 0 0}.products-pager li{width:8px;height:8px;opacity:0.3;border-radius:50%;background-color:#000}.products-pager li.active{opacity:1}.product{margin:0;display:flex;position:relative;border-radius:10px;gap:var(--gap-inner);background:#F0F0F6;flex-direction:column;box-sizing:border-box;scroll-snap-stop:always;scroll-snap-align:start;padding:0 0 var(--gap-inner) 0;flex:0 0 calc((100% - var(--gap) * (var(--items) - 1)) / var(--items))}.product dt{margin:5px;border-radius:5px;background-color:#fff}.product img{width:auto;height:200px;display:block;margin:0 auto}.product dd{padding-inline:var(--gap-inner)}@media screen and (max-width:480px){.product{border-radius:var(--fw-border-radius)}.product dt{margin:15px;margin-bottom:5px}}.product-name a{text-decoration:none;color:var(--product-link-color)}.product-name a:hover{color:var(--product-link-hover)}.product-name h3{margin:0;color:inherit;line-height:1;font-size:20px;font-weight:bold}.product-name h4{font-size:16px;color:#707078;margin:0.4em 0 0 0}.product-details{flex-grow:1}.product-details ul{margin-block:0;font-size:12px;margin-left:1.25em}.product-details ul li{margin:0 0 0.4em 0}.product-pricing{display:flex;flex-direction:column}.product-pricing strong{font-weight:bold}.product-pricing small{font-size:14px;color:#707078}.product-actions{gap:15px;display:flex;text-align:center;flex-direction:column}.product-actions button{gap:8px;width:100%;display:flex;font-size:16px;line-height:2.5em;align-items:center;justify-content:center;text-transform:uppercase;background-color:var(--product-link-color)}.product-actions button:hover{background-color:var(--product-link-hover)}.product-actions button svg{width:20px;height:20px}@keyframes hero-background-fade{0%{opacity:0.35}
30%{opacity:0}
70%{opacity:0}
to{opacity:0.35}}
@keyframes hero-bounce-front{0%{transform:translateY(0)}
30%{transform:translateY(-10px)}
70%{transform:translateY(10px)}
to{transform:translateY(0)}}
@keyframes hero-bounce-back{0%{transform:translateY(0)}
30%{transform:translateY(10px)}
70%{transform:translateY(-10px)}
to{transform:translateY(0)}}
.hero{display:flex;position:relative;align-items:center;flex-direction:column;background-size:cover;background-color:#000;background-repeat:no-repeat;background-position:bottom center;background-image:url('./img/hero-background.webp');border-radius:var(--fw-border-radius);margin-inline:var(--fw-margin-inline)}.hero:before{inset:0;content:"";position:absolute;border-radius:inherit;background-color:#000;animation:hero-background-fade 5s ease-in-out infinite alternate}@media screen and (max-width:800px){.hero{margin-top:-2rem;padding-top:2rem}}.hero-laptop{--offset-vertical:120px;--offset-horizontal:100px;z-index:1;display:flex;position:relative;align-items:flex-end;margin-bottom:var(--offset-vertical)}.hero-laptop .laptop-front{position:relative;right:calc(-1 * var(--offset-horizontal));animation:hero-bounce-front 10s ease-in-out infinite alternate}.hero-laptop .laptop-back{z-index:-1;position:relative;top:var(--offset-vertical);left:calc(-1 * var(--offset-horizontal));animation:hero-bounce-back 10s ease-in-out infinite alternate}.cooling-video{overflow:hidden;background-color:#000;border-radius:var(--fw-border-radius);margin-inline:var(--fw-margin-inline)}.cooling-video video{width:100%;height:auto;display:block}.display-image{width:100%;height:auto;display:block;margin:0 auto;max-width:960px}@media (prefers-reduced-motion:no-preference){.display-image{animation:appear-scale linear both;animation-timeline:view();animation-range:25vh 60vh}}