/* ============================================================
   KIROMUM MOTORS — Global Design Tokens & Utilities
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');

:root {
  --km-green:    #006241;
  --km-dark:     #1E3932;
  --km-accent:   #00754A;
  --km-signal:   #2E9D3A;
  --km-light:    #d4e9e2;
  --km-cream:    #F5F5DC;
  --km-ceramic:  #edebe9;
  --km-coral:    #F2705F;
  --km-orange:   #E8521C;
  --km-wine:     #d61f2b;
  --km-wa:       #25D366;
  --km-font:     'Manrope', 'Helvetica Neue', Arial, sans-serif;
}

body, body * { font-family: var(--km-font) !important; }
body { background: var(--km-cream) !important; }

/* Kicker / eyebrow label */
.km-kicker {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 0.8rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.14em; color: var(--km-signal);
}
.km-kicker::before { content:''; width:20px; height:2px; background:currentColor; border-radius:2px; display:inline-block; }
.km-kicker-white { color: var(--km-coral) !important; }
.km-kicker-white::before { background: var(--km-coral) !important; }

/* Section backgrounds */
.km-bg-cream   { background: var(--km-cream)   !important; }
.km-bg-white   { background: #fff              !important; }
.km-bg-dark    { background: var(--km-dark)    !important; }
.km-bg-ceramic { background: var(--km-ceramic) !important; }

/* Cards */
.km-card {
  background: #fff; border-radius: 12px;
  box-shadow: 0 2px 16px rgba(0,0,0,0.07); overflow: hidden;
}

/* Icon circles */
.km-ico-circle {
  width: 52px; height: 52px; border-radius: 50%;
  background: var(--km-green); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.km-ico-sq {
  width: 52px; height: 52px; border-radius: 13px;
  background: var(--km-green); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}

/* Stat numbers */
.km-stat-num {
  font-size: clamp(2.4rem,4vw,3.2rem); font-weight: 800;
  color: var(--km-coral); letter-spacing: -0.02em; line-height: 1;
}

/* Dark section text overrides */
.km-bg-dark .elementor-heading-title,
.km-bg-dark h1, .km-bg-dark h2, .km-bg-dark h3 { color: #fff !important; }
.km-bg-dark p, .km-bg-dark li, .km-bg-dark span { color: rgba(255,255,255,0.8) !important; }


/* Strip */
.xpro-theme-builder-header .elementor-element-hdr_strip {
    position: relative;
    z-index: 100;
}

/* Nav bar base */
.xpro-theme-builder-header .elementor-element-hdr_nav {
    position: relative;
    z-index: 99;
    transition: box-shadow 0.25s ease;
}

/* Logo vertical centering */
.xpro-theme-builder-header .elementor-element-hdr_logo_wrap {
    display: flex !important;
    align-items: center;
}
.xpro-theme-builder-header .xpro-site-logo img {
    display: block;
    max-width: 148px;
    height: auto;
}

/* Menu wrapper fills remaining space & centres */
.xpro-theme-builder-header .elementor-element-hdr_menu {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}
.xpro-theme-builder-header .xpro-horizontal-menu-wrapper {
    display: flex !important;
    align-items: center;
    justify-content: center;
    height: 100%;
}

/* Nav items - smooth pill transition */
.xpro-theme-builder-header .xpro-menu-item {
    transition: color 0.2s ease, background-color 0.2s ease !important;
    border-radius: 6px !important;
    white-space: nowrap;
}

/* Hover state - light green pill */
.xpro-theme-builder-header .xpro-menu-item:hover > a,
.xpro-theme-builder-header .xpro-menu-item:hover > .xpro-menu-item-link {
    color: #006241 !important;
    background-color: #f0f8f4 !important;
    border-radius: 6px;
}

/* Active / current page - deeper green pill + bottom accent line */
.xpro-theme-builder-header .current-menu-item > a,
.xpro-theme-builder-header .current-page-ancestor > a,
.xpro-theme-builder-header .current-menu-ancestor > a {
    color: #006241 !important;
    background-color: #e6f4ee !important;
    border-radius: 6px !important;
    font-weight: 700 !important;
    position: relative;
}
.xpro-theme-builder-header .current-menu-item > a::after,
.xpro-theme-builder-header .current-page-ancestor > a::after {
    content: "";
    position: absolute;
    bottom: -2px;
    left: 16px;
    right: 16px;
    height: 2px;
    background: #006241;
    border-radius: 2px;
}

/* Dropdown / submenu */
.xpro-theme-builder-header .xpro-submenu-panel {
    border-top: 2px solid #006241 !important;
    border-radius: 0 0 8px 8px !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.12) !important;
    min-width: 200px !important;
    padding: 6px 0 !important;
}
.xpro-theme-builder-header .xpro-submenu-panel .xpro-menu-item a {
    padding: 10px 20px !important;
    border-radius: 0 !important;
    font-size: 13px !important;
    transition: background-color 0.15s ease, color 0.15s ease !important;
}
.xpro-theme-builder-header .xpro-submenu-panel .xpro-menu-item:hover > a {
    background-color: #f0f8f4 !important;
    color: #006241 !important;
    border-radius: 0 !important;
}

/* Buttons in header - polish */
.xpro-theme-builder-header .elementor-element-hdr_call .elementor-button,
.xpro-theme-builder-header .elementor-element-hdr_quote .elementor-button {
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.15s ease !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em !important;
    white-space: nowrap;
}
.xpro-theme-builder-header .elementor-element-hdr_call .elementor-button:hover {
    transform: translateY(-1px);
}
.xpro-theme-builder-header .elementor-element-hdr_quote .elementor-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(0,117,74,0.35) !important;
}

/* Sticky header shadow enhancement when scrolled */
.xpro-theme-builder-header.sticky-header .elementor-element-hdr_nav {
    box-shadow: 0 2px 24px rgba(0,0,0,0.13) !important;
}

/* Mobile hamburger */
.xpro-theme-builder-header .xpro-toggle-menu {
    color: #006241 !important;
}
.xpro-theme-builder-header .xpro-responsive-menu-wrapper {
    background: #fff !important;
    border-top: 3px solid #006241 !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.15) !important;
}
.xpro-theme-builder-header .xpro-responsive-menu-wrapper .xpro-menu-item a {
    font-family: Manrope, sans-serif !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    color: #1a1a1a !important;
    border-bottom: 1px solid #f0f0f0;
    padding: 14px 20px !important;
    transition: background 0.15s, color 0.15s !important;
}
.xpro-theme-builder-header .xpro-responsive-menu-wrapper .current-menu-item > a {
    color: #006241 !important;
    background: #f0f8f4 !important;
    font-weight: 700 !important;
}
/* ================================================================
   KIROMUM HEADER - 3-row professional nav
   ================================================================ */

/* === ROW 1: strip === */
.xpro-theme-builder-header .elementor-element-hdr_strip {
    width: 100% !important;
}

/* === ROW 2: logo bar === */
.xpro-theme-builder-header .elementor-element-hdr_logo_bar {
    width: 100% !important;
    border-bottom: 1px solid #d6d4c8;
}
.xpro-theme-builder-header .elementor-element-hdr_logo img {
    max-width: 170px !important;
    width: 170px !important;
    height: auto !important;
    display: block;
}

/* === ROW 3: green nav bar === */
.xpro-theme-builder-header .elementor-element-hdr_nav_bar {
    width: 100% !important;
}

/* Nav list sits full width, items in a row */
.xpro-theme-builder-header .elementor-element-hdr_menu {
    flex: 1 1 auto !important;
}
.xpro-theme-builder-header .xpro-elementor-horizontal-navbar-wrapper {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
}
.xpro-theme-builder-header .xpro-elementor-horizontal-navbar-nav {
    display: flex !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
}

/* Every nav link */
.xpro-theme-builder-header .xpro-elementor-horizontal-navbar-nav .nav-item > a.menu-link {
    display: flex !important;
    align-items: center !important;
    padding: 14px 18px !important;
    font-family: Manrope, sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 0.025em !important;
    color: rgba(255,255,255,0.88) !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    border-bottom: 3px solid transparent !important;
    transition: color 0.18s ease, background 0.18s ease, border-color 0.18s ease !important;
    line-height: 1 !important;
    border-radius: 0 !important;
    position: relative;
}

/* HOVER */
.xpro-theme-builder-header .xpro-elementor-horizontal-navbar-nav .nav-item:hover > a.menu-link {
    color: #ffffff !important;
    background: rgba(255,255,255,0.12) !important;
    border-bottom-color: rgba(255,255,255,0.5) !important;
}

/* ACTIVE */
.xpro-theme-builder-header .xpro-elementor-horizontal-navbar-nav .current-menu-item > a.menu-link,
.xpro-theme-builder-header .xpro-elementor-horizontal-navbar-nav .active > a.menu-link,
.xpro-theme-builder-header .xpro-elementor-horizontal-navbar-nav .current-menu-ancestor > a.menu-link,
.xpro-theme-builder-header .xpro-elementor-horizontal-navbar-nav .current-page-ancestor > a.menu-link {
    color: #ffffff !important;
    background: rgba(255,255,255,0.18) !important;
    border-bottom-color: #ffffff !important;
    font-weight: 700 !important;
}

/* Submenu */
.xpro-theme-builder-header .xpro-elementor-submenu-panel,
.xpro-theme-builder-header .xpro-elementor-horizontal-submenu {
    background: #004f31 !important;
    border-top: 2px solid rgba(255,255,255,0.3) !important;
    border-radius: 0 0 6px 6px !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.25) !important;
    min-width: 180px !important;
    padding: 4px 0 !important;
}
.xpro-theme-builder-header .xpro-elementor-submenu-panel .nav-item > a.menu-link,
.xpro-theme-builder-header .xpro-elementor-horizontal-submenu .nav-item > a.menu-link {
    padding: 11px 20px !important;
    border-bottom: none !important;
    color: rgba(255,255,255,0.85) !important;
    font-size: 13px !important;
    border-bottom: 1px solid rgba(255,255,255,0.07) !important;
}
.xpro-theme-builder-header .xpro-elementor-submenu-panel .nav-item:hover > a.menu-link,
.xpro-theme-builder-header .xpro-elementor-horizontal-submenu .nav-item:hover > a.menu-link {
    background: rgba(255,255,255,0.1) !important;
    color: #ffffff !important;
}

