/* =====================================================
   MS-PROGRESS — dark theme overrides
   Aktywowany przez html.theme-dark
   ===================================================== */

:root.theme-dark {
  color-scheme: dark;

  /* Surface tokens */
  --canvas: #071426;
  --paper:  #0f2440;

  /* Ink scale — odwrócona polaryzacja (jasne = wysokie) */
  --ink-950: #050a14;   /* najgłębszy ciemny — pozostaje */
  --ink-900: #f1f3f7;   /* tekst główny (był ciemny, teraz jasny) */
  --ink-800: #e3e7f0;
  --ink-700: #d2d8e4;
  --ink-600: #b9c0d0;
  --ink-500: #9aa3b8;
  --ink-400: #7c879f;
  --ink-300: #5a6680;
  --ink-200: #29405f;   /* obramowania na ciemnym */
  --ink-100: #1d3450;
  --ink-50:  #152b45;

  /* Akcenty — brand blue rozjaśniony dla kontrastu na ciemnym */
  --accent:        #35a6dd;
  --accent-strong: #5cbcea;
  --accent-soft:   #10324a;
  --accent-ink:    #93d5f5;

  /* Rule borders */
  --rule:      1px solid rgba(255, 255, 255, 0.06);
  --rule-dark: 1px solid rgba(255, 255, 255, 0.08);
}

/* ----------------------------------------------------------
   Body / podstawa
   ---------------------------------------------------------- */
.theme-dark body {
  background: var(--canvas);
  color: var(--ink-700);
}

/* ----------------------------------------------------------
   Header — naprawa nadpisanego hardcoded tła
   ---------------------------------------------------------- */
.theme-dark .site-header { background: rgba(7, 20, 38, 0); }
.theme-dark .site-header.is-stuck {
  background: rgba(7, 20, 38, 0.82);
  border-bottom-color: rgba(255, 255, 255, 0.08);
}
.theme-dark .brand__logo--light { display: none; }
.theme-dark .brand__logo--dark { display: block; }
.theme-dark .brand__sub { color: var(--ink-400); border-left-color: rgba(255, 255, 255, 0.1); }
.theme-dark .nav a { color: var(--ink-500); }
.theme-dark .nav a:hover,
.theme-dark .nav a.is-active,
.theme-dark .nav a[aria-current="page"] { color: var(--ink-900); }
.theme-dark .nav-toggle { border-color: rgba(255, 255, 255, 0.14); }
.theme-dark .nav-toggle span { background: var(--ink-900); }

@media (max-width: 1080px) {
  .theme-dark .nav {
    background: var(--paper);
    border-bottom-color: rgba(255, 255, 255, 0.08);
  }
  .theme-dark .nav a { border-bottom-color: rgba(255, 255, 255, 0.06); }
}

/* Dropdown */
.theme-dark .nav__dropdown {
  background: var(--paper);
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 30px 60px rgba(0, 0, 0, 0.5);
}
.theme-dark .nav__dropdown a { color: var(--ink-700); border-bottom-color: rgba(255, 255, 255, 0.06); }
.theme-dark .nav__dropdown a:hover { background: rgba(255, 255, 255, 0.04); color: var(--ink-900); }
.theme-dark .nav__dropdown a .num { color: var(--ink-400); }
.theme-dark .nav__dropdown a .arrow, .theme-dark .nav__dropdown a > span:not([class]) { color: var(--ink-400); }
.theme-dark .nav__group > a::after { color: var(--ink-400); }

/* ----------------------------------------------------------
   Hero
   ---------------------------------------------------------- */
.theme-dark .hero { background: var(--canvas); }
.theme-dark .hero__meta { color: var(--ink-400); }
.theme-dark .hero__meta .pill {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 255, 255, 0.1);
  color: var(--ink-600);
}
.theme-dark .hero__title em { color: var(--ink-400); }
.theme-dark .hero__title .accent { color: var(--accent-ink); }
.theme-dark .hero__bottom p { color: var(--ink-500); }

/* ----------------------------------------------------------
   Stats
   ---------------------------------------------------------- */
