/* ============================================================
   Qivoranta Brand Colors
   Primary:   #255DF0
   Secondary: #5040D9
   ============================================================ */

/* --- CSS Variables Override --- */
:root {
  --theme: #255df0;
  --theme2: #5040d9;
}

html {
  scroll-behavior: smooth;
}

/* Offset anchor scroll for sticky header */
#demo-cta,
#ai-agents,
#knowledge-management,
#workflow-automation,
#analytics,
#security,
#customer-support,
#lead-qualification,
#appointment-assistance,
#knowledge-assistant,
#custom-ai-workflows {
  scroll-margin-top: 100px;
}

/* --- Hide social icons site-wide --- */
.social-icon {
  display: none !important;
}

/* --- Hide search icon site-wide --- */
.search-trigger,
.search-icon,
.search-wrap {
  display: none !important;
}

/* --- Hide ElevenLabs widget until the agent has initialized --- */
elevenlabs-convai:not(.qv-demo-active) {
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

elevenlabs-convai.qv-demo-active {
  opacity: 1 !important;
  visibility: visible !important;
}

/*
  The widget host is a full-page overlay. Keep pointer-events none on the
  host so page buttons stay clickable; the launcher/sheet re-enable clicks.
*/
elevenlabs-convai {
  pointer-events: none !important;
}

/* --- Mobile offcanvas menu: allow More dropdown to expand --- */
.mobile-menu {
  overflow: visible !important;
}
.mean-container .mean-nav ul {
  overflow: visible !important;
}

/* --- Mobile menu active page highlight --- */
.mean-container .mean-nav ul li.active > a:not(.mean-expand) {
  color: #255df0 !important;
}

/* --- Remove blue dot from mobile menu links --- */
.mean-container .mean-nav ul li a::before,
.mean-container .mean-nav ul li a::after {
  display: none !important;
}

/* --- Navbar Book a Demo button – compact size --- */
.header-main .header-right .qv-btn-primary {
  padding: 12px 24px !important;
  font-size: 15px !important;
  border-radius: 24px !important;
}

/* --- Active nav item highlight --- */
.header-main .main-menu ul li.active > a {
  color: #255df0 !important;
}
.header-main .main-menu ul li.active > a::after {
  width: 100% !important;
  opacity: 1 !important;
}

/* --- Scrollbar --- */
::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px #255df0;
  border-radius: 5px;
}
::-webkit-scrollbar-thumb {
  background: #255df0;
  border-radius: 10px;
}

/* --- Nav link hover & active --- */
.main-menu ul li a:hover,
.main-menu ul li:hover > a,
.mean-container .mean-nav ul li a:hover {
  color: #255df0 !important;
}
.main-menu ul li .submenu {
  border-top: 6px solid #255df0;
}
.main-menu ul li .submenu li:hover > a {
  color: #255df0 !important;
}
.main-menu ul li .submenu li a::before {
  background: #255df0;
}

/* --- Sticky header --- */
.sticky {
  background-color: #181818;
}

/* --- Theme button --- */
.theme-btn {
  color: #255df0;
}
.theme-btn::after {
  background-color: #255df0;
}
.theme-btn:hover {
  color: #151518;
}

