/* ===== thinkingdbx central light mode (dbt-inspired) =====
   Dark is the default theme; these rules apply only when
   html[data-theme="light"] is set (toggle in nav, persisted). */

/* ===== shared structural components (both themes) ===== */
.foot-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px;padding-bottom:34px;font-size:13.5px}
.foot-grid .fh{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:0.1em;color:var(--text-3);margin-bottom:12px}
.foot-grid a{display:block;color:var(--text-2);padding:4px 0}
.foot-grid a:hover{color:var(--text)}
.foot-about{color:var(--text-3);font-size:13px;max-width:34ch;margin-top:12px}
footer .foot{border-top:1px solid var(--border);padding-top:26px}
@media(max-width:760px){.foot-grid{grid-template-columns:1fr 1fr}}

.dp{display:flex;justify-content:space-between;align-items:center;gap:28px;border:1px solid var(--green-dim);background:var(--green-soft);border-radius:14px;padding:30px 32px;flex-wrap:wrap}
.dp .dp-k{font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:0.1em;color:var(--green);margin-bottom:4px}
.dp h3{font-family:'Space Grotesk',var(--sans);font-size:1.25rem;font-weight:600;margin:6px 0 8px;letter-spacing:-0.01em}
.dp p{font-size:14px;color:var(--text-2);max-width:64ch}
.dp .btn{padding:11px 20px;font-size:15px;flex:none}

