/* =============================================================
   TiCi Technologies — conversion & responsive refinements
   Loaded after style24.css. Uses the existing palette
   (#a680f1 purple, #c8f560 lime accent, deep navy backgrounds).
   ============================================================= */

/* ---------- Spam honeypot (never visible) ---------- */
.tc-hp {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* ---------- Dark dropdown options (Windows/Chrome show white otherwise) ---------- */
.lead-modal select option,
.lead-modal select optgroup,
.inner-contact-rgt select option,
.inner-contact-rgt select optgroup,
.lead-form-embed select option,
.lead-form-embed select optgroup {
  background: #14112b;
  color: #fff;
}

.lead-modal-trust {
  margin: 4px 0 14px;
  font-size: 12px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.55);
}
.lead-modal-trust i {
  color: #c8f560;
  margin-right: 4px;
}

/* ---------- Hero: secondary CTA + reassurance line ---------- */
.banner-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}
.banner-trust {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.72);
}
.banner-trust li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.banner-trust i {
  color: #c8f560;
  font-size: 12px;
}

/* ---------- Form note under inline lead forms ---------- */
.tc-form-note {
  margin: 14px 0 0;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.55);
}
.tc-form-note i {
  color: #c8f560;
  margin-right: 4px;
}
.tc-contact-hours {
  display: block;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.6);
  margin-top: 2px;
}

/* ---------- Global node cards: text labels instead of percentages ---------- */
.tn-global__node-card strong {
  white-space: nowrap;
}

/* ---------- Desktop WhatsApp button ---------- */
.tc-wa-float {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 998;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #25d366;
  color: #fff;
  font-size: 28px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
  transition: transform 0.25s ease;
  text-decoration: none;
}
.tc-wa-float:hover {
  transform: translateY(-3px) scale(1.04);
  color: #fff;
}

/* ---------- Mobile quick-contact bar ---------- */
.tc-mobile-cta {
  display: none;
}

@media (max-width: 991px) {
  .tc-wa-float {
    display: none;
  }

  .tc-mobile-cta {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 998;
    display: grid;
    grid-template-columns: 1fr 1fr 1.3fr;
    gap: 8px;
    padding: 8px 12px calc(8px + env(safe-area-inset-bottom));
    background: rgba(11, 8, 32, 0.94);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-top: 1px solid rgba(166, 128, 241, 0.35);
  }

  .tc-mobile-cta__item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 44px;
    border-radius: 44px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
  }
  .tc-mobile-cta__item i {
    font-size: 15px;
  }
  .tc-mobile-cta__item .fa-whatsapp {
    color: #25d366;
    font-size: 17px;
  }
  .tc-mobile-cta__item--primary {
    border: 2px solid #a680f1;
    background: linear-gradient(135deg, #7c4dff 0%, #a680f1 100%);
  }
  .tc-mobile-cta__item:hover,
  .tc-mobile-cta__item:focus {
    color: #fff;
  }

  /* keep the footer's last line visible above the bar */
  body {
    padding-bottom: 64px;
  }
}

/* ---------- Responsive fixes ---------- */
@media (max-width: 767px) {
  /* "What we do" section lost its side gutter on phones */
  .what-we-do .container-sm {
    padding-left: 16px;
    padding-right: 16px;
  }

  .banner-cta-row .cmn-btn {
    flex: 1 1 auto;
  }

  .banner-trust {
    font-size: 12px;
  }

  /* inline lead forms: comfortable tap targets, no iOS zoom */
  .inner-contact-rgt input,
  .inner-contact-rgt select,
  .inner-contact-rgt textarea,
  .lead-form-embed input,
  .lead-form-embed textarea,
  .lead-modal input,
  .lead-modal select,
  .lead-modal textarea {
    font-size: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .tc-wa-float {
    transition: none;
  }
}

/* ---------- Contact page: "What happens next" ---------- */
.tc-next-steps {
  margin-top: 34px;
  padding: 22px 22px 8px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.03);
  text-align: left;
}
.tc-next-steps h3 {
  font-size: 18px;
  color: #fff;
  margin: 0 0 14px;
}
.tc-next-steps ol {
  margin: 0;
  padding-left: 18px;
}
.tc-next-steps li {
  font-size: 14px;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.72);
  margin-bottom: 12px;
}
.tc-next-steps li strong {
  color: #c8f560;
  font-weight: 600;
}

/* ---------- Detail pages: jump-to-form button (phones/tablets only) ---------- */
.tc-jump-cta {
  width: 100%;
  margin: 0 0 26px;
}
.tc-jump-cta span {
  width: auto !important;
}
#service-lead-form-wrap,
#product-lead-form-wrap,
#start-project {
  scroll-margin-top: 110px;
}

/* ---------- Blog post: the post title is now the page's H1 ---------- */
.blog-main h1.blog-detail-title {
  font-size: 45px;
  margin-bottom: 25px;
  text-transform: none;
}
@media (max-width: 575px) {
  .blog-main h1.blog-detail-title {
    font-size: 28px;
    margin-bottom: 17px;
  }
}

/* ---------- Legal / simple content pages ---------- */
.tc-legal h3 {
  margin-top: 30px;
}
.tc-legal ul {
  padding-left: 20px;
}
.tc-legal li {
  margin-bottom: 8px;
}
.tc-legal a {
  color: #c4a8ff;
}