/* ==========================================================================
   SLB BLUE & WHITE THEME
   --------------------------------------------------------------------------
   The approved SLB-inspired look: deep navy sidebar, SLB blue for the active
   item and primary actions, white cards on a light-blue canvas, green / amber
   / red kept for operational status only.

   Colours come from the palette tokens in app.css (--slb-*). This file only
   decides where they go. Everything here is scoped to the light theme, so the
   dark theme (still available from the theme toggle) is untouched, and it is
   loaded after every other stylesheet so it wins without !important.

   Visual only: no content, data, layout of information or behaviour changes.
   ========================================================================== */

/* -------------------------------------------------------- 1. Dashboard ---
   The Command Center used to force the night palette on itself whatever the
   theme. In the light theme it now uses the same SLB tokens as every page. */
[data-theme="light"] .route-dashboard .app-body {
  --bg-canvas: var(--slb-light-bg);
  --bg-surface: var(--slb-white);
  --bg-surface-raised: var(--slb-white);
  --bg-subtle: var(--slb-surface-subtle);
  --bg-inset: var(--slb-surface-inset);
  --bg-hover: var(--slb-light-bg);
  --bg-selected: var(--slb-selected);
  --text-primary: var(--slb-text);
  --text-secondary: var(--slb-text-secondary);
  --text-muted: var(--slb-text-secondary);
  --text-inverse: var(--slb-white);
  --text-link: var(--slb-primary-ink);
  --border: var(--slb-border);
  --border-strong: var(--slb-border-strong);
  --border-focus: var(--slb-primary);
  --accent: var(--slb-primary);
  --accent-hover: var(--slb-primary-hover);
  --accent-soft: var(--slb-primary-soft);
  --accent-text: var(--slb-white);
  --success: var(--slb-success);
  --success-soft: var(--slb-success-soft);
  --success-text: var(--slb-success-ink);
  --warning: var(--slb-warning);
  --warning-soft: var(--slb-warning-soft);
  --warning-text: var(--slb-warning-ink);
  --danger: var(--slb-critical);
  --danger-soft: var(--slb-critical-soft);
  --danger-text: var(--slb-critical-ink);
  --info: var(--slb-primary);
  --info-soft: var(--slb-primary-soft);
  --info-text: var(--slb-primary-ink);
  --neutral: var(--slb-text-secondary);
  --neutral-soft: var(--slb-navy-soft);
  --neutral-text: #3E5162;
  --skeleton-base: var(--slb-surface-inset);
  --skeleton-shine: var(--slb-surface-subtle);
  --overlay: rgba(0, 26, 102, 0.42);
  --shadow-sm: 0 1px 2px rgba(0, 26, 102, 0.06), 0 1px 3px rgba(0, 26, 102, 0.04);
  --shadow-md: 0 4px 14px rgba(0, 26, 102, 0.08);
  --shadow-lg: 0 18px 44px rgba(0, 26, 102, 0.16);
  color-scheme: light;
  color: var(--text-primary);
  background: var(--slb-light-bg);
}
[data-theme="light"] .route-dashboard .cc { --cc-card: var(--slb-white); --cc-card-2: var(--slb-surface-subtle); }
[data-theme="light"] .cc-ambient { display: none; }

