/* Start custom CSS for html, class: .elementor-element-48efe3d *//* =========================================
   AXXESSWORLD - CENTERED WEBSITE
   ========================================= */

.axx-home {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto !important;
  padding: 0 !important;
  box-sizing: border-box;
  color: #111111;
  background: #ffffff;
  font-family: Arial, sans-serif;
  overflow: hidden;
}

.axx-home *,
.axx-home *::before,
.axx-home *::after {
  box-sizing: border-box;
}

.axx-home a {
  text-decoration: none !important;
}


/* =========================================
   COMMON CONTENT WIDTH
   ========================================= */

.axx-hero,
.axx-features,
.axx-section,
.axx-products-section,
.axx-about,
.axx-cta {
  width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
}


/* =========================================
   TAG
   ========================================= */

.axx-tag {
  color: #238b45;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1.5px;
  margin: 0 0 15px;
}


/* =========================================
   BUTTON
   ========================================= */

.axx-btn {
  display: inline-block;
  background: #238b45;
  color: #ffffff !important;
  padding: 15px 28px;
  border-radius: 5px;
  font-weight: 700;
  transition: all .3s ease;
}

.axx-btn:hover {
  background: #176c34;
  color: #ffffff !important;
}


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

.axx-hero {
  display: flex;
  align-items: center;
  justify-content: center;

  max-width: 1400px;

  gap: 70px;

  padding: 80px 70px;

  min-height: 570px;

  background: #f5f8f5;
}


/* LEFT */

.axx-hero-text {
  width: 50%;
  max-width: 600px;
}


/* RIGHT */

.axx-hero-image {
  width: 50%;
  max-width: 600px;

  display: flex;
  justify-content: center;
  align-items: center;

  text-align: center;
}


/* CAMERA */

.axx-hero-image img {
  display: block;

  width: 100%;
  max-width: 500px;

  height: auto;

  margin: 0 auto;

  object-fit: contain;
}


/* HERO HEADING */

.axx-hero h1 {
  font-size: 58px;
  line-height: 1.08;

  color: #111111;

  margin: 15px 0 20px;

  font-weight: 800;
}

.axx-hero h1 span {
  color: #238b45;
}


/* DESCRIPTION */

.axx-desc {
  color: #555555;

  font-size: 17px;

  line-height: 1.7;

  max-width: 500px;

  margin: 0 0 30px;
}


/* =========================================
   FEATURES
   ========================================= */

.axx-features {
  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 20px;

  max-width: 1400px;

  padding: 35px 70px;

  text-align: center;

  border-bottom: 1px solid #eeeeee;
}

.axx-feature {
  text-align: center;
}

.axx-feature strong {
  display: block;

  color: #238b45;

  font-size: 30px;
}

.axx-feature h3 {
  font-size: 17px;

  margin: 10px 0 5px;

  color: #111111;
}

.axx-feature p {
  color: #777777;

  font-size: 13px;

  margin: 0;
}


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

.axx-section,
.axx-products-section {
  max-width: 1400px;

  padding: 75px 70px;
}

.axx-section h2,
.axx-products-section h2,
.axx-about h2 {
  color: #111111;

  font-size: 38px;

  margin: 0 0 30px;
}


/* =========================================
   CATEGORY
   ========================================= */

.axx-category-grid {
  width: 100%;

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 22px;
}

.axx-category {
  display: block;

  width: 100%;

  padding: 30px 20px;

  text-align: center;

  background: #f5f8f5;

  border: 1px solid #e2e9e2;

  border-radius: 8px;

  transition: all .3s ease;
}

.axx-category:hover {
  border-color: #238b45;

  transform: translateY(-5px);
}

.axx-cat-image {
  font-size: 65px;

  padding: 25px;

  background: #ffffff;

  border-radius: 6px;

  margin-bottom: 20px;
}

.axx-category h3 {
  color: #111111;

  font-size: 18px;
}

.axx-category span {
  color: #238b45;

  font-size: 14px;

  font-weight: 700;
}


