/* Open, product-led first screen. Text remains editable in the page editor. */
.home .hero{background:transparent;border:0;border-radius:0;box-shadow:none;padding:32px 0 64px!important;margin-top:0!important;min-height:0;gap:48px!important;align-items:center!important;overflow:visible;isolation:isolate}
.home .hero:before,.home .hero:after{display:none}
.home .hero>.wp-block-column:first-child{flex-basis:50%!important}
.home .hero>.wp-block-column:last-child{flex-basis:50%!important;min-width:0}
.home .hero h1{font-size:48px;line-height:1.12;letter-spacing:-2px;margin:24px 0}
.home .hero .eyebrow{font-size:11px;line-height:20px;letter-spacing:1.5px;max-width:380px}
.home .hero p:not(.eyebrow){font-size:16px;line-height:28px;max-width:440px;color:#718593}
.home .hero .wp-block-buttons{gap:16px;margin-top:32px;align-items:center}
.home .hero .wp-element-button{border-radius:9999px;padding:16px 24px;background:#233e4b;border-color:#233e4b;font-size:14px}
.home .hero .wp-element-button:hover{background:#356783;transform:translateY(-2px)}
.home .hero .is-style-outline .wp-element-button{border-color:transparent;background:transparent;color:#356783;padding:16px 8px;box-shadow:none}
.home .hero .is-style-outline .wp-element-button:hover{background:#f0f5f7}
.home .hero-carousel{border:0;border-radius:32px;background:#edf3f5;padding:40px 32px 24px;box-shadow:none;max-width:none;overflow:hidden}
.home .hero-carousel:hover{transform:none;box-shadow:none}
.home .hero-slides{height:344px}
.home .hero-slide img{height:264px!important;min-height:264px;max-height:264px;object-fit:contain;mix-blend-mode:multiply}
.home .hero-slide-title{border:0;border-top:1px solid #d2dfe6;font-size:14px;line-height:24px;color:#233e4b;margin-top:16px;padding-top:16px;min-height:64px}
.home .hero-controls{border:0;margin-top:16px;padding:0;gap:12px}
.home .hero-controls button{width:40px;height:40px;background:transparent;border-color:#c9dbe4;color:#34586b;transition:background .5s,transform .5s}
.home .hero-controls button:hover{background:#fff;transform:translateY(-2px)}
.home .hero-counter{font-size:12px}
@media(min-width:1500px){.home .hero h1{font-size:60px;line-height:1.08}.home .hero-slides{height:384px}.home .hero-slide img{height:304px!important;min-height:304px;max-height:304px}}
@media(max-width:1000px) and (min-width:782px){.home .hero{gap:24px!important}.home .hero h1{font-size:36px;letter-spacing:-1px}.home .hero-carousel{padding:32px 24px 24px}.home .hero-slides{height:304px}.home .hero-slide img{height:224px!important;min-height:224px;max-height:224px}}
@media(max-width:781px){.home .hero{padding:16px 0 32px!important;gap:32px!important}.home .hero>.wp-block-column{flex-basis:100%!important}.home .hero h1{font-size:36px;line-height:40px;letter-spacing:-1px}.home .hero p:not(.eyebrow){font-size:14px;line-height:24px}.home .hero .eyebrow{font-size:10px}.home .hero .wp-block-buttons{margin-top:24px;gap:8px}.home .hero .wp-element-button{padding:12px 20px}.home .hero .is-style-outline .wp-element-button{padding:12px 8px}.home .hero-carousel{border-radius:24px;padding:24px;max-width:none}.home .hero-slides{height:280px}.home .hero-slide img{height:200px!important;min-height:200px;max-height:200px}.home .hero-slide-title{font-size:12px;line-height:20px}}
@media(prefers-reduced-motion:reduce){.home .hero-controls button,.home .hero .wp-element-button{transition:none}.home .hero .wp-element-button:hover,.home .hero-controls button:hover{transform:none}}

/* Shared pale blue panel, as preferred by the owner. */
.home .hero{background:#edf3f7;border:1px solid #dce7ee;border-radius:32px;padding:48px 40px!important;gap:32px!important}
.home .hero-carousel{background:#edf3f7;padding:24px 8px 16px;border-radius:24px}
@media(max-width:1000px) and (min-width:782px){.home .hero{padding:32px 24px!important;gap:24px!important}.home .hero-carousel{padding:24px 0 16px}}
@media(max-width:781px){.home .hero{padding:32px 24px!important;border-radius:24px;gap:24px!important}.home .hero-carousel{padding:16px 0 0}}

/* Source photos are 280 × 160: keep them at their native CSS size. */
.home .hero-slides{height:280px}
.home .hero-slide img{width:280px!important;max-width:100%;height:160px!important;min-height:160px!important;max-height:160px!important;object-fit:contain;align-self:center;margin:24px auto 16px;transform:none!important}
.home .hero-image:hover img{transform:none!important}
@media(max-width:781px){.home .hero-slides{height:264px}.home .hero-slide img{margin:16px auto 8px}}

/* Keep multiply compositing against the panel even while slide opacity animates. */
.home .hero-slide{background:#edf3f7;isolation:isolate}

/* Balance the low-resolution product photos with the text and surrounding space. */
.home .hero{padding:40px 32px!important;gap:32px!important}
.home .hero>.wp-block-column:first-child{flex-basis:56%!important}
.home .hero>.wp-block-column:last-child{flex-basis:44%!important}
.home .hero h1{font-size:44px;line-height:1.14;letter-spacing:-1.5px;margin:24px 0}
.home .hero-carousel{padding:16px 0}
.home .hero-slides{height:280px}
.home .hero-slide img{width:320px!important;height:183px!important;min-height:183px!important;max-height:183px!important;margin:16px auto 8px}
.home .hero-slide-title{margin-top:8px;padding-top:12px;min-height:56px}
.home .hero-controls{margin-top:8px}
@media(max-width:1000px) and (min-width:782px){.home .hero{padding:32px 24px!important;gap:24px!important}.home .hero h1{font-size:36px}}
@media(max-width:781px){.home .hero{padding:32px 24px!important;gap:16px!important}.home .hero>.wp-block-column{flex-basis:100%!important}.home .hero h1{font-size:36px;line-height:40px;letter-spacing:-1px}.home .hero-carousel{padding:8px 0 0}.home .hero-slide img{width:280px!important;height:160px!important;min-height:160px!important;max-height:160px!important;margin:8px auto}.home .hero-slides{height:240px}}
