/* (":not(#_)" only makes these rules win over each page's own styles.) */
/* Night mode. The switch is in the footer of every page; the choice is
   remembered in the visitor's browser. Near-black page with an orange
   glow, charcoal rounded panels, white type and one bright orange accent,
   the same on every section. Photos go black and white (color on hover). */

/* ---- The switch (day and night) ---- */
.footer-fine { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.night-toggle { display: inline-flex; align-items: center; gap: 10px; padding: 6px 6px 6px 0; border: 0; background: none; cursor: pointer; color: var(--ink); font: 500 13px/1 var(--text); letter-spacing: 0.04em; }
.night-track { position: relative; width: 50px; height: 28px; border-radius: 999px; background: var(--sand-3); border: 1px solid var(--line); box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.08); transition: background-color 0.4s; }
.night-knob { position: absolute; top: 2px; left: 2px; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: #fff; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2); transition: transform 0.45s cubic-bezier(0.5, 1.6, 0.4, 1), background-color 0.4s; }
.night-knob svg { width: 13px; height: 13px; fill: none; stroke: #3a2f27; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.night-knob .i-sun { display: none; }
.night-toggle:focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; border-radius: 999px; }
.theme-fade, .theme-fade *, .theme-fade *::before, .theme-fade *::after { transition: background-color 0.6s ease, color 0.6s ease, border-color 0.6s ease, fill 0.6s ease, stroke 0.6s ease !important; }

:root[data-theme="dark"]:not(#_) .night-track { background: #ff5a1f; border-color: #ff5a1f; }
:root[data-theme="dark"]:not(#_) .night-knob { transform: translateX(22px); background: #fff; }
:root[data-theme="dark"]:not(#_) .night-knob svg { stroke: #ff5a1f; }
:root[data-theme="dark"]:not(#_) .night-knob .i-moon { display: none; }
:root[data-theme="dark"]:not(#_) .night-knob .i-sun { display: inline; }

/* ---- The whole site ---- */
:root[data-theme="dark"]:not(#_) {
  color-scheme: dark;
  --white: #0e0e0f;
  --sand-1: #141416;
  --sand-2: #18181a;
  --sand-3: #202023;
  --line: #2a2a2e;
  --ink: #f5f3ef;
  --ink-2: #d8d5cf;
  --muted: #a1a09b;
  --bj-base: #0e0e0f;
  --bj-sky:
    radial-gradient(48% 44% at 6% 0%, rgba(255, 90, 31, 0.32), transparent 70%),
    radial-gradient(36% 40% at 100% 55%, rgba(226, 54, 31, 0.16), transparent 70%),
    radial-gradient(40% 34% at 40% 108%, rgba(255, 122, 61, 0.14), transparent 70%),
    linear-gradient(180deg, #111112 0%, #0b0b0c 100%);
}
:root[data-theme="dark"]:not(#_) a:hover { color: #ff7a3d; }
:root[data-theme="dark"]:not(#_) .btn-dark:hover { background: #ff5a1f; border-color: #ff5a1f; color: #fff; }
:root[data-theme="dark"]:not(#_) .picker-result,
:root[data-theme="dark"]:not(#_) .total-bar,
:root[data-theme="dark"]:not(#_) .plan-dark { background: #18181a; color: #f5f3ef; border-color: #2a2a2e; }
:root[data-theme="dark"]:not(#_) .plan-dark .price b, :root[data-theme="dark"]:not(#_) .plan-dark .plan-fit, :root[data-theme="dark"]:not(#_) .plan-dark .plan-once, :root[data-theme="dark"]:not(#_) .plan-dark ul, :root[data-theme="dark"]:not(#_) .picker-cost b { color: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .picker-result .btn-dark, :root[data-theme="dark"]:not(#_) .total-bar .btn-white { background: #ff5a1f; color: #fff; border-color: #ff5a1f; }
:root[data-theme="dark"]:not(#_) .picker-result .text-link { color: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .tag-dark { background: #ff5a1f; color: #fff; }

/* Black and white photos, color comes back on hover */
:root[data-theme="dark"]:not(#_) .jw-world img:not(.dl-hero-img img),
:root[data-theme="dark"]:not(#_) .wl img, :root[data-theme="dark"]:not(#_) .re img { filter: grayscale(1) contrast(1.06) brightness(0.92); transition: filter 0.6s ease; }
:root[data-theme="dark"]:not(#_) .jw-world img:hover, :root[data-theme="dark"]:not(#_) .wl img:hover, :root[data-theme="dark"]:not(#_) .re img:hover { filter: none; }

/* Footer */
:root[data-theme="dark"]:not(#_) .footer-word { color: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .footer-word span { color: #ff7a3d; }

/* ---- Chapters ---- */
:root[data-theme="dark"]:not(#_) .ch { --ch-ink: #f5f3ef; --ch-accent: #ff5a1f; }

/* ---- Wellness ---- */
:root[data-theme="dark"]:not(#_) .wl { --wl-cream: #0e0e0f; --wl-sand: rgba(24, 24, 26, 0.85); --wl-ink: #f5f3ef; --wl-soft: #a1a09b; --wl-olive: #ff5a1f; --wl-olive-dark: #ff7a3d; --wl-line: #2a2a2e; }
:root[data-theme="dark"]:not(#_) .wl-btn { color: #fff; border-radius: 999px; }
:root[data-theme="dark"]:not(#_) .wl-hero { background: #18181a; border-radius: 0 0 36px 36px; }
:root[data-theme="dark"]:not(#_) .wl-hero::after { background: linear-gradient(90deg, rgba(10, 10, 11, 0.85) 0%, rgba(10, 10, 11, 0.4) 55%, rgba(255, 90, 31, 0.18) 100%); }

/* ---- Real estate ---- */
:root[data-theme="dark"]:not(#_) .re { --re-bg: #0e0e0f; --re-band: rgba(24, 24, 26, 0.85); --re-ink: #f5f3ef; --re-soft: #a1a09b; --re-olive: #ff5a1f; --re-olive-2: #ff7a3d; --re-line: #2a2a2e; }
:root[data-theme="dark"]:not(#_) .re-card { background: #18181a; border-radius: 22px; overflow: hidden; border-color: #222225; }
:root[data-theme="dark"]:not(#_) .re-card:hover { border-color: #ff5a1f; }
:root[data-theme="dark"]:not(#_) .re-btn { color: #fff !important; border-radius: 999px; }
:root[data-theme="dark"]:not(#_) .re-btn-line { color: #f5f3ef !important; border-color: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .re-btn-line:hover { color: #0e0e0f !important; }
:root[data-theme="dark"]:not(#_) .re-studio { background-image: linear-gradient(#18181a 1px, transparent 1px), linear-gradient(90deg, #18181a 1px, transparent 1px); }
:root[data-theme="dark"]:not(#_) .re-studio-img, :root[data-theme="dark"]:not(#_) .re-studio-copy { background: #0e0e0f; border-radius: 22px; }
:root[data-theme="dark"]:not(#_) .re-form input, :root[data-theme="dark"]:not(#_) .re-form select, :root[data-theme="dark"]:not(#_) .re-form textarea { border-bottom-color: #3a3a3f; }

/* ---- Social + content ---- */
:root[data-theme="dark"]:not(#_) .sm { --cream: #f5f3ef; --wine: #f5f3ef; --rust: #ff5a1f; --rust-2: #ff7a3d; --soft: #a1a09b; color: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .sm-post { border-radius: 18px; }
:root[data-theme="dark"]:not(#_) .sm-cream { background: #18181a; color: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .sm-dark { background: radial-gradient(120% 90% at 85% 15%, #2a2a2e 0%, #161618 50%, #0b0b0c 100%); color: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .sm-wine-bg { background: #1c2436; color: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .sm-rust { background: linear-gradient(150deg, #ff7a3d, #ff5a1f 45%, #e2361f); color: #fff; }
:root[data-theme="dark"]:not(#_) .sm-red { background: #c9301c; color: #fff; }
:root[data-theme="dark"]:not(#_) .sm-blue { background: #2f4f86; color: #fff; }
:root[data-theme="dark"]:not(#_) .sm-h2, :root[data-theme="dark"]:not(#_) .sm-mega, :root[data-theme="dark"]:not(#_) .sm-wine, :root[data-theme="dark"]:not(#_) .sm-link, :root[data-theme="dark"]:not(#_) .sm-rates li, :root[data-theme="dark"]:not(#_) .sm-acc summary { color: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .sm-hero-sub, :root[data-theme="dark"]:not(#_) .sm-sub, :root[data-theme="dark"]:not(#_) .sm-acc p { color: #a1a09b; }
:root[data-theme="dark"]:not(#_) .sm-rates, :root[data-theme="dark"]:not(#_) .sm-rates li, :root[data-theme="dark"]:not(#_) .sm-acc details { border-color: #2a2a2e; }
:root[data-theme="dark"]:not(#_) .sm-dots { border-bottom-color: #3a3a3f; }
:root[data-theme="dark"]:not(#_) .sm-circle svg { stroke: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .sm-btn { background: #ff5a1f; color: #fff !important; border-radius: 999px; }
:root[data-theme="dark"]:not(#_) .sm-btn:hover { background: #ff7a3d; }
:root[data-theme="dark"]:not(#_) .sm-btn-light { background: #f5f3ef; color: #0e0e0f !important; }
:root[data-theme="dark"]:not(#_) .sm-marquee { background: #ff5a1f; color: #fff; }

/* ---- Glass sections: Websites + AI, Pricing, Ideas, Your look, end ---- */
:root[data-theme="dark"]:not(#_) .gx { --gx-bg: #0e0e0f; --gx-ink: #f5f3ef; --gx-soft: #a1a09b; --gx-line: #2a2a2e; --gx-warm: #ff5a1f; --gx-glow: rgba(255, 90, 31, 0.35); }
:root[data-theme="dark"]:not(#_) .gx-card, :root[data-theme="dark"]:not(#_) .gx .plan, :root[data-theme="dark"]:not(#_) .gx .addon, :root[data-theme="dark"]:not(#_) .gx .total-bar { background: rgba(24, 24, 26, 0.86); border-color: rgba(255, 255, 255, 0.06); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 30px 60px -34px rgba(0, 0, 0, 0.9); color: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .gx-card::before { background: radial-gradient(320px circle at var(--mx, 50%) var(--my, -20%), rgba(255, 90, 31, 0.18), transparent 60%); }
:root[data-theme="dark"]:not(#_) .gx-pill { background: #18181a; border-color: rgba(255, 255, 255, 0.06); color: #ff7a3d; }
:root[data-theme="dark"]:not(#_) .gx-pill::before { background: radial-gradient(circle at 35% 35%, #ffb08a, #ff5a1f 60%, #c9301c); }
:root[data-theme="dark"]:not(#_) .gx-icon { background: #202023; border-color: rgba(255, 255, 255, 0.06); }
:root[data-theme="dark"]:not(#_) .gx-btn { background: #ff5a1f; color: #fff !important; box-shadow: 0 12px 30px -12px rgba(255, 90, 31, 0.6); }
:root[data-theme="dark"]:not(#_) .gx-btn:hover { background: #ff7a3d; }
:root[data-theme="dark"]:not(#_) .gx-btn-light { background: #f5f3ef; color: #0e0e0f !important; border-color: #f5f3ef; box-shadow: none; }
:root[data-theme="dark"]:not(#_) .gx-grad { background-image: linear-gradient(92deg, #ff7a3d 0%, #ff5a1f 55%, #e2361f 100%); }
:root[data-theme="dark"]:not(#_) .gx-waves path { stroke: #3a3a3f; }
:root[data-theme="dark"]:not(#_) .gx-orb { background: #18181a; border-color: rgba(255, 255, 255, 0.08); box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.03), 0 30px 60px -20px rgba(255, 90, 31, 0.5); }
:root[data-theme="dark"]:not(#_) .gx-ticker span { color: #6f6e6a; }
:root[data-theme="dark"]:not(#_) .gx .picker-result { background: radial-gradient(80% 70% at 100% 0%, rgba(255, 90, 31, 0.28), transparent 70%), #18181a; color: #f5f3ef; border-color: rgba(255, 255, 255, 0.06); }
:root[data-theme="dark"]:not(#_) .gx .picker-result .btn-dark, :root[data-theme="dark"]:not(#_) .gx .total-bar .btn-white { background: #ff5a1f; color: #fff; border-color: #ff5a1f; }
:root[data-theme="dark"]:not(#_) .gx .opt span { background: #202023; border-color: #2a2a2e; color: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .gx .opt input:checked + span { background: #ff5a1f; color: #fff; border-color: #ff5a1f; }
:root[data-theme="dark"]:not(#_) .gx .plan-dark { background: radial-gradient(90% 60% at 50% 0%, rgba(255, 90, 31, 0.32), transparent 70%), #18181a; }
:root[data-theme="dark"]:not(#_) .gx .plan-dark .price, :root[data-theme="dark"]:not(#_) .gx .plan-dark .price b, :root[data-theme="dark"]:not(#_) .gx .plan-dark ul, :root[data-theme="dark"]:not(#_) .gx .plan-dark .plan-fit, :root[data-theme="dark"]:not(#_) .gx .plan-dark .plan-once { color: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .gx .plan-dark .tag, :root[data-theme="dark"]:not(#_) .gx .plan-choose, :root[data-theme="dark"]:not(#_) .gx .tag-dark { background: #ff5a1f; color: #fff; }
:root[data-theme="dark"]:not(#_) .gx .plan ul li::before { background: #ff5a1f; }
:root[data-theme="dark"]:not(#_) .gx .plan ul li::after { border-color: #fff; }
:root[data-theme="dark"]:not(#_) .gx .plan-pick.is-picked { box-shadow: 0 0 0 2px #ff5a1f, 0 30px 60px -30px rgba(0, 0, 0, 0.8); }
/* Chips in Find your ideas and Try your look */
:root[data-theme="dark"]:not(#_) .if-chip span, :root[data-theme="dark"]:not(#_) .dl-chip span { background: #202023; border-color: #2a2a2e; }
:root[data-theme="dark"]:not(#_) .if-chip input:checked + span, :root[data-theme="dark"]:not(#_) .dl-chip input:checked + span { background: #ff5a1f; border-color: #ff5a1f; color: #fff; }
:root[data-theme="dark"]:not(#_) .if-step span { background: #ff5a1f; color: #fff; }
/* Little scenes on the Websites + AI page */
:root[data-theme="dark"]:not(#_) .ws-browser { background: #141416; border-color: #2a2a2e; }
:root[data-theme="dark"]:not(#_) .ws-bar { background: #202023; }
:root[data-theme="dark"]:not(#_) .ws-bar span, :root[data-theme="dark"]:not(#_) .ws-search, :root[data-theme="dark"]:not(#_) .ws-input { background: #18181a; border-color: #2a2a2e; }
:root[data-theme="dark"]:not(#_) .ws-bar i { background: #3a3a3f; }
:root[data-theme="dark"]:not(#_) .ws-cta, :root[data-theme="dark"]:not(#_) .ws-cal .on, :root[data-theme="dark"]:not(#_) .ws-bubbles .a, :root[data-theme="dark"]:not(#_) .ws-input b { color: #fff; }
:root[data-theme="dark"]:not(#_) .ws-cta, :root[data-theme="dark"]:not(#_) .ws-bubbles .a, :root[data-theme="dark"]:not(#_) .ws-input b { background: #ff5a1f; }
:root[data-theme="dark"]:not(#_) .ws-cal span, :root[data-theme="dark"]:not(#_) .ws-status li { background: #202023; }
:root[data-theme="dark"]:not(#_) .ws-cal .on { background: #ff5a1f; }
:root[data-theme="dark"]:not(#_) .ws-bubbles .c { background: #202023; }
:root[data-theme="dark"]:not(#_) .ws-search b { color: #ff7a3d; }
:root[data-theme="dark"]:not(#_) .ws-search i { color: #8fc39d; }
:root[data-theme="dark"]:not(#_) .ws-search span { border-color: #2a2a2e; }
:root[data-theme="dark"]:not(#_) .ws-cube i { background: linear-gradient(160deg, #2a2a2e, #18181a); }
:root[data-theme="dark"]:not(#_) .ws-cube i:nth-child(2) { background: linear-gradient(160deg, #ff7a3d, #e2361f); }
:root[data-theme="dark"]:not(#_) .ws-pulse b { background: linear-gradient(160deg, #2a2a2e, #18181a); }
:root[data-theme="dark"]:not(#_) .ws-list li { border-top-color: rgba(255, 255, 255, 0.05); animation-name: ws-hl-night; }
@keyframes ws-hl-night { 0%, 18% { background: rgba(255, 255, 255, 0.06); box-shadow: inset 3px 0 0 #ff5a1f; } 22%, 100% { background: transparent; box-shadow: none; } }
:root[data-theme="dark"]:not(#_) .ws-panel li, :root[data-theme="dark"]:not(#_) .ws-faq details { border-color: rgba(255, 255, 255, 0.07); }
:root[data-theme="dark"]:not(#_) .ws-close-card, :root[data-theme="dark"]:not(#_) .pr-close-card, :root[data-theme="dark"]:not(#_) .gx-close { background: radial-gradient(70% 90% at 50% 0%, rgba(255, 90, 31, 0.35), transparent 70%), #18181a; }
:root[data-theme="dark"]:not(#_) .pr-word { background-image: linear-gradient(180deg, #f5f3ef 0%, rgba(255, 90, 31, 0.5) 55%, rgba(255, 90, 31, 0.02) 100%); }

/* ---- Home: the globe ---- */
:root[data-theme="dark"]:not(#_) .gb { --gb-dot: #f5f3ef; --gb-arc: #ff5a1f; --gb-pin: #ff7a3d; background: radial-gradient(60% 50% at 50% 45%, rgba(255, 90, 31, 0.16) 0%, transparent 70%), linear-gradient(180deg, #0e0e0f 0%, #0b0b0c 100%); color: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .gb-orbs i { opacity: 0.55; }
:root[data-theme="dark"]:not(#_) .gb-orbs i:nth-child(1) { background: #ff5a1f; opacity: 0.35; }
:root[data-theme="dark"]:not(#_) .gb-orbs i:nth-child(2) { background: #e2361f; opacity: 0.22; }
:root[data-theme="dark"]:not(#_) .gb-orbs i:nth-child(3) { background: #ff7a3d; opacity: 0.25; }
:root[data-theme="dark"]:not(#_) .gb-brand { color: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .gb-brand .gb-studios { color: #ff7a3d; }
:root[data-theme="dark"]:not(#_) .gb-glass { background: radial-gradient(circle at 32% 26%, rgba(255, 255, 255, 0.16) 0%, rgba(255, 255, 255, 0.04) 25%, rgba(255, 255, 255, 0.015) 60%, rgba(255, 255, 255, 0.05) 100%); border-color: rgba(255, 255, 255, 0.12); box-shadow: inset 0 -24px 60px rgba(255, 90, 31, 0.22), inset 0 10px 30px rgba(255, 255, 255, 0.05), 0 40px 90px -40px rgba(255, 90, 31, 0.45); }
:root[data-theme="dark"]:not(#_) .gb-glow { background: radial-gradient(circle, rgba(255, 90, 31, 0.4), transparent 65%); }
:root[data-theme="dark"]:not(#_) .gb-rim { background: radial-gradient(circle at 30% 22%, rgba(255, 255, 255, 0.14), transparent 18%); }
:root[data-theme="dark"]:not(#_) .gb-enter { background: #ff5a1f; border-color: #ff5a1f; color: #fff; box-shadow: 0 14px 34px -14px rgba(255, 90, 31, 0.7); }
:root[data-theme="dark"]:not(#_) .gb-stage:hover .gb-enter { background: #ff7a3d; }
:root[data-theme="dark"]:not(#_) .gb-tag { color: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .gb-sub { color: #a1a09b; }

/* ---- Home: the journey ---- */
:root[data-theme="dark"]:not(#_) .jw-dots a { color: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .jw-dots .jw-n { background: rgba(24, 24, 26, 0.8); }
:root[data-theme="dark"]:not(#_) .jw-dots .jw-name { background: rgba(24, 24, 26, 0.9); }
:root[data-theme="dark"]:not(#_) .jw-dots a.is-active .jw-n { background: #ff5a1f; border-color: #ff5a1f; color: #fff; }
:root[data-theme="dark"]:not(#_) .jw-progress span { background: linear-gradient(90deg, #ff7a3d, #ff5a1f, #e2361f); }
:root[data-theme="dark"]:not(#_) .jw-pill span { background: rgba(255, 90, 31, 0.92); color: #fff; }
:root[data-theme="dark"]:not(#_) .jw-intro-title em { color: #ff5a1f; }
:root[data-theme="dark"]:not(#_) .jw-map a { background: #18181a; border-color: #2a2a2e; }
:root[data-theme="dark"]:not(#_) .jw-map span { background: #ff5a1f; color: #fff; }
:root[data-theme="dark"]:not(#_) .sm-blob-post .sm-blob { background: radial-gradient(circle at 30% 30%, #ff7a3d, #e2361f); }
:root[data-theme="dark"]:not(#_) .sm-blob p { color: #fff; }
:root[data-theme="dark"]:not(#_) .gb-lang { background: rgba(24, 24, 26, 0.55); border-color: rgba(255, 255, 255, 0.12); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 10px 26px -14px rgba(0, 0, 0, 0.8); }
:root[data-theme="dark"]:not(#_) .gb-lang button { color: #a1a09b; }
:root[data-theme="dark"]:not(#_) .gb-lang button:hover { color: #f5f3ef; }
:root[data-theme="dark"]:not(#_) .gb-lang button[aria-pressed="true"] { background: #ff5a1f; color: #fff; }
:root[data-theme="dark"]:not(#_) .ws-live { background: rgba(10, 10, 11, 0.55); border-color: rgba(255, 255, 255, 0.06); box-shadow: none; }
:root[data-theme="dark"]:not(#_) .ws-live li i { background: #ff5a1f; }
:root[data-theme="dark"]:not(#_) .ws-live li i::after { border-color: #fff; }
