/*
Theme Name: Lanair Divi Child
Theme URI: https://lanairdev.fig1.com
Description: Custom child theme for Lanair Products - Waste Oil Heaters
Author: Fig1
Author URI: https://fig1.com
Template: Divi
Version: 3.4.9
*/

/* ============================================
   LANAIR DESIGN SYSTEM
   Primary Red: #CC2229
   Bright Red: #ED1C24
   Dark Red: #4A0606
   Secondary Yellow: #FFE92E
   Black: #000000
   Light Black: #1A1A1A
   Dark Gray: #4A4A4A
   Background Gray: #F4F4F4
   White: #FFFFFF
   Font: Franklin Gothic (Adobe Typekit kit: sia8knl)
   ============================================ */

/* ---- GLOBAL: Franklin Gothic everywhere ---- */
body,
input, textarea, select, button,
.et_pb_module,
.et_pb_text,
.et_pb_button,
#main-content,
#main-footer,
.woocommerce {
    font-family: "franklin-gothic-atf", "Franklin Gothic", "Franklin Gothic Medium", "ITC Franklin Gothic", Arial, sans-serif;
}

body {
    color: #4A4A4A;
    background-color: #F4F4F4;
}

h1, h2, h3, h4, h5, h6,
.et_pb_module h1, .et_pb_module h2, .et_pb_module h3,
.et_pb_module h4, .et_pb_module h5, .et_pb_module h6 {
    font-family: "franklin-gothic-atf", "Franklin Gothic", "Franklin Gothic Medium", "ITC Franklin Gothic", Arial, sans-serif;
    color: #000000;
    font-weight: 700;
}

a {
    color: #CC2229;
}

a:hover {
    color: #4A0606;
}

/* ---- BUTTONS ----
   Divi modules now set their own colors via JSON attrs. Only style WooCommerce
   buttons (which don't go through the Divi module pipeline). */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
    background-color: #CC2229;
    color: #FFFFFF;
    border: 2px solid #CC2229;
    border-radius: 4px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: all 0.3s ease;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
    background-color: #4A0606;
    border-color: #4A0606;
    color: #FFFFFF;
}

.woocommerce a.button.alt {
    background-color: #FFD200;
    border-color: #FFD200;
    color: #1A1A1A;
}

.woocommerce a.button.alt:hover {
    background-color: #e6bd00;
    border-color: #e6bd00;
    color: #1A1A1A;
}

/* ---- DIVI-BUILT PAGES: hide title + sidebar, full width content ---- */
body.lanair-divi-page .entry-title.main_title,
body.lanair-divi-page h1.main_title { display: none !important; }
body.lanair-divi-page #sidebar { display: none !important; }
body.lanair-divi-page #left-area { width: 100% !important; max-width: 100% !important; padding: 0 !important; float: none !important; }
body.lanair-divi-page #content-area { display: block !important; }
body.lanair-divi-page #content-area .container,
body.lanair-divi-page #main-content > .container { width: 100% !important; max-width: 100% !important; padding: 0 !important; }
body.lanair-divi-page .entry-content { padding-top: 0 !important; }
body.lanair-divi-page #main-content article { padding: 0 !important; }

/* ---- CUSTOM TOP BAR (Promo + Phone, injected via wp_body_open) ---- */
.lanair-tb-container {
    width: 95%;
    max-width: 1280px;
    margin: 0 auto;
}

/* Align Divi native header container to the site 1280 grid.
   Divi hardcodes .container width at 80% — not exposed as a setting. */
#main-header .container {
    width: 95%;
    max-width: 1280px;
}

/* Desktop nav dropdowns: Divi hard-codes 240px (ul) / 200px (links) with no
   theme setting, which wraps "Chamber/Burner Replacement Kits" etc. onto
   two lines. Widen so every menu label fits on one line (Jeremy 7/15). */
#top-menu li ul.sub-menu { width: 330px; }
#top-menu li li a { width: 290px; }

/* Sale badge — product cards (PLP + part finder). Anchors are the positioned
   parents so the badge pins to the image corner. */
.lanair-card-link,
.lanair-pf-card-image {
    position: relative;
}
.lanair-sale-badge {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 2;
    background: #CC2229;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
    line-height: 1;
    padding: 6px 10px;
    border-radius: 3px;
}

/* Phone bar is fixed above Divi's #main-header.
   Divi's #main-header is position:fixed top:0, so we offset it down
   by 43px (phone bar height) so they stack. */
#lanair-phone-bar {
    background: #FFFFFF;
    border-bottom: 1px solid #e5e5e5;
    padding: 8px 0;
    font-size: 12px;
    font-weight: 700;
    color: #1A1A1A;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100000;
    height: 43px;
    box-sizing: border-box;
}

/* Push Divi's fixed main header below the phone bar (43px).
   Reserve space at top of page-container for: phone bar (43) + main nav (~80) = 123px. */
body.lanair-has-top-bar #main-header {
    top: 43px !important;
}
body.lanair-has-top-bar #page-container {
    padding-top: 123px !important;
}

/* WP admin bar adjustment.
   Fixed bars shift down by the admin-bar height; page-container padding
   stays at the natural stack height because WP already adds the matching
   html { margin-top } — adding it again here would double-pad. */
body.admin-bar.lanair-has-top-bar #lanair-phone-bar { top: 32px; }
body.admin-bar.lanair-has-top-bar #main-header { top: 75px !important; }
body.admin-bar.lanair-has-top-bar #page-container { padding-top: 123px !important; }
@media (max-width: 782px) {
    body.admin-bar.lanair-has-top-bar #lanair-phone-bar { top: 46px; }
    body.admin-bar.lanair-has-top-bar #main-header { top: 89px !important; }
    body.admin-bar.lanair-has-top-bar #page-container { padding-top: 123px !important; }
}
.lanair-phone-bar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}
.lanair-phone-bar-left,
.lanair-phone-bar-right {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.lanair-phone-bar-left a,
.lanair-phone-bar-right a {
    color: #CC2229;
    text-decoration: none;
    font-weight: 700;
}
.lanair-phone-bar-right a {
    color: #1A1A1A;
}
.lanair-phone-bar-right a:hover,
.lanair-phone-bar-left a:hover {
    color: #4A0606;
}
.lanair-phone-bar-sep {
    color: #999;
}
.lanair-cart-link {
    display: inline-flex;
    align-items: center;
}

/* Push the Divi header below the custom top bars */
body.lanair-has-top-bar #et-top-navigation,
body.lanair-has-top-bar #main-header {
    /* Divi header sits naturally below since top bars are in normal flow */
}

@media (max-width: 980px) {
    /* Phone bar info is duplicated in the hamburger menu — hide it on mobile
       to reclaim ~100px of viewport */
    #lanair-phone-bar { display: none !important; }

    /* Promo bar removed and phone bar hidden on mobile — header anchors to top,
       page padding is just the nav height */
    body.lanair-has-top-bar #main-header { top: 0 !important; }
    body.lanair-has-top-bar #page-container { padding-top: 80px !important; }
    body.admin-bar.lanair-has-top-bar #main-header { top: 46px !important; }
    body.admin-bar.lanair-has-top-bar #page-container { padding-top: 80px !important; }
}

/* ---- HEADER ---- */
#main-header {
    background-color: #FFFFFF;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

#main-header .et-fixed-header {
    background-color: #FFFFFF !important;
}

#et-top-navigation nav > ul > li > a {
    color: #000000 !important;
    font-family: "franklin-gothic-atf", "Franklin Gothic", Arial, sans-serif;
    font-weight: 600;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

#et-top-navigation nav > ul > li > a:hover,
#et-top-navigation nav > ul > li.current-menu-item > a {
    color: #CC2229 !important;
}

/* Dropdown menus */
#et-top-navigation nav > ul > li > ul {
    background-color: #FFFFFF;
    border-top: 3px solid #CC2229;
}

#et-top-navigation nav > ul > li > ul > li > a {
    color: #4A4A4A !important;
    font-size: 13px;
}

#et-top-navigation nav > ul > li > ul > li > a:hover {
    color: #CC2229 !important;
    background-color: #F4F4F4;
}

/* ---- CUSTOM FOOTER (injected via wp_footer) ---- */
/* Hide native Divi footer when our custom one is present */
#main-footer { display: none !important; }
#footer-bottom { display: none !important; }