/* Quote button polish */
.xpro-theme-builder-header .elementor-element-hdr_quote .elementor-button {
    transition: background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em !important;
    white-space: nowrap !important;
}
.xpro-theme-builder-header .elementor-element-hdr_quote .elementor-button:hover {
    box-shadow: 0 0 0 3px rgba(255,255,255,0.25) !important;
}

/* Mobile panel */
.xpro-theme-builder-header .xpro-elementor-horizontal-menu-responsive-wrapper {
    background: #004f31 !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.3) !important;
}
.xpro-theme-builder-header .xpro-elementor-horizontal-menu-responsive-wrapper .nav-item > a {
    font-family: Manrope, sans-serif !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    color: rgba(255,255,255,0.9) !important;
    padding: 14px 24px !important;
    border-bottom: 1px solid rgba(255,255,255,0.08) !important;
    display: block !important;
    transition: background 0.15s, color 0.15s !important;
}
.xpro-theme-builder-header .xpro-elementor-horizontal-menu-responsive-wrapper .current-menu-item > a,
.xpro-theme-builder-header .xpro-elementor-horizontal-menu-responsive-wrapper .active > a {
    color: #ffffff !important;
    background: rgba(255,255,255,0.15) !important;
    font-weight: 700 !important;
}
.xpro-theme-builder-header .xpro-elementor-horizontal-menu-responsive-wrapper .nav-item:hover > a {
    background: rgba(255,255,255,0.1) !important;
    color: #ffffff !important;
}

/* Hamburger icon colour */
.xpro-theme-builder-header .xpro-elementor-horizontal-menu-toggle {
    color: #ffffff !important;
}

