@media (max-width: 480px) {
    .navbar .navbar-toggler {
        min-width: auto !important;
        position: relative;
        inset-inline-start: 10px !important;

    }
}
.hero-caption2 {
    flex: 0 0 80% !important;
    max-width: 80% !important;
    z-index: 999;
    min-height: 150px;
    top: 20vh;
    position: relative;
    width: auto;
    left: 10%;
    right: 10%;
    margin: 0;
}

.hero-caption2 .hero-title {
    font-size: 60px;
    color: #E9DFCF;
    margin-bottom: 5px !important;
    text-shadow: none !important;
    text-align: start;
}

.hero-caption2 .hero-description {
    font-size: 20px;
    color: #D6CDCB;
    margin-top: 0;
}

.hero-caption2 .hero-action {
    color: #161616;
    font-size: 16px;
    opacity: 1;
    display: flex;
}

@media (max-width: 576px) {
  

    .hero-caption2 {
        flex: 0 0 96% !important;
        max-width: 96% !important;
        z-index: 999;
        min-height: 150px;
        top: 18vh;
        position: relative;
        width: auto;
        left: 2%;
        right: 2%;
        margin: 0;
        padding: 0 !important;
    }

    .hero-caption2 .hero-title {
        font-size: 36px !important;
        line-height: 1.5;
    }
}

#ehsanlogo {
    position: fixed;
    right: 22px;
    inset-block-end: 78px;
    left: auto;
    background: transparent;
    align-items: center;
    justify-content: center;
    transition: background 0.3s;
    z-index: 9999 !important;
}

.uwy .uai img:not(.userway_check_on),
.uwy .ulsti img:not(.userway_check_on),
body .uwy .uai img:not(.userway_check_on),
body .uwy .ulsti img:not(.userway_check_on) {
    width: 56px !important;
    height: 56px !important;
}