#lanair-footer {
    background: #FFFFFF;
    color: #1A1A1A;
    font-family: "franklin-gothic-atf", "Franklin Gothic", Arial, sans-serif;
}
.lanair-footer-main {
    padding: 60px 0 40px;
    background: #FFFFFF;
}
.lanair-footer-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 2fr 2fr;
    gap: 40px;
    align-items: start;
}
.lanair-footer-col h4 {
    color: #CC2229;
    font-size: 14px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 0 16px;
}
.lanair-footer-col p,
.lanair-footer-col ul {
    color: #1A1A1A;
    font-size: 14px;
    line-height: 1.8;
    margin: 0 0 16px;
}
.lanair-footer-col ul {
    list-style: none;
    padding: 0;
    line-height: 2;
}
.lanair-footer-col ul li { margin: 0; }
.lanair-footer-col a {
    color: #1A1A1A;
    text-decoration: none;
    transition: color 0.2s;
}
.lanair-footer-col a:hover { color: #CC2229; }
.lanair-footer-col strong { color: #1A1A1A; font-weight: 700; }
.lanair-footer-col .lanair-footer-contact a { color: #1A1A1A; }

.lanair-footer-logo {
    max-width: 180px;
    height: auto;
    margin-bottom: 20px;
    display: block;
}
.lanair-footer-newsletter-pitch { color: #6A6A6A; }

/* Center column: logo + follow us, centered */
.lanair-footer-col-center {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}
.lanair-footer-col-center .lanair-footer-logo {
    max-width: 200px;
    margin: 0 auto 16px;
}
.lanair-footer-col-center .lanair-footer-follow-label {
    margin: 4px 0 8px;
    font-weight: 700;
    color: #1A1A1A;
}
.lanair-footer-col-center .lanair-footer-social { margin-top: 4px; }

/* Newsletter signup form in footer 4th column */
.lanair-footer-newsletter { margin: 12px 0 16px; }
.lanair-newsletter-row {
    display: flex;
    background: #F2F2F2;
    border: 1px solid #D8D8D8;
    padding: 4px;
    border-radius: 2px;
}
.lanair-newsletter-row input[type="email"] {
    flex: 1;
    border: 0;
    background: transparent;
    color: #1A1A1A;
    padding: 8px 12px;
    font-size: 14px;
    outline: none;
}
.lanair-newsletter-row input[type="email"]::placeholder { color: #888; }
.lanair-newsletter-row button {
    background: #CC2229;
    color: #fff;
    border: 0;
    padding: 8px 18px;
    font-weight: 800;
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: .5px;
    cursor: pointer;
    border-radius: 2px;
}
.lanair-newsletter-row button:hover { background: #a91a20; }
.lanair-footer-newsletter { position: relative; }
.lanair-newsletter-msg { color: #2e7d32; font-size: 13px; margin: 8px 0 0; }
.lanair-newsletter-msg.is-error { color: #C8232B; }

/* Mobile audit: wireframes center hero content on phone (Videos page hero is
   a raw-HTML code module, so no Divi module option exists — CSS is the only
   path here; Divi-built heroes were centered via phone-breakpoint attrs). */
@media (max-width: 767px) {
    .lvg-hero-inner { text-align: center; }
    .lvg-hero-inner .lvg-easy-diy { margin-left: auto; margin-right: auto; }
}
.lanair-footer-follow-label { color: #1A1A1A; font-size: 13px; margin: 8px 0 8px; }

/* Footer payment cards row */
.lanair-footer-pay {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.lanair-pay-label {
    color: #888;
    font-size: 13px;
    margin-right: 4px;
}
.lanair-footer-pay img {
    height: 22px;
    width: auto;
    opacity: .8;
}

/* UOMA member badge in USA banner top strip */
.lanair-usa-banner .uoma-member {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 0 16px;
    border-left: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
}
.lanair-usa-banner .uoma-member .uoma-label {
    font-size: 11px;
    color: #6A6A6A;
    text-transform: uppercase;
    letter-spacing: .5px;
    font-weight: 700;
}
.lanair-usa-banner .uoma-member .uoma-logo {
    height: 38px;
    width: auto;
    filter: invert(1);
}
@media (max-width: 980px) {
    .lanair-usa-banner .uoma-member {
        border-left: 0;
        border-right: 0;
        padding: 8px 0;
    }
}
.lanair-footer-cta {
    display: inline-block;
    background: #CC2229;
    color: #FFFFFF !important;
    padding: 12px 28px;
    text-decoration: none;
    border-radius: 4px;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: 1px;
    transition: background 0.2s;
}
.lanair-footer-cta:hover {
    background: #4A0606;
    color: #FFFFFF !important;
}
.lanair-footer-social {
    display: flex;
    gap: 16px;
    margin-top: 12px;
    justify-content: center;
}
.lanair-footer-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s, opacity 0.2s;
    opacity: .9;
}
.lanair-footer-social a:hover {
    transform: translateY(-2px);
    opacity: 1;
}
.lanair-footer-social a img {
    width: 26px;
    height: 26px;
    object-fit: contain;
    filter: brightness(0);
}

.lanair-footer-bottom {
    background: #F5F5F5;
    border-top: 1px solid #E5E5E5;
    padding: 18px 0;
    font-size: 12px;
    color: #6A6A6A;
}
.lanair-footer-bottom-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.lanair-footer-bottom a {
    color: #1A1A1A;
    text-decoration: none;
    margin: 0 6px;
}
.lanair-footer-bottom a:hover { color: #CC2229; }
.lanair-pay-label { color: #6A6A6A; font-size: 13px; margin-right: 4px; }
.lanair-footer-pay .lanair-pay-affirm { height: 18px; width: auto; margin-right: 4px; opacity: 1; }

/* Category pillar pages — prevent any horizontal page scroll (carousel scrolls
   internally; this guards the body from accidental overflow). */
body.lanair-cat-hero-page { overflow-x: hidden; }

/* Hero — angled red divider over the workshop photo column. This is the ONLY
   part that can't be done in Divi: Divi 5 css.freeForm silently fails to emit
   clip-path on a column (verified computed clip-path:none), and the red band is
   a ::before pseudo-element. Column widths/min-height/padding/heater size and
   all text are set in the Divi module itself. Page-scoped, no global selectors. */
.lanair-cat-hero-page .et_pb_section:first-of-type .et_pb_column:last-child {
    position: relative;
    clip-path: polygon(20% 0, 100% 0, 100% 100%, 0 100%);
    -webkit-clip-path: polygon(20% 0, 100% 0, 100% 100%, 0 100%);
}
.lanair-cat-hero-page .et_pb_section:first-of-type .et_pb_column:last-child::before {
    content: "";
    position: absolute;
    inset: 0;
    background: #CC2229;
    clip-path: polygon(20% 0, 28% 0, 8% 100%, 0 100%);
    -webkit-clip-path: polygon(20% 0, 28% 0, 8% 100%, 0 100%);
    z-index: 1;
}

/* (Charles 7/14, via theme editor) same stripe pinned to .et_pb_column_5 */
.lanair-cat-hero-page .et_pb_section:first-of-type .et_pb_column_5:last-child::before {
    content: "";
    position: absolute;
    inset: 0;
    background: #CC2229;
    clip-path: polygon(20% 0, 28% 0, 8% 100%, 0 100%);
    -webkit-clip-path: polygon(20% 0, 28% 0, 8% 100%, 0 100%);
    z-index: 1;
}

@media (max-width: 980px) {
    .lanair-cat-hero-page .et_pb_section:first-of-type .et_pb_column:last-child {
        clip-path: none;
        -webkit-clip-path: none;
    }
    .lanair-cat-hero-page .et_pb_section:first-of-type .et_pb_column:last-child::before { display: none; }
}
/* About hero — per mockup: white wedge fills the TOP-RIGHT corner with a thin
   ~45-degree red stripe along its edge, and the heater sits ON TOP straddling
   the stripe (legs over the black). So no clip on the column (it would cut the
   heater) — the wedge and stripe are painted as pseudo-layers behind the image. */
.page-id-18541 .et_pb_section:first-of-type .et_pb_column:last-child {
    clip-path: none;
    -webkit-clip-path: none;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.page-id-18541 .et_pb_section:first-of-type .et_pb_column:last-child::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(rgba(255, 255, 255, 255), rgba(255, 255, 255, 255)),
        url("https://lanairdev.fig1.com/wp-content/uploads/2026/07/About-Us-Lanair-Header-image.png") center / cover no-repeat;
    clip-path: polygon(81% 0, 100% 0, 100% 100%, 18% 100%);
    -webkit-clip-path: polygon(81% 0, 100% 0, 100% 100%, 18% 100%);
    z-index: 0;
}
.page-id-18541 .et_pb_section:first-of-type .et_pb_column:last-child::after {
    content: "";
    position: absolute;
    inset: 0;
    background: #CC2229;
    clip-path: polygon(69% 0, 81% 0, 18% 100%, 6% 100%);
    -webkit-clip-path: polygon(69% 0, 81% 0, 18% 100%, 6% 100%);
    z-index: 1;
}
@media (max-width: 980px) {
    .page-id-18541 .et_pb_section:first-of-type .et_pb_column:last-child::before,
    .page-id-18541 .et_pb_section:first-of-type .et_pb_column:last-child::after { display: none; }
}

/* Parts Included — kit/package contents on single product pages
   (our own template markup rendered from functions.php, not a Divi module) */
.lanair-parts-included {
    max-width: 1080px;
    margin: 40px auto 20px;
    padding: 0 20px;
}
.lanair-pi-title {
    font-size: 24px;
    font-weight: 900;
    text-transform: uppercase;
    color: #1A1A1A;
    margin: 0 0 18px;
}
.lanair-pi-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 12px;
}
.lanair-pi-item {
    display: flex;
    align-items: center;
    gap: 14px;
    background: #FFFFFF;
    border: 1px solid #E6E6E6;
    border-radius: 4px;
    padding: 12px 16px;
    background-image: url(/wp-content/uploads/lanair-design/flame-badge.png);
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 14px 14px;
}
.lanair-pi-img img {
    width: 52px;
    height: 52px;
    object-fit: contain;
    display: block;
}
.lanair-pi-text { font-size: 14px; font-weight: 600; color: #1A1A1A; padding-right: 24px; }
.lanair-pi-text a { color: #1A1A1A; text-decoration: none; }
.lanair-pi-text a:hover { color: #CC2229; }
.lanair-pi-qty { color: #CC2229; font-weight: 800; margin-left: 6px; }

/* Support CTA — red headset icon on the left of the text column */
.lanair-support-left {
    background-image: url(/wp-content/uploads/lanair-design/support-headset.svg);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 88px auto;
    padding-left: 128px;
}
/* Support CTA — gold divider before the feature list */
.lanair-support-features {
    border-left: 1px solid rgba(255, 210, 0, 0.35);
    padding-left: 44px;
}
@media (max-width: 980px) {
    .lanair-support-left {
        background-position: left top;
        background-size: 60px auto;
        padding-left: 0;
        padding-top: 78px;
    }
    .lanair-support-features {
        border-left: 0;
        padding-left: 0;
        padding-top: 32px;
    }
}

/* Pillar hero badges — red flame overlaying the right end of the yellow flag,
   oversized and half-outside it (per mockup). A Divi module can't attach an
   overflowing icon to a content-width blurb, so this is a ::after on the badge. */
.lanair-cat-hero-page .et_pb_section:first-of-type .et_pb_blurb {
    position: relative;
    overflow: visible;
}
.lanair-cat-hero-page .et_pb_section:first-of-type .et_pb_blurb::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -26px;
    transform: translateY(-50%);
    width: 54px;
    height: 66px;
    background: url(/wp-content/uploads/lanair-design/flame-badge.png) no-repeat center / contain;
}

@media (max-width: 980px) {
    .lanair-footer-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
}
@media (max-width: 600px) {
    /* Products + Resources side by side (Jeremy 7/15); logo/social and
       newsletter go full-width underneath. Link lists sit slightly inset
       from their headings. */
    .lanair-footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 28px 20px;
    }
    .lanair-footer-grid > .lanair-footer-col:nth-child(-n+2) ul {
        padding-left: 14px;
    }
    .lanair-footer-col-center,
    .lanair-footer-grid > .lanair-footer-col:last-child {
        grid-column: 1 / -1;
    }
    .lanair-footer-bottom-inner {
        flex-direction: column;
        text-align: center;
        gap: 8px;
    }
}

/* ---- LEGACY DIVI FOOTER STYLES (kept for fallback only) ---- */
.lanair-legacy-footer {
    background-color: #1A1A1A;
}

#main-footer .footer-widget {
    color: #CCCCCC;
}

#main-footer .footer-widget h4 {
    color: #FFFFFF;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 16px;
    letter-spacing: 0.5px;
    margin-bottom: 15px;
}

#main-footer .footer-widget a {
    color: #CCCCCC;
}

#main-footer .footer-widget a:hover {
    color: #FFE92E;
}

#footer-bottom {
    background-color: #111111;
    color: #999;
    font-size: 13px;
}

#footer-bottom a {
    color: #999;
}

#footer-bottom a:hover {
    color: #FFE92E;
}

/* ---- WOOCOMMERCE PRODUCT GRID ---- */
.woocommerce ul.products li.product {
    background: #FFFFFF;
    border-radius: 8px;
    padding: 15px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.woocommerce ul.products li.product:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-family: "franklin-gothic-atf", "Franklin Gothic", Arial, sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: #000000;
    padding-top: 10px;
}

.woocommerce ul.products li.product .price {
    color: #CC2229 !important;
    font-weight: 700;
    font-size: 16px;
}

.woocommerce ul.products li.product .price ins {
    color: #CC2229;
    text-decoration: none;
}

.woocommerce ul.products li.product a img {
    border-radius: 6px;
    height: 280px;
    object-fit: contain;
    background: #FFFFFF;
}

/* ---- WOOCOMMERCE SINGLE PRODUCT ---- */
.woocommerce div.product .product_title {
    font-size: 28px;
    font-weight: 700;
    color: #000000;
}

.woocommerce div.product p.price {
    color: #CC2229 !important;
    font-size: 24px;
    font-weight: 700;
}

.woocommerce div.product .woocommerce-product-details__short-description {
    color: #4A4A4A;
    font-size: 15px;
    line-height: 1.6;
}

/* Product tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs li {
    background-color: #F4F4F4;
    border-radius: 4px 4px 0 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
    background-color: #FFFFFF;
    border-bottom-color: #FFFFFF;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    color: #4A4A4A;
    font-weight: 600;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: #CC2229;
}

/* ---- WOOCOMMERCE CART & CHECKOUT ---- */
.woocommerce table.shop_table {
    border-radius: 8px;
    overflow: hidden;
}

.woocommerce table.shop_table th {
    background-color: #1A1A1A;
    color: #FFFFFF;
    font-weight: 600;
}

.woocommerce .cart-collaterals .cart_totals {
    background: #FFFFFF;
    padding: 20px;
    border-radius: 8px;
}

.woocommerce-checkout #payment {
    background: #FFFFFF;
    border-radius: 8px;
}

/* ==========================================================================
   WC BLOCKS CART + CHECKOUT — container max-width, padding, typography
   ========================================================================== */
.wc-block-checkout,
.wc-block-cart {
    font-family: "franklin-gothic-atf", "Franklin Gothic", Arial, sans-serif;
}

/* Hide Divi default sidebar on WC pages */
.woocommerce-cart #sidebar,
.woocommerce-checkout #sidebar,
.woocommerce-account #sidebar,
.woocommerce-page #sidebar {
    display: none !important;
}

/* Centered container with proper horizontal padding */
body.woocommerce-cart.et_full_width_page #page-container #left-area,
body.woocommerce-cart #page-container #main-content #left-area,
body.woocommerce-checkout.et_full_width_page #page-container #left-area,
body.woocommerce-checkout #page-container #main-content #left-area,
body.woocommerce-account.et_full_width_page #page-container #left-area,
body.woocommerce-account #page-container #main-content #left-area {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 40px 30px 60px !important;
    width: 100% !important;
    float: none !important;
}

/* ---- CART ---- */
.wc-block-cart .wc-block-cart-items th {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #666;
    font-weight: 700;
    border-bottom: 2px solid #e0e0e0;
    padding-bottom: 12px;
}
.wc-block-cart .wc-block-cart-items thead th:first-child {
    padding-left: 16px;
}
.wc-block-cart .wc-block-cart-items .wc-block-cart-items__row {
    border-bottom: 1px solid #f0f0f0;
    padding: 20px 0;
}
.wc-block-cart .wc-block-cart-items .wc-block-cart-items__row:last-child {
    border-bottom: 1px solid #e0e0e0;
}
.wc-block-cart .wc-block-cart-items .wc-block-components-product-name,
.wc-block-cart .wc-block-cart-items .wc-block-components-product-name a,
.wc-block-cart .wc-block-cart-items a.wc-block-components-product-name {
    font-weight: 700 !important;
    color: #1a1a1a !important;
    text-decoration: none !important;
    font-size: 16px !important;
}
.wc-block-cart .wc-block-cart-items .wc-block-components-product-name:hover,
.wc-block-cart .wc-block-cart-items .wc-block-components-product-name a:hover,
.wc-block-cart .wc-block-cart-items a.wc-block-components-product-name:hover {
    color: #CC2229 !important;
}
.wc-block-components-quantity-selector {
    border: 1px solid #d0d0d0 !important;
    border-radius: 6px !important;
    overflow: hidden;
}
.wc-block-components-quantity-selector input {
    font-weight: 700;
}
.wc-block-cart .wc-block-cart__sidebar {
    background: #fafafa;
    border-radius: 8px;
    padding: 24px;
    border: 1px solid #e8e8e8;
}
.wc-block-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper {
    border-color: #e8e8e8;
}
.wc-block-cart .wc-block-cart__submit-button,
.wc-block-cart .wc-block-components-checkout-step .wc-block-components-button,
.wc-block-cart .wp-block-woocommerce-proceed-to-checkout-block a,
.wc-block-cart .wc-block-cart__submit-container a {
    background-color: #CC2229 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 4px !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    padding: 14px 24px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    transition: background-color 0.2s ease !important;
}
.wc-block-cart .wc-block-cart__submit-button:hover,
.wc-block-cart .wp-block-woocommerce-proceed-to-checkout-block a:hover,
.wc-block-cart .wc-block-cart__submit-container a:hover {
    background-color: #4A0606 !important;
}
.wc-block-cart .wc-block-cart__empty-cart__title {
    font-size: 24px;
    font-weight: 700;
    color: #1a1a1a;
}

/* ---- CHECKOUT ---- */
.wc-block-checkout .wp-block-woocommerce-checkout-fields-block {
    padding-right: 40px;
}
.wc-block-checkout .wc-block-components-checkout-step__heading,
.wc-block-checkout .wc-block-components-checkout-step__title {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    margin-bottom: 16px !important;
    padding-bottom: 0 !important;
    border-bottom: none !important;
}
.wc-block-checkout .wc-block-components-text-input input,
.wc-block-checkout .wc-block-components-text-input textarea,
.wc-block-checkout .wc-block-components-combobox .components-combobox-control input,
.wc-block-checkout select,
.wc-block-checkout .wc-block-components-country-input select,
.wc-block-checkout .wc-block-components-state-input select {
    border: 1px solid #d0d0d0 !important;
    border-radius: 4px !important;
    padding: 12px 14px !important;
    font-size: 15px !important;
    transition: border-color 0.15s ease !important;
    background: #ffffff !important;
    color: #1a1a1a !important;
}
.wc-block-checkout .wc-block-components-text-input input:focus,
.wc-block-checkout .wc-block-components-text-input textarea:focus,
.wc-block-checkout .wc-block-components-combobox .components-combobox-control input:focus,
.wc-block-checkout select:focus {
    border-color: #CC2229 !important;
    outline: none !important;
    box-shadow: 0 0 0 1px #CC2229 !important;
}
.wc-block-checkout .wc-block-components-text-input label {
    color: #888 !important;
    font-size: 14px !important;
}
.wc-block-checkout .wc-block-components-text-input.is-active label {
    color: #555 !important;
    font-size: 10px !important;
    top: 2px !important;
    line-height: 1.2 !important;
}
.wc-block-checkout .wc-blocks-components-select__container {
    position: relative !important;
}
.wc-block-checkout .wc-blocks-components-select__label {
    font-size: 10px !important;
    top: 2px !important;
    left: 14px !important;
    color: #888 !important;
    pointer-events: none;
    line-height: 1.2 !important;
}
.wc-block-checkout .wc-block-components-country-input .wc-blocks-components-select__select,
.wc-block-checkout .wc-block-components-state-input .wc-blocks-components-select__select,
.wc-block-checkout .wc-blocks-components-select__container .wc-blocks-components-select__select {
    padding-top: 18px !important;
    padding-bottom: 6px !important;
    height: 50px !important;
}
.wc-block-checkout .wc-block-components-checkout-step {
    margin-bottom: 24px !important;
    padding-bottom: 24px !important;
    border-bottom: 1px solid #eee !important;
}
.wc-block-checkout .wc-block-components-checkout-step:last-child {
    border-bottom: none !important;
}
.wc-block-checkout fieldset legend,
.wc-block-checkout fieldset .wc-block-components-checkout-step__heading {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    padding-bottom: 12px !important;
    margin-bottom: 20px !important;
    width: 100%;
}
.wc-block-checkout .wp-block-woocommerce-checkout-order-summary-block {
    background: #fafafa !important;
    border-radius: 10px !important;
    padding: 28px !important;
    border: 1px solid #e8e8e8 !important;
    position: sticky;
    top: 100px;
}
.wc-block-checkout .wp-block-woocommerce-checkout-order-summary-block > .wc-block-components-totals-wrapper:first-child {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
}
.wc-block-checkout .wc-block-components-order-summary-item {
    padding: 16px 0 !important;
    border-bottom: 1px solid #eee !important;
}
.wc-block-checkout .wc-block-components-order-summary-item__image {
    border-radius: 8px !important;
    border: 1px solid #e8e8e8 !important;
    overflow: hidden;
    min-width: 48px !important;
    width: 48px !important;
    height: 48px !important;
    flex-shrink: 0 !important;
}
.wc-block-checkout .wc-block-components-order-summary-item__image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}
.wc-block-checkout .wc-block-components-order-summary-item__description .wc-block-components-product-name,
.wc-block-checkout .wc-block-components-order-summary-item__description .wc-block-components-product-name a,
.wc-block-checkout .wc-block-components-order-summary-item__description a.wc-block-components-product-name {
    font-weight: 700 !important;
    color: #1a1a1a !important;
    font-size: 14px !important;
    text-decoration: none !important;
}

/* Catch-all: every link inside the cart/checkout block should be Lanair red.
   WC blocks fall back to --wp--preset--color--link or browser-default blue. */
.wc-block-cart a:not(.wc-block-components-product-name):not(.wc-block-components-product-name *):not(.wc-block-cart__submit-container a),
.wc-block-checkout a:not(.wc-block-components-product-name):not(.wc-block-components-product-name *):not(.wc-block-components-checkout-place-order-button),
.wc-block-cart-items a:not(.wc-block-components-product-name),
.wc-block-mini-cart a {
    color: #CC2229;
}
.wc-block-cart a:hover,
.wc-block-checkout a:hover,
.wc-block-cart-items a:hover,
.wc-block-mini-cart a:hover {
    color: #4A0606;
}
.wc-block-checkout .wc-block-components-totals-wrapper {
    border-color: #e8e8e8 !important;
}
.wc-block-checkout .wc-block-components-totals-item .wc-block-components-totals-item__label {
    font-size: 14px !important;
    color: #555 !important;
}
.wc-block-checkout .wc-block-components-totals-footer-item {
    border-top: 2px solid #CC2229 !important;
    padding-top: 15px !important;
    margin-top: 15px !important;
}
.wc-block-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
}
.wc-block-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #CC2229 !important;
}
.wc-block-checkout .wc-block-components-checkout-place-order-button,
.wc-block-checkout .wc-block-checkout__actions_row .wc-block-components-button {
    background-color: #CC2229 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 4px !important;
    font-weight: 700 !important;
    font-size: 17px !important;
    padding: 16px 32px !important;
    text-transform: uppercase !important;
    width: 100%;
    transition: background-color 0.2s ease !important;
    letter-spacing: 0.5px !important;
}
.wc-block-checkout .wc-block-components-checkout-place-order-button:hover,
.wc-block-checkout .wc-block-checkout__actions_row .wc-block-components-button:hover {
    background-color: #4A0606 !important;
}
.wc-block-checkout .wc-block-components-checkout-return-to-cart-button,
.wc-block-checkout .wc-block-checkout__actions_row a {
    color: #555 !important;
    text-decoration: none !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}
