/* ==========================================================================
   AUCTECH MARCOM — brand theme layer
   Palette taken from the logo: purple #930D81 → magenta #E8105A → red #F22D09 → gold #F9A601
   ========================================================================== */

/* ---------- Gradient headline accents ----------
   Headings are split into per-character divs by SplitText, so the gradient is
   applied to each leaf element with a vertical direction (continuous across a word). */
.section-title h1 span,
.section-title h2 span,
.page-header-box h1 span{ color: var(--brand-red); }
.section-title h1 span:not(:has(div)),
.section-title h2 span:not(:has(div)),
.page-header-box h1 span:not(:has(div)),
.section-title h1 span div:not(:has(div)),
.section-title h2 span div:not(:has(div)),
.page-header-box h1 span div:not(:has(div)){
	background: linear-gradient(180deg, #F9A601 0%, #F22D09 40%, #E8105A 70%, #930D81 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.hero .section-title h1 span.typed-title{
	background: var(--brand-gradient);
	-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.section-title h3{ color: var(--brand-gold); }
.section-title h3::before{
	background: var(--brand-gradient);
	border-radius: 50%;
	width: 12px; height: 12px;
}

/* ---------- Primary pill button ---------- */
.btn-default::before{
	background-color: transparent;
	background-image: var(--brand-gradient), url('../images/arrow-dark.svg');
	background-image: url('../images/arrow-dark.svg'), var(--brand-gradient);
	background-size: 24px auto, 100% 100%;
	background-position: center center, center center;
	box-shadow: 0 8px 24px rgba(232,16,90,0.35);
}
.btn-default:hover::before{
	background-image: url('../images/arrow-dark.svg'), linear-gradient(135deg,#F9A601 0%,#F22D09 100%);
	background-color: transparent;
}
.btn-default::after{ background: linear-gradient(90deg, rgba(147,13,129,0.35), rgba(242,45,9,0.25)); opacity: 1; }

/* ---------- Highlighted (solid) button ---------- */
.btn-highlighted{
	background: var(--brand-gradient);
	background-size: 200% 200%;
	background-position: left center;
	color: #fff;
	transition: background-position 0.5s ease, transform 0.3s ease;
}
.btn-highlighted:hover{ background: var(--brand-gradient); background-size: 200% 200%; background-position: right center; color: #fff; transform: translateY(-2px); }

/* contact-now button on About */
.contact-btn{ background: var(--brand-gradient) !important; color: #fff !important; }

/* ---------- Round arrow buttons ---------- */
.readmore-btn:hover{ border-color: var(--brand-magenta); background: var(--brand-gradient); }
.service-arrow a{ transition: all .3s ease; }
.service-item:hover .service-arrow a{ filter: drop-shadow(0 0 8px rgba(232,16,90,.6)); }

/* footer "get in touch" circle */
.footer-work-together .work-together-btn a{ background: var(--brand-gradient); box-shadow: 0 10px 40px rgba(232,16,90,0.35); }
.footer-work-together .work-together-btn a:hover{ background: var(--brand-gradient); filter: brightness(1.1); }
.footer-work-together .work-together-btn a span{ color: #fff; }
.footer-work-together .work-together-btn a img{ filter: brightness(0) invert(1); }

/* ---------- Icon glow ---------- */
.about-agency-item .icon-box img,
.service-item .icon-box img,
.benefits-steps-item .icon-box img,
.work-process-icon-box img,
.process-step-header .icon-box img,
.footer-contact-item .icon-box img,
.header-contact-box .icon-box img,
.contact-info-item .icon-box img,
.sidebar-cta-box .icon-box img,
.testimonial-benefits-item .icon-box img,
.mission-vision-image .icon-box img{
	filter: drop-shadow(0 0 10px rgba(232,16,90,.45));
	transition: filter .3s ease, transform .3s ease;
}
.about-agency-item:hover .icon-box img,
.service-item:hover .icon-box img,
.benefits-steps-item:hover .icon-box img,
.testimonial-benefits-item:hover .icon-box img{
	filter: drop-shadow(0 0 16px rgba(249,166,1,.7));
	transform: translateY(-3px);
}

/* Social icons */
.header-social-links ul li a:hover,
.footer-social-links ul li a:hover,
.agency-social-item .icon-box a{ background: var(--brand-gradient); color:#fff; border-color: transparent; }

/* Scrolling ticker */
.our-scrolling-ticker .scrolling-ticker-box{ background: var(--brand-gradient); }
.our-scrolling-ticker .scrolling-content span{ color: #fff; }
.our-scrolling-ticker .scrolling-content span img{ filter: brightness(0) invert(1); }

/* Accordion / FAQ */
.accordion-button:not(.collapsed){ color: var(--brand-gold); }
.faq-accordion .accordion-button::after,
.faq-accordion .accordion-button:not(.collapsed)::after{ filter: hue-rotate(-10deg) saturate(1.3); }

/* Lists with check marks — recolor via accent var (already #F22D09) */

/* Work-process / step numbers */
.work-process-no h2,
.process-step-no h3 span,
.benefits-steps-no h3{
	background: var(--brand-gradient);
	-webkit-background-clip: text; background-clip: text;
	-webkit-text-fill-color: transparent;
}

/* Service category list active state */
.service-catagery-list ul li a.active,
.service-catagery-list ul li a:hover{ color: var(--brand-gold); }
.faq-catagery-list ul li a:hover{ color: var(--brand-gold); }

/* Form focus */
.form-control:focus{ border-color: var(--brand-magenta) !important; box-shadow: 0 0 0 3px rgba(232,16,90,.2) !important; }

/* Links inside paragraphs */
.service-footer p a{ color: var(--brand-gold); }
.service-footer p a:hover{ color: var(--brand-magenta); }

/* Why-choose active item accent bar */
.why-choose-item.active h3{ color: var(--brand-gold); }

/* Page header overlay tint */
.page-header::after{
	content:''; position:absolute; inset:0; pointer-events:none;
	background: linear-gradient(180deg, rgba(147,13,129,.35) 0%, rgba(0,0,0,0) 60%);
}
.page-header .container{ position: relative; z-index: 1; }
.page-header-box .breadcrumb-item.active{ color: var(--brand-gold); }

/* Hero tint */
.hero.bg-image::before{ background: linear-gradient(180deg, rgba(147,13,129,.55) 0%, rgba(0,0,0,.65) 60%, #000 100%) !important; }

/* ---------- Preloader: logo mark with gradient ring ---------- */
.preloader{ background: radial-gradient(circle at center, #140010 0%, #000 70%); }
.loading-container, .loading{ width: 150px; height: 150px; }
.loading{
	border: 2px solid transparent;
	border-color: var(--brand-purple) var(--brand-red) var(--brand-gold) var(--brand-magenta);
	animation: rotate-loading 1.2s linear infinite;
}
.loading::after{
	content:''; position:absolute; inset:10px; border-radius:50%;
	border:1px solid rgba(255,255,255,.08);
}
#loading-icon{ width: 90px; max-width: 90px; animation: logo-pulse 1.6s ease-in-out infinite; }
#loading-icon img{ width: 100%; height: auto; display:block; }
@keyframes logo-pulse{ 0%,100%{ transform: translate(-50%,-50%) scale(1); opacity: 1; } 50%{ transform: translate(-50%,-50%) scale(.9); opacity: .8; } }

/* Mouse cursor accent */
.mouse-cursor.cursor-inner, .mouse-cursor.cursor-outer{ border-color: var(--brand-magenta) !important; }
.cursor-inner{ background: var(--brand-magenta) !important; }

/* Header logo sizing */
.navbar-brand img{ height: 74px; max-width: 200px; }
.footer-logo img{ height: 110px; max-width: 160px; }

/* Technologies tag list on service pages */
.service-tools{ display:flex; flex-wrap:wrap; gap:12px; margin: 0 0 40px; padding:0; list-style:none; }
.service-tools li{
	position:relative; padding:10px 18px; border-radius:100px; font-weight:600; font-size:14px; color:#fff;
	background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); overflow:hidden;
}
.service-tools li::before{ content:''; position:absolute; inset:0; background: var(--brand-gradient); opacity:0; transition: opacity .3s ease; }
.service-tools li:hover::before{ opacity:.25; }
.service-tools li span{ position:relative; z-index:1; }

/* standards / benefits block */
.service-standards{ display:grid; grid-template-columns: repeat(2, 1fr); gap: 18px; margin-bottom: 40px; }
.service-standards .standard-item{
	display:flex; align-items:flex-start; gap:14px; padding:20px; border-radius:18px;
	background: rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08);
}
.service-standards .standard-item i{ font-size:18px; line-height:1.2; background: var(--brand-gradient); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; margin-top:2px; }
.service-standards .standard-item p{ margin:0; color:#fff; font-weight:600; }
@media (max-width: 767px){ .service-standards{ grid-template-columns: 1fr; } }

/* Contact page social */
.contact-social-links ul{ display:flex; gap:12px; list-style:none; padding:0; margin: 30px 0 0; }
.contact-social-links ul li a{ display:flex; align-items:center; justify-content:center; width:42px; height:42px; border-radius:50%; border:1px solid rgba(255,255,255,.2); color:#fff; transition:all .3s ease; }
.contact-social-links ul li a:hover{ background: var(--brand-gradient); border-color: transparent; }

/* Service card title links inherit heading colour */
.service-item-body h3 a{ color: inherit; transition: color .3s ease; }
.service-item:hover .service-item-body h3 a{ color: var(--brand-gold); }
.header-contact-box-content p a, .footer-contact-content p a, .contact-item-content p a{ color: inherit; }
.header-contact-box-content p a:hover, .footer-contact-content p a:hover, .contact-item-content p a:hover{ color: var(--brand-gold); }
.footer-newsletter-form p{ margin-bottom: 25px; }

/* Step icon tiles, CTA phone button, hamburger, typed cursor */
.work-process-icon-box{ background: var(--brand-gradient) !important; }
.sidebar-cta-box .cta-contact-btn a{ background: var(--brand-gradient) !important; color: #fff !important; }
.sidebar-cta-box .cta-contact-btn a img{ filter: brightness(0) invert(1); }
.sidebar-cta-box .cta-contact-content h3{ color: var(--brand-gold); }
.slicknav_btn{ background: var(--brand-gradient) !important; }
.typed-cursor{ color: var(--brand-gold); }
.service-catagery-list ul li a, .faq-catagery-list ul li a{ text-transform: none; }
.footer-contact-content p.footer-address{ font-size: 14px; line-height: 1.6em; font-weight: 400; }
.contact-us-form select.form-control{ appearance: none; -webkit-appearance: none; color: #fff; }
.contact-us-form select.form-control option{ color: #000; }
.page-header-box .breadcrumb-item{ text-transform: none; }

/* Hero: keep typed text and cursor on one line; two CTA buttons */
.hero .section-title h1 .typed-wrap{ white-space: nowrap; }
.hero .section-title h1 .typed-wrap .typed-cursor{ display:inline; }
.hero-btn{ display:flex; flex-wrap:wrap; gap: 20px 10px; }
.hero-btn .btn-default{ margin-right: 50px; }
@media (max-width: 767px){ .hero .section-title h1 .typed-wrap{ white-space: normal; } }
@media (min-width: 1200px){ .hero .section-title h1{ font-size: 104px; } }

/* Client logo strip (light tiles so logos keep their original colours) */
.our-partners-list.client-logos{ gap: 20px; }
.our-partners-list.client-logos .company-logo{ width: calc(33.33% - 14px); background: #fff; border-radius: 14px; padding: 14px 18px; display:flex; align-items:center; justify-content:center; min-height: 130px; border:1px solid rgba(255,255,255,.1); transition: all .3s ease; }
.our-partners-list.client-logos .company-logo:hover{ transform: translateY(-4px); box-shadow: 0 12px 30px rgba(232,16,90,.35); }
.our-partners-list.client-logos .company-logo img{ height: 96px !important; max-height: 96px !important; width: auto !important; max-width: 100% !important; object-fit: contain; }
.executive-partners .section-title p{ margin-top: 20px; }
.success-counter-item h2{ background: var(--brand-gradient); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
@media (max-width: 991px){ .our-partners-list.client-logos .company-logo{ width: calc(50% - 10px); } }
@media (max-width: 480px){ .our-partners-list.client-logos .company-logo{ width: 100%; } }
@media (min-width: 1200px){ .hero .section-title h1{ font-size: 104px; } }