.elementor-18858 .elementor-element.elementor-element-ffa7204{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}.elementor-widget .tippy-tooltip .tippy-content{text-align:center;}/* Start custom CSS for html, class: .elementor-element-b9fa489 */.dr-ft *{
  box-sizing:border-box;
}

.dr-ft{

  /* المساحة اللي فوق الفوتر: صفر في كل الصفحات،
     وبتتفعّل بس في الصفحة اللي فيها سيكشن المدوّنة اللي بيعمل أوفرلاب (تحت) */
  --overlap:0px;

  --bg:#0C0A09;
  --paper:#FDF8EE;
  --mute:rgba(253,248,238,.62);
  --line:rgba(253,248,238,.14);
  --tan:#D1C2AB;
  --accent:#EF4123;

  --font:"DR Ping",system-ui,-apple-system,sans-serif;
  --font-num:"Manrope",system-ui,-apple-system,sans-serif;

  position:relative;
  z-index:0;

  background:var(--bg);
  color:var(--paper);

  direction:rtl;
  text-align:right;

  font-family:var(--font);

  padding:
    calc(var(--overlap) + clamp(36px,4vw,64px))
    clamp(16px,2.5vw,32px)
    clamp(26px,3vw,40px);
}


/* =====================================================
   OVERLAP
   أي صفحة فيها سيكشن المدوّنة (الشورتكود [dr_journal] = .dr-jr)
   الفوتر بيسيبله مساحة من فوق. باقي الصفحات من غير مساحة.
   الجافاسكريبت بيقرا الرقم من السيكشن نفسه، فلو غيّرتوا
   overlap في الشورتكود الفوتر بيتظبط لوحده.
===================================================== */

body:has(.dr-jr) .dr-ft,
body:has(.dr-ft-overlap) .dr-ft,
.dr-ft.is-overlap{
  --overlap:200px;
}


.dr-ft__inner{
  max-width:1100px;
  margin:0 auto;
}


/* =====================================================
   LOGO
===================================================== */

.dr-ft__logo{
  text-align:center;
  padding-bottom:clamp(34px,4vw,56px);
}


.dr-ft__logo img{

  width:clamp(150px,15vw,210px);
  height:auto;

  display:inline-block;

  filter:brightness(0) invert(1);

}


/* =====================================================
   SLOGAN
===================================================== */

.dr-ft__slogan{

  margin:
    clamp(8px,1vw,12px)
    0
    0 !important;

  font-family:var(--font) !important;

  font-weight:500 !important;

  font-size:clamp(13px,1vw,15px) !important;

  line-height:1.8 !important;

  color:var(--mute) !important;

  letter-spacing:0;

}


/* =====================================================
   COLUMNS
===================================================== */

.dr-ft__cols{

  display:grid;

  grid-template-columns:
    1fr 1fr 1.2fr 1fr;

  gap:clamp(24px,3vw,44px);

  padding:clamp(30px,3.6vw,50px) 0;

  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);

  text-align:center;

}


/* =====================================================
   TITLES
===================================================== */

.dr-ft h4{

  font-family:var(--font) !important;

  font-weight:700 !important;

  font-size:clamp(11.5px,.9vw,13px) !important;

  letter-spacing:.08em;

  color:var(--paper) !important;

  margin:0 0 16px !important;

}


.dr-ft h4:not(:first-child){

  margin-top:
    clamp(28px,2.8vw,38px) !important;

}


/* =====================================================
   TEXT
===================================================== */

.dr-ft p,
.dr-ft address{

  font-family:var(--font) !important;

  font-weight:400 !important;

  font-style:normal;

  font-size:
    clamp(13px,1vw,14.5px) !important;

  line-height:2.05 !important;

  color:var(--mute) !important;

  margin:0 !important;

}


.dr-ft a{

  color:inherit !important;

  text-decoration:none !important;

  transition:
    color .3s ease,
    border-color .3s ease,
    opacity .3s ease,
    transform .3s ease;

}


.dr-ft a:hover{

  color:var(--accent) !important;

}


/* =====================================================
   GOOGLE MAP
===================================================== */

.dr-ft__map{

  display:inline-flex;

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

  gap:7px;

  margin-top:12px;

  padding-bottom:2px;

  border-bottom:
    1px solid rgba(209,194,171,.45);

  font-family:var(--font) !important;

  font-weight:600 !important;

  font-size:
    clamp(12px,.9vw,13px) !important;

  line-height:1.6;

  color:var(--paper) !important;

}


.dr-ft__map svg{

  width:15px;
  height:15px;

  flex:0 0 15px;

  fill:none;

  stroke:currentColor;

  stroke-width:1.5;

  stroke-linecap:round;
  stroke-linejoin:round;

}


.dr-ft__map:hover{

  color:var(--accent) !important;

  border-color:var(--accent);

}


.dr-ft__map:focus-visible{

  outline:2px solid var(--tan);

  outline-offset:5px;

  border-radius:2px;

}


/* =====================================================
   PHONE + EMAIL
===================================================== */

.dr-ft__tel{

  display:flex;

  align-items:baseline;
  justify-content:center;

  gap:10px;

  margin-top:4px !important;

}


.dr-ft__tel-label{

  font-family:var(--font) !important;

  font-weight:500 !important;

  font-size:clamp(11.5px,.85vw,12.5px) !important;

  line-height:1 !important;

  color:var(--mute) !important;

}


