/**
 * ROOTS homepage presentation layer.
 */
body.home:has(.roots-hero-revolution) .site-content{
  padding-top:0!important;
}

body.home .roots-hero-revolution{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden;
}

body.home .roots-hero-revolution>.elementor-container,
body.home .roots-hero-revolution>.elementor-container>.elementor-column,
body.home .roots-hero-revolution>.elementor-container>.elementor-column>.elementor-widget-wrap,
body.home .roots-hero-revolution-widget,
body.home .roots-hero-revolution-widget>.elementor-widget-container{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
}

@media(min-width:1025px){
  body.home .elementor-element-26cd0bb6.roots-story-content{
    padding-inline:clamp(48px,5vw,72px)!important;
  }

  body.home .elementor-element-26cd0bb6.roots-story-content>.elementor-widget-wrap,
  body.home .roots-brand-proof-widget,
  body.home .roots-brand-proof{
    width:100%!important;
  }

  body.home #roots-brand-proof-title{
    width:100%!important;
    max-width:610px!important;
  }

  /* Hair & Body Mist feature: the two brand surfaces reach the viewport edges,
     while the product composition and copy keep intentional readable widths. */
  body.home .roots-feature-mist>.elementor-container{
    width:100%!important;
    max-width:none!important;
  }

  body.home .roots-feature-mist .roots-feature-content{
    padding-block:clamp(64px,5vw,92px)!important;
    padding-inline:clamp(48px,7vw,120px)!important;
    background-color:#fff8f5!important;
  }

  body.home .roots-feature-mist .roots-feature-content>.elementor-widget-wrap{
    width:100%!important;
    max-width:620px!important;
    margin-inline:auto!important;
  }

  body.home .roots-feature-mist .roots-feature-heading{
    width:100%!important;
    max-width:620px!important;
  }

  body.home .roots-feature-mist .roots-feature-image,
  body.home .roots-feature-mist .roots-feature-image>.elementor-widget-wrap{
    background-color:var(--roots-cream)!important;
  }

  body.home .roots-feature-mist .roots-feature-image>.elementor-widget-wrap{
    background-repeat:no-repeat!important;
    background-position:center!important;
    background-size:auto 100%!important;
  }
}

body.home .elementor-element-cd05f2f>.elementor-widget-wrap{
  background-image:url("../images/roots-home-feature-05.webp")!important;
}

body.home .elementor-element-603398ed>.elementor-widget-wrap{
  background-image:url("../images/roots-home-hair-mist.webp")!important;
}

body.home .roots-btn-gold .elementor-button{
  color:var(--roots-green-800)!important;
}

body.home .roots-reviews-carousel .swiper-pagination{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0;
}

body.home .roots-reviews-carousel .swiper-pagination-bullet{
  position:relative;
  width:44px!important;
  height:44px!important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:0!important;
  background:transparent!important;
  opacity:1!important;
}

body.home .roots-reviews-carousel .swiper-pagination-bullet::before{
  content:"";
  width:8px;
  height:8px;
  background:var(--roots-gold);
  border-radius:50%;
  transition:width .2s ease;
}

body.home .roots-reviews-carousel .swiper-pagination-bullet-active::before{
  width:22px;
  border-radius:999px;
  background:var(--roots-green-800);
}

@media(prefers-reduced-motion:reduce){
  body.home .roots-reviews-carousel .swiper-pagination-bullet::before{
    transition:none;
  }
}

/* Keep the four category cards in a balanced 2x2 grid on phones. Elementor's
   50% column basis did not account for the container gap, so every card wrapped
   onto its own RTL-aligned row and left half the section empty. */
@media(max-width:767px){
  body.home .roots-categories>.elementor-container{
    display:flex!important;
    flex-wrap:wrap!important;
    width:100%!important;
    max-width:100%!important;
    gap:14px!important;
  }

  body.home .roots-categories>.elementor-container>.roots-category-col,
  body.home .roots-categories>.elementor-container>.roots-category-col:nth-child(n){
    width:calc(50% - 7px)!important;
    max-width:calc(50% - 7px)!important;
    flex:0 0 calc(50% - 7px)!important;
    min-width:0!important;
  }
}
/* Slider Revolution staging hero. */
.roots-slider-preview {
    margin: 0;
    background: #f8f2e6;
}