/* Force nav menu widget to be in normal flow - not absolute */
.xpro-theme-builder-header .elementor-element-hdr_menu.elementor-absolute {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    flex: 1 1 auto !important;
}
.xpro-theme-builder-header .elementor-element-hdr_nav_inner > .e-con-inner {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    justify-content: space-between !important;
    width: 100% !important;
    flex-wrap: nowrap !important;
}
/* Logo lockup: JPG icon circular crop */
.xpro-theme-builder-header .elementor-element-hdr_logo_icon img,
.xpro-theme-builder-header .km-logo-icon img {
    width: 56px !important;
    height: 56px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
    flex-shrink: 0 !important;
    border: 2px solid rgba(0,98,65,0.15) !important;
}
/* Wordmark size */
.xpro-theme-builder-header .elementor-element-hdr_logo_wordmark img {
    width: 148px !important;
    height: auto !important;
    display: block !important;
}
/* Lockup container alignment */
.xpro-theme-builder-header .elementor-element-hdr_logo_lockup > .e-con-inner {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 14px !important;
    flex-wrap: nowrap !important;
}

/* ================================================================
   KIROMUM BLOG — Single post & listing styling
   ================================================================ */

/* Single post layout (Astra theme default post) */
.single-post .site-content {
    max-width: 860px !important;
    margin: 0 auto !important;
    padding: 60px 24px !important;
}
.single-post .entry-header { margin-bottom: 36px; }
.single-post .entry-title {
    font-family: Manrope, sans-serif !important;
    font-size: clamp(1.8rem, 3.5vw, 2.4rem) !important;
    font-weight: 800 !important;
    color: #006241 !important;
    line-height: 1.15 !important;
    letter-spacing: -0.02em !important;
    margin-bottom: 16px !important;
}
/* Category + date meta bar */
.single-post .entry-meta,
.single-post .ast-post-meta { margin-bottom: 24px !important; }
.single-post .entry-meta a,
.single-post .entry-meta .posted-on,
.single-post .entry-meta .cat-links a {
    font-family: Manrope, sans-serif !important;
    font-size: 0.82rem !important;
    font-weight: 600 !important;
    color: #006241 !important;
    background: #d4e9e2 !important;
    padding: 4px 12px !important;
    border-radius: 100px !important;
    text-decoration: none !important;
    display: inline-flex !important;
    margin-right: 8px !important;
    margin-bottom: 6px !important;
}
.single-post .entry-meta .posted-on {
    background: transparent !important;
    color: rgba(0,0,0,0.45) !important;
    font-weight: 500 !important;
}
/* Featured image */
.single-post .post-thumbnail img {
    width: 100% !important;
    max-height: 420px !important;
    object-fit: cover !important;
    border-radius: 12px !important;
    display: block !important;
    margin-bottom: 40px !important;
}
/* Body text */
.single-post .entry-content {
    font-family: Manrope, sans-serif !important;
    font-size: 1.0625rem !important;
    line-height: 1.8 !important;
    color: rgba(0,0,0,0.75) !important;
}
.single-post .entry-content h2,
.single-post .entry-content h3,
.single-post .entry-content h4 {
    font-family: Manrope, sans-serif !important;
    font-weight: 800 !important;
    color: #006241 !important;
    margin-top: 2.2rem !important;
    margin-bottom: 0.75rem !important;
    letter-spacing: -0.01em !important;
}
.single-post .entry-content p { margin-bottom: 1.4rem !important; }
.single-post .entry-content ul,
.single-post .entry-content ol {
    padding-left: 1.5rem !important;
    margin-bottom: 1.4rem !important;
}
.single-post .entry-content li { margin-bottom: 0.5rem !important; }
.single-post .entry-content strong { color: #141414 !important; }
.single-post .entry-content a {
    color: #006241 !important;
    font-weight: 600 !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}
/* Horizontal rule inside posts */
.single-post .entry-content hr {
    border: none !important;
    border-top: 2px solid #d4e9e2 !important;
    margin: 2.5rem 0 !important;
}
/* Blockquote */
.single-post .entry-content blockquote {
    border-left: 4px solid #006241 !important;
    padding: 16px 24px !important;
    background: #f0f8f4 !important;
    border-radius: 0 8px 8px 0 !important;
    margin: 2rem 0 !important;
    font-style: italic !important;
    color: #1E3932 !important;
}

/* AD SLOT inside single posts */
.km-post-ad {
    background: #1E3932;
    border-radius: 10px;
    padding: 24px 28px;
    margin: 40px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}
.km-post-ad .km-ad-label {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: rgba(255,255,255,0.35);
    margin-bottom: 8px;
}
.km-post-ad .km-ad-headline {
    font-size: 1.2rem;
    font-weight: 800;
    color: #ffffff;
    font-family: Manrope, sans-serif;
    margin-bottom: 6px;
}
.km-post-ad .km-ad-body {
    font-size: 0.85rem;
    color: rgba(255,255,255,0.65);
    line-height: 1.5;
    max-width: 400px;
}
.km-post-ad .km-ad-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #00754A;
    color: #fff;
    font-family: Manrope, sans-serif;
    font-weight: 700;
    font-size: 0.875rem;
    padding: 11px 22px;
    border-radius: 100px;
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background 0.18s ease;
}
.km-post-ad .km-ad-btn:hover { background: #005c38; }

/* Post navigation (prev/next) */
.single-post .post-navigation {
    border-top: 2px solid #d4e9e2 !important;
    padding-top: 36px !important;
    margin-top: 48px !important;
}
.single-post .nav-previous a,
.single-post .nav-next a {
    font-family: Manrope, sans-serif !important;
    font-weight: 700 !important;
    color: #006241 !important;
    text-decoration: none !important;
    font-size: 0.9rem !important;
}
.single-post .nav-previous a:hover,
.single-post .nav-next a:hover { text-decoration: underline !important; }

/* Author box */
.single-post .ast-author-box {
    background: #F5F5DC !important;
    border-radius: 10px !important;
    border: 1px solid #d6d4c8 !important;
    margin-top: 48px !important;
}

/* Astra breadcrumbs */
.ast-breadcrumbs-wrapper {
    background: #1E3932 !important;
    padding: 10px 40px !important;
}
.ast-breadcrumbs a, .ast-breadcrumbs span {
    color: rgba(255,255,255,0.7) !important;
    font-family: Manrope, sans-serif !important;
    font-size: 0.8rem !important;
}
.ast-breadcrumbs a:hover { color: #fff !important; }
.ast-breadcrumbs-separator { color: rgba(255,255,255,0.4) !important; }
/* ================================================================
   STICKY HEADER — pure CSS, zero JS animation
   ================================================================ */

/* 1. Cancel the 2-second hide/show JS (Xpro hides the frontend on load) */
.xpro-theme-builder-frontend {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 2. The header wrapper: always visible, sticks to top instantly */
.xpro-theme-builder-header,
.xpro-theme-builder-header.xtb-header-sticky {
    position: sticky !important;
    top: 0 !important;
    width: 100% !important;
    z-index: 9999 !important;
    /* No transition, no transform, no animation — it simply stays */
    transition: none !important;
    transform: none !important;
    animation: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* 3. Cancel the xtb-appear state entirely — we do not want Xpro's
      fixed-position overlay which is what causes the reappear jump.
      The header is already sticky via CSS so this is redundant. */
.xpro-theme-builder-header.xtb-header-sticky.xtb-appear {
    position: sticky !important;
    top: 0 !important;
    /* Xpro sets position:fixed here - we override back to sticky */
    transition: none !important;
    box-shadow: 0 2px 20px rgba(0,0,0,0.12) !important;
}

/* 4. Prevent Xpro from adding a min-height spacer gap
      (its JS sets min-height on .xtb-header-sticky to reserve space
      for the fixed clone — not needed with our sticky approach) */
.xtb-header-sticky[style*="min-height"] {
    min-height: 0 !important;
}

/* 5. Slight shadow when user has scrolled past the header origin
      (optional, very subtle — adds depth without animation) */
.xpro-theme-builder-header.xtb-header-sticky.xtb-appear .elementor-element-hdr_nav_bar {
    box-shadow: 0 3px 16px rgba(0,0,0,0.18) !important;
}

/* ================================================================
   KIROMUM MOTORS — Complete Mobile Responsiveness
   Breakpoints: tablet ≤1024px | mobile ≤767px | small ≤480px
   ================================================================ */

/* ---- BASE: box-sizing & overflow guard ---- */
*, *::before, *::after { box-sizing: border-box !important; }
html, body { overflow-x: hidden !important; max-width: 100vw !important; }
.e-con, .e-con-inner, .elementor-widget-wrap {
    max-width: 100% !important;
    min-width: 0 !important;
}
img, video, iframe, svg {
    max-width: 100% !important;
    height: auto !important;
}

/* ================================================================
   HEADER — 3-row responsive
   ================================================================ */

/* TABLET ≤1024px */


/* MOBILE ≤767px */


/* ================================================================
   SECTIONS — padding, flex stacking
   ================================================================ */






/* ================================================================
   TYPOGRAPHY — fluid scaling
   ================================================================ */




/* ================================================================
   HERO SECTIONS
   ================================================================ */


/* ================================================================
   CARDS & GRIDS — 1 or 2 col on mobile
   ================================================================ */




/* ================================================================
   BUTTONS — full width & centre on mobile
   ================================================================ */


/* ================================================================
   CONTACT PAGE — form + map stack
   ================================================================ */


/* ================================================================
   FOOTER — stack columns on mobile
   ================================================================ */




/* ================================================================
   BLOG — single post on mobile
   ================================================================ */


/* ================================================================
   GENERAL MOBILE POLISH
   ================================================================ */


/* ================================================================
   TABLET — 768–1024px tweaks
   ================================================================ */


/* ================================================================
   KIROMUM MOTORS — Professional Responsive System
   Strategy: CSS Grid/Flex override only. Zero layout stacking.
   Desktop layout preserved on tablet. Intelligent reflow on mobile.
   ================================================================
   Breakpoints:
     Tablet  : 768px – 1024px  (2-col grids, tighter padding)
     Mobile  : 481px – 767px   (smart 2-col where sensible, 1-col only when necessary)
     Small   : ≤ 480px         (true small phone adjustments)
   ================================================================ */

/* --- Global guards -------------------------------------------- */
*,*::before,*::after { box-sizing: border-box !important; }
html { overflow-x: hidden !important; }
body { overflow-x: hidden !important; max-width: 100vw !important; }
img, video, iframe { max-width: 100% !important; height: auto !important; }
.e-con, .e-con-inner, .elementor-widget-wrap { min-width: 0 !important; word-break: break-word; }

/* ================================================================
   TABLET  768px – 1024px
   ================================================================ */


/* ================================================================
   MOBILE  481px – 767px
   ================================================================ */


/* ================================================================
   SMALL  ≤ 480px
   ================================================================ */

/* ================================================================
   KIROMUM MOTORS — Mobile Responsive CSS  (FINAL, CLEAN VERSION)
   Applies ONLY at ≤767px (mobile) and ≤480px (small phone)
   Desktop and tablet (>768px) are completely untouched.
   ================================================================ */

/* --- Global overflow guard (all sizes) ------------------------- */
*, *::before, *::after { box-sizing: border-box !important; }
html, body { overflow-x: hidden !important; max-width: 100vw !important; }
img, video, iframe { max-width: 100% !important; height: auto !important; }
.e-con, .e-con-inner, .elementor-widget-wrap { min-width: 0 !important; }

/* ================================================================
   TABLET  768px – 1024px  — conservative, only grids
   ================================================================ */


/* ================================================================
   MOBILE  ≤ 767px
   ================================================================ */


/* ================================================================
   SMALL  ≤ 480px  — only what genuinely needs extra adjustment
   ================================================================ */

/* ================================================================
   KIROMUM MOTORS — Mobile CSS  (CLEAN FINAL v3)
   MOBILE ONLY: ≤767px and ≤480px
   Desktop/tablet (>768px) completely untouched.
   ================================================================ */

/* --- Global overflow guard ------------------------------------ */
*, *::before, *::after { box-sizing: border-box !important; }
html, body { overflow-x: hidden !important; max-width: 100vw !important; }
img, video, iframe { max-width: 100% !important; height: auto !important; }
.e-con, .e-con-inner, .elementor-widget-wrap { min-width: 0 !important; }

/* ================================================================
   TABLET 768-1024px — grid reflow only, nothing else
   ================================================================ */


/* ================================================================
   MOBILE ≤767px
   ================================================================ */


/* ================================================================
   SMALL ≤480px
   ================================================================ */

/* ================================================================
   KIROMUM MOTORS — Mobile CSS  (FINAL v4)
   MOBILE ONLY. Desktop/tablet (>768px) completely untouched.
   ================================================================ */

/* --- Global guards -------------------------------------------- */
*, *::before, *::after { box-sizing: border-box !important; }
html, body { overflow-x: hidden !important; max-width: 100vw !important; }
img, video, iframe { max-width: 100% !important; height: auto !important; }
.e-con, .e-con-inner, .elementor-widget-wrap { min-width: 0 !important; }

/* ================================================================
   TABLET 768–1024px — grid reflow only
   ================================================================ */
(max-width: 767px) {
    /* ====================================================
       ELEMENTOR CSS VARIABLE OVERRIDES FOR MOBILE
       These override Elementor's own variables so all
       containers behave correctly at mobile widths.
       ==================================================== */

    /* 1. Remove section padding sides - use gutters instead */
    .e-con {
        --padding-left: 16px !important;
        --padding-right: 16px !important;
    }

    /* 2. Force all child containers to full width */
    .e-con > .e-con-inner > .e-con {
        --width: 100% !important;
        --flex-shrink: 1 !important;
        --flex-grow: 1 !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    /* 3. Fix the boxed inner constraint */
    .e-con-boxed > .e-con-inner {
        max-width: 100% !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* 4. Prevent any element from overflowing its container */
    .e-con, .e-con > .e-con-inner, .elementor-widget-wrap {
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-wrap: break-word !important;
    }

    /* 5. Header containers: no side padding override */
    .xpro-theme-builder-header .e-con {
        --padding-left: 0 !important;
        --padding-right: 0 !important;
    }

    /* THE fix for all boxed containers on mobile:
       Override Elementors --container-max-width variable so no section
       is ever constrained to a narrower width and pushed sideways.
       This applies to every page, every section, every future section. */
    .e-con {
        --container-max-width: 100% !important;
    }
    /* Belt-and-braces: also directly target the inner div */
    .e-con-boxed > .e-con-inner {
        max-width: 100% !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}
(min-width: 768px) and (max-width: 1024px) {
    .e-con > .e-con-inner { padding-left: 24px !important; padding-right: 24px !important; }
    /* 3-col → 2-col */
    .elementor-element-why_grid > .e-con-inner,
    .elementor-element-trust_grid > .e-con-inner,
    .elementor-element-sv_gg > .e-con-inner,
    .elementor-element-test_grid > .e-con-inner,
    .elementor-element-bl_pg > .e-con-inner,
    .elementor-element-hbl_g > .e-con-inner,
    .elementor-element-pr_cg > .e-con-inner { flex-wrap: wrap !important; gap: 20px !important; }
    .elementor-element-why_grid > .e-con-inner > .e-con,
    .elementor-element-trust_grid > .e-con-inner > .e-con,
    .elementor-element-sv_gg > .e-con-inner > .e-con,
    .elementor-element-test_grid > .e-con-inner > .e-con,
    .elementor-element-bl_pg > .e-con-inner > .e-con,
    .elementor-element-hbl_g > .e-con-inner > .e-con,
    .elementor-element-pr_cg > .e-con-inner > .e-con
    { flex: 0 0 calc(50% - 10px) !important; width: calc(50% - 10px) !important; }
    /* 4-col → 2x2 */
    .elementor-element-cprv_grid > .e-con-inner,
    .elementor-element-ct_ig > .e-con-inner,
    .elementor-element-mt_wg > .e-con-inner,
    .elementor-element-ab_og > .e-con-inner,
    .elementor-element-fn_hg > .e-con-inner { flex-wrap: wrap !important; gap: 16px !important; }
    .elementor-element-cprv_grid > .e-con-inner > .e-con,
    .elementor-element-ct_ig > .e-con-inner > .e-con,
    .elementor-element-mt_wg > .e-con-inner > .e-con,
    .elementor-element-ab_og > .e-con-inner > .e-con,
    .elementor-element-fn_hg > .e-con-inner > .e-con
    { flex: 0 0 calc(50% - 8px) !important; width: calc(50% - 8px) !important; }
    .elementor-element-mt_mg > .e-con-inner { flex-wrap: wrap !important; }
    .elementor-element-mt_mg > .e-con-inner > .e-con { flex: 0 0 calc(50% - 14px) !important; width: calc(50% - 14px) !important; }
    h1.elementor-heading-title { font-size: clamp(1.9rem, 4.5vw, 2.8rem) !important; }
    h2.elementor-heading-title { font-size: clamp(1.6rem, 3.5vw, 2.2rem) !important; }
}

/* ================================================================
   MOBILE ≤ 767px
   ================================================================ */
(max-width: 767px) {

    /* ============================================================
       HEADER
       ============================================================ */

    /* Cancel vertical padding on ALL header containers */
    .xpro-theme-builder-header .e-con,
    .xpro-theme-builder-header .e-con[data-element_type="container"] {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    /* STRIP — 36px compact bar */
    .xpro-theme-builder-header .elementor-element-hdr_strip,
    .xpro-theme-builder-header .elementor-element-hdr_strip > .e-con-inner {
        height: 36px !important; min-height: 36px !important; max-height: 36px !important; overflow: hidden !important;
    }
    .xpro-theme-builder-header .elementor-element-hdr_strip_inner > .e-con-inner {
        flex-direction: row !important; flex-wrap: nowrap !important;
        align-items: center !important; justify-content: space-between !important;
        height: 36px !important; min-height: 36px !important;
        padding: 0 16px !important; gap: 0 !important;
    }
    .xpro-theme-builder-header .elementor-element-strip_l > .elementor-widget-container,
    .xpro-theme-builder-header .elementor-element-strip_r > .elementor-widget-container {
        display: flex !important; align-items: center !important;
        white-space: nowrap !important; overflow: hidden !important; line-height: 1 !important;
    }
    .xpro-theme-builder-header .elementor-element-strip_l > .elementor-widget-container > *,
    .xpro-theme-builder-header .elementor-element-strip_r > .elementor-widget-container > * { margin: 0 !important; }
    .xpro-theme-builder-header .elementor-element-strip_l div,
    .xpro-theme-builder-header .elementor-element-strip_r div {
        display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important;
        align-items: center !important; gap: 10px !important;
        font-size: 0.73rem !important; white-space: nowrap !important;
    }
    /* Keep only primary phone on strip */
    .xpro-theme-builder-header .elementor-element-strip_l div > a:not(:first-child),
    .xpro-theme-builder-header .elementor-element-strip_l div > span { display: none !important; }
    /* Hide WhatsApp pill */
    .xpro-theme-builder-header .elementor-element-strip_r div > a { display: none !important; }

    /* LOGO BAR — 60px, left-aligned lockup */
    .xpro-theme-builder-header .elementor-element-hdr_logo_bar,
    .xpro-theme-builder-header .elementor-element-hdr_logo_bar > .e-con-inner {
        height: 60px !important; min-height: 60px !important; max-height: 60px !important; overflow: hidden !important;
    }
    .xpro-theme-builder-header .elementor-element-hdr_logo_inner > .e-con-inner {
        flex-direction: row !important; flex-wrap: nowrap !important;
        align-items: center !important; justify-content: flex-start !important;
        height: 60px !important; min-height: 60px !important;
        padding: 0 16px !important; gap: 0 !important;
    }
    .xpro-theme-builder-header .elementor-element-hdr_tagline { display: none !important; }
    .xpro-theme-builder-header .elementor-element-hdr_logo_lockup,
    .xpro-theme-builder-header .elementor-element-hdr_logo_lockup > .e-con-inner {
        display: flex !important; flex-direction: row !important;
        align-items: center !important; flex-wrap: nowrap !important;
        gap: 10px !important; height: auto !important; min-height: 0 !important;
    }
    .xpro-theme-builder-header .elementor-element-hdr_logo_icon .elementor-widget-container {
        line-height: 0 !important; display: flex !important; align-items: center !important;
    }
    .xpro-theme-builder-header .elementor-element-hdr_logo_icon img {
        width: 44px !important; height: 44px !important;
        border-radius: 50% !important; object-fit: cover !important;
    }
    .xpro-theme-builder-header .elementor-element-hdr_logo_wordmark img {
        width: 100px !important; height: auto !important; display: block !important;
    }

    /* NAV BAR — 48px, hamburger LEFT */
    .xpro-theme-builder-header .elementor-element-hdr_nav_bar,
    .xpro-theme-builder-header .elementor-element-hdr_nav_bar > .e-con-inner {
        height: 48px !important; min-height: 48px !important; max-height: 48px !important; overflow: visible !important;
    }
    .xpro-theme-builder-header .elementor-element-hdr_nav_inner > .e-con-inner {
        flex-direction: row !important; flex-wrap: nowrap !important;
        align-items: center !important;
        /* Space-between: toggler left (order:0), page name centre, nothing right */
        justify-content: flex-start !important;
        height: 48px !important; min-height: 48px !important;
        padding: 0 16px !important; gap: 12px !important;
    }
    /* On mobile: hide desktop quote button only */
    .xpro-theme-builder-header .elementor-element-hdr_quote { display: none !important; }
    /* Keep hdr_menu visible (it contains the toggler) but compact it */
    .xpro-theme-builder-header .elementor-element-hdr_menu {
        flex: 0 0 auto !important;
        width: auto !important;
    }

    

    
    /* HAMBURGER: show and position left */
    /* Xpro hides toggler-wrapper by default; override for mobile */
    .xpro-elementor-horizontal-menu-responsive-tablet ~ .xpro-elementor-horizontal-menu-toggler-wrapper,
    .xpro-elementor-horizontal-menu-responsive-tablet + .xpro-elementor-horizontal-menu-overlay + .xpro-elementor-horizontal-menu-toggler-wrapper,
    .xpro-elementor-horizontal-menu-toggler-wrapper {
        display: flex !important;
        align-items: center !important;
        order: -1 !important;
    }
    .xpro-elementor-horizontal-menu-toggler {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 44px !important;
        height: 44px !important;
        padding: 0 !important;
        background: rgba(255,255,255,0.15) !important;
        border: 1.5px solid rgba(255,255,255,0.5) !important;
        border-radius: 8px !important;
        color: #ffffff !important;
        cursor: pointer !important;
        font-size: 20px !important;
        line-height: 1 !important;
    }
    .xpro-elementor-horizontal-menu-toggler .fas.fa-bars {
        color: #ffffff !important;
        font-size: 20px !important;
        display: block !important;
    }
    .xpro-elementor-horizontal-menu-toggler-wrapper::after {
        content: "MENU" !important;
        font-family: Manrope, sans-serif !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        letter-spacing: 0.08em !important;
        color: rgba(255,255,255,0.8) !important;
        margin-left: 8px !important;
    }

    /* MOBILE MENU PANEL */
    .xpro-elementor-horizontal-menu-responsive-tablet {
        width: 100vw !important; left: 0 !important; right: 0 !important;
        background: #004f31 !important;
        box-shadow: 0 8px 32px rgba(0,0,0,0.35) !important;
        border-top: 3px solid rgba(255,255,255,0.15) !important;
        z-index: 10000 !important;
    }
    .xpro-elementor-horizontal-menu-responsive-tablet .nav-item > a,
    .xpro-elementor-horizontal-menu-responsive-tablet .nav-item > .menu-link {
        font-family: Manrope, sans-serif !important; font-size: 15px !important;
        font-weight: 600 !important; color: rgba(255,255,255,0.9) !important;
        padding: 14px 20px !important;
        border-bottom: 1px solid rgba(255,255,255,0.07) !important;
        display: block !important; white-space: normal !important;
    }
    .xpro-elementor-horizontal-menu-responsive-tablet .current-menu-item > a,
    .xpro-elementor-horizontal-menu-responsive-tablet .active > a {
        color: #fff !important; background: rgba(255,255,255,0.15) !important; font-weight: 700 !important;
    }

    /* ============================================================
       UNIVERSAL SECTION RULE (future-proof)
       Any Elementor container that is a direct child of the page
       and carries a background colour = a full-width section.
       We give it sensible mobile padding and ensure its inner
       content never exceeds the screen width.
       ============================================================ */
    .elementor-section-wrap > .e-con,
    body > .e-con,
    #content .e-con.e-con-full,
    .site-content .e-con.e-con-full,
    .elementor .e-con.e-con-full {
        padding-left: 0 !important;
        padding-right: 0 !important;
        width: 100vw !important;
        max-width: 100vw !important;
    }
    /* Every section's inner boxed container: edge-to-edge with 16px gutters */
    .e-con > .e-con-inner {
        padding-left: 16px !important;
        padding-right: 16px !important;
        max-width: 100% !important;
        width: 100% !important;
    }
    /* Named sections: consistent vertical padding */
    .elementor-element-h1s, .elementor-element-why_s, .elementor-element-home_stats,
    .elementor-element-bike_s, .elementor-element-trust_s, .elementor-element-home_blog,
    .elementor-element-test_s, .elementor-element-cprv_s, .elementor-element-ab_story,
    .elementor-element-ab_mv, .elementor-element-ab_vals, .elementor-element-ab_obj,
    .elementor-element-sv_grid_sec, .elementor-element-sv_fleet,
    .elementor-element-bl_posts, .elementor-element-bl_topics,
    .elementor-element-ct_info, .elementor-element-ct_fm,
    .elementor-element-pr_cats, .elementor-element-pr_brands, .elementor-element-pr_qual,
    .elementor-element-fn_how, .elementor-element-fn_elig, .elementor-element-fn_faq, .elementor-element-fn_form,
    .elementor-element-mt_models, .elementor-element-mt_why,
    .elementor-element-bl_ad, .elementor-element-bl_ad_sec {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }
    /* CTA / hero bands */
    [class*="_cta_band"], [class*="_hero_hero"],
    .elementor-element-ab__cta_band, .elementor-element-home_cta_band,
    .elementor-element-sv__cta_band, .elementor-element-bl__cta_band,
    .elementor-element-fn__cta_band, .elementor-element-mt__cta_band,
    .elementor-element-pr__cta_band, .elementor-element-ct__cta_band {
        padding-top: 48px !important;
        padding-bottom: 48px !important;
    }

    /* ============================================================
       HERO SPLITS: stack vertically, copy first
       ============================================================ */
    
    
    .elementor-element-h1s > .e-con-inner,
    .elementor-element-h1r > .e-con-inner,
    .elementor-element-bike_r > .e-con-inner,
    .elementor-element-ab_sr > .e-con-inner,
    .elementor-element-sv_fr > .e-con-inner,
    .elementor-element-fn_er > .e-con-inner,
    .elementor-element-ct_fmr > .e-con-inner {
        flex-direction: column !important; gap: 24px !important;
        width: 100% !important; max-width: 100% !important;
    }
    .elementor-element-h1c, .elementor-element-h1m,
    .elementor-element-bike_copy, .elementor-element-bike_img_col,
    .elementor-element-ab_sc, .elementor-element-ab_sm,
    .elementor-element-sv_fc, .elementor-element-sv_fimg_c,
    .elementor-element-fn_fl, .elementor-element-fn_fform,
    .elementor-element-ct_fc, .elementor-element-ct_mc
    { width: 100% !important; max-width: 100% !important; flex: none !important; min-width: 0 !important; }
    .elementor-element-h1m    { order: 2 !important; } .elementor-element-h1c    { order: 1 !important; }
    .elementor-element-bike_img_col { order: 2 !important; } .elementor-element-bike_copy { order: 1 !important; }
    .elementor-element-ab_sm  { order: 2 !important; } .elementor-element-ab_sc  { order: 1 !important; }
    .elementor-element-sv_fimg_c { order: 2 !important; } .elementor-element-sv_fc { order: 1 !important; }
    .km-kicker { display: inline-flex !important; align-items: center !important; }

    /* ============================================================
       GRIDS
       ============================================================ */
    /* Blog cards, testimonials, services: 1-col (text-heavy, needs full width) */
    .elementor-element-hbl_g > .e-con-inner,
    .elementor-element-bl_pg > .e-con-inner,
    .elementor-element-test_grid > .e-con-inner,
    .elementor-element-sv_gg > .e-con-inner {
        flex-direction: column !important; gap: 16px !important;
    }
    .elementor-element-hbl_g > .e-con-inner > .e-con,
    .elementor-element-bl_pg > .e-con-inner > .e-con,
    .elementor-element-test_grid > .e-con-inner > .e-con,
    .elementor-element-sv_gg > .e-con-inner > .e-con
    { width: 100% !important; max-width: 100% !important; flex: none !important; }

    /* FIX: text in these cards must never rotate or break mid-letter */
    .elementor-element-hbl_g *, .elementor-element-bl_pg *,
    .elementor-element-test_grid * {
        writing-mode: horizontal-tb !important;
        text-orientation: mixed !important;
        white-space: normal !important;
        word-break: normal !important;
        overflow-wrap: break-word !important;
        hyphens: none !important;
    }

    /* "Experts you can trust" (trust_grid) and
       "We are here to help" (cprv_grid): 2-col */
    .elementor-element-trust_grid > .e-con-inner,
    .elementor-element-cprv_grid > .e-con-inner,
    .elementor-element-why_grid > .e-con-inner,
    .elementor-element-mt_mg > .e-con-inner,
    .elementor-element-pr_cg > .e-con-inner { flex-wrap: wrap !important; gap: 12px !important; }
    .elementor-element-trust_grid > .e-con-inner > .e-con,
    .elementor-element-cprv_grid > .e-con-inner > .e-con,
    .elementor-element-why_grid > .e-con-inner > .e-con,
    .elementor-element-mt_mg > .e-con-inner > .e-con,
    .elementor-element-pr_cg > .e-con-inner > .e-con
    { flex: 0 0 calc(50% - 6px) !important; width: calc(50% - 6px) !important; max-width: calc(50% - 6px) !important; }

    /* 4-col info grids: 2x2 */
    .elementor-element-ct_ig > .e-con-inner,
    .elementor-element-mt_wg > .e-con-inner,
    .elementor-element-ab_og > .e-con-inner,
    .elementor-element-fn_hg > .e-con-inner { flex-wrap: wrap !important; gap: 12px !important; }
    .elementor-element-ct_ig > .e-con-inner > .e-con,
    .elementor-element-mt_wg > .e-con-inner > .e-con,
    .elementor-element-ab_og > .e-con-inner > .e-con,
    .elementor-element-fn_hg > .e-con-inner > .e-con
    { flex: 0 0 calc(50% - 6px) !important; width: calc(50% - 6px) !important; max-width: calc(50% - 6px) !important; }

    /* Stats: always 2x2 */
    .elementor-element-home_srow > .e-con-inner,
    .elementor-element-ab_srow > .e-con-inner,
    .elementor-element-ab_sg > .e-con-inner { flex-wrap: wrap !important; gap: 0 !important; }
    .elementor-element-home_srow > .e-con-inner > .e-con,
    .elementor-element-ab_srow > .e-con-inner > .e-con,
    .elementor-element-ab_sg > .e-con-inner > .e-con
    { flex: 0 0 50% !important; width: 50% !important; padding: 16px 8px !important; text-align: center !important; }
    .elementor-element-home_srow .elementor-heading-title,
    .elementor-element-ab_srow .elementor-heading-title { font-size: 2rem !important; }

    /* About mission/vision */
    .elementor-element-ab_mvg > .e-con-inner { flex-direction: column !important; gap: 14px !important; }
    .elementor-element-ab_mvg > .e-con-inner > .e-con { width: 100% !important; }

    /* ============================================================
       BUTTONS
       ============================================================ */
    .elementor-element-h1btns > .e-con-inner,
    .elementor-element-bike_btns > .e-con-inner,
    .elementor-element-ab_sbr > .e-con-inner { flex-wrap: wrap !important; gap: 10px !important; }
    .elementor-element-home_cbtns > .e-con-inner, .elementor-element-ab__cbtns > .e-con-inner,
    .elementor-element-sv__cbtns > .e-con-inner, .elementor-element-bl__cbtns > .e-con-inner,
    .elementor-element-fn__cbtns > .e-con-inner, .elementor-element-mt__cbtns > .e-con-inner,
    .elementor-element-pr__cbtns > .e-con-inner, .elementor-element-ct__cbtns > .e-con-inner,
    .elementor-element-hdr_hbtns > .e-con-inner
    { flex-wrap: wrap !important; gap: 10px !important; justify-content: center !important; }
    .elementor-button { min-height: 44px !important; }

    /* ============================================================
       TYPOGRAPHY
       ============================================================ */
    h1.elementor-heading-title { font-size: clamp(1.5rem, 7vw, 2rem) !important; line-height: 1.2 !important; }
    h2.elementor-heading-title { font-size: clamp(1.25rem, 5.5vw, 1.6rem) !important; line-height: 1.25 !important; }
    h3.elementor-heading-title { font-size: clamp(1rem, 4.5vw, 1.15rem) !important; }
    h4.elementor-heading-title { font-size: clamp(0.875rem, 4vw, 1rem) !important; }
    .elementor-widget-text-editor p {
        font-size: clamp(0.875rem, 3.8vw, 1rem) !important;
        line-height: 1.7 !important;
        word-break: normal !important;
        overflow-wrap: break-word !important;
        hyphens: none !important;
    }
    .elementor-widget-text-editor div[style*="display:flex"],
    .elementor-widget-text-editor div[style*="display: flex"] {
        flex-wrap: wrap !important; white-space: normal !important;
    }

    /* ============================================================
       FOOTER
       ============================================================ */
    .xpro-theme-builder-footer .e-con,
    .xpro-theme-builder-footer .e-con[data-element_type="container"] {
        padding-top: 0 !important; padding-bottom: 0 !important;
    }
    .xpro-theme-builder-footer .elementor-element-ftr_main > .e-con-inner { padding: 36px 16px 20px !important; }
    .xpro-theme-builder-footer .elementor-element-ftr_top > .e-con-inner { flex-wrap: wrap !important; gap: 24px !important; }
    .xpro-theme-builder-footer .elementor-element-ftr_brand { flex: 0 0 100% !important; width: 100% !important; }
    .xpro-theme-builder-footer .elementor-element-ftr_col2,
    .xpro-theme-builder-footer .elementor-element-ftr_col3 { flex: 0 0 calc(50% - 12px) !important; width: calc(50% - 12px) !important; }
    .xpro-theme-builder-footer .elementor-element-ftr_col4 { flex: 0 0 100% !important; width: 100% !important; }
    .xpro-theme-builder-footer .elementor-element-ftr_bottom > .e-con-inner {
        flex-direction: column !important; align-items: flex-start !important;
        gap: 6px !important; padding: 16px 16px 0 !important;
    }

    /* ============================================================
       MISC
       ============================================================ */
    .wpforms-container input, .wpforms-container select, .wpforms-container textarea { font-size: 16px !important; }
    .elementor-widget-google_maps iframe { height: 220px !important; }
    .km-post-ad { flex-direction: column !important; padding: 20px 16px !important; }
    .km-post-ad .km-ad-btn { width: 100% !important; justify-content: center !important; }
    .single-post .site-content { padding: 28px 16px !important; }
    .single-post .entry-title { font-size: clamp(1.4rem, 7vw, 1.9rem) !important; }
}

/* ================================================================
   SMALL ≤ 480px
   ================================================================ */
(max-width: 480px) {
    .e-con > .e-con-inner { padding-left: 12px !important; padding-right: 12px !important; }
    /* trust/why/cprv: 1-col at very small screens */
    .elementor-element-trust_grid > .e-con-inner > .e-con,
    .elementor-element-why_grid > .e-con-inner > .e-con,
    .elementor-element-cprv_grid > .e-con-inner > .e-con
    { flex: 0 0 100% !important; width: 100% !important; max-width: 100% !important; }
    /* 4-col info: 1-col */
    .elementor-element-ct_ig > .e-con-inner > .e-con
    { flex: 0 0 100% !important; width: 100% !important; }
    /* Stats: still 2x2 */
    .elementor-element-home_srow > .e-con-inner > .e-con,
    .elementor-element-ab_srow > .e-con-inner > .e-con { flex: 0 0 50% !important; width: 50% !important; }
    .elementor-element-home_srow .elementor-heading-title,
    .elementor-element-ab_srow .elementor-heading-title { font-size: 1.65rem !important; }
    h1.elementor-heading-title { font-size: clamp(1.3rem, 8vw, 1.6rem) !important; }
    h2.elementor-heading-title { font-size: clamp(1.1rem, 7vw, 1.35rem) !important; }
    .xpro-theme-builder-header .elementor-element-hdr_logo_wordmark img { width: 82px !important; }
    .xpro-theme-builder-header .elementor-element-hdr_logo_icon img { width: 36px !important; height: 36px !important; }
}
