.elementor-2181 .elementor-element.elementor-element-a2c70bb{--display:flex;}.elementor-2181 .elementor-element.elementor-element-a628129{--display:flex;}.elementor-2181 .elementor-element.elementor-element-4566dee{--display:flex;}.elementor-2181 .elementor-element.elementor-element-5837c1c{--display:flex;}.elementor-2181 .elementor-element.elementor-element-ebff002{--display:flex;}.elementor-2181 .elementor-element.elementor-element-86af2d4{--display:flex;}.elementor-2181 .elementor-element.elementor-element-f8fac05{--display:flex;}.elementor-2181 .elementor-element.elementor-element-80eec36{--display:flex;}.elementor-2181 .elementor-element.elementor-element-2df37c6{--display:flex;}.elementor-2181 .elementor-element.elementor-element-0d842ee{--display:flex;}/* Start custom CSS for html, class: .elementor-element-72efed6 */.hero-subtitle {
  color: #bbbbbb;
  font-size: 1.1rem;
  margin-bottom: 1rem; /* הקטןתי מרווח */
}

.categories-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 24px;
  max-width: 1100px;
  margin: 0 auto 24px auto; /* הקטןתי מרווח תחתון */
  padding: 0 16px;
  font-family: 'Poppins', sans-serif;
}

/* כרטיסים */
.category-card {
  background: #1a1a20;
  border-radius: 12px;
  padding: 24px 20px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.6);
  text-align: center;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  justify-content: space-between; /* מבטיח כפתור למטה */
}

.category-card:hover,
.category-card:focus {
  transform: translateY(-6px);
  box-shadow: 0 10px 35px rgba(62, 168, 159, 0.8);
  outline: none;
}

.category-card h3 {
  color: #3ea89f;
  font-size: 1.3rem;
  margin: 12px 0 10px;
}

.category-card p {
  color: #bbbbbb;
  font-size: 1rem;
  line-height: 1.4;
  margin-bottom: 18px;
  flex-grow: 1; /* לוקח כל מקום רץ כדי שייתן אחידות */
}

