فوتر3

 

<!-- ============================================= -->
<!--        PROFESSIONAL BLOGGER FOOTER            -->
<!-- ============================================= -->

<!-- Font Awesome 6 -->
<link href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css' rel='stylesheet'/>
<link href='https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;600;700;800;900&amp;display=swap' rel='stylesheet'/>

<style>
/*============================================
   PROFESSIONAL FOOTER - COMPLETE STYLES
============================================*/

/* === CSS Variables === */
#proFooter {
  --ft-bg-1: #0b0b1a;
  --ft-bg-2: #0f0f2a;
  --ft-bg-3: #141432;
  --ft-bg-card: rgba(255,255,255,0.025);
  --ft-accent: #6c63ff;
  --ft-accent2: #ff6b6b;
  --ft-gradient: linear-gradient(135deg, #6c63ff 0%, #ff6b6b 100%);
  --ft-gradient2: linear-gradient(135deg, #00c9ff 0%, #92fe9d 100%);
  --ft-text: #8b8baa;
  --ft-text-light: #a0a0c0;
  --ft-heading: #ffffff;
  --ft-link: #c0c0dd;
  --ft-border: rgba(255,255,255,0.06);
  --ft-border-hover: rgba(108,99,255,0.3);
  --ft-shadow: 0 4px 20px rgba(0,0,0,0.3);
  --ft-radius: 14px;
  --ft-radius-sm: 8px;
  --ft-transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  --ft-font: 'Cairo', 'Segoe UI', sans-serif;
}

/* === Reset === */
#proFooter, #proFooter * {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
#proFooter {
  font-family: var(--ft-font);
  direction: rtl;
  text-align: right;
  position: relative;
  overflow: hidden;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
#proFooter a {
  text-decoration: none;
  transition: var(--ft-transition);
}

/* === Animated Background === */
#proFooter .ft-bg-effects {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
}
#proFooter .ft-bg-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  animation: ftOrbFloat 25s ease-in-out infinite;
}
#proFooter .ft-bg-orb:nth-child(1) {
  width: 500px; height: 500px;
  background: rgba(108,99,255,0.06);
  top: -150px; right: -100px;
}
#proFooter .ft-bg-orb:nth-child(2) {
  width: 400px; height: 400px;
  background: rgba(255,107,107,0.05);
  bottom: -100px; left: -80px;
  animation-delay: -8s;
}
#proFooter .ft-bg-orb:nth-child(3) {
  width: 300px; height: 300px;
  background: rgba(0,201,255,0.04);
  top: 40%; left: 30%;
  animation-delay: -15s;
}
@keyframes ftOrbFloat {
  0%,100% { transform: translate(0,0) scale(1); }
  33% { transform: translate(40px,-40px) scale(1.1); }
  66% { transform: translate(-30px,30px) scale(0.95); }
}

/* === Wave Separator === */
#proFooter .ft-wave {
  position: relative;
  line-height: 0;
  margin-bottom: -3px;
  z-index: 1;
}
#proFooter .ft-wave svg {
  width: 100%;
  height: 110px;
  display: block;
}

/* === Features Bar === */
#proFooter .ft-features-bar {
  background: var(--ft-bg-2);
  border-bottom: 1px solid var(--ft-border);
  padding: 35px 0;
  position: relative;
  z-index: 1;
}
#proFooter .ft-features-grid {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 25px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
#proFooter .ft-feature-card {
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 18px 20px;
  background: var(--ft-bg-card);
  border: 1px solid var(--ft-border);
  border-radius: var(--ft-radius);
  transition: var(--ft-transition);
  cursor: default;
}
#proFooter .ft-feature-card:hover {
  background: rgba(108,99,255,0.06);
  border-color: var(--ft-border-hover);
  transform: translateY(-4px);
  box-shadow: 0 10px 30px rgba(108,99,255,0.15);
}
#proFooter .ft-feature-icon {
  width: 52px;
  height: 52px;
  background: var(--ft-gradient);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: #fff;
  flex-shrink: 0;
  box-shadow: 0 5px 15px rgba(108,99,255,0.3);
}
#proFooter .ft-feature-info h4 {
  color: var(--ft-heading);
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 2px;
}
#proFooter .ft-feature-info p {
  color: var(--ft-text);
  font-size: 12px;
  font-weight: 400;
}

