/* Service pages — light theme overrides (only when html is not .dark) */

html:not(.dark) body.service-page {
    background-color: #f6f3fc !important;
    color: #2a1454 !important;
}

html:not(.dark) {
    scrollbar-color: #8750f7 #f6f3fc;
}

html:not(.dark) ::-webkit-scrollbar-track {
    background: #ebe4f8;
}

html:not(.dark) ::-webkit-scrollbar-thumb {
    background: linear-gradient(to bottom, #8750f7, #6b2fd4);
}

/* ---- Dark utility backgrounds → light surfaces ---- */
html:not(.dark) body.service-page [class*="bg-[#030303]"],
html:not(.dark) body.service-page [class*="bg-[#0F0715]"],
html:not(.dark) body.service-page [class*="bg-[#0f0715]"],
html:not(.dark) body.service-page .bg-black {
    background-color: #ffffff !important;
}

html:not(.dark) body.service-page [class*="hover:bg-[#1b0f2e]"]:hover,
html:not(.dark) body.service-page [class*="hover:bg-[#120a1c]"]:hover {
    background-color: #f0e9ff !important;
}

html:not(.dark) body.service-page [class*="border-[#492a85]"],
html:not(.dark) body.service-page [class*="border-[#2d1a4d]"] {
    border-color: rgba(135, 80, 247, 0.22) !important;
}

html:not(.dark) body.service-page [class*="hover:border-[#492a85]"]:hover {
    border-color: rgba(135, 80, 247, 0.45) !important;
}

/* Accent purple banner stays purple */
html:not(.dark) body.service-page [class*="bg-[#7c4be1]"] {
    background-color: #8750f7 !important;
    color: #ffffff !important;
}

html:not(.dark) body.service-page [class*="bg-[#7c4be1]"] h2,
html:not(.dark) body.service-page [class*="bg-[#7c4be1]"] p,
html:not(.dark) body.service-page [class*="bg-[#7c4be1]"] span,
html:not(.dark) body.service-page [class*="bg-[#7c4be1]"] a {
    color: #ffffff !important;
}

/* ---- Text contrast ---- */
html:not(.dark) body.service-page .text-white:not(a[class*="from-[#712BFE]"]):not([class*="bg-[#7c4be1]"] *),
html:not(.dark) body.service-page .text-white-color:not(a[class*="bg-gradient"]) {
    color: #2a1454 !important;
}

html:not(.dark) body.service-page .text-primary-color-light {
    color: #5d4b7a !important;
}

html:not(.dark) body.service-page section.text-white {
    color: #2a1454 !important;
}

html:not(.dark) body.service-page section.text-white h1,
html:not(.dark) body.service-page section.text-white h2,
html:not(.dark) body.service-page section.text-white h3,
html:not(.dark) body.service-page section.text-white h4 {
    color: #2a1454 !important;
}

html:not(.dark) body.service-page section.text-white p,
html:not(.dark) body.service-page section.text-white li,
html:not(.dark) body.service-page section.text-white span:not([class*="bg-"]) {
    color: #5d4b7a !important;
}

/* Gradient / filled CTAs keep white text */
html:not(.dark) body.service-page a[class*="from-[#712BFE]"],
html:not(.dark) body.service-page a[class*="bg-gradient"],
html:not(.dark) body.service-page a[class*="bg-[#8C57F7]"],
html:not(.dark) body.service-page .web-faq-cta {
    color: #ffffff !important;
}

html:not(.dark) body.service-page a[class*="border-[#8C57F7]"][class*="text-[#8750F7]"]:hover {
    color: #ffffff !important;
}

/* Soft cards */
html:not(.dark) body.service-page [class*="bg-[#0F0715]"].rounded-lg,
html:not(.dark) body.service-page [class*="bg-[#0F0715]"].rounded-xl,
html:not(.dark) body.service-page [class*="bg-[#0f0715]"].rounded-lg,
html:not(.dark) body.service-page [class*="bg-[#0f0715]"].rounded-xl {
    box-shadow: 0 8px 24px rgba(42, 20, 84, 0.06);
}

html:not(.dark) body.service-page [class*="bg-[#0F0715]"] p,
html:not(.dark) body.service-page [class*="bg-[#0f0715]"] p {
    color: #5d4b7a !important;
}

html:not(.dark) body.service-page [class*="bg-[#0F0715]"] h3,
html:not(.dark) body.service-page [class*="bg-[#0f0715]"] h3 {
    color: #2a1454 !important;
}

/* Feature cards */
html:not(.dark) body.service-page .web-feature-card {
    background: linear-gradient(145deg, #ffffff, #f8f4ff);
    border-color: rgba(135, 80, 247, 0.18);
    box-shadow: 0 8px 24px rgba(42, 20, 84, 0.06);
}

html:not(.dark) body.service-page .web-feature-card:hover {
    border-color: rgba(135, 80, 247, 0.4);
    box-shadow: 0 16px 40px rgba(135, 80, 247, 0.12);
}

html:not(.dark) body.service-page .web-feature-card h3 {
    color: #2a1454 !important;
}

html:not(.dark) body.service-page .web-feature-card p {
    color: #5d4b7a !important;
}

/* Tech stack */
html:not(.dark) body.service-page .tech-stack-tab.is-active {
    color: #8750f7;
    border-color: #8750f7;
}

html:not(.dark) body.service-page .tech-stack-tab:not(.is-active) {
    color: #6b5b85;
}

html:not(.dark) body.service-page .tech-stack-tab:not(.is-active):hover {
    color: #8750f7;
    border-color: rgba(135, 80, 247, 0.4);
}

html:not(.dark) body.service-page .tech-stack-item__icon {
    background: #ffffff;
    border-color: rgba(135, 80, 247, 0.18);
    box-shadow: 0 4px 14px rgba(42, 20, 84, 0.05);
}

html:not(.dark) body.service-page .tech-stack-item__label {
    color: #4b3b66;
}

/* FAQ */
html:not(.dark) body.service-page .web-faq-eyebrow {
    color: #8750f7;
    background: rgba(135, 80, 247, 0.08);
    border-color: rgba(135, 80, 247, 0.2);
}

html:not(.dark) body.service-page .web-faq-title {
    background: linear-gradient(135deg, #2a1454 0%, #8750f7 55%, #6b2fd4 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

html:not(.dark) body.service-page .web-faq-item {
    background: linear-gradient(145deg, #ffffff, #f8f4ff);
    border-color: rgba(135, 80, 247, 0.16);
}

html:not(.dark) body.service-page .web-faq-item:hover,
html:not(.dark) body.service-page .web-faq-item.is-open {
    border-color: rgba(135, 80, 247, 0.4);
    box-shadow: 0 12px 32px rgba(135, 80, 247, 0.1);
}

html:not(.dark) body.service-page .web-faq-item__trigger {
    color: #2a1454;
}

html:not(.dark) body.service-page .web-faq-item.is-open .web-faq-item__trigger {
    background: linear-gradient(90deg, rgba(135, 80, 247, 0.1), rgba(135, 80, 247, 0.02));
}

html:not(.dark) body.service-page .web-faq-item__number {
    color: #8750f7;
    background: rgba(135, 80, 247, 0.1);
    border-color: rgba(135, 80, 247, 0.22);
}

html:not(.dark) body.service-page .web-faq-item__answer {
    color: #5d4b7a;
    border-left-color: rgba(135, 80, 247, 0.35);
}

html:not(.dark) body.service-page .web-faq-item__chevron {
    color: #8750f7;
    background: rgba(135, 80, 247, 0.08);
    border-color: rgba(135, 80, 247, 0.18);
}

html:not(.dark) body.service-page .web-faq-item.is-open .web-faq-item__chevron {
    color: #ffffff;
    background: #8750f7;
}

/* Hero headings that force text-white */
html:not(.dark) body.service-page h3[class*="text-white"] {
    color: #2a1454 !important;
}