/* --- CTA badge (lets-circle): consistent size on all pages --- */
.message-items .lets-circle {
  max-width: 280px !important;
  padding: 85px 60px !important;
  -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 126"><path fill-rule="evenodd" clip-rule="evenodd" d="M55.9029 4.52619C59.9922 -0.78983 68.0078 -0.78983 72.0971 4.52619C75.0042 8.30537 80.1389 9.57096 84.4692 7.57565C90.5606 4.76892 97.6581 8.49399 98.8085 15.1015C99.6263 19.7987 103.585 23.3056 108.346 23.5512C115.044 23.8968 119.598 30.4936 117.546 36.8788C116.087 41.4181 117.962 46.3628 122.064 48.7932C127.834 52.2118 128.801 60.1691 124.016 64.8693C120.615 68.2107 119.978 73.4605 122.48 77.5188C126.001 83.2274 123.158 90.7222 116.738 92.6606C112.173 94.0387 109.169 98.3909 109.499 103.147C109.964 109.838 103.964 115.154 97.3777 113.886C92.6956 112.985 88.013 115.443 86.0948 119.808C83.3966 125.948 75.6138 127.866 70.3712 123.683C66.6442 120.71 61.3558 120.71 57.6288 123.683C52.3862 127.866 44.6034 125.948 41.9052 119.808C39.987 115.443 35.3044 112.985 30.6223 113.886C24.0363 115.154 18.0365 109.838 18.5008 103.147C18.8309 98.3909 15.8267 94.0387 11.2623 92.6606C4.84165 90.7222 1.99926 83.2274 5.51975 77.5188C8.02248 73.4605 7.38504 68.2107 3.98382 64.8693C-0.800531 60.1691 0.165651 52.2118 5.93581 48.7932C10.0378 46.3628 11.9131 41.4181 10.4543 36.8788C8.40231 30.4936 12.9557 23.8968 19.6537 23.5512C24.4153 23.3056 28.3737 19.7987 29.1915 15.1015C30.3419 8.49399 37.4394 4.76892 43.5308 7.57565C47.8611 9.57096 52.9958 8.30537 55.9029 4.52619Z"/></svg>')
    no-repeat center center / 100% 100% !important;
  mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 126"><path fill-rule="evenodd" clip-rule="evenodd" d="M55.9029 4.52619C59.9922 -0.78983 68.0078 -0.78983 72.0971 4.52619C75.0042 8.30537 80.1389 9.57096 84.4692 7.57565C90.5606 4.76892 97.6581 8.49399 98.8085 15.1015C99.6263 19.7987 103.585 23.3056 108.346 23.5512C115.044 23.8968 119.598 30.4936 117.546 36.8788C116.087 41.4181 117.962 46.3628 122.064 48.7932C127.834 52.2118 128.801 60.1691 124.016 64.8693C120.615 68.2107 119.978 73.4605 122.48 77.5188C126.001 83.2274 123.158 90.7222 116.738 92.6606C112.173 94.0387 109.169 98.3909 109.499 103.147C109.964 109.838 103.964 115.154 97.3777 113.886C92.6956 112.985 88.013 115.443 86.0948 119.808C83.3966 125.948 75.6138 127.866 70.3712 123.683C66.6442 120.71 61.3558 120.71 57.6288 123.683C52.3862 127.866 44.6034 125.948 41.9052 119.808C39.987 115.443 35.3044 112.985 30.6223 113.886C24.0363 115.154 18.0365 109.838 18.5008 103.147C18.8309 98.3909 15.8267 94.0387 11.2623 92.6606C4.84165 90.7222 1.99926 83.2274 5.51975 77.5188C8.02248 73.4605 7.38504 68.2107 3.98382 64.8693C-0.800531 60.1691 0.165651 52.2118 5.93581 48.7932C10.0378 46.3628 11.9131 41.4181 10.4543 36.8788C8.40231 30.4936 12.9557 23.8968 19.6537 23.5512C24.4153 23.3056 28.3737 19.7987 29.1915 15.1015C30.3419 8.49399 37.4394 4.76892 43.5308 7.57565C47.8611 9.57096 52.9958 8.30537 55.9029 4.52619Z"/></svg>')
    no-repeat center center / 100% 100% !important;
}

/* --- Primary CTA button (qv-btn-primary) --- */
.qv-btn-primary {
  background: #255df0;
  color: #fff !important;
  border-color: #255df0;
  text-align: center;
  white-space: nowrap;
  padding: 22px 40px !important;
}

/* --- Keep CTA button pairs on one line --- */
.qv-cta-btns {
  flex-wrap: nowrap !important;
  align-items: center;
}
.qv-cta-btns .theme-btn {
  white-space: nowrap;
}
@media (max-width: 767px) {
  .qv-cta-btns {
    flex-wrap: wrap !important;
    justify-content: center;
  }
  .qv-cta-btns .qv-btn-primary,
  .qv-cta-btns .theme-btn {
    width: 100%;
    text-align: center;
    justify-content: center;
    white-space: normal;
    padding: 16px 20px;
    font-size: 15px;
  }
}
@media (max-width: 575px) {
  .qv-cta-btns .qv-btn-primary,
  .qv-cta-btns .theme-btn {
    padding: 14px 18px;
    font-size: 14px;
  }
}
.qv-btn-primary:hover {
  background: transparent;
  color: #255df0 !important;
}