.dr-ft__tel a{

  display:inline-block;

  direction:ltr;

  font-family:var(--font-num) !important;

  font-weight:700 !important;

  font-size:
    clamp(18px,1.55vw,21px) !important;

  line-height:1.3 !important;

  letter-spacing:-.015em;

  color:var(--paper) !important;

}


.dr-ft__tel + .dr-ft__tel{

  margin-top:8px !important;

}


.dr-ft__mail a{

  display:inline-block;

  direction:ltr;

  font-family:var(--font-num) !important;

  font-weight:600 !important;

  font-size:
    clamp(14px,1.1vw,16px) !important;

  line-height:1.5 !important;

  color:var(--paper) !important;

  padding-bottom:2px;

  border-bottom:
    1px solid rgba(209,194,171,.45);

  word-break:break-all;

}


.dr-ft__mail a:hover{

  color:var(--accent) !important;

  border-color:var(--accent);

}


/* =====================================================
   WHATSAPP OFFERS BUTTON
===================================================== */

.dr-ft a.dr-ft__wa{

  display:inline-flex;

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

  gap:10px;

  margin-top:20px;

  padding:13px 24px;

  border-radius:999px;

  background:#0D5543 !important;

  color:var(--paper) !important;

  border:1px solid rgba(253,248,238,.12);

  font-family:var(--font) !important;

  font-weight:700 !important;

  font-size:
    clamp(13.5px,1vw,15px) !important;

  line-height:1.2 !important;

  letter-spacing:0 !important;

  text-transform:none !important;

  transition:
    background .3s ease,
    transform .3s ease,
    color .3s ease;

}


.dr-ft a.dr-ft__wa svg{

  width:18px;
  height:18px;

  flex:0 0 18px;

  fill:currentColor;

}


.dr-ft a.dr-ft__wa:hover{

  background:var(--accent) !important;

  color:#fff !important;

  transform:translateY(-2px);

}


.dr-ft a.dr-ft__wa:focus-visible{

  outline:2px solid var(--tan);

  outline-offset:4px;

}


/* =====================================================
   SOCIAL
===================================================== */

.dr-ft__social{

  display:flex;

  justify-content:center;

  gap:22px;

}


.dr-ft__social a{

  display:inline-flex;

  opacity:.85;

  transition:
    transform .3s ease,
    opacity .3s ease;

}


.dr-ft__social a:hover{

  transform:translateY(-3px);

  opacity:1;

}


.dr-ft__social svg{

  width:19px;
  height:19px;

  fill:var(--paper);

  transition:
    fill .3s ease;

}


.dr-ft__social a:hover svg{

  fill:var(--accent);

}


/* =====================================================
   PAYMENT
===================================================== */

.dr-ft__pay{

  display:flex;

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

  gap:15px;

  flex-wrap:wrap;

}


.dr-ft__pay img{

  height:16px;

  width:auto;

  display:block;

  opacity:.82;

  transition:
    opacity .3s ease;

}


.dr-ft__pay img:hover{

  opacity:1;

}


/* =====================================================
   BOTTOM BAR
===================================================== */

.dr-ft__bar{

  display:flex;

  align-items:center;

  justify-content:space-between;

  gap:20px;

  flex-wrap:wrap;

  padding-top:
    clamp(20px,2.4vw,30px);

}


.dr-ft__nav{

  display:flex;

  gap:
    clamp(14px,1.6vw,26px);

  flex-wrap:wrap;

}


.dr-ft__nav a{

  font-family:var(--font) !important;

  font-weight:500 !important;

  font-size:
    clamp(12.5px,.95vw,14px) !important;

  color:var(--mute) !important;

}


.dr-ft__nav a:hover{

  color:var(--accent) !important;

}


.dr-ft__copy{

  font-family:var(--font) !important;

  font-size:
    clamp(11.5px,.9vw,13px) !important;

  color:var(--mute) !important;

  margin:0 !important;

  line-height:1.8 !important;

}


/* =====================================================
   TABLET — 2 × 2
===================================================== */

@media (max-width:1100px) and (min-width:821px){

  .dr-ft__cols{

    grid-template-columns:1fr 1fr;

    gap:40px 48px;

  }

}


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

@media (max-width:820px){

  .dr-ft{

    padding-top:
      calc(var(--overlap) + 34px);

  }


  .dr-ft__logo{

    padding-bottom:32px;

  }


  .dr-ft__slogan{

    margin-top:8px !important;

    font-size:13.5px !important;

  }


  .dr-ft__cols{

    grid-template-columns:1fr;

    gap:34px;

    padding:32px 0;

  }


  .dr-ft h4+h4{

    margin-top:
      22px !important;

  }


  .dr-ft__bar{

    flex-direction:column;

    text-align:center;

  }


  .dr-ft__nav{

    justify-content:center;

  }


  .dr-ft__copy{

    text-align:center;

  }

}


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

@media (max-width:480px){

  .dr-ft a.dr-ft__wa{

    width:100%;

  }


  .dr-ft__nav{

    gap:12px 18px;

  }


  .dr-ft__tel a{

    font-size:
      20px !important;

  }

}


/* =====================================================
   REDUCED MOTION
===================================================== */

@media (prefers-reduced-motion:reduce){

  .dr-ft__social a,
  .dr-ft a.dr-ft__wa,
  .dr-ft a,
  .dr-ft__pay img{

    transition:none;

  }

}/* End custom CSS */