.elementor-74 .elementor-element.elementor-element-803633d{--spacer-size:20px;}.elementor-74 .elementor-element.elementor-element-cb65ad5{--spacer-size:5px;}.elementor-74 .elementor-element.elementor-element-5906af9{--spacer-size:10px;}.elementor-74 .elementor-element.elementor-element-a535518{margin:12px 12px calc(var(--kit-widget-spacing, 0px) + 12px) 12px;}.elementor-74 .elementor-element.elementor-element-a535518.elementor-element{--align-self:center;--flex-grow:0;--flex-shrink:0;}.elementor-74 .elementor-element.elementor-element-97351c7{--spacer-size:10px;}.elementor-74 .elementor-element.elementor-element-e361224{padding:8px 8px 8px 8px;border-style:dashed;border-width:2px 2px 2px 2px;border-radius:8px 8px 8px 8px;--e-icon-list-icon-size:18px;--icon-vertical-offset:0px;}.elementor-74 .elementor-element.elementor-element-e361224.elementor-element{--align-self:center;--flex-grow:0;--flex-shrink:0;}.elementor-74 .elementor-element.elementor-element-e361224 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(3px/2);}.elementor-74 .elementor-element.elementor-element-e361224 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(3px/2);}.elementor-74 .elementor-element.elementor-element-e361224 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(3px/2);}.elementor-74 .elementor-element.elementor-element-e361224 .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-3px/2);}.elementor-74 .elementor-element.elementor-element-e361224 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-3px/2);}.elementor-74 .elementor-element.elementor-element-e361224 .elementor-icon-list-icon i{color:#000000;transition:color 0.3s;}.elementor-74 .elementor-element.elementor-element-e361224 .elementor-icon-list-icon svg{fill:#000000;transition:fill 0.3s;}.elementor-74 .elementor-element.elementor-element-e361224 .elementor-icon-list-icon{padding-inline-end:2px;}.elementor-74 .elementor-element.elementor-element-e361224 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-74 .elementor-element.elementor-element-e361224 .elementor-icon-list-item > a{font-family:"Alexandria", Sans-serif;}.elementor-74 .elementor-element.elementor-element-e361224 .elementor-icon-list-text{color:#000000;transition:color 0.3s;}.elementor-74 .elementor-element.elementor-element-bcf3201{--spacer-size:20px;}.elementor-74 .elementor-element.elementor-element-f0307f1{--spacer-size:10px;}.elementor-74 .elementor-element.elementor-element-c33f569{--spacer-size:10px;}.elementor-74 .elementor-element.elementor-element-e1a29bd{--spacer-size:10px;}.elementor-74 .elementor-element.elementor-element-ee5436d{--spacer-size:10px;}.elementor-74 .elementor-element.elementor-element-22fa754{--spacer-size:10px;}.elementor-74 .elementor-element.elementor-element-4ff0f95{--spacer-size:10px;}.elementor-74 .elementor-element.elementor-element-1f1897a{--spacer-size:10px;}.elementor-74 .elementor-element.elementor-element-41a1a1e{width:var( --container-widget-width, 50% );max-width:50%;--container-widget-width:50%;--container-widget-flex-grow:0;}.elementor-74 .elementor-element.elementor-element-41a1a1e.elementor-element{--align-self:center;}.elementor-74 .elementor-element.elementor-element-1fe54b9{--spacer-size:10px;}.elementor-74 .elementor-element.elementor-element-1a238e8{margin:12px 12px calc(var(--kit-widget-spacing, 0px) + 12px) 12px;}.elementor-74 .elementor-element.elementor-element-1a238e8.elementor-element{--align-self:center;--flex-grow:0;--flex-shrink:0;}.elementor-74 .elementor-element.elementor-element-936adcd{--spacer-size:10px;}.elementor-74 .elementor-element.elementor-element-8b416a9{border-radius:0px 0px 0px 0px;}body:not(.rtl) .elementor-74 .elementor-element.elementor-element-8b416a9 .elementor-countdown-item:not(:first-of-type){margin-left:calc( 10px/2 );}body:not(.rtl) .elementor-74 .elementor-element.elementor-element-8b416a9 .elementor-countdown-item:not(:last-of-type){margin-right:calc( 10px/2 );}body.rtl .elementor-74 .elementor-element.elementor-element-8b416a9 .elementor-countdown-item:not(:first-of-type){margin-right:calc( 10px/2 );}body.rtl .elementor-74 .elementor-element.elementor-element-8b416a9 .elementor-countdown-item:not(:last-of-type){margin-left:calc( 10px/2 );}.elementor-74 .elementor-element.elementor-element-6d4b393{--spacer-size:10px;}@media(max-width:767px){.elementor-74 .elementor-element.elementor-element-a535518{margin:6px 6px calc(var(--kit-widget-spacing, 0px) + 6px) 6px;}.elementor-74 .elementor-element.elementor-element-41a1a1e{width:100%;max-width:100%;}.elementor-74 .elementor-element.elementor-element-1a238e8{margin:6px 6px calc(var(--kit-widget-spacing, 0px) + 6px) 6px;}}/* Start custom CSS *//* =========================================================
   DOTBOX — MASTER LANDING DESIGN SYSTEM
   CLEAN FINAL VERSION
   ========================================================= */


/* =========================================================
   1. VARIABLES
   ========================================================= */

:root{
  --fx-gold:#b87518;
  --fx-gold-2:#d8a24c;

  --fx-ink:#171717;
  --fx-text:#24211f;

}


/* =========================================================
   2. GLOBAL PAGE
   ========================================================= */

html,
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden !important;
}

