/* Softalyn.com brand theme — dark, cyan → blue → violet */

@import url("../fonts/oswald/oswald.css");

:root {
  --theme-color: #3a63ff;
  --soft-cyan: #2ec8ff;
  --soft-blue: #287bff;
  --soft-violet: #b44dff;
  --soft-navy: #0b1d4e;
  --soft-bg: #050b18;
  --soft-bg-elev: #0a1428;
  --soft-surface: rgba(14, 24, 48, 0.88);
  --soft-text: #f5f8ff;
  --soft-muted: rgba(245, 248, 255, 0.68);
  --soft-grad: linear-gradient(102deg, #8ef4ff 0%, #00dfff 22%, #287bff 52%, #8955ff 82%, #b65cff 100%);
  --soft-btn: linear-gradient(100deg, #2ec8ff, #3a63ff 48%, #b44dff);
  --soft-btn-deep: linear-gradient(100deg, #0e4f8c, #1b3eb8 48%, #5a2a96);
  --adv-coral: #2ec8ff;
  --adv-coral-deep: #3a63ff;
  --adv-ink: #050b18;
  --adv-ink-soft: #0a1428;
}

body.imagetag,
body {
  background: var(--soft-bg);
  color: var(--soft-text);
  font-family: "Poppins", sans-serif;
}

h1, h2, h3, h4, h5, .headingOne, .pack-name, .main-heading {
  font-family: "Poppins", sans-serif;
}

/* Global accent remaps from old coral brand */
.themeBtnGreeen,
.themeBtnBlack,
.banner-cta-primary,
.banner-form-btn,
.header-cta {
  background-image: var(--soft-btn) !important;
  background-color: transparent !important;
  color: #fff !important;
  border: none !important;
}

.themeBtnGreeen:hover,
.themeBtnBlack:hover,
.banner-cta-primary:hover,
.banner-form-btn:hover,
.header-cta:hover {
  background-image: var(--soft-btn-deep) !important;
  color: #fff !important;
  filter: brightness(1.05);
}

/* Text accents that used theme-color / coral */
.banner h1 b,
.leadform h3 span,
.headingOne span,
.cont-hd h2 span,
.pricing h3 span,
.next-level .headingOne span {
  color: transparent !important;
  background-image: var(--soft-grad);
  -webkit-background-clip: text;
  background-clip: text;
  text-shadow: none !important;
}

/* Promo */
.promo-bar {
  background: linear-gradient(90deg, #050714 0%, #12082a 40%, #071428 70%, #050714 100%) !important;
  border-bottom: 1px solid rgba(46, 200, 255, 0.28) !important;
}

.promo-item strong {
  color: #8ef4ff !important;
}

.promo-dot {
  background: var(--soft-cyan) !important;
  box-shadow: 0 0 0 3px rgba(46, 200, 255, 0.2) !important;
}

/* Header — Softalyn glass/gradient nav feel */
.site-header {
  background: rgba(5, 11, 24, 0.72) !important;
  border-bottom: 1px solid rgba(46, 200, 255, 0.12) !important;
  backdrop-filter: blur(18px) saturate(1.25) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.25) !important;
}

.site-header.is-scrolled {
  background: rgba(5, 11, 24, 0.92) !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35) !important;
}

.site-header .logo img,
.site-header .brand-logo {
  max-height: 72px;
  width: auto;
  filter: drop-shadow(0 0 14px rgba(46, 200, 255, 0.3));
}

.site-header.is-scrolled .brand-logo {
  max-height: 58px;
}

.brand-logo-link {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

.header-phone {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(46, 200, 255, 0.22) !important;
  color: var(--soft-text) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25) !important;
}

.header-phone:hover {
  color: var(--soft-cyan) !important;
  border-color: rgba(46, 200, 255, 0.5) !important;
}

.header-phone figure {
  background: linear-gradient(145deg, rgba(46, 200, 255, 0.25), rgba(180, 77, 255, 0.2)) !important;
}

.header-phone figure img {
  filter: hue-rotate(190deg) saturate(1.4) brightness(1.1);
}

.header-nav-hint a {
  color: rgba(245, 248, 255, 0.72) !important;
}

.header-nav-hint a:hover {
  color: #8ef4ff !important;
}

.header-nav-hint a::after {
  background: var(--soft-cyan) !important;
}

.header-cta {
  box-shadow: 0 12px 28px rgba(58, 99, 255, 0.35) !important;
}

/* Banner Softalyn atmosphere */
.banner.banner-advance {
  background:
    radial-gradient(ellipse 60% 50% at 70% 20%, rgba(180, 77, 255, 0.18), transparent 60%),
    radial-gradient(ellipse 50% 45% at 15% 80%, rgba(46, 200, 255, 0.16), transparent 55%),
    linear-gradient(180deg, rgba(5, 11, 24, 0.55), rgba(5, 11, 24, 0.82)),
    url(../images/banner.webp) center top / cover no-repeat !important;
}

.banner.banner-advance .overlay-banner {
  background: linear-gradient(
    115deg,
    rgba(5, 11, 24, 0.78) 0%,
    rgba(8, 16, 40, 0.55) 48%,
    rgba(18, 8, 40, 0.65) 100%
  ) !important;
}

.banner-orb--a {
  background: radial-gradient(circle, rgba(46, 200, 255, 0.5), transparent 68%) !important;
}

.banner-orb--b {
  background: radial-gradient(circle, rgba(58, 99, 255, 0.35), transparent 70%) !important;
}

.banner-orb--c {
  background: radial-gradient(circle, rgba(180, 77, 255, 0.4), transparent 70%) !important;
}

.banner-eyebrow {
  color: #d9f8ff !important;
  border-color: rgba(46, 200, 255, 0.28) !important;
  background: rgba(46, 200, 255, 0.08) !important;
}

.banner-eyebrow::before {
  background: var(--soft-cyan) !important;
  box-shadow: 0 0 0 4px rgba(46, 200, 255, 0.22) !important;
}

.banner.banner-advance h1.banner-title {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  color: #fff !important;
  max-width: 11ch;
}

html[data-theme="dark"] .banner.banner-advance h1.banner-title,
html[data-theme="dark"] .banner.banner-advance h1.banner-title .banner-title__word {
  text-shadow:
    0 2px 0 rgba(0, 0, 0, 0.35),
    0 14px 30px rgba(0, 0, 0, 0.35) !important;
}

html[data-theme="light"] .banner.banner-advance h1.banner-title,
html[data-theme="light"] .banner.banner-advance h1.banner-title .banner-title__word {
  text-shadow: none !important;
  color: #0b1f3f !important;
  -webkit-text-fill-color: #0b1f3f !important;
}

.banner.banner-advance h1.banner-title .banner-title__word:not(.banner-title__word--accent) {
  background: none !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff;
}

.banner.banner-advance h1.banner-title .banner-title__word--accent {
  background-image: var(--soft-grad) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent;
  color: transparent !important;
  text-shadow: none !important;
}

.banner-trust-points i {
  color: var(--soft-cyan) !important;
}

.banner-cta-ghost {
  border-color: rgba(46, 200, 255, 0.35) !important;
  background: rgba(255, 255, 255, 0.05) !important;
}

.banner-cta-ghost:hover {
  border-color: rgba(180, 77, 255, 0.55) !important;
  background: rgba(180, 77, 255, 0.12) !important;
}

/* Softalyn price glow — cyan/violet */
.price-glow__aura {
  background: radial-gradient(circle, rgba(46, 200, 255, 0.55) 0%, rgba(180, 77, 255, 0.22) 45%, transparent 70%) !important;
}

.price-glow__pulse {
  border-color: rgba(142, 244, 255, 0.5) !important;
  box-shadow:
    0 0 24px rgba(46, 200, 255, 0.55),
    0 0 60px rgba(180, 77, 255, 0.3),
    inset 0 0 20px rgba(46, 200, 255, 0.18) !important;
}

.price-glow__ring {
  background: conic-gradient(
    from 0deg,
    transparent 0deg,
    rgba(142, 244, 255, 0.9) 40deg,
    transparent 90deg,
    transparent 180deg,
    rgba(180, 77, 255, 0.85) 220deg,
    transparent 280deg
  ) !important;
}

.banner.banner-advance .popup-icon-image.price-glow {
  filter: drop-shadow(0 18px 28px rgba(58, 99, 255, 0.45));
}

/* Replace coral sticker with Softalyn gradient badge look */
.price-glow__img {
  opacity: 0;
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
}

.price-glow::after {
  content: none !important;
  display: none !important;
}

/* Lead form */
.leadform.leadform-advance {
  border-color: rgba(46, 200, 255, 0.4) !important;
  background: linear-gradient(165deg, rgba(10, 20, 40, 0.9), rgba(12, 10, 32, 0.82)) !important;
  box-shadow:
    0 30px 60px rgba(0, 0, 0, 0.45),
    0 0 40px rgba(58, 99, 255, 0.15) !important;
}

.leadform-glow {
  background: radial-gradient(circle, rgba(46, 200, 255, 0.35), transparent 70%) !important;
}

/* Sections */
.trust {
  background: #070f1f !important;
  border-top: 1px solid rgba(46, 200, 255, 0.25) !important;
  border-bottom: 1px solid rgba(180, 77, 255, 0.2) !important;
}

.trust ul.ser li img {
  filter: invert(1) hue-rotate(180deg) brightness(1.15) contrast(1.05) !important;
  opacity: 0.95;
}

.next-level,
.pricing,
.award,
.contact,
.cta,
.recent-work,
.industries,
.ready-sec,
.development,
.testimonial {
  background-color: var(--soft-bg) !important;
  color: var(--soft-text);
}

.next-level p,
.pricing p,
.cont-hd p,
.award-wrap p {
  color: var(--soft-muted) !important;
}

.headingOne,
.pricing h3,
.cont-hd h2,
.awd-hd h5 {
  color: var(--soft-text) !important;
}

.main-heading {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  -webkit-text-stroke-width: 1.5px;
  -webkit-text-stroke-color: rgba(46, 200, 255, 0.3) !important;
  opacity: 1;
}

/* Accordion / services cards */
.tab-wrap .card,
.tab-wrap .card .card-header,
#accordion .card {
  background: var(--soft-surface) !important;
  border-color: rgba(46, 200, 255, 0.15) !important;
  color: var(--soft-text) !important;
}

#accordion .btn-link,
#accordion .btn-link span {
  color: var(--soft-text) !important;
}