/* =========================================
   PRODUCTS
   ========================================= */

.axx-products-section {
  background: #f5f8f5;
}

.axx-section-top {
  width: 100%;

  display: flex;

  justify-content: space-between;

  align-items: flex-end;

  margin-bottom: 25px;
}

.axx-section-top h2 {
  margin-bottom: 0;
}

.axx-view {
  color: #238b45 !important;

  font-weight: 700;
}


/* =========================================
   WOOCOMMERCE PRODUCT GRID
   ========================================= */

.axx-product-area {
  width: 100%;
}

.axx-product-area ul.products {
  width: 100% !important;

  display: grid !important;

  grid-template-columns: repeat(4, 1fr) !important;

  gap: 20px !important;

  margin: 0 !important;

  padding: 0 !important;
}

.axx-product-area ul.products li.product {
  width: 100% !important;

  margin: 0 !important;

  padding: 15px !important;

  background: #ffffff;

  border-radius: 8px;

  border: 1px solid #e5e5e5;

  transition: all .3s ease;
}

.axx-product-area ul.products li.product:hover {
  transform: translateY(-5px);

  border-color: #238b45;
}

.axx-product-area img {
  display: block;

  width: 100% !important;

  height: 210px !important;

  object-fit: contain !important;

  margin: 0 auto 12px !important;
}

.axx-product-area .woocommerce-loop-product__title {
  color: #111111 !important;

  font-size: 15px !important;
}

.axx-product-area .price {
  color: #238b45 !important;

  font-size: 17px !important;

  font-weight: 700;
}

.axx-product-area .button {
  display: block;

  background: #111111 !important;

  color: #ffffff !important;

  width: 100%;

  text-align: center;

  padding: 12px !important;

  border-radius: 4px !important;
}

.axx-product-area .button:hover {
  background: #238b45 !important;
}


/* =========================================
   ABOUT
   ========================================= */

.axx-about {
  display: grid;

  grid-template-columns: 1fr 1fr;

  align-items: center;

  gap: 70px;

  max-width: 1400px;

  padding: 80px 70px;

  background: #ffffff;
}

.axx-about h2 {
  font-size: 42px;

  margin-bottom: 20px;
}

.axx-about p {
  color: #666666;

  line-height: 1.8;

  font-size: 16px;
}

.axx-about-box {
  background: #f5f8f5;

  border-left: 4px solid #238b45;

  padding: 35px;

  border-radius: 6px;
}

.axx-about-box h3 {
  color: #111111;

  font-size: 20px;

  margin-bottom: 5px;
}


/* =========================================
   CTA
   ========================================= */

.axx-cta {
  max-width: 1400px;

  text-align: center;

  padding: 80px 70px;

  background: #111111;
}

.axx-cta h2 {
  color: #ffffff;

  font-size: 40px;

  margin-bottom: 15px;
}

.axx-cta p {
  color: #cccccc;

  margin-bottom: 30px;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 1024px) {

  .axx-hero {
    gap: 40px;

    padding: 60px 40px;
  }

  .axx-hero h1 {
    font-size: 45px;
  }

  .axx-section,
  .axx-products-section,
  .axx-about,
  .axx-cta {
    padding-left: 40px;
    padding-right: 40px;
  }

  .axx-features {
    padding-left: 40px;
    padding-right: 40px;
  }

  .axx-product-area ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
  }

}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 767px) {

  .axx-home {
    width: 100%;

    max-width: 100%;

    margin: 0 auto !important;
  }


  /* HERO */

  .axx-hero {
    flex-direction: column;

    gap: 35px;

    padding: 55px 20px;

    text-align: center;
  }

  .axx-hero-text,
  .axx-hero-image {
    width: 100%;

    max-width: 100%;
  }

  .axx-hero h1 {
    font-size: 38px;
  }

  .axx-desc {
    font-size: 15px;

    margin-left: auto;
    margin-right: auto;
  }


  /* FEATURES */

  .axx-features {
    grid-template-columns: 1fr;

    padding: 35px 20px;

    gap: 30px;
  }


  /* SECTIONS */

  .axx-section,
  .axx-products-section {
    padding: 60px 20px;
  }


  /* CATEGORY */

  .axx-category-grid {
    grid-template-columns: 1fr;
  }


  /* PRODUCTS */

  .axx-product-area ul.products {
    grid-template-columns: repeat(2, 1fr) !important;

    gap: 12px !important;
  }

  .axx-product-area img {
    height: 150px !important;
  }


  /* TOP */

  .axx-section-top {
    display: block;
  }

  .axx-view {
    display: inline-block;

    margin-top: 10px;
  }


  /* ABOUT */

  .axx-about {
    grid-template-columns: 1fr;

    gap: 35px;

    padding: 60px 20px;
  }

  .axx-about h2 {
    font-size: 34px;
  }


  /* CTA */

  .axx-cta {
    padding: 60px 20px;
  }

  .axx-cta h2 {
    font-size: 30px;
  }

}  /* =====================================================
   FINAL FIX — FULL WIDTH + PERFECT CENTER
   ===================================================== */