.wc-block-checkout .wc-block-components-checkout-return-to-cart-button:hover,
.wc-block-checkout .wc-block-checkout__actions_row a:hover {
    color: #CC2229 !important;
}
.wc-block-checkout .wc-block-components-totals-coupon,
.wc-block-cart .wc-block-components-totals-coupon {
    border-color: #e8e8e8 !important;
}

/* ---- MOBILE ---- */
@media (max-width: 781px) {
    body.woocommerce-cart #page-container #left-area,
    body.woocommerce-checkout #page-container #left-area,
    body.woocommerce-account #page-container #left-area {
        padding: 24px 16px 40px !important;
    }
    .wc-block-checkout .wp-block-woocommerce-checkout-fields-block {
        padding-right: 0;
    }
    .wc-block-checkout .wp-block-woocommerce-checkout-order-summary-block {
        position: static;
        margin-top: 24px;
        padding: 20px !important;
    }
}

/* Account page styling */
.woocommerce-MyAccount-navigation ul li a {
    color: #4A4A4A;
    padding: 12px 15px;
    display: block;
    border-bottom: 1px solid #e0e0e0;
}

.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li a:hover {
    color: #CC2229;
    background-color: #F4F4F4;
    border-left: 3px solid #CC2229;
}

/* ---- BREADCRUMBS ---- */
.woocommerce .woocommerce-breadcrumb {
    color: #999;
    font-size: 13px;
    margin-bottom: 20px;
}