body{
  color:var(--fx-ink);

  background:
    radial-gradient(
      circle at 95% 5%,
      rgba(184,117,24,.08),
      transparent 22%
    ),
    linear-gradient(
      180deg,
      #fcfbf9 0%,
      #f8f4ee 100%
    ) !important;
}

.elementor,
.elementor-page{
  width:100%;
  max-width:100%;
  overflow-x:clip !important;
}


/* =========================================================
   3. BOX MODEL
   ========================================================= */

.fx-section,
.fx-section *,
.fx-title,
.fx-image,
.fx-features,
.fx-trust,
.fx-order,
.hero-eq{
  box-sizing:border-box;
}


/* =========================================================
   4. CONTINUOUS SECTIONS
   class: fx-section
   ========================================================= */

.fx-section{
  position:relative;
  isolation:isolate;

  width:100%;
  max-width:100%;

  margin:0 !important;
  padding:18px 8px 26px !important;

  background:transparent !important;

  border:none !important;
  border-radius:0 !important;

  box-shadow:none !important;
}


/* =========================================================
   5. TITLES
   class: fx-title
   ========================================================= */

.fx-title{
  position:relative !important;
  z-index:3 !important;

  margin-bottom:12px !important;

  text-align:center !important;
}

.fx-title .elementor-heading-title{
  color:var(--fx-ink) !important;

  font-weight:800 !important;
  line-height:1.25 !important;
}

.fx-title::after{
  content:"";

  display:block;

  width:42px;
  height:2px;

  margin:9px auto 0;

  border-radius:20px;

  background:
    linear-gradient(
      90deg,
      transparent,
      var(--fx-gold),
      var(--fx-gold-2),
      var(--fx-gold),
      transparent
    );
}


/* =========================================================
   6. STANDARD IMAGE
   class: fx-image
   ========================================================= */

.fx-image{
  position:relative !important;
  isolation:isolate;

  z-index:2 !important;

  padding:5px !important;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.98),
      rgba(250,247,242,.98)
    ) !important;

  border:1px solid rgba(126,92,54,.09) !important;
  border-top:2px solid rgba(184,117,24,.32) !important;

  border-radius:16px !important;

  box-shadow:
    0 10px 26px rgba(30,20,10,.04),
    0 22px 34px -20px rgba(184,117,24,.26) !important;
}

.fx-image img{
  position:relative !important;
  z-index:2 !important;

  display:block !important;

  width:100% !important;
  height:auto !important;

  border-radius:11px !important;

  box-shadow:none !important;
}


/* glow للصورة العادية */

.fx-image::after{
  content:"";

  position:absolute;

  left:15%;
  right:15%;
  bottom:-7px;

  height:18px;

  border-radius:50%;

  background:
    radial-gradient(
      ellipse at center,
      rgba(184,117,24,.16),
      rgba(184,117,24,.06) 42%,
      transparent 75%
    );

  filter:blur(5px);

  z-index:0;

  pointer-events:none;
}