/* Browser / WordPress default spacing remove */
html,
body {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

/* WordPress / Elementor common wrappers */
.site,
.site-content,
.site-main,
.content-area,
.elementor,
.elementor-section,
.elementor-container,
.elementor-widget-wrap,
.elementor-widget-container {
  max-width: 100% !important;
}

/* MAIN WEBSITE */
.axx-home {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
}

/* Make every major section full width */
.axx-hero,
.axx-features,
.axx-section,
.axx-products-section,
.axx-about,
.axx-cta {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Keep actual content evenly spaced */
.axx-hero {
  padding-left: 7% !important;
  padding-right: 7% !important;
}

.axx-features {
  padding-left: 7% !important;
  padding-right: 7% !important;
}

.axx-section,
.axx-products-section {
  padding-left: 6% !important;
  padding-right: 6% !important;
}

.axx-about {
  padding-left: 7% !important;
  padding-right: 7% !important;
}

.axx-cta {
  padding-left: 6% !important;
  padding-right: 6% !important;
}


/* =====================================================
   IMPORTANT: ELEMENTOR / THEME CONTAINER FIX
   ===================================================== */

.elementor-element:has(.axx-home) {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.elementor-element:has(.axx-home) > .elementor-widget-container {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}


/* =====================================================
   DESKTOP — PERFECT 3 / 4 COLUMN ALIGNMENT
   ===================================================== */

.axx-hero-text,
.axx-hero-image {
  box-sizing: border-box !important;
}

.axx-hero-text {
  width: 50% !important;
}

.axx-hero-image {
  width: 50% !important;
}

.axx-features {
  grid-template-columns: repeat(3, 1fr) !important;
}

.axx-category-grid {
  grid-template-columns: repeat(3, 1fr) !important;
}

.axx-product-area ul.products {
  grid-template-columns: repeat(4, 1fr) !important;
}


/* =====================================================
   IMAGE FIX
   ===================================================== */

.axx-hero-image img {
  max-width: 500px !important;
  width: 100% !important;
  height: auto !important;
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;
}


/* =====================================================
   MOBILE
   ===================================================== */

@media (max-width: 767px) {

  .axx-home {
    width: 100% !important;
    max-width: 100% !important;
  }

  .axx-hero {
    width: 100% !important;
    padding: 55px 5% !important;
  }

  .axx-hero-text,
  .axx-hero-image {
    width: 100% !important;
  }

  .axx-features {
    grid-template-columns: 1fr !important;
    padding-left: 5% !important;
    padding-right: 5% !important;
  }

  .axx-category-grid {
    grid-template-columns: 1fr !important;
  }

  .axx-product-area ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }

  .axx-section,
  .axx-products-section {
    padding-left: 5% !important;
    padding-right: 5% !important;
  }

  .axx-about {
    grid-template-columns: 1fr !important;
    padding-left: 5% !important;
    padding-right: 5% !important;
  }
}/* End custom CSS */