/* --- qv-card icon & hover border --- */
.qv-card .qv-icon {
  background: rgba(37, 93, 240, 0.1);
  color: #255df0;
}
.qv-card:hover {
  border-color: #255df0;
}

/* --- qv-step number & hover border --- */
.qv-step .qv-step-num {
  color: #255df0;
}
.qv-step:hover {
  border-color: #255df0;
}

/* --- qv-industry icon & hover --- */
.qv-industry i {
  color: #255df0;
}
.qv-industry:hover {
  border-color: #255df0;
}

/* --- Section title: b tag (was yellow) --- */
.section-title h2 b,
.message-items h2 span b,
.cta-discuss-content h2 span b {
  color: #255df0;
}

/* --- Section title h6 (star icon stays blue via SVG; text is gray) --- */
.section-title h6 {
  color: #cdcdcd !important;
}

/* --- Hero bold text --- */
.hero-1 .hero-content h1 b {
  color: #255df0;
}

/* --- Preloader --- */
.preloader .animation-preloader .spinner {
  border-top-color: #255df0;
}
.preloader .animation-preloader .txt-loading .letters-loading {
  color: #255df0;
}
.preloader p {
  color: #255df0;
}

/* --- Back to top button --- */
.back-to-top {
  background-color: #255df0;
}
.back-to-top:hover {
  background-color: #151518;
}

/* --- Cursor --- */
.cursor-inner {
  background-color: #255df0;
}
.cursor-inner.cursor-hover {
  background-color: #255df0;
}
.cursor-outer {
  border-color: #255df0;
}

/* --- Offcanvas border & close button --- */
.offcanvas__info {
  border-left-color: #255df0;
}
.offcanvas__wrapper .offcanvas__content .offcanvas__close {
  background-color: #255df0;
}
.offcanvas__wrapper
  .offcanvas__content
  .offcanvas__contact
  ul
  li
  .offcanvas__contact-icon
  i {
  color: #255df0;
}
.offcanvas__wrapper
  .offcanvas__content
  .offcanvas__contact
  .social-icon
  a:hover {
  background-color: #255df0;
}

/* --- Search --- */
.main-search-input {
  color: #255df0;
  border-bottom-color: #255df0;
}
input.main-search-input::placeholder {
  color: #255df0;
}
.search-close {
  color: #255df0;
}

/* --- Footer social icons: circular pill → true circle --- */
.footer-widgets-wrapper .social-icon a,
.offcanvas__contact .social-icon a {
  width: auto;
  height: auto;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border-radius: 0 !important;
  border: none !important;
  background: transparent !important;
  backdrop-filter: none !important;
  flex-shrink: 0;
  transition: color 0.3s;
}
.footer-widgets-wrapper .social-icon a:hover,
.offcanvas__contact .social-icon a:hover {
  background: #255df0 !important;
  border-color: #255df0 !important;
  color: #fff;
}

/* --- Footer links hover --- */
.footer-widgets-wrapper .single-footer-widget .list-items li:hover a {
  color: #255df0;
}
.footer-widgets-wrapper .single-footer-widget .list-items li:hover::before {
  color: #255df0;
}
.footer-widgets-wrapper .single-footer-widget .list-items li {
  background-image: linear-gradient(#255df0, #255df0);
}
.footer-bottom p a {
  color: #255df0;
}
.footer-bottom .social-icon a:hover {
  color: #255df0;
}

/* --- Accordion active icon --- */
.faq-wrapper
  .faq-content
  .accordion-item
  .accordion-header
  .accordion-button:not(.collapsed)::after {
  color: #255df0;
}

/* --- Pagination --- */
.page-nav-wrap ul li .page-numbers.current {
  background-color: #255df0;
}
.page-nav-wrap ul li .page-numbers:hover {
  background-color: #255df0;
}
.page-nav-wrap ul li .page-numbers.icon {
  color: #255df0;
}

/* --- Swiper pagination dot --- */
.swiper-dot .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #255df0;
}