.woocommerce .woocommerce-breadcrumb a {
    color: #CC2229;
}

/* ---- CATEGORY PAGES ---- */
.woocommerce .term-description {
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px solid #e0e0e0;
}

/* ---- SEARCH ---- */
.et_pb_search .et_pb_searchform input[type="search"] {
    border: 2px solid #e0e0e0;
    border-radius: 4px;
    padding: 10px 15px;
}

.et_pb_search .et_pb_searchform input[type="search"]:focus {
    border-color: #CC2229;
}

/* ---- PAGINATION ---- */
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
    color: #4A4A4A;
    border-color: #e0e0e0;
}

.woocommerce nav.woocommerce-pagination ul li span.current {
    background-color: #CC2229;
    color: #FFFFFF;
    border-color: #CC2229;
}

.woocommerce nav.woocommerce-pagination ul li a:hover {
    background-color: #F4F4F4;
    color: #CC2229;
}

/* ---- SALE BADGE ---- */
.woocommerce span.onsale {
    background-color: #FFE92E;
    color: #000000;
    font-weight: 700;
    border-radius: 4px;
    padding: 4px 10px;
    min-height: auto;
    line-height: 1.5;
}

/* ---- NOTICES ---- */
.woocommerce-message {
    border-top-color: #CC2229;
}

.woocommerce-message::before {
    color: #CC2229;
}

.woocommerce-info {
    border-top-color: #FFE92E;
}

/* ---- QUANTITY INPUT ---- */
.woocommerce .quantity .qty {
    border: 2px solid #e0e0e0;
    border-radius: 4px;
    width: 60px;
    text-align: center;
}

/* ---- RESPONSIVE ---- */
@media (max-width: 980px) {
    .woocommerce ul.products li.product a img {
        height: 200px;
    }

    .woocommerce div.product .product_title {
        font-size: 22px;
    }
}

@media (max-width: 767px) {
    .woocommerce ul.products li.product a img {
        height: 180px;
    }

    #et-top-navigation nav > ul > li > a {
        font-size: 13px;
    }
}

/* ---- UTILITY CLASSES ---- */
.lanair-bg-red { background-color: #CC2229; }
.lanair-bg-yellow { background-color: #FFE92E; }
.lanair-bg-dark { background-color: #1A1A1A; }
.lanair-bg-gray { background-color: #F4F4F4; }
.lanair-text-red { color: #CC2229; }
.lanair-text-yellow { color: #FFE92E; }

/* ---- Yellow tag blurbs (e.g. "🔥 Built for Reliability") - align emoji with text ---- */
.et_pb_blurb_position_top .et_pb_module_header,
.et_pb_blurb h4.et_pb_module_header {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    line-height: 1;
}

/* ---- Save Money — diagonal edge on photo column (v2.9.0).
   Overlay graphic is a normal image module; photo is the column background. ---- */
.lanair-save-money .lanair-save-photo {
    clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%);
    -webkit-clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%);
}
@media (max-width: 980px) {
    .lanair-save-money .lanair-save-photo {
        clip-path: none;
        -webkit-clip-path: none;
    }
}

/* ---- Divi 5.1.0 bug: blurb icons inconsistent sizing between SVG/PNG ----
   Divi's imageIcon.advanced.width attribute targets different selectors for SVG vs PNG
   icons, causing inconsistency. Constrain all blurb icons consistently. */
.et_pb_blurb .et_pb_main_blurb_image {
    max-width: 100px;
    margin-left: auto;
    margin-right: auto;
}
.et_pb_blurb .et_pb_main_blurb_image img,
.et_pb_blurb .et_pb_main_blurb_image .et_pb_image_wrap {
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
}

/* ---- Blurb position=left flex layout fix ----
   Divi 5.1.0 adds .et_pb_blurb_position_left class but doesn't apply
   flex-direction: row to the content wrapper. Icon size itself is
   controlled via imageIcon.advanced.width Divi attribute. */
.et_pb_blurb.et_pb_blurb_position_left .et_pb_blurb_content {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: 16px;
}
.et_pb_blurb.et_pb_blurb_position_left .et_pb_main_blurb_image {
    flex-shrink: 0;
    margin: 0 !important;
}
.et_pb_blurb.et_pb_blurb_position_left .et_pb_blurb_container {
    flex: 1;
    text-align: left !important;
}
.et_pb_blurb.et_pb_blurb_position_left h4 {
    margin: 0;
    padding: 0;
}

/* ---- FIX: Divi waypoint animation stuck at opacity 0 ----
   Divi adds .et-waypoint to elements to fade them in on scroll, but
   if the JS isn't firing the elements stay invisible. Force opacity 1. */
.et-waypoint,
.et-waypoint.et_pb_animation_top,
.et-waypoint.et_pb_animation_bottom,
.et-waypoint.et_pb_animation_left,
.et-waypoint.et_pb_animation_right,
.et-waypoint.et_pb_animation_fade {
    opacity: 1 !important;
    visibility: visible !important;
}

/* ---- POST CONTENT: float-image fixes for Divi 5 ----
   Divi 5 wraps post-content in flex containers that break float context.
   Restore float behavior so alignleft/alignright images wrap text correctly. */
.et_pb_post_content {
    display: block !important;
}

.et_pb_post_content::after {
    content: "";
    display: block;
    clear: both;
}

.et_pb_post_content img.alignleft,
.et_pb_post_content img.alignright {
    max-width: 50%;
    height: auto;
}

.et_pb_post_content img.alignleft {
    float: left;
    margin: 0 20px 15px 0;
}

.et_pb_post_content img.alignright {
    float: right;
    margin: 0 0 15px 20px;
}

.et_pb_post_content img.aligncenter {
    display: block;
    margin: 15px auto;
}

/* Divi resets ul globally — restore bullets in body content */
.et_pb_post_content ul {
    list-style: disc inside;
    padding-left: 0;
    margin: 0 0 1em;
}

.et_pb_post_content ol {
    list-style: decimal inside;
    padding-left: 0;
    margin: 0 0 1em;
}

.et_pb_post_content ul li,
.et_pb_post_content ol li {
    margin-bottom: 6px;
}



/* TB pages use Divi's default theme-header.php (no custom header layout). */

/* Hide Divi mobile menu placeholder on TB pages (desktop) */
@media (min-width: 981px) {
    body.et-tb-has-template .mobile_nav,
    body.et-tb-has-template .mobile_menu_bar,
    body.et-tb-has-template select.mobile_main_menu {
        display: none !important;
    }
}

/* Override: hide mobile menu artifacts on desktop above the bumped hamburger
   breakpoint (>= 1181px). Between 981px-1180px we deliberately show the
   hamburger because the desktop nav wraps to a second line around 1050px. */
@media (min-width: 1181px) {
    #et_mobile_nav_menu,
    .mobile_nav,
    .mobile_menu_bar,
    select.mobile_main_menu {
        display: none !important;
    }
}

/* TRUSTED IN SHOPS section — add a darker-yellow USA map silhouette as
   a subtle background watermark, matching the homepage mockup. */
body.lanair-divi-page .et_pb_section_2 {
    position: relative;
    overflow: hidden;
}
/* Trusted In Shops section — built with Divi modules:
   USA image is a divi/image with absolute positioning behind text;
   right column has mechanic photo as BG with clip-path custom CSS.
   No CSS hacks needed here. */

/* Industries slider — when the slider title is removed/empty, the title row
   inside .fig1-slider__inner collapses to 0 height. That row hosts the prev/next
   arrows as position:absolute children, so the arrows end up floating ABOVE the
   slider (overlapping the previous section). Force a minimum height on that
   title row when it's empty so the arrows sit inline with the slides. */
body.lanair-divi-page .fig1_image_slider .fig1-slider__inner > div:first-child {
    min-height: 48px;
}

/* HOW IT WORKS — red arrow connectors between the 4 step columns
   (Collect → Heat → Warm → Save). Adds an ::after to columns 1-3
   positioned at icon-center height. Hidden on phone where the row wraps 2x2.
   Targets the row's own .lanair-hiw-row class (set in the row module's
   HTML attributes) — index classes like .et_pb_section_1/.et_pb_column_1_4
   shift whenever sections are added or the row layout changes (7/14). */
body.lanair-divi-page .lanair-hiw-row .et_pb_column { position: relative; }
body.lanair-divi-page .lanair-hiw-row .et_pb_column:not(.et-last-child)::after {
    content: '';
    position: absolute;
    right: -28px;
    top: 38px;
    width: 56px;
    height: 24px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 56 24' fill='none' stroke='%23CC2229' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><line x1='4' y1='12' x2='46' y2='12'/><polyline points='38,4 48,12 38,20'/></svg>");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 5;
    pointer-events: none;
}
@media (max-width: 980px) {
    body.lanair-divi-page .lanair-hiw-row .et_pb_column:not(.et-last-child)::after {
        display: none;
    }
}

/* (Note: BUILT FOR RELIABILITY flame is added by the existing
   `body.home .et_pb_section_0 .et_pb_blurb h4.et_pb_module_header::before`
   rule further down — see "FLAME ICON next to brand badge tags") */

/* Bumped hamburger breakpoint: force mobile menu UI between 981px-1180px so
   the desktop nav never wraps. Divi's compiled CSS hides #et_mobile_nav_menu
   above 980px, so we need higher specificity (body.lanair-divi-page) to win. */
@media (min-width: 981px) and (max-width: 1180px) {
    body.lanair-divi-page #top-menu-nav,
    body.lanair-divi-page #et_top_search,
    body.lanair-divi-page #et-secondary-nav,
    body.lanair-divi-page #et-top-navigation > nav {
        display: none;
    }
    body.lanair-divi-page #et_mobile_nav_menu,
    body.lanair-divi-page #et_mobile_nav_menu .mobile_nav,
    body.lanair-divi-page #et_mobile_nav_menu .mobile_menu_bar {
        display: block;
    }
    /* Keep Divi's mobile menu width in sync with the rest of the header */
    body.lanair-divi-page #et_mobile_nav_menu {
        text-align: right;
    }
    /* Logo column needs to not push the hamburger off-screen */
    body.lanair-divi-page #et-top-navigation {
        padding-left: 0 !important;
    }
}