/* === Main Footer Area === */
#proFooter .ft-main {
  background: var(--ft-bg-1);
  padding: 65px 0 45px;
  position: relative;
  z-index: 1;
}
#proFooter .ft-container {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 25px;
}
#proFooter .ft-grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1.3fr;
  gap: 45px;
}
#proFooter .ft-col {
  position: relative;
}

/* === Widget Titles === */
#proFooter .ft-section .widget > h2,
#proFooter .ft-section .widget > .title,
#proFooter .ft-section .widget-title {
  color: var(--ft-heading) !important;
  font-family: var(--ft-font) !important;
  font-size: 19px !important;
  font-weight: 800 !important;
  margin-bottom: 22px !important;
  padding-bottom: 14px !important;
  position: relative !important;
  border: none !important;
  background: none !important;
}
#proFooter .ft-section .widget > h2::after,
#proFooter .ft-section .widget > .title::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 45px;
  height: 3px;
  background: var(--ft-gradient);
  border-radius: 10px;
}
#proFooter .ft-section .widget > h2::before,
#proFooter .ft-section .widget > .title::before {
  content: '';
  position: absolute;
  bottom: 0;
  right: 55px;
  width: 8px;
  height: 3px;
  background: var(--ft-accent2);
  border-radius: 10px;
}

/* === Widget Content General === */
#proFooter .ft-section .widget {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
#proFooter .ft-section .widget .widget-content {
  color: var(--ft-text);
  font-size: 14px;
  line-height: 1.9;
}

/* ========= ABOUT WIDGET STYLES ========= */
#proFooter .ft-about-wrap .ft-logo-area {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}
#proFooter .ft-about-wrap .ft-logo-icon {
  width: 50px;
  height: 50px;
  background: var(--ft-gradient);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: #fff;
  box-shadow: 0 5px 20px rgba(108,99,255,0.35);
}
#proFooter .ft-about-wrap .ft-logo-text {
  font-size: 26px;
  font-weight: 900;
  background: var(--ft-gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
#proFooter .ft-about-wrap .ft-about-desc {
  color: var(--ft-text);
  font-size: 14px;
  line-height: 2;
  margin-bottom: 22px;
}
#proFooter .ft-about-wrap .ft-blog-stats {
  display: flex;
  gap: 15px;
  margin-bottom: 22px;
  flex-wrap: wrap;
}
#proFooter .ft-about-wrap .ft-stat-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  background: var(--ft-bg-card);
  border: 1px solid var(--ft-border);
  border-radius: 20px;
  color: var(--ft-text-light);
  font-size: 12px;
  font-weight: 600;
}
#proFooter .ft-about-wrap .ft-stat-badge i {
  color: var(--ft-accent);
  font-size: 11px;
}

/* Social Icons */
#proFooter .ft-social {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
#proFooter .ft-social a {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,0.04);
  border: 1px solid var(--ft-border);
  border-radius: 12px;
  color: var(--ft-text-light);
  font-size: 17px;
  transition: var(--ft-transition);
}
#proFooter .ft-social a:hover {
  transform: translateY(-5px) scale(1.05);
  box-shadow: 0 10px 25px rgba(0,0,0,0.3);
}
#proFooter .ft-social a.s-fb:hover { background:#1877f2; color:#fff; border-color:#1877f2; }
#proFooter .ft-social a.s-tw:hover { background:#000; color:#fff; border-color:#000; }
#proFooter .ft-social a.s-ig:hover { background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888); color:#fff; border-color:transparent; }
#proFooter .ft-social a.s-yt:hover { background:#ff0000; color:#fff; border-color:#ff0000; }
#proFooter .ft-social a.s-tg:hover { background:#0088cc; color:#fff; border-color:#0088cc; }
#proFooter .ft-social a.s-wa:hover { background:#25d366; color:#fff; border-color:#25d366; }
#proFooter .ft-social a.s-li:hover { background:#0077b5; color:#fff; border-color:#0077b5; }
#proFooter .ft-social a.s-pi:hover { background:#e60023; color:#fff; border-color:#e60023; }
#proFooter .ft-social a.s-tk:hover { background:#000; color:#fff; border-color:#000; }
#proFooter .ft-social a.s-sc:hover { background:#fffc00; color:#000; border-color:#fffc00; }
#proFooter .ft-social a.s-gh:hover { background:#333; color:#fff; border-color:#333; }
#proFooter .ft-social a.s-em:hover { background:var(--ft-gradient); color:#fff; border-color:transparent; }
#proFooter .ft-social a.s-rs:hover { background:#f26522; color:#fff; border-color:#f26522; }

