/* Lake Lanier Eye Care — site CSS (replaces inline styles / inline <style> blocks).
   Image paths are relative to this file: wp-content/mu-plugins/llec-assets/ */

/* Homepage hero: right-sized WebP background (overrides the Elementor background-image). */
body .elementor-9 .elementor-element.elementor-element-db3f70a:not(.elementor-motion-effects-element-type-background){background-image:url("../../uploads/2026/09/PXL_20260901_181456901-hero-desktop-1280.webp")}
@media (max-width:767px){
	body .elementor-9 .elementor-element.elementor-element-db3f70a:not(.elementor-motion-effects-element-type-background){background-image:url("../../uploads/2026/09/PXL_20260901_181456901-hero-mobile-720.webp")}
}

/* Testimonial stars: hand-written <i class="fa fa-star"> drawn with a Unicode glyph
   (Font Awesome is no longer loaded; Elementor renders icons as SVG). */
.ratingstars i.fa-star{font-style:normal;font-weight:400;line-height:1}
.ratingstars i.fa-star::before{content:"\2605";font-family:Arial,"Segoe UI Symbol","Apple Symbols",sans-serif}

/* Text colours that used to be inline style="" attributes in Elementor text. */
.llec-teal{color:#3fb5b8}
.llec-white{color:#fff}

/* Video widget poster image (was an inline background-image style on .elementor-custom-embed-image-overlay). */
.llec-video-overlay{background-image:url("../../uploads/2026/08/849473982_img_0795.webp")}

/* WordPress core: contain-intrinsic-size for sizes="auto" images (was an inline <style>). */
img:is([sizes=auto i],[sizes^="auto," i]){contain-intrinsic-size:3000px 1500px}

/* Former Customizer "Additional CSS" (was an inline <style id="wp-custom-css">). */
.hover-based .elementor-nav-menu li a:hover{color:#32A0A3 !important}
.hover-image .elementor-image-box-img img{transition:filter .4s}
.hover-image:hover .elementor-image-box-img img{filter:brightness(0) invert(1)}

/* Home page service cards (Elementor image-box, image above text): they sit in row containers and shrink to their
   content width, which left them hugging the left edge once they wrap full-width on small screens. Centre the card
   itself; on wide screens the card already fills its column, so nothing changes there. Home page only (.elementor-9). */
.elementor-9 .e-con > .elementor-widget-image-box.elementor-position-top{margin-left:auto;margin-right:auto}