/* ============================================
   v1.5.9 — Brand polish:
   - Red diagonal slash accent on dark hero sections
   - Flame icon next to brand badge tags
   - MADE IN USA banner above footer
   - Headset visualization on support blocks
   ============================================ */

/* RED DIAGONAL SLASH on hero sections
   Selectors target dark hero sections by body class context */
body.tax-product_cat.term-heaters .et_pb_section_0_tb_body {
    position: relative;
    overflow: hidden;
}

body.tax-product_cat.term-heaters .et_pb_section_0_tb_body::after {
    content: '';
    position: absolute;
    top: -20%;
    right: 18%;
    width: 120px;
    height: 140%;
    background: #CC2229;
    transform: skewX(-15deg);
    z-index: 1;
    pointer-events: none;
    opacity: 0.85;
}

/* Make sure content sits in front of the diagonal */
body.tax-product_cat.term-heaters .et_pb_section_0_tb_body .et_pb_row {
    position: relative;
    z-index: 2;
}

/* (Mockup has no flame icon in the "Built for Reliability" badge —
   keep the badge as plain text in a yellow pill.) */

/* MADE IN USA BANNER (above footer) */
.lanair-usa-banner {
    background: #FFFFFF;
    padding: 40px 0;
    border-top: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
}
.lanair-usa-banner .lanair-usa-inner {
    width: 95%;
    max-width: 1280px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 40px;
    flex-wrap: wrap;
}
.lanair-usa-banner .usa-badge {
    flex: 0 0 auto;
    text-align: center;
}
.lanair-usa-banner .usa-badge .made-in {
    font-size: 18px;
    font-weight: 900;
    color: #CC2229;
    text-transform: uppercase;
    line-height: 1;
    letter-spacing: 1px;
}
.lanair-usa-banner .usa-badge .usa {
    font-size: 34px;
    font-weight: 900;
    color: #1A1A1A;
    text-transform: uppercase;
    line-height: 1;
    letter-spacing: 2px;
    margin: 4px 0;
}
.lanair-usa-banner .usa-badge .state {
    font-size: 11px;
    font-weight: 700;
    color: #4A4A4A;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.lanair-usa-banner .usa-badge img.usa-badge-img {
    width: 120px;
    height: auto;
    display: block;
}
.lanair-usa-banner .heating-with {
    flex: 0 0 auto;
    border-left: 1px solid #e5e5e5;
    padding-left: 40px;
}
.lanair-usa-banner .heating-with .label {
    font-size: 16px;
    font-weight: 900;
    color: #1A1A1A;
    text-transform: uppercase;
    line-height: 1.2;
    letter-spacing: 0.5px;
}
.lanair-usa-banner .heating-with .since {
    font-size: 14px;
    font-weight: 700;
    color: #4A4A4A;
    margin-top: 4px;
}
.lanair-usa-banner .contact-info {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 32px;
    flex-wrap: wrap;
}
.lanair-usa-banner .contact-info .item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #1A1A1A;
}
.lanair-usa-banner .contact-info .item svg {
    width: 18px;
    height: 18px;
    stroke: #CC2229;
}
.lanair-usa-banner .contact-info .item a {
    color: #1A1A1A;
    text-decoration: none;
    font-weight: 600;
}
.lanair-usa-banner .contact-info .item a:hover {
    color: #CC2229;
}

/* HEADSET VISUALIZATION for support block (Heaters page) */
.lanair-support-headset {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 120px;
    height: 120px;
    border: 3px solid #CC2229;
    border-radius: 50%;
    color: #CC2229;
    font-size: 56px;
    line-height: 1;
    margin-bottom: 24px;
}

@media (max-width: 980px) {
    /* Center each block on its own line */
    .lanair-usa-banner .lanair-usa-inner {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 24px;
    }
    .lanair-usa-banner .heating-with {
        border-left: 0;
        padding-left: 0;
        text-align: center;
    }
    .lanair-usa-banner .usa-badge {
        text-align: center;
    }
    .lanair-usa-banner .contact-info {
        justify-content: center;
        align-items: center;
        flex-direction: column;
        gap: 10px;
        flex: 0 0 auto;
        width: 100%;
    }
    .lanair-usa-banner .contact-info .item {
        justify-content: center;
    }
}


/* ============================================
   MOBILE-ONLY menu items (phone numbers + Contact/FAQ/Login/Cart)
   Hidden on desktop, shown inside Divi's mobile hamburger nav
   ============================================ */
@media (min-width: 981px) {
    .lanair-mobile-only { display: none !important; }
}

@media (max-width: 980px) {
    .lanair-mobile-divider {
        border-top: 1px solid #e0e0e0;
        margin-top: 12px !important;
        padding-top: 12px !important;
    }
    .lanair-mobile-divider .lanair-mobile-divider-label {
        display: block;
        padding: 6px 30px !important;
        color: #CC2229 !important;
        font-size: 11px !important;
        font-weight: 800 !important;
        text-transform: uppercase;
        letter-spacing: 1.5px;
    }
    .et_mobile_menu .lanair-mobile-only > a,
    #mobile_menu .lanair-mobile-only > a {
        color: #1A1A1A !important;
        font-weight: 600 !important;
    }
    .et_mobile_menu .lanair-mobile-only > a strong,
    #mobile_menu .lanair-mobile-only > a strong {
        color: #CC2229;
        margin-right: 6px;
    }
}

/* ============================================
   CART COUNT BADGE on .et-cart-info icon
   Shows the number of items in a red circle (top-right of cart icon)
   ============================================ */
#et-top-navigation .et-cart-info,
/* Hide the Divi default cart icon in #main-header — Lanair already shows
   "SHOPPING CART (n)" in the top phone/promo bar. Divi's et_show_cart_total()
   is hard-coded in Divi/header.php with no theme-option toggle, so this CSS
   is the only path. Scoped strictly to the main header cart icon. */
#main-header .et-cart-info {
    display: none !important;
}
.et-cart-info.lanair-cart-has-items::after {
    content: attr(data-cart-count);
    position: absolute;
    top: -6px;
    right: -10px;
    background: #CC2229;
    color: #FFFFFF;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    padding: 3px 5px;
    min-width: 16px;
    height: 16px;
    border-radius: 999px;
    text-align: center;
    box-sizing: border-box;
    pointer-events: none;
}

/* Divi 5 bug: blurb_container is display:flex with row direction even when
   blurb_position=top. Title + description render side-by-side. Force column
   for top-positioned blurbs. Title/desc/icon styles configured at module level. */
.et_pb_blurb_position_top .et_pb_blurb_container {
    flex-direction: column;
}

/* Industries section spacing/layout is configured via the module attrs themselves
   (sizing, spacing, font.size, text.orientation set per-device). See homepage post content. */

/* HOW IT WORKS step icons. Source files have mixed aspect ratios
   (SVGs 100x123, PNGs 100x85). Divi 5 blurb attrs don't expose fixed icon
   height — width-only with auto height is the design. Equalize via wrapper
   height + object-fit so labels align across the 4 steps. */
.lanair-hiw-icon .et_pb_main_blurb_image,
.lanair-hiw-icon .et_pb_main_blurb_image .et_pb_image_wrap {
    height: 100px !important;
    display: flex;
    align-items: center;
    justify-content: center;
}
.lanair-hiw-icon .et_pb_main_blurb_image img {
    height: 100px !important;
    width: auto !important;
    max-height: 100px !important;
    object-fit: contain;
}

/* Team-member image uniform aspect ratio. Source photos have mixed aspect ratios
   (landscape 1000x714, square, portrait 714x1000). Divi team-member doesn't
   expose aspect-ratio at module level — force 4:5 portrait with cover + center-top
   to keep faces visible and equalize card heights. */
.et_pb_team_member .et_pb_team_member_image {
    aspect-ratio: 4 / 5;
    overflow: hidden;
    width: 100%;
}
.et_pb_team_member .et_pb_team_member_image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    object-position: center 25%;
}

/* Team rows: tighter column gap + equal-height cards + columns share width.
   Override Divi's default 80px gutter and percentage-based column widths
   (which leave dead space when narrowed). Distribute via flex with gap. */
