/* GENERATED by tools/build-daylight.py — concat of: daylight.generated.css, daylight.css, daylight-blue.css, pricing-cards.css. Edit the parts. */

/* ===== daylight.generated.css ===== */
/* GENERATED by tools/build-daylight.py from home-ai.css — do not edit.
   Light ("Daylight") remap of every night-coloured declaration, scoped to
   light mode. Hand-tuned overrides: daylight.css (loaded after this). */

html:not([data-theme="dark"]) body.home-ai {
  background: var(--night);
}

html:not([data-theme="dark"]) body.home-ai .nav-wrap {
  background: var(--night);
  border-bottom: 1px solid var(--night-line);
}

html:not([data-theme="dark"]) body.home-ai .nav-wrap.is-stuck {
  box-shadow: 0 10px 40px -20px rgba(13,40,90,0.22);
}

html:not([data-theme="dark"]) body.home-ai .nav-link,
html:not([data-theme="dark"]) body.home-ai .nav-signin,
html:not([data-theme="dark"]) body.home-ai .nav-burger {
  color: var(--night-text);
}

html:not([data-theme="dark"]) body.home-ai .nav-links a.nav-link:hover {
  color: #0b1a33;
  background: rgba(13,40,90,0.044);
}

html:not([data-theme="dark"]) body.home-ai .nav-signin:hover {
  color: #0b1a33;
}

html:not([data-theme="dark"]) body.home-ai .nav-ai {
  color: #1668b8 !important;
}

html:not([data-theme="dark"]) body.home-ai .nav-cta .btn-primary {
  box-shadow: 0 0 0 1px rgba(13,40,90,0.08), 0 8px 24px -10px rgba(13,40,90,0.08);
}

html:not([data-theme="dark"]) body.home-ai .nav-burger {
  color: #0b1a33;
}

html:not([data-theme="dark"]) body.home-ai .nav-burger:hover {
  background: rgba(13,40,90,0.044);
}

html:not([data-theme="dark"]) body.home-ai .nav-burger[aria-expanded="true"] {
  background: rgba(13,40,90,0.055);
}

html:not([data-theme="dark"]) body.home-ai .m-nav {
  background: #ffffff;
}

html:not([data-theme="dark"]) body.home-ai .m-nav a {
  color: var(--night-text);
  border-color: var(--night-line);
}

html:not([data-theme="dark"]) body.home-ai .m-nav a:hover,
html:not([data-theme="dark"]) body.home-ai .m-nav a:active {
  color: #0b1a33;
  background: rgba(13,40,90,0.028);
}