/* ========= LINKS LIST STYLES ========= */
#proFooter .ft-links-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
#proFooter .ft-links-list li {
  margin-bottom: 5px;
}
#proFooter .ft-links-list li a {
  color: var(--ft-link);
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  border-radius: var(--ft-radius-sm);
  border: 1px solid transparent;
  transition: var(--ft-transition);
}
#proFooter .ft-links-list li a .link-icon {
  width: 28px;
  height: 28px;
  background: rgba(108,99,255,0.1);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  color: var(--ft-accent);
  transition: var(--ft-transition);
  flex-shrink: 0;
}
#proFooter .ft-links-list li a:hover {
  color: var(--ft-heading);
  background: rgba(108,99,255,0.06);
  border-color: var(--ft-border-hover);
  padding-right: 20px;
}
#proFooter .ft-links-list li a:hover .link-icon {
  background: var(--ft-gradient);
  color: #fff;
}

/* Blogger LinkList widget override */
#proFooter .ft-section .LinkList .widget-content ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
#proFooter .ft-section .LinkList .widget-content ul li {
  margin-bottom: 5px !important;
}
#proFooter .ft-section .LinkList .widget-content ul li a {
  color: var(--ft-link) !important;
  font-size: 14px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 9px 14px !important;
  border-radius: var(--ft-radius-sm) !important;
  border: 1px solid transparent !important;
  transition: var(--ft-transition) !important;
}
#proFooter .ft-section .LinkList .widget-content ul li a::before {
  content: '\f0da';
  font-family: 'Font Awesome 6 Free';
  font-weight: 900;
  font-size: 10px;
  color: var(--ft-accent);
  width: 28px;
  height: 28px;
  background: rgba(108,99,255,0.1);
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: var(--ft-transition);
}
#proFooter .ft-section .LinkList .widget-content ul li a:hover {
  color: var(--ft-heading) !important;
  background: rgba(108,99,255,0.06) !important;
  border-color: var(--ft-border-hover) !important;
  padding-right: 20px !important;
}
#proFooter .ft-section .LinkList .widget-content ul li a:hover::before {
  background: var(--ft-gradient);
  color: #fff;
}

/* ========= LABELS / CATEGORIES STYLES ========= */
#proFooter .ft-section .Label .widget-content {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}
#proFooter .ft-section .Label .widget-content ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}
#proFooter .ft-section .Label .widget-content li {
  display: inline-flex !important;
  margin: 0 !important;
}
#proFooter .ft-section .Label .widget-content a,
#proFooter .ft-section .Label .cloud-label-widget-content a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 7px 16px !important;
  background: var(--ft-bg-card) !important;
  border: 1px solid var(--ft-border) !important;
  border-radius: 22px !important;
  color: var(--ft-link) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  transition: var(--ft-transition) !important;
  white-space: nowrap !important;
}
#proFooter .ft-section .Label .widget-content a:hover,
#proFooter .ft-section .Label .cloud-label-widget-content a:hover {
  background: var(--ft-gradient) !important;
  color: #fff !important;
  border-color: transparent !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 6px 20px rgba(108,99,255,0.3) !important;
}
#proFooter .ft-section .Label .widget-content .label-count,
#proFooter .ft-section .Label .label-count {
  background: rgba(255,255,255,0.15) !important;
  padding: 1px 8px !important;
  border-radius: 10px !important;
  font-size: 11px !important;
  margin-right: 4px !important;
}

/* ========= CONTACT INFO STYLES ========= */
#proFooter .ft-contact-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 16px;
  padding: 14px 16px;
  background: var(--ft-bg-card);
  border: 1px solid var(--ft-border);
  border-radius: var(--ft-radius);
  transition: var(--ft-transition);
}
#proFooter .ft-contact-item:hover {
  background: rgba(108,99,255,0.05);
  border-color: var(--ft-border-hover);
  transform: translateX(-3px);
}
#proFooter .ft-contact-icon {
  width: 42px;
  height: 42px;
  background: var(--ft-gradient);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 16px;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(108,99,255,0.25);
}
#proFooter .ft-contact-info h5 {
  color: var(--ft-heading);
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 3px;
}
#proFooter .ft-contact-info p {
  color: var(--ft-text);
  font-size: 13px;
  line-height: 1.6;
}
#proFooter .ft-contact-info a {
  color: var(--ft-text);
  font-size: 13px;
}
#proFooter .ft-contact-info a:hover {
  color: var(--ft-accent);
}