/* =========================================================
   7. TRANSPARENT IMAGE
   classes:
   fx-image fx-transparent
   ========================================================= */

.fx-image.fx-transparent{
  position:relative !important;
  isolation:isolate !important;

  overflow:visible !important;

  padding:0 !important;

  background:transparent !important;

  border:none !important;
  border-radius:0 !important;

  box-shadow:none !important;
}

.fx-image.fx-transparent img{
  position:relative !important;
  z-index:3 !important;

  display:block !important;

  width:100% !important;
  height:auto !important;

  background:transparent !important;

  border:none !important;
  border-radius:0 !important;

  box-shadow:none !important;

  filter:
    drop-shadow(0 10px 9px rgba(30,20,10,.18)) !important;
}


/* نلغي glow الصورة العادية هنا */

.fx-image.fx-transparent::before,
.fx-image.fx-transparent::after{
  content:none !important;
  display:none !important;
}


/* =========================================================
   8. HERO RADIO — WAVES + SOFT EQUALIZER
   classes:
   fx-image fx-transparent hero-eq
   ========================================================= */

.fx-image.fx-transparent.hero-eq{
  position:relative !important;
  isolation:isolate !important;
  overflow:visible !important;

  padding:0 !important;

  background-color:transparent !important;

  background-image:
    radial-gradient(
      ellipse at 50% 48%,
      transparent 0 24%,
      rgba(216,162,76,.22) 24.8% 25.5%,
      transparent 26.2%
    ),
    radial-gradient(
      ellipse at 50% 48%,
      transparent 0 30%,
      rgba(184,117,24,.16) 30.8% 31.5%,
      transparent 32.2%
    ),
    radial-gradient(
      ellipse at 50% 48%,
      transparent 0 36%,
      rgba(216,162,76,.11) 36.8% 37.5%,
      transparent 38.2%
    ),
    radial-gradient(
      ellipse at 50% 48%,
      transparent 0 42%,
      rgba(184,117,24,.08) 42.8% 43.5%,
      transparent 44.2%
    ),

    linear-gradient(rgba(184,117,24,.46),rgba(184,117,24,.46)),
    linear-gradient(rgba(216,162,76,.50),rgba(216,162,76,.50)),
    linear-gradient(rgba(184,117,24,.42),rgba(184,117,24,.42)),
    linear-gradient(rgba(216,162,76,.54),rgba(216,162,76,.54)),
    linear-gradient(rgba(184,117,24,.44),rgba(184,117,24,.44)),
    linear-gradient(rgba(216,162,76,.58),rgba(216,162,76,.58)),
    linear-gradient(rgba(184,117,24,.44),rgba(184,117,24,.44)),
    linear-gradient(rgba(216,162,76,.54),rgba(216,162,76,.54)),
    linear-gradient(rgba(184,117,24,.42),rgba(184,117,24,.42)),
    linear-gradient(rgba(216,162,76,.50),rgba(216,162,76,.50)),
    linear-gradient(rgba(184,117,24,.46),rgba(184,117,24,.46)) !important;

  background-repeat:no-repeat !important;

  background-size:
    100% 100%,
    100% 100%,
    100% 100%,
    100% 100%,

    7px 40px,
    7px 58px,
    7px 48px,
    7px 74px,
    7px 56px,
    7px 88px,
    7px 56px,
    7px 74px,
    7px 48px,
    7px 58px,
    7px 40px !important;

  background-position:
    center center,
    center center,
    center center,
    center center,

    18% 43%,
    25% 43%,
    32% 43%,
    39% 43%,
    46% 43%,
    53% 43%,
    60% 43%,
    67% 43%,
    74% 43%,
    81% 43%,
    88% 43% !important;
}

.fx-image.fx-transparent.hero-eq img{
  position:relative !important;
  z-index:5 !important;

  width:100% !important;
  height:auto !important;

  background:transparent !important;

  filter:
    drop-shadow(0 12px 10px rgba(30,20,10,.24))
    drop-shadow(0 0 7px rgba(184,117,24,.14)) !important;
}

/* =========================================================
   9. GRAPHIC VARIANTS
   استخدم واحد فقط لكل fx-section
   ========================================================= */


