/* Add custom CSS styles below */ 
:root{
  --bg:#F8F6F2;
  --card:#FFFFFF;
  --primary:#D06090;
  --green:#0F4A36;
  --olive:#B0D090;
  --beige:#EEE7DD;
  --gold:#CDBA8E;
  --text:#2F2A28;
  --muted:#6C6762;
  --border:#E8E2D9;
  --radius-lg:18px;
  --radius-md:14px;
}

body{
  background: var(--bg);
  color: var(--text);
}

.button-primary, .btn-primary{
  background: var(--primary) !important;
  border-color: var(--primary) !important;
  color:#fff !important;
  border-radius: var(--radius-md) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
}

.button-primary:hover, .btn-primary:hover{
  filter: brightness(.94);
}

.product-card, .card{
  background: var(--card) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: 0 12px 30px rgba(15,74,54,.06);
}

.badge-best{
  background: var(--green);
  color:#fff;
  border-radius: 999px;
  padding:6px 10px;
  font-size:12px;
}

.hero-fade-banner {
  position: relative;
  overflow: hidden !important;
  isolation: isolate;
  z-index: 0;
}

.hero-fade-banner .advanced-slider__image {
  -webkit-mask-image: linear-gradient(
    to bottom,
    #000 0%,
    #000 78%,
    rgba(0, 0, 0, 0.55) 88%,
    transparent 100%
  ) !important;
  mask-image: linear-gradient(
    to bottom,
    #000 0%,
    #000 78%,
    rgba(0, 0, 0, 0.55) 88%,
    transparent 100%
  ) !important;

  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

.hero-fade-banner .advanced-slider__caption__inner__content__button {
  border-radius: 24px !important;
  overflow: hidden !important;
}





/* تصغير الصورة بالجوال + حواف دائرية */

.about-section-custom img{
    border-radius: 32px !important;
}

@media (max-width: 768px){

    .about-section-custom img{
        width: 70% !important;
        max-width: 250px;
        margin: 0 auto;
        display: block;
    }

}


.about-section-custom .md\:w-5\/12{
    position: relative;
}

.about-section-custom .md\:w-5\/12::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 35%;
    border-radius: 32px 32px 0 0;
    pointer-events: none;
    background: linear-gradient(
        to bottom,
        rgba(255,255,255,.18),
        rgba(255,255,255,.05),
        transparent
    );
}


/* إصلاح قسم رحلة المنتجات على iPhone */
@supports (-webkit-touch-callout: none) {

  .journey-section {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 350px !important;
    overflow: visible !important;
    position: relative !important;
    transform: none !important;
    -webkit-transform: none !important;
  }

  .journey-section .journey-header {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    position: relative !important;
    transform: none !important;
    -webkit-transform: none !important;
  }

  .journey-section .journey-title,
  .journey-section .journey-subtitle {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .journey-section .marquee-viewport {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    width: 100% !important;
    height: auto !important;
    min-height: 270px !important;

    overflow-x: auto !important;
    overflow-y: hidden !important;

    position: relative !important;
    transform: none !important;
    -webkit-transform: none !important;

    -webkit-overflow-scrolling: touch !important;
    scroll-snap-type: x proximity;
  }

  .journey-section .marquee-track {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;

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

    animation: none !important;
    -webkit-animation: none !important;

    transform: none !important;
    -webkit-transform: none !important;

    translate: none !important;
    inset: auto !important;

    gap: 18px !important;
    padding: 10px 16px 20px !important;
  }

  .journey-section .journey-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;

    visibility: visible !important;
    opacity: 1 !important;

    flex: 0 0 180px !important;
    width: 180px !important;
    min-width: 180px !important;
    height: auto !important;

    position: relative !important;
    transform: none !important;
    -webkit-transform: none !important;

    scroll-snap-align: center;
  }

  .journey-section .image-box {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    width: 180px !important;
    height: 180px !important;
    min-height: 180px !important;

    position: relative !important;
    overflow: visible !important;
  }

  .journey-section .image-box img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    width: 180px !important;
    height: 180px !important;
    max-width: 180px !important;

    object-fit: contain !important;

    position: static !important;
    transform: none !important;
    -webkit-transform: none !important;
  }

  .journey-section .item-label {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    width: 100% !important;
    height: auto !important;
    margin-top: 10px !important;

    text-align: center !important;
    white-space: normal !important;
  }

  /* إخفاء النسخة المكررة لأن الحركة متوقفة على الآيفون */
  .journey-section .journey-item:nth-child(n+6) {
    display: none !important;
  }
}