/* כפתורים - עם גרדיאנט אחיד */
.btn {
  display: inline-block;
  background: linear-gradient(135deg, #3ea89f, #2a7e7f);
  color: #fff;
  padding: 10px 24px;
  border-radius: 30px;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 0 15px #2a7e7f99;
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
  min-height: 42px; /* גובה אחיד לכפתורים */
  line-height: 42px;
}

.btn:hover,
.btn:focus {
  background: linear-gradient(135deg, #2a7e7f, #3ea89f);
  box-shadow: 0 0 25px #3ea89fcc;
  outline: none;
}

/* רספונסיביות */
@media (max-width: 600px) {
  .categories-grid {
    grid-template-columns: 1fr;
    margin-bottom: 2rem;
  }
}
/* מקטין מרווח בין הטקסט לבלוקים */
.dynamic-quotes {
  margin-bottom: 10px; /* תקטין את הערך אם צריך */
}

/* כפתור hover - שומר על הטקסט לבן */
.btn:hover,
.btn:focus {
  background: linear-gradient(135deg, #2a7e7f, #3ea89f);
  box-shadow: 0 0 25px #3ea89fcc;
  outline: none;
  color: #fff !important; /* חובה לשמור על הלבן גם בהובר */
}
.dynamic-quotes {
  margin-top: 0;        /* הורדתי מרווח עליון */
  margin-bottom: 1.5rem; /* הגדרתי מרווח תחתון דומה ל-hero-subtitle */
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-6e9c289 *//* =========================
   Hover animation for all cards
========================= */

/* כרטיסים דו-צדדיים */
.card-flip {
  transition: transform .3s ease, box-shadow .3s ease;
}
.card-flip:hover {
  transform: translateY(-8px);
  box-shadow: 0 16px 32px rgba(0,0,0,0.4);
}

/* כרטיסים פשוטים */
.simple-card {
  transition: transform .3s ease, box-shadow .3s ease;
}
.simple-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 16px 32px rgba(0,0,0,0.4);
}
/* מבטלים את ה-flex הזוחל ומשאירים רוחב קבוע */
.top-section .logo-wrap {
  flex: 0 0 auto !important;
}

/* לוגואים בגודל אחיד */
.top-section .card-logo {
  max-width: 120px !important;
  width: 120px !important;
  height: auto !important;
  margin: 0 auto .75rem;
  flex-shrink: 0 !important;
}
@media (max-width: 768px) {
  .top-section .card-logo {
    max-width: 100px !important;
    width: 100px !important;
  }
}
@media (max-width: 480px) {
  .top-section .card-logo {
    max-width: 80px !important;
    width: 80px !important;
  }
}
/* Code | FPF בדיוק כמו כפתור Cashback details */
.btn-copy {
  background: #1abc9c !important;
  color: #002 !important;
}
.btn-copy:hover {
  background: #17a589 !important;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-bc62e7b */.cashback-button {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  background: #1a1a20;
  color: #ffcf33;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.3s ease, box-shadow 0.3s ease, transform 0.2s ease;
  position: relative;
  z-index: 0;
  overflow: hidden;
}

.cashback-button::before {
  content: '';
  position: absolute;
  top: -10px; bottom: -10px;
  left: -10px; right: -10px;
  background: #3ea89f;
  filter: blur(10px);
  opacity: 0;
  transition: opacity 0.3s ease;
  border-radius: 12px;
  z-index: -1;
}

.cashback-button:hover::before {
  opacity: 1;
}

.cashback-button:hover {
  background: #3ea89f;
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 0 12px #3ea89f;
}

.arrow-icon {
  transition: transform 0.3s ease;
}

.cashback-button:hover .arrow-icon {
  transform: translateX(6px);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-9088319 */button {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
button:hover {
  transform: scale(1.05);
  box-shadow: 0 0 10px #3ea89f;
}
.cta-button {
  background: linear-gradient(135deg, #3ea89f 0%, #2a7e7f 100%);
  color: white;
  padding: 1rem 2rem;
  border-radius: 10px;
  font-weight: 600;
  font-size: 1.1rem;
  border: none;
  cursor: pointer;
  transition: box-shadow 0.4s ease, transform 0.2s ease;
  box-shadow: 0 0 10px #3ea89f88;
}

.cta-button:hover {
  box-shadow: 0 0 20px #3ea89fcc, 0 0 40px #2a7e7fcc;
  transform: translateY(-3px) scale(1.05);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-54f290a */:root {
  --bg-dark:         #0f0f13;       /* רקע כללי כהה מאוד */
  --card-bg-green:   #3ea89f;       /* רקע הכרטיס הירוק */
  --text-light:      #f5f5f5;       /* טקסט לבן */
  --text-mid:        #bbbbbb;       /* טקסט אפור-בהיר */
  --accent-border:   #2a7e7f;       /* ירוק כהה לגבול */
}

body {
  color: var(--text-light);
  margin: 0;
  font-family: 'Inter', sans-serif;
}

/* ---------------- Marquee Wrapper ---------------- */
.marquee {
  overflow: hidden;               /* מסתיר תוכן שמעבר לרוחב */
  width: 100%;                    /* יתפוס את כל רוחב האזור בו הוא נמצא */
  padding: 20px 0;                /* ריווח עליון ותחתון */
  background: transparent;  /* no black behind the cards */
}

/* עצירה של האנימציה כשמרחפים במארק |
   כדי לעצור גלילה גם אם העכבר על כרטיס */
.marquee:hover .marquee__inner {
  animation-play-state: paused;
}

.marquee__inner {
  display: flex;
  width: max-content;             /* מותאם אוטומטית לפי רוחב כל הקבוצה */
  animation: marquee-scroll 20s linear infinite;
}

@keyframes marquee-scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

/* -------- קבוצה של כרטיסים (Marquee Group) -------- */
.marquee__group {
  display: flex;
  gap: 16px;                      /* ריווח קבוע בין הכרטיסים */
}

/* ---------------- עיצוב הכרטיס (card) ---------------- */
.card {
  display: flex;
  align-items: center;
  background: var(--card-gradient);
  border: none;             /* or keep a very subtle semi-transparent border if you like */
  border-radius: 12px;
  padding: 12px 16px;
  min-width: 240px;               /* רוחב מינימום לקלילות הקריאה */
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
  text-decoration: none;          /* מסיר קו תחתון מקישורים */
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6);
}

/* ----- אזור שמאלי בכרטיס (לוגו) ----- */
.card-left {
  flex: 0 0 auto;
  margin-right: 12px;
}

.card-logo {
  width: 36px;
  height: 36px;
  object-fit: contain;
}

/* ----- אזור מרכזי בכרטיס (שם + מידע) ----- */
.card-center {
  flex: 1;
  text-align: left;
}

.card-name {
  font-family: 'Poppins', sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 2px;
}

.card-info {
  font-family: 'Inter', sans-serif;
  font-size: 0.8rem;
  color: #000;
}

/* ----- אזור ימני בכרטיס (דגל) ----- */
.card-right {
  flex: 0 0 auto;
  margin-left: 12px;
}

.card-flag {
  font-size: 1.4rem;
}

/* -------- התאמות למובייל -------- */
@media (max-width: 768px) {
  .card {
    min-width: 180px;
    padding: 10px 12px;
  }
  .card-name {
    font-size: 0.9rem;
  }
  .card-info {
    font-size: 0.75rem;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-6ee450b *//* ================= Subscribe Widget – Mobile Fix ================= */
@media (max-width: 600px) {
  .subscribe-widget .inputs {
    flex-direction: column;
    gap: 12px;
  }

  /* Remove the 300px flex‐basis (which became height on column flex) */
  .subscribe-widget input[type="email"] {
    flex: none !important;
    width: 100%;
    max-width: none;
    height: auto;            /* let padding determine height */
  }

  .subscribe-widget button {
    width: 100%;
  }
}/* End custom CSS */