/* The digital twin was drawn for a night sky: it keeps one, as a navy banner. */
[data-theme="light"] .cc-hero {
  border-radius: var(--radius-lg);
  background:
    radial-gradient(circle at 78% 0%, rgba(5, 0, 255, 0.30), transparent 42%),
    linear-gradient(120deg, var(--slb-navy) 0%, #0418E6 62%, #0500FF 100%);
  box-shadow: var(--shadow-md);
  margin-bottom: 12px;
  --text-primary: var(--slb-white);
  --text-secondary: rgba(255, 255, 255, 0.82);
  --text-muted: rgba(255, 255, 255, 0.72);
  color: var(--slb-white);
}
[data-theme="light"] .cc-hero .cc-head__identity { padding-left: 18px; }
[data-theme="light"] .cc-head__subtitle { color: rgba(255, 255, 255, 0.78); }
[data-theme="light"] .cc-hero .badge { background: rgba(255, 255, 255, 0.14); color: var(--slb-white); border-color: rgba(255, 255, 255, 0.28); }
[data-theme="light"] .cc-hero .badge--success { background: rgba(22, 132, 91, 0.32); border-color: rgba(120, 220, 170, 0.5); }
[data-theme="light"] .cc-hero a.cc-hero__cta {
  background: var(--slb-primary); border-color: var(--slb-primary);
  box-shadow: 0 6px 18px rgba(5, 0, 255, 0.35);
}
[data-theme="light"] .cc-hero__cta:hover { background: var(--slb-primary-hover); box-shadow: 0 8px 22px rgba(5, 0, 255, 0.42); }
[data-theme="light"] .telemetry { background: rgba(0, 20, 90, 0.78); border-color: rgba(5, 0, 255, 0.35); }

[data-theme="light"] .route-dashboard .cc .card,
[data-theme="light"] .route-dashboard .cc .mkpi,
[data-theme="light"] .route-dashboard .cc-filters {
  background: var(--slb-white);
  border-color: var(--slb-border);
  box-shadow: var(--shadow-sm);
}
[data-theme="light"] .route-dashboard .cc .card::after,
[data-theme="light"] .route-dashboard .cc .mkpi::after { background: radial-gradient(400px circle at var(--spot-x, 50%) var(--spot-y, 50%), rgba(5, 0, 255, 0.06), transparent 42%); }
[data-theme="light"] .route-dashboard .cc .card:hover { border-color: color-mix(in srgb, var(--slb-primary) 45%, var(--slb-border)); box-shadow: var(--shadow-md); }
[data-theme="light"] .route-dashboard .mkpi { border-color: var(--slb-border); border-top: 3px solid var(--tone, var(--slb-primary)); box-shadow: var(--shadow-sm); }
[data-theme="light"] .route-dashboard .mkpi:hover { border-color: color-mix(in srgb, var(--tone, var(--slb-primary)) 50%, var(--slb-border)); box-shadow: var(--shadow-md); }
[data-theme="light"] .route-dashboard .mkpi::before { opacity: 0.06; }
[data-theme="light"] .route-dashboard .cc-filter { border-right-color: var(--slb-border); }
[data-theme="light"] .route-dashboard .cc-filter select,
[data-theme="light"] .route-dashboard .cc-filter input[type="date"] { background: var(--slb-white); border-color: var(--slb-border); color: var(--slb-text); }
[data-theme="light"] .route-dashboard .cc-filter select:hover,
[data-theme="light"] .route-dashboard .cc-filter input:hover { border-color: var(--slb-primary); }
[data-theme="light"] .route-dashboard .cc-strip { border-color: var(--slb-border); box-shadow: var(--shadow-sm); }
[data-theme="light"] .route-dashboard .pipeline::before { background: linear-gradient(90deg, var(--slb-navy), var(--slb-primary)); box-shadow: none; }
[data-theme="light"] .route-dashboard .pipeline::after { background: var(--slb-primary); box-shadow: 0 0 6px rgba(5, 0, 255, 0.6); }
[data-theme="light"] .route-dashboard .pipeline__icon {
  background: var(--slb-white); border-color: var(--slb-border-strong); color: var(--slb-navy);
  box-shadow: 0 0 0 5px var(--slb-white);
}
[data-theme="light"] .route-dashboard .pipeline__stage:nth-child(5) .pipeline__icon,
[data-theme="light"] .route-dashboard .pipeline__stage:nth-child(6) .pipeline__icon { border-color: var(--slb-primary); color: var(--slb-primary-ink); box-shadow: 0 0 0 5px var(--slb-white); }
[data-theme="light"] .route-dashboard .pipeline__stage:nth-last-child(-n+2) .pipeline__icon { border-color: var(--slb-navy); color: var(--slb-navy); }
[data-theme="light"] .route-dashboard .who[data-work-profile]::after { background: var(--slb-navy); border-color: var(--slb-navy); color: var(--slb-white); box-shadow: var(--shadow-md); }
[data-theme="light"] .route-dashboard .data tbody tr:hover { background: var(--slb-light-bg); box-shadow: inset 2px 0 var(--slb-primary); }
[data-theme="light"] .route-dashboard .bar__value { filter: none; }
[data-theme="light"] .route-dashboard .health__gauge,
[data-theme="light"] .route-dashboard .gauge__value { filter: none; }
[data-theme="light"] .cc-intelligence-brief { background: var(--slb-primary-soft); border-color: color-mix(in srgb, var(--slb-primary) 30%, var(--slb-border)); }
[data-theme="light"] .cc-intelligence-brief > header span { color: var(--slb-primary-ink); }

/* ------------------------------------------------ 2. Sidebar and header --- */
[data-theme="light"] .sidebar {
  background: var(--slb-primary);
  border-right-color: rgba(0, 0, 0, 0.08);
  box-shadow: 2px 0 12px rgba(0, 26, 102, 0.12);
}
[data-theme="light"] .sidebar__brand { border-bottom-color: rgba(255, 255, 255, 0.12); }
[data-theme="light"] .nav-group__label { color: rgba(255, 255, 255, 0.62); opacity: 1; }
[data-theme="light"] .nav-item { border-radius: 8px; color: rgba(255, 255, 255, 0.86); }
[data-theme="light"] .nav-item .nav-item__icon { color: rgba(255, 255, 255, 0.86); }
[data-theme="light"] .nav-item:hover { background: rgba(255, 255, 255, 0.09); color: var(--slb-white); }
[data-theme="light"] .nav-item:hover .nav-item__icon { color: var(--slb-white); }
[data-theme="light"] .nav-item[aria-current="page"] {
  background: rgba(255, 255, 255, 0.20);
  border-color: rgba(255, 255, 255, 0.38);
  color: var(--slb-white);
  box-shadow: none;
}
[data-theme="light"] .nav-item[aria-current="page"] .nav-item__icon { color: var(--slb-white); }
[data-theme="light"] .nav-item[aria-current="page"]::before { display: none; }
[data-theme="light"] .nav-item:focus-visible { outline: 2px solid var(--slb-white); outline-offset: 1px; }
[data-theme="light"] .nav-item__count { background: var(--slb-critical); color: var(--slb-white); }
[data-theme="light"] .nav-item[aria-current="page"] .nav-item__count { background: var(--slb-white); color: var(--slb-critical-ink); }
[data-theme="light"] .sidebar__nav::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.22); }
[data-theme="light"] .sidebar__footer { border-top-color: rgba(255, 255, 255, 0.12); background: rgba(0, 0, 0, 0.10); }
[data-theme="light"] .sidebar .avatar { background: var(--slb-navy); color: var(--slb-white); }
[data-theme="light"] .app[data-sidebar="collapsed"] .nav-item:hover::after { background: var(--slb-navy); }
[data-theme="light"] .sidebar .icon-button { color: rgba(255, 255, 255, 0.8); }
[data-theme="light"] .sidebar .icon-button:hover { background: rgba(255, 255, 255, 0.1); color: var(--slb-white); }