.theme-dark .stats { background: var(--paper); }
.theme-dark .stats__grid { border-color: rgba(255, 255, 255, 0.06); }
.theme-dark .stat { background: var(--paper); border-color: rgba(255, 255, 255, 0.06); }
.theme-dark .stat__value { color: var(--ink-900); }
.theme-dark .stat__value .unit,
.theme-dark .stat__label,
.theme-dark .stat__note { color: var(--ink-400); }
.theme-dark .stat__idx { color: var(--ink-300); }

/* ----------------------------------------------------------
   Marquee — pozostaw ciemny (tylko nieco głębszy)
   ---------------------------------------------------------- */
.theme-dark .marquee {
  background: var(--ink-950);
  color: var(--ink-600);
  border-color: rgba(255, 255, 255, 0.05);
}

/* ----------------------------------------------------------
   Industries (teaser cards + grid kart)
   ---------------------------------------------------------- */
.theme-dark .industries { background: var(--canvas); }
.theme-dark .industry-cards,
.theme-dark .industries__tabs { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .industry-card,
.theme-dark .industries__tab { background: var(--paper); border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .industry-card:hover { background: rgba(255, 255, 255, 0.04); }
.theme-dark .industry-card p,
.theme-dark .industries__tab .meta { color: var(--ink-500); }
.theme-dark .industry-card .badge,
.theme-dark .industry-panel__copy .badge {
  background: rgba(255, 255, 255, 0.05);
  color: var(--ink-700);
  border-color: rgba(255, 255, 255, 0.08);
}
.theme-dark .industries__tab:hover { background: rgba(255, 255, 255, 0.04); }
.theme-dark .industries__tab.is-active { background: var(--ink-900); }
.theme-dark .industries__tab.is-active .name,
.theme-dark .industries__tab.is-active .num { color: var(--canvas); }
.theme-dark .industries__tab.is-active .meta { color: var(--accent-strong); }
.theme-dark .industry-panel__copy p { color: var(--ink-500); }
.theme-dark .app-item { color: var(--ink-600); border-color: rgba(255, 255, 255, 0.06); }

/* ----------------------------------------------------------
   Clients wall
   ---------------------------------------------------------- */
.theme-dark .clients__wall { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .clients__tile { background: var(--paper); border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .clients__tile:hover { background: rgba(255, 255, 255, 0.04); }
.theme-dark .clients__tile.is-nda {
  background:
    repeating-linear-gradient(135deg,
      rgba(255, 255, 255, 0.025) 0 1px,
      transparent 1px 7px),
    var(--paper);
}
.theme-dark .clients__name { color: var(--ink-900); }
.theme-dark .clients__meta { color: var(--ink-400); }
.theme-dark .clients__note {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 255, 255, 0.1);
}
.theme-dark .clients__note p { color: var(--ink-500); }

/* ----------------------------------------------------------
   Process — sekcja zawsze ciemna, w trybie dark idzie głębiej
   ---------------------------------------------------------- */
.theme-dark .process { background: var(--ink-950); color: var(--ink-600); }
.theme-dark .process .section-head h2,
.theme-dark .process .section-head h3 { color: var(--ink-900); }
.theme-dark .process .lead,
.theme-dark .process .section-head .lead { color: var(--ink-500); }
.theme-dark .process .step h4 { color: var(--ink-900); }
.theme-dark .process .step p { color: var(--ink-500); }

/* ----------------------------------------------------------
   About
   ---------------------------------------------------------- */
.theme-dark .about__lead { color: var(--ink-900); }
.theme-dark .about__lead .hl { background: var(--accent-soft); color: var(--accent-ink); }
.theme-dark .about__copy { color: var(--ink-500); }
.theme-dark .about__copy strong { color: var(--ink-900); }
.theme-dark .about__values,
.theme-dark .about__value { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .about__value p { color: var(--ink-500); }
.theme-dark .mv__title { color: var(--ink-900); }
.theme-dark .mv p { color: var(--ink-500); }
.theme-dark .about__mv,
.theme-dark .mv { border-color: rgba(255, 255, 255, 0.08); }

/* Values grid */
.theme-dark .values-grid,
.theme-dark .value { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .value { background: var(--paper); }
.theme-dark .value:hover { background: rgba(255, 255, 255, 0.04); }
.theme-dark .value__icon-bg { background: rgba(255, 255, 255, 0.06); }
.theme-dark .value__icon { color: var(--ink-900); }
.theme-dark .value p { color: var(--ink-500); }
.theme-dark .values-head p { color: var(--ink-500); }

/* ----------------------------------------------------------
   Products
   ---------------------------------------------------------- */
.theme-dark .products { background: var(--paper); }
.theme-dark .products__grid,
.theme-dark .product { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .product:hover { background: rgba(255, 255, 255, 0.04); }
.theme-dark .product p { color: var(--ink-500); }
.theme-dark .product__tag {
  background: rgba(255, 255, 255, 0.06);
  color: var(--ink-700);
}
.theme-dark .product__foot { color: var(--ink-500); border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .product__foot .arrow, .theme-dark .product__foot > span:not([class]) { color: var(--ink-900); }

/* ----------------------------------------------------------
   Capabilities
   ---------------------------------------------------------- */
.theme-dark .capabilities { background: var(--canvas); }
.theme-dark .cap__grid,
.theme-dark .cap { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .cap { background: var(--paper); }
.theme-dark .cap p { color: var(--ink-500); }
.theme-dark .cap .code { background: var(--accent-soft); color: var(--accent-ink); }

/* ----------------------------------------------------------
   Quality / Certifications — zawsze ciemna
   ---------------------------------------------------------- */
.theme-dark .quality { background: var(--ink-950); }
.theme-dark .quality__lead h2,
.theme-dark .quality__lead h3 { color: var(--ink-900); }
.theme-dark .quality__lead p { color: var(--ink-500); }

/* ----------------------------------------------------------
   Why us / Partnership
   ---------------------------------------------------------- */
.theme-dark .why { background: var(--paper); }
.theme-dark .why__grid,
.theme-dark .why__item { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .why__item .num { color: var(--ink-200); }
.theme-dark .why__item p { color: var(--ink-500); }
.theme-dark .partnership {
  background: rgba(255, 255, 255, 0.025);
  border-color: rgba(255, 255, 255, 0.08);
}
.theme-dark .tier p { color: var(--ink-500); }

/* ----------------------------------------------------------
   Contact / CTA — zawsze ciemna
   ---------------------------------------------------------- */
.theme-dark .contact { background: var(--ink-950); }
.theme-dark .contact h2 { color: var(--ink-900); }
.theme-dark .contact h2 .accent,
.theme-dark .cta-strip h2 .accent { color: var(--accent); }
.theme-dark .contact__sub { color: var(--ink-500); }
.theme-dark .contact__card {
  background: rgba(255, 255, 255, 0.035);
  border-color: rgba(255, 255, 255, 0.08);
}
.theme-dark .contact__person .name { color: var(--ink-900); }
.theme-dark .contact__person .role,
.theme-dark .contact__lines { color: var(--ink-500); }
.theme-dark .contact__strip,
.theme-dark .contact__strip > div { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .contact__strip .label { color: var(--ink-400); }
.theme-dark .contact__strip .value { color: var(--ink-700); }

.theme-dark .cta-strip { background: var(--ink-950); }
.theme-dark .cta-strip h2 { color: var(--ink-900); }
.theme-dark .cta-strip p { color: var(--ink-500); }

/* ----------------------------------------------------------
   Pillars — zawsze ciemna
   ---------------------------------------------------------- */
.theme-dark .pillars { background: var(--ink-950); }
.theme-dark .pillars__head h2,
.theme-dark .pillar__title { color: var(--ink-900); }
.theme-dark .pillars__head p,
.theme-dark .pillar__body { color: var(--ink-500); }
.theme-dark .pillars__grid,
.theme-dark .pillar { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .pillar__proofs { border-top-color: rgba(255, 255, 255, 0.1); }
.theme-dark .pillar__proof strong { color: var(--ink-900); }

/* ----------------------------------------------------------
   Footer
   ---------------------------------------------------------- */
.theme-dark .footer { background: #03080f; color: var(--ink-500); }
.theme-dark .footer__top { border-bottom-color: rgba(255, 255, 255, 0.06); }
.theme-dark .footer__brand .brand { color: var(--ink-900); }
.theme-dark .footer__brand p { color: var(--ink-400); }
.theme-dark .footer__col h5 { color: var(--ink-400); }
.theme-dark .footer__col a { color: var(--ink-600); }
.theme-dark .footer__col a:hover { color: var(--accent); }
.theme-dark .footer__bottom { color: var(--ink-400); }

/* ----------------------------------------------------------
   Buttons
   ---------------------------------------------------------- */
.theme-dark .btn { background: var(--ink-900); color: var(--canvas); }
.theme-dark .btn:hover { background: var(--ink-700); }
.theme-dark .btn--ghost {
  background: transparent;
  color: var(--ink-900);
  border-color: rgba(255, 255, 255, 0.18);
}
.theme-dark .btn--ghost:hover { background: var(--ink-900); color: var(--canvas); border-color: var(--ink-900); }

/* CTA strip — buttons on dark stay light */
.theme-dark .cta-strip .btn { background: var(--ink-900); color: var(--canvas); border-color: var(--ink-900); }
.theme-dark .cta-strip .btn:hover { background: var(--ink-700); }
.theme-dark .cta-strip .btn--ghost {
  background: transparent;
  color: var(--ink-900);
  border-color: rgba(255, 255, 255, 0.22);
}
.theme-dark .cta-strip .btn--ghost:hover { background: var(--ink-900); color: var(--canvas); }

/* ----------------------------------------------------------
   Placeholders
   ---------------------------------------------------------- */
.theme-dark .placeholder {
  background:
    repeating-linear-gradient(135deg,
      rgba(255, 255, 255, 0.04) 0 1px,
      transparent 1px 8px),
    var(--ink-50);
  color: var(--ink-400);
}
.theme-dark .placeholder::before { border-color: rgba(255, 255, 255, 0.28); }
.theme-dark .placeholder::after { background: var(--accent); color: #06131f; }
.theme-dark .placeholder span { background: var(--paper); }

/* ----------------------------------------------------------
   Page hero / breadcrumbs / cross-links / standards / industry-cards subpages
   ---------------------------------------------------------- */
.theme-dark .page-hero { background: var(--canvas); border-bottom-color: rgba(255, 255, 255, 0.08); }
.theme-dark .page-hero h1 .accent { color: var(--accent-ink); }
.theme-dark .page-hero__lead { color: var(--ink-500); }
.theme-dark .page-hero__meta { color: var(--ink-400); }
.theme-dark .page-hero__meta .item .v { color: var(--ink-900); }

.theme-dark .breadcrumbs { color: var(--ink-400); }
.theme-dark .breadcrumbs a { color: var(--ink-400); }
.theme-dark .breadcrumbs a:hover,
.theme-dark .breadcrumbs .current { color: var(--ink-900); }
.theme-dark .breadcrumbs .sep { color: var(--ink-300); }

.theme-dark .cross-links,
.theme-dark .cross-link { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .cross-link { background: var(--paper); }
.theme-dark .cross-link:hover { background: rgba(255, 255, 255, 0.04); }
.theme-dark .cross-link h4 { color: var(--ink-900); }
.theme-dark .cross-link p { color: var(--ink-500); }

.theme-dark .standards-strip,
.theme-dark .standards-strip > div { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .standards-strip > div { background: var(--paper); }
.theme-dark .standards-strip .code { color: var(--ink-900); }
.theme-dark .standards-strip .name { color: var(--ink-400); }

/* ----------------------------------------------------------
   Forms
   ---------------------------------------------------------- */
.theme-dark .form-grid,
.theme-dark .form-row { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .form-row { background: var(--paper); }
.theme-dark .form-row label { color: var(--ink-400); }
.theme-dark .form-row input,
.theme-dark .form-row select,
.theme-dark .form-row textarea {
  color: var(--ink-900);
  border-bottom-color: rgba(255, 255, 255, 0.14);
}
.theme-dark .form-row input::placeholder,
.theme-dark .form-row textarea::placeholder { color: var(--ink-400); }
.theme-dark .form-row input:focus,
.theme-dark .form-row select:focus,
.theme-dark .form-row textarea:focus { border-bottom-color: var(--ink-900); }
.theme-dark .form-submit small { color: var(--ink-400); }
.theme-dark .form-row select option { background: var(--paper); color: var(--ink-900); }

/* Office grid */
.theme-dark .office-grid,
.theme-dark .office-info { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .office-info dt { color: var(--ink-400); }
.theme-dark .office-info dd { color: var(--ink-700); }
.theme-dark .office-info a { color: var(--accent-ink); border-bottom-color: var(--accent); }

/* ----------------------------------------------------------
   Knowledge zone
   ---------------------------------------------------------- */
.theme-dark .knowledge-toolbar { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .knowledge-tabs {
  background: var(--paper);
  border-color: rgba(255, 255, 255, 0.08);
}
.theme-dark .knowledge-tabs button { color: var(--ink-500); }
.theme-dark .knowledge-tabs button .count {
  background: rgba(255, 255, 255, 0.06);
  color: var(--ink-400);
}
.theme-dark .knowledge-tabs button:hover { color: var(--ink-900); }
.theme-dark .knowledge-tabs button[aria-pressed="true"] { background: var(--ink-900); color: var(--canvas); }
.theme-dark .knowledge-tabs button[aria-pressed="true"] .count {
  background: rgba(11, 20, 34, 0.18);
  color: var(--canvas);
}
.theme-dark .knowledge-meta { color: var(--ink-400); }

.theme-dark .knowledge-grid,
.theme-dark .knowledge-card { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .knowledge-card { background: var(--paper); }
.theme-dark .knowledge-card:hover { background: rgba(255, 255, 255, 0.04); }
.theme-dark .knowledge-card h3 { color: var(--ink-900); }
.theme-dark .knowledge-card p { color: var(--ink-500); }
.theme-dark .knowledge-card__meta { color: var(--ink-400); }
.theme-dark .knowledge-card__type {
  background: var(--paper);
  border-color: rgba(255, 255, 255, 0.1);
  color: var(--ink-900);
}
.theme-dark .knowledge-card .tag-row .tag {
  background: rgba(255, 255, 255, 0.05);
  color: var(--ink-600);
}

/* ----------------------------------------------------------
   Article (case study / blog post)
   ---------------------------------------------------------- */
.theme-dark .article-hero { background: var(--canvas); border-bottom-color: rgba(255, 255, 255, 0.08); }
.theme-dark .article-hero__type { color: var(--ink-400); }
.theme-dark .article-hero h1 .accent { color: var(--accent-ink); }
.theme-dark .article-hero__lead { color: var(--ink-500); }
.theme-dark .article-meta,
.theme-dark .article-meta > div { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .article-meta dt { color: var(--ink-400); }
.theme-dark .article-meta dd { color: var(--ink-900); }

.theme-dark .article-cover { background: var(--paper); }
.theme-dark .article-body { background: var(--paper); }
.theme-dark .article-body__main p,
.theme-dark .article-body__main li { color: var(--ink-700); }
.theme-dark .article-body__main strong { color: var(--ink-900); }
.theme-dark .article-body__main a { color: var(--accent-ink); border-bottom-color: var(--accent); }
.theme-dark .article-body__main blockquote {
  border-left-color: var(--accent);
  color: var(--ink-900);
}
.theme-dark .article-body__main blockquote cite { color: var(--ink-400); }
.theme-dark .article-body__main figcaption { color: var(--ink-400); }
.theme-dark .article-body__main ol li::before { color: var(--ink-400); }

.theme-dark .article-toc {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 255, 255, 0.08);
}
.theme-dark .article-toc .label { color: var(--ink-400); }
.theme-dark .article-toc ol li a { color: var(--ink-500); }
.theme-dark .article-toc ol li a::before { color: var(--ink-400); }
.theme-dark .article-toc ol li a:hover { color: var(--ink-900); }
.theme-dark .article-toc__share { border-top-color: rgba(255, 255, 255, 0.08); }
.theme-dark .article-toc__share a {
  border-color: rgba(255, 255, 255, 0.12);
  color: var(--ink-600);
}
.theme-dark .article-toc__share a:hover {
  background: var(--ink-900);
  color: var(--canvas);
  border-color: var(--ink-900);
}

/* KPI band, case blocks */
.theme-dark .kpi-band,
.theme-dark .kpi-band > div { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .kpi-band > div { background: rgba(255, 255, 255, 0.03); }
.theme-dark .kpi-band .v { color: var(--ink-900); }
.theme-dark .kpi-band .v .unit,
.theme-dark .kpi-band .k { color: var(--ink-400); }
.theme-dark .case-blocks,
.theme-dark .case-block { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .case-block .label { color: var(--ink-400); }
.theme-dark .case-block .label .num { color: var(--ink-900); }
.theme-dark .case-block .body p { color: var(--ink-700); }

.theme-dark .related-strip { background: var(--canvas); border-top-color: rgba(255, 255, 255, 0.08); }

/* ----------------------------------------------------------
   Expandable (details/summary)
   ---------------------------------------------------------- */
.theme-dark .expandable,
.theme-dark .expandable:last-of-type { border-color: rgba(255, 255, 255, 0.08); }
.theme-dark .expandable[open] { background: var(--paper); }
.theme-dark .expandable__title { color: var(--ink-900); }
.theme-dark .expandable__sub { color: var(--ink-400); }
.theme-dark .expandable__num { color: var(--ink-400); }
.theme-dark .expandable__toggle {
  background: var(--paper);
  border-color: rgba(255, 255, 255, 0.14);
  color: var(--ink-700);
}
.theme-dark .expandable > summary:hover .expandable__toggle,
.theme-dark .expandable[open] .expandable__toggle {
  background: var(--ink-900);
  color: var(--canvas);
  border-color: var(--ink-900);
}
.theme-dark .expandable__body { border-top-color: rgba(255, 255, 255, 0.08); }
.theme-dark .is-continuation .eyebrow .cont-name { color: var(--ink-700); }

/* ----------------------------------------------------------
   Section utility classes
   ---------------------------------------------------------- */
.theme-dark .section--paper { background: var(--paper); }
.theme-dark .section--accent { background: var(--accent-soft); }

/* Section-head lead */
.theme-dark .section-head .lead,
.theme-dark p.lead { color: var(--ink-500); }

/* ----------------------------------------------------------
   Tweaks panel — overrides dla ciemnego
   ---------------------------------------------------------- */
.theme-dark .tweaks-panel {
  background: var(--paper);
  border-color: rgba(255, 255, 255, 0.1);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}
.theme-dark .tweaks-close { color: var(--ink-400); }
.theme-dark .tweaks-label { color: var(--ink-400); }
.theme-dark .swatch { outline-color: rgba(255, 255, 255, 0.18); }
.theme-dark .swatch.is-active { outline-color: var(--ink-900); }
.theme-dark .tweaks-seg { border-color: rgba(255, 255, 255, 0.14); }
.theme-dark .tweaks-seg button {
  background: var(--paper);
  color: var(--ink-500);
  border-right-color: rgba(255, 255, 255, 0.14);
}
.theme-dark .tweaks-seg button.is-active { background: var(--ink-900); color: var(--canvas); }

/* ----------------------------------------------------------
   Theme toggle button (floater)
   ---------------------------------------------------------- */
.theme-toggle {
  position: fixed;
  bottom: 24px;
  left: 24px;
  z-index: 199;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px 10px 12px;
  background: var(--paper, #fff);
  color: var(--ink-900, #0a1421);
  border: 1px solid var(--ink-200, #c7cdd9);
  border-radius: 999px;
  font-family: var(--font-mono, monospace);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  box-shadow: 0 10px 30px rgba(10, 20, 33, 0.10);
  cursor: pointer;
  transition: transform 200ms var(--ease), box-shadow 200ms var(--ease),
              background 200ms var(--ease), color 200ms var(--ease),
              border-color 200ms var(--ease);
}
.theme-toggle:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 36px rgba(10, 20, 33, 0.18);
}
.theme-toggle__icon {
  width: 22px;
  height: 22px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  background: var(--canvas, #f6f5f1);
  font-size: 12px;
  line-height: 1;
}
.theme-dark .theme-toggle {
  background: var(--paper);
  color: var(--ink-900);
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
}
.theme-dark .theme-toggle__icon {
  background: var(--canvas);
  color: var(--accent);
}

@media (max-width: 640px) {
  .theme-toggle {
    bottom: 16px;
    left: 16px;
    padding: 8px 14px 8px 10px;
    font-size: 10px;
  }
}

.theme-dark .hero-media { background: var(--canvas); }
.theme-dark .hero-media--paper { background: var(--paper); }