/* ORBIT */

.gfx-orbit::before{
  content:"";

  position:absolute;

  width:92px;
  height:92px;

  right:0;
  top:-14px;

  transform:translateX(34%);

  border-radius:50%;

  border:1px solid rgba(184,117,24,.22);

  box-shadow:
    inset 0 0 0 16px rgba(184,117,24,.018);

  z-index:0;

  pointer-events:none;
}

.gfx-orbit::after{
  content:"";

  position:absolute;

  width:8px;
  height:8px;

  right:30px;
  top:18px;

  border-radius:50%;

  background:rgba(184,117,24,.75);

  box-shadow:
    -18px 12px 0 -2px rgba(184,117,24,.30),
    -36px 4px 0 -3px rgba(184,117,24,.18);

  z-index:0;

  pointer-events:none;
}


/* DOTS */

.gfx-dots::before{
  content:"";

  position:absolute;

  width:64px;
  height:64px;

  left:0;
  bottom:2px;

  transform:translateX(-12%);

  opacity:.22;

  background-image:
    radial-gradient(
      circle,
      var(--fx-gold) 1.2px,
      transparent 1.4px
    );

  background-size:9px 9px;

  z-index:0;

  pointer-events:none;
}

.gfx-dots::after{
  content:"";

  position:absolute;

  width:90px;
  height:28px;

  left:20px;
  bottom:0;

  border-radius:50%;

  background:
    radial-gradient(
      ellipse at center,
      rgba(184,117,24,.12),
      rgba(184,117,24,.04) 42%,
      transparent 75%
    );

  filter:blur(6px);

  z-index:0;

  pointer-events:none;
}


/* WAVE */

.gfx-wave::before{
  content:"";

  position:absolute;

  width:120px;
  height:70px;

  right:0;
  top:8px;

  transform:translateX(20%);

  border:1px solid rgba(184,117,24,.18);

  border-left:none;
  border-bottom:none;

  border-radius:0 90px 0 0;

  z-index:0;

  pointer-events:none;
}

.gfx-wave::after{
  content:"";

  position:absolute;

  width:78px;
  height:40px;

  right:6px;
  top:28px;

  border:1px solid rgba(184,117,24,.12);

  border-left:none;
  border-bottom:none;

  border-radius:0 60px 0 0;

  z-index:0;

  pointer-events:none;
}


/* GRID */

.gfx-grid::before{
  content:"";

  position:absolute;

  width:76px;
  height:76px;

  left:0;
  top:18px;

  opacity:.14;

  background-image:
    linear-gradient(
      rgba(184,117,24,.45) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(184,117,24,.45) 1px,
      transparent 1px
    );

  background-size:12px 12px;

  z-index:0;

  pointer-events:none;
}

.gfx-grid::after{
  content:"";

  position:absolute;

  width:52px;
  height:52px;

  right:18px;
  bottom:10px;

  border-radius:50%;

  background:
    radial-gradient(
      circle,
      rgba(184,117,24,.12),
      transparent 68%
    );

  z-index:0;

  pointer-events:none;
}


/* HALO */

.gfx-halo::before{
  content:"";

  position:absolute;

  width:130px;
  height:130px;

  right:0;
  top:-10px;

  transform:translateX(23%);

  border-radius:50%;

  background:
    radial-gradient(
      circle,
      rgba(184,117,24,.14),
      rgba(184,117,24,.04) 42%,
      transparent 72%
    );

  z-index:0;

  pointer-events:none;
}

.gfx-halo::after{
  content:"";

  position:absolute;

  width:52px;
  height:52px;

  left:0;
  bottom:18px;

  transform:translateX(-20%);

  border-radius:50%;

  border:1px solid rgba(184,117,24,.18);

  z-index:0;

  pointer-events:none;
}


/* BAND */

.gfx-band::before{
  content:"";

  position:absolute;

  width:3px;
  height:64px;

  right:0;
  top:10px;

  border-radius:10px;

  background:
    linear-gradient(
      transparent,
      rgba(184,117,24,.75),
      transparent
    );

  z-index:0;

  pointer-events:none;
}

