/* ============================================================
   CODEV IT — Brand Override for Adon Template
   Replaces orange (#FA814D) with CODEV IT blue (#4361EE)
   ============================================================ */

/* ---- Capabilities mockup logo — fix stretch/pixelation ---- */
.phone-mockup .mockup-logo img {
  width: auto !important;
  max-width: 110px !important;
  height: 32px !important;
  object-fit: contain !important;
}

/* ---- About section logo — remove circular clip, constrain size ---- */
.about-area-2 .thumb {
  border-bottom-right-radius: 0 !important;
  overflow: visible !important;
  display: flex;
  align-items: center;
  justify-content: center;
}
.about-area-2 .thumb img {
  width: auto !important;
  max-width: 180px !important;
  height: auto !important;
  object-fit: contain !important;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
}

/* ---- Logo sizing — never stretch ---- */
.header__logo a img,
.offset-logo a img {
  height: 44px !important;
  width: auto !important;
  max-width: none !important;
  object-fit: contain !important;
  /* No display override — let show-light/show-dark control visibility */
}

/* ---- Logo swap based on header state ----
   Default (transparent header on dark hero): show white logo
   Sticky (white background):                 show dark logo        */
.header__logo .show-light { display: none !important; }
.header__logo .show-dark  { display: inline-block !important; }

.sticky .header__logo .show-light { display: inline-block !important; }
.sticky .header__logo .show-dark  { display: none !important; }

/* ---- CSS Variable Overrides ---- */
:root {
  --theme:  #4361EE;
  --theme2: #3651d4;
  --theme-rgb: 67, 97, 238;
  --action: #000000;
}

/* ---- All orange/theme-color occurrences replaced with blue ---- */

/* Buttons & CTAs */
.rr-btn,
.rr-btn-2 {
  background-color: #4361EE !important;
}
.rr-btn:hover,
.rr-btn-2:hover {
  background-color: #3651d4 !important;
}

/* Underline links hover */
.rr-btn-underline::after,
.rr-btn-underline:hover::after {
  background-color: #4361EE !important;
}
.rr-btn-underline:hover {
  color: #4361EE !important;
}

/* Progress wrap (scroll-to-top circle) */
.progress-wrap svg.progress-circle path {
  stroke: #4361EE !important;
}

/* Loader */
.loader-wrap svg path {
  fill: #000000 !important;
}
.loader-wrap-heading .load-text span {
  color: #4361EE !important;
}

/* Active nav, hover states */
.main-menu ul li:hover > a,
.main-menu ul li.active > a {
  color: #4361EE !important;
}
.dp-menu li a:hover {
  color: #4361EE !important;
}

/* Service boxes border/accent */
.service-box-1:hover {
  border-color: #4361EE !important;
}
.service-box-1.item-1::before,
.service-box-1.item-2::before,
.service-box-1.item-3::before,
.service-box-1.item-4::before,
.service-box-1.item-5::before {
  background: #4361EE !important;
}

/* Work box hover */
.work-box .content .title a:hover {
  color: #4361EE !important;
}

/* Client slider arrows */
.swiper-button-next::after,
.swiper-button-prev::after {
  color: #4361EE !important;
}

/* Tags & badges */
.tag {
  color: #4361EE !important;
}

/* Footer */
.footer-widget-box.content .title a:hover,
.footer-nav-list li a:hover {
  color: #4361EE !important;
}

/* Cursor accent */
.custom-cursor img {
  filter: hue-rotate(200deg) saturate(1.5) brightness(1.1);
}

/* ---- Custom Sections ---- */

/* Stats counter section */
.codevit-stats {
  background: #f8f9ff;
  padding: 80px 0;
  border-top: 1px solid rgba(67,97,238,0.1);
  border-bottom: 1px solid rgba(67,97,238,0.1);
}

.codevit-stat-item {
  text-align: center;
  padding: 40px 20px;
}

.codevit-stat-item .num {
  font-size: clamp(3rem, 5vw, 6rem);
  font-weight: 800;
  color: #111111;
  line-height: 1;
  display: block;
  letter-spacing: -0.03em;
}

.codevit-stat-item .num .suffix {
  color: #4361EE;
}

.codevit-stat-item .label {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: #888;
  margin-top: 10px;
  display: block;
}

/* Client logo grid */
.codevit-clients-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 1px;
  background: rgba(17,17,17,0.08);
  border: 1px solid rgba(17,17,17,0.08);
  border-radius: 4px;
  overflow: hidden;
  margin-top: 40px;
}

.codevit-client-card {
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px 24px;
  transition: background 0.25s;
  min-height: 100px;
}

.codevit-client-card:hover {
  background: rgba(67,97,238,0.05);
}

.codevit-client-card img {
  max-height: 44px;
  max-width: 130px;
  width: auto;
  object-fit: contain;
  transition: transform 0.3s;
}

.codevit-client-card:hover img {
  transform: scale(1.05);
}

/* Work detail meta */
.work-details-wrapper .meta-wrapper .meta-item .title {
  color: #4361EE !important;
  text-transform: uppercase;
  font-size: 0.75rem;
  letter-spacing: 0.12em;
}

/* Technology tags */
.tech-tag {
  display: inline-flex;
  align-items: center;
  background: rgba(67,97,238,0.08);
  color: #4361EE;
  border: 1px solid rgba(67,97,238,0.2);
  padding: 4px 14px;
  border-radius: 100px;
  font-size: 0.8rem;
  font-weight: 500;
  margin: 4px;
}

/* Visit site button */
.visit-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #4361EE;
  color: #fff !important;
  padding: 14px 32px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.9rem;
  text-decoration: none;
  transition: background 0.25s;
  margin-top: 24px;
}
.visit-btn:hover {
  background: #3651d4;
  color: #fff !important;
}

/* Related works section */
.related-works-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 48px;
}

.related-work-card {
  overflow: hidden;
  border-radius: 4px;
}

.related-work-card .thumb {
  overflow: hidden;
  border-radius: 4px;
  margin-bottom: 16px;
  aspect-ratio: 4/3;
}

.related-work-card .thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s;
}
.related-work-card:hover .thumb img {
  transform: scale(1.04);
}

.related-work-card .title {
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: 6px;
}
.related-work-card .title a:hover { color: #4361EE; }
.related-work-card .category {
  font-size: 0.8rem;
  color: #888;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

/* Marquee client band */
.codevit-brand-marquee {
  overflow: hidden;
  padding: 48px 0;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 12%, black 88%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0%, black 12%, black 88%, transparent 100%);
}

.codevit-brand-track {
  display: flex;
  gap: 80px;
  align-items: center;
  width: max-content;
  animation: codevit-marq 30s linear infinite;
}
.codevit-brand-track:hover { animation-play-state: paused; }
.codevit-brand-track img {
  height: 36px;
  width: auto;
  flex-shrink: 0;
  transition: opacity 0.3s;
}
.codevit-brand-track img:hover { opacity: 0.8; }

@keyframes codevit-marq {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* Mobile responsive */
@media (max-width: 768px) {
  .related-works-grid { grid-template-columns: 1fr; }
  .codevit-clients-grid { grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); }
}
@media (max-width: 576px) {
  .related-works-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
}