[data-theme="light"] .topbar,
[data-theme="light"] .route-dashboard .topbar {
  background: var(--slb-white);
  border-bottom: 1px solid var(--slb-border);
  box-shadow: 0 1px 4px rgba(0, 26, 102, 0.06);
  backdrop-filter: none;
}
[data-theme="light"] .topbar__search-trigger,
[data-theme="light"] .topbar__search input {
  background: var(--slb-surface-subtle);
  border-color: var(--slb-border);
  color: var(--slb-text-secondary);
  border-radius: 8px;
}
[data-theme="light"] .topbar__search-trigger:hover,
[data-theme="light"] .topbar__search-trigger:focus-visible,
[data-theme="light"] .topbar__search input:focus {
  background: var(--slb-white);
  border-color: var(--slb-primary);
  box-shadow: 0 0 0 3px var(--slb-primary-soft);
}
[data-theme="light"] .topbar .icon-button { color: var(--slb-navy); }
[data-theme="light"] .topbar .icon-button:hover { background: var(--slb-light-bg); color: var(--slb-primary-ink); }
[data-theme="light"] .topbar .avatar { background: var(--slb-navy); color: var(--slb-white); }
[data-theme="light"] .topbar__live { background: var(--slb-success-soft); border-color: color-mix(in srgb, var(--slb-success) 35%, transparent); color: var(--slb-success-ink); }
[data-theme="light"] .topbar__live i { background: var(--slb-success); box-shadow: 0 0 0 3px rgba(22, 132, 91, 0.15); }
[data-theme="light"] .topbar__live svg { filter: none; }