.hero-slider .swiper-pagination {
    padding: 5px 0;
    bottom: 30px !important;
}



 :root {
          /* Font */
          --dga-font-regular: "IBMPlexSansArabic", sans-serif;
          --dga-font-medium: "IBMPlexSansArabic-Medium", sans-serif;
          --dga-font-bold: "IBMPlexSansArabic-Bold", sans-serif;
          /* Spacing & Radius */
          --dga-radius-4: 4px;
          --dga-space-4: 4px;
          --dga-space-8: 8px;
          --dga-space-12: 12px;
          --dga-space-16: 16px;
          /* Focus */
          --dga-focus-inner: 3px;
          --dga-focus-outer: 2px;
          /* Sizes */
          --dga-size-lg: 40px;
          --dga-size-md: 32px;
          --dga-size-sm: 24px;
          --dga-font-lg: 16px;
          --dga-font-md: 14px;
          --dga-font-sm: 12px;
          --dga-icon-lg: 24px;
          --dga-icon-md: 20px;
          --dga-icon-sm: 16px;
          /* Colors */
          --dga-white: #FFFFFF;
          --dga-black: #161616; /* general black/title color */
          --dga-disabled-bg: #E5E7EB;
          --dga-disabled-text: #9DA4AE;
          --dga-disabled-border: #E5E7EB;
          /* Primary */
          --dga-primary-default: #1B8354;
          --dga-primary-hover: #166A45;
          --dga-primary-pressed: #104631;
          --dga-primary-selected: #14573A;
          /* Neutral */
          --dga-neutral-default: #0D121C;
          --dga-neutral-hover: #1F2A37;
          --dga-neutral-pressed: #4D5761;
          --dga-neutral-selected: #384250;
          /* Secondary Outline */
          --dga-so-border: #D2D6DB;
          --dga-so-hover-bg: #F3F4F6;
          --dga-so-hover-border: #E5E7EB;
          --dga-so-pressed-bg: #E5E7EB;
          --dga-so-pressed-border: #D2D6DB;
          --dga-so-selected-bg: #E5E7EB;
          --dga-so-selected-border: #D2D6DB;
          --dga-so-text: #161616;
          /* Secondary Solid */
          --dga-ss-default-bg: #F3F4F6;
          --dga-ss-default-text: #161616;
          --dga-ss-hover-bg: #E5E7EB;
          --dga-ss-pressed-bg: #E5E7EB;
          --dga-ss-selected-bg: #E5E7EB;
      }


     

      /* =========================
         FONT FAMILY CLASSES
      ========================= */
      .dga-font-regular {
          font-family: var(--dga-font-regular) !important;
          font-weight: 400;
      }

      .dga-font-medium {
          font-family: var(--dga-font-medium) !important;
          font-weight: 500;
      }

      .dga-font-bold {
          font-family: var(--dga-font-bold) !important;
          font-weight: 700;
      }

      /* =============================================
         FONT SIZE UTILITIES (30px down to 10px, step -2)
         all use --dga-black for color consistency
      ============================================= */
      .dga-font-30 {
          font-size: 30px !important;
          font-family: var(--dga-font-medium) !important;
          color: var(--dga-black);
      }

      .dga-font-28 {
          font-size: 28px !important;
          font-family: var(--dga-font-medium) !important;
          color: var(--dga-black);
      }

      .dga-font-26 {
          font-size: 26px !important;
          font-family: var(--dga-font-medium) !important;
          color: var(--dga-black);
      }

      .dga-font-24 {
          font-size: 24px !important;
          font-family: var(--dga-font-medium) !important;
          color: var(--dga-black);
      }

      .dga-font-22 {
          font-size: 22px !important;
          font-family: var(--dga-font-medium) !important;
          color: var(--dga-black);
      }

      .dga-font-20 {
          font-size: 20px !important;
          font-family: var(--dga-font-medium) !important;
          color: var(--dga-black);
      }

      .dga-font-18 {
          font-size: 18px !important;
          font-family: var(--dga-font-medium) !important;
          color: var(--dga-black);
      }

      .dga-font-16 {
          font-size: 16px !important;
          font-family: var(--dga-font-medium) !important;
          color: var(--dga-black);
      }

      .dga-font-14 {
          font-size: 14px !important;
          font-family: var(--dga-font-medium) !important;
          color: var(--dga-black);
      }

      .dga-font-12 {
          font-size: 12px !important;
          font-family: var(--dga-font-medium) !important;
          color: var(--dga-black);
      }

      .dga-font-10 {
          font-size: 10px !important;
          font-family: var(--dga-font-medium) !important;
          color: var(--dga-black);
      }

      /* keep original range names for backward compatibility (some were 29,27 etc – we keep only even steps,
         but also provide the combined classes below. If needed, odd steps can be added manually.
         The spec says "decrease by 2" so 30,28,26,...10 is perfect.
      */

      /* =========================
         FONT WEIGHT + SIZE COMBINATIONS (updated with color)
      ========================= */
      .dga-font-regular-30 {
          font-family: var(--dga-font-regular) !important;
          font-weight: 400;
          font-size: 30px;
          color: var(--dga-black);
      }

      .dga-font-regular-24 {
          font-family: var(--dga-font-regular) !important;
          font-weight: 400;
          font-size: 24px;
          color: var(--dga-black);
      }

      .dga-font-regular-20 {
          font-family: var(--dga-font-regular) !important;
          font-weight: 400;
          font-size: 20px;
          color: var(--dga-black);
      }

      .dga-font-regular-16 {
          font-family: var(--dga-font-regular) !important;
          font-weight: 400;
          font-size: 16px;
          color: var(--dga-black);
      }

      .dga-font-regular-14 {
          font-family: var(--dga-font-regular) !important;
          font-weight: 400;
          font-size: 14px;
          color: var(--dga-black);
      }

      .dga-font-regular-12 {
          font-family: var(--dga-font-regular) !important;
          font-weight: 400;
          font-size: 12px;
          color: var(--dga-black);
      }

      .dga-font-medium-30 {
          font-family: var(--dga-font-medium) !important;
          font-weight: 500;
          font-size: 30px;
          color: var(--dga-black);
      }

      .dga-font-medium-24 {
          font-family: var(--dga-font-medium) !important;
          font-weight: 500;
          font-size: 24px;
          color: var(--dga-black);
      }

      .dga-font-medium-20 {
          font-family: var(--dga-font-medium) !important;
          font-weight: 500;
          font-size: 20px;
          color: var(--dga-black);
      }

      .dga-font-medium-16 {
          font-family: var(--dga-font-medium) !important;
          font-weight: 500;
          font-size: 16px;
          color: var(--dga-black);
      }

      .dga-font-medium-14 {
          font-family: var(--dga-font-medium) !important;
          font-weight: 500;
          font-size: 14px;
          color: var(--dga-black);
      }

      .dga-font-medium-12 {
          font-family: var(--dga-font-medium) !important;
          font-weight: 500;
          font-size: 12px;
          color: var(--dga-black);
      }

      .dga-font-bold-30 {
          font-family: var(--dga-font-bold) !important;
          font-weight: 700;
          font-size: 30px;
          color: var(--dga-black);
      }

      .dga-font-bold-24 {
          font-family: var(--dga-font-bold) !important;
          font-weight: 700;
          font-size: 24px;
          color: var(--dga-black);
      }

      .dga-font-bold-20 {
          font-family: var(--dga-font-bold) !important;
          font-weight: 700;
          font-size: 20px;
          color: var(--dga-black);
      }

      .dga-font-bold-16 {
          font-family: var(--dga-font-bold) !important;
          font-weight: 700;
          font-size: 16px;
          color: var(--dga-black);
      }

      .dga-font-bold-14 {
          font-family: var(--dga-font-bold) !important;
          font-weight: 700;
          font-size: 14px;
          color: var(--dga-black);
      }

      .dga-font-bold-12 {
          font-family: var(--dga-font-bold) !important;
          font-weight: 700;
          font-size: 12px;
          color: var(--dga-black);
      }

      /* =========================
         BASE BUTTON STYLES (Bootstrap‑compatible)
         everything from previous version is kept intact
      ========================= */
      .dga-btn {
          display: inline-flex;
          align-items: center;
          justify-content: center;
          gap: var(--dga-space-4);
          padding-left: var(--dga-space-16);
          padding-right: var(--dga-space-16);
          border-radius: var(--dga-radius-4);
          border: none;
          outline: none;
          cursor: pointer;
          user-select: none;
          white-space: nowrap;
          text-decoration: none;
          vertical-align: middle;
          font-family: var(--dga-font-medium) !important;
          transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
          position: relative;
          /* neutralize Bootstrap btn */
          --bs-btn-padding-x: 0;
          --bs-btn-padding-y: 0;
          --bs-btn-font-size: inherit;
          --bs-btn-line-height: inherit;
          --bs-btn-border-width: 0;
          --bs-btn-border-radius: 0;
          --bs-btn-box-shadow: none;
          --bs-btn-disabled-opacity: 1;
          --bs-btn-focus-box-shadow: none;
          --bs-btn-active-bg: transparent;
          --bs-btn-active-border-color: transparent;
      }

      button.dga-btn {
          appearance: none;
          -webkit-appearance: none;
      }

      a.dga-btn {
          line-height: 1;
          display: inline-flex;
      }

      .dga-btn--lg {
          height: var(--dga-size-lg);
          font-size: var(--dga-font-lg);
      }

      .dga-btn--md {
          height: var(--dga-size-md);
          font-size: var(--dga-font-md);
      }

      .dga-btn--sm {
          height: var(--dga-size-sm);
          font-size: var(--dga-font-sm);
      }

      .dga-btn__icon {
          display: inline-flex;
          align-items: center;
          justify-content: center;
          flex: 0 0 auto;
      }

      .dga-btn--lg .dga-btn__icon {
          width: var(--dga-icon-lg);
          height: var(--dga-icon-lg);
      }

      .dga-btn--md .dga-btn__icon {
          width: var(--dga-icon-md);
          height: var(--dga-icon-md);
      }

      .dga-btn--sm .dga-btn__icon {
          width: var(--dga-icon-sm);
          height: var(--dga-icon-sm);
      }

      .dga-btn__icon svg {
          width: 100%;
          height: 100%;
          display: block;
      }

      .dga-btn--icon-only {
          padding-left: 0;
          padding-right: 0;
          gap: 0;
      }

          .dga-btn--icon-only.dga-btn--lg {
              width: 40px;
          }

          .dga-btn--icon-only.dga-btn--md {
              width: 32px;
          }

          .dga-btn--icon-only.dga-btn--sm {
              width: 24px;
          }

      .dga-btn--icon-right {
          flex-direction: row-reverse;
      }

      .dga-btn .dga-btn__icon:first-child {
          margin-right: var(--dga-space-4);
      }

      .dga-btn .dga-btn__icon:last-child {
          margin-left: var(--dga-space-4);
      }

      .dga-btn--icon-right .dga-btn__icon:first-child {
          margin-right: 0;
          margin-left: var(--dga-space-4);
      }

      .dga-btn--icon-right .dga-btn__icon:last-child {
          margin-left: 0;
          margin-right: var(--dga-space-4);
      }

      .dga-btn--icon-only .dga-btn__icon:first-child,
      .dga-btn--icon-only .dga-btn__icon:last-child {
          margin: 0;
      }

      /* Disabled */
      button.dga-btn:disabled,
      .dga-btn.dga-is-disabled,
      a.dga-btn[aria-disabled="true"] {
          pointer-events: none;
          cursor: not-allowed;
          opacity: 1;
      }

      /* ----- button variants (unchanged, all good) ----- */
      .dga-btn--primary {
          background: var(--dga-primary-default);
          color: var(--dga-white);
      }

          .dga-btn--primary:hover,
          .dga-btn--primary.dga-is-hover {
              background: var(--dga-primary-hover);
              color: var(--dga-white);
          }

          .dga-btn--primary:active,
          .dga-btn--primary.dga-is-pressed {
              background: var(--dga-primary-pressed);
              color: var(--dga-white);
          }

          .dga-btn--primary[aria-pressed="true"],
          .dga-btn--primary.dga-is-selected {
              background: var(--dga-primary-selected);
              color: var(--dga-white);
          }

          .dga-btn--primary:focus-visible,
          .dga-btn--primary.dga-is-focused {
              background: var(--dga-primary-default);
              color: var(--dga-white);
              box-shadow: inset 0 0 0 var(--dga-focus-inner) #FFFFFF, 0 0 0 var(--dga-focus-outer) #161616;
              outline: none;
          }

          button.dga-btn--primary:disabled,
          .dga-btn--primary.dga-is-disabled,
          a.dga-btn--primary[aria-disabled="true"] {
              background: var(--dga-disabled-bg);
              color: var(--dga-disabled-text);
              box-shadow: none;
          }

      .dga-btn--neutral {
          background: var(--dga-neutral-default);
          color: var(--dga-white);
      }

          .dga-btn--neutral:hover,
          .dga-btn--neutral.dga-is-hover {
              background: var(--dga-neutral-hover);
              color: var(--dga-white);
          }

          .dga-btn--neutral:active,
          .dga-btn--neutral.dga-is-pressed {
              background: var(--dga-neutral-pressed);
              color: var(--dga-white);
          }

          .dga-btn--neutral[aria-pressed="true"],
          .dga-btn--neutral.dga-is-selected {
              background: var(--dga-neutral-selected);
              color: var(--dga-white);
          }

          .dga-btn--neutral:focus-visible,
          .dga-btn--neutral.dga-is-focused {
              background: var(--dga-neutral-default);
              color: var(--dga-white);
              box-shadow: inset 0 0 0 var(--dga-focus-inner) #FFFFFF, 0 0 0 var(--dga-focus-outer) #161616;
              outline: none;
          }

          button.dga-btn--neutral:disabled,
          .dga-btn--neutral.dga-is-disabled,
          a.dga-btn--neutral[aria-disabled="true"] {
              background: var(--dga-disabled-bg);
              color: var(--dga-disabled-text);
              box-shadow: none;
          }

      .dga-btn--secondary-outline {
          background: transparent;
          color: var(--dga-so-text);
          border: 1px solid var(--dga-so-border);
      }

          .dga-btn--secondary-outline:hover,
          .dga-btn--secondary-outline.dga-is-hover {
              background: var(--dga-so-hover-bg);
              border-color: var(--dga-so-hover-border);
              color: #161616;
          }

          .dga-btn--secondary-outline:active,
          .dga-btn--secondary-outline.dga-is-pressed {
              background: var(--dga-so-pressed-bg);
              border-color: var(--dga-so-pressed-border);
              color: #161616;
          }

          .dga-btn--secondary-outline[aria-pressed="true"],
          .dga-btn--secondary-outline.dga-is-selected {
              background: var(--dga-so-selected-bg);
              border-color: var(--dga-so-selected-border);
              color: #161616;
          }

          .dga-btn--secondary-outline:focus-visible,
          .dga-btn--secondary-outline.dga-is-focused {
              background: transparent;
              color: #161616;
              box-shadow: 0 0 0 2px #161616;
              border-color: transparent;
              outline: none;
          }

          button.dga-btn--secondary-outline:disabled,
          .dga-btn--secondary-outline.dga-is-disabled,
          a.dga-btn--secondary-outline[aria-disabled="true"] {
              background: transparent;
              color: #9DA4AE;
              border-color: #E5E7EB;
              box-shadow: none;
          }

      .dga-btn--secondary-solid {
          background: var(--dga-ss-default-bg);
          color: var(--dga-ss-default-text);
          border: 1px solid transparent;
      }

          .dga-btn--secondary-solid:hover,
          .dga-btn--secondary-solid.dga-is-hover {
              background: var(--dga-ss-hover-bg);
              color: #161616;
          }

          .dga-btn--secondary-solid:active,
          .dga-btn--secondary-solid.dga-is-pressed {
              background: var(--dga-ss-pressed-bg);
              color: #161616;
          }

          .dga-btn--secondary-solid[aria-pressed="true"],
          .dga-btn--secondary-solid.dga-is-selected {
              background: var(--dga-ss-selected-bg);
              color: #161616;
          }

          .dga-btn--secondary-solid:focus-visible,
          .dga-btn--secondary-solid.dga-is-focused {
              background: #F3F4F6;
              color: #161616;
              box-shadow: 0 0 0 2px #161616;
              outline: none;
          }

          button.dga-btn--secondary-solid:disabled,
          .dga-btn--secondary-solid.dga-is-disabled,
          a.dga-btn--secondary-solid[aria-disabled="true"] {
              background: var(--dga-disabled-bg);
              color: var(--dga-disabled-text);
              border-color: var(--dga-disabled-border);
              box-shadow: none;
          }

      .dga-btn--primary-inverse {
          background: #FFFFFF;
          color: #161616;
      }

          .dga-btn--primary-inverse:hover,
          .dga-btn--primary-inverse.dga-is-hover {
              background: rgba(255, 255, 255, 0.8);
              color: #161616;
          }

          .dga-btn--primary-inverse:active,
          .dga-btn--primary-inverse.dga-is-pressed {
              background: rgba(255, 255, 255, 0.8);
              color: #161616;
          }

          .dga-btn--primary-inverse[aria-pressed="true"],
          .dga-btn--primary-inverse.dga-is-selected {
              background: rgba(255, 255, 255, 0.6);
              color: #161616;
          }

          .dga-btn--primary-inverse:focus-visible,
          .dga-btn--primary-inverse.dga-is-focused {
              background: #FFFFFF;
              color: #161616;
              box-shadow: inset 0 0 0 var(--dga-focus-inner) #161616, 0 0 0 var(--dga-focus-outer) #FFFFFF;
              outline: none;
          }

          button.dga-btn--primary-inverse:disabled,
          .dga-btn--primary-inverse.dga-is-disabled,
          a.dga-btn--primary-inverse[aria-disabled="true"] {
              background: var(--dga-disabled-bg);
              color: var(--dga-disabled-text);
              box-shadow: none;
          }

      /* RTL support (unchanged) */
      .dga-rtl .dga-btn {
          flex-direction: row;
      }

      .dga-rtl .dga-btn--icon-right {
          flex-direction: row;
      }

      .dga-rtl .dga-btn .dga-btn__icon:first-child {
          margin-right: 0;
          margin-left: var(--dga-space-4);
      }

      .dga-rtl .dga-btn .dga-btn__icon:last-child {
          margin-left: 0;
          margin-right: var(--dga-space-4);
      }

      .dga-rtl .dga-btn--icon-right .dga-btn__icon:first-child {
          margin-left: var(--dga-space-4);
          margin-right: 0;
      }

      .dga-rtl .dga-btn--icon-right .dga-btn__icon:last-child {
          margin-right: var(--dga-space-4);
          margin-left: 0;
      }

      .btn.dga-btn {
          background: none;
          border: none;
      }
      
      







.dga-gap-0 { gap: 0 !important; }
.dga-gap-4 { gap: 4px !important; }
.dga-gap-8 { gap: 8px !important; }
.dga-gap-12 { gap: 12px !important; }
.dga-gap-16 { gap: 16px !important; }
.dga-gap-20 { gap: 20px !important; }
.dga-gap-24 { gap: 24px !important; }
.dga-gap-32 { gap: 32px !important; }