/* ==========================================================================
   LAWHUB 1.2 — one layout, two palettes.  Nothing here changes the layout,
   service registry, motion timing or page structure of the approved design.
   Light theme is selected with <html data-theme="light">.
   ========================================================================== */

/* Theme control: independent of any application function. */
.theme-toggle {
  appearance: none;
  -webkit-appearance: none;
  display: inline-grid;
  place-items: center;
  flex: 0 0 43px;
  width: 43px;
  height: 43px;
  padding: 0;
  border: 1px solid var(--line-2);
  border-radius: 50%;
  background: color-mix(in srgb, var(--navy-2) 50%, transparent);
  color: var(--text);
  cursor: pointer;
  transition: color var(--t-med) var(--ease-out), background var(--t-med) var(--ease-out),
    border-color var(--t-med) var(--ease-out), transform var(--t-fast) var(--ease-out);
}
.theme-toggle:hover {
  background: var(--surface);
  border-color: var(--lumen);
}
.theme-toggle:active { transform: scale(.94); }
.theme-toggle svg { width: 21px; height: 21px; grid-area: 1 / 1; }
.theme-toggle__moon { display: none; }
html[data-theme="light"] .theme-toggle__sun { display: none; }
html[data-theme="light"] .theme-toggle__moon { display: block; }
.mobile-menu__tools, .auth-side__actions, .auth-mobile-brand__actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 9px;
}
.mobile-menu__tools { flex-shrink: 0; }
.site-header__bar > .theme-toggle { margin-left: auto; }
/* Small screens have space for two 43px controls without hiding the logo. */
@media (max-width: 1079px) {
  .site-header__bar { gap: 10px; }
  .site-header__bar > .theme-toggle { margin-left: auto; }
}
@media (max-width: 479px) {
  .auth-mobile-brand { gap: 8px; }
  .auth-mobile-brand__actions { gap: 4px; }
  .auth-mobile-brand__actions .btn { padding-inline: 4px; }
  .brand__mark { flex-basis: 48px; width: 48px; height: 39px; }
  .brand__name { font-size: 1.04rem; letter-spacing: .15em; }
  .brand__slogan { font-size: .66rem; }
  .theme-toggle { width: 40px; height: 40px; flex-basis: 40px; }
  .menu-toggle { width: 43px; height: 43px; }
}
@media (min-width: 1080px) and (max-width: 1250px) {
  .site-header__bar { gap: 8px; }
  .nav__link { padding-inline: 8px; }
  .header-actions .btn { padding-inline: 10px; }
  .brand__mark { flex-basis: 49px; width: 49px; }
  .brand__name { font-size: 1.02rem; }
}

/* All palette colors (main surfaces + semantic contrast). */
html[data-theme="light"] {
  color-scheme: light;
  --ink-0: #e9eff7;
  --ink-1: #f5f8fc;
  --brand: #14233a;
  --navy-2: #ffffff;
  --surface: #e6edf6;
  --surface-2: #dce7f2;
  --steel: #586e86;
  --silver: #435971;
  --text: #172740;
  --text-2: #40546d;
  --text-3: #62758a;
  --lumen: #245780;
  --lumen-soft: rgba(36, 87, 128, .09);
  --line: rgba(33, 60, 89, .12);
  --line-2: rgba(33, 60, 89, .23);
  --glass: rgba(255, 255, 255, .72);
  --glass-strong: rgba(255, 255, 255, .95);
  --st-active: #247452;
  --st-restricted: #7d5a1e;
  --st-beta: #315e91;
  --st-planned: #566879;
  --shadow-1: 0 1px 0 rgba(255,255,255,.75) inset, 0 10px 35px -22px rgba(27,54,83,.27);
  --shadow-2: 0 1px 0 rgba(255,255,255,.8) inset, 0 24px 65px -28px rgba(27,54,83,.22);
  --shadow-3: 0 32px 90px -30px rgba(23,47,75,.26);
}
/* Animate palette changes, not content movement or layout. */
/* Theme switching must never overwrite existing menu, carousel or SVG
   transition properties: those are part of the original approved motion. */
