.elementor-460 .elementor-element.elementor-element-7496c7f:not(.elementor-motion-effects-element-type-background), .elementor-460 .elementor-element.elementor-element-7496c7f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#2BBEC7;}.elementor-460 .elementor-element.elementor-element-7496c7f{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:-14%;margin-bottom:0%;}.elementor-460 .elementor-element.elementor-element-7496c7f > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-460 .elementor-element.elementor-element-a207f37{--spacer-size:324px;margin:1% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;padding:-10% 0% 0% 0%;z-index:0;}.elementor-460 .elementor-element.elementor-element-3a38bf7{margin-top:-6%;margin-bottom:0%;z-index:1;}.elementor-460 .elementor-element.elementor-element-be40279{margin-top:0px;margin-bottom:0px;}.elementor-460 .elementor-element.elementor-element-d960777{margin:0% 0% calc(var(--kit-widget-spacing, 0px) + -2%) 0%;}@media(max-width:767px){.elementor-460 .elementor-element.elementor-element-7496c7f{margin-top:-32%;margin-bottom:0%;}.elementor-460 .elementor-element.elementor-element-a207f37{--spacer-size:184px;margin:0% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}.elementor-460 .elementor-element.elementor-element-3a38bf7{margin-top:-21%;margin-bottom:0%;}.elementor-460 .elementor-element.elementor-element-be40279{margin-top:17px;margin-bottom:0px;}.elementor-460 .elementor-element.elementor-element-d960777{margin:0% 0% calc(var(--kit-widget-spacing, 0px) + -15%) 0%;}.elementor-460 .elementor-element.elementor-element-3eea43c{margin:-11px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:-4px 0px 0px 0px;}}/* Start custom CSS for shortcode, class: .elementor-element-f8afc64 *//* =============================
   Compare Form — Fixed Mobile Layout
   ============================= */

.bci-compare-form {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: center;
  justify-content: center;
  background: #fff;
  padding: 16px;
  border-radius: 14px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  max-width: 1100px;
  margin: 0 auto 20px;
}

/* Inputs Container */
#bci-inputs {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: center;
  width: 100%;
}

/* Input Fields */
.bci-card-input {
  flex: 1 1 220px;
  min-width: 180px;
  max-width: 250px;
  padding: 10px 14px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font-size: 14px;
  background: #fff;
  height: auto;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.bci-card-input:focus {
  border-color: #2bbec7;
  outline: none;
  box-shadow: 0 0 0 2px rgba(43,190,199,0.15);
}

/* Actions Section */
.bci-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  width: 100%;
}

/* Buttons */
.bci-actions button,
.bci-actions a {
  background: #2bbec7;
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 10px 18px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.1s ease;
  text-decoration: none;
}

.bci-actions button:hover,
.bci-actions a:hover {
  background: #22aab2;
  transform: translateY(-1px);
}

/* Disabled Button */
.bci-actions button[disabled] {
  background: #ccc;
  color: #666;
  cursor: not-allowed;
  transform: none;
}

/* 🔧 MOBILE FIX — prevent full-height stacking */
@media (max-width: 768px) {
  .bci-compare-form {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    justify-items: center;
  }

  #bci-inputs {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    width: 100%;
  }

  .bci-card-input {
    width: 100%;
    min-width: unset;
    max-width: unset;
  }

  .bci-actions {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
  }

  .bci-actions button,
  .bci-actions a {
    flex: 1 1 45%;
    text-align: center;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d960777 *//* 🎯 Scroll Hint – Fixed Placement + Auto Fade (Compact) */
.scroll-hint-container {
  position: relative;
  overflow: visible !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Subtle right-edge fade */
.scroll-hint-overlay {
  position: absolute;
  right: 0;
  top: 0;
  width: 56px;
  height: 100%;
  background: linear-gradient(to left, rgba(255,255,255,1), rgba(255,255,255,0));
  pointer-events: none;
  z-index: 2;
}

/* Swipe-right bubble */
.scroll-hint-text {
  position: absolute;
  right: 16px;
  bottom: 6px; /* closer to table */
  background: #2bbec7;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  padding: 8px 14px 8px 26px;
  border-radius: 999px;
  box-shadow: 0 3px 6px rgba(0,0,0,0.15);
  display: flex;
  align-items: center;
  gap: 6px;
  pointer-events: none;
  z-index: 5;
  opacity: 1;
  transform: translateX(0);
  animation:
    hint-pulse 1.5s ease-in-out infinite,
    fade-out 0.6s ease-in-out 10s forwards; /* 👈 fades away after 3 s */
}

/* Emoji prefix */
.scroll-hint-text::before {
  content: "👉";
  font-size: 14px;
  margin-right: 4px;
}

/* Gentle pulsing motion */
@keyframes hint-pulse {
  0%, 100% { transform: translateX(0); opacity: 0.9; }
  50% { transform: translateX(-4px); opacity: 1; }
}

/* Auto fade-out animation */
@keyframes fade-out {
  from { opacity: 1; transform: scale(1); }
  to   { opacity: 0; transform: scale(0.96); }
}

/* 📱 Mobile tweaks */
@media (max-width: 767px) {
  .scroll-hint-text {
    font-size: 12px;
    padding: 6px 12px 6px 22px;
    bottom: 4px;
    right: 10px;
  }
  .scroll-hint-overlay {
    width: 40px;
  }
}

/* Reduce top space above table */
.bci-compare-table-wrap {
  margin-top: 6px !important;
  padding-top: 0 !important;
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-3eea43c */.bci-compare-table {
  width: 100%;
  border-collapse: collapse;
  margin: 8px 0 16px 0; /* reduced top gap from 20px → 8px */
}

.bci-compare-table th,
.bci-compare-table td {
  border: 1px solid #e5e7eb;
  padding: 14px;
  text-align: center;
  vertical-align: middle;
}

.bci-compare-table thead th {
  background: #f9fafb;
  font-weight: 700;
}

/* ✅ Button Styling */
.bci-btn {
  display: inline-block;
  background: #16a34a;
  color: #fff !important;
  padding: 10px 20px;
  border-radius: 6px;
  text-decoration: none;
  font-weight: 600;
  transition: background 0.2s ease;
}

.bci-btn:hover {
  background: #15803d;
}/* End custom CSS */