/* --- Pricing nav active --- */
.pricing-section .nav .nav-item .nav-link.active {
  background: #255df0;
}

/* --- News / blog category icon --- */
.news-box-items-2 .news-content .post-cat li i,
.news-standard-wrapper .news-standard-items .news-content ul li i,
.news-hero-section .hero-content ul li i {
  color: #255df0;
}

/* --- Sidebar search button --- */
.main-sidebar .single-sidebar-widget .search-widget form button {
  background-color: #255df0;
}
.main-sidebar .single-sidebar-widget .news-widget-categories ul li:hover {
  background-color: #255df0;
}
.main-sidebar .single-sidebar-widget .news-widget-categories ul li.active {
  background-color: #255df0;
}
.main-sidebar .single-sidebar-widget .tagcloud a:hover {
  background-color: #255df0;
}

/* --- Contact form icon & button --- */
.contact-wrapper .contact-form-items-area .contact-form-items .form-clt .icon {
  color: #255df0;
}
.contact-wrapper .contact-form-items-area .contact-form-items .theme-btn {
  background-color: #255df0;
}

/* --- Counter icon --- */
.counter-wrapper .counter-items .icon {
  background-color: #255df0;
}

/* --- Benefit icon --- */
.benefit-wrapper .benefit-right-items .benefit-icon-items .icon {
  background-color: #255df0;
}
.benefit-wrapper .benefit-left-content .theme-btn {
  background-color: #255df0;
}

/* --- Video btn --- */
.video-text .video-btn {
  background-color: #255df0;
}

/* --- Portfolio --- */
.portfolio-card-items .portfolio-image .lets-circle:hover {
  background-color: #255df0;
}
.portfolio-card-items .portfolio-content h6 span {
  color: #255df0;
}
.portfolio-card-items .portfolio-content h3 a:hover {
  color: #255df0;
}
.portfolio-section .nav .nav-item .nav-link.active {
  color: #255df0;
}

/* --- Project details --- */
.project-details-wrapper .project-details-content .details-list li i {
  color: #255df0;
}
.project-details-wrapper .project-sidebar .contact-info-box .theme-btn {
  background-color: #255df0;
}

/* --- News details --- */
.news-details-wrapper
  .news-details-items
  .news-details-content
  .post-date
  li
  i {
  color: #255df0;
}
.news-details-wrapper .tag-share-wrap .social-icon a:hover {
  color: #255df0;
}
.news-details-wrapper .prev-next-button .prev-button:hover,
.news-details-wrapper .prev-next-button .next-button:hover {
  background-color: #255df0;
}
.news-details-wrapper .comments-area .blog-single-comment .content .reply {
  color: #255df0;
}

/* --- Login / sign in --- */
.login-wrapper .signin-item .input-item .icon i {
  color: #255df0;
}
.login-wrapper .signin-item .button-items .theme-btn {
  background-color: #255df0;
}

/* --- Error page --- */
.error-items .theme-btn {
  background-color: #255df0;
}

/* --- FAQ sidebar --- */
.faq-wrapper.style-inner-page .faq-sidebar .search-widget form button {
  background-color: #255df0;
}
.faq-wrapper.style-inner-page .faq-sidebar .contact-info-box .theme-btn {
  background-color: #255df0;
}

/* --- CTA discuss --- */
.cta-discuss-content .theme-btn {
  background-color: #255df0;
}

/* --- About progress bar --- */
.about-wrapper-4
  .about-content
  .skill-feature-items
  .skill-feature
  .progress-bar {
  background-color: #255df0;
}

/* --- Team social hover --- */
.team-box-items .team-image .social-profile ul li a:hover {
  background-color: #255df0;
}
.team-box-items .team-image .social-profile .plus-btn:hover {
  background-color: #255df0;
}