#accordion .card-body p {
  color: var(--soft-muted) !important;
}

/* Packages */
.pkgbox {
  background: linear-gradient(180deg, rgba(14, 24, 48, 0.95), rgba(8, 14, 30, 0.95)) !important;
  border: 1px solid rgba(46, 200, 255, 0.18) !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35) !important;
  color: var(--soft-text) !important;
}

.pack-name {
  background: var(--soft-btn) !important;
  color: #fff !important;
}

.pack-start {
  display: block;
  margin: 0.35rem 0 0.1rem;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(142, 244, 255, 0.78) !important;
  line-height: 1.2;
}

.pack-price,
.pack-price span,
.pack-price sup {
  color: #8ef4ff !important;
}

.pack-detail ul li {
  color: rgba(245, 248, 255, 0.82) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

.pack-detail {
  border-color: rgba(46, 200, 255, 0.2) !important;
}

/* Industry tiles / process */
.industry-workfor a,
.industry-box,
.process-box,
.step-box {
  background: rgba(14, 24, 48, 0.8) !important;
  border: 1px solid rgba(46, 200, 255, 0.12) !important;
  color: var(--soft-text) !important;
}

/* Contact */
.contact .field-wd input,
.contact .field textarea,
.contact .form-control {
  background: rgba(255, 255, 255, 0.96) !important;
  border: 1px solid rgba(46, 200, 255, 0.2) !important;
  color: #0a1428 !important;
}

.contact .field-btn button,
#signupBtn {
  background-image: var(--soft-btn) !important;
  color: #fff !important;
  border: none !important;
}