/* Working Hours */
#proFooter .ft-hours {
  margin-top: 18px;
  padding: 16px;
  background: rgba(108,99,255,0.04);
  border: 1px solid rgba(108,99,255,0.1);
  border-radius: var(--ft-radius);
}
#proFooter .ft-hours h5 {
  color: var(--ft-heading);
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 8px;
}
#proFooter .ft-hours h5 i {
  color: var(--ft-accent);
}
#proFooter .ft-hours-row {
  display: flex;
  justify-content: space-between;
  padding: 5px 0;
  font-size: 13px;
  color: var(--ft-text);
  border-bottom: 1px dashed var(--ft-border);
}
#proFooter .ft-hours-row:last-child {
  border-bottom: none;
}
#proFooter .ft-hours-row .ft-open {
  color: #4ade80;
  font-weight: 700;
  font-size: 12px;
}
#proFooter .ft-hours-row .ft-closed {
  color: var(--ft-accent2);
  font-weight: 700;
  font-size: 12px;
}

/* ========= HTML Widget Override ========= */
#proFooter .ft-section .HTML .widget-content {
  color: var(--ft-text) !important;
  font-size: 14px !important;
  line-height: 1.9 !important;
}
#proFooter .ft-section .HTML .widget-content a {
  color: var(--ft-accent) !important;
}
#proFooter .ft-section .HTML .widget-content a:hover {
  color: var(--ft-accent2) !important;
}

/* ========= DIVIDER ========= */
#proFooter .ft-divider {
  border: none;
  border-top: 1px solid var(--ft-border);
  margin: 0;
}

/* ========= FOOTER BOTTOM ========= */
#proFooter .ft-bottom {
  background: var(--ft-bg-2);
  padding: 28px 0;
  position: relative;
  z-index: 1;
  border-top: 1px solid var(--ft-border);
}
#proFooter .ft-bottom-inner {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 25px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 15px;
}
#proFooter .ft-copyright {
  color: var(--ft-text);
  font-size: 14px;
  font-weight: 400;
}
#proFooter .ft-copyright i.fa-heart {
  color: var(--ft-accent2);
  animation: ftHeartBeat 1.5s ease-in-out infinite;
  display: inline-block;
}
@keyframes ftHeartBeat {
  0%,100% { transform: scale(1); }
  50% { transform: scale(1.2); }
}
#proFooter .ft-copyright a {
  color: var(--ft-accent);
  font-weight: 700;
}
#proFooter .ft-copyright a:hover {
  color: var(--ft-accent2);
}
#proFooter .ft-bottom-nav {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
#proFooter .ft-bottom-nav a {
  color: var(--ft-text);
  font-size: 13px;
  padding: 6px 14px;
  border-radius: 20px;
  border: 1px solid var(--ft-border);
  background: var(--ft-bg-card);
  transition: var(--ft-transition);
}
#proFooter .ft-bottom-nav a:hover {
  background: var(--ft-gradient);
  color: #fff;
  border-color: transparent;
  transform: translateY(-2px);
}

/* ========= SUPER BOTTOM BAR ========= */
#proFooter .ft-super-bottom {
  background: #06060f;
  padding: 14px 0;
  text-align: center;
  position: relative;
  z-index: 1;
  border-top: 1px solid rgba(255,255,255,0.03);
}
#proFooter .ft-super-bottom p {
  color: rgba(255,255,255,0.25);
  font-size: 12px;
  font-family: var(--ft-font);
}
#proFooter .ft-super-bottom a {
  color: rgba(108,99,255,0.5);
}
#proFooter .ft-super-bottom a:hover {
  color: var(--ft-accent);
}