.lanair-team-row {
    display: flex !important;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 24px;
    justify-content: space-between;
}
.lanair-team-row > .et_pb_column.et_pb_column_1_3 {
    width: calc((100% - 48px) / 3) !important;
    max-width: calc((100% - 48px) / 3) !important;
    margin: 0 !important;
    display: flex !important;
}
.lanair-team-row > .et_pb_column.et_pb_column_1_4 {
    width: calc((100% - 72px) / 4) !important;
    max-width: calc((100% - 72px) / 4) !important;
    margin: 0 !important;
    display: flex !important;
}
.lanair-team-row .et_pb_team_member {
    width: 100%;
    display: flex;
    flex-direction: column;
}
.lanair-team-row .et_pb_team_member_description {
    flex: 1;
}

/* Yellow/red badge blurbs: vertically center the h4 text inside the blurb.
   Centering must happen at all three nesting levels (.et_pb_blurb_content
   stretches its child .et_pb_blurb_container to fill via flex; container is
   block by default so the h4 sits flush top). Flex + justify-center on
   container as well. */
.et_pb_blurb .et_pb_blurb_content,
.et_pb_blurb .et_pb_blurb_container {
    justify-content: center;
    align-items: center;
}
.et_pb_blurb .et_pb_blurb_container {
    display: flex;
    flex-direction: column;
}

/* PLP product grid via CSS Grid.
   WooCommerce's float-based grid uses li.first/.last classes + multiple
   conflicting clear:both / margin-right rules across layout.css, smallscreen.css,
   and Divi's inline emissions. Trying to override them with floats is a losing
   cascade fight. Replacing the layout primitive with CSS Grid sidesteps every
   conflict — float, clear, margin-right become irrelevant. The Shop module's
   columns attr is preserved (it sets `.columns-N` class which our grid reads). */
body.lanair-divi-page.woocommerce-page ul.products {
    display: grid !important;
    /* minmax(0,1fr) not plain 1fr: a 1fr track has an auto minimum, so one
       card with unbreakable content (nowrap stock/price line) widens its
       whole column — seen as lopsided 145px/206px columns on Tank Parts */
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 30px;
}
/* honor the Woo/Divi module column setting (.columns-N) */
body.lanair-divi-page.woocommerce-page ul.products.columns-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body.lanair-divi-page.woocommerce-page ul.products.columns-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 980px) {
    body.lanair-divi-page.woocommerce-page ul.products.columns-4,
    body.single-product ul.products.columns-4,
    body.woocommerce ul.products.columns-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Single product gallery — never upscale. Woo stretches gallery imgs to 100%
   width; for low-res sources (XT75's only existing photo is 208x550 — no larger
   original exists, flagged to client) that upscale overflows the gallery box.
   width:auto renders small images at natural size; large images still scale
   down via max-width exactly as before. Not reachable via any Divi setting. */
/* Additional information (specs) table — left-align the attribute labels
   (Woo centers th here; not exposed by the Divi additional-info module) */
body.single-product table.shop_attributes th { text-align: left; }

body.single-product .woocommerce-product-gallery__image img:not(.zoomImg) {
    /* width !important is required here: Divi core sets gallery img width via an
       #et-boc id selector that no class-based child-theme rule can outrank, and
       no module setting exposes it. Scoped to single-product gallery imgs only.
       .zoomImg is excluded — Woo's hover-zoom clone sizes itself inline and must
       keep its own width/height or the magnified image skews. */
    width: auto !important;
    max-width: 100% !important;
    display: block;
    margin: 0 auto;
}

/* Storefront's clearfix ::before/::after on ul.products take grid slots when
   we override display:flex → display:grid, pushing items off by one cell. */
body.lanair-divi-page.woocommerce-page ul.products::before,
body.lanair-divi-page.woocommerce-page ul.products::after {
    display: none !important;
}
body.lanair-divi-page.woocommerce-page ul.products li.product {
    width: auto !important;
    float: none !important;
    clear: none !important;
    margin: 0 !important;
}
@media (max-width: 980px) {
    body.lanair-divi-page.woocommerce-page ul.products {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
    }
}
@media (max-width: 360px) {
    body.lanair-divi-page.woocommerce-page ul.products {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
    }
}

/* ============================================
   PRODUCT ARCHIVE CARD — match Kenzi's Product Layout mockup.
   Card structure: image / red uppercase title / spec bullets / SKU / stock /
   price / [Add to Cart + Shop Now].

   Specificity note: Divi's per-template TB cache emits rules at
   `.et-db #et-boc .et-l .et_pb_shop_0_tb_body...` — we match that prefix to
   beat it on cards rendered inside a Theme Builder Shop module. We also
   include a fallback selector for non-TB pages (standard /shop/).
   ============================================ */

/* Card container — works on both TB Shop module and standard shop archive */
.et-db #et-boc .et-l .et_pb_shop ul.products li.product,
body.woocommerce ul.products li.product {
    background: #FFFFFF;
    border: 1px solid #E5E5E5;
    padding: 20px 20px 24px;
    display: flex;
    flex-direction: column;
    transition: box-shadow .2s, transform .2s;
}
.et-db #et-boc .et-l .et_pb_shop ul.products li.product:hover,
body.woocommerce ul.products li.product:hover {
    box-shadow: 0 6px 24px rgba(0, 0, 0, .08);
    transform: translateY(-2px);
}

/* Image — centered in the card (Jeremy 7/16; was left-aligned per mockup).
   !important required: Divi's inline dynamic CSS sets margin 0 0 9px !important
   on this exact element, so specificity alone can never win. Scoped to our
   product cards only. */
.et-db #et-boc .et-l .et_pb_shop ul.products li.product a img,
body.woocommerce ul.products li.product a img {
    margin: 0 auto 16px !important;
    display: block;
    max-height: 220px;
    object-fit: contain;
    width: auto;
    max-width: 100%;
}

/* Title — red uppercase bold */
.et-db #et-boc .et-l .et_pb_shop ul.products li.product .woocommerce-loop-product__title,
.et-db #et-boc .et-l .et_pb_shop ul.products li.product h2.woocommerce-loop-product__title,
.et-db #et-boc .et-l .et_pb_shop ul.products li.product h3.woocommerce-loop-product__title,
body.woocommerce ul.products li.product .woocommerce-loop-product__title,
body.woocommerce ul.products li.product h2.woocommerce-loop-product__title,
body.woocommerce ul.products li.product h3.woocommerce-loop-product__title {
    color: #CC2229;
    font-weight: 800;
    font-size: 18px;
    text-transform: uppercase;
    letter-spacing: .3px;
    padding: 0;
    margin: 0 0 12px;
    line-height: 1.2;
}

/* Spec bullets — green checkmark, normal-weight value */
.lanair-card-meta { margin: 0 0 12px; }
.lanair-card-bullets {
    list-style: none;
    padding: 0;
    margin: 0 0 12px;
}
.lanair-card-bullets li {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    color: #1A1A1A;
    line-height: 1.45;
    padding: 0;
    margin: 0 0 6px;
    font-weight: 600;
}
.lanair-card-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border: 1.5px solid #2DA84F;
    border-radius: 50%;
    color: #2DA84F;
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
    line-height: 1;
}

/* Base SKU + In Stock — both gray label + gray value (mockup) */
.lanair-card-sku,
.lanair-card-stock {
    font-size: 14px;
    color: #6A6A6A;
    margin: 0 0 4px;
    padding: 0;
    font-weight: 400;
}
.lanair-card-sku span,
.lanair-card-stock span {
    color: #1A1A1A;
    font-weight: 600;
}

/* Price — bold BLACK per mockup (Divi's TB cache sets it red, override with same specificity)
   Margin uses !important because there's a separate stylesheet with
   `margin: 0 !important` on .woocommerce ul.products li.product .price that
   would otherwise win on specificity-equal cascade. */
.et-db #et-boc .et-l .et_pb_shop ul.products li.product .price,
.et-db #et-boc .et-l .et_pb_shop ul.products li.product .price .amount,
body.woocommerce ul.products li.product .price,
body.woocommerce ul.products li.product .price .amount {
    color: #1A1A1A;
    font-size: 20px;
    font-weight: 800;
    margin: 12px 0 16px !important;
}
.et-db #et-boc .et-l .et_pb_shop ul.products li.product .price del,
body.woocommerce ul.products li.product .price del {
    color: #999;
    font-weight: 400;
    font-size: 14px;
}

/* Button group — flex row */
.et-db #et-boc .et-l ul.products li.product .lanair-card-buttons,
body.woocommerce ul.products li.product .lanair-card-buttons {
    display: flex;
    gap: 8px;
    margin-top: auto;
    align-items: stretch;
}
/* Suppress Divi's hover-arrow ::before/::after on card buttons — these
   target the global .button class and would otherwise show a glyph in the
   wrong position for our compact cards. */