[data-theme="light"] body { background: var(--slb-light-bg); }
[data-theme="light"] .page-head__title { color: var(--slb-navy); }
[data-theme="light"] .breadcrumb a:hover { color: var(--slb-primary-ink); }
[data-theme="light"] .section-kicker { color: var(--slb-primary-ink); }

/* ------------------------------------------------ 3. Cards and panels --- */
[data-theme="light"] .card,
[data-theme="light"] .kpi {
  background: var(--slb-white);
  border-color: var(--slb-border);
  box-shadow: var(--shadow-sm);
}
[data-theme="light"] .card__head { border-bottom-color: var(--slb-border); }
[data-theme="light"] .card__title { color: var(--slb-navy); }
[data-theme="light"] .card__foot { background: var(--slb-surface-subtle); border-top-color: var(--slb-border); }
[data-theme="light"] .kpi__value { color: var(--slb-navy); }
[data-theme="light"] a.kpi:hover { border-color: var(--slb-primary); box-shadow: var(--shadow-md); }

/* Photo heroes: the photographs stay, under an SLB navy shade. */
[data-theme="light"] .monitor-hero { border-color: color-mix(in srgb, var(--slb-primary) 30%, transparent); }
[data-theme="light"] .monitor-hero__shade { background: linear-gradient(90deg, rgba(0, 26, 102, 0.96) 0%, rgba(0, 26, 102, 0.86) 40%, rgba(0, 26, 102, 0.30) 72%, rgba(0, 26, 102, 0.06) 100%); }
[data-theme="light"] .monitor-hero .eyebrow,
[data-theme="light"] .running-hero .eyebrow,
[data-theme="light"] .generator-hero .eyebrow,
[data-theme="light"] .company-detail-hero .eyebrow { color: #C7D4FF; }
[data-theme="light"] .running-hero { background: radial-gradient(circle at 80% 0, rgba(5, 0, 255, 0.35), transparent 34%), linear-gradient(120deg, var(--slb-navy), #0418E6); }
[data-theme="light"] .generator-hero { border-color: color-mix(in srgb, var(--slb-primary) 30%, transparent); background: radial-gradient(circle at 85% 10%, rgba(5, 0, 255, 0.38), transparent 30%), linear-gradient(120deg, var(--slb-navy), #0418E6 62%, #0500FF); }
[data-theme="light"] .company-detail-hero { background: linear-gradient(120deg, var(--slb-navy), #0418E6); }

/* Well 360: header banner and tabs. */
[data-theme="light"] .well360-hero { background: var(--slb-white); border-color: var(--slb-border); box-shadow: var(--shadow-sm); }
[data-theme="light"] .well360-hero > * { border-right-color: var(--slb-border); }
[data-theme="light"] .well360-score strong { color: var(--slb-navy); }
[data-theme="light"] .well360-tabs a.is-active { background: var(--slb-primary); color: var(--slb-white); border-color: var(--slb-primary); }
[data-theme="light"] .well360-tabs a:not(.is-active):hover { background: var(--slb-light-bg); color: var(--slb-primary-ink); }
[data-theme="light"] .well360-tabs a span { background: var(--slb-critical); }

/* ----------------------------------------------------------- 4. Buttons --- */
[data-theme="light"] .app .btn--primary,
[data-theme="light"] .auth .btn--primary,
[data-theme="light"] .btn--primary {
  background: var(--slb-primary);
  border-color: var(--slb-primary);
  color: var(--slb-white);
  font-weight: var(--weight-semibold);
  box-shadow: 0 2px 6px rgba(5, 0, 255, 0.25);
}
[data-theme="light"] .app .btn--primary:hover,
[data-theme="light"] .auth .btn--primary:hover,
[data-theme="light"] .btn--primary:hover {
  background: var(--slb-primary-hover);
  border-color: var(--slb-primary-hover);
  box-shadow: 0 4px 12px rgba(5, 0, 255, 0.32);
}
[data-theme="light"] .btn--secondary {
  background: var(--slb-white);
  border-color: color-mix(in srgb, var(--slb-primary) 45%, var(--slb-border));
  color: var(--slb-primary-ink);
}
[data-theme="light"] .btn--secondary:hover { background: var(--slb-primary-soft); border-color: var(--slb-primary); color: var(--slb-primary-ink); }
[data-theme="light"] .btn--ghost { color: var(--slb-text-secondary); }
[data-theme="light"] .btn--ghost:hover { background: var(--slb-light-bg); color: var(--slb-primary-ink); }
[data-theme="light"] .btn--danger { background: var(--slb-critical); border-color: var(--slb-critical); }
[data-theme="light"] .btn--success { background: var(--slb-success); border-color: var(--slb-success); }
[data-theme="light"] .btn--warning { background: var(--slb-warning); border-color: var(--slb-warning); color: var(--slb-white); }
[data-theme="light"] .btn[disabled],
[data-theme="light"] .btn[aria-disabled="true"],
[data-theme="light"] .btn:disabled {
  opacity: 1;
  background: var(--slb-surface-inset);
  border-color: var(--slb-border);
  color: #8A99A8;
  box-shadow: none;
}
[data-theme="light"] .btn:focus-visible,
[data-theme="light"] .icon-button:focus-visible { outline: 2px solid var(--slb-primary); outline-offset: 2px; }
[data-theme="light"] .app .icon-button:hover { box-shadow: none; }

/* ------------------------------------------------------------- 5. Forms --- */
[data-theme="light"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
[data-theme="light"] select,
[data-theme="light"] textarea {
  background-color: var(--slb-white);
  border-color: var(--slb-border);
  color: var(--slb-text);
}
[data-theme="light"] input:focus,
[data-theme="light"] select:focus,
[data-theme="light"] textarea:focus {
  border-color: var(--slb-primary);
  box-shadow: 0 0 0 3px var(--slb-primary-soft);
  outline: none;
}
[data-theme="light"] input[readonly],
[data-theme="light"] input[disabled],
[data-theme="light"] select[disabled],
[data-theme="light"] textarea[disabled] { background-color: var(--slb-surface-inset); color: var(--slb-text-secondary); }
[data-theme="light"] input[type="checkbox"],
[data-theme="light"] input[type="radio"],
[data-theme="light"] input[type="range"] { accent-color: var(--slb-primary); }
[data-theme="light"] .field__label { color: var(--slb-text); }
[data-theme="light"] .segmented [aria-pressed="true"],
[data-theme="light"] .segmented .is-active { background: var(--slb-primary); color: var(--slb-white); }
[data-theme="light"] .check--card:has(input:checked) { border-color: var(--slb-primary); background: var(--slb-primary-soft); }
[data-theme="light"] .upload { border-color: color-mix(in srgb, var(--slb-primary) 40%, var(--slb-border)); background: var(--slb-surface-subtle); }
[data-theme="light"] .upload:hover { border-color: var(--slb-primary); background: var(--slb-primary-soft); }

/* ------------------------------------------------------------ 6. Tables --- */
[data-theme="light"] table.data { background: var(--slb-white); }
[data-theme="light"] table.data thead th {
  background: var(--slb-surface-subtle);
  color: var(--slb-navy);
  border-bottom: 1px solid var(--slb-border);
}
[data-theme="light"] table.data tbody td { border-bottom-color: #E8EFF3; }
[data-theme="light"] table.data tbody tr:hover,
[data-theme="light"] table.data.sticky-actions tbody tr:hover td.actions { background: var(--slb-light-bg); }
[data-theme="light"] table.data tbody tr[data-selected="true"],
[data-theme="light"] table.data tbody tr.is-selected { background: var(--slb-selected); }
[data-theme="light"] .pagination__pages [aria-current="page"] { background: var(--slb-primary); border-color: var(--slb-primary); color: var(--slb-white); }
[data-theme="light"] .pagination__pages a:hover { background: var(--slb-light-bg); color: var(--slb-primary-ink); }

/* ----------------------------------------------- 7. Status and feedback --- */
[data-theme="light"] .badge--info { background: var(--slb-primary-soft); color: var(--slb-primary-ink); }
[data-theme="light"] .step[data-state="current"] .step__marker { background: var(--slb-primary); border-color: var(--slb-primary); }
[data-theme="light"] .step[data-state="done"] .step__marker { background: var(--slb-success); border-color: var(--slb-success); }
[data-theme="light"] .menu__panel,
[data-theme="light"] .row-menu__list,
[data-theme="light"] .fo-menu__list { background: var(--slb-white); border-color: var(--slb-border); box-shadow: var(--shadow-lg); }
[data-theme="light"] .menu__item:hover { background: var(--slb-light-bg); }
[data-theme="light"] .toast { background: var(--slb-white); border-color: var(--slb-border); box-shadow: var(--shadow-lg); }

/* Overlays: command search, drawers, dialogs. */
[data-theme="light"] .command-palette__backdrop,
[data-theme="light"] .cc-drawer__backdrop,
[data-theme="light"] .sheet__scrim,
[data-theme="light"] .pcp-drawer__scrim { background: rgba(0, 26, 102, 0.38); }
[data-theme="light"] .import-delete::backdrop { background: rgba(0, 26, 102, 0.38); }
[data-theme="light"] .command-palette__panel {
  background: var(--slb-white);
  border-color: var(--slb-border);
  box-shadow: var(--shadow-lg);
}
[data-theme="light"] .command-palette__search > svg { color: var(--slb-primary); }
[data-theme="light"] .command-palette__search kbd { background: var(--slb-surface-inset); }
[data-theme="light"] .command-palette__links a:hover,
[data-theme="light"] .command-palette__links a:focus { background: var(--slb-light-bg); border-color: color-mix(in srgb, var(--slb-primary) 35%, transparent); }
[data-theme="light"] .command-palette__links a > span { background: var(--slb-primary-soft); color: var(--slb-primary-ink); }
[data-theme="light"] .cc-drawer__panel { background: var(--slb-white); border-left-color: var(--slb-border); box-shadow: -18px 0 50px rgba(0, 26, 102, 0.18); }
[data-theme="light"] .pcp-drawer__panel { box-shadow: -24px 0 50px rgba(0, 26, 102, 0.16); }
[data-theme="light"] .import-delete { box-shadow: 0 24px 64px rgba(0, 26, 102, 0.28); }

/* ------------------------------------------- 8. Command Center (in app) ---
   The wallboard drawn inside the application follows the theme. The TV
   wallboard (its own layout, outside .app) keeps its dark screen. */
[data-theme="light"] .app .wb {
  --wb-bg: var(--slb-light-bg);
  --wb-bg-2: var(--slb-light-bg);
  --wb-panel: var(--slb-white);
  --wb-panel-2: var(--slb-surface-subtle);
  --wb-line: var(--slb-border);
  --wb-line-strong: var(--slb-border-strong);
  --wb-text: var(--slb-text);
  --wb-muted: var(--slb-text-secondary);
  --wb-dim: #7B8A9B;
  --wb-blue: var(--slb-primary);
  --wb-blue-2: var(--slb-primary-ink);
  --wb-green: var(--slb-success);
  --wb-amber: var(--slb-warning);
  --wb-red: var(--slb-critical);
  --wb-red-deep: var(--slb-critical-ink);
  --wb-info: var(--slb-primary);
  --wb-slate: var(--slb-text-secondary);
  background: var(--slb-light-bg);
}
[data-theme="light"] .app .wb-panel,
[data-theme="light"] .app .wb-kpi,
[data-theme="light"] .app .wb-rail__cell { box-shadow: var(--shadow-sm); }
[data-theme="light"] .app .wb-tool { background: var(--slb-white); }
[data-theme="light"] .app .wb-tool:hover { background: var(--slb-primary-soft); }
[data-theme="light"] .app .wb-bar,
[data-theme="light"] .app .wb-funnel__track { background: var(--slb-surface-inset); }
[data-theme="light"] .app .wb-bar i + i { border-left-color: var(--slb-white); }
[data-theme="light"] .app .wb-mini,
[data-theme="light"] .app .wb-steps li { background: var(--slb-surface-subtle); }

/* ------------------------------------------------------------ 9. Sign-in --- */
[data-theme="light"] .auth__brandside { background: radial-gradient(900px 560px at 15% -10%, rgba(5, 0, 255, 0.32), transparent 60%), linear-gradient(160deg, var(--slb-navy), #001A66); }
[data-theme="light"] .auth__points svg { color: #C7D4FF; }
[data-theme="light"] .auth::before { background: radial-gradient(circle at 12% 12%, rgba(5, 0, 255, 0.12), transparent 36%); }

/* ------------------------------------------------------ 10. Small screens --- */
@media (max-width: 900px) {
  [data-theme="light"] .cc-hero .cc-head__identity { padding-left: 12px; }
}