/* ========= BACK TO TOP ========= */
#ftBackToTop {
  position: fixed;
  bottom: 30px;
  left: 30px;
  width: 52px;
  height: 52px;
  background: var(--ft-gradient, linear-gradient(135deg, #6c63ff, #ff6b6b));
  color: #fff;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px) scale(0.8);
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 8px 30px rgba(108,99,255,0.45);
  font-family: 'Font Awesome 6 Free';
  font-weight: 900;
  outline: none;
}
#ftBackToTop.ft-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}
#ftBackToTop:hover {
  transform: translateY(-6px) scale(1.1);
  box-shadow: 0 14px 40px rgba(108,99,255,0.55);
}
#ftBackToTop::after {
  content: '';
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 2px solid rgba(108,99,255,0.3);
  animation: ftPulseRing 2s ease-out infinite;
}
@keyframes ftPulseRing {
  0% { transform: scale(1); opacity: 1; }
  100% { transform: scale(1.4); opacity: 0; }
}

/* ========= RESPONSIVE DESIGN ========= */
@media (max-width: 1100px) {
  #proFooter .ft-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 35px;
  }
  #proFooter .ft-features-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 768px) {
  #proFooter .ft-grid {
    grid-template-columns: 1fr;
    gap: 35px;
  }
  #proFooter .ft-features-grid {
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  #proFooter .ft-main {
    padding: 45px 0 30px;
  }
  #proFooter .ft-bottom-inner {
    flex-direction: column;
    text-align: center;
  }
  #proFooter .ft-bottom-nav {
    justify-content: center;
  }
  #proFooter .ft-social {
    justify-content: center;
  }
  #proFooter .ft-wave svg {
    height: 60px;
  }
}
@media (max-width: 500px) {
  #proFooter .ft-features-grid {
    grid-template-columns: 1fr;
  }
  #proFooter .ft-feature-card {
    padding: 14px;
  }
  #proFooter .ft-grid {
    gap: 28px;
  }
  #proFooter .ft-bottom-nav a {
    font-size: 12px;
    padding: 5px 10px;
  }
  #ftBackToTop {
    bottom: 20px;
    left: 20px;
    width: 45px;
    height: 45px;
    font-size: 17px;
  }
}

/* ========= PRINT STYLES ========= */
@media print {
  #proFooter { display: none !important; }
  #ftBackToTop { display: none !important; }
}
</style>

<!-- ============ FOOTER HTML ============ -->
<footer id='proFooter'>

  <!-- Background Effects -->
  <div class='ft-bg-effects'>
    <div class='ft-bg-orb'/>
    <div class='ft-bg-orb'/>
    <div class='ft-bg-orb'/>
  </div>

  <!-- Wave Separator -->
  <div class='ft-wave'>
    <svg preserveAspectRatio='none' viewBox='0 0 1440 110' xmlns='http://www.w3.org/2000/svg'>
      <path d='M0,64 C180,100 360,20 540,55 C720,90 900,30 1080,60 C1260,90 1380,40 1440,50 L1440,110 L0,110 Z' fill='#0f0f2a'/>
      <path d='M0,85 C240,40 480,100 720,70 C960,40 1200,95 1440,65 L1440,110 L0,110 Z' fill='#0b0b1a' fill-opacity='0.6'/>
      <path d='M0,95 C360,75 720,105 1080,80 C1260,68 1380,92 1440,85 L1440,110 L0,110 Z' fill='#0b0b1a'/>
    </svg>
  </div>

  <!-- Features Bar -->
  <div class='ft-features-bar'>
    <div class='ft-features-grid'>
      <div class='ft-feature-card'>
        <div class='ft-feature-icon'><i class='fas fa-pen-fancy'/></div>
        <div class='ft-feature-info'>
          <h4>محتوى حصري</h4>
          <p>مقالات متجددة يومياً</p>
        </div>
      </div>
      <div class='ft-feature-card'>
        <div class='ft-feature-icon'><i class='fas fa-shield-halved'/></div>
        <div class='ft-feature-info'>
          <h4>موثوق وآمن</h4>
          <p>مصادر موثوقة 100%</p>
        </div>
      </div>
      <div class='ft-feature-card'>
        <div class='ft-feature-icon'><i class='fas fa-comments'/></div>
        <div class='ft-feature-info'>
          <h4>دعم مستمر</h4>
          <p>تواصل معنا في أي وقت</p>
        </div>
      </div>
      <div class='ft-feature-card'>
        <div class='ft-feature-icon'><i class='fas fa-rocket'/></div>
        <div class='ft-feature-info'>
          <h4>أداء عالي</h4>
          <p>تصفح سريع وسلس</p>
        </div>
      </div>
    </div>
  </div>

  <!-- Main Footer Content -->
  <div class='ft-main'>
    <div class='ft-container'>
      <div class='ft-grid'>

        <!-- Column 1: About -->
        <div class='ft-col'>
          <b:section class='ft-section' id='footer_col_about' maxwidgets='1' showaddelement='yes'>
          </b:section>
        </div>

        <!-- Column 2: Quick Links -->
        <div class='ft-col'>
          <b:section class='ft-section' id='footer_col_links' maxwidgets='1' showaddelement='yes'>
          </b:section>
        </div>

        <!-- Column 3: Categories -->
        <div class='ft-col'>
          <b:section class='ft-section' id='footer_col_categories' maxwidgets='1' showaddelement='yes'>
          </b:section>
        </div>

        <!-- Column 4: Contact -->
        <div class='ft-col'>
          <b:section class='ft-section' id='footer_col_contact' maxwidgets='1' showaddelement='yes'>
          </b:section>
        </div>

      </div>
    </div>
  </div>

  <!-- Footer Bottom -->
  <div class='ft-bottom'>
    <div class='ft-bottom-inner'>
      <div class='ft-copyright'>
        صُنع بـ <i class='fas fa-heart'/> | جميع الحقوق محفوظة &#169; 
        <span class='ft-auto-year'/> 
        <a expr:href='data:blog.homepageUrl'><data:blog.title/></a>
      </div>
      <nav class='ft-bottom-nav'>
        <a href='/p/about.html'><i class='fas fa-info-circle'/> من نحن</a>
        <a href='/p/privacy-policy.html'><i class='fas fa-lock'/> الخصوصية</a>
        <a href='/p/terms.html'><i class='fas fa-file-contract'/> الشروط</a>
        <a href='/p/contact.html'><i class='fas fa-envelope'/> اتصل بنا</a>
        <a href='/sitemap.xml'><i class='fas fa-sitemap'/> خريطة الموقع</a>
      </nav>
    </div>
  </div>

  <!-- Super Bottom -->
  <div class='ft-super-bottom'>
    <p>مدعوم بواسطة <a href='https://www.blogger.com' rel='nofollow' target='_blank'>Blogger</a> | تم التصميم باحترافية &#x1F3A8;</p>
  </div>