.roots-rev-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 0 28px;
    border-radius: 999px;
    color: #fff !important;
    background: #183523;
    box-shadow: 0 14px 34px rgba(24, 53, 35, 0.18);
    font-family: Cairo, sans-serif;
    font-weight: 700;
    text-decoration: none !important;
    transition: transform 180ms ease, background-color 180ms ease, box-shadow 180ms ease;
}

.roots-rev-cta:hover,
.roots-rev-cta:focus-visible {
    color: #183523 !important;
    background: #d3a63b;
    box-shadow: 0 16px 38px rgba(211, 166, 59, 0.24);
    transform: translateY(-2px);
}

.roots-rev-cta:focus-visible {
    outline: 3px solid rgba(211, 166, 59, 0.45);
    outline-offset: 4px;
}

@media (max-width: 767px) {
    .roots-rev-cta {
        min-height: 48px;
        padding-inline: 23px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .roots-rev-cta {
        transition: none;
    }
}

/* -------------------------------------------------------------------------
 * ROOTS home 1.2 — one connected care journey, not a stack of banners.
 * ---------------------------------------------------------------------- */
body.home{
  --roots-flow-ivory:#fbf7ef;
  --roots-flow-cream:#f2eadb;
  --roots-flow-green:#103d2b;
  --roots-flow-gold:#d7aa36;
  --roots-flow-ink:#17271f;
  background:
    radial-gradient(circle at 8% 28%,rgba(211,166,59,.07),transparent 18%),
    linear-gradient(180deg,#fbf7ef 0%,#f7f0e4 46%,#fbf8f1 100%)!important;
}

body.home .roots-category-heading,
body.home .roots-categories,
body.home .roots-needs,
body.home .roots-feature{
  width:calc(100% - 48px)!important;
  max-width:1240px!important;
  margin-inline:auto!important;
}

/* Elementor keeps non-stretched sections inside its legacy 1140px wrapper.
   Re-center those chapters against the viewport so every home surface shares
   the same 1240px editorial axis. */
body.home .roots-category-heading,
body.home .roots-offers,
body.home .roots-bestsellers,
body.home .roots-needs,
body.home .roots-care-sets,
body.home .roots-reviews{
  position:relative;
  left:50%;
  width:min(1240px,calc(100vw - 48px))!important;
  max-width:none!important;
  margin-inline:0!important;
  transform:translateX(-50%);
}

body.home .roots-category-heading{
  margin-top:88px!important;
  padding:82px 44px 22px!important;
  background:#fff!important;
  border:1px solid rgba(16,61,43,.08);
  border-bottom:0;
  border-radius:38px 38px 0 0;
}

body.home .roots-category-heading::before{
  content:"";
  width:72px;
  height:3px;
  display:block;
  margin:0 auto 22px;
  background:linear-gradient(90deg,var(--roots-flow-green) 0 48%,var(--roots-flow-gold) 48% 100%);
  border-radius:999px;
}

body.home .roots-categories{
  margin-bottom:74px!important;
  padding:10px 34px 44px!important;
  background:#fff!important;
  border:1px solid rgba(16,61,43,.08);
  border-top:0;
  border-radius:0 0 38px 38px;
  box-shadow:0 24px 66px rgba(16,45,32,.065);
}

body.home .roots-categories>.elementor-container{
  gap:14px!important;
}

body.home .roots-category-card{
  overflow:hidden;
  border-radius:24px!important;
  box-shadow:0 12px 32px rgba(16,45,32,.09)!important;
  transition:transform .25s ease,box-shadow .25s ease!important;
}

body.home .roots-category-card:hover{
  transform:translateY(-5px);
  box-shadow:0 20px 42px rgba(16,45,32,.15)!important;
}

body.home .roots-needs{
  position:relative;
  margin-top:72px!important;
  margin-bottom:72px!important;
  padding:72px 58px 58px!important;
  overflow:hidden;
  background:
    radial-gradient(circle at 92% 0,rgba(211,166,59,.14),transparent 25%),
    linear-gradient(145deg,#fff 0%,#fbf6ec 100%)!important;
  border:1px solid rgba(16,61,43,.09);
  border-radius:38px;
  box-shadow:0 24px 68px rgba(16,45,32,.07);
}

body.home .roots-needs::after{
  content:"ROOTS CARE";
  position:absolute;
  left:24px;
  bottom:-18px;
  color:rgba(16,61,43,.035);
  font:700 clamp(66px,9vw,116px)/1 "Cormorant Garamond",serif;
  letter-spacing:.05em;
  pointer-events:none;
}

body.home .roots-needs>.elementor-container{
  position:relative;
  z-index:1;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px!important;
}

body.home .roots-needs>.elementor-container>.elementor-column{
  width:auto!important;
  max-width:none!important;
}

body.home .roots-needs>.elementor-container>.elementor-column:first-child{
  grid-column:1/-1;
}

body.home .roots-needs .roots-section-heading{
  max-width:720px;
  margin:0 auto 22px!important;
}

body.home .roots-need-card{
  min-height:248px!important;
  padding:34px 24px!important;
  background:rgba(255,255,255,.86)!important;
  border:1px solid rgba(16,61,43,.1)!important;
  border-radius:24px!important;
  box-shadow:0 12px 30px rgba(16,45,32,.045);
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease!important;
}

body.home .roots-need-card:hover{
  transform:translateY(-5px);
  border-color:rgba(211,166,59,.5)!important;
  box-shadow:0 18px 38px rgba(16,45,32,.1);
}

body.home .roots-need-title .elementor-heading-title{
  max-width:220px;
  margin-inline:auto!important;
  color:var(--roots-flow-green)!important;
  font-family:"Alexandria",sans-serif!important;
  font-size:clamp(18px,1.5vw,22px)!important;
  font-weight:700!important;
  line-height:1.55!important;
}

body.home .roots-link-btn .elementor-button{
  min-height:42px!important;
  padding:0!important;
  color:rgba(16,61,43,.72)!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  font-weight:700!important;
}

body.home .roots-link-btn .elementor-button::after{
  content:" ←";
  color:var(--roots-flow-gold);
}

body.home .roots-feature{
  min-height:0!important;
  margin-top:72px!important;
  margin-bottom:72px!important;
  overflow:hidden;
  background:#fff!important;
  border:1px solid rgba(16,61,43,.09)!important;
  border-radius:40px;
  box-shadow:0 26px 74px rgba(16,45,32,.095);
}

body.home .roots-feature>.elementor-container{
  width:100%!important;
  max-width:none!important;
  min-height:520px;
}

body.home .roots-feature-image,
body.home .roots-feature-image>.elementor-widget-wrap{
  min-height:520px!important;
}

body.home .roots-feature-image>.elementor-widget-wrap{
  overflow:hidden;
  background-position:center!important;
  background-size:cover!important;
}

body.home .roots-feature-image>.elementor-widget-wrap::after{
  background:linear-gradient(110deg,transparent 62%,rgba(16,61,43,.16))!important;
}

body.home .roots-feature-content{
  position:relative;
  padding:68px clamp(38px,5vw,74px)!important;
}

body.home .roots-feature-content::before{
  content:"";
  position:absolute;
  top:60px;
  inset-inline-start:clamp(38px,5vw,74px);
  width:54px;
  height:3px;
  background:linear-gradient(90deg,var(--roots-flow-gold),var(--roots-flow-green));
  border-radius:99px;
}

body.home .roots-feature-content>.elementor-widget-wrap{
  width:100%!important;
  max-width:520px!important;
  margin-inline:auto!important;
}

body.home .roots-feature-heading{
  width:100%!important;
  max-width:520px!important;
  margin-top:18px!important;
}

body.home .roots-feature-heading .elementor-heading-title{
  max-width:500px;
  font-size:clamp(34px,3vw,50px)!important;
  line-height:1.28!important;
  text-wrap:balance;
}

body.home .roots-feature-heading .elementor-heading-sub-title{
  color:#a97d16!important;
  letter-spacing:0!important;
}

body.home .roots-feature-copy p{
  max-width:500px;
  margin-bottom:0!important;
  font-size:17px!important;
  line-height:1.95!important;
}

body.home .roots-feature-aloe .roots-feature-content{
  background:
    radial-gradient(circle at 78% 18%,rgba(83,126,81,.13),transparent 32%),
    linear-gradient(145deg,#f8f1e5,#fffaf2)!important;
}

/* Show the exact ROOTS product pack over the ingredient photograph. */
body.home .roots-feature-aloe .roots-feature-image>.elementor-widget-wrap::before{
  content:"";
  position:absolute;
  left:44px;
  bottom:38px;
  z-index:2;
  width:clamp(150px,16vw,220px);
  aspect-ratio:1/1;
  background:#fff url("https://rootsegypt.shop/wp-content/uploads/2025/12/Gel-Pure-and-Natural.jpg") center/contain no-repeat;
  border:8px solid rgba(255,255,255,.92);
  border-radius:28px;
  box-shadow:0 24px 55px rgba(16,45,32,.2);
}

body.home .roots-feature-mist .roots-feature-content{
  background:
    radial-gradient(circle at 20% 84%,rgba(211,166,59,.12),transparent 32%),
    linear-gradient(145deg,#fff8f5,#fff)!important;
}

body.home .roots-feature-mist .roots-feature-image>.elementor-widget-wrap{
  background-color:#f0eadf!important;
  background-position:center!important;
  background-size:82% auto!important;
  background-repeat:no-repeat!important;
}

body.home .roots-offers,
body.home .roots-bestsellers,
body.home .roots-oils,
body.home .roots-care-sets,
body.home .roots-story,
body.home .roots-reviews{
  scroll-margin-top:118px;
}

body.home .roots-offers,
body.home .roots-bestsellers,
body.home .roots-care-sets,
body.home .roots-reviews{
  width:calc(100% - 48px)!important;
  max-width:1240px!important;
  margin:72px auto!important;
  border-radius:38px!important;
}

@media(max-width:1024px){
  body.home .roots-category-heading,
  body.home .roots-categories,
  body.home .roots-needs,
  body.home .roots-feature,
  body.home .roots-offers,
  body.home .roots-bestsellers,
  body.home .roots-care-sets,
  body.home .roots-reviews{
    width:calc(100% - 32px)!important;
  }

  body.home .roots-category-heading,
  body.home .roots-offers,
  body.home .roots-bestsellers,
  body.home .roots-needs,
  body.home .roots-care-sets,
  body.home .roots-reviews{
    width:calc(100vw - 32px)!important;
  }

  body.home .roots-needs{
    padding:56px 28px 36px!important;
  }

  body.home .roots-needs>.elementor-container{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  body.home .roots-needs>.elementor-container>.elementor-column:first-child{
    grid-column:1/-1;
  }

  body.home .roots-feature>.elementor-container{
    min-height:480px;
  }

  body.home .roots-feature-image,
  body.home .roots-feature-image>.elementor-widget-wrap{
    min-height:480px!important;
  }
}

@media(max-width:767px){
  body.home .roots-category-heading,
  body.home .roots-categories,
  body.home .roots-needs,
  body.home .roots-feature,
  body.home .roots-offers,
  body.home .roots-bestsellers,
  body.home .roots-care-sets,
  body.home .roots-reviews{
    width:calc(100% - 24px)!important;
  }

  body.home .roots-category-heading,
  body.home .roots-offers,
  body.home .roots-bestsellers,
  body.home .roots-needs,
  body.home .roots-care-sets,
  body.home .roots-reviews{
    width:calc(100vw - 24px)!important;
  }

  body.home .roots-category-heading{
    margin-top:52px!important;
    padding:52px 18px 14px!important;
    border-radius:26px 26px 0 0;
  }

  body.home .roots-categories{
    margin-bottom:48px!important;
    padding:8px 12px 20px!important;
    border-radius:0 0 26px 26px;
  }

  body.home .roots-needs{
    margin-block:48px!important;
    padding:48px 14px 18px!important;
    border-radius:28px;
  }

  body.home .roots-needs>.elementor-container{
    grid-template-columns:1fr;
    gap:10px!important;
  }

  body.home .roots-needs>.elementor-container>.elementor-column:first-child{
    grid-column:auto;
  }

  body.home .roots-needs .roots-section-heading{
    margin-bottom:12px!important;
  }

  body.home .roots-need-card{
    min-height:164px!important;
    padding:24px 16px!important;
  }

  body.home .roots-need-card::before{
    width:46px!important;
    height:46px!important;
    margin-bottom:10px!important;
  }

  body.home .roots-feature{
    margin-block:48px!important;
    border-radius:28px;
  }

  body.home .roots-feature>.elementor-container{
    min-height:0;
  }

  body.home .roots-feature-image,
  body.home .roots-feature-image>.elementor-widget-wrap{
    min-height:330px!important;
  }

  body.home .roots-feature-content{
    padding:52px 22px 42px!important;
  }

  body.home .roots-feature-content::before{
    top:38px;
    inset-inline-start:22px;
  }

  body.home .roots-feature-heading .elementor-heading-title{
    font-size:30px!important;
  }

  body.home .roots-feature-copy p{
    font-size:16px!important;
  }

  body.home .roots-feature-aloe .roots-feature-image>.elementor-widget-wrap::before{
    left:18px;
    bottom:18px;
    width:132px;
    border-width:6px;
    border-radius:20px;
  }

  body.home .roots-feature-mist .roots-feature-image>.elementor-widget-wrap{
    background-size:94% auto!important;
  }
}

@media(prefers-reduced-motion:reduce){
  body.home .roots-category-card,
  body.home .roots-need-card{
    transition:none!important;
  }
}

/* Final shared axis. Physical margins intentionally neutralize Elementor's
   RTL alignment and its stretched-section inline offsets. */
body.home .roots-category-heading,
body.home .roots-categories,
body.home .roots-offers,
body.home .roots-bestsellers,
body.home .roots-needs,
body.home .roots-feature,
body.home .roots-care-sets,
body.home .roots-reviews{
  left:auto!important;
  right:auto!important;
  width:min(1240px,calc(100vw - 48px))!important;
  max-width:none!important;
  margin-left:calc((100% - min(1240px,calc(100vw - 48px)))/2)!important;
  margin-right:calc((100% - min(1240px,calc(100vw - 48px)))/2)!important;
  transform:none!important;
}

@media(max-width:1024px){
  body.home .roots-category-heading,
  body.home .roots-categories,
  body.home .roots-offers,
  body.home .roots-bestsellers,
  body.home .roots-needs,
  body.home .roots-feature,
  body.home .roots-care-sets,
  body.home .roots-reviews{
    width:calc(100vw - 32px)!important;
    margin-left:calc((100% - (100vw - 32px))/2)!important;
    margin-right:calc((100% - (100vw - 32px))/2)!important;
  }
}

@media(max-width:767px){
  body.home .roots-category-heading,
  body.home .roots-categories,
  body.home .roots-offers,
  body.home .roots-bestsellers,
  body.home .roots-needs,
  body.home .roots-feature,
  body.home .roots-care-sets,
  body.home .roots-reviews{
    width:calc(100vw - 24px)!important;
    margin-left:calc((100% - (100vw - 24px))/2)!important;
    margin-right:calc((100% - (100vw - 24px))/2)!important;
  }
}