html:not([data-theme="dark"]) body.home-ai .m-nav a.m-sub {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .band-dark {
  background: var(--night);
  color: var(--night-text);
}

html:not([data-theme="dark"]) .band-dark h1,
html:not([data-theme="dark"]) .band-dark h2,
html:not([data-theme="dark"]) .band-dark h3,
html:not([data-theme="dark"]) .band-dark h4 {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .band-dark .lede {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .band-dark .eyebrow {
  color: #1668b8;
}

html:not([data-theme="dark"]) .band-dark .btn-ghost {
  color: #0b1a33;
  border-color: var(--night-line-2);
  background: rgba(13,40,90,0.017);
}

html:not([data-theme="dark"]) .band-dark .btn-ghost:hover {
  background: rgba(13,40,90,0.044);
  border-color: rgba(13,40,90,0.160);
  color: #0b1a33;
}

html:not([data-theme="dark"]) .grad {
  background: #1e90ff;
}

html:not([data-theme="dark"]) .aurora i {
  background: none;
}

html:not([data-theme="dark"]) .aurora::after {
  background: radial-gradient(1200px 600px at 50% 0%, rgba(232,240,251,0) 0%, rgba(7,9,15,0.55) 70%, var(--night) 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Ccircle cx='1' cy='1' r='1' fill='rgba(255,255,255,0.09)'/%3E%3C/svg%3E");
}

html:not([data-theme="dark"]) .pill {
  border: 1px solid var(--night-line-2);
  background: rgba(13,40,90,0.022);
  color: var(--night-text);
}

html:not([data-theme="dark"]) .pill b {
  background: #1e90ff;
}

html:not([data-theme="dark"]) .rot > span {
  background: #1e90ff;
}

html:not([data-theme="dark"]) .ask {
  background: rgba(13,40,90,0.028);
  box-shadow: 0 30px 80px -30px rgba(30,144,255,0.35), inset 0 1px 0 rgba(13,40,90,0.06);
}

html:not([data-theme="dark"]) .ask .spark {
  color: #1668b8;
}

html:not([data-theme="dark"]) .ask input {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .chip {
  color: var(--night-muted);
  border: 1px solid var(--night-line);
  background: rgba(13,40,90,0.011);
}

html:not([data-theme="dark"]) .chip:hover {
  color: #0b1a33;
  border-color: rgba(13,40,90,0.160);
  background: rgba(13,40,90,0.033);
}

html:not([data-theme="dark"]) .h-ai .hero-note {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .h-ai .hero-note svg {
  color: #0d8a74;
}

html:not([data-theme="dark"]) .console-wrap::before {
  background: none;
}

html:not([data-theme="dark"]) .console {
  background: #ffffff;
  border: 1px solid var(--night-line-2);
  box-shadow: 0 50px 120px -40px rgba(13,40,90,0.22), inset 0 1px 0 rgba(13,40,90,0.06);
}

html:not([data-theme="dark"]) .console-head {
  border-bottom: 1px solid var(--night-line);
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .console-head .dots i {
  background: #d3e0f2;
}

html:not([data-theme="dark"]) .console-head .tabs span.on {
  background: rgba(13,40,90,0.044);
  color: #0b1a33;
}

html:not([data-theme="dark"]) .console-head .wallet {
  color: #1668b8;
}

html:not([data-theme="dark"]) .console-head .wallet b {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .roster {
  border-right: 1px solid var(--night-line);
}

html:not([data-theme="dark"]) .roster-title {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .agent.on {
  background: rgba(13,40,90,0.028);
  border-color: var(--night-line-2);
}

html:not([data-theme="dark"]) .agent .av {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .agent .nm {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .agent .ty {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .st.work {
  color: #0d8a74;
}

html:not([data-theme="dark"]) .st.sleep {
  color: #4d6185;
}

html:not([data-theme="dark"]) .st.appr {
  color: #b45309;
}

html:not([data-theme="dark"]) .feed::after {
  background: #ffffff;
}

html:not([data-theme="dark"]) .feed-title {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .feed-title .live {
  color: #0d8a74;
}

html:not([data-theme="dark"]) .ev {
  background: rgba(13,40,90,0.017);
  border: 1px solid var(--night-line);
}

html:not([data-theme="dark"]) .ev .ic svg {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .ev .who {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .ev .who .tool {
  color: #1668b8;
}

html:not([data-theme="dark"]) .ev .msg {
  color: #3b4f6e;
}

html:not([data-theme="dark"]) .ev .msg em {
  color: #b45309;
}

html:not([data-theme="dark"]) .ev .tk {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .ev .act span {
  border: 1px solid var(--night-line-2);
  color: #0b1a33;
}

html:not([data-theme="dark"]) .ev .act span.ok {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .promo-frame {
  background: #ffffff;
  border: 1px solid var(--night-line-2);
  box-shadow: 0 60px 140px -50px rgba(13,40,90,0.22), 0 0 0 1px rgba(13,40,90,0.03), inset 0 1px 0 rgba(13,40,90,0.06);
}

html:not([data-theme="dark"]) .promo-frame::before {
  background: none;
}

html:not([data-theme="dark"]) .promo-frame video {
  background: #ffffff;
}

html:not([data-theme="dark"]) .promo-fs,
html:not([data-theme="dark"]) .promo-pp {
  border: 1px solid rgba(13,40,90,0.160);
  background: rgba(232,240,251,0.72);
  color: #0b1a33;
}

html:not([data-theme="dark"]) .promo-fs:hover,
html:not([data-theme="dark"]) .promo-pp:hover {
  background: rgba(13,40,90,0.077);
}

html:not([data-theme="dark"]) .promo-bar {
  background: rgba(13,40,90,0.044);
}

html:not([data-theme="dark"]) .promo-bar i {
  background: #1e90ff;
}

html:not([data-theme="dark"]) .promo-note {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .band-dark .logostrip p {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .band-dark .logo-marquee::before {
  background: linear-gradient(90deg, var(--night), rgba(232,240,251,0));
}

html:not([data-theme="dark"]) .band-dark .logo-marquee::after {
  background: linear-gradient(270deg, var(--night), rgba(232,240,251,0));
}

html:not([data-theme="dark"]) .band-dark .logo-track img {
  box-shadow: 0 0 0 1px rgba(13,40,90,0.08);
}

html:not([data-theme="dark"]) .bcard {
  background: #ffffff;
  border: 1px solid var(--night-line);
}

html:not([data-theme="dark"]) .bcard::after {
  background: none;
}

html:not([data-theme="dark"]) .bcard:hover {
  border-color: rgba(13,40,90,0.160);
  box-shadow: 0 30px 60px -30px rgba(13,40,90,0.22);
}

html:not([data-theme="dark"]) .bic {
  color: var(--bc, #1668b8);
}

html:not([data-theme="dark"]) .bcard h4 small {
  color: var(--bc, #1668b8);
}

html:not([data-theme="dark"]) .bcard p {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .bcard .more {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .types span {
  color: #0b1a33;
  background: rgba(13,40,90,0.028);
  border: 1px solid var(--night-line);
}

html:not([data-theme="dark"]) .wave i {
  background: #1e90ff;
}

html:not([data-theme="dark"]) .transcript {
  color: #3b4f6e;
  border-left: 2px solid #1668b8;
}

html:not([data-theme="dark"]) .transcript b {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .kv div {
  background: rgba(13,40,90,0.022);
  border: 1px solid var(--night-line);
}

html:not([data-theme="dark"]) .kv small {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .kv b {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .kv b.up {
  color: #0d8a74;
}

html:not([data-theme="dark"]) .bubble.me {
  background: rgba(13,40,90,0.044);
  color: #0b1a33;
}

html:not([data-theme="dark"]) .bubble.ai {
  color: #1668b8;
}

html:not([data-theme="dark"]) .bubble.ai b {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .search {
  background: rgba(13,40,90,0.028);
  border: 1px solid var(--night-line-2);
  color: #0b1a33;
}

html:not([data-theme="dark"]) .search svg {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .hits {
  color: #3b4f6e;
}

html:not([data-theme="dark"]) .hits div {
  background: rgba(13,40,90,0.017);
}

html:not([data-theme="dark"]) .hits em {
  color: #b45309;
}

html:not([data-theme="dark"]) .hits span:last-child {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .tools span {
  color: #1668b8;
}

html:not([data-theme="dark"]) .guard div {
  color: #0b1a33;
  background: rgba(13,40,90,0.017);
  border: 1px solid var(--night-line);
}

html:not([data-theme="dark"]) .logos-ai span {
  color: #0b1a33;
  background: rgba(13,40,90,0.033);
  border: 1px solid var(--night-line-2);
}

html:not([data-theme="dark"]) .logos-ai span i {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .ai-tag {
  background: #eaf3ff;
  color: #1668b8;
}

html:not([data-theme="dark"]) span.ai {
  color: #1668b8;
}

html:not([data-theme="dark"]) .band-dark span.ai,
html:not([data-theme="dark"]) body.home-ai .page-hero span.ai {
  color: #1668b8;
}

html:not([data-theme="dark"]) .mock-ai {
  background: #eaf3ff;
  color: #0b1a33;
}

html:not([data-theme="dark"]) .mock-ai svg {
  color: #1668b8;
}

html:not([data-theme="dark"]) .mock-ai b {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .term {
  background: #ffffff;
  border: 1px solid var(--night-line-2);
  box-shadow: 0 40px 100px -40px rgba(13,40,90,0.22);
}

html:not([data-theme="dark"]) .term-bar {
  border-bottom: 1px solid var(--night-line);
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .term-bar i {
  background: #d3e0f2;
}

html:not([data-theme="dark"]) .term-body {
  color: #3b4f6e;
}

html:not([data-theme="dark"]) .term .u {
  color: #0b6fb8;
}

html:not([data-theme="dark"]) .term .a {
  color: #0d8a74;
}

html:not([data-theme="dark"]) .term .a code {
  color: #1668b8;
}

html:not([data-theme="dark"]) .term .r {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .term .r em {
  color: #b45309;
}

html:not([data-theme="dark"]) .term ul {
  color: #4d6185;
}

html:not([data-theme="dark"]) .mcp-list li {
  color: var(--night-text);
}

html:not([data-theme="dark"]) .mcp-list li svg {
  color: #0d8a74;
}

html:not([data-theme="dark"]) .mcp-list li b {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .mcp-list li span {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .pillars.ai .pillar-ic {
  background: #eaf3ff;
  color: #1668b8;
}

html:not([data-theme="dark"]) .band-dark .stat-num {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .band-dark .stat-num em {
  color: #1668b8;
}

html:not([data-theme="dark"]) .band-dark .stat-label {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .band-dark .stats {
  border-color: var(--night-line);
}

html:not([data-theme="dark"]) body.home-ai .footer {
  border-top: 1px solid var(--night-line);
}

html:not([data-theme="dark"]) body.home-ai .page-hero {
  background: var(--night);
  color: var(--night-text);
}

html:not([data-theme="dark"]) body.home-ai .page-hero::before {
  background: none;
}

html:not([data-theme="dark"]) body.home-ai .page-hero::after {
  background: none;
}

html:not([data-theme="dark"]) body.home-ai .page-hero h1,
html:not([data-theme="dark"]) body.home-ai .page-hero h2,
html:not([data-theme="dark"]) body.home-ai .page-hero h3 {
  color: #0b1a33;
}

html:not([data-theme="dark"]) body.home-ai .page-hero .u-mark {
  color: #0b1a33;
}

html:not([data-theme="dark"]) body.home-ai .page-hero .u-mark > svg path {
  stroke: var(--ph, #1668b8);
}

html:not([data-theme="dark"]) body.home-ai .page-hero .lede,
html:not([data-theme="dark"]) body.home-ai .page-hero p {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) body.home-ai .page-hero .eyebrow {
  color: color-mix(in srgb, var(--ph, #1668b8) 55%, #0b1a33);
}

html:not([data-theme="dark"]) body.home-ai .page-hero .btn-ghost {
  color: #0b1a33;
  border-color: var(--night-line-2);
  background: rgba(13,40,90,0.017);
}

html:not([data-theme="dark"]) body.home-ai .page-hero .btn-ghost:hover {
  background: rgba(13,40,90,0.044);
  color: #0b1a33;
}

html:not([data-theme="dark"]) body.home-ai .page-hero .hero-note {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) body.home-ai .page-hero .hero-note svg {
  color: #0d8a74;
}

html:not([data-theme="dark"]) body.home-ai .page-hero .badge-row .badge {
  background: rgba(13,40,90,0.033);
  color: #0b1a33;
  border-color: var(--night-line-2);
}

html:not([data-theme="dark"]) body.home-ai .page-hero a:not(.btn) {
  color: #1668b8;
}

html:not([data-theme="dark"]) body.home-ai .page-hero .stat-num {
  color: #0b1a33;
}

html:not([data-theme="dark"]) body.home-ai .page-hero .stat-num em {
  color: #1668b8;
}

html:not([data-theme="dark"]) body.home-ai .page-hero .stat-label {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) body.home-ai .dd {
  background: #ffffff;
  border-color: var(--night-line-2);
  box-shadow: 0 30px 60px -20px rgba(13,40,90,0.22), inset 0 1px 0 rgba(13,40,90,0.05);
}

html:not([data-theme="dark"]) body.home-ai .dd-item:hover {
  background: rgba(13,40,90,0.033);
}

html:not([data-theme="dark"]) body.home-ai .dd-t {
  color: #0b1a33;
}

html:not([data-theme="dark"]) body.home-ai .dd-ind .dd-ic svg {
  color: #0b1a33;
}

html:not([data-theme="dark"]) body.home-ai .dd-d {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) body.home-ai .nav-links li:hover > a.nav-link {
  color: #0b1a33;
  background: rgba(13,40,90,0.044);
}

html:not([data-theme="dark"]) body.home-ai .so-backdrop {
  background: #ffffff;
}

html:not([data-theme="dark"]) body.home-ai .so-eyebrow {
  color: #1668b8;
}

html:not([data-theme="dark"]) body.home-ai .so-title {
  color: #0b1a33;
}

html:not([data-theme="dark"]) body.home-ai .so-card {
  background: #ffffff;
  border-color: var(--night-line-2);
}

html:not([data-theme="dark"]) body.home-ai .so.open .so-card:hover,
html:not([data-theme="dark"]) body.home-ai .so.open .so-card:focus-visible {
  border-color: color-mix(in srgb, var(--sc) 60%, var(--night-line-2));
  background: rgba(13,40,90,0.044);
}

html:not([data-theme="dark"]) body.home-ai .so-name {
  color: #0b1a33;
}

html:not([data-theme="dark"]) body.home-ai .so-dom {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) body.home-ai .so-card .go {
  color: #0b1a33;
}

html:not([data-theme="dark"]) body.home-ai .so-close {
  background: rgba(13,40,90,0.044);
  border-color: var(--night-line-2);
  color: #0b1a33;
}

html:not([data-theme="dark"]) body.home-ai .so-close:hover {
  color: #0b1a33;
}

html:not([data-theme="dark"]) body.home-ai .so-hint {
  color: var(--night-muted);
}

@media (max-width: 760px) {
html:not([data-theme="dark"]) body.home-ai .so-backdrop {
  background: rgba(232,240,251,0.7);
}
html:not([data-theme="dark"]) body.home-ai .so-panel {
  background: #ffffff;
  border-top: 1px solid var(--night-line-2);
}
}

html:not([data-theme="dark"]) body.home-ai .faq details:hover {
  border-color: #1668b8;
}

html:not([data-theme="dark"]) .step-ai .n {
  background: #1e90ff;
}

html:not([data-theme="dark"]) .step-ai .t {
  color: #1668b8;
}

html:not([data-theme="dark"]) .step-ai::after {
  border-top: 2px solid #1668b8;
  border-right: 2px solid #1668b8;
}

html:not([data-theme="dark"]) .ai-price > div {
  background: #eaf3ff;
}

html:not([data-theme="dark"]) .ai-price .ic {
  color: #1668b8;
}

html:not([data-theme="dark"]) body.home-ai .feat-card {
  background: #ffffff;
}

html:not([data-theme="dark"]) body.home-ai .feat-card::before {
  background: #ffffff;
}

html:not([data-theme="dark"]) body.home-ai .feat-card::after {
  background: none;
}

html:not([data-theme="dark"]) body.home-ai .feat-ic {
  background: #ffffff;
}

html:not([data-theme="dark"]) body.home-ai .feat-card:hover .feat-ic {
  background: #1e90ff;
  color: #0b1a33;
}

html:not([data-theme="dark"]) body.home-ai .pillar::after,
html:not([data-theme="dark"]) body.home-ai .info-tile::after {
  background: none;
}

html:not([data-theme="dark"]) .ind-prog i {
  background: #1e90ff;
}

html:not([data-theme="dark"]) .ind-vis .term {
  box-shadow: 0 40px 100px -40px color-mix(in srgb, var(--ic) 60%, transparent), 0 0 0 1px rgba(13,40,90,0.04);
}

html:not([data-theme="dark"]) .ind-board {
  background: #ffffff;
  border: 1px solid var(--night-line-2);
  color: #0b1a33;
}

html:not([data-theme="dark"]) .ib-head {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .ib-row {
  background: rgba(13,40,90,0.022);
  border: 1px solid var(--night-line);
}

html:not([data-theme="dark"]) .ib-row b {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .ib-row span {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .ib-row em.held,
html:not([data-theme="dark"]) .ib-row em.warm {
  color: #b45309;
}

html:not([data-theme="dark"]) .ib-row em.hot {
  color: #c2410c;
}

html:not([data-theme="dark"]) .ib-row em.booked {
  color: #0b6fb8;
}

html:not([data-theme="dark"]) .ib-row em.avail {
  color: #0d8a74;
}

html:not([data-theme="dark"]) .ib-foot {
  color: #1668b8;
}

html:not([data-theme="dark"]) .store-badge {
  background: #0b1a33;
  border: 1px solid rgba(13,40,90,0.100);
  box-shadow: 0 1px 2px rgba(13,40,90,0.06);
}

html:not([data-theme="dark"]) .store-badge:hover {
  color: #0b1a33;
  box-shadow: 0 10px 24px -12px rgba(13,40,90,0.18);
}

html:not([data-theme="dark"]) .store-badge small {
  color: rgba(11,26,51,0.70);
}

html:not([data-theme="dark"]) .band-dark .store-badge {
  background: rgba(13,40,90,0.033);
  border-color: rgba(13,40,90,0.140);
}

html:not([data-theme="dark"]) .band-dark .store-badge:hover {
  background: rgba(13,40,90,0.066);
}

html:not([data-theme="dark"]) .footer .store-badge {
  background: rgba(13,40,90,0.033);
  border-color: rgba(13,40,90,0.140);
  color: #0b1a33;
}

html:not([data-theme="dark"]) .footer .store-badge:hover {
  background: rgba(13,40,90,0.066);
  color: #0b1a33;
}

@media (max-width: 1020px) {
html:not([data-theme="dark"]) .roster {
  border-bottom: 1px solid var(--night-line);
}
}

html:not([data-theme="dark"]) .band-dark .agentline,
html:not([data-theme="dark"]) .agentline.on-dark {
  border-color: var(--night-line-2);
  background: rgba(13,40,90,0.022);
  color: var(--night-text);
}

html:not([data-theme="dark"]) .band-dark .agentline:hover,
html:not([data-theme="dark"]) .agentline.on-dark:hover {
  border-color: rgba(13,40,90,0.160);
  background: rgba(13,40,90,0.039);
}

html:not([data-theme="dark"]) .band-dark .agentline .al-ic,
html:not([data-theme="dark"]) .agentline.on-dark .al-ic {
  color: #0b6fb8;
}

html:not([data-theme="dark"]) .band-dark .agentline .al-t small,
html:not([data-theme="dark"]) .agentline.on-dark .al-t small {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .band-dark .agentline .al-go,
html:not([data-theme="dark"]) .agentline.on-dark .al-go {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .band-dark .agentline:hover .al-go,
html:not([data-theme="dark"]) .agentline.on-dark:hover .al-go {
  color: #0b6fb8;
}

html:not([data-theme="dark"]) .callbig.wa {
  background: #1e90ff;
}

html:not([data-theme="dark"]) .callbig.wa .cb-ic {
  background: #1e90ff;
}

html:not([data-theme="dark"]) .callbig.wa .cb-t small {
  color: #0d8a74;
}

html:not([data-theme="dark"]) .band-dark .agentline.al-wa .al-ic,
html:not([data-theme="dark"]) .agentline.al-wa.on-dark .al-ic {
  color: #0d8a74;
}

html:not([data-theme="dark"]) .band-dark .agentline.al-wa:hover .al-go,
html:not([data-theme="dark"]) .agentline.al-wa.on-dark:hover .al-go {
  color: #0d8a74;
}

html:not([data-theme="dark"]) .callbig {
  background: #1e90ff;
  color: #0b1a33;
}

html:not([data-theme="dark"]) .callbig .cb-ic {
  background: #1e90ff;
}

html:not([data-theme="dark"]) .callbig .cb-t small {
  color: #1668b8;
}

html:not([data-theme="dark"]) .callbig .cb-t b {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .callbig .cb-t span {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .callbig .cb-go {
  border: 1px solid var(--night-line-2);
  color: #0b1a33;
}

html:not([data-theme="dark"]) .callbig:hover .cb-go {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .ai-try small {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .ai-btn {
  background: #1e90ff;
  color: #0b1a33;
}

html:not([data-theme="dark"]) .ai-btn svg {
  color: #1668b8;
}

html:not([data-theme="dark"]) .ai-btn.wa {
  background: #1e90ff;
}

html:not([data-theme="dark"]) .ai-btn.wa svg {
  color: #0d8a74;
}

html:not([data-theme="dark"]) .ai-card {
  background: #ffffff;
  border: 1px solid var(--night-line-2);
}

html:not([data-theme="dark"]) .ai-card::before {
  background: #1e90ff;
}

html:not([data-theme="dark"]) .ai-card .bic {
  color: var(--bc, #1668b8);
}

html:not([data-theme="dark"]) .ai-card small {
  color: var(--bc, #1668b8);
}

html:not([data-theme="dark"]) .ai-card h4 {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .ai-card p {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .ai-roster div {
  color: #0b1a33;
  background: rgba(13,40,90,0.022);
  border: 1px solid var(--night-line);
}

html:not([data-theme="dark"]) .ai-roster em {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .ai-item:hover {
  background: rgba(13,40,90,0.019);
  border-color: var(--night-line);
}

html:not([data-theme="dark"]) .ai-item .bic {
  color: var(--bc, #1668b8);
}

html:not([data-theme="dark"]) .ai-item h5 {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .ai-item p {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .ai-guard {
  border: 1px solid var(--night-line-2);
  background: #ffffff;
}

html:not([data-theme="dark"]) .ai-guard .bic {
  color: #0d8a74;
}

html:not([data-theme="dark"]) .ai-guard h5 {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .ai-guard p {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .ai-guard-toggles {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .ai-guard-toggles .tog::after {
  background: #ffffff;
}

html:not([data-theme="dark"]) .ai-guard-toggles .tog.off {
  background: rgba(13,40,90,0.099);
}

html:not([data-theme="dark"]) .vs-k {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .vs-opt {
  border: 1px solid var(--night-line-2);
  background: rgba(13,40,90,0.017);
  color: var(--night-text);
}

html:not([data-theme="dark"]) .vs-opt small {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .vs-opt:hover {
  background: rgba(13,40,90,0.039);
  border-color: rgba(13,40,90,0.160);
}

html:not([data-theme="dark"]) .vs-opt.is-on {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .vs-opt.is-on small {
  color: #1668b8;
}

html:not([data-theme="dark"]) .vs-voices .vs-opt i {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .vs-player {
  background: #ffffff;
  box-shadow: 0 40px 100px -40px rgba(139,92,246,0.6), inset 0 1px 0 rgba(13,40,90,0.06);
}

html:not([data-theme="dark"]) .vs-play {
  background: #1e90ff;
}

html:not([data-theme="dark"]) .vs-who b {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .vs-ai {
  color: #1668b8;
}

html:not([data-theme="dark"]) .vs-who small {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .vs-time {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .vs-bars i {
  background: #1e90ff;
}

html:not([data-theme="dark"]) .vs-prog {
  background: rgba(13,40,90,0.055);
}

html:not([data-theme="dark"]) .vs-prog i {
  background: #1e90ff;
}

html:not([data-theme="dark"]) .vs-line {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .vs-en {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .vs-foot {
  border-top: 1px solid var(--night-line);
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .footer-bottom .footer-parent {
  color: #4d6185;
}

html:not([data-theme="dark"]) body.home-ai .footer .footer-parent a:hover {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .lead-card {
  background: #ffffff;
  border: 1px solid var(--night-line-2);
}

html:not([data-theme="dark"]) .lead-card::before {
  background: #1e90ff;
}

html:not([data-theme="dark"]) .lead-card:hover {
  border-color: color-mix(in srgb, var(--lc, #1668b8) 45%, var(--night-line-2));
}

html:not([data-theme="dark"]) .lead-card b {
  color: #0b1a33;
}

html:not([data-theme="dark"]) .lead-card small {
  color: var(--night-muted);
}

html:not([data-theme="dark"]) .lead-card .lead-li {
  color: var(--lc, #1668b8);
}

html:not([data-theme="dark"]) .band-dark .badge-row .badge {
  background: rgba(13,40,90,0.033);
  color: #0b1a33;
  border-color: var(--night-line-2);
}

html:not([data-theme="dark"]) .band-dark .badge-row .badge:hover {
  background: rgba(13,40,90,0.066);
}

/* ===== daylight.css ===== */
/* ============================================================
   GRACIAX — "Daylight": the light theme (default since 2026-10-18)
   Loaded after home-ai.css and daylight.generated.css on every page.
   Dark mode = html[data-theme="dark"] = the original night design,
   untouched. Everything here is scoped to light mode.

   The look matches the CRM's light mode: a pale logo-blue ground,
   white cards, navy ink, the Graciax blue (#1e90ff) as the one
   accent, and very few gradients.
   ============================================================ */

html:not([data-theme="dark"]) {
  /* night tokens → daylight (home-ai.css and the generated layer read these) */
  --night: #e8f0fb;
  --night-2: #ffffff;
  --night-3: #f2f7fe;
  --night-line: #d3e0f2;
  --night-line-2: #c3d4ec;
  --night-text: #0b1a33;
  --night-muted: #4d6185;

  /* base tokens (revamp.css) → the same blue family as the CRM */
  --ink: #0b1a33;
  --ink-soft: #283d5e;
  --body: #3b4f6e;
  --muted: #4d6185;
  --line: #d3e0f2;
  --canvas: #ffffff;
  --canvas-soft: #f2f7fe;
  --canvas-tint: #eaf3ff;
  --accent-soft: #e1eeff;
  --shadow-sm: 0 1px 2px rgba(13, 40, 90, 0.06), 0 2px 8px -2px rgba(13, 40, 90, 0.06);
  --shadow-md: 0 2px 4px rgba(13, 40, 90, 0.04), 0 14px 32px -12px rgba(13, 40, 90, 0.18);
  --shadow-lg: 0 4px 8px rgba(13, 40, 90, 0.04), 0 30px 64px -24px rgba(13, 40, 90, 0.3);
  color-scheme: light;
}
html[data-theme="dark"] { color-scheme: dark; }

/* ---------- Page + nav ---------- */
html:not([data-theme="dark"]) body.home-ai { background: #e8f0fb; color: var(--body); }
html:not([data-theme="dark"]) body.home-ai .nav-wrap {
  background: rgba(255, 255, 255, 0.92);
  border-bottom: 1px solid var(--line);
  -webkit-backdrop-filter: saturate(1.4) blur(12px);
  backdrop-filter: saturate(1.4) blur(12px);
}
html:not([data-theme="dark"]) body.home-ai .nav-logo img { filter: none; }
html:not([data-theme="dark"]) body.home-ai .nav-link,
html:not([data-theme="dark"]) body.home-ai .nav-signin { color: var(--ink-soft); }
html:not([data-theme="dark"]) body.home-ai .nav-links a.nav-link:hover,
html:not([data-theme="dark"]) body.home-ai .nav-links li:hover > a.nav-link { color: var(--ink); background: #eaf3ff; }
html:not([data-theme="dark"]) body.home-ai .nav-ai { color: var(--accent-dark) !important; }
html:not([data-theme="dark"]) body.home-ai .nav-burger { color: var(--ink); }

/* Solid logo-blue primary everywhere (the night design used a white button). */
html:not([data-theme="dark"]) body.home-ai .btn-primary,
html:not([data-theme="dark"]) body.home-ai .nav-cta .btn-primary,
html:not([data-theme="dark"]) .band-dark .btn-primary,
html:not([data-theme="dark"]) body.home-ai .page-hero .btn-primary,
html:not([data-theme="dark"]) body.home-ai .m-nav a.btn {
  background: #1e90ff;
  border-color: #1e90ff;
  color: #ffffff;
  box-shadow: 0 1px 2px rgba(13, 71, 161, 0.25), 0 6px 16px -6px rgba(30, 144, 255, 0.55);
}
html:not([data-theme="dark"]) body.home-ai .btn-primary:hover,
html:not([data-theme="dark"]) .band-dark .btn-primary:hover,
html:not([data-theme="dark"]) body.home-ai .nav-cta .btn-primary:hover,
html:not([data-theme="dark"]) body.home-ai .page-hero .btn-primary:hover,
html:not([data-theme="dark"]) body.home-ai .m-nav a.btn:hover {
  background: #1677e6;
  border-color: #1677e6;
  color: #ffffff;
}
html:not([data-theme="dark"]) .band-dark .btn-ghost,
html:not([data-theme="dark"]) body.home-ai .page-hero .btn-ghost {
  background: #ffffff;
  color: var(--ink);
  border-color: var(--line);
  box-shadow: var(--shadow-sm);
}
html:not([data-theme="dark"]) .band-dark .btn-ghost:hover,
html:not([data-theme="dark"]) body.home-ai .page-hero .btn-ghost:hover {
  background: #ffffff;
  color: var(--ink);
  border-color: #a9bfe0;
}

/* ---------- Former night bands ---------- */
html:not([data-theme="dark"]) .band-dark,
html:not([data-theme="dark"]) body.home-ai .page-hero { background: #e8f0fb; color: var(--body); }
html:not([data-theme="dark"]) .band-dark h1,
html:not([data-theme="dark"]) .band-dark h2,
html:not([data-theme="dark"]) .band-dark h3,
html:not([data-theme="dark"]) .band-dark h4,
html:not([data-theme="dark"]) .band-dark h5,
html:not([data-theme="dark"]) body.home-ai .page-hero h1,
html:not([data-theme="dark"]) body.home-ai .page-hero h2,
html:not([data-theme="dark"]) body.home-ai .page-hero h3 { color: var(--ink); }
html:not([data-theme="dark"]) .band-dark .lede,
html:not([data-theme="dark"]) .band-dark p,
html:not([data-theme="dark"]) body.home-ai .page-hero .lede,
html:not([data-theme="dark"]) body.home-ai .page-hero p { color: var(--body); }
html:not([data-theme="dark"]) .band-dark .eyebrow,
html:not([data-theme="dark"]) body.home-ai .page-hero .eyebrow { color: var(--accent-dark); }

/* Fewer gradients: no aurora glow, no dot grid, no gradient text. */
html:not([data-theme="dark"]) .aurora,
html:not([data-theme="dark"]) body.home-ai .page-hero::after { display: none; }
/* The headline outcomes ("calls your leads.", "works your pipeline." …) and
   every .grad phrase: one solid brand blue in BOTH modes (2026-10-18, the
   user's call) instead of the sky → violet → jade gradient. Light uses the
   logo blue stepped just enough to hold large-text contrast on the pale
   ground; dark uses the logo tile's lighter top blue. */
.grad,
.grad *,
.rot > span {
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
}
html:not([data-theme="dark"]) .grad,
html:not([data-theme="dark"]) .grad *,
html:not([data-theme="dark"]) .rot > span { color: #1677e6 !important; }
html[data-theme="dark"] .grad,
html[data-theme="dark"] .grad *,
html[data-theme="dark"] .rot > span { color: #3aa0ff !important; }

/* Cards that were glass on night: white, a hairline, a soft lift. */
html:not([data-theme="dark"]) .bcard,
html:not([data-theme="dark"]) .ai-card,
html:not([data-theme="dark"]) .lead-card,
html:not([data-theme="dark"]) .console,
html:not([data-theme="dark"]) .term,
html:not([data-theme="dark"]) .ind-board,
html:not([data-theme="dark"]) .vs-player,
html:not([data-theme="dark"]) .callbig,
html:not([data-theme="dark"]) .ai-guard,
html:not([data-theme="dark"]) body.home-ai .so-card,
html:not([data-theme="dark"]) .promo-frame {
  background: #ffffff !important;
  border: 1px solid var(--line) !important;
  box-shadow: var(--shadow-sm) !important;
  color: var(--body);
}
html:not([data-theme="dark"]) .bcard:hover,
html:not([data-theme="dark"]) .lead-card:hover,
html:not([data-theme="dark"]) .callbig:hover { box-shadow: var(--shadow-md) !important; border-color: #a9bfe0 !important; }
html:not([data-theme="dark"]) .ai-card::before,
html:not([data-theme="dark"]) .lead-card::before,
html:not([data-theme="dark"]) .bcard::before { background: #1e90ff !important; opacity: 0.85; }
html:not([data-theme="dark"]) .ai-btn {
  background: #ffffff !important;
  border: 1px solid var(--line) !important;
  color: var(--ink) !important;
  box-shadow: var(--shadow-sm);
}
html:not([data-theme="dark"]) .vs-play { background: #1e90ff !important; box-shadow: 0 0 0 6px rgba(30, 144, 255, 0.14) !important; }
html:not([data-theme="dark"]) .vs-opt.is-on {
  background: #eaf3ff !important;
  border-color: #1e90ff !important;
  color: var(--ink) !important;
  box-shadow: none !important;
}
html:not([data-theme="dark"]) .pill { background: #ffffff; border-color: var(--line); color: var(--ink-soft); }
html:not([data-theme="dark"]) .pill b { background: #1e90ff !important; color: #ffffff; }
html:not([data-theme="dark"]) .ask {
  background: #ffffff !important;
  border-color: #c3d4ec !important;
  box-shadow: 0 1px 2px rgba(13, 40, 90, 0.06), 0 12px 32px -16px rgba(13, 40, 90, 0.28) !important;
}
html:not([data-theme="dark"]) .ask input { color: var(--ink); }
html:not([data-theme="dark"]) .ask button { background: #1e90ff !important; color: #ffffff !important; }
html:not([data-theme="dark"]) .chip { background: #ffffff; border-color: var(--line); color: var(--ink-soft); }
html:not([data-theme="dark"]) .chip:hover { border-color: #1e90ff; color: var(--ink); }

/* The marquee's logo tiles already sit on white; drop the night frame. */
html:not([data-theme="dark"]) .band-dark .logo-track img { box-shadow: 0 0 0 1px var(--line); opacity: 1; }

/* ---------- Theme switch (injected into .nav-cta by theme.js) ---------- */
.theme-toggle {
  display: inline-grid;
  place-items: center;
  width: 40px;
  height: 40px;
  margin-right: 4px;
  border-radius: 12px;
  border: 1px solid var(--line, #d3e0f2);
  background: #ffffff;
  color: #0b1a33;
  cursor: pointer;
  flex: none;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
.theme-toggle:hover { border-color: #1e90ff; }
.theme-toggle:active { transform: scale(0.94); }
.theme-toggle svg { width: 18px; height: 18px; display: block; }
.theme-toggle .ic-sun { display: none; }
html[data-theme="dark"] .theme-toggle {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.16);
  color: #e6e9f2;
}
html[data-theme="dark"] .theme-toggle:hover { background: rgba(255, 255, 255, 0.12); }
html[data-theme="dark"] .theme-toggle .ic-sun { display: block; }
html[data-theme="dark"] .theme-toggle .ic-moon { display: none; }
@media (prefers-reduced-motion: reduce) { .theme-toggle { transition: none; } }

/* ---------- Footer: light, like the rest of the page ---------- */
html:not([data-theme="dark"]) .footer {
  background: #ffffff;
  color: var(--body);
  border-top: 1px solid var(--line);
}
html:not([data-theme="dark"]) .footer-grid { border-bottom-color: var(--line); }
html:not([data-theme="dark"]) .footer h5 { color: var(--ink); }
html:not([data-theme="dark"]) .footer a { color: var(--body); }
html:not([data-theme="dark"]) .footer a:hover,
html:not([data-theme="dark"]) body.home-ai .footer .footer-parent a:hover { color: #1668b8; }
html:not([data-theme="dark"]) .footer-addr { color: var(--muted); }
/* The footer ships the white logo; light mode shows the blue one. */
html:not([data-theme="dark"]) .footer-logo img { content: url("../images/graciax-logo.svg"); }
/* App-store badges: one dark pill everywhere in light mode (hero, bands, footer). */
html:not([data-theme="dark"]) .store-badge,
html:not([data-theme="dark"]) .band-dark .store-badge,
html:not([data-theme="dark"]) .footer .store-badge {
  background: #0b1a33 !important;
  border-color: #0b1a33 !important;
  color: #ffffff !important;
}
html:not([data-theme="dark"]) .store-badge:hover,
html:not([data-theme="dark"]) .footer .store-badge:hover { background: #000 !important; color: #fff !important; }
html:not([data-theme="dark"]) .store-badge small { color: rgba(255, 255, 255, 0.75) !important; }

/* ---------- Small fixes ---------- */
body.home-ai .nav-signin { white-space: nowrap; }
html:not([data-theme="dark"]) .ask input::placeholder { color: #8496b3; opacity: 1; }

/* Selected industry tab: the brand blue, not an ink slab. */
html:not([data-theme="dark"]) .ind-tab.is-on { background: #1e90ff; color: #ffffff; }
html:not([data-theme="dark"]) .ind-tab.is-on i { background: #ffffff; box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.3); }

/* Fades and overlays the generator can only flatten: keep them see-through. */
html:not([data-theme="dark"]) .feed::after { background: linear-gradient(rgba(255, 255, 255, 0), #ffffff); }
html:not([data-theme="dark"]) body.home-ai .so-backdrop { background: rgba(232, 240, 251, 0.86); }
html:not([data-theme="dark"]) body.home-ai .feat-card::before { background: var(--fc, #1e90ff); }

/* Small uppercase labels: the logo blue is too light for 12px text on the
   pale ground; the deeper step holds contrast. */
html:not([data-theme="dark"]) .eyebrow { color: #1668b8; }
html:not([data-theme="dark"]) .eyebrow { color: #1668b8 !important; }

/* Card labels whose colour comes from a per-card variable in the HTML
   (--bc, --lc: pale sky/violet/mint for night). One readable blue on light. */
html:not([data-theme="dark"]) .bcard h4 small,
html:not([data-theme="dark"]) .ai-card small,
html:not([data-theme="dark"]) .lead-card .lead-li { color: #1668b8 !important; }

/* Text tinted with an industry or status hue (set per element in the HTML):
   keep the hue, deepen it until it reads on white. */
html:not([data-theme="dark"]) .ind-k,
html:not([data-theme="dark"]) .prod-link,
html:not([data-theme="dark"]) .ind-card small,
html:not([data-theme="dark"]) .pt-card .k,
html:not([data-theme="dark"]) .exp .d {
  color: color-mix(in srgb, currentColor 50%, #0b1a33) !important;
}
html:not([data-theme="dark"]) .lede strong { color: var(--ink); }
html:not([data-theme="dark"]) .pg-careers .page-hero .quote-name,
html:not([data-theme="dark"]) .pg-careers .page-hero .quote blockquote { color: var(--ink); }

/* Mode switch: the "Celestial" time-lapse sky is drawn on a full-screen
   canvas by theme.js; the toggle icon spins in as it plays. */
.gx-sky { position: fixed; inset: 0; z-index: 2147483646; pointer-events: none; }
.theme-toggle.spin svg { animation: gxToggleSpin 0.8s cubic-bezier(0.65, 0, 0.35, 1); }
@keyframes gxToggleSpin { from { transform: rotate(-180deg) scale(0.3); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .theme-toggle.spin svg { animation: none; } }

/* Native scrolling (Lenis removed): anchor links glide, under the sticky nav. */
html { scroll-behavior: smooth; scroll-padding-top: 84px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* ===== daylight-blue.css ===== */
/* ============================================================
   GRACIAX — light mode, logo blue (2026-10-19).
   Loaded after daylight.css. Remove this <link> to go back to the
   pale-blue light theme.

   Rule (the user's call: "make both modes the same"): light mode mirrors
   dark mode band for band.
     - Where dark mode draws a night band (.band-dark, .page-hero, the
       footer), light mode draws the logo blue, with the same aurora
       lights in the heroes and white type.
     - Where dark mode draws a white band, light mode draws the same
       white band with navy type (daylight.css already does this).
     - Selected states (the chosen language, business, voice, tab)
       stand out in both modes.
   ============================================================ */

html:not([data-theme="dark"]) body.home-ai {
  --night: #1673e3; /* a step under the logo blue: white body text holds AA */
}
html:not([data-theme="dark"]) body.home-ai main { background: transparent; }

/* ---------- The night bands, in blue ---------- */
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote),
html:not([data-theme="dark"]) body.home-ai .footer {
  background: #1673e3 !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
  --ink: #ffffff;
  --ink-soft: rgba(255, 255, 255, 0.94);
  --body: rgba(255, 255, 255, 0.9);
  --muted: rgba(255, 255, 255, 0.82);
  --night-text: #ffffff;
  --night-muted: rgba(255, 255, 255, 0.82);
  --line: rgba(255, 255, 255, 0.28);
  --night-line: rgba(255, 255, 255, 0.24);
  --night-line-2: rgba(255, 255, 255, 0.34);
  color: rgba(255, 255, 255, 0.9);
}
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(h1, h2, h3, h4) { color: #ffffff; }
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(.lede, p) { color: rgba(255, 255, 255, 0.9); }
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) .eyebrow { color: rgba(255, 255, 255, 0.86) !important; }
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(.grad, .grad *, .rot > span) { color: #d6ecff !important; }
html:not([data-theme="dark"]) body.home-ai .u-mark > svg path { stroke: #ffffff !important; opacity: 0.85; }
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(span.ai, .stat-num em, .stat-num, .quote-role, .quote-role a, .lede em, .lede b, .lede strong, .sect-head em, .sect-head b, .crumb, .hint a, .center > a, .stat-label) {
  color: #ffffff !important;
}
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(.lede, .wallet-note, .center, .note, .fine) a:not(.btn) {
  color: #ffffff !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(.hero-note, .ticks) svg { color: #c7f9e9 !important; }

/* Buttons on the blue: primary white with blue text, ghost outlined. */
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) .btn-primary {
  background: #ffffff !important;
  border-color: #ffffff !important;
  color: #0d6edb !important;
  box-shadow: 0 1px 2px rgba(5, 30, 80, 0.25), 0 10px 24px -10px rgba(5, 30, 80, 0.55) !important;
}
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) .btn-primary:hover { background: #eaf3ff !important; }
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) .btn-ghost {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(255, 255, 255, 0.55) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) .btn-ghost:hover { background: rgba(255, 255, 255, 0.18) !important; }

/* Controls that sat on the night as outlines get a white backing on blue. */
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(.pswitch, .cycle, .gx-region, .vs-opt, .agentline, .chip, .pill, .badge) {
  background: #ffffff !important;
  border-color: #ffffff !important;
}

/* ---------- White surfaces inside the blue: navy type, as before ---------- */
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(
  .feat-card, .badge, details, .bcard, .mock, .b-card, .step-ai, .term, .rev-card,
  .pill, table, .tel, .step, .crew-card, .int-card, .takeaways, .info-tile, .pillar,
  .checklist, .callout, input, textarea, select, .price-card, .ind-card, .rn-entry,
  .ind-board, .console, .chip, .pull, .chan-card, .ai-card, .vs-opt,
  .pt-card, .pt-door, .pt-fit, .cmp, .lead-card, .form-card, .side-card, .ai-btn, .board,
  .see-card, .prod-media, .ask, .promo-frame, .ai-guard, .vs-player, .ind-tabs,
  .ind-note, .pswitch, .callbig, .faq, .agentline,
  .stat, .quote, .cta-chip, .b-tag, .trial-tag, .ind-vis, .mock-ai, .bubble, .bvis,
  .cycle, .gx-region, .oth, .plan, .trial
) {
  --ink: #0b1a33;
  --ink-soft: #283d5e;
  --body: #3b4f6e;
  --muted: #4d6185;
  --line: #d3e0f2;
  --night-text: #0b1a33;
  --night-muted: #4d6185;
  --night-line: #d3e0f2;
  --night-line-2: #c3d4ec;
  color: #3b4f6e;
}
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(
  .feat-card, details, .bcard, .mock, .b-card, .step-ai, .term, .rev-card, .step,
  .crew-card, .int-card, .takeaways, .info-tile, .pillar, .checklist, .callout,
  .price-card, .ind-card, .ind-board, .console, .chan-card, .ai-card, .pt-card,
  .pt-door, .lead-card, .form-card, .side-card, .board, .see-card,
  .ai-guard, .vs-player, .quote, .plan, .trial
) :is(h1, h2, h3, h4, h5) { color: #0b1a33; }
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(
  .feat-card, details, .bcard, .mock, .b-card, .step-ai, .term, .rev-card, .step,
  .crew-card, .int-card, .takeaways, .info-tile, .pillar, .checklist, .callout,
  .price-card, .ind-card, .ind-board, .console, .chan-card, .ai-card, .pt-card,
  .pt-door, .lead-card, .form-card, .side-card, .board, .see-card,
  .ai-guard, .vs-player, .quote, .plan, .trial
) :is(p, .lede) { color: #3b4f6e; }
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(
  .feat-card, details, .bcard, .b-card, .price-card, .ind-card, .ai-card, .lead-card,
  .pt-card, .see-card, .int-card, .side-card, .form-card, .callout, .takeaways, .plan, .trial
) a:not(.btn) { color: #1668b8 !important; text-decoration: none; }
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(
  .feat-card, .bcard, .b-card, .price-card, .ind-card, .ai-card, .lead-card, .pt-card,
  .see-card, .form-card, .vs-player, .plan, .trial, .takeaways, .callout, .board
) .eyebrow { color: #1668b8 !important; }
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(
  .bcard, .feat-card, .ai-card, .mock, .term, .console, .price-card, .ind-board
) span.ai { color: #1668b8 !important; }
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(
  .price-card, .form-card, .vs-player, .plan, .trial, .bcard, .ai-card, .lead-card, .see-card
) .btn-primary {
  background: #1e90ff !important;
  border-color: #1e90ff !important;
  color: #ffffff !important;
}
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(
  .price-card, .form-card, .vs-player, .plan, .trial, .bcard, .ai-card, .lead-card, .see-card
) .btn:not(.btn-primary) {
  background: #ffffff !important;
  border: 1px solid #d3e0f2 !important;
  color: #0b1a33 !important;
}
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) a:is(.badge, .pill, .chip):not(.on):not(.is-on) { color: #0b1a33 !important; }

/* CRM pricing: plan cards and the trial strip, white on the blue. */
html:not([data-theme="dark"]) body.home-ai :is(.plan, .trial) {
  background: #ffffff !important;
  border-color: #ffffff !important;
  box-shadow: 0 2px 4px rgba(5, 30, 80, 0.08), 0 24px 48px -24px rgba(5, 30, 80, 0.45) !important;
}
html:not([data-theme="dark"]) body.home-ai .plan.hot { outline: 3px solid #0b1a33; outline-offset: -3px; }
html:not([data-theme="dark"]) body.home-ai .plan :is(.plan-name, .plan-price, .plan-price *) { color: #0b1a33 !important; }
html:not([data-theme="dark"]) body.home-ai .plan .plan-tag { background: #0b1a33 !important; color: #ffffff !important; }
html:not([data-theme="dark"]) body.home-ai .plan svg { color: #1e90ff; }
html:not([data-theme="dark"]) body.home-ai .plan.hot .btn { background: #1e90ff !important; border-color: #1e90ff !important; color: #ffffff !important; }

/* ---------- Selected states ----------
   Dark marks a choice with a tinted fill and an accent ring. On the blue,
   light marks it with a navy key and a white ring; on white, the brand blue. */
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(
  .vs-opt.is-on, .badge.on, .agentline.on, .chip.on,
  .pswitch :is(a, button):is(.on, .is-on, .active, [aria-current]),
  .cycle :is(a, button).on
) {
  background: #0b1a33 !important;
  border-color: #0b1a33 !important;
  color: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.6), 0 10px 24px -12px rgba(5, 30, 80, 0.6) !important;
}
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(.vs-opt.is-on, .badge.on, .agentline.on) * { color: #ffffff !important; }
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) .vs-opt.is-on small { color: rgba(255, 255, 255, 0.82) !important; }
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(.pswitch, .cycle) :is(a, button):not(.on):not(.is-on):not(.active):not([aria-current]) { color: #3b4f6e !important; }
html:not([data-theme="dark"]) body.home-ai section:not(.band-dark):not(.page-hero) :is(.vs-opt.is-on, .badge.on, .chip.on) {
  background: #1e90ff;
  border-color: #1e90ff;
  color: #ffffff;
}

/* ---------- Hero lights: dark mode's aurora, in the logo blues ---------- */
html:not([data-theme="dark"]) body.home-ai .aurora { display: block; }
html:not([data-theme="dark"]) body.home-ai .aurora i:nth-child(1) { background: radial-gradient(closest-side, rgba(58, 160, 255, 0.95) 0%, transparent 80%); }
html:not([data-theme="dark"]) body.home-ai .aurora i:nth-child(2) { background: radial-gradient(closest-side, rgba(255, 255, 255, 0.32) 0%, transparent 80%); }
html:not([data-theme="dark"]) body.home-ai .aurora i:nth-child(3) { background: radial-gradient(closest-side, rgba(125, 211, 252, 0.55) 0%, transparent 80%); }
html:not([data-theme="dark"]) body.home-ai .aurora::after {
  background:
    radial-gradient(1200px 600px at 50% 0%, rgba(22, 115, 227, 0) 0%, rgba(22, 115, 227, 0.55) 70%, #1673e3 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Ccircle cx='1' cy='1' r='1' fill='rgba(255,255,255,0.12)'/%3E%3C/svg%3E");
}
html:not([data-theme="dark"]) body.home-ai .page-hero::before {
  background: radial-gradient(closest-side, rgba(58, 160, 255, 0.9), transparent 75%) !important;
}
html:not([data-theme="dark"]) body.home-ai .page-hero::after {
  display: block;
  background:
    radial-gradient(900px 500px at 85% 0%, rgba(125, 211, 252, 0.3), transparent 70%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Ccircle cx='1' cy='1' r='1' fill='rgba(255,255,255,0.1)'/%3E%3C/svg%3E");
}
html:not([data-theme="dark"]) body.home-ai .band-dark .logo-marquee::before { background: linear-gradient(90deg, #1673e3, rgba(22, 115, 227, 0)); }
html:not([data-theme="dark"]) body.home-ai .band-dark .logo-marquee::after { background: linear-gradient(270deg, #1673e3, rgba(22, 115, 227, 0)); }

/* ---------- Footer: night in dark, so blue in light ---------- */
html:not([data-theme="dark"]) body.home-ai .footer h5 { color: #ffffff; }
html:not([data-theme="dark"]) body.home-ai .footer a,
html:not([data-theme="dark"]) body.home-ai .footer .footer-addr,
html:not([data-theme="dark"]) body.home-ai .footer .footer-tag { color: rgba(255, 255, 255, 0.86); }
html:not([data-theme="dark"]) body.home-ai .footer a:hover { color: #ffffff; }
html:not([data-theme="dark"]) body.home-ai .footer-grid { border-bottom-color: rgba(255, 255, 255, 0.22); }
html:not([data-theme="dark"]) body.home-ai .footer-logo img { content: url("../images/graciax-logo-white.svg"); }
html:not([data-theme="dark"]) body.home-ai .footer .store-badge { background: #0b1a33 !important; border-color: #0b1a33 !important; color: #ffffff !important; }

/* Partner page hero: its own night glow, in the logo blues. */
html:not([data-theme="dark"]) body.home-ai .pt-hero::before {
  background:
    radial-gradient(900px 480px at 15% 0%, rgba(58, 160, 255, 0.85), transparent 60%),
    radial-gradient(800px 420px at 90% 100%, rgba(125, 211, 252, 0.4), transparent 60%) !important;
}
html:not([data-theme="dark"]) body.home-ai :is(.pt-hero, .pt-quote) :is(.eyebrow, .eyebrow svg, .a, .lede) { color: rgba(255, 255, 255, 0.88) !important; }
html:not([data-theme="dark"]) body.home-ai .pt-marquee span { color: rgba(255, 255, 255, 0.88); }

/* Footer credit line on the blue. */
html:not([data-theme="dark"]) body.home-ai .footer-bottom,
html:not([data-theme="dark"]) body.home-ai .footer-bottom .footer-parent { color: rgba(255, 255, 255, 0.82); }
html:not([data-theme="dark"]) body.home-ai .footer-bottom .footer-parent a { color: #ffffff; }

/* "Call our AI agent" / WhatsApp buttons: white keys with navy text wherever they sit. */
html:not([data-theme="dark"]) body.home-ai .ai-btn,
html:not([data-theme="dark"]) body.home-ai .ai-btn * { color: #0b1a33 !important; }
html:not([data-theme="dark"]) body.home-ai .ai-btn svg { color: #1e90ff !important; }
html:not([data-theme="dark"]) body.home-ai .ai-btn.wa svg { color: #128c7e !important; }

/* Small accent labels and bold words in running text on the blue. */
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero) > .container > :is(.tools, .lede, .sect-head, .center, .note, p) :is(span, b, strong) { color: #ffffff; }
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero) .sect-head :is(b, strong) { color: #ffffff; }

/* Last stragglers from the end-to-end contrast check. */
html:not([data-theme="dark"]) body.home-ai .soon b { color: #ffffff !important; }
html:not([data-theme="dark"]) body.home-ai .err-chat .tools span { color: #ffffff !important; background: rgba(255, 255, 255, 0.14) !important; border-color: rgba(255, 255, 255, 0.3) !important; }
html:not([data-theme="dark"]) body.home-ai td[colspan] { color: #1668b8 !important; }

/* ---------- Patterns found by the dark-on-blue sweep (2026-10-19) ----------
   Anything sitting straight on the blue reads light; the same thing inside
   a white card reads as before. */
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(b, strong, blockquote, .quote-name, .alt a) { color: #ffffff; }
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(.feat-card, details, .bcard, .mock, .b-card, .step-ai, .term, .rev-card, .step, .crew-card, .int-card, .takeaways, .info-tile, .pillar, .checklist, .callout, .price-card, .ind-card, .ind-board, .console, .chan-card, .ai-card, .pt-card, .pt-door, .lead-card, .form-card, .side-card, .board, .see-card, .ai-guard, .vs-player, .plan, .trial, .vs-opt, .agentline, .callbig, .ask, .chip, .pill, .badge, .b-tag, .cta-chip, .bubble, .tools, table, .promo-frame, .ind-tabs, .pswitch, .cycle, .ai-btn) :is(b, strong) { color: #0b1a33; }

/* Ticks and list icons on the blue: mint; inside cards: the brand colours. */
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(li, .ticks, .legal-meta, .hero-note, .checks) svg { color: #c7f9e9 !important; }
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(.feat-card, details, .bcard, .mock, .b-card, .step-ai, .term, .rev-card, .step, .crew-card, .int-card, .takeaways, .info-tile, .pillar, .checklist, .callout, .price-card, .ind-card, .ind-board, .console, .chan-card, .ai-card, .pt-card, .pt-door, .lead-card, .form-card, .side-card, .board, .see-card, .ai-guard, .vs-player, .plan, .trial, .vs-opt, .agentline, .callbig, .ask, .chip, .pill, .badge, .b-tag, .cta-chip, .bubble, .tools, table, .promo-frame, .ind-tabs, .pswitch, .cycle, .ai-btn) :is(li, .ticks, .checks) svg { color: #0d8a74 !important; }

/* Underlined headline words: light, with a white underline. */
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) .u-mark,
html:not([data-theme="dark"]) body.home-ai .display-hero .u-mark { color: #d6ecff !important; }
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) .u-mark > svg { color: #ffffff !important; }

/* Tags and chips that sat on the night with no backing: white pills. */
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) :is(.types > span, .b-tag, .cta-chip, .err-chat .bubble, .bic) {
  background: #ffffff !important;
  border-color: #ffffff !important;
  color: #0b1a33 !important;
}
html:not([data-theme="dark"]) body.home-ai :is(.band-dark, .page-hero, .pt-hero, .pt-quote) .cta-chip svg { color: #1e90ff !important; }

/* Feature list on the blue: white icon keys, a soft hover tile. */
html:not([data-theme="dark"]) body.home-ai .ai-item .bic { background: #ffffff !important; color: #1668b8 !important; box-shadow: 0 6px 14px -8px rgba(5, 30, 80, 0.5); }
html:not([data-theme="dark"]) body.home-ai .ai-item:hover { background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.24); }
html:not([data-theme="dark"]) body.home-ai .ai-item h5 { color: #ffffff; }
html:not([data-theme="dark"]) body.home-ai .ai-item p { color: rgba(255, 255, 255, 0.86); }
/* The AI's answer bubble in mock-ups: pale blue, not lilac. */
html:not([data-theme="dark"]) body.home-ai .bubble.ai { background: #eaf3ff !important; border-color: #c3d4ec !important; color: #283d5e !important; }
html:not([data-theme="dark"]) body.home-ai .bubble.ai b { color: #0b1a33 !important; }
html:not([data-theme="dark"]) body.home-ai .guard > div { background: #ffffff !important; border-color: #ffffff !important; color: #0b1a33 !important; }

/* Sign-in chooser on light: a blue veil, the three workspace cards float on it. */
html:not([data-theme="dark"]) body.home-ai .so-backdrop { background: rgba(22, 115, 227, 0.86) !important; }
html:not([data-theme="dark"]) body.home-ai .so-eyebrow { color: rgba(255, 255, 255, 0.86) !important; }
html:not([data-theme="dark"]) body.home-ai .so-title { color: #ffffff !important; }
html:not([data-theme="dark"]) body.home-ai .so-hint { color: rgba(255, 255, 255, 0.82) !important; }
html:not([data-theme="dark"]) body.home-ai .so-close { color: #ffffff !important; border-color: rgba(255, 255, 255, 0.4) !important; background: rgba(255, 255, 255, 0.1) !important; }
html:not([data-theme="dark"]) body.home-ai .so-card {
  background: #ffffff !important;
  border-color: #ffffff !important;
  box-shadow: 0 2px 4px rgba(5, 30, 80, 0.1), 0 24px 48px -24px rgba(5, 30, 80, 0.5) !important;
}
html:not([data-theme="dark"]) body.home-ai .so-name { color: #0b1a33 !important; }
html:not([data-theme="dark"]) body.home-ai .so-dom { color: #4d6185 !important; }
@media (max-width: 760px) {
  html:not([data-theme="dark"]) body.home-ai .so-panel { background: #1673e3 !important; border-radius: 22px 22px 0 0; border-top: 1px solid rgba(255, 255, 255, 0.24) !important; }
}

/* ===== pricing-cards.css ===== */
/* ============================================================
   GRACIAX — pricing cards, redesigned for both modes (2026-10-19).
   Applies to the CRM plan grid (.plan) and the HRMS/Books cards
   (.price-card). One hierarchy everywhere: plan name, who it is for,
   the price as the hero number, the billing line, then features.
   The recommended plan is raised and carries the brand colour; the
   rest are quiet. Loaded last so it wins over page and theme styles.
   ============================================================ */

/* ---------- Shared shape ---------- */
body.home-ai :is(.plan, .price-card) {
  border-radius: 22px !important;
  padding: 30px 26px 24px !important;
  transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.25s ease, border-color 0.25s ease;
}
body.home-ai :is(.plan, .price-card):hover { transform: translateY(-4px); }
body.home-ai .plan-grid { gap: 18px !important; align-items: stretch; }
body.home-ai .plan-name { font-size: 1.15rem !important; font-weight: 800 !important; letter-spacing: -0.01em; }
body.home-ai .plan-price { margin-top: 20px !important; }
body.home-ai .plan-price b { font-size: 2.6rem !important; font-weight: 900 !important; letter-spacing: -0.04em !important; }
body.home-ai .plan-price small { font-weight: 600 !important; }
body.home-ai .plan-plus { font-size: 0.68rem !important; letter-spacing: 0.12em !important; }
body.home-ai .plan-list { gap: 11px !important; }
body.home-ai .plan-list li { font-size: 0.9rem !important; }
body.home-ai .plan-list svg { width: 16px !important; height: 16px !important; }
body.home-ai .plan .btn,
body.home-ai .price-card .btn {
  height: 48px;
  border-radius: 12px !important;
  font-weight: 800 !important;
  justify-content: center;
}
body.home-ai :is(.plan.hot, .price-card.featured, .price-card.popular, .price-card.hot) { transform: translateY(-8px); }
body.home-ai :is(.plan.hot, .price-card.featured, .price-card.popular, .price-card.hot):hover { transform: translateY(-12px); }
body.home-ai .plan-tag {
  top: -13px !important;
  left: 50% !important;
  transform: translateX(-50%);
  border-radius: 999px !important;
  padding: 6px 14px !important;
  white-space: nowrap;
}

/* ---------- Light (on the blue band) ---------- */
html:not([data-theme="dark"]) body.home-ai .plan,
html:not([data-theme="dark"]) body.home-ai .price-card {
  background: #ffffff !important;
  border: 1px solid #ffffff !important;
  outline: none !important;
  box-shadow: 0 2px 4px rgba(5, 30, 80, 0.08), 0 24px 48px -24px rgba(5, 30, 80, 0.45) !important;
}
html:not([data-theme="dark"]) body.home-ai :is(.plan, .price-card) :is(.plan-name, h3, h4) { color: #0b1a33 !important; }
html:not([data-theme="dark"]) body.home-ai .plan .plan-who,
html:not([data-theme="dark"]) body.home-ai .plan :is(.plan-sub, .plan-pp, .plan-note) { color: #4d6185 !important; }
html:not([data-theme="dark"]) body.home-ai .plan-price b { color: #0b1a33 !important; }
html:not([data-theme="dark"]) body.home-ai .plan-price small { color: #4d6185 !important; }
html:not([data-theme="dark"]) body.home-ai .plan .plan-plus { color: #1668b8 !important; border-top-color: #e3ecf8 !important; }
html:not([data-theme="dark"]) body.home-ai .plan-list li { color: #283d5e !important; }
html:not([data-theme="dark"]) body.home-ai :is(.plan, .price-card) li svg { color: #1e90ff !important; }
html:not([data-theme="dark"]) body.home-ai :is(.plan, .price-card) .btn {
  background: #eaf3ff !important;
  border: 1px solid #eaf3ff !important;
  color: #0d6edb !important;
  box-shadow: none !important;
}
html:not([data-theme="dark"]) body.home-ai :is(.plan, .price-card) .btn:hover { background: #dcebff !important; }
/* Recommended: a navy card, the one dark object on the page. */
html:not([data-theme="dark"]) body.home-ai :is(.plan.hot, .price-card.featured, .price-card.popular, .price-card.hot) {
  background: #0b1a33 !important;
  border-color: #0b1a33 !important;
  box-shadow: 0 4px 8px rgba(5, 30, 80, 0.12), 0 36px 64px -28px rgba(5, 30, 80, 0.7) !important;
}
html:not([data-theme="dark"]) body.home-ai :is(.plan.hot, .price-card.featured, .price-card.popular, .price-card.hot) :is(.plan-name, .price-name, .price-amount, h3, h4, .plan-price b, li, p, small, span:not(.plan-tag):not(.ai-tag):not(.price-pop)) { color: #ffffff !important; }
html:not([data-theme="dark"]) body.home-ai :is(.plan.hot, .price-card.featured, .price-card.popular, .price-card.hot) :is(.plan-who, .plan-sub, .plan-pp, .plan-note, .plan-price small, .price-for, .price-note) { color: rgba(255, 255, 255, 0.75) !important; }
html:not([data-theme="dark"]) body.home-ai .plan.hot .plan-plus { color: #8cc8ff !important; border-top-color: rgba(255, 255, 255, 0.14) !important; }
html:not([data-theme="dark"]) body.home-ai :is(.plan.hot, .price-card.featured, .price-card.popular, .price-card.hot) li svg { color: #5cb3ff !important; }
html:not([data-theme="dark"]) body.home-ai :is(.plan.hot, .price-card.featured, .price-card.popular, .price-card.hot) .btn {
  background: #1e90ff !important;
  border-color: #1e90ff !important;
  color: #ffffff !important;
  box-shadow: 0 10px 24px -10px rgba(30, 144, 255, 0.8) !important;
}
html:not([data-theme="dark"]) body.home-ai .plan-tag,
html:not([data-theme="dark"]) body.home-ai :is(.price-card) .badge-pop {
  background: #1e90ff !important;
  color: #ffffff !important;
  box-shadow: 0 0 0 4px #1673e3;
}

/* ---------- Dark: same structure on the night ---------- */
html[data-theme="dark"] body.home-ai .plan,
html[data-theme="dark"] body.home-ai .price-card {
  background: linear-gradient(180deg, #121a30, #0c1020) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.8) !important;
}
html[data-theme="dark"] body.home-ai .plan-price b { color: #ffffff !important; }
html[data-theme="dark"] body.home-ai :is(.plan, .price-card) li svg { color: #5cb3ff !important; }
html[data-theme="dark"] body.home-ai :is(.plan, .price-card) .btn {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  color: #ffffff !important;
}
html[data-theme="dark"] body.home-ai :is(.plan.hot, .price-card.featured, .price-card.popular, .price-card.hot) {
  background: linear-gradient(180deg, #1677e6, #0d4fae) !important;
  border-color: #3aa0ff !important;
  box-shadow: 0 36px 70px -30px rgba(30, 144, 255, 0.55) !important;
}
html[data-theme="dark"] body.home-ai :is(.plan.hot, .price-card.featured, .price-card.popular, .price-card.hot) :is(.plan-who, .plan-sub, .plan-pp, .plan-note, .plan-price small, .plan-plus) { color: rgba(255, 255, 255, 0.78) !important; }
html[data-theme="dark"] body.home-ai :is(.plan.hot, .price-card.featured, .price-card.popular, .price-card.hot) li svg { color: #ffffff !important; }
html[data-theme="dark"] body.home-ai :is(.plan.hot, .price-card.featured, .price-card.popular, .price-card.hot) .btn {
  background: #ffffff !important;
  border-color: #ffffff !important;
  color: #0d4fae !important;
}
html[data-theme="dark"] body.home-ai .plan-tag { background: #ffffff !important; color: #0d4fae !important; box-shadow: 0 0 0 4px #07090f; }

@media (max-width: 1020px) {
  body.home-ai :is(.plan.hot, .price-card.featured, .price-card.popular, .price-card.hot),
  body.home-ai :is(.plan.hot, .price-card.featured, .price-card.popular, .price-card.hot):hover { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  body.home-ai :is(.plan, .price-card) { transition: none; }
  body.home-ai :is(.plan, .price-card):hover { transform: none; }
}

/* ---------- "Bring your own AI" and similar split sections on the blue ---------- */
html:not([data-theme="dark"]) body.home-ai .mcp-list li { color: rgba(255, 255, 255, 0.9) !important; }
html:not([data-theme="dark"]) body.home-ai .mcp-list li b { color: #ffffff !important; }
html:not([data-theme="dark"]) body.home-ai .mcp-list li svg { color: #c7f9e9 !important; }

/* HRMS / Books cards share the hierarchy; their badge and borders are inline
   per product (violet for HRMS) — on pricing they take the brand blue. */
body.home-ai .price-card .price-amount { font-size: 2rem !important; font-weight: 900 !important; letter-spacing: -0.035em; }
html:not([data-theme="dark"]) body.home-ai .price-card :is(.price-name, .price-amount) { color: #0b1a33 !important; }
html:not([data-theme="dark"]) body.home-ai .price-card :is(.price-for, .price-note) { color: #4d6185 !important; }
body.home-ai .price-card.featured { border-color: transparent !important; }
body.home-ai .price-card .price-pop {
  background: #1e90ff !important; color: #ffffff !important;
  left: 50% !important; transform: translateX(-50%); border-radius: 999px !important; white-space: nowrap;
}
html[data-theme="dark"] body.home-ai .price-card .price-pop { background: #ffffff !important; color: #0d4fae !important; }
html[data-theme="dark"] body.home-ai .price-card.featured :is(.price-name, .price-amount) { color: #ffffff !important; }
html[data-theme="dark"] body.home-ai .price-card.featured :is(.price-for, .price-note) { color: rgba(255, 255, 255, 0.78) !important; }
html:not([data-theme="dark"]) body.home-ai .pg-pricing section:not(.band-dark):not(.page-hero) a[href*="contact"]:not(.btn) { color: #1668b8 !important; }

/* Dark mode, cards in a WHITE band (HRMS/Books pricing): keep dark mode's own
   white cards with navy type; only the featured card goes blue. */
html[data-theme="dark"] body.home-ai section:not(.band-dark):not(.page-hero) .price-card:not(.featured) {
  background: #ffffff !important;
  border: 1px solid #e7eaf0 !important;
  box-shadow: 0 2px 4px rgba(13, 18, 32, 0.04), 0 24px 48px -24px rgba(13, 18, 32, 0.25) !important;
}
html[data-theme="dark"] body.home-ai section:not(.band-dark):not(.page-hero) .price-card:not(.featured) :is(.price-name, .price-amount) { color: #0d1220 !important; }
html[data-theme="dark"] body.home-ai section:not(.band-dark):not(.page-hero) .price-card:not(.featured) :is(.price-for, .price-note) { color: #667085 !important; }
html[data-theme="dark"] body.home-ai section:not(.band-dark):not(.page-hero) .price-card:not(.featured) li { color: #344054 !important; }
html[data-theme="dark"] body.home-ai section:not(.band-dark):not(.page-hero) .price-card:not(.featured) li svg { color: #1e90ff !important; }
html[data-theme="dark"] body.home-ai section:not(.band-dark):not(.page-hero) .price-card:not(.featured) .btn { background: #eaf3ff !important; border-color: #eaf3ff !important; color: #0d6edb !important; }
html[data-theme="dark"] body.home-ai .price-card.featured li,
html[data-theme="dark"] body.home-ai .price-card.featured li * { color: #ffffff !important; }
html[data-theme="dark"] body.home-ai .pg-pricing section:not(.band-dark):not(.page-hero) a[href*="contact"]:not(.btn) { color: #1668b8 !important; }
body.home-ai .price-card.featured .ai-tag,
body.home-ai .plan.hot .ai-tag { background: #ffffff !important; color: #0d6edb !important; border-color: #ffffff !important; }
body.home-ai .price-card.featured .ai-tag *,
body.home-ai .plan.hot .ai-tag * { color: #0d6edb !important; }
html[data-theme="dark"] body.home-ai .price-card.featured li .ai-tag,
html[data-theme="dark"] body.home-ai .price-card.featured li .ai-tag * { color: #0d6edb !important; }