/* --- Submenu border top (default style) --- */
.header-main .main-menu ul li .submenu {
  border-top: 6px solid #255df0;
}

/* ============================================================
   Inner-page section spacing (global)
   ============================================================ */

/* Space between hero banner and the first content section */
.about-section + section {
  padding-top: 60px !important;
}

/* Reduce oversized 120px bottom gap on all inner-page sections */
.service-section.fix,
.pricing-section.fix,
.news-section.fix,
.news-details.fix,
.faq-section.fix,
.contact-section.fix {
  padding-bottom: 40px !important;
}

/* ============================================================
   Mobile / tablet spacing — global overrides
   ============================================================ */

/* Tablet: ≤767px */
@media (max-width: 767px) {
  .section-padding {
    padding: 60px 0 !important;
  }
  .hero-1 {
    padding: 130px 0 60px !important;
  }
  .qv-page-hero {
    padding-top: 120px !important;
  }
  .qv-block {
    padding: 30px 22px !important;
  }
  .section-padding-2 {
    padding: 60px 0 !important;
  }
  /* Restore gap between section title and content (main.css removes it at 767px) */
  .section-title {
    margin-bottom: 28px !important;
  }
  /* Reduce button vertical padding on mobile */
  .theme-btn {
    padding: 14px 28px !important;
    font-size: 15px !important;
  }
  .qv-btn-primary {
    padding: 13px 26px !important;
    font-size: 15px !important;
  }
}

/* Phone: ≤575px */
@media (max-width: 575px) {
  .section-padding {
    padding: 50px 0 !important;
  }
  .hero-1 {
    padding: 110px 0 50px !important;
  }
  .qv-page-hero {
    padding-top: 100px !important;
  }
  .qv-block {
    padding: 22px 16px !important;
  }
  .section-padding-2 {
    padding: 50px 0 !important;
  }
  /* Further reduce button padding on phones */
  .theme-btn {
    padding: 12px 22px !important;
    font-size: 14px !important;
  }
  .qv-btn-primary {
    padding: 11px 20px !important;
    font-size: 14px !important;
  }
}

/* ============================================================
   Responsive header fixes for small / medium screens
   ============================================================ */

/* Small laptops (1200px – 1500px): compress nav to one line */
@media (max-width: 1500px) {
  .header-1 .header-left {
    gap: 100px !important;
  }
  .header-main .main-menu ul li {
    margin-inline-end: 42px !important;
  }
  .header-main .main-menu ul li a {
    font-size: 17px !important;
  }
}
@media (max-width: 1380px) {
  .header-1 .header-left {
    gap: 70px !important;
  }
  .header-main .main-menu ul li {
    margin-inline-end: 32px !important;
  }
  .header-main .main-menu ul li a {
    font-size: 16px !important;
  }
  .header-1 .container-fluid {
    padding: 0 40px !important;
  }
}
@media (max-width: 1260px) {
  .header-1 .header-left {
    gap: 40px !important;
  }
  .header-main .main-menu ul li {
    margin-inline-end: 22px !important;
  }
  .header-main .main-menu ul li a {
    font-size: 15px !important;
  }
  .header-1 .container-fluid {
    padding: 0 28px !important;
  }
}

/* Tablet: 768px – 1199px
   At this range the meanmenu has replaced the desktop nav,
   so reduce the right-side gap and container padding. */
@media (max-width: 1199px) {
  .header-main .header-right {
    gap: 14px;
  }
}

/* Tablets and small desktops: tighten container padding */
@media (max-width: 767px) {
  .header-1 .container-fluid {
    padding: 0 16px;
  }
  .header-main .header-right {
    gap: 10px;
  }
}

/* Mobile phones: very compact padding */
@media (max-width: 575px) {
  .header-1 .container-fluid {
    padding: 0 12px;
  }
  .header-main .header-right {
    gap: 8px;
  }
  /* Hide the search trigger to keep the header clean on phones */
  .header-main .header-right .search-trigger {
    display: none;
  }
  /* Scale down the sidebar toggle icon slightly */
  .header-main .sidebar__toggle {
    font-size: 18px;
  }
}