/* ===== design partner modal (both themes) ===== */
.dp-overlay{position:fixed;inset:0;z-index:200;background:rgba(3,7,17,0.55);backdrop-filter:blur(3px);display:none;align-items:center;justify-content:center;padding:24px}
.dp-overlay.open{display:flex}
.dp-modal{width:100%;max-width:460px;max-height:88vh;overflow-y:auto;background:var(--surface);border:1px solid var(--border-2);border-radius:14px;padding:30px 30px 26px;box-shadow:0 30px 80px rgba(0,0,0,0.35)}
.dp-modal .dp-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:6px}
.dp-modal h3{font-family:'Space Grotesk',var(--sans);font-size:1.2rem;font-weight:600;letter-spacing:-0.01em}
.dp-modal .dp-close{background:none;border:none;color:var(--text-3);font-size:20px;line-height:1;cursor:pointer;padding:2px 4px}
.dp-modal .dp-close:hover{color:var(--text)}
.dp-modal p.dp-sub{font-size:13.5px;color:var(--text-2);margin-bottom:20px}
.dp-field{margin-bottom:14px}
.dp-field label{display:block;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:0.07em;color:var(--text-3);margin-bottom:6px}
.dp-field input,.dp-field textarea{width:100%;background:var(--bg-3);border:1px solid var(--border-2);color:var(--text);font-family:var(--sans);font-size:14px;padding:10px 12px;border-radius:8px;resize:vertical}
.dp-field input:focus,.dp-field textarea:focus{outline:none;border-color:var(--green-dim)}
.dp-field.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.dp-actions{display:flex;align-items:center;gap:14px;margin-top:20px}
.dp-actions .btn{flex:none}
.dp-msg{font-size:13px;color:var(--text-2)}
.dp-msg.err{color:#ed6a5e}
.dp-msg.ok{color:var(--green)}
html[data-theme="light"] .dp-field input,
html[data-theme="light"] .dp-field textarea{background:#fff}

/* ===== ribbons: both themes, different blends ===== */
.ribbons{display:block;position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.ribbons path{fill:none}
/* dark blend: low-opacity glows */
.ribbons .r1{stroke:#3ecf8e;stroke-opacity:0.10}
.ribbons .r2{stroke:#9c79ff;stroke-opacity:0.10}
.ribbons .r3{stroke:#d8ff33;stroke-opacity:0.05}
.ribbons .r4{stroke:#3ecf8e;stroke-opacity:0.30}
.ribbons .r5{stroke:#9c79ff;stroke-opacity:0.28}
.ribbons .r6{stroke:#3ecf8e;stroke-opacity:0.18}

/* ===== dark: accent color fields on cards ===== */
:is(.pillar,.feat,.case,.p,.cloud-card,.prods .prod,.posts .post){border-top:3px solid transparent}
:is(.pillar,.feat,.case,.p,.cloud-card,.prods .prod,.posts .post):nth-child(6n+1){border-top-color:rgba(62,207,142,0.55);background:linear-gradient(180deg,rgba(62,207,142,0.07),var(--surface) 60%)}
:is(.pillar,.feat,.case,.p,.cloud-card,.prods .prod,.posts .post):nth-child(6n+2){border-top-color:rgba(254,131,49,0.55);background:linear-gradient(180deg,rgba(254,131,49,0.06),var(--surface) 60%)}
:is(.pillar,.feat,.case,.p,.cloud-card,.prods .prod,.posts .post):nth-child(6n+3){border-top-color:rgba(156,121,255,0.55);background:linear-gradient(180deg,rgba(156,121,255,0.07),var(--surface) 60%)}
:is(.pillar,.feat,.case,.p,.cloud-card,.prods .prod,.posts .post):nth-child(6n+4){border-top-color:rgba(216,255,51,0.45);background:linear-gradient(180deg,rgba(216,255,51,0.05),var(--surface) 60%)}
:is(.pillar,.feat,.case,.p,.cloud-card,.prods .prod,.posts .post):nth-child(6n+5){border-top-color:rgba(255,204,37,0.50);background:linear-gradient(180deg,rgba(255,204,37,0.05),var(--surface) 60%)}
:is(.pillar,.feat,.case,.p,.cloud-card,.prods .prod,.posts .post):nth-child(6n){border-top-color:rgba(107,154,255,0.55);background:linear-gradient(180deg,rgba(107,154,255,0.06),var(--surface) 60%)}

/* ===== dark: multicolor stats ===== */
.proof .c:nth-child(2) .n:not(:has(span)){color:#fe8331}
.proof .c:nth-child(3) .n:not(:has(span)){color:#9c79ff}
.proof .c:nth-child(4) .n:not(:has(span)){color:#6b9aff}
.proof .c:nth-child(2) .n span{color:#fe8331}
.proof .c:nth-child(3) .n span{color:#9c79ff}
.proof .c:nth-child(4) .n span{color:#6b9aff}
.hero-stats .s:nth-child(2) .v{color:#fe8331}
.hero-stats .s:nth-child(3) .v{color:#9c79ff}
.hero-stats .s:nth-child(4) .v{color:#6b9aff}

html[data-theme="light"]{
    --bg:#fff; --bg-2:#f9fafb; --bg-3:#f3f4f6;
    --surface:#fff; --surface-2:#f9fafb;
    --border:#e5e7eb; --border-2:#d1d5dc;
    --text:#101828; --text-2:#4a5565; --text-3:#6a7282;
    --green:#15805a; --green-2:#15805a; --green-dim:#bfe9d5;
    --green-soft:#effaf5;
}
/* light blend: saturated bands */
html[data-theme="light"] .ribbons .r1{stroke:#3ecf8e;stroke-opacity:0.30}
html[data-theme="light"] .ribbons .r2{stroke:#d8ff33;stroke-opacity:0.45}
html[data-theme="light"] .ribbons .r3{stroke:#ffcc25;stroke-opacity:0.30}
html[data-theme="light"] .ribbons .r4{stroke:#eab308;stroke-opacity:0.38}
html[data-theme="light"] .ribbons .r5{stroke:#15805a;stroke-opacity:0.40}
html[data-theme="light"] .ribbons .r6{stroke:#15805a;stroke-opacity:0.30}

/* nav + buttons */
html[data-theme="light"] .nav{background:rgba(255,255,255,0.82)}
html[data-theme="light"] .btn.green{background:#3ecf8e;color:#06281a}
html[data-theme="light"] .btn.green:hover{background:#35c584}
html[data-theme="light"] .btn.ghost:hover{background:var(--surface-2);border-color:#b9c0cc}

/* hero */
html[data-theme="light"] .hero{background:linear-gradient(180deg,#eef9f4 0%,#f8fcfa 46%,#fff 100%)}
html[data-theme="light"] .hero-bg{background:
      radial-gradient(48% 42% at 22% -6%,rgba(62,207,142,0.36),transparent 70%),
      radial-gradient(44% 40% at 82% -8%,rgba(255,204,37,0.28),transparent 70%),
      linear-gradient(90deg,rgba(3,7,17,0.035) 1px,transparent 1px),
      radial-gradient(circle at 1px 1px,rgba(3,7,17,0.05) 1px,transparent 0);
    background-size:auto,auto,236px 100%,26px 26px}
html[data-theme="light"] .hero-logo{filter:none}
html[data-theme="light"] .kicker .live{box-shadow:none;background:#15805a}

/* window mocks + demo frames */
html[data-theme="light"] .win{box-shadow:0 24px 64px rgba(3,7,17,0.10),0 2px 8px rgba(3,7,17,0.05)}
html[data-theme="light"] .canvas{background:radial-gradient(circle at 1px 1px,rgba(3,7,17,0.05) 1px,transparent 0);background-size:20px 20px}
html[data-theme="light"] .node{background:#fff;box-shadow:0 1px 2px rgba(3,7,17,0.04)}
html[data-theme="light"] .node.on{background:#effaf5;border-color:#3ecf8e}
html[data-theme="light"] .wire{background:linear-gradient(90deg,#d1d5dc,#3ecf8e)}
html[data-theme="light"] .wire::after{background:#15805a;box-shadow:none}
html[data-theme="light"] .side .item.on{background:#d9f4e7;color:var(--text)}
html[data-theme="light"] .demo-play{background:rgba(255,255,255,0.85);color:#15805a}
html[data-theme="light"] .demo-play:hover{background:#effaf5}

/* strip */
html[data-theme="light"] .strip{background:#f2faf6}

/* code blocks: light syntax palettes */
html[data-theme="light"] .code{box-shadow:0 12px 32px rgba(3,7,17,0.07)}
html[data-theme="light"] .code .s{color:#b26a00}
html[data-theme="light"] .code .t{color:#2563eb}
html[data-theme="light"] .codeblock .k{color:#7c3aed}
html[data-theme="light"] .codeblock .fn{color:#2563eb}
html[data-theme="light"] .codeblock .s{color:#b26a00}
html[data-theme="light"] .codeblock .n{color:#c2410c}
html[data-theme="light"] .codeblock .t{color:#0369a1}
html[data-theme="light"] .term-win{box-shadow:0 12px 32px rgba(3,7,17,0.07)}
html[data-theme="light"] .install{background:#fff}

/* cards + grids (pillars, feats, cases, cloud, principles, posts) */
html[data-theme="light"] .pillar:hover,
html[data-theme="light"] .feat:hover,
html[data-theme="light"] .case:hover,
html[data-theme="light"] .p:hover,
html[data-theme="light"] .prod:hover{box-shadow:0 8px 24px rgba(3,7,17,0.06)}

/* pricing */
html[data-theme="light"] .plan .pop-tag{background:#3ecf8e;color:#06281a}

/* proof / stats */
html[data-theme="light"] .proof .c:nth-child(2) .n span{color:#fe6703}
html[data-theme="light"] .proof .c:nth-child(3) .n span{color:#632ff5}
html[data-theme="light"] .proof .c:nth-child(4) .n span{color:#0467b7}

/* index: per-product color fields (dbt accent palette) */
html[data-theme="light"] .prods .prod{border-top:3px solid transparent}
html[data-theme="light"] .prods .prod:nth-child(1){border-top-color:#fe6703;background:linear-gradient(180deg,#fff3ea,#fff 65%)}
html[data-theme="light"] .prods .prod:nth-child(1):hover{border-color:#ffc59b;border-top-color:#fe6703}
html[data-theme="light"] .prods .prod:nth-child(2){border-top-color:#632ff5;background:linear-gradient(180deg,#f3f1ff,#fff 65%)}
html[data-theme="light"] .prods .prod:nth-child(2):hover{border-color:#c9b8ff;border-top-color:#632ff5}
html[data-theme="light"] .prods .prod:nth-child(3){border-top-color:#c3e600;background:linear-gradient(180deg,#f9ffdd,#fff 65%)}
html[data-theme="light"] .prods .prod:nth-child(3):hover{border-color:#dbef86;border-top-color:#c3e600}
html[data-theme="light"] .prods .prod:nth-child(4){border-top-color:#ffcc25;background:linear-gradient(180deg,#fff8e2,#fff 65%)}
html[data-theme="light"] .prods .prod:nth-child(4):hover{border-color:#ffe391;border-top-color:#ffcc25}
html[data-theme="light"] .prods .prod:nth-child(2) .tag.os{color:#632ff5;border-color:#c9b8ff;background:#f3f1ff}
html[data-theme="light"] .prods .prod:nth-child(3) .tag.os{color:#5a6f00;border-color:#dbef86;background:#f9ffdd}
html[data-theme="light"] .prods .prod:nth-child(4) .tag.soon{color:#987600;border-color:#ffe391;background:#fff8e2}
html[data-theme="light"] #products{position:relative}
html[data-theme="light"] #products::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;
    background:
      radial-gradient(52% 60% at 85% 0%,rgba(62,207,142,0.12),transparent 70%),
      repeating-linear-gradient(115deg,rgba(62,207,142,0.06) 0 2px,transparent 2px 110px)}

/* CTA boxes */
html[data-theme="light"] .cta-box{border-color:#bfe9d5}
html[data-theme="light"] .cta-l{background:
      radial-gradient(70% 90% at 0% 100%,rgba(62,207,142,0.26),transparent 70%),
      radial-gradient(55% 70% at 100% 0%,rgba(216,255,51,0.30),transparent 70%),
      radial-gradient(circle at 1px 1px,rgba(3,7,17,0.04) 1px,transparent 0);
    background-size:auto,auto,22px 22px}
html[data-theme="light"] .cta-r{background:var(--bg-2)}
html[data-theme="light"] .tl-step .dot{background:#3ecf8e;border:2px solid #fff;box-shadow:0 0 0 1px #bfe9d5}
html[data-theme="light"] footer{background:var(--bg-2)}

/* architecture (simple view) */
html[data-theme="light"] .arch{background-image:radial-gradient(circle at 1px 1px,rgba(3,7,17,0.04) 1px,transparent 0)}
html[data-theme="light"] .arch-node{box-shadow:0 1px 2px rgba(3,7,17,0.04)}
html[data-theme="light"] .arch-col.in .arch-node::before,
html[data-theme="light"] .arch-col.out .arch-node::before{background:#15805a;box-shadow:none}
html[data-theme="light"] .arch-core{border-color:#3ecf8e;box-shadow:0 0 0 3px rgba(62,207,142,0.10),0 12px 32px rgba(3,7,17,0.08)}
html[data-theme="light"] .arch-uml{background-image:radial-gradient(circle at 1px 1px,rgba(3,7,17,0.04) 1px,transparent 0)}

/* UML SVG diagrams (engineering views) */
html[data-theme="light"] .uml .t{fill:#101828}
html[data-theme="light"] .uml .t2{fill:#4a5565}
html[data-theme="light"] .uml .st{fill:#6a7282}
html[data-theme="light"] .uml .gt{fill:#15805a}
html[data-theme="light"] .uml .bx{fill:#fff;stroke:#d1d5dc}
html[data-theme="light"] .uml .ibx{fill:#f9fafb;stroke:#d1d5dc}
html[data-theme="light"] .uml .core{fill:#fff;stroke:#3ecf8e}
html[data-theme="light"] .uml .act{fill:#f3f4f6;stroke:#d1d5dc}
html[data-theme="light"] .uml .msg{stroke:#4a5565}
html[data-theme="light"] .uml .ret,
html[data-theme="light"] .uml .dep{stroke:#6a7282}
html[data-theme="light"] .uml .life,
html[data-theme="light"] .uml .frame,
html[data-theme="light"] .uml .thin{stroke:#d1d5dc}
html[data-theme="light"] .uml .port{fill:#fff;stroke:#6a7282}
html[data-theme="light"] .uml .actor{stroke:#4a5565}
html[data-theme="light"] .uml .doc{stroke:#6a7282}
html[data-theme="light"] .uml marker path[fill="none"]{stroke:#4a5565}
html[data-theme="light"] .uml marker path[fill="#a0a0a0"]{fill:#4a5565}
html[data-theme="light"] .uml path[fill="#1c1c1c"]{fill:#f3f4f6;stroke:#d1d5dc}
html[data-theme="light"] .uml rect[fill="#171717"]{fill:#f9fafb}
html[data-theme="light"] .uml rect[fill="#1c1c1c"]{fill:#fff}

/* ===== color fields on all pages (dbt accent cycle) ===== */
html[data-theme="light"] :is(.pillar,.feat,.case,.p,.cloud-card,.oss){border-top:3px solid transparent}
html[data-theme="light"] :is(.pillar,.feat,.case,.p,.cloud-card,.oss):nth-child(6n+1){border-top-color:#3ecf8e;background:linear-gradient(180deg,#effaf5,#fff 65%)}
html[data-theme="light"] :is(.pillar,.feat,.case,.p,.cloud-card,.oss):nth-child(6n+2){border-top-color:#fe6703;background:linear-gradient(180deg,#fff3ea,#fff 65%)}
html[data-theme="light"] :is(.pillar,.feat,.case,.p,.cloud-card,.oss):nth-child(6n+3){border-top-color:#632ff5;background:linear-gradient(180deg,#f3f1ff,#fff 65%)}
html[data-theme="light"] :is(.pillar,.feat,.case,.p,.cloud-card,.oss):nth-child(6n+4){border-top-color:#c3e600;background:linear-gradient(180deg,#f9ffdd,#fff 65%)}
html[data-theme="light"] :is(.pillar,.feat,.case,.p,.cloud-card,.oss):nth-child(6n+5){border-top-color:#ffcc25;background:linear-gradient(180deg,#fff8e2,#fff 65%)}
html[data-theme="light"] :is(.pillar,.feat,.case,.p,.cloud-card,.oss):nth-child(6n){border-top-color:#0467b7;background:linear-gradient(180deg,#eef6fd,#fff 65%)}

/* multicolor stats on product pages (index keeps its span-based accents) */
html[data-theme="light"] .proof .c:nth-child(2) .n:not(:has(span)){color:#fe6703}
html[data-theme="light"] .proof .c:nth-child(3) .n:not(:has(span)){color:#632ff5}
html[data-theme="light"] .proof .c:nth-child(4) .n:not(:has(span)){color:#0467b7}
html[data-theme="light"] .hero-stats .s:nth-child(2) .v{color:#fe6703}
html[data-theme="light"] .hero-stats .s:nth-child(3) .v{color:#632ff5}
html[data-theme="light"] .hero-stats .s:nth-child(4) .v{color:#0467b7}

/* blog cards join the accent cycle */
html[data-theme="light"] .posts .post{border-top:3px solid transparent}
html[data-theme="light"] .posts .post:nth-child(6n+1){border-top-color:#3ecf8e}
html[data-theme="light"] .posts .post:nth-child(6n+2){border-top-color:#fe6703}
html[data-theme="light"] .posts .post:nth-child(6n+3){border-top-color:#632ff5}
html[data-theme="light"] .posts .post:nth-child(6n+4){border-top-color:#c3e600}
html[data-theme="light"] .posts .post:nth-child(6n+5){border-top-color:#ffcc25}
html[data-theme="light"] .posts .post:nth-child(6n){border-top-color:#0467b7}
