/* Cate-like hero blocks: dark mode polish */
html.dark :where(section, div):has(.animate-blob),
html[data-theme='dark'] :where(section, div):has(.animate-blob) {
    isolation: isolate;
}

/* Handle light gradient heroes (e.g. from-blue-50 to-white) */
html.dark section.bg-gradient-to-b.from-blue-50.to-white,
html.dark section.bg-gradient-to-b.from-indigo-50.to-white,
html.dark section.bg-gradient-to-b.from-purple-50.to-white,
html.dark section.bg-gradient-to-b.from-pink-50.to-white,
html[data-theme='dark'] section.bg-gradient-to-b.from-blue-50.to-white,
html[data-theme='dark'] section.bg-gradient-to-b.from-indigo-50.to-white,
html[data-theme='dark'] section.bg-gradient-to-b.from-purple-50.to-white,
html[data-theme='dark'] section.bg-gradient-to-b.from-pink-50.to-white {
    --tw-gradient-from: #091a31 var(--tw-gradient-from-position) !important;
    --tw-gradient-via: #0d213c var(--tw-gradient-via-position) !important;
    --tw-gradient-to: rgb(9 26 49 / 0) var(--tw-gradient-to-position) !important;
    background-image: linear-gradient(to bottom, var(--tw-gradient-stops)) !important;
}

html.dark :where(section, div):has(.animate-blob).bg-gradient-to-b,
html[data-theme='dark'] :where(section, div):has(.animate-blob).bg-gradient-to-b {
    --tw-gradient-from: #091a31 var(--tw-gradient-from-position) !important;
    --tw-gradient-via: #0d213c var(--tw-gradient-via-position) !important;
    --tw-gradient-to: rgb(9 26 49 / 0) var(--tw-gradient-to-position) !important;
    background-image: linear-gradient(to bottom, var(--tw-gradient-stops)) !important;
}

html.dark :where(section, div):has(.animate-blob).from-blue-50,
html.dark :where(section, div):has(.animate-blob).from-indigo-50,
html.dark :where(section, div):has(.animate-blob).from-purple-50,
html.dark :where(section, div):has(.animate-blob).from-pink-50,
html[data-theme='dark'] :where(section, div):has(.animate-blob).from-blue-50,
html[data-theme='dark'] :where(section, div):has(.animate-blob).from-indigo-50,
html[data-theme='dark'] :where(section, div):has(.animate-blob).from-purple-50,
html[data-theme='dark'] :where(section, div):has(.animate-blob).from-pink-50 {
    --tw-gradient-from: #091a31 var(--tw-gradient-from-position) !important;
    --tw-gradient-to: rgb(9 26 49 / 0) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}

html.dark :where(section, div):has(.animate-blob).via-white,
html.dark :where(section, div):has(.animate-blob).to-white,
html.dark :where(section, div):has(.animate-blob).to-gray-50,
html[data-theme='dark'] :where(section, div):has(.animate-blob).via-white,
html[data-theme='dark'] :where(section, div):has(.animate-blob).to-white,
html[data-theme='dark'] :where(section, div):has(.animate-blob).to-gray-50 {
    --tw-gradient-via: #0d213c var(--tw-gradient-via-position) !important;
    --tw-gradient-to: rgb(13 33 60 / 0) var(--tw-gradient-to-position) !important;
}

html.dark :where(section, div):has(.animate-blob) :where(h1, h2, h3),
html[data-theme='dark'] :where(section, div):has(.animate-blob) :where(h1, h2, h3) {
    color: #ecf4ff !important;
}

html.dark :where(section, div):has(.animate-blob) :where(.text-gray-700, .text-gray-600, .text-gray-500),
html[data-theme='dark'] :where(section, div):has(.animate-blob) :where(.text-gray-700, .text-gray-600, .text-gray-500) {
    color: #b8cbe5 !important;
}

/* Tone down bright blobs in hero */
html.dark :where(section, div):has(.animate-blob) :where([class*='rounded-full'][class*='blur']),
html[data-theme='dark'] :where(section, div):has(.animate-blob) :where([class*='rounded-full'][class*='blur']) {
    opacity: 0.2 !important;
    mix-blend-mode: normal !important;
    filter: blur(80px) !important;
}

html.dark .animate-blob[class*='rounded-full'][class*='blur'],
html[data-theme='dark'] .animate-blob[class*='rounded-full'][class*='blur'] {
    opacity: 0.2 !important;
    mix-blend-mode: normal !important;
    filter: blur(80px) !important;
}

/* Hero cards/chips */
html.dark :where(section, div):has(.animate-blob) :where([class*='bg-white/80'], [class*='bg-white/90'], [class*='backdrop-blur-sm']),
html[data-theme='dark'] :where(section, div):has(.animate-blob) :where([class*='bg-white/80'], [class*='bg-white/90'], [class*='backdrop-blur-sm']) {
    background: rgba(15, 28, 47, 0.72) !important;
    border-color: rgba(69, 89, 117, 0.52) !important;
    color: #dbe8fb !important;
}

/* Hero secondary white buttons */
html.dark :where(section, div):has(.animate-blob) :where(a[class*='bg-white'], button[class*='bg-white']),
html[data-theme='dark'] :where(section, div):has(.animate-blob) :where(a[class*='bg-white'], button[class*='bg-white']) {
    background: rgba(15, 27, 44, 0.92) !important;
    border-color: rgba(79, 98, 124, 0.56) !important;
    color: #e6f0ff !important;
}

html.dark :where(section, div):has(.animate-blob) :where(a[class*='bg-white']:hover, button[class*='bg-white']:hover),
html[data-theme='dark'] :where(section, div):has(.animate-blob) :where(a[class*='bg-white']:hover, button[class*='bg-white']:hover) {
    background: rgba(22, 39, 63, 0.96) !important;
}

/* Aipic landing performance band (included by many cate pages) */
html.dark #nb-performance .nb-performance-decor,
html[data-theme='dark'] #nb-performance .nb-performance-decor {
    display: none !important;
}