.gfx-band::after{
  content:"";

  position:absolute;

  width:44px;
  height:2px;

  left:0;
  bottom:12px;

  border-radius:10px;

  background:
    linear-gradient(
      90deg,
      rgba(184,117,24,.65),
      transparent
    );

  z-index:0;

  pointer-events:none;
}


/* =========================================================
   10. FEATURES
   class: fx-features
   ========================================================= */

.fx-features{
  position:relative !important;


  margin-left:auto !important;
  margin-right:auto !important;

  padding:8px 10px !important;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.92),
      rgba(251,247,241,.88)
    ) !important;

  border:1px solid rgba(184,117,24,.22) !important;

  border-radius:16px !important;

  box-shadow:
    0 10px 24px rgba(35,24,12,.04),
    inset 0 0 0 1px rgba(255,255,255,.55) !important;
}


/* top accent */

.fx-features::before{
  content:"";

  position:absolute;

  top:-1px;
  left:50%;

  width:72px;
  height:2px;

  transform:translateX(-50%);

  border-radius:20px;

  background:
    linear-gradient(
      90deg,
      transparent,
      var(--fx-gold),
      var(--fx-gold-2),
      var(--fx-gold),
      transparent
    );

  pointer-events:none;
}


.fx-features .elementor-icon-list-items{
  margin:0 !important;
  padding:0 !important;
}


/* rows */

.fx-features .elementor-icon-list-item{
  display:flex !important;
  align-items:center !important;

  min-height:auto !important;

  margin:0 !important;
  padding:8px 2px !important;

  background:transparent !important;

  border-bottom:1px solid rgba(184,117,24,.09) !important;
}

.fx-features .elementor-icon-list-item:last-child{
  border-bottom:none !important;
}

.fx-features .elementor-icon-list-item::after{
  display:none !important;
}


/* icons */

.fx-features .elementor-icon-list-icon{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  flex:0 0 22px !important;

  width:22px !important;
  height:22px !important;

  margin-left:7px !important;
  margin-right:0 !important;

  border:1px solid rgba(184,117,24,.16) !important;

  border-radius:7px !important;

  background:
    linear-gradient(
      145deg,
      rgba(184,117,24,.11),
      rgba(216,162,76,.04)
    ) !important;
}

.fx-features .elementor-icon-list-icon i,
.fx-features .elementor-icon-list-icon svg{
  width:11px !important;
  height:11px !important;

  color:var(--fx-gold) !important;
  fill:var(--fx-gold) !important;

  font-size:11px !important;
}


/* feature text */

.fx-features .elementor-icon-list-text{
  color:var(--fx-text) !important;

  font-size:13.5px !important;
  font-weight:650 !important;

  line-height:1.4 !important;
}


/* =========================================================
   11. TRUST
   class: fx-trust
   ========================================================= */

.fx-trust{
  position:relative;

  padding:10px 4px !important;

  background:rgba(255,255,255,.72) !important;

  border-top:1px solid rgba(184,117,24,.12) !important;
  border-bottom:1px solid rgba(184,117,24,.12) !important;

  border-left:none !important;
  border-right:none !important;

  border-radius:0 !important;

  box-shadow:none !important;
}

.fx-trust .elementor-icon{
  color:var(--fx-gold) !important;
  fill:var(--fx-gold) !important;
}


/* =========================================================
   12. ORDER
   class: fx-order
   ========================================================= */

.fx-order{
  position:relative;

  padding:14px !important;

  background:
    linear-gradient(
      160deg,
      rgba(255,255,255,.96),
      rgba(250,247,242,.94)
    ) !important;

  border:1px solid rgba(132,93,48,.12) !important;

  border-radius:18px !important;

  box-shadow:
    0 12px 30px rgba(30,20,10,.045) !important;
}


.fx-order input,
.fx-order textarea,
.fx-order select{
  min-height:48px !important;

  background:#fff !important;

  border:1px solid #ddd6cd !important;

  border-radius:11px !important;

  box-shadow:none !important;
}


.fx-order input:focus,
.fx-order textarea:focus,
.fx-order select:focus{
  border-color:var(--fx-gold) !important;

  outline:none !important;

  box-shadow:
    0 0 0 3px rgba(184,117,24,.08) !important;
}


