.devices-section{background:linear-gradient(#FFFFFF,#F8FCFE);overflow-x:clip;overflow-y:visible}
/* Both decorative source layers belong to the section, outside the tab panels. */
.devices-section::before,.devices-section::after{content:"";position:absolute;z-index:-1;pointer-events:none;background:center/100% 100% no-repeat}
.devices-section::before{left:calc(50% - 938px);top:calc(var(--section-space) + 5px);width:660px;height:823px;background-image:url('../img/devices-blur.png')}
.devices-section::after{left:calc(50% - 285px);top:calc(var(--section-space) + 118px);width:402px;height:641px;background-image:url('../img/devices-glow.png');filter:blur(24px)}
/* Device presentation; shared tab behavior lives in tabs.js. */
.devices-section [role="tabpanel"][hidden]{display:none}
.devices-section [role="tabpanel"]:focus-visible{outline-offset:6px}
.device-tab{display:grid;grid-template-columns:auto auto minmax(0,1fr);grid-template-rows:calc(23px * var(--type-scale,1)) max(39.2px,calc(42px * var(--type-scale,1)));row-gap:5px;align-items:first baseline;align-content:center;border:0;background:none;text-align:left;padding-inline:0;padding-top:0}
.device-tab>img{grid-column:1;grid-row:1/3;align-self:center}
.device-tab>span:last-child{display:contents}
.device-tab__number{grid-column:2;grid-row:1;align-self:first baseline;margin-top:0;line-height:calc(23px * var(--type-scale,1))}
.device-tab strong{grid-column:3;grid-row:1}
.device-tab small{grid-column:3;grid-row:2;margin-top:0}
.device-tab[aria-selected="false"]{color:var(--color-muted)}
.device-tab[aria-selected="true"]{color:var(--color-action-blue)}
.device-tab[aria-selected="true"]::after{content:"";position:absolute;bottom:-2px;left:0;right:0;height:4px;background:var(--color-action-blue)}
.device-tab:hover{color:var(--color-action-blue)}
@media(max-width:767.98px){.device-tab{grid-template-rows:auto;row-gap:0}.device-tab>img{grid-row:1}.device-tab small{display:none}.device-tab__break{display:block}}
@media(max-width:539.98px){.device-tab{grid-template-columns:auto minmax(0,1fr)}.device-tab strong{grid-column:2}}
@media(max-width:359.98px){.devices-section__tabs{gap:4px}.device-tab{gap:4px}.device-tab img{width:28px}}
.device-specs{row-gap:24px;min-height:184px}
.devices-section__visual--pump{display:flex;align-items:center;justify-content:center}
.devices-section__visual .devices-section__pump{position:static;width:auto;max-width:100%;height:80%;object-fit:contain;transform:translateY(-30px) scale(1.3)}
.getting-started__item{position:relative;padding-right:42px}
.getting-started__item .getting-started__icon{position:absolute;top:32px;right:12px;left:auto;width:24px;height:24px;margin:0;color:#000;background:currentColor;opacity:.3;mask:url('../img/getting-started-file.svg') center/contain no-repeat}
.getting-started__item:hover h4,.getting-started__item:hover>span,.getting-started__item:focus-visible h4,.getting-started__item:focus-visible>span{color:var(--color-action-blue)}
.getting-started__item:hover .getting-started__icon,.getting-started__item:focus-visible .getting-started__icon{opacity:1}
@media(max-width:767.98px){.device-tab{flex:1;min-width:0;width:auto;padding-top:12px}.getting-started__item .getting-started__icon{top:0}.devices-section__visual .devices-section__pump{width:100%;height:auto;transform:scale(1.3)}}
@media(max-width:539.98px){.device-specs{column-gap:12px}.device-specs__item{min-width:0}.device-specs dd{white-space:normal}}
/* Tablet rules continue through every smaller viewport. */
@media(max-width:1199.98px){.devices-section::before,.devices-section::after{display:none}}

/* A narrower visual gives tablet copy and paired specifications room to breathe. */
@media(min-width:768px) and (max-width:1199.98px){
.devices-section__product{grid-template-columns:minmax(0,2fr) minmax(0,3fr)}
.devices-section__visual{max-width:280px}
.devices-section__visual .devices-section__pump{transform:translateY(-12px) scale(1.3)}
.devices-section .device-specs{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;min-height:0}
.device-specs__item,.device-specs__item>div{min-width:0}
.device-specs dt,.device-specs dd{overflow-wrap:anywhere}
.devices-section__actions{margin-bottom:20px}
}

/* The product grid bounds the tablet image's sticky travel; short views scroll normally. */
@media(min-width:768px) and (max-width:1199.98px) and (min-height:400px){
.devices-section__visual{position:sticky;top:24px;align-self:start}
}

/* Remove transparent canvas slack as well as the doubled grid/margin gap. */
@media(max-width:767.98px){
.devices-section__product{row-gap:16px}
.devices-section__description{margin-top:0}
.devices-section__visual{aspect-ratio:588/480}
.devices-section__visual .devices-section__box{height:100%;object-fit:cover;object-position:top}
.devices-section__applicator{top:14.1667%}
.devices-section__visual--pump{height:auto;min-height:0}
}

/* The desktop grid keeps its original children; mobile gets a native card track. */
.getting-started__track{display:contents}
.getting-started__scrollbar[hidden]{display:none}
.getting-started__scrollbar{display:none}
@media(max-width:767.98px){
.getting-started{display:block}
.getting-started>h3{margin-bottom:24px}
.getting-started__track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;cursor:grab}
.getting-started__track::-webkit-scrollbar{display:none}
.getting-started__track:focus-visible{outline:3px solid var(--color-action-blue);outline-offset:5px}
.getting-started__track--range-dragging{scroll-snap-type:none}
.getting-started__track--dragging{scroll-snap-type:none;cursor:grabbing;user-select:none}
.getting-started__track>.getting-started__item{flex:0 0 min(240px,calc(100vw - 60px));scroll-snap-align:start;min-width:0;padding-left:32px;padding-right:28px}
.getting-started__item .getting-started__icon{right:0;width:20px;height:20px}
.getting-started__track>.getting-started__item:focus-visible{outline-offset:-2px}
.getting-started__scrollbar{display:block;width:100%;height:44px;margin:12px 0 0;padding:0;appearance:none;background:transparent;cursor:ew-resize;accent-color:var(--color-action-blue)}
.getting-started__scrollbar::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:#dce7f7}
.getting-started__scrollbar::-webkit-slider-thumb{appearance:none;width:48px;height:12px;margin-top:-4px;border:0;border-radius:6px;background:var(--color-action-blue)}
.getting-started__scrollbar::-moz-range-track{height:4px;border-radius:2px;background:#dce7f7}
.getting-started__scrollbar::-moz-range-thumb{width:48px;height:12px;border:0;border-radius:6px;background:var(--color-action-blue)}
.getting-started__scrollbar:focus-visible{outline:3px solid var(--color-action-blue);outline-offset:2px}
}