.et-db #et-boc .et-l ul.products li.product .lanair-card-buttons > .button::before,
.et-db #et-boc .et-l ul.products li.product .lanair-card-buttons > .button::after,
body.woocommerce ul.products li.product .lanair-card-buttons > .button::before,
body.woocommerce ul.products li.product .lanair-card-buttons > .button::after {
    content: none;
    display: none;
}
.et-db #et-boc .et-l ul.products li.product .lanair-card-buttons > .button,
body.woocommerce ul.products li.product .lanair-card-buttons > .button {
    flex: 1;
    text-align: center;
    padding: 11px 12px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .4px;
    border-radius: 3px;
    line-height: 1.2 !important; /* Divi core .button line-height (1.7em) outranks
       any child-theme selector on TB product layouts; scoped to .lanair-card-buttons */
    border: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* Add to cart — red */
.et-db #et-boc .et-l ul.products li.product .lanair-card-buttons > .button:not(.lanair-shop-now),
body.woocommerce ul.products li.product .lanair-card-buttons > .button:not(.lanair-shop-now) {
    background: #CC2229;
    color: #FFFFFF;
}
.et-db #et-boc .et-l ul.products li.product .lanair-card-buttons > .button:not(.lanair-shop-now):hover,
body.woocommerce ul.products li.product .lanair-card-buttons > .button:not(.lanair-shop-now):hover {
    background: #A91A20;
}
/* Shop Now — black */
.et-db #et-boc .et-l ul.products li.product .lanair-card-buttons .lanair-shop-now,
body.woocommerce ul.products li.product .lanair-card-buttons .lanair-shop-now {
    background: #1A1A1A;
    color: #FFFFFF;
}
.et-db #et-boc .et-l ul.products li.product .lanair-card-buttons .lanair-shop-now:hover,
body.woocommerce ul.products li.product .lanair-card-buttons .lanair-shop-now:hover {
    background: #333;
}

@media (max-width: 600px) {
    .lanair-card-buttons { flex-direction: column; }
}

/* PDP mobile: Divi 5's TB-body row honors phone.flexWrap but not the per-column
   phone.flexType=24_24 attr — the desktop .et_flex_column_12_24 width:calc(50% - gap)
   stays in effect, keeping image + product info side-by-side. Stack on phone. */
@media (max-width: 767px) {
    body.single-product .et-l--body .et_pb_row > .et_flex_column_12_24 {
        width: 100% !important;
        flex-basis: 100% !important;
        max-width: 100% !important;
    }
}

/* ============================================
   FINANCING APPLICATION POPUP
   Custom modal component (not a Divi module) for Dynamics 365 lead form.
   ============================================ */
.lanair-financing-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.lanair-financing-modal[hidden] { display: none; }
.lanair-financing-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.7);
}
.lanair-financing-dialog {
    position: relative;
    background: #FFFFFF;
    color: #1A1A1A;
    max-width: 640px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
    padding: 32px 40px;
    border-radius: 4px;
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.3);
    z-index: 1;
}
.lanair-financing-close {
    position: absolute;
    top: 10px;
    right: 14px;
    background: transparent;
    border: 0;
    font-size: 28px;
    line-height: 1;
    color: #4A4A4A;
    cursor: pointer;
    padding: 4px 8px;
}
.lanair-financing-close:hover { color: #CC2229; }
.lanair-financing-dialog h2 {
    margin: 0 0 8px;
    font-weight: 900;
    font-size: 24px;
    text-transform: uppercase;
}
.lanair-financing-intro {
    margin: 0 0 20px;
    font-size: 14px;
    color: #4A4A4A;
}
.lanair-financing-form label {
    display: block;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #1A1A1A;
    margin-bottom: 12px;
}
.lanair-financing-form input,
.lanair-financing-form select {
    display: block;
    width: 100%;
    padding: 10px 12px;
    margin-top: 4px;
    border: 1px solid #D0D0D0;
    border-radius: 2px;
    font-size: 14px;
    font-family: inherit;
    text-transform: none;
    letter-spacing: 0;
    font-weight: 400;
    color: #1A1A1A;
    background: #FFFFFF;
}
.lanair-financing-form input:focus,
.lanair-financing-form select:focus {
    outline: 0;
    border-color: #CC2229;
}
.lanair-financing-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.lanair-financing-grid-3 {
    grid-template-columns: 1fr 1fr 1fr;
}
.lanair-financing-actions {
    margin-top: 8px;
}
.lanair-financing-submit {
    background: #CC2229;
    color: #FFFFFF;
    border: 0;
    padding: 14px 32px;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    border-radius: 2px;
    cursor: pointer;
}
.lanair-financing-submit:hover { background: #4A0606; }
.lanair-financing-submit:disabled { opacity: 0.6; cursor: not-allowed; }
.lanair-financing-legal {
    margin: 12px 0 0;
    font-size: 12px;
    color: #6A6A6A;
    line-height: 1.5;
}
.lanair-financing-legal a {
    color: #CC2229;
    text-decoration: underline;
}
.lanair-financing-message {
    margin-top: 16px;
    font-size: 14px;
}
.lanair-financing-message-success {
    color: #1f7a1f;
    font-weight: 700;
}
.lanair-financing-message-error {
    color: #CC2229;
    font-weight: 700;
}
@media (max-width: 540px) {
    .lanair-financing-dialog { padding: 24px 20px; }
    .lanair-financing-grid,
    .lanair-financing-grid-3 { grid-template-columns: 1fr; }
}


/* ==========================================================================
   fig1 image slider — Industries section (homepage)
   Mirrors AMS rules: arrows hidden on mobile; reserve right-padding on
   title on desktop so arrows don't clip the heading.
   ========================================================================== */
.fig1-slider__title {
    padding-right: 96px; /* clear space for the absolute-positioned arrow nav */
}
@media (min-width: 981px) {
    .fig1-slider__title { padding-right: 110px; }
}
@media (max-width: 980px) {
    .fig1_image_slider {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    .fig1_image_slider .fig1-slider__inner > div:first-child > div:last-child {
        right: 20px !important;
    }
    .fig1_image_slider .fig1-slider__arrow,
    .fig1_image_slider .fig1-slider__inner > div:first-child > div:last-child {
        display: none !important;
    }
    .fig1-slider__title {
        padding-right: 0 !important;
        text-align: center;
    }
    .fig1-slider__dots .fig1-slider__dot,
    .fig1_image_slider .swiper-pagination-bullet {
        width: 10px !important;
        height: 10px !important;
    }
}

/* ==========================================================================
   Blog list — CSS grid + card styling (AMS-pattern).
   Divi 5's .et_pb_blog renders as a flat block — force it to grid here so
   posts lay out in 3 columns instead of stacking.
   ========================================================================== */
/* Divi 5 nests posts inside .et_pb_blog > .et_pb_ajax_pagination_container >
   .et_pb_blog_posts. Reset the intermediates so the actual posts container
   can become a 3-column CSS grid. */
body .et_pb_blog,
body .et_pb_blog .et_pb_ajax_pagination_container {
    display: block !important;
    width: 100% !important;
}
body .et_pb_blog .et_pb_blog_posts,
body .et_pb_blog_posts.et_grid_module,
body .et_grid_module.et_pb_blog_posts {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 24px !important;
    width: 100% !important;
}
@media (max-width: 980px) {
    body .et_pb_blog .et_pb_blog_posts,
    body .et_pb_blog_posts.et_grid_module {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}
@media (max-width: 600px) {
    body .et_pb_blog .et_pb_blog_posts,
    body .et_pb_blog_posts.et_grid_module {
        grid-template-columns: 1fr !important;
    }
}

body.lanair-divi-page #main-content article.et_pb_post,
body #main-content .et_pb_blog article.et_pb_post,
body #page-container .et_pb_blog article.et_pb_post {
    background: #fff !important;
    border: 1px solid #e5e5e5 !important;
    border-radius: 6px !important;
    padding: 28px 26px !important;
    margin: 0 !important;
    width: auto !important;
    float: none !important;
    box-sizing: border-box;
    display: flex !important;
    flex-direction: column !important;
    transition: box-shadow 0.2s, transform 0.2s;
}
.et_pb_posts.et_pb_blog_grid .et_pb_post:hover,
.et_pb_blog_grid .et_pb_post:hover {
    box-shadow: 0 6px 20px rgba(0,0,0,0.08);
    transform: translateY(-2px);
}
.et_pb_blog_grid,
.et_pb_posts {
    gap: 24px;
}
.et_pb_post .entry-featured-image-url {
    margin: -28px -26px 18px;
    display: block;
}
.et_pb_post .entry-featured-image-url img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 6px 6px 0 0;
    display: block;
}
.et_pb_post h2.entry-title {
    margin: 0 0 10px;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 700;
}
.et_pb_post .post-meta {
    color: #888;
    font-size: 12px;
    margin-bottom: 14px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
/* .post-content WRAPS both the excerpt and the .more-link button (the DOM
   places .more-link INSIDE .post-content, not after it). Make it a flex
   column so the button can sit at the bottom of the card and we can control
   the gap between the last excerpt paragraph and the button. */
.et_pb_post .post-content {
    flex: 1;
    display: flex;
    flex-direction: column;
}
.et_pb_post .post-content .post-content-inner {
    flex: 1;
    margin-bottom: 28px;
}
.et_pb_post .post-content p {
    line-height: 1.6;
    color: #4A4A4A;
    margin: 0 0 14px;
}
.et_pb_post .post-content p:last-child { margin-bottom: 0; }
.et_pb_post .more-link {
    margin-top: auto !important;
    align-self: flex-start;
}
/* No-thumbnail fallback: red banner-bar across the top of the card so it
   looks intentional instead of a sad blank space. */
/* No-thumb posts: no filler banner — keep cards clean. When real featured
   images are added, .et_pb_post WITHOUT .et_pb_no_thumb will render
   normally with its image. */

/* ==========================================================================
   Product Manuals — 2-column download list
   ========================================================================== */
/* Higher-specificity selector — Divi's .et_pb_text ul rules win otherwise */
.et_pb_text ul.lanair-manuals-list,
ul.lanair-manuals-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.et_pb_text ul.lanair-manuals-list li,
ul.lanair-manuals-list li {
    padding: 10px 0;
    border-bottom: 1px solid #e8e8e8;
    line-height: 1.4;
    list-style: none !important;
    list-style-type: none !important;
    margin-left: 0 !important;
}
.et_pb_text ul.lanair-manuals-list li::before,
ul.lanair-manuals-list li::before { content: none !important; }
.lanair-manuals-list li:last-child { border-bottom: none; }
.lanair-manuals-list a {
    color: #CC2229;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    display: flex;
    align-items: flex-start;
    gap: 6px;
}
.lanair-manuals-list a:hover { color: #4A0606; text-decoration: underline; }
.lanair-manuals-list svg { color: #CC2229; margin-top: 2px; }

/* ==========================================================================
   WooCommerce My Account navigation — remove default bullets
   ========================================================================== */
.woocommerce-MyAccount-navigation ul,
.woocommerce-account .woocommerce-MyAccount-navigation ul,
nav.woocommerce-MyAccount-navigation ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 24px 0 !important;
}
.woocommerce-MyAccount-navigation ul li {
    list-style: none !important;
    list-style-type: none !important;
    padding: 0;
    margin: 0 0 4px 0;
    border-bottom: 1px solid #eee;
}
.woocommerce-MyAccount-navigation ul li::before { content: none !important; }
.woocommerce-MyAccount-navigation ul li a {
    display: block;
    padding: 10px 14px;
    color: #1A1A1A;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    transition: background 0.15s, color 0.15s;
}
.woocommerce-MyAccount-navigation ul li a:hover,
.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--is-active a {
    background: #f7f7f7;
    color: #CC2229;
}

/* ---- Homepage: Choose Your Heater — angled yellow banner + chevron dark panel ----
   clip-path is not available as a Divi setting; class-based CSS only (v2.8.7). */
.lanair-choose-dark {
    clip-path: polygon(0 0, calc(100% - 80px) 0, 100% 50%, calc(100% - 80px) 100%, 0 100%);
    -webkit-clip-path: polygon(0 0, calc(100% - 80px) 0, 100% 50%, calc(100% - 80px) 100%, 0 100%);
}
@media (max-width: 980px) {
    .lanair-choose-dark {
        clip-path: none;
        -webkit-clip-path: none;
    }
}

/* ---- Homepage: Trusted in Shops — diagonal photo edge ----
   Divi 5 fails to emit css.freeForm clip-path on column modules; class-based CSS only (v2.8.8). */
.lanair-trusted-photo {
    clip-path: polygon(15% 0, 100% 0, 100% 100%, 0 100%);
    -webkit-clip-path: polygon(15% 0, 100% 0, 100% 100%, 0 100%);
    margin-left: -100px; /* Charles 7/14 */
}
@media (max-width: 980px) {
    .lanair-trusted-photo {
        clip-path: none;
        -webkit-clip-path: none;
        margin-left: 0;
    }
}

/* ---- Choose Your Heater model slider (v2.9.5) ---- */
.lanair-choose { position: relative; }
.lanair-choose .lanair-choose-slide:not(.is-active) { display: none !important; }
.lanair-choose .lanair-choose-slide.is-active { animation: lanairChooseFade .35s ease; }
@keyframes lanairChooseFade { from { opacity: 0; } to { opacity: 1; } }
.lanair-choose-nav button {
    position: absolute;
    top: 50%;
    z-index: 20;
    width: 46px;
    height: 46px;
    background: #FFFFFF;
    border: 1px solid rgba(0,0,0,.15);
    color: #1A1A1A;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.lanair-choose-nav button:hover { background: #FFD200; }
.lanair-choose-nav .lcn-prev { right: 72px; }
.lanair-choose-nav .lcn-next { right: 18px; }
.lanair-choose-dots {
    position: absolute;
    bottom: 14px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 20;
    display: flex;
    gap: 8px;
    padding: 0;
}
.lanair-choose-dots button { width: 10px; height: 10px; border-radius: 50%; border: 0; padding: 0; background: rgba(255,255,255,0.45); cursor: pointer; }
.lanair-choose-dots button.on { background: #FFD200; }
@media (max-width: 980px) {
    .lanair-choose-nav button { top: auto; bottom: 100px; }
}

/* Choose banner flag: full-height, flush left (Divi bg sizing lacks auto-height) */
.lanair-choose-flag {
    background-size: auto 100% !important;
    background-position: left center !important;
}
/* Dark chevron panel layers above the slide image */
.lanair-choose-dark { position: relative; z-index: 2; }
/* Slide image hugs the left edge behind the chevron */
.lanair-choose .lanair-choose-slide .et_pb_column:last-child { background-position: left center; }

/* ---- About: team card grid (v3.0.0) ----
   Fixed quarter-width cards regardless of row count; partial rows center.
   Divi flexColumnStructure stretches a 3-card row to thirds — no per-count setting. */
.lanair-team-row {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px 2.66%;
}
.et_pb_row.lanair-team-row > .et_pb_column.et_pb_column {
    flex: 0 0 23% !important;
    max-width: 23% !important;
    width: 23% !important;
}
@media (max-width: 1250px) {
    .et_pb_row.lanair-team-row > .et_pb_column.et_pb_column {
        flex: 0 0 31% !important;
        max-width: 31% !important;
        width: 31% !important;
    }
    .lanair-team-row .et_pb_team_member {
        padding: 14px !important;
    }
}
@media (max-width: 980px) {
    .et_pb_row.lanair-team-row > .et_pb_column.et_pb_column {
        flex: 0 0 47% !important;
        max-width: 47% !important;
        width: 47% !important;
    }
}
@media (max-width: 550px) {
    .et_pb_row.lanair-team-row > .et_pb_column.et_pb_column {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }
}

/* About — pin Janesville on the USA outline at Wisconsin.
   Column is locked to the outline image's aspect ratio so contain fills it
   exactly and the pin percentages track the map at every viewport width. */
.lanair-am-outline {
    position: relative;
    aspect-ratio: 1200 / 889;
    min-height: 0 !important;
    width: 100%;
}
.lanair-am-outline .lanair-am-pin {
    position: absolute;
    left: 53.5%;
    top: 24%;
}
/* Center the wordmark + badge on mobile */
@media (max-width: 980px) {
    .lanair-am-left {
        align-items: center !important;
        text-align: center;
    }
    .lanair-am-left .et_pb_image {
        margin-left: auto !important;
        margin-right: auto !important;
        align-self: center !important;
        text-align: center !important;
    }
    .lanair-am-left .et_pb_image img,
    .lanair-am-left .et_pb_image .et_pb_image_wrap {
        margin-left: auto !important;
        margin-right: auto !important;
        float: none !important;
    }
}

/* About — 3-line justified ALWAYS / AMERICAN / MADE wordmark */
.lanair-am-word h2 { line-height: 0.92 !important; }
.lanair-am-word .am-l1 { font-size: 93px; color: #000;}
.lanair-am-word .am-l2 { font-size: 70px; color: #cc232a;}
.lanair-am-word .am-l3 { font-size: 127px; color: #cc232a;}
@media (max-width: 980px) {
    .lanair-am-word .am-l1 { font-size: 65px; }
    .lanair-am-word .am-l2 { font-size: 49px; }
    .lanair-am-word .am-l3 { font-size: 89px; }
}

/* Home Trusted section: the USA outline is now sized entirely by the
   column's Divi settings at EVERY breakpoint (background "contain" +
   per-breakpoint min-height/padding) — no CSS overrides, so the client
   team can tune it in the builder (v3.3.9, replaces the v3.1.2 cap and
   the mobile park-below-text treatment). */

/* Resources: topic card titles — fit long words, never split mid-word (v3.1.4) */
.maint-topic-card .et_pb_text_inner p a span,
.maint-topic-card .et_pb_text_inner p a {
    font-size: 14px !important;
    letter-spacing: 0.3px !important;
    overflow-wrap: normal !important;
    word-break: keep-all !important;
}

/* Yellow flag headings (angled right edge — clip-path unavailable in Divi) */
.lanair-flag {
    clip-path: polygon(0 0, 100% 0, calc(100% - 24px) 100%, 0 100%);
    -webkit-clip-path: polygon(0 0, 100% 0, calc(100% - 24px) 100%, 0 100%);
}
/* Resources: tighter topic card grid + mobile wrapping */
.maint-browse-section .et_pb_row { gap: 16px !important; }
.maint-topic-card .et_pb_text { height: 100%; }
@media (max-width: 980px) {
    .maint-browse-section .et_pb_row { flex-wrap: wrap !important; }
    .maint-browse-section .maint-topic-card {
        flex: 0 0 31% !important;
        max-width: 31% !important;
        width: 31% !important;
    }
}
@media (max-width: 550px) {
    .maint-browse-section .maint-topic-card {
        flex: 0 0 47% !important;
        max-width: 47% !important;
        width: 47% !important;
    }
}

/* Resources: Warranties Learn More button — Divi drops the spacing attr here */
.et_pb_button[href="/warranty/"] {
    padding: 15px 36px !important;
}

/* Guard against sub-viewport horizontal overflow (off-canvas UI, rounding) */
html, body {
    overflow-x: clip;
}

/* Choose Your Heater slides: cap height to the viewport; the design carries
   white space on the right, so cover+left crops only empty area (v3.1.9) */
.lanair-choose .lanair-choose-slide img {
    display: block;
    width: 100%;
    max-height: 82vh;
    object-fit: cover;
    object-position: left top;
}
@media (max-width: 980px) {
    .lanair-choose .lanair-choose-slide img {
        max-height: none;
    }
}

/* ==========================================================================
   SEARCH RESULTS — Custom search template (search.php, not a Divi module)
   ========================================================================== */

.lanair-product-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.lanair-product-card {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    transition: box-shadow 0.2s ease;
}
.lanair-product-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.lanair-product-card a {
    text-decoration: none;
    color: inherit;
    display: block;
    padding: 16px;
    text-align: center;
}
.lanair-product-image {
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
}
.lanair-product-image img {
    max-height: 100%;
    width: auto;
    object-fit: contain;
}
.lanair-product-card h3 {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1A1A1A;
    margin: 0 0 8px;
    line-height: 1.3;
}
.lanair-product-price {
    color: #CC2229;
    font-weight: 600;
    font-size: 0.9rem;
}
.lanair-content-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}
.lanair-content-card {
    display: flex;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    transition: box-shadow 0.2s ease;
}
.lanair-content-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.lanair-content-thumb {
    flex-shrink: 0;
    width: 180px;
}
.lanair-content-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.lanair-content-info {
    padding: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.lanair-content-type {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    color: #CC2229;
    margin-bottom: 6px;
}
.lanair-content-info h3 {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 8px;
    line-height: 1.3;
}
.lanair-content-info h3 a {
    color: #1A1A1A;
    text-decoration: none;
}
.lanair-content-info h3 a:hover {
    color: #CC2229;
}
.lanair-content-info p {
    font-size: 0.85rem;
    color: #555;
    line-height: 1.5;
    margin: 0;
}
@media (max-width: 768px) {
    .lanair-product-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }
    .lanair-content-grid {
        grid-template-columns: 1fr;
    }
    .lanair-content-thumb {
        width: 120px;
    }
}
@media (max-width: 480px) {
    .lanair-product-grid {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   CEILING HEIGHT GATE — LS Pro Series packages (14 ft limit)
   ========================================================================== */
.lanair-ceiling-gate {
    background: #F4F4F4;
    border-left: 4px solid #CC2229;
    padding: 16px 20px;
    margin: 0 0 20px;
}
.lanair-ceiling-gate .lanair-ceiling-heading {
    font-weight: 700;
    color: #1A1A1A;
    margin: 0 0 10px;
    font-size: 15px;
}
.lanair-ceiling-gate .lanair-ceiling-option {
    display: block;
    margin: 6px 0;
    font-size: 14px;
    color: #1A1A1A;
    cursor: pointer;
}
.lanair-ceiling-gate .lanair-ceiling-option input {
    margin-right: 8px;
}
.lanair-ceiling-gate .lanair-ceiling-contact {
    margin: 12px 0 0;
    font-size: 14px;
    color: #CC2229;
}
.lanair-ceiling-gate .lanair-ceiling-contact a {
    color: #CC2229;
    text-decoration: none;
}
.single_add_to_cart_button.lanair-ceiling-locked {
    opacity: 0.4;
    cursor: not-allowed;
}

/* Mobile hamburger — Divi's light-nav color made it white on the white header */
.mobile_menu_bar:before,
.mobile_menu_bar:after {
    color: #1A1A1A !important;
}

/* ==========================================================================
   ABOUT HERO FLAG — the blurb's instance background/padding attrs lose the
   merge against the default "Lanair Feature Card" preset (which emits
   transparent bg + 24px padding !important at the same selector). Divi 5
   offers no instance-level way to out-rank a default preset's !important,
   so this scoped class pins the flag styling. Shape matches .lanair-flag.
   ========================================================================== */
.et_pb_blurb.lanair-hero-flag {
    background-color: #FFD200 !important;
    padding: 12px 26px !important;
    border-radius: 2px !important;
    overflow: visible !important;
    /* no clip-path: the pillar-hero flame ::after overflows the right edge
       by design and a clip on this element would sever it */
}