.fx-order button[type="submit"],
.fx-order .elementor-button{
  min-height:52px !important;

  border:none !important;

  border-radius:12px !important;

  background:
    linear-gradient(
      135deg,
      #c98117,
      #a76212
    ) !important;

  color:#fff !important;

  font-weight:800 !important;

  box-shadow:
    0 9px 24px rgba(184,117,24,.20) !important;
}


/* =========================================================
   13. TABLET
   ========================================================= */

@media(min-width:768px) and (max-width:1024px){

  .fx-features{
  }

}


/* =========================================================
   14. MOBILE
   ========================================================= */

@media(max-width:767px){

  html,
  body,
  .elementor,
  .elementor-page{
    width:100%;
    max-width:100%;

    overflow-x:hidden !important;
  }


  /* sections */

  .fx-section{
    padding:14px 8px 22px !important;
  }


  /* titles */

  .fx-title{
    margin-bottom:10px !important;
  }

  .fx-title::after{
    width:38px;
  }


  /* standard images */

  .fx-image{
    padding:4px !important;

    border-radius:14px !important;
  }

  .fx-image img{
    border-radius:10px !important;
  }


  /* transparent image */

  .fx-image.fx-transparent{
    padding:0 !important;

    border-radius:0 !important;
  }

  .fx-image.fx-transparent img{
    border-radius:0 !important;
  }


  /* HERO WAVES + SOFT EQUALIZER */

  .fx-image.fx-transparent.hero-eq{
    background-size:
      100% 100%,
      100% 100%,
      100% 100%,
      100% 100%,

      6px 32px,
      6px 46px,
      6px 38px,
      6px 60px,
      6px 44px,
      6px 72px,
      6px 44px,
      6px 60px,
      6px 38px,
      6px 46px,
      6px 32px !important;

    background-position:
      center center,
      center center,
      center center,
      center center,

      16% 42%,
      23% 42%,
      30% 42%,
      37% 42%,
      44% 42%,
      51% 42%,
      58% 42%,
      65% 42%,
      72% 42%,
      79% 42%,
      86% 42% !important;
  }

  .fx-image.fx-transparent.hero-eq img{
    filter:
      drop-shadow(0 10px 9px rgba(30,20,10,.24))
      drop-shadow(0 0 6px rgba(184,117,24,.14)) !important;
  }


  /* orbit */

  .gfx-orbit::before{
    width:74px;
    height:74px;

    top:-10px;
  }

  .gfx-orbit::after{
    right:20px;
    top:16px;
  }


  /* dots */

  .gfx-dots::before{
    width:52px;
    height:52px;

    background-size:8px 8px;
  }


  /* wave */

  .gfx-wave::before{
    width:90px;
    height:52px;
  }

  .gfx-wave::after{
    width:58px;
    height:30px;

    right:6px;
    top:22px;
  }


  /* grid */

  .gfx-grid::before{
    width:58px;
    height:58px;

    background-size:10px 10px;
  }


  /* halo */

  .gfx-halo::before{
    width:100px;
    height:100px;
  }


  /* band */

  .gfx-band::before{
    height:54px;
  }


  /* features */

  .fx-features{

    padding:6px 8px !important;

    border-radius:14px !important;
  }

  .fx-features .elementor-icon-list-item{
    padding:7px 1px !important;
  }

  .fx-features .elementor-icon-list-icon{
    flex-basis:20px !important;

    width:20px !important;
    height:20px !important;

    margin-left:6px !important;
  }

  .fx-features .elementor-icon-list-text{
    font-size:13px !important;
    line-height:1.4 !important;
  }


  /* order */

  .fx-order{
    padding:12px !important;

    border-radius:16px !important;
  }

}
/* =========================================================
   DOTBOX — COUNTDOWN FINAL
   class: fx-countdown
   ========================================================= */


/* GLOBAL */

.fx-countdown,
.fx-countdown *{
  font-family:"GE SS Two", sans-serif !important;
  box-sizing:border-box !important;
}


/* MAIN */

.fx-countdown{
  width:100% !important;
  max-width:430px !important;

  margin:0 auto !important;
  padding:0 !important;

  background:transparent !important;

  border:none !important;
  border-radius:0 !important;

  box-shadow:none !important;

  overflow:visible !important;
}


/* COUNTDOWN ROW */