@media (prefers-reduced-motion: no-preference) {
  html.theme-ready body { transition: background-color 260ms var(--ease-out), color 260ms var(--ease-out); }
}
html[data-theme="light"] ::selection { background: rgba(36, 87, 128, .2); color: #14233a; }
html[data-theme="light"] .lh-mark { --lh-top: #253f60; --lh-bot: #14233a; --lh-arc: #627b9b; }
html[data-theme="light"] .btn--primary {
  --btn-bg: #14233a;
  --btn-fg: #ffffff;
  --btn-bd: #14233a;
}
html[data-theme="light"] .btn--primary:hover { --btn-bg: #233f61; --btn-bd: #233f61; }
html[data-theme="light"] .btn--primary::after {
  background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.24) 50%, transparent 70%);
}
html[data-theme="light"] .btn--quiet { color: var(--text-2); }
html[data-theme="light"] .surface {
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(255,255,255,0) 70%), var(--navy-2);
}
html[data-theme="light"] .nav__link:hover,
html[data-theme="light"] .nav__link[aria-expanded="true"] { background: rgba(36,87,128,.07); }
html[data-theme="light"] .site-header.is-compact {
  background: rgba(249,251,254,.91);
  box-shadow: 0 12px 34px -22px rgba(26,51,78,.22);
}
html[data-theme="light"] .menu-toggle { background: rgba(255,255,255,.67); }
html[data-theme="light"] .menu-toggle:hover { background: #e5edf7; border-color: var(--lumen); }
html[data-theme="light"] .mega__panel {
  background: linear-gradient(145deg, rgba(255,255,255,.99), rgba(242,247,252,.99));
  border-color: var(--line-2);
}
html[data-theme="light"] .svc-link:hover,
html[data-theme="light"] .mega__groups .svc-link:hover,
html[data-theme="light"] .mega__groups .svc-link:focus-visible { background: rgba(36,87,128,.065); }
html[data-theme="light"] .svc-link__icon { background: #e9f0f8; }
html[data-theme="light"] .mega__panel { scrollbar-color: rgba(44,81,118,.34) transparent; }
html[data-theme="light"] .mobile-menu {
  background: radial-gradient(65% 65% at 8% 0%, rgba(203,220,240,.68), transparent 77%),
    linear-gradient(155deg, #ffffff 0%, #f4f8fd 70%, #eaf1f9 100%);
}
html[data-theme="light"] .mobile-menu__body { scrollbar-color: rgba(44,81,118,.3) transparent; }
html[data-theme="light"] .mobile-menu__body::-webkit-scrollbar-thumb,
html[data-theme="light"] .mega__panel::-webkit-scrollbar-thumb { background: rgba(44,81,118,.3); }
html[data-theme="light"] .mobile-menu__nav a:hover,
html[data-theme="light"] .mobile-menu__nav a:focus-visible { background: rgba(36,87,128,.065); }
html[data-theme="light"] .mobile-menu__services .svc-link { background: rgba(36,87,128,.025); }
html[data-theme="light"] .mobile-menu__foot { background: rgba(237,244,251,.72); }
html[data-theme="light"] .svc-dialog::backdrop { background: rgba(14,27,43,.43); }
html[data-theme="light"] .svc-panel__emblem {
  background: radial-gradient(circle at 50% 25%, #f5f9ff, #dce8f5);
}
html[data-theme="light"] .svc-panel__meta div { background: #fff; }
html[data-theme="light"] .svc-panel__close { background: #e9eff7; }
html[data-theme="light"] .site-footer { background: #eaf0f7; }

/* Hero: retain original grid artwork and animated astronomy illustration. */
html[data-theme="light"] .hero__light {
  background:
    radial-gradient(64% 74% at 82% 32%, rgba(117,158,202,.19), transparent 64%),
    radial-gradient(58% 80% at 4% 0%, rgba(194,212,234,.53), transparent 66%),
    linear-gradient(135deg, #e6eef8 0%, #f4f8fc 54%, #ffffff 100%);
}
html[data-theme="light"] .hero__grid-lines {
  background-image: linear-gradient(rgba(32,65,105,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(32,65,105,.07) 1px, transparent 1px);
}
html[data-theme="light"] .hero__brand {
  background: linear-gradient(180deg, #12253f 14%, #284767 58%, #56728f 100%);
  -webkit-background-clip: text;
  background-clip: text;
}
html[data-theme="light"] .slide {
  background: radial-gradient(80% 115% at 100% 0%, rgba(143,184,227,.23), transparent 60%),
    linear-gradient(160deg, #ffffff, #eaf2fa 93%);
}
html[data-theme="light"] .stage {
  background: repeating-radial-gradient(circle at 50% 50%, transparent 0 46px,
    rgba(52,87,124,.07) 46px 47px),
    radial-gradient(circle at 50% 45%, rgba(170,197,226,.22), transparent 61%), #f7faff;
}
html[data-theme="light"] .eco-mini__core { background: radial-gradient(circle at 50% 35%, #e0ecf7, #f8fbff); }
html[data-theme="light"] .eco-mini__ring { border-color: rgba(45,86,129,.25); }
html[data-theme="light"] .eco-mini__node { background: #fff; }
html[data-theme="light"] .eco-mini__spoke {
  background: linear-gradient(90deg, rgba(45,86,129,.45), rgba(45,86,129,.05));
}
html[data-theme="light"] .mock,
html[data-theme="light"] .mockup,
html[data-theme="light"] .mini-test { color: var(--text); }
html[data-theme="light"] .mock { background: linear-gradient(180deg, #fafdff, #e4edf7); }
html[data-theme="light"] .mock__q i:first-child { background: rgba(41,80,122,.25); }
html[data-theme="light"] .paper__h { background: rgba(41,80,122,.38); }
html[data-theme="light"] .paper__l { background: rgba(41,80,122,.15); }

/* Ecosystem, AI and examples: never put dark text on the old dark backdrops. */
html[data-theme="light"] .eco__core {
  background: radial-gradient(circle at 50% 30%, #e2edf7, #fbfdff 75%);
}
html[data-theme="light"] .eco__spoke { stroke: #4b719a; stroke-opacity: .35; }
html[data-theme="light"] .eco__spoke.is-on { stroke: #245780; stroke-opacity: .85; }
html[data-theme="light"] .eco__pulse { fill: #245780; }
html[data-theme="light"] .eco-tab { background: rgba(255,255,255,.96); }
html[data-theme="light"] .eco-tab[aria-selected="true"] {
  border-color: rgba(36,87,128,.58);
  background: #eaf3fc;
  box-shadow: 0 0 0 5px rgba(36,87,128,.065), 0 20px 40px -22px rgba(24,54,84,.25);
}
html[data-theme="light"] .eco-svc li { background: rgba(248,251,255,.92); }
html[data-theme="light"] .eco-svc__icon,
html[data-theme="light"] .interactive__icon,
html[data-theme="light"] .k-card__icon,
html[data-theme="light"] .finder__icon { background: #e3ecf6; color: #245780; }
html[data-theme="light"] .ai {
  background: linear-gradient(180deg, #f5f8fc, #e7eff8 25%, #edf4fa 75%, #f5f8fc);
}
html[data-theme="light"] .ai__glow {
  background: radial-gradient(circle, rgba(111,157,202,.19), transparent 62%);
}
html[data-theme="light"] .research {
  background: linear-gradient(180deg, #ffffff, #f0f6fc);
  box-shadow: var(--shadow-2);
}
html[data-theme="light"] .research__q { background: #eaf1f9; }
html[data-theme="light"] .research__answer i {
  background: linear-gradient(90deg, rgba(54,94,135,.20), rgba(54,94,135,.08));
}
html[data-theme="light"] .research__steps li.is-done .research__state { box-shadow: 0 0 9px rgba(36,87,128,.22); }
html[data-theme="light"] .process,
html[data-theme="light"] .sources-box { background: rgba(255,255,255,.78); }
html[data-theme="light"] .quiz__a { background: #f7fafe; }
html[data-theme="light"] .quiz__a:hover:not(:disabled) { background: #edf4fb; border-color: #8ca6c1; }
html[data-theme="light"] .quiz__a.is-correct {
  background: #ebf7f1; border-color: #85bea5;
}
html[data-theme="light"] .quiz__a.is-wrong { background: #fff0f0; border-color: #d2a5a5; }
html[data-theme="light"] .quiz__a.is-wrong b { color: #a14b4b; border-color: #a14b4b; }
html[data-theme="light"] .demo-tests__list a { background: #fff; }
html[data-theme="light"] .arena-card__visual {
  background: repeating-radial-gradient(circle at 50% 46%, transparent 0 52px,
    rgba(46,91,135,.07) 52px 53px),
    radial-gradient(circle at 50% 40%, rgba(132,176,217,.14), transparent 60%), #f4f8fc;
}
html[data-theme="light"] .finder { background: #fff; box-shadow: var(--shadow-2); }
html[data-theme="light"] .news-feature__media {
  background: repeating-linear-gradient(135deg, rgba(42,82,122,.055) 0 1px, transparent 1px 14px),
    radial-gradient(circle at 70% 30%, rgba(154,188,223,.25), transparent 60%),
    linear-gradient(160deg, #e9f1fa, #bfcfe1);
}
html[data-theme="light"] .news-item:hover { background: #eaf1f9; }
html[data-theme="light"] .join__panel {
  background: radial-gradient(60% 120% at 100% 50%, rgba(106,160,212,.15), transparent 60%),
    linear-gradient(140deg, #ffffff, #e6eff8);
}
html[data-theme="light"] .join__lines {
  background: repeating-radial-gradient(circle at 105% 50%, transparent 0 46px,
    rgba(43,85,126,.065) 46px 47px);
}
html[data-theme="light"] .universe {
  background: radial-gradient(70% 60% at 50% 55%, rgba(188,211,233,.45), transparent 70%), #e8f0f8;
}
html[data-theme="light"] .universe__layer--far,
html[data-theme="light"] .universe__layer--near { opacity: .33; }
html[data-theme="light"] .u-item::after {
  background: linear-gradient(90deg, rgba(36,87,128,.42), rgba(36,87,128,.07));
}
html[data-theme="light"] .u-node__orb {
  background: radial-gradient(circle at 50% 30%, #ffffff, #dde9f5 75%);
  box-shadow: inset 0 1px 0 #fff, 0 18px 40px -24px rgba(25,57,88,.25);
}
html[data-theme="light"] .u-item:hover .u-node__orb,
html[data-theme="light"] .u-node:focus-visible .u-node__orb {
  box-shadow: 0 0 0 6px rgba(36,87,128,.06), 0 24px 60px -24px rgba(25,57,88,.25);
}

/* Auth demo is the same UI in both palettes; only its surfaces change. */
html[data-theme="light"] .auth-side {
  background: radial-gradient(70% 60% at 75% 45%, rgba(142,183,220,.23), transparent 66%),
    linear-gradient(170deg, #e4edf8, #f8fbff);
}
html[data-theme="light"] .field__error { color: #9b3f48; }
html[data-theme="light"] .input::placeholder { color: #65788a; }
html[data-theme="light"] .check input { background: #f5f8fc; }
html[data-theme="light"] .check input:checked { background: #14233a; border-color: #14233a; }
html[data-theme="light"] .check input:checked::after { border-color: #fff; }
html[data-theme="light"] .auth-result { background: #edf4fa; }
@media (max-width: 979px) {
  html[data-theme="light"] .auth-main {
    background: radial-gradient(80% 50% at 50% 0%, rgba(164,199,230,.26), transparent 64%),
      linear-gradient(180deg, #e8f0f9 0%, #f6f9fc 53%);
  }
}

/* Service icons' light pastel accents were calibrated for navy. Keep the
   same SVGs/animations, but use strong, uniform navy contrast on pale UI. */
html[data-theme="light"] .emblem { color: #29587f; }
html[data-theme="light"] .emblem .em-bg { fill: #f0f5fb; }
html[data-theme="light"] .emblem .em-dim { opacity: .55; }
html[data-theme="light"] .svc-panel__emblem .emblem,
html[data-theme="light"] .eco-tab__icon .emblem,
html[data-theme="light"] .eco-svc__icon .emblem,
html[data-theme="light"] .u-node__orb .emblem { color: #29587f; }
html[data-theme="light"] .svc-panel__features svg { color: #285b82; }

/* Miniature panels and practice visuals follow the same day palette. */
html[data-theme="light"] .mock i,
html[data-theme="light"] .mock__q i,
html[data-theme="light"] .mock__answers i,
html[data-theme="light"] .mock__foot i { background: rgba(41,80,122,.17); }
html[data-theme="light"] .mock__sources span,
html[data-theme="light"] .source { background: rgba(226,237,248,.85); }
html[data-theme="light"] .duel-mini__avatar,
html[data-theme="light"] .duel-arena__avatar {
  background: radial-gradient(circle at 50% 30%, #e1edf8, #f7faff);
  color: #284c70;
}
html[data-theme="light"] .eco-mini__ring,
html[data-theme="light"] .mock__answers li.is-pick { border-color: rgba(42,109,84,.4); }

/* ==========================================================================
   LAWHUB 1.3 — Daylight illustration legibility / editorial refinement
   Existing dark mode, JS, SVG drawing and timings are untouched.
   ========================================================================== */

/* Serious legal-institution typography rather than a decorative hairline face. */
.hero__eyebrow {
  font-family: var(--f-body);
  font-weight: 550;
  letter-spacing: 0.115em;
}
.hero__brand { text-wrap: nowrap; }
.brand__name { letter-spacing: .095em; }

html[data-theme="light"] {
  --text-3: #4f647b;
  --line: rgba(35, 65, 96, .17);
  --line-2: rgba(35, 65, 96, .29);
  --shadow-1: 0 7px 24px -18px rgba(21, 49, 80, .17);
  --shadow-2: 0 18px 45px -32px rgba(21, 49, 80, .22);
  --shadow-3: 0 24px 58px -36px rgba(21, 49, 80, .24);
}

/* 1 — Professional network: restore graphic hierarchy on a pale surface.
   SVG <g> carries inline presentation attributes; these CSS declarations
   intentionally provide stronger light-palette contrast without touching motion. */

/* 2 — Duel and tournament: identical frame dimensions, aligned content,
   softer dimensional accents (never gray-to-black podium shadows). */
html[data-theme="light"] .arena-card {
  background: #ffffff;
  border-color: rgba(60,88,120,.22);
  box-shadow: 0 12px 36px -28px rgba(19,47,78,.30);
}
html[data-theme="light"] .arena-card__visual {
  border-bottom-color: rgba(60,88,120,.18);
  background:
    repeating-radial-gradient(circle at 50% 46%, transparent 0 52px,
      rgba(62,99,135,.095) 52px 53px),
    radial-gradient(circle at 50% 43%, rgba(199,221,241,.46), transparent 64%),
    linear-gradient(180deg, #f7fbff, #edf4fa);
}
html[data-theme="light"] .arena-card__body { background: #ffffff; }
html[data-theme="light"] .podium__block {
  background: linear-gradient(180deg, #f4f8fd 0%, #dae7f4 100%);
  border-color: #a2b7cb;
  border-top-color: #829eba;
  color: #1e4165;
  box-shadow: 0 7px 18px -15px rgba(33,67,103,.22);
}
html[data-theme="light"] .p1 .podium__block {
  background: linear-gradient(180deg, #e5f0fa, #c1d4e8);
  border-color: #819dba;
  color: #142f4f;
}
html[data-theme="light"] .podium__seat { border-color: rgba(58,93,129,.42); }
html[data-theme="light"] .podium__star { color: #3f6e99; }
html[data-theme="light"] .cat-skeleton i { background: #d4e1ee; }
html[data-theme="light"] .cat-skeleton i:first-child { background: #b0c8e1; }
html[data-theme="light"] .duel-arena__emblem {
  box-shadow: 0 10px 24px -18px rgba(34,67,103,.23);
  border-color: #9fb6ce;
}
html[data-theme="light"] .duel-arena__beam path { stroke: #507ba6; stroke-opacity: .65; }
html[data-theme="light"] .duel-arena__beam circle { fill: #386a9a; }
html[data-theme="light"] .duel-score__bar { background: #d4e0ec; }

/* 3 — Day-mode hero: facade, route lines, labels and central identity need
   legible contrast; retain precisely the same moving shapes and animations. */
html[data-theme="light"] .hero__grid-lines {
  background-image:
    linear-gradient(rgba(38,77,117,.115) 1px, transparent 1px),
    linear-gradient(90deg, rgba(38,77,117,.115) 1px, transparent 1px);
}
html[data-theme="light"] .orrery #orFade stop:first-child { stop-color: #496f98; stop-opacity: .83; }
html[data-theme="light"] .orrery #orFade stop:last-child { stop-color: #7798b9; stop-opacity: .17; }
html[data-theme="light"] .orrery #orGlow stop:first-child { stop-color: #88add0; stop-opacity: .24; }
html[data-theme="light"] .orrery .orrery__facade { stroke-width: 1.25px; }
html[data-theme="light"] .orrery > g[stroke="#c2cdda"] {
  stroke: #6488af;
  stroke-opacity: .32;
}
html[data-theme="light"] .orrery__ring { stroke-opacity: .6; }
html[data-theme="light"] .orrery .o-link { stroke: #497ca9; stroke-width: 1.2; }
html[data-theme="light"] .orrery .o-node { fill: #ffffff; stroke: #396c9d; stroke-width: 1.6; }
html[data-theme="light"] .orrery .o-dot { fill: #396f9d; }
html[data-theme="light"] .orrery .o-label { fill: #35516d; font-weight: 500; }
html[data-theme="light"] .orrery .orrery__core circle:first-child {
  fill: #14233a;
  stroke: #769abd;
  stroke-opacity: .62;
  stroke-width: 1.4px;
}
html[data-theme="light"] .orrery .lh-mark--orrery {
  --lh-top: #ffffff;
  --lh-bot: #b6d5f2;
  --lh-arc: #e1effe;
  filter: drop-shadow(0 1px 2px rgba(4,14,30,.28));
}

/* 4 — Stable mobile proportions on all palettes. */
@media (max-width: 979px) {
  .arena-card { grid-template-rows: 335px minmax(0, 1fr); }
}
@media (max-width: 479px) {
  .arena-card { grid-template-rows: 280px minmax(0, 1fr); }
  .arena-card__visual { gap: 14px; padding: 20px 12px 39px; }
  .hero__brand { font-size: clamp(2.55rem, 10.5vw, 3.5rem); letter-spacing: .025em; margin-right: -.025em; }
  .brand__name { letter-spacing: .07em; }
}

/* Institutional navy lettering: no faded hairlines in daylight. */
html[data-theme="light"] .hero__brand {
  background: linear-gradient(180deg, #12253f 0%, #142b48 69%, #284867 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* ==========================================================================
   LAWHUB 1.4 — Day mode art direction & network slide correction
   Only light palette is changed; dark style, layouts, JS and motion are kept.
   ========================================================================== */

/* Portraits are daylight-only; dark-mode slide SVG is byte-for-byte familiar
   apart from these inert, non-displayed outlines. */
.net-mini__people { display: none; }

html[data-theme="light"] {
  --ink-0: #e3edf7;
  --ink-1: #f0f5fb;
  --navy-2: #fff;
  --surface: #e8f1fa;
  --surface-2: #dce8f6;
  --text: #172b46;
  --text-2: #405872;
  --text-3: #58728c;
  --line: rgba(39, 77, 117, .17);
  --line-2: rgba(39, 77, 117, .29);
  /* Layered cool-blue ambient shadow + fine contact edge. The earlier light
     palette cancelled nearly all visual elevation via negative spreads. */
  --shadow-1: 0 1px 0 rgba(255,255,255,.92) inset,
    0 2px 5px rgba(24,48,78,.075),
    0 12px 26px -12px rgba(24,48,78,.19);
  --shadow-2: 0 1px 0 rgba(255,255,255,.95) inset,
    0 5px 16px -8px rgba(22,51,83,.18),
    0 24px 60px -25px rgba(22,51,83,.31);
  --shadow-3: 0 3px 6px -3px rgba(19,42,70,.13),
    0 26px 70px -24px rgba(21,53,88,.29),
    0 50px 100px -55px rgba(26,72,117,.17);
}

html[data-theme="light"] body {
  background: linear-gradient(180deg, #f3f7fc 0%, #eef4fb 30%, #f8fbfe 70%, #edf4fb 100%);
}
html[data-theme="light"] .hero__light {
  background:
    radial-gradient(70% 90% at 87% 29%, rgba(111,159,206,.24), transparent 64%),
    radial-gradient(52% 60% at 2% 9%, rgba(176,204,235,.39), transparent 73%),
    linear-gradient(125deg, #e3eefb 0%, #f0f6fd 47%, #fafcff 100%);
}
html[data-theme="light"] .slide {
  background:
    radial-gradient(55% 70% at 98% 0%, rgba(157,195,229,.15), transparent 71%),
    linear-gradient(158deg, #fff 0%, #f3f8fd 63%, #eaf3fb 100%);
  border-color: rgba(39,77,117,.19);
  box-shadow: var(--shadow-2), 0 0 0 1px rgba(255,255,255,.80) inset;
}
html[data-theme="light"] .stage {
  border-color: rgba(68,107,146,.22);
  background:
    repeating-radial-gradient(circle at 50% 50%, transparent 0 46px,
      rgba(59,104,146,.17) 46px 47px),
    radial-gradient(circle at 50% 45%, rgba(189,215,241,.51), transparent 64%),
    linear-gradient(150deg, #f8fbff, #eaf2fb);
  box-shadow: inset 0 1px 3px rgba(52,87,129,.085),
    inset 0 2px 0 rgba(255,255,255,.9),
    0 12px 30px -21px rgba(23,51,83,.14);
}
/* Exact failing artwork: the hero carousel's compact professional network,
   not the separate full-sized network graphic later on the page. */
html[data-theme="light"] .net-mini > g:first-child {
  stroke: #5079a1;
  stroke-opacity: .86;
  stroke-width: 1.65;
}
html[data-theme="light"] .net-mini__l {
  stroke-dasharray: 5 6;
}
html[data-theme="light"] .net-mini__n circle:first-child {
  fill: #1b3554;
  stroke: #88acd0;
  stroke-opacity: 1;
  stroke-width: 1.35px;
  filter: drop-shadow(0 4px 7px rgba(17,46,80,.22));
}
html[data-theme="light"] .net-mini__n circle:not(:first-child) {
  fill: #fafcff;
  stroke: #668db5;
  stroke-width: 1.7px;
  stroke-opacity: 1;
  filter: drop-shadow(0 3px 5px rgba(28,68,106,.16));
}
html[data-theme="light"] .net-mini__people {
  display: block;
  stroke: #315e89;
  stroke-width: 1.65;
  opacity: .97;
}
html[data-theme="light"] .net-mini__p {
  fill: #3a82b7;
  filter: drop-shadow(0 0 3px rgba(52,118,177,.3));
}

/* Matching nighttime depth without dark, muddy gradients. A common set of
   elevated components share a cool ink shadow while smaller nested controls
   retain subtle contact shadows. */
html[data-theme="light"] .surface,
html[data-theme="light"] .lawyers__panel,
html[data-theme="light"] .finder,
html[data-theme="light"] .research,
html[data-theme="light"] .news-feature,
html[data-theme="light"] .join__panel {
  box-shadow: var(--shadow-2);
  border-color: rgba(44,84,124,.20);
}
html[data-theme="light"] .lawyers__panel {
  background:
    radial-gradient(60% 100% at 2% 95%, rgba(177,207,236,.24), transparent 72%),
    linear-gradient(145deg, #fff 0%, #eff6fe 100%);
}
html[data-theme="light"] .arena-card {
  background: #fff;
  border-color: rgba(53,92,129,.20);
  box-shadow: var(--shadow-2);
}
html[data-theme="light"] .arena-card__visual {
  background:
    repeating-radial-gradient(circle at 50% 46%, transparent 0 52px,
      rgba(58,106,150,.15) 52px 53px),
    radial-gradient(circle at 50% 35%, rgba(171,205,235,.4), transparent 66%),
    linear-gradient(145deg, #f7fbff, #eaf3fc);
}
html[data-theme="light"] .eco-tab,
html[data-theme="light"] .svc-panel__emblem,
html[data-theme="light"] .u-node__orb {
  box-shadow: var(--shadow-1);
}
html[data-theme="light"] .eco-tab[aria-selected="true"],
html[data-theme="light"] .u-item:hover .u-node__orb,
html[data-theme="light"] .u-node:focus-visible .u-node__orb {
  box-shadow: 0 0 0 5px rgba(47,101,153,.09), var(--shadow-2);
}
html[data-theme="light"] .news-item:hover,
html[data-theme="light"] .demo-tests__list a:hover {
  box-shadow: var(--shadow-1);
  border-color: rgba(44,89,133,.25);
}
html[data-theme="light"] .btn--primary {
  box-shadow: 0 5px 12px -7px rgba(12,33,59,.28),
              0 12px 22px -14px rgba(12,33,59,.23);
}
html[data-theme="light"] .site-header.is-compact {
  box-shadow: 0 1px 0 rgba(255,255,255,.93) inset,
    0 10px 28px -18px rgba(24,48,77,.24);
}
@media (prefers-reduced-motion: reduce) {
  html[data-theme="light"] .net-mini__l { animation: none; }
}

/* LAWHUB 1.5 — quiet daylight finish; retains the established two-mode layout. */
html[data-theme="light"] .brand__slogan { color: #48647f; }
html[data-theme="light"] .hero__eyebrow { color: #425e7d; }
html[data-theme="light"] .slide__text,
html[data-theme="light"] .lead { color: #435a72; }
html[data-theme="light"] .slide,
html[data-theme="light"] .arena-card,
html[data-theme="light"] .lawyers__panel,
html[data-theme="light"] .news-feature {
  outline: 1px solid rgba(255,255,255,.60);
  outline-offset: -2px;
}
html[data-theme="light"] .slide:focus-within,
html[data-theme="light"] .arena-card:focus-within,
html[data-theme="light"] .lawyers__panel:focus-within {
  box-shadow: 0 0 0 3px rgba(40,93,145,.17), var(--shadow-2);
}

/* ========================================================================== 
   LAWHUB 1.6 — The daylight equivalent of the approved night atmosphere
   Calm institutional blue, optically lighter fine art, and real layered depth.
   ALL rules scope to light theme; no markup, behavior or animation durations change.
   ========================================================================== */
html[data-theme="light"] {
  --ink-0: #eaf0f8;
  --ink-1: #f3f7fc;
  --surface: #f1f6fc;
  --surface-2: #e7f0f9;
  --line: rgba(50,80,114,.135);
  --line-2: rgba(50,80,114,.23);
  --shadow-1: 0 1px 0 rgba(255,255,255,.92) inset,
    0 2px 5px -2px rgba(24,49,81,.10),
    0 14px 29px -17px rgba(23,57,93,.23);
  --shadow-2: 0 1px 0 rgba(255,255,255,.94) inset,
    0 3px 7px -4px rgba(19,43,71,.11),
    0 18px 42px -20px rgba(26,59,94,.22),
    0 42px 82px -42px rgba(56,99,148,.18);
  --shadow-3: 0 1px 0 rgba(255,255,255,.86) inset,
    0 5px 12px -8px rgba(19,43,71,.20),
    0 27px 66px -29px rgba(25,54,90,.29),
    0 56px 105px -51px rgba(55,94,139,.21);
}
html[data-theme="light"] body {
  background: linear-gradient(180deg, #f4f7fb 0%, #f0f5fb 46%, #f9fbfe 76%, #edf3f9 100%);
}

/* The hero mirrors the evening lighting direction in reverse: a diffuse
   upper-left daylight source and soft cobalt falloff, not a stark white wash. */
html[data-theme="light"] .hero__light {
  background:
    radial-gradient(75% 95% at 82% 42%, rgba(105,144,188,.185), transparent 66%),
    radial-gradient(60% 76% at 12% 5%, rgba(181,203,231,.37), transparent 71%),
    radial-gradient(90% 52% at 50% 100%, rgba(98,135,177,.095), transparent 82%),
    linear-gradient(128deg, #e8f0fa 0%, #f6f9fd 48%, #edf4fa 100%);
}
html[data-theme="light"] .hero__grid-lines {
  background-image:
    linear-gradient(rgba(50,84,124,.065) 1px, transparent 1px),
    linear-gradient(90deg, rgba(50,84,124,.065) 1px, transparent 1px);
}

/* Architectural drawing: retain the exact paths and animated positions.
   Night mode has foreground/back depth from live SVG opacity values; the
   earlier daylight override made all six connectors equally strong. */
html[data-theme="light"] .orrery #orFade stop:first-child {
  stop-color: #56779c;
  stop-opacity: .53;
}
html[data-theme="light"] .orrery #orFade stop:last-child {
  stop-color: #86a3c0;
  stop-opacity: .065;
}
html[data-theme="light"] .orrery #orGlow stop:first-child {
  stop-color: #a5c2e0;
  stop-opacity: .22;
}
html[data-theme="light"] .orrery .orrery__facade {
  stroke-width: 1.05px;
  opacity: .76;
}
html[data-theme="light"] .orrery > g[stroke="#c2cdda"] {
  stroke: #7093b7;
  stroke-opacity: .24;
}
html[data-theme="light"] .orrery .orrery__ring { stroke-opacity: .39; }
html[data-theme="light"] .orrery .o-link {
  stroke: #4b739a;
  stroke-width: 1.02px;
  /* JS controls each connector's opacity according to its orbital depth. */
}
html[data-theme="light"] .orrery .o-node {
  fill: #f9fcff;
  stroke: #5982a9;
  stroke-width: 1.55px;
  filter: drop-shadow(0 1.5px 2px rgba(34,64,99,.17));
}
html[data-theme="light"] .orrery .o-dot { fill: #4b79a5; }
html[data-theme="light"] .orrery .o-label {
  fill: #4a637f;
  font-weight: 500;
}
html[data-theme="light"] .orrery .orrery__core circle:first-child {
  fill: #14233a;
  stroke: #8ea8c5;
  stroke-opacity: .56;
  filter: drop-shadow(0 4px 7px rgba(23,48,78,.17))
          drop-shadow(0 15px 17px rgba(27,65,111,.13));
}
html[data-theme="light"] .orrery .orrery__core circle:nth-child(2) {
  stroke: #7799ba;
  stroke-opacity: .22;
}
html[data-theme="light"] .orrery .lh-mark--orrery {
  filter: drop-shadow(0 1px 2px rgba(1,10,24,.25));
}

/* The daytime universe needs its own layered atmosphere rather than dark
   mode's shadow translated into uniform pale blue. No extra bitmap assets. */
html[data-theme="light"] .universe {
  background:
    radial-gradient(ellipse 62% 78% at 50% 52%, rgba(170,199,229,.34), transparent 76%),
    radial-gradient(ellipse 49% 80% at 4% 52%, rgba(117,160,205,.15), transparent 85%),
    radial-gradient(ellipse 45% 75% at 96% 52%, rgba(125,164,209,.15), transparent 86%),
    linear-gradient(180deg, #f4f8fd 0%, #eaf2fa 49%, #f5f9fe 100%);
  border-top-color: rgba(63,98,137,.13);
}
html[data-theme="light"] .universe__layer--far {
  background-image:
    radial-gradient(1px 1px at 20px 30px, rgba(61,98,139,.30), transparent 65%),
    radial-gradient(1px 1px at 140px 90px, rgba(61,98,139,.24), transparent 65%),
    radial-gradient(1px 1px at 80px 160px, rgba(61,98,139,.20), transparent 65%),
    radial-gradient(1px 1px at 190px 200px, rgba(61,98,139,.25), transparent 65%);
  opacity: .46;
}
html[data-theme="light"] .universe__layer--near {
  background-image:
    radial-gradient(1.5px 1.5px at 60px 80px, rgba(71,109,152,.27), transparent 65%),
    radial-gradient(1.2px 1.2px at 300px 240px, rgba(71,109,152,.18), transparent 65%);
  opacity: .43;
}
html[data-theme="light"] .universe__orbits ellipse {
  stroke: #5e86ae;
  stroke-opacity: .13;
}
html[data-theme="light"] .universe__spin { stroke-opacity: .11; }
html[data-theme="light"] .universe__wave path { stroke: #668fb6; stroke-opacity: .24; }
html[data-theme="light"] .universe__wave circle { fill: #487eaf; }
html[data-theme="light"] .u-item::after {
  background: linear-gradient(90deg,
    rgba(64,102,143,.28), rgba(100,137,174,.20) 62%, rgba(64,102,143,.10));
}
html[data-theme="light"] .u-item:hover::after,
html[data-theme="light"] .u-item:focus-within::after,
html[data-theme="light"] .u-item:has(+ .u-item:hover)::after,
html[data-theme="light"] .u-item:has(+ .u-item:focus-within)::after {
  background: linear-gradient(90deg, rgba(50,91,134,.50), rgba(76,117,157,.27));
  box-shadow: 0 0 10px rgba(76,119,168,.16);
}
html[data-theme="light"] .u-node__orb {
  border-color: rgba(83,119,155,.30);
  background:
    radial-gradient(circle at 35% 22%, rgba(255,255,255,.98), rgba(255,255,255,0) 51%),
    radial-gradient(circle at 67% 85%, rgba(153,186,221,.28), transparent 71%),
    linear-gradient(151deg, #fafdff 0%, #e8f2fb 58%, #dceaf7 100%);
  box-shadow:
    inset 0 2px 2px rgba(255,255,255,.95),
    inset 0 -10px 24px -15px rgba(62,104,148,.28),
    0 2px 3px -2px rgba(25,51,84,.16),
    0 14px 30px -14px rgba(24,58,96,.23),
    0 36px 58px -31px rgba(46,99,152,.19);
}
html[data-theme="light"] .u-node__orb::before {
  border-color: rgba(75,114,153,.23);
}
html[data-theme="light"] .u-node__orb::after {
  background: radial-gradient(circle, rgba(105,154,202,.24), transparent 68%);
}
html[data-theme="light"] .u-node__orb .emblem { color: #315d86; }
html[data-theme="light"] .u-node__status {
  border-color: #f5f9ff;
  box-shadow: 0 1px 5px rgba(24,51,83,.18);
}
html[data-theme="light"] .u-node__name {
  color: #19304d;
  font-weight: 600;
  text-shadow: 0 1px 0 rgba(255,255,255,.72);
}
html[data-theme="light"] .u-node__desc {
  color: #566c84;
}
html[data-theme="light"] .u-item:hover .u-node__orb,
html[data-theme="light"] .u-node:focus-visible .u-node__orb {
  border-color: rgba(54,104,156,.54);
  box-shadow:
    inset 0 2px 2px rgba(255,255,255,.98),
    inset 0 -11px 24px -14px rgba(58,99,141,.24),
    0 0 0 6px rgba(99,146,193,.07),
    0 16px 32px -13px rgba(24,55,89,.25),
    0 43px 70px -30px rgba(40,94,151,.28);
}

/* Maintain the same hierarchy, spacing and shadow direction on cards.
   Large daylight surfaces get a thin lit rim and two blue-gray depth layers. */
html[data-theme="light"] .slide,
html[data-theme="light"] .arena-card,
html[data-theme="light"] .lawyers__panel,
html[data-theme="light"] .finder,
html[data-theme="light"] .research,
html[data-theme="light"] .news-feature,
html[data-theme="light"] .join__panel {
  border-color: rgba(76,114,154,.19);
  box-shadow: var(--shadow-2), 0 1px 0 rgba(255,255,255,.77) inset;
}
html[data-theme="light"] .slide {
  background:
    radial-gradient(75% 88% at 100% 0%, rgba(158,190,221,.17), transparent 74%),
    linear-gradient(152deg, #fff 4%, #f8fbff 55%, #edf5fc 100%);
}
html[data-theme="light"] .arena-card__visual {
  background:
    repeating-radial-gradient(circle at 50% 46%, transparent 0 52px, rgba(66,105,147,.10) 52px 53px),
    radial-gradient(circle at 50% 39%, rgba(162,196,229,.26), transparent 66%),
    linear-gradient(151deg, #fafdff, #edf5fc);
}
html[data-theme="light"] .site-header.is-compact {
  box-shadow: 0 1px 0 rgba(255,255,255,.85) inset,
    0 5px 9px -7px rgba(29,59,96,.13),
    0 20px 42px -27px rgba(36,75,119,.23);
}
/* Night illustration, geometry, typography, motion, and service logic are unmodified. */

/* 1.6 design restored. Keep desktop navigation in one consistent row. */
@media (min-width: 1280px) {
  .site-header__bar {
    column-gap: clamp(8px, .8vw, 16px);
  }
  .site-header__bar > .theme-toggle { margin-left: 0; }
  .site-header__bar > .brand { flex: 0 0 auto; }
  .site-header__bar > .nav { flex: 1 1 auto; min-width: 0; }
  .nav__list {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    gap: 0;
  }
  .nav__list > li { flex: 0 0 auto; }
  .nav__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    flex-wrap: nowrap;
    line-height: 1.25;
    min-height: 44px;
    font-size: clamp(12px, .86vw, 14px);
    padding-inline: clamp(7px, .8vw, 13px);
  }
  .nav__link svg { flex: 0 0 12px; }
  .header-actions { flex: 0 0 auto; gap: 5px; }
  .header-actions .btn { white-space: nowrap; padding-inline: 10px; }
  .site-header__bar > .theme-toggle { flex-shrink: 0; }
}
/* On compact notebook widths prefer a tidy menu, never a wrapped header. */
@media (min-width: 1080px) and (max-width: 1279px) {
  .site-header__bar { gap: 10px; }
  .site-header__bar > .nav,
  .site-header__bar > .header-actions,
  .site-header__bar > .mega { display: none; }
  .site-header__bar > .theme-toggle { margin-left: auto; }
  .site-header__bar > .menu-toggle { display: inline-grid; flex-shrink: 0; }
}