.chebox label {
  color: var(--soft-muted) !important;
}

/* Footer already dark — Softalyn tint */
.site-footer {
  background:
    radial-gradient(ellipse 80% 60% at 10% 0%, rgba(46, 200, 255, 0.16), transparent 55%),
    radial-gradient(ellipse 60% 50% at 90% 100%, rgba(180, 77, 255, 0.18), transparent 50%),
    linear-gradient(180deg, #0a1428 0%, #050b18 100%) !important;
}

.footer-social a:hover {
  background: var(--soft-btn) !important;
  border-color: transparent !important;
}

.footer-contact-list i,
.footer-links a:hover {
  color: #8ef4ff !important;
}

.footer-links a:hover {
  color: #8ef4ff !important;
}

/* Owl / misc coral remaps */
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
  background: var(--soft-cyan) !important;
}

.click-btn a.themeBtnBlack,
.package-cta .themeBtnGreeen {
  background-image: var(--soft-btn) !important;
  color: #fff !important;
}

/* CTA strip — Softalyn gradient instead of coral PNG */
section.cta {
  background:
    radial-gradient(ellipse 50% 80% at 20% 50%, rgba(46, 200, 255, 0.25), transparent 55%),
    radial-gradient(ellipse 50% 80% at 80% 50%, rgba(180, 77, 255, 0.28), transparent 55%),
    linear-gradient(100deg, #0e4f8c, #1b3eb8 48%, #5a2a96) !important;
  background-size: cover !important;
  border-top: 1px solid rgba(46, 200, 255, 0.2);
  border-bottom: 1px solid rgba(180, 77, 255, 0.2);
}

section.cta img.left,
section.cta img.right {
  filter: none;
  opacity: 0.9;
}

section.cta h3,
section.cta p {
  color: #fff !important;
}

section.ready,
.ready-sec,
section.ready .click-btn {
  background-color: transparent;
}

.ready {
  background:
    linear-gradient(180deg, rgba(5, 11, 24, 0.88), rgba(5, 11, 24, 0.92)),
    url(../images/readybg.png) center / cover no-repeat !important;
}

.portfolio {
  background: #070f1f !important;
}

.portfolio h3 {
  color: var(--soft-text) !important;
}

.portfolio h3 span {
  background-image: var(--soft-grad) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

/* Hardcoded coral hex sweep */
*[style*="#e55565"],
*[style*="#E55565"] {
  /* noop for inline; CSS overrides cover classes */
}

/* Softalyn logo sizing helpers */
.logo-softalyn img,
.footer-brand img,
.footer-brand .brand-logo {
  max-height: 96px;
  width: auto;
  filter: drop-shadow(0 0 16px rgba(46, 200, 255, 0.28));
}

.footer-brand-logo {
  margin-bottom: 1rem;
  display: inline-flex;
}

/* Sweep leftover coral hardcodes from original theme */
.leadform,
.leadform.leadform-advance {
  border-color: rgba(46, 200, 255, 0.4) !important;
}

.trust {
  border-color: rgba(46, 200, 255, 0.25) !important;
}

.pkgbox .pack-name,
.pack-name-price .pack-name {
  background: var(--soft-btn) !important;
}

.owl-carousel .owl-nav button,
.swiper-button-next,
.swiper-button-prev {
  color: #8ef4ff !important;
}

/* Process / CTA coral bars */
.cta .themeBtnBlack,
.click-btn .themeBtnBlack {
  background-image: var(--soft-btn) !important;
  border: none !important;
}

section.pricing.pr2 {
  background:
    radial-gradient(ellipse 70% 40% at 50% 0%, rgba(58, 99, 255, 0.15), transparent 60%),
    var(--soft-bg) !important;
}

.award {
  background: #070f1f !important;
}

.awd-list li {
  filter: brightness(1.1);
}

body.imagetag .copy_main {
  display: none !important;
}