</footer>

<!-- Back to Top Button -->
<button id='ftBackToTop' title='العودة للأعلى'>
  <i class='fas fa-arrow-up'/>
</button>

<!-- Footer JavaScript -->
<script>
//<![CDATA[
(function(){
  // Auto Year
  var yearEls = document.querySelectorAll('.ft-auto-year');
  var currentYear = new Date().getFullYear();
  for(var i=0; i<yearEls.length; i++){
    yearEls[i].textContent = currentYear;
  }

  // Back to Top
  var backBtn = document.getElementById('ftBackToTop');
  if(backBtn){
    var ticking = false;
    window.addEventListener('scroll', function(){
      if(!ticking){
        window.requestAnimationFrame(function(){
          if(window.pageYOffset > 450){
            backBtn.classList.add('ft-visible');
          } else {
            backBtn.classList.remove('ft-visible');
          }
          ticking = false;
        });
        ticking = true;
      }
    });
    backBtn.addEventListener('click', function(e){
      e.preventDefault();
      window.scrollTo({top:0, behavior:'smooth'});
    });
  }

  // Smooth reveal animation on scroll
  var observer = new IntersectionObserver(function(entries){
    entries.forEach(function(entry){
      if(entry.isIntersecting){
        entry.target.style.opacity = '1';
        entry.target.style.transform = 'translateY(0)';
      }
    });
  }, {threshold: 0.1});

  document.querySelectorAll('#proFooter .ft-col, #proFooter .ft-feature-card').forEach(function(el){
    el.style.opacity = '0';
    el.style.transform = 'translateY(30px)';
    el.style.transition = 'all 0.6s cubic-bezier(0.4, 0, 0.2, 1)';
    observer.observe(el);
  });

  // Stagger animation delay
  document.querySelectorAll('#proFooter .ft-feature-card').forEach(function(el, index){
    el.style.transitionDelay = (index * 0.1) + 's';
  });
  document.querySelectorAll('#proFooter .ft-col').forEach(function(el, index){
    el.style.transitionDelay = (index * 0.15) + 's';
  });

})();
//]]>
</script>

<!-- END PROFESSIONAL FOOTER -->

Post a Comment

Previous Post Next Post

ADS

ADS

Share to other apps
Copy Post Link

Contact Form