.bo-ex{--bo-ex-top: calc(var(--bo-header-h, 100px) + 28px);--bo-ex-ph: clamp(280px, 36vh, 380px);--bo-ex-wave: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 220' preserveAspectRatio='none'%3E%3Cpath d='M0 112C23 104 47 104 70 110S117 118 140 108V220H0Z'/%3E%3C/svg%3E")}.bo-ex__points{display:grid;gap:clamp(44px,5vw,80px)}.bo-ex__point{display:grid;gap:clamp(18px,2vw,26px);align-content:start}.bo-ex__pic{--bo-ratio: 4 / 3;box-shadow:var(--bo-shadow-s)}.bo-ex__pic>img{object-position:var(--bo-ex-focal, 50% 50%)}.bo-ex__title{display:flex;align-items:center;gap:16px;margin-bottom:14px}.bo-ex__title .bo-h3{margin:0;text-wrap:balance}.bo-ex__disc{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--bo-disc-blue);color:var(--bo-navy)}.bo-ex__disc .bo-icon{width:26px;height:26px}.bo-ex__disc--teal{background:var(--bo-disc-teal)}.bo-ex__disc--green{background:var(--bo-disc-green)}.bo-ex__text{max-width:58ch}.bo-ex__text>:last-child{margin-bottom:0}.bo-ex__shown{display:flex;flex-wrap:wrap;align-items:center;column-gap:16px;row-gap:0;margin:12px 0 0}.bo-ex__shown .bo-price{flex:none}.bo-ex__shown-label{font-size:var(--bo-fs-small);color:var(--bo-text-soft)}.bo-ex__end{display:grid;justify-items:start;gap:14px;padding-top:8px}.bo-ex__end .bo-h3{margin:0}.bo-ex__end-text{max-width:52ch}.bo-ex__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}.bo-ex--live .bo-ex__actions{display:grid;grid-template-columns:max-content}.bo-ex__finder{margin-top:2px}.bo-ex__stage{display:none}@media(max-width:599px){.bo-ex__title{gap:14px}.bo-ex__disc{width:46px;height:46px}.bo-ex__disc .bo-icon{width:23px;height:23px}.bo-ex__actions{width:100%}.bo-ex__actions .bo-btn{flex:1 1 100%}}@media(min-width:900px){.bo-ex:not(.bo-ex--live) .bo-ex__point{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;column-gap:clamp(40px,5vw,88px)}.bo-ex:not(.bo-ex--live) .bo-ex__point:nth-child(2n) .bo-ex__pic{order:2}.bo-ex:not(.bo-ex--live) .bo-ex__end{justify-items:center;text-align:center;padding-top:clamp(8px,2vw,24px)}.bo-ex:not(.bo-ex--live) .bo-ex__actions{justify-content:center}}@media(min-width:900px){.bo-ex--live .bo-ex__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);column-gap:clamp(40px,5.2vw,104px);align-items:start}.bo-ex--live .bo-ex__points{grid-column:1;grid-row:1;gap:0}.bo-ex--live .bo-ex__pic{display:none}.bo-ex--live .bo-ex__point{display:flex;align-items:center;min-height:var(--bo-ex-ph);opacity:.72;transition:opacity var(--bo-dur-settle) var(--bo-ease-soft)}.bo-ex--live .bo-ex__point.is-on{opacity:1}.bo-ex--live .bo-ex__disc{transition:transform var(--bo-dur-settle) var(--bo-ease);transform:scale(.86)}.bo-ex--live .bo-ex__point.is-on .bo-ex__disc{transform:none}.bo-ex--live .bo-ex__end{padding:clamp(24px,5vh,56px) 0 8px}.bo-ex--live .bo-ex__stage{grid-column:2;grid-row:1;position:sticky;top:var(--bo-ex-top);display:flex;flex-direction:column;align-items:center;gap:18px}.bo-ex__switch{position:relative;display:inline-grid;grid-template-columns:1fr 1fr;padding:5px;border-radius:var(--bo-r-round);background:var(--bo-white);box-shadow:inset 0 0 0 1px var(--bo-line),var(--bo-shadow-xs)}.bo-ex__key{position:absolute;top:5px;right:5px;bottom:5px;left:5px;display:block;border-radius:var(--bo-r-round);background:var(--bo-blue);clip-path:inset(0 50% 0 0 round 999px);transition:clip-path var(--bo-dur-reveal) var(--bo-ease)}.bo-ex[data-side=commercial] .bo-ex__key{clip-path:inset(0 0 0 50% round 999px)}.bo-ex[data-side=both] .bo-ex__key{clip-path:inset(0 0 0 0 round 999px)}.bo-ex__side{position:relative;z-index:1;min-width:150px;padding:11px 24px;font-family:var(--bo-font-display);font-size:1.5rem;font-weight:var(--bo-fw-bold);line-height:1.2;text-align:center;color:var(--bo-navy);transition:color var(--bo-dur-settle) var(--bo-ease-soft)}.bo-ex[data-side=household] .bo-ex__side--household,.bo-ex[data-side=commercial] .bo-ex__side--commercial,.bo-ex[data-side=both] .bo-ex__side{color:#fff}.bo-ex__frame{position:relative;isolation:isolate;display:block;width:100%;aspect-ratio:5 / 4;max-height:calc(100vh - var(--bo-header-h, 100px) - 160px);min-height:340px;overflow:hidden;border-radius:var(--bo-r-xl);background:var(--bo-sky);box-shadow:var(--bo-shadow-m)}.bo-ex__shot{position:absolute;top:0;right:0;bottom:0;left:0;display:block;-webkit-mask:var(--bo-ex-wave) 0% 0% / 140% 220% no-repeat;mask:var(--bo-ex-wave) 0% 0% / 140% 220% no-repeat;transition:-webkit-mask-position .9s var(--bo-ease),mask-position .9s var(--bo-ease)}.bo-ex__shot.is-on{-webkit-mask-position:100% 100%;mask-position:100% 100%}.bo-ex__shot:first-child{-webkit-mask:none;mask:none}.bo-ex__shot img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:var(--bo-ex-focal, 50% 50%);scale:1.05;transition:scale 1.6s var(--bo-ease)}.bo-ex__shot.is-on img,.bo-ex__shot:first-child img{scale:1}.bo-ex__dots{justify-content:center}}@media(prefers-reduced-motion:reduce){.bo-ex__shot,.bo-ex__shot img,.bo-ex__point,.bo-ex__key,.bo-ex__disc{transition:none!important;animation:none!important}}@media print{.bo-ex__stage{display:none!important}.bo-ex__pic{display:block!important}}@media(max-width:899px){.bo-ex__points,.bo-ex__point{grid-template-columns:minmax(0,1fr)}.bo-ex__point>*{min-width:0}.bo-ex--live .bo-ex__actions{display:flex;grid-template-columns:none}}@media(max-width:899px){.bo-ex__end{grid-template-columns:minmax(0,1fr);justify-items:stretch}.bo-ex__end>*{min-width:0}.bo-ex__actions .bo-btn{white-space:normal;min-width:0}}.bo-ex__copy,.bo-ex__end{--ex-bg: #DCEEFD;--ex-bd: #C2E0F8;padding:clamp(22px,2.2vw,34px);border:1px solid var(--ex-bd);border-radius:24px;background:var(--ex-bg)}.bo-ex__track>.bo-ex__point:nth-child(3n+2) .bo-ex__copy{--ex-bg: #D6F4F7;--ex-bd: #B5E9EE}.bo-ex__track>.bo-ex__point:nth-child(3n+3) .bo-ex__copy{--ex-bg: #E0F3E1;--ex-bd: #C4E7C6}.bo-ex__end{--ex-bg: #FFEBD6;--ex-bd: #FBD7B0;margin-top:18px}.bo-ex__copy .bo-ex__title{margin-bottom:12px}.bo-ex__copy .bo-ex__text{color:var(--bo-text)}.bo-ex__point+.bo-ex__point{margin-top:18px}@media(min-width:900px){.bo-ex--live .bo-ex__point+.bo-ex__point{margin-top:0}.bo-ex--live .bo-ex__copy{width:100%;box-shadow:var(--bo-shadow-xs);transition:box-shadow var(--bo-dur-settle) var(--bo-ease-soft),transform var(--bo-dur-settle) var(--bo-ease)}.bo-ex--live .bo-ex__point.is-on .bo-ex__copy{box-shadow:var(--bo-shadow-m);transform:translateY(-2px)}.bo-ex--live .bo-ex__end{margin-top:0;padding:clamp(22px,2.2vw,34px)}.bo-ex--live .bo-ex__point{opacity:.84}}@media(prefers-reduced-motion:reduce){.bo-ex--live .bo-ex__copy{transition:none}.bo-ex--live .bo-ex__point.is-on .bo-ex__copy{transform:none}}@media(min-width:900px){.bo-ex--live .bo-ex__point{padding-block:12px}}.bo-ex__track{display:contents}.bo-ex .bo-ex__foot{display:none}@media screen and (max-width:749px){.bo-ex{--bo-ex-cols: 1.13}.bo-ex__points{gap:0}.bo-ex__track{position:relative;display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - (var(--bo-ex-cols) - 1) * var(--bo-gap)) / var(--bo-ex-cols));gap:var(--bo-gap);margin-inline:calc(-1 * var(--bo-gutter));padding-inline:var(--bo-gutter);scroll-padding-inline:var(--bo-gutter);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}.bo-ex__track::-webkit-scrollbar{display:none}.bo-ex__track>.bo-ex__point{align-content:stretch;scroll-snap-align:start}.bo-ex__point+.bo-ex__point{margin-top:0}.bo-ex__pic{display:none}.bo-ex__copy{display:flex;flex-direction:column;padding:18px}.bo-ex__copy .bo-ex__title{margin-bottom:10px}.bo-ex__copy .bo-ex__text{font-size:1.6rem}.bo-ex__shown{margin-top:auto;padding-top:8px}.bo-ex__shown .bo-link{display:block;align-content:center;text-wrap:pretty}.bo-ex__shown .bo-link .bo-icon{margin-left:4px}.bo-ex .bo-ex__foot{display:flex;margin-top:14px}.bo-ex__points.is-still .bo-ex__foot{display:none}.bo-ex__end{gap:8px;margin-top:16px;padding:18px}.bo-ex__end .bo-ex__end-text{font-size:1.6rem}.bo-ex__actions{gap:10px;margin-top:2px}.bo-ex__finder{margin-top:0}}@media screen and (min-width:600px)and (max-width:749px){.bo-ex{--bo-ex-cols: 1.6}}
/*# sourceMappingURL=/cdn/shop/t/5/assets/bo-explainer.css.map */