.fx-countdown .elementor-countdown-wrapper{
  display:flex !important;

  width:100% !important;

  justify-content:center !important;
  align-items:flex-start !important;

  gap:9px !important;

  padding:0 !important;
  margin:0 !important;

  background:transparent !important;
}


/* EACH UNIT */

.fx-countdown .elementor-countdown-item{
  flex:1 1 0 !important;

  width:auto !important;
  min-width:0 !important;
  max-width:82px !important;

  margin:0 !important;
  padding:0 !important;

  background:transparent !important;

  border:none !important;
  border-radius:0 !important;

  box-shadow:none !important;
}


/* NUMBER BOX */

.fx-countdown .elementor-countdown-digits{
  display:flex !important;

  width:100% !important;
  height:58px !important;

  align-items:center !important;
  justify-content:center !important;

  margin:0 !important;
  padding:2px 2px 0 !important;

  background:#1c1b19 !important;

  color:#ffffff !important;

  border:1px solid rgba(184,117,24,.45) !important;
  border-radius:11px !important;

  font-family:"GE SS Two", sans-serif !important;

  font-size:29px !important;
  font-weight:700 !important;

  line-height:1 !important;
  letter-spacing:0 !important;

  white-space:nowrap !important;

  box-shadow:
    0 6px 15px rgba(20,15,10,.10) !important;
}


/* LABEL */

.fx-countdown .elementor-countdown-label{
  display:block !important;

  width:100% !important;

  margin:7px 0 0 !important;
  padding:0 !important;

  color:#554f49 !important;

  font-family:"GE SS Two", sans-serif !important;

  font-size:11px !important;
  font-weight:500 !important;

  line-height:1.25 !important;

  text-align:center !important;

  white-space:nowrap !important;
}


/* MINUTES + SECONDS */

.fx-countdown .elementor-countdown-item:nth-last-child(2)
.elementor-countdown-digits,
.fx-countdown .elementor-countdown-item:last-child
.elementor-countdown-digits{

  background:#1c1b19 !important;

  color:#f0c66f !important;

  border-color:#b87518 !important;

  box-shadow:
    0 6px 15px rgba(20,15,10,.10),
    0 0 10px rgba(184,117,24,.08) !important;
}


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

@media(min-width:768px) and (max-width:1024px){

  .fx-countdown{
    max-width:400px !important;
  }

  .fx-countdown .elementor-countdown-wrapper{
    gap:8px !important;
  }

  .fx-countdown .elementor-countdown-item{
    max-width:78px !important;
  }

  .fx-countdown .elementor-countdown-digits{
    height:56px !important;

    font-size:28px !important;
  }

}


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

@media(max-width:767px){

  .fx-countdown{
    width:100% !important;
    max-width:100% !important;

    padding:0 4px !important;
  }


  .fx-countdown .elementor-countdown-wrapper{
    display:flex !important;

    width:100% !important;

    gap:6px !important;

    justify-content:space-between !important;
    align-items:flex-start !important;

    flex-wrap:nowrap !important;
  }


  .fx-countdown .elementor-countdown-item{
    flex:1 1 0 !important;

    width:calc((100% - 18px) / 4) !important;
    max-width:none !important;
    min-width:0 !important;
  }


  .fx-countdown .elementor-countdown-digits{
    width:100% !important;

    height:52px !important;

    padding:2px 1px 0 !important;

    border-radius:9px !important;

    font-size:25px !important;
    font-weight:700 !important;

    line-height:1 !important;
  }


  .fx-countdown .elementor-countdown-label{
    margin-top:6px !important;

    font-size:10px !important;
    font-weight:500 !important;

    line-height:1.2 !important;
  }

}


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

@media(max-width:380px){

  .fx-countdown{
    padding:0 2px !important;
  }


  .fx-countdown .elementor-countdown-wrapper{
    gap:5px !important;
  }


  .fx-countdown .elementor-countdown-item{
    width:calc((100% - 15px) / 4) !important;
  }


  .fx-countdown .elementor-countdown-digits{
    height:48px !important;

    font-size:23px !important;

    border-radius:8px !important;
  }


  .fx-countdown .elementor-countdown-label{
    margin-top:5px !important;

    font-size:9px !important;
  }

}/* End custom CSS */