/* 2027 passes page, generated by passes-2027/build_passes_2027.py */
/* ===== Hero scrim, page-anchored — see hero_css() ===== */
body.page-id-53866 #lpen-ps-hero::before {
background-image: linear-gradient(90deg, rgba(1,32,50,0.85) calc(50% + 40px),
rgba(1,32,50,0.813) calc(50% + 72px),
rgba(1,32,50,0.717) calc(50% + 105px),
rgba(1,32,50,0.581) calc(50% + 138px),
rgba(1,32,50,0.425) calc(50% + 170px),
rgba(1,32,50,0.269) calc(50% + 202px),
rgba(1,32,50,0.133) calc(50% + 235px),
rgba(1,32,50,0.037) calc(50% + 268px),
rgba(1,32,50,0) calc(50% + 300px)) !important;
}
@media (max-width: 767px) {
body.page-id-53866 #lpen-ps-hero { background-position: 72% center !important; }
}
@media (max-width: 1023px) {
body.page-id-53866 #lpen-ps-hero::before {
background-image: linear-gradient(90deg,
rgba(1,32,50,0.94) 0%, rgba(1,32,50,0.90) 100%) !important;
}
}
/* ===== WooCommerce add-to-cart, page-anchored — see cart_icon_css() ===== */
body.page-id-53866 .elementor-widget-wc-add-to-cart .elementor-button-icon i {
font-size: 0; width: 18px; height: 18px; display: inline-block;
vertical-align: -3px; background-color: currentColor;
-webkit-mask-image: url("data:image/svg+xml,"); mask-image: url("data:image/svg+xml,");
-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
-webkit-mask-position: center; mask-position: center;
-webkit-mask-size: contain; mask-size: contain;
}
body.page-id-53866 .elementor-widget-wc-add-to-cart a.elementor-button { text-decoration: none; }
/* ⚠️ The kit makes THIS button jump too, and no builder had noticed.
§18q's hover-jump fix was applied to `button` widgets only — here and on
the ten other pages it has been reported on — but WooCommerce's
add-to-cart renders `class="... elementor-button ..."`, so
`.elementor-kit-8 .elementor-button:hover { border-width: 2px;
border-style: solid }` applies to it as well. Measured on the live page
2026-09-11: 148.80x50 normal, 152.80x54 hovered. Four pixels each way, on
the eleven most important controls on the page.
It is fixed HERE rather than on the widget because `border_border` and
`button_hover_border_color` are Button controls and nobody has confirmed
`wc-add-to-cart` has them — a guessed control name stores silently and
does nothing (§18p). A stylesheet rule cannot be wrong about that.
Specificity (0,3,2) beats both the kit's (0,2,0) and Elementor's own
per-element (0,3,0), so no !important is needed. */
body.page-id-53866 .elementor-widget-wc-add-to-cart a.elementor-button {
border: 2px solid #FFD814;
}
body.page-id-53866 .elementor-widget-wc-add-to-cart a.elementor-button:hover,
body.page-id-53866 .elementor-widget-wc-add-to-cart a.elementor-button:focus {
border-color: #F0B800;
}
/* ============ GENERATED ICONS ============ */
/* Tabler 3.46.0 — 5 glyphs, generated by build_passes.py */
.lpen-i--calendar-event{-webkit-mask-image:url("data:image/svg+xml,");mask-image:url("data:image/svg+xml,")}
.lpen-i--chevron-right{-webkit-mask-image:url("data:image/svg+xml,");mask-image:url("data:image/svg+xml,")}
.lpen-i--coin{-webkit-mask-image:url("data:image/svg+xml,");mask-image:url("data:image/svg+xml,")}
.lpen-i--player-play{-webkit-mask-image:url("data:image/svg+xml,");mask-image:url("data:image/svg+xml,")}
.lpen-i--star{-webkit-mask-image:url("data:image/svg+xml,");mask-image:url("data:image/svg+xml,")}