/* ========================================
   🔥 CSS ПЕРЕМЕННЫЕ И СБРОС
   ======================================== */
:root {
    --bg: #060b14;
    --bg-soft: #0b1220;
    --bg-elevated: #0f1728;
    --surface: #111b2e;
    --surface-2: #162235;
    --surface-3: #1b2940;
    --surface-4: #22324f;

    --readable-text: #f8fbff;
    --readable-text-soft: #e7eef9;
    --readable-text-muted: #c7d3e4;
    --readable-text-subtle: #b6c4d8;
    --readable-panel-text: #f4f8ff;
    --readable-panel-muted: #d7e2f1;
    --readable-label: #eef5ff;
    --readable-placeholder: #d7e2f1;

    --text: var(--readable-text);
    --text-soft: var(--readable-text-soft);
    --text-muted: var(--readable-text-muted);

    --border: rgba(183, 200, 224, 0.24);
    --border-strong: rgba(203, 213, 225, 0.38);

    --primary: #4f8cff;
    --primary-2: #7b61ff;
    --accent-cyan: #22d3ee;
    --success: #22c55e;
    --warning: #f59e0b;
    --danger: #ef4444;

    --status-warning-text: #ffd166;
    --status-warning-bg: rgba(180, 83, 9, 0.38);
    --status-warning-border: rgba(255, 209, 102, 0.64);
    --status-danger-text: #ffd1d1;
    --status-danger-bg: rgba(185, 28, 28, 0.38);
    --status-danger-border: rgba(248, 113, 113, 0.64);
    --status-success-text: #d1fae5;
    --status-success-bg: rgba(21, 128, 61, 0.36);
    --status-success-border: rgba(134, 239, 172, 0.58);
    --status-primary-text: #dbeafe;
    --status-primary-bg: rgba(37, 99, 235, 0.38);
    --status-primary-border: rgba(147, 197, 253, 0.58);
    --badge-neutral-text: #eef5ff;
    --badge-neutral-bg: rgba(148, 163, 184, 0.22);
    --badge-neutral-border: rgba(203, 213, 225, 0.42);
    --mock-label-text: var(--readable-label);
    --mock-meta-text: var(--readable-panel-muted);

    --gradient-primary: linear-gradient(135deg, #4f8cff 0%, #7b61ff 100%);
    --gradient-hero:
        radial-gradient(circle at 10% 0%, rgba(79, 140, 255, 0.18), transparent 28%),
        radial-gradient(circle at 92% 12%, rgba(123, 97, 255, 0.15), transparent 26%),
        radial-gradient(circle at 40% 70%, rgba(34, 211, 238, 0.07), transparent 24%),
        linear-gradient(180deg, #060b14 0%, #0a1220 48%, #0d1626 100%);
    --industrial-page-bg:
        radial-gradient(circle at 12% 0%, rgba(34, 211, 238, 0.14), transparent 26%),
        radial-gradient(circle at 86% 8%, rgba(79, 140, 255, 0.16), transparent 28%),
        radial-gradient(circle at 50% 42%, rgba(123, 97, 255, 0.08), transparent 34%),
        linear-gradient(180deg, #050a12 0%, #07111f 42%, #0a1322 100%);
    --industrial-grid:
        linear-gradient(90deg, rgba(79, 140, 255, .055) 1px, transparent 1px),
        linear-gradient(180deg, rgba(34, 211, 238, .045) 1px, transparent 1px);
    --industrial-panel:
        radial-gradient(circle at 10% 0%, rgba(34, 211, 238, .105), transparent 32%),
        linear-gradient(180deg, rgba(17, 27, 46, .88), rgba(9, 18, 32, .78));
    --industrial-panel-hover:
        radial-gradient(circle at 10% 0%, rgba(45, 212, 255, .16), transparent 34%),
        linear-gradient(180deg, rgba(20, 32, 54, .94), rgba(10, 20, 36, .86));
    --industrial-border: rgba(56, 189, 248, .22);
    --industrial-border-strong: rgba(45, 212, 255, .46);
    --industrial-shadow: 0 18px 48px rgba(0, 0, 0, .30), inset 0 1px 0 rgba(255, 255, 255, .055);
    --industrial-line: linear-gradient(115deg, transparent 0 58%, rgba(56, 189, 248, .08) 58% 58.6%, transparent 58.6% 100%);

    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.18);
    --shadow-md: 0 12px 28px rgba(0, 0, 0, 0.25);
    --shadow-lg: 0 20px 44px rgba(0, 0, 0, 0.32);
    --shadow-xl: 0 30px 90px rgba(0, 0, 0, 0.46);

    --radius-sm: 14px;
    --radius-md: 20px;
    --radius-lg: 28px;
    --radius-xl: 36px;

    --container: 1340px;
    --transition: 180ms cubic-bezier(.4,0,.2,1);
    --navbar-height: 84px;
    --subnav-height: 62px;

    --home-section-y: clamp(4rem, 5.5vw, 5.25rem);
    --home-section-y-sm: clamp(2.25rem, 3.2vw, 3rem);
    --home-section-head-gap: clamp(1.5rem, 2.4vw, 2.5rem);
    --home-card-gap: clamp(1rem, 1.6vw, 1.5rem);
    --home-card-inner-gap: clamp(.875rem, 1.2vw, 1.125rem);
    --home-card-padding: clamp(1.25rem, 1.8vw, 1.75rem);
}

[data-theme="light"] {
    --bg: #f6f8fc;
    --bg-soft: #ffffff;
    --bg-elevated: #f8fbff;
    --surface: #ffffff;
    --surface-2: #f8fbff;
    --surface-3: #eef4ff;
    --surface-4: #e8f0fe;

    --readable-text: #0f172a;
    --readable-text-soft: #334155;
    --readable-text-muted: #475569;
    --readable-text-subtle: #64748b;
    --readable-panel-text: #0f172a;
    --readable-panel-muted: #334155;
    --readable-label: #1e293b;
    --readable-placeholder: #475569;

    --text: var(--readable-text);
    --text-soft: var(--readable-text-soft);
    --text-muted: var(--readable-text-muted);

    --border: rgba(15, 23, 42, 0.14);
    --border-strong: rgba(15, 23, 42, 0.24);

    --status-warning-text: #78350f;
    --status-warning-bg: #fef3c7;
    --status-warning-border: #d97706;
    --status-danger-text: #7f1d1d;
    --status-danger-bg: #fee2e2;
    --status-danger-border: #dc2626;
    --status-success-text: #064e3b;
    --status-success-bg: #d1fae5;
    --status-success-border: #059669;
    --status-primary-text: #1e3a8a;
    --status-primary-bg: #dbeafe;
    --status-primary-border: #2563eb;
    --badge-neutral-text: #1e293b;
    --badge-neutral-bg: #e2e8f0;
    --badge-neutral-border: #94a3b8;
    --mock-label-text: var(--readable-label);
    --mock-meta-text: var(--readable-panel-muted);

    --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
    --shadow-md: 0 14px 32px rgba(15, 23, 42, 0.08);
    --shadow-lg: 0 24px 54px rgba(15, 23, 42, 0.12);
    --shadow-xl: 0 34px 96px rgba(15, 23, 42, 0.16);

    --gradient-hero:
        radial-gradient(circle at 10% 0%, rgba(79, 140, 255, 0.14), transparent 30%),
        radial-gradient(circle at 92% 12%, rgba(123, 97, 255, 0.12), transparent 26%),
        radial-gradient(circle at 40% 70%, rgba(34, 211, 238, 0.05), transparent 24%),
        linear-gradient(180deg, #edf4ff 0%, #f5f8fd 48%, #f7faff 100%);
    --industrial-page-bg:
        radial-gradient(circle at 10% 0%, rgba(37, 99, 235, 0.12), transparent 28%),
        radial-gradient(circle at 90% 10%, rgba(14, 165, 233, 0.10), transparent 28%),
        radial-gradient(circle at 52% 44%, rgba(59, 130, 246, 0.05), transparent 34%),
        linear-gradient(180deg, #edf4ff 0%, #f7faff 48%, #eef4ff 100%);
    --industrial-grid:
        linear-gradient(90deg, rgba(37, 99, 235, .050) 1px, transparent 1px),
        linear-gradient(180deg, rgba(14, 165, 233, .040) 1px, transparent 1px);
    --industrial-panel:
        linear-gradient(138deg, rgba(255, 255, 255, .92), rgba(255, 255, 255, .70) 44%, rgba(219, 234, 254, .46)),
        radial-gradient(circle at 10% 0%, rgba(37, 99, 235, .11), transparent 34%),
        radial-gradient(circle at 92% 12%, rgba(14, 165, 233, .080), transparent 32%),
        linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(246, 250, 255, .90));
    --industrial-panel-hover:
        linear-gradient(138deg, rgba(255, 255, 255, .98), rgba(247, 251, 255, .82) 44%, rgba(219, 234, 254, .58)),
        radial-gradient(circle at 10% 0%, rgba(37, 99, 235, .15), transparent 34%),
        radial-gradient(circle at 92% 12%, rgba(14, 165, 233, .12), transparent 32%),
        linear-gradient(180deg, rgba(255, 255, 255, .99), rgba(238, 244, 255, .94));
    --industrial-border: rgba(37, 99, 235, .22);
    --industrial-border-strong: rgba(29, 78, 216, .42);
    --industrial-shadow: 0 22px 58px rgba(15, 23, 42, .10), 0 1px 0 rgba(255, 255, 255, .78) inset;
    --industrial-line: linear-gradient(115deg, transparent 0 58%, rgba(37, 99, 235, .090) 58% 58.55%, transparent 58.55% 100%);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--navbar-height) + var(--subnav-height) + 1rem);
}

body {
    font-family: var(--font-family-base);
    background:
        var(--industrial-grid),
        var(--industrial-page-bg);
    background-size: 56px 56px, 56px 56px, auto, auto, auto;
    background-attachment: fixed;
    color: var(--text);
    line-height: 1.62;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
}

body.menu-open {
    overflow: hidden;
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    display: block;
    max-width: 100%;
    height: auto;
}

button,
input,
textarea,
select {
    font: inherit;
}

::selection {
    background: rgba(79, 140, 255, 0.22);
    color: #fff;
}

:focus-visible {
    outline: 2px solid rgba(79, 140, 255, 0.80);
    outline-offset: 2px;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.skip-link {
    position: absolute;
    left: -999px;
    top: 0;
    z-index: 2000;
    padding: .85rem 1rem;
    border-radius: 12px;
    background: var(--surface);
    color: var(--text);
    border: 1px solid var(--border-strong);
}

.skip-link:focus {
    left: 1rem;
    top: 1rem;
}

.container {
    width: min(var(--container), calc(100% - 2rem));
    margin: 0 auto;
}

/* ========================================
   🔥 КОМПОНЕНТЫ
   ======================================== */
.section {
    position: relative;
    overflow: hidden;
    padding-block: var(--home-section-y);
    scroll-margin-top: calc(var(--navbar-height) + var(--subnav-height) + 1rem);
}

.section-sm {
    position: relative;
    overflow: hidden;
    padding-block: var(--home-section-y-sm);
    scroll-margin-top: calc(var(--navbar-height) + var(--subnav-height) + 1rem);
}

.section-muted {
    background:
        radial-gradient(circle at 10% 0%, rgba(34, 211, 238, .075), transparent 30%),
        linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.026));
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

.section:not(.seo-nav-section)::before,
.section-sm:not(.seo-nav-section)::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background:
        var(--industrial-line),
        var(--industrial-grid);
    background-size: auto, 64px 64px, 64px 64px;
    opacity: .11;
    pointer-events: none;
}

[data-theme="light"] .section:not(.seo-nav-section)::before,
[data-theme="light"] .section-sm:not(.seo-nav-section)::before {
    opacity: .13;
}

.section > .container,
.section-sm > .container {
    position: relative;
    z-index: 1;
}

.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    padding: .5rem .95rem;
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
    background: rgba(79, 140, 255, 0.10);
    color: var(--readable-label);
    border: 1px solid rgba(128, 170, 255, 0.34);
    margin-bottom: 1rem;
}

[data-theme="light"] .eyebrow {
    color: #1d4ed8;
    background: rgba(37, 99, 235, 0.10);
    border-color: rgba(37, 99, 235, 0.22);
}

.section-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: var(--home-card-gap);
    flex-wrap: wrap;
    margin-bottom: var(--home-section-head-gap);
}

.section-title {
    font-size: clamp(1.9rem, 3.2vw, 3.1rem);
    line-height: 1.12;
    font-weight: 900;
    letter-spacing: 0;
    max-width: 860px;
}

.section-subtitle {
    max-width: 760px;
    color: var(--readable-text-soft);
    font-size: 1.06rem;
    line-height: 1.68;
}

.note {
    margin-top: 1rem;
    color: var(--readable-text-muted);
    font-size: .9rem;
    line-height: 1.58;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    padding: .95rem 1.25rem;
    border-radius: 999px;
    border: 1px solid transparent;
    font-weight: 700;
    transition: var(--transition);
    cursor: pointer;
    white-space: nowrap;
}

.btn-primary {
    background: var(--gradient-primary);
    color: #fff;
    box-shadow: var(--shadow-md);
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.btn-secondary {
    background: rgba(255,255,255,.09);
    color: var(--text);
    border-color: var(--border);
    backdrop-filter: blur(12px);
}

.btn-secondary:hover {
    border-color: var(--border-strong);
}

.btn-ghost {
    background: transparent;
    color: var(--text);
    border-color: var(--border);
}

.btn-ghost:hover {
    border-color: var(--border-strong);
    color: var(--text);
}

.btn:focus-visible,
.nav-link:focus-visible,
.mobile-nav-link:focus-visible,
.subnav-link:focus-visible,
.module-card:focus-visible,
.floating-action:focus-visible,
.topic-chip:focus-visible,
.mini-action-btn:focus-visible,
.footer-links a:focus-visible {
    outline: 3px solid rgba(45, 212, 255, .38);
    outline-offset: 3px;
}

/* ========================================
   🔥 НАВИГАЦИЯ
   ======================================== */
.navbar {
    position: sticky;
    top: 0;
    z-index: 1200;
    backdrop-filter: blur(18px);
    background: rgba(6,11,20,.88);
    border-bottom: 1px solid var(--border);
}

body[data-theme="light"] .navbar,
[data-theme="light"] .navbar {
    background: rgba(255,255,255,.96);
}

.nav-inner {
    min-height: var(--navbar-height);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.logo {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    min-width: 0;
}

/* Landing logo/icons marker: 20260622-logo-icons-v1 */
/* Landing layout/logo overlap marker: 20260622-layout-logo-overlap-v1 */
.navbar .app-logo {
    flex: 0 1 auto;
    max-width: min(560px, calc(100% - 8.5rem));
}

.navbar .app-logo__image {
    display: block;
    width: 60px;
    height: 60px;
    flex: 0 0 60px;
    min-width: 60px;
    object-fit: contain;
    opacity: 1;
    visibility: visible;
    filter: drop-shadow(0 8px 18px rgba(0,0,0,.18));
}

.logo-image {
    height: 46px;
    width: auto;
    object-fit: contain;
    flex-shrink: 0;
    filter: drop-shadow(0 8px 18px rgba(0,0,0,.18));
}

.logo-meta {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: .25rem;
    min-width: 0;
}

.logo-title {
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.12;
}

.logo-subtitle {
    font-size: .72rem;
    color: var(--readable-label);
    letter-spacing: .04em;
    line-height: 1.2;
    text-transform: uppercase;
}

.nav-links {
    display: flex;
    gap: .3rem;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
}

.nav-link {
    padding: .65rem .95rem;
    border-radius: 999px;
    font-size: .94rem;
    line-height: 1.25;
    color: var(--text);
    transition: var(--transition);
}

.nav-link:hover,
.nav-link.active {
    color: var(--text);
    background: rgba(255,255,255,.04);
}

.nav-actions {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.theme-toggle,
.menu-toggle {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: rgba(255,255,255,.08);
    color: var(--text);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: var(--transition);
    flex-shrink: 0;
}

.theme-toggle:hover,
.menu-toggle:hover {
    border-color: var(--border-strong);
    transform: translateY(-1px);
}

.menu-toggle {
    display: none;
}

.mobile-menu {
    display: none;
    border-top: 1px solid var(--border);
    background: rgba(6,11,20,.94);
    backdrop-filter: blur(18px);
}

body[data-theme="light"] .mobile-menu,
[data-theme="light"] .mobile-menu {
    background: rgba(255,255,255,.96);
}

.mobile-menu[hidden] {
    display: none !important;
}

.mobile-menu-inner {
    padding: 1rem 0 1.2rem;
    display: grid;
    gap: .85rem;
}

.mobile-nav-links,
.mobile-nav-actions {
    display: grid;
    gap: .55rem;
}

.mobile-nav-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .9rem 1rem;
    border-radius: 16px;
    border: 1px solid var(--border);
    background: rgba(255,255,255,.08);
    color: var(--text);
    font-size: 1rem;
    font-weight: 700;
    transition: var(--transition);
}

.mobile-nav-link.active,
.mobile-nav-link:hover {
    color: var(--text);
    border-color: var(--border-strong);
    background: rgba(255,255,255,.12);
}

/* ========================================
   🔥 ГЕРОЙ СЕКЦИЯ
   ======================================== */
.hero {
    position: relative;
    isolation: isolate;
    color: #0f172a;
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .050) 1px, transparent 1px),
        linear-gradient(180deg, rgba(14, 165, 233, .040) 1px, transparent 1px),
        linear-gradient(180deg, transparent 0 18%, rgba(14, 165, 233, .080) 18% 18.45%, transparent 18.45% 40%, rgba(59, 130, 246, .060) 40% 40.35%, transparent 40.35% 100%),
        radial-gradient(circle at 8% 8%, rgba(37, 99, 235, .17), transparent 30%),
        radial-gradient(circle at 88% 10%, rgba(14, 165, 233, .15), transparent 32%),
        radial-gradient(circle at 58% 88%, rgba(79, 70, 229, .08), transparent 30%),
        linear-gradient(180deg, #f7fbff 0%, #edf6ff 54%, #f8fbff 100%);
    background-size: 56px 56px, 56px 56px, auto, auto, auto, auto, auto;
    overflow: hidden;
    padding: 5.5rem 0 3rem;
    border-bottom: 1px solid rgba(37, 99, 235, .16);
}

.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .055) 1px, transparent 1px),
        linear-gradient(180deg, rgba(14, 165, 233, .045) 1px, transparent 1px),
        linear-gradient(180deg, transparent 0 24%, rgba(14, 165, 233, .10) 24% 24.55%, transparent 24.55% 63%, rgba(59, 130, 246, .08) 63% 63.4%, transparent 63.4% 100%),
        radial-gradient(circle at 18% 22%, rgba(37, 99, 235, .10), transparent 0 28%),
        radial-gradient(circle at 82% 18%, rgba(14, 165, 233, .09), transparent 0 26%);
    background-size: 64px 64px, 64px 64px, auto, auto, auto;
    opacity: .72;
    pointer-events: none;
}

.hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background:
        radial-gradient(circle at 70% 18%, rgba(14, 165, 233, .12), transparent 26%),
        radial-gradient(circle at 20% 74%, rgba(59, 130, 246, .09), transparent 28%),
        linear-gradient(116deg, transparent 0 60%, rgba(37, 99, 235, .11) 60% 60.24%, transparent 60.24% 100%),
        linear-gradient(132deg, transparent 0 72%, rgba(14, 165, 233, .075) 72% 72.18%, transparent 72.18% 100%),
        linear-gradient(180deg, rgba(255, 255, 255, .52), rgba(255, 255, 255, .18) 42%, transparent 72%);
    opacity: .60;
    pointer-events: none;
}

.hero-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1.02fr .98fr;
    gap: 2rem;
    align-items: center;
}

.hero-grid > * {
    position: relative;
    z-index: 2;
}

.hero .eyebrow {
    color: #1d4ed8;
    background: rgba(219, 234, 254, .82);
    border-color: rgba(37, 99, 235, .24);
}

.hero-title {
    font-size: clamp(2.7rem, 5.3vw, 5.3rem);
    line-height: 1.02;
    font-weight: 900;
    letter-spacing: 0;
    margin-bottom: 1rem;
    max-width: 840px;
    color: #0f172a;
    text-shadow: none;
}

.hero-title-accent {
    background: linear-gradient(135deg, #1d4ed8 0%, #0e7490 52%, #2563eb 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero-proofline {
    font-size: 1rem;
    font-weight: 700;
    color: #1e3a8a;
    margin-bottom: .9rem;
    letter-spacing: 0;
    line-height: 1.45;
}

.hero-subtitle {
    color: #334155;
    font-size: 1.12rem;
    line-height: 1.72;
    max-width: 720px;
    margin-bottom: 1.2rem;
}

.hero-microproof {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 1.3rem;
    margin-bottom: 1.4rem;
    color: #334155;
    font-size: .96rem;
    line-height: 1.5;
}

.hero-microproof span {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
}

.hero-microproof i {
    color: var(--accent-cyan);
}

.hero-chips {
    display: flex;
    flex-wrap: wrap;
    gap: .7rem;
    margin-bottom: 1.5rem;
}

.hero-chip {
    padding: .52rem .86rem;
    border-radius: 999px;
    font-size: .84rem;
    font-weight: 700;
    color: #0f172a;
    background: rgba(255, 255, 255, .78);
    border: 1px solid rgba(37, 99, 235, .20);
    box-shadow: 0 8px 20px rgba(15, 23, 42, .06);
}

.hero-status-badges {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
    margin: -.35rem 0 1.45rem;
}

.hero-status-badges span {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .5rem .78rem;
    border-radius: 999px;
    color: #0f172a;
    background: rgba(255, 255, 255, .78);
    border: 1px solid rgba(37, 99, 235, .20);
    box-shadow: 0 8px 20px rgba(15, 23, 42, .06);
    font-size: .82rem;
    font-weight: 800;
    line-height: 1.35;
}

.hero-status-badges i {
    color: var(--accent-cyan);
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .85rem;
    margin-bottom: 1.15rem;
}

.section-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .85rem;
    margin-top: 1.2rem;
}

.hero-caption {
    color: #475569;
    font-size: .9rem;
    line-height: 1.55;
    margin-bottom: 1.5rem;
}

.hero-kpi-head {
    color: #1e3a8a;
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 800;
    margin-bottom: .8rem;
}

.hero-trust {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .9rem;
}

.hero-kpi {
    background:
        radial-gradient(circle at 10% 0%, rgba(37, 99, 235, .08), transparent 32%),
        linear-gradient(180deg, rgba(255, 255, 255, .94), rgba(248, 251, 255, .88));
    border: 1px solid rgba(37, 99, 235, .16);
    border-radius: 22px;
    padding: 1rem;
    box-shadow: var(--industrial-shadow);
}

.hero-kpi-value {
    font-size: 1.55rem;
    font-weight: 900;
    letter-spacing: 0;
    margin-bottom: .18rem;
}

.hero-kpi-label {
    font-size: .86rem;
    line-height: 1.42;
    color: #475569;
}

.hero .btn-secondary {
    color: #1d4ed8;
    background: rgba(255, 255, 255, .88);
    border-color: rgba(37, 99, 235, .22);
}

html[data-theme="light"] .hero,
body[data-theme="light"] .hero,
[data-theme="light"] .hero {
    color: #0f172a;
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .050) 1px, transparent 1px),
        linear-gradient(180deg, rgba(14, 165, 233, .040) 1px, transparent 1px),
        linear-gradient(180deg, transparent 0 18%, rgba(14, 165, 233, .080) 18% 18.45%, transparent 18.45% 40%, rgba(59, 130, 246, .060) 40% 40.35%, transparent 40.35% 100%),
        radial-gradient(circle at 8% 8%, rgba(37, 99, 235, .17), transparent 30%),
        radial-gradient(circle at 88% 10%, rgba(14, 165, 233, .15), transparent 32%),
        radial-gradient(circle at 58% 88%, rgba(79, 70, 229, .08), transparent 30%),
        linear-gradient(180deg, #f7fbff 0%, #edf6ff 54%, #f8fbff 100%);
    background-size: 56px 56px, 56px 56px, auto, auto, auto, auto, auto;
    border-bottom-color: rgba(37, 99, 235, .16);
}

html[data-theme="light"] .hero::before,
body[data-theme="light"] .hero::before,
[data-theme="light"] .hero::before {
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .055) 1px, transparent 1px),
        linear-gradient(180deg, rgba(14, 165, 233, .045) 1px, transparent 1px),
        linear-gradient(180deg, transparent 0 24%, rgba(14, 165, 233, .10) 24% 24.55%, transparent 24.55% 63%, rgba(59, 130, 246, .08) 63% 63.4%, transparent 63.4% 100%),
        radial-gradient(circle at 18% 22%, rgba(37, 99, 235, .10), transparent 0 28%),
        radial-gradient(circle at 82% 18%, rgba(14, 165, 233, .09), transparent 0 26%);
    background-size: 64px 64px, 64px 64px, auto, auto, auto;
    opacity: .72;
    pointer-events: none;
    z-index: 0;
}

html[data-theme="light"] .hero::after,
body[data-theme="light"] .hero::after,
[data-theme="light"] .hero::after {
    background:
        radial-gradient(circle at 70% 18%, rgba(14, 165, 233, .12), transparent 26%),
        radial-gradient(circle at 20% 74%, rgba(59, 130, 246, .09), transparent 28%),
        linear-gradient(116deg, transparent 0 60%, rgba(37, 99, 235, .11) 60% 60.24%, transparent 60.24% 100%),
        linear-gradient(132deg, transparent 0 72%, rgba(14, 165, 233, .075) 72% 72.18%, transparent 72.18% 100%),
        linear-gradient(180deg, rgba(255, 255, 255, .52), rgba(255, 255, 255, .18) 42%, transparent 72%);
    opacity: .60;
    pointer-events: none;
    z-index: 0;
}

html[data-theme="light"] .hero-grid > :first-child,
body[data-theme="light"] .hero-grid > :first-child,
[data-theme="light"] .hero-grid > :first-child {
    padding: clamp(1rem, 2vw, 1.45rem);
    margin: clamp(-.65rem, -1vw, -.35rem) 0;
    border-radius: 28px;
    background:
        linear-gradient(116deg, rgba(255, 255, 255, .92), rgba(255, 255, 255, .70) 56%, rgba(219, 234, 254, .42)),
        radial-gradient(circle at 0% 0%, rgba(14, 165, 233, .10), transparent 34%);
    border: 1px solid rgba(59, 130, 246, .14);
    box-shadow: 0 18px 46px rgba(15, 23, 42, .055), inset 0 1px 0 rgba(255, 255, 255, .88);
    backdrop-filter: blur(10px);
}

html[data-theme="light"] .hero .eyebrow,
body[data-theme="light"] .hero .eyebrow,
[data-theme="light"] .hero .eyebrow {
    color: #1d4ed8;
    background: rgba(219, 234, 254, .82);
    border-color: rgba(37, 99, 235, .24);
}

html[data-theme="light"] .hero-title,
body[data-theme="light"] .hero-title,
[data-theme="light"] .hero-title {
    color: #0f172a;
    text-shadow: none;
}

html[data-theme="light"] .hero-title-accent,
body[data-theme="light"] .hero-title-accent,
[data-theme="light"] .hero-title-accent {
    background: linear-gradient(135deg, #1d4ed8 0%, #0e7490 52%, #2563eb 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

html[data-theme="light"] .hero-proofline,
body[data-theme="light"] .hero-proofline,
[data-theme="light"] .hero-proofline,
html[data-theme="light"] .hero-kpi-head,
body[data-theme="light"] .hero-kpi-head,
[data-theme="light"] .hero-kpi-head {
    color: #1e3a8a;
}

html[data-theme="light"] .hero-subtitle,
body[data-theme="light"] .hero-subtitle,
[data-theme="light"] .hero-subtitle,
html[data-theme="light"] .hero-microproof,
body[data-theme="light"] .hero-microproof,
[data-theme="light"] .hero-microproof {
    color: #334155;
}

html[data-theme="light"] .hero-caption,
body[data-theme="light"] .hero-caption,
[data-theme="light"] .hero-caption,
html[data-theme="light"] .hero-kpi-label,
body[data-theme="light"] .hero-kpi-label,
[data-theme="light"] .hero-kpi-label {
    color: #475569;
}

html[data-theme="light"] .hero-chip,
body[data-theme="light"] .hero-chip,
[data-theme="light"] .hero-chip,
html[data-theme="light"] .hero-status-badges span,
body[data-theme="light"] .hero-status-badges span,
[data-theme="light"] .hero-status-badges span {
    color: #0f172a;
    background: rgba(255, 255, 255, .78);
    border-color: rgba(37, 99, 235, .20);
    box-shadow: 0 8px 20px rgba(15, 23, 42, .06);
}

html[data-theme="light"] .hero-kpi,
body[data-theme="light"] .hero-kpi,
[data-theme="light"] .hero-kpi {
    background:
        radial-gradient(circle at 10% 0%, rgba(37, 99, 235, .08), transparent 32%),
        linear-gradient(180deg, rgba(255, 255, 255, .94), rgba(248, 251, 255, .88));
    border-color: rgba(37, 99, 235, .16);
}

html[data-theme="light"] .hero .btn-secondary,
body[data-theme="light"] .hero .btn-secondary,
[data-theme="light"] .hero .btn-secondary {
    color: #1d4ed8;
    background: rgba(255, 255, 255, .88);
    border-color: rgba(37, 99, 235, .22);
}

html[data-theme="dark"] .hero,
body[data-theme="dark"] .hero,
[data-theme="dark"] .hero {
    color: #eef5ff;
    background:
        var(--industrial-grid),
        radial-gradient(circle at 8% 10%, rgba(34, 211, 238, .18), transparent 26%),
        radial-gradient(circle at 86% 12%, rgba(79, 140, 255, .22), transparent 28%),
        radial-gradient(circle at 52% 86%, rgba(123, 97, 255, .10), transparent 30%),
        linear-gradient(180deg, #040810 0%, #07111f 52%, #0a1322 100%);
    background-size: 56px 56px, auto, auto, auto, auto;
    border-bottom-color: rgba(56, 189, 248, .18);
}

html[data-theme="dark"] .hero::before,
body[data-theme="dark"] .hero::before,
[data-theme="dark"] .hero::before {
    background:
        radial-gradient(circle at 18% 22%, rgba(79,140,255,.08), transparent 0 26%),
        radial-gradient(circle at 82% 18%, rgba(123,97,255,.08), transparent 0 24%);
    opacity: 1;
    pointer-events: none;
}

html[data-theme="dark"] .hero::after,
body[data-theme="dark"] .hero::after,
[data-theme="dark"] .hero::after {
    background:
        linear-gradient(116deg, transparent 0 58%, rgba(45, 212, 255, .13) 58% 58.35%, transparent 58.35% 100%),
        linear-gradient(180deg, rgba(255,255,255,.035), transparent 36%);
    opacity: .72;
    pointer-events: none;
}

html[data-theme="dark"] .hero .eyebrow,
body[data-theme="dark"] .hero .eyebrow,
[data-theme="dark"] .hero .eyebrow {
    color: #c7f9ff;
    background: rgba(14, 116, 144, .28);
    border-color: rgba(56, 189, 248, .36);
}

html[data-theme="dark"] .hero-title,
body[data-theme="dark"] .hero-title,
[data-theme="dark"] .hero-title {
    color: #eef5ff;
    text-shadow: 0 18px 42px rgba(0, 0, 0, .34);
}

html[data-theme="dark"] .hero-title-accent,
body[data-theme="dark"] .hero-title-accent,
[data-theme="dark"] .hero-title-accent {
    background: linear-gradient(135deg, #9fc1ff 0%, #c3b4ff 55%, #8ef2ff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

html[data-theme="dark"] .hero-proofline,
body[data-theme="dark"] .hero-proofline,
[data-theme="dark"] .hero-proofline,
html[data-theme="dark"] .hero-kpi-head,
body[data-theme="dark"] .hero-kpi-head,
[data-theme="dark"] .hero-kpi-head {
    color: #d8e7ff;
}

html[data-theme="dark"] .hero-subtitle,
body[data-theme="dark"] .hero-subtitle,
[data-theme="dark"] .hero-subtitle,
html[data-theme="dark"] .hero-microproof,
body[data-theme="dark"] .hero-microproof,
[data-theme="dark"] .hero-microproof {
    color: #d7e2f1;
}

html[data-theme="dark"] .hero-caption,
body[data-theme="dark"] .hero-caption,
[data-theme="dark"] .hero-caption,
html[data-theme="dark"] .hero-kpi-label,
body[data-theme="dark"] .hero-kpi-label,
[data-theme="dark"] .hero-kpi-label {
    color: #c7d3e4;
}

html[data-theme="dark"] .hero-chip,
body[data-theme="dark"] .hero-chip,
[data-theme="dark"] .hero-chip {
    color: #eaf6ff;
    background: rgba(15, 23, 42, .46);
    border-color: rgba(56, 189, 248, .32);
    box-shadow: none;
}

html[data-theme="dark"] .hero-status-badges span,
body[data-theme="dark"] .hero-status-badges span,
[data-theme="dark"] .hero-status-badges span {
    color: #eaf6ff;
    background: rgba(15, 23, 42, .42);
    border-color: rgba(147,197,253,.32);
    box-shadow: none;
}

html[data-theme="dark"] .hero-kpi,
body[data-theme="dark"] .hero-kpi,
[data-theme="dark"] .hero-kpi {
    background:
        radial-gradient(circle at 10% 0%, rgba(34, 211, 238, .10), transparent 32%),
        linear-gradient(180deg, rgba(17, 27, 46, .92), rgba(9, 18, 32, .86));
    border-color: rgba(56, 189, 248, .24);
}

html[data-theme="dark"] .hero .btn-secondary,
body[data-theme="dark"] .hero .btn-secondary,
[data-theme="dark"] .hero .btn-secondary {
    color: #eaf6ff;
    background: rgba(15, 23, 42, .62);
    border-color: rgba(147, 197, 253, .24);
}

/* ========================================
   🔥 СТИЛИ ДЛЯ ИНТЕРФЕЙСА
   ======================================== */
.glass-shell {
    position: relative;
    overflow: hidden;
    background: var(--industrial-panel);
    border: 1px solid var(--industrial-border);
    border-radius: 30px;
    padding: 1rem;
    box-shadow: var(--shadow-xl), inset 0 1px 0 rgba(255,255,255,.06);
}

.glass-shell::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: var(--industrial-line);
    opacity: .22;
    pointer-events: none;
}

[data-theme="light"] .glass-shell::after {
    opacity: .16;
}

.glass-shell > * {
    position: relative;
    z-index: 1;
}

.ui-window {
    background:
        linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025)),
        #0e1a2d;
    border: 1px solid rgba(183,200,224,.26);
    border-radius: 24px;
    padding: 1rem;
    position: relative;
    overflow: hidden;
}

.ui-window::before {
    content: "";
    position: absolute;
    top: 14px;
    left: 18px;
    width: 56px;
    height: 10px;
    border-radius: 999px;
    background:
        radial-gradient(circle, rgba(255,255,255,.55) 0 28%, transparent 30%) 0 50% / 18px 10px no-repeat,
        radial-gradient(circle, rgba(255,255,255,.30) 0 28%, transparent 30%) 50% 50% / 18px 10px no-repeat,
        radial-gradient(circle, rgba(255,255,255,.18) 0 28%, transparent 30%) 100% 50% / 18px 10px no-repeat;
    opacity: .65;
}

[data-theme="light"] .ui-window {
    background:
        radial-gradient(circle at 8% 0%, rgba(37, 99, 235, .08), transparent 30%),
        radial-gradient(circle at 96% 12%, rgba(14, 165, 233, .07), transparent 32%),
        linear-gradient(180deg, rgba(255, 255, 255, .95), rgba(246, 250, 255, .90));
    border-color: rgba(37, 99, 235, .18);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .88), 0 14px 34px rgba(15, 23, 42, .07);
}

.ui-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    margin-bottom: .9rem;
    padding-top: .2rem;
}

.ui-title {
    font-size: .95rem;
    font-weight: 800;
    color: var(--readable-panel-text);
}

.ui-subtitle {
    font-size: .8rem;
    color: var(--mock-meta-text);
    line-height: 1.45;
}

.status-pill {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .38rem .68rem;
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 800;
    color: var(--status-success-text);
    background: var(--status-success-bg);
    border: 1px solid var(--status-success-border);
}

.mock-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .9rem;
}

.mock-card {
    background: var(--industrial-panel);
    border: 1px solid var(--industrial-border);
    border-radius: 18px;
    padding: .95rem;
    min-width: 0;
    box-shadow: var(--shadow-sm);
}

.mock-title {
    font-size: .82rem;
    color: var(--mock-label-text);
    font-weight: 700;
    margin-bottom: .75rem;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.feed {
    display: grid;
    gap: .65rem;
}

.feed-item {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: .8rem;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(203,213,225,.16);
    padding: .72rem .8rem;
    border-radius: 14px;
}

.feed-name {
    font-size: .88rem;
    font-weight: 700;
    color: var(--readable-panel-text);
    line-height: 1.35;
}

.feed-meta {
    font-size: .8rem;
    color: var(--mock-meta-text);
    margin-top: .14rem;
    line-height: 1.42;
}

.badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .32rem .56rem;
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
}

.badge-danger {
    background: var(--status-danger-bg);
    color: var(--status-danger-text);
    border: 1px solid var(--status-danger-border);
}

.badge-warning {
    background: var(--status-warning-bg);
    color: var(--status-warning-text);
    border: 1px solid var(--status-warning-border);
}

.badge-success {
    background: var(--status-success-bg);
    color: var(--status-success-text);
    border: 1px solid var(--status-success-border);
}

.badge-primary {
    background: var(--status-primary-bg);
    color: var(--status-primary-text);
    border: 1px solid var(--status-primary-border);
}

[data-theme="light"] .badge-danger {
    background: var(--status-danger-bg);
    color: var(--status-danger-text);
    border-color: var(--status-danger-border);
}

[data-theme="light"] .badge-warning {
    background: var(--status-warning-bg);
    color: var(--status-warning-text);
    border-color: var(--status-warning-border);
}

[data-theme="light"] .badge-success {
    background: var(--status-success-bg);
    color: var(--status-success-text);
    border-color: var(--status-success-border);
}

[data-theme="light"] .badge-primary {
    background: var(--status-primary-bg);
    color: var(--status-primary-text);
    border-color: var(--status-primary-border);
}

.signal-monitor {
    display: grid;
    gap: .55rem;
    min-height: 150px;
    padding: .72rem .72rem .55rem;
    border-radius: 14px;
    border: 1px solid rgba(147, 197, 253, .18);
    background:
        radial-gradient(circle at 88% 8%, rgba(34, 211, 238, .12), transparent 34%),
        linear-gradient(180deg, rgba(79, 140, 255, .10), rgba(15, 23, 42, .05));
    overflow: hidden;
}

.signal-monitor__legend {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .45rem .7rem;
    color: var(--readable-panel-muted);
    font-size: .74rem;
    font-weight: 800;
    line-height: 1.25;
}

.signal-monitor__legend span {
    display: inline-flex;
    align-items: center;
    gap: .32rem;
}

.signal-dot {
    width: .52rem;
    height: .52rem;
    border-radius: 999px;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, .06);
}

.signal-dot--temperature { background: #f97316; }
.signal-dot--pressure { background: #22d3ee; }
.signal-dot--load { background: #4f8cff; }

.signal-monitor__chart {
    width: 100%;
    min-height: 120px;
    color: var(--readable-panel-muted);
}

.signal-grid path {
    fill: none;
    stroke: rgba(148, 163, 184, .24);
    stroke-width: 1;
}

.signal-threshold {
    fill: none;
    stroke: rgba(248, 113, 113, .88);
    stroke-width: 1.5;
    stroke-dasharray: 6 5;
}

.signal-threshold-label,
.signal-axis text {
    fill: currentColor;
    font-size: 10px;
    font-weight: 800;
}

.signal-line {
    fill: none;
    stroke-width: 4;
    stroke-linecap: round;
    stroke-linejoin: round;
    filter: drop-shadow(0 5px 10px rgba(15, 23, 42, .20));
}

.signal-line--temperature { stroke: #f97316; }
.signal-line--pressure { stroke: #22d3ee; }
.signal-line--load { stroke: #4f8cff; }

.resource-stack {
    display: grid;
    gap: .66rem;
    padding-top: .3rem;
}

.resource-stack--compact {
    gap: .52rem;
}

.resource-row {
    display: grid;
    gap: .32rem;
}

.resource-row__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .75rem;
    font-size: .78rem;
    line-height: 1.2;
}

.resource-row__head strong {
    color: var(--readable-panel-text);
    font-size: .84rem;
    font-weight: 900;
}

.resource-row__head span {
    color: var(--readable-panel-muted);
    font-weight: 800;
    text-align: right;
}

.resource-track {
    height: .62rem;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(148, 163, 184, .18);
    border: 1px solid rgba(148, 163, 184, .16);
}

.resource-fill {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #22c55e, #86efac);
}

.resource-row--watch .resource-fill {
    background: linear-gradient(90deg, #f59e0b, #fde68a);
}

.resource-row--plan .resource-fill {
    background: linear-gradient(90deg, #f97316, #fdba74);
}

.resource-fill--82 { width: 82%; }
.resource-fill--71 { width: 71%; }
.resource-fill--64 { width: 64%; }
.resource-fill--58 { width: 58%; }

.bars {
    display: flex;
    align-items: end;
    gap: .45rem;
    min-height: 132px;
    padding-top: .55rem;
}

.bar {
    flex: 1;
    border-radius: 10px 10px 6px 6px;
    background: linear-gradient(180deg, #84b8ff, #4f8cff);
    position: relative;
}

.bar::after {
    content: attr(data-label);
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -1.25rem;
    font-size: .8rem;
    color: var(--readable-panel-muted);
}

/* ========================================
   🔥 СТИЛИ ДЛЯ ТАБЛИЦ И КАРТОЧЕК
   ======================================== */
.trust-strip-wrap {
    border-bottom: 1px solid var(--border);
    color: #eef5ff;
    background:
        radial-gradient(circle at 85% 0%, rgba(34, 211, 238, .10), transparent 28%),
        rgba(6, 11, 20, .72);
    backdrop-filter: blur(12px);
}

.trust-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--home-card-inner-gap);
    padding: 1rem 0;
}

.trust-item {
    padding: .9rem 1rem;
    border-radius: 18px;
    border: 1px solid var(--industrial-border);
    background: var(--industrial-panel);
    box-shadow: var(--shadow-sm);
}

.trust-item {
    background:
        radial-gradient(circle at 10% 0%, rgba(34, 211, 238, .10), transparent 32%),
        linear-gradient(180deg, rgba(17, 27, 46, .90), rgba(9, 18, 32, .84));
    border-color: rgba(56, 189, 248, .22);
}

.trust-item-label {
    font-size: .8rem;
    color: #d8e7ff;
    text-transform: uppercase;
    letter-spacing: .06em;
    font-weight: 800;
    margin-bottom: .35rem;
}

.trust-item-value {
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.42;
    color: #eef5ff;
}

.sticky-subnav-wrap {
    position: sticky;
    top: var(--navbar-height);
    z-index: 900;
    backdrop-filter: blur(16px);
    background:
        linear-gradient(180deg, rgba(6, 11, 20, .94), rgba(6, 11, 20, .86));
    border-bottom: 1px solid rgba(56, 189, 248, .18);
}

[data-theme="light"] .sticky-subnav-wrap {
    background: rgba(255,255,255,.96);
}

.sticky-subnav {
    display: flex;
    gap: .5rem;
    overflow-x: auto;
    padding: .8rem 0;
    scrollbar-width: none;
}

.sticky-subnav::-webkit-scrollbar {
    display: none;
}

.subnav-link {
    flex: 0 0 auto;
    padding: .58rem .9rem;
    border-radius: 999px;
    font-size: .88rem;
    font-weight: 700;
    color: var(--text);
    border: 1px solid var(--industrial-border);
    background: rgba(15, 23, 42, .58);
    transition: var(--transition);
}

.subnav-link:hover,
.subnav-link.active {
    color: var(--text);
    border-color: var(--border-strong);
    background: rgba(255,255,255,.12);
}

/* Grid системы */
.card-grid-3,
.roles-grid,
.asset-grid,
.module-grid,
.economics-grid,
.steps-grid,
.contacts-grid,
.about-grid,
.mockup-showcase,
.integration-grid,
.pilot-grid,
.audience-grid,
.telemetry-grid,
.scenario-grid,
.readiness-grid,
.faq-grid {
    display: grid;
    gap: var(--home-card-gap);
    align-items: stretch;
}

.card-grid-3 { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.roles-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.asset-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.module-grid { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.economics-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.steps-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.contacts-grid { grid-template-columns: .9fr 1.1fr; }
.about-grid { grid-template-columns: 1fr 1fr; }
.mockup-showcase { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); }
.integration-grid { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.pilot-grid { grid-template-columns: 1.05fr .95fr; }
.audience-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.telemetry-grid { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
.scenario-grid { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.readiness-grid,
.faq-grid { grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); }

/* Landing SEO navigation marker: 20260625-public-seo-nav-v1 */
.seo-nav-section {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 12% 0%, rgba(34, 211, 238, .14), transparent 30%),
        radial-gradient(circle at 88% 12%, rgba(79, 140, 255, .16), transparent 34%),
        var(--industrial-page-bg);
    border-top: 1px solid var(--industrial-border);
    border-bottom: 1px solid var(--industrial-border);
}

.seo-nav-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        var(--industrial-line),
        var(--industrial-grid);
    background-size: auto, 56px 56px, 56px 56px;
    opacity: .24;
    pointer-events: none;
}

[data-theme="light"] .seo-nav-section::before {
    opacity: .22;
}

.seo-nav-section > .container {
    position: relative;
    z-index: 1;
}

.seo-nav-head {
    align-items: start;
}

.seo-nav-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    grid-auto-rows: minmax(clamp(332px, 24vw, 372px), auto);
    gap: var(--home-card-gap);
    align-items: stretch;
}

.seo-nav-card {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: clamp(332px, 24vw, 372px);
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: .78rem;
    box-sizing: border-box;
    padding: clamp(1.1rem, 1.45vw, 1.45rem);
    border-radius: 22px;
    border: 1px solid var(--industrial-border);
    background: var(--industrial-panel);
    box-shadow: var(--industrial-shadow);
    color: var(--text);
    transition: var(--transition);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

.seo-nav-card::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background:
        var(--industrial-line),
        radial-gradient(circle at 86% 8%, rgba(45, 212, 255, .10), transparent 32%);
    opacity: .24;
    pointer-events: none;
}

[data-theme="light"] .seo-nav-card::after {
    opacity: .17;
}

.seo-nav-card > * {
    position: relative;
    z-index: 1;
}

.seo-nav-card:hover,
.seo-nav-card:focus-visible {
    transform: translateY(-4px);
    border-color: var(--industrial-border-strong);
    box-shadow: var(--shadow-lg), 0 0 0 1px rgba(45, 212, 255, .08);
    background: var(--industrial-panel-hover);
}

.seo-nav-card__label {
    width: fit-content;
    padding: .36rem .62rem;
    border-radius: 999px;
    border: 1px solid rgba(79, 140, 255, .28);
    background: rgba(14, 116, 144, .22);
    color: #c7f9ff;
    font-size: .76rem;
    line-height: 1.2;
    font-weight: 800;
}

.seo-nav-card h3 {
    margin: 0;
    font-size: 1.06rem;
    line-height: 1.28;
    font-weight: 850;
    letter-spacing: 0;
    color: var(--text);
}

.seo-nav-card p {
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    color: var(--readable-text-soft);
    font-size: .94rem;
    line-height: 1.58;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
}

.seo-card-quick-links {
    position: relative;
    z-index: 5;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: .55rem;
    margin-top: auto;
    padding-top: .9rem;
    border-top: 1px solid rgba(79, 140, 255, .16);
    pointer-events: auto;
}

.seo-card-quick-links__label {
    color: var(--readable-text-soft);
    font-size: .76rem;
    font-weight: 850;
    line-height: 1.2;
    letter-spacing: 0;
    user-select: none;
}

.seo-card-link-chips {
    position: relative;
    z-index: 5;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    width: 100%;
    pointer-events: auto;
}

.seo-card-link-chip {
    position: relative;
    z-index: 6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 1 auto;
    min-height: 34px;
    pointer-events: auto;
    border: 1px solid rgba(79, 140, 255, .34);
    border-radius: 8px;
    padding: .42rem .7rem;
    background: rgba(239, 246, 255, .92);
    color: #1d4ed8;
    font-size: .84rem;
    font-weight: 800;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: 0 1px 0 rgba(15, 23, 42, .05);
    transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
    user-select: none;
}

.seo-card-link-chip--primary {
    border-color: rgba(22, 101, 216, .70);
    background: #dbeafe;
    color: #0f3f9e;
}

.seo-card-link-chip--secondary {
    border-color: rgba(37, 99, 235, .32);
    background: rgba(239, 246, 255, .92);
    color: #1d4ed8;
}

.seo-card-link-chip:hover,
.seo-card-link-chip:focus-visible {
    transform: translateY(-1px);
    border-color: var(--border-strong);
    background: rgba(79, 140, 255, .18);
    color: var(--text);
    box-shadow: 0 8px 20px rgba(15, 23, 42, .10);
    outline: none;
}

.seo-card-link-chip:focus-visible {
    outline: 3px solid rgba(79, 140, 255, .28);
    outline-offset: 2px;
}

.seo-nav-card--tires.tire-home-card {
    position: relative;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

.seo-nav-card--tires.tire-home-card:hover,
.seo-nav-card--tires.tire-home-card:focus-visible {
    border-color: var(--industrial-border-strong);
}

.seo-nav-card--tires.tire-home-card:focus-visible {
    outline: 3px solid rgba(79, 140, 255, .28);
    outline-offset: 3px;
}

.seo-nav-card--tires.tire-home-card .tire-home-card__badge {
    border-color: rgba(56, 189, 248, .32);
    background: rgba(14, 116, 144, .22);
    color: #c7f9ff;
}

.seo-nav-card--tires.tire-home-card .seo-nav-card__label,
.seo-nav-card--tires.tire-home-card h3 {
    user-select: none;
}

html[data-theme="dark"] .seo-nav-section,
[data-theme="dark"] .seo-nav-section {
    background:
        radial-gradient(circle at 12% 0%, rgba(34, 211, 238, .16), transparent 30%),
        radial-gradient(circle at 88% 12%, rgba(79, 140, 255, .18), transparent 34%),
        var(--industrial-page-bg);
    border-top-color: rgba(56, 189, 248, .18);
    border-bottom-color: rgba(56, 189, 248, .16);
}

html[data-theme="dark"] .seo-nav-card,
[data-theme="dark"] .seo-nav-card {
    border-color: var(--industrial-border);
    background: var(--industrial-panel);
    box-shadow: var(--industrial-shadow);
    color: var(--readable-text);
}

html[data-theme="dark"] .seo-nav-card:hover,
html[data-theme="dark"] .seo-nav-card:focus-visible,
[data-theme="dark"] .seo-nav-card:hover,
[data-theme="dark"] .seo-nav-card:focus-visible {
    border-color: var(--industrial-border-strong);
    background: var(--industrial-panel-hover);
}

html[data-theme="dark"] .seo-nav-card__label,
[data-theme="dark"] .seo-nav-card__label {
    border-color: rgba(56, 189, 248, .32);
    background: rgba(14, 116, 144, .24);
    color: #c7f9ff;
}

html[data-theme="dark"] .seo-nav-card h3,
[data-theme="dark"] .seo-nav-card h3 {
    color: var(--readable-text);
}

html[data-theme="dark"] .seo-nav-card p,
[data-theme="dark"] .seo-nav-card p {
    color: var(--readable-text-soft);
}

html[data-theme="dark"] .seo-nav-card--tires.tire-home-card:hover,
html[data-theme="dark"] .seo-nav-card--tires.tire-home-card:focus-visible,
[data-theme="dark"] .seo-nav-card--tires.tire-home-card:hover,
[data-theme="dark"] .seo-nav-card--tires.tire-home-card:focus-visible {
    border-color: var(--industrial-border-strong);
}

html[data-theme="dark"] .seo-nav-card--tires.tire-home-card .tire-home-card__badge,
[data-theme="dark"] .seo-nav-card--tires.tire-home-card .tire-home-card__badge {
    border-color: rgba(56, 189, 248, .32);
    background: rgba(14, 116, 144, .24);
    color: #c7f9ff;
}

html[data-theme="dark"] .seo-card-quick-links,
[data-theme="dark"] .seo-card-quick-links {
    border-top-color: rgba(56, 189, 248, .20);
}

html[data-theme="dark"] .seo-card-quick-links__label,
[data-theme="dark"] .seo-card-quick-links__label {
    color: var(--readable-text-soft);
}

html[data-theme="dark"] .seo-card-link-chip,
[data-theme="dark"] .seo-card-link-chip {
    border-color: rgba(56, 189, 248, .34);
    background: rgba(14, 116, 144, .22);
    color: #c7f9ff;
}

html[data-theme="dark"] .seo-card-link-chip--primary,
[data-theme="dark"] .seo-card-link-chip--primary {
    border-color: rgba(45, 212, 255, .58);
    background: rgba(14, 165, 233, .34);
    color: #ffffff;
}

html[data-theme="dark"] .seo-card-link-chip--secondary,
[data-theme="dark"] .seo-card-link-chip--secondary {
    border-color: rgba(56, 189, 248, .34);
    background: rgba(14, 116, 144, .22);
    color: #c7f9ff;
}

html[data-theme="dark"] .seo-card-link-chip:hover,
html[data-theme="dark"] .seo-card-link-chip:focus-visible,
[data-theme="dark"] .seo-card-link-chip:hover,
[data-theme="dark"] .seo-card-link-chip:focus-visible {
    border-color: rgba(45, 212, 255, .62);
    background: rgba(14, 165, 233, .22);
    color: #ffffff;
}

@media (max-width: 720px) {
    body {
        background-attachment: scroll;
    }

    .hero::after,
    .section:not(.seo-nav-section)::before,
    .section-sm:not(.seo-nav-section)::before,
    .seo-nav-section::before {
        opacity: .24;
    }

    .seo-nav-grid {
        grid-auto-rows: auto;
    }

    .seo-nav-card {
        min-height: 240px;
        height: auto;
    }
}

/* Landing content expansion marker: 20260625-scenarios-readiness-faq-v1 */
.scenario-card,
.telemetry-card,
.readiness-card,
.faq-card {
    min-height: 100%;
    display: flex;
    flex-direction: column;
}

.telemetry-card .card-text,
.scenario-card .card-text,
.readiness-card .card-text,
.faq-card .card-text {
    margin-top: 0;
}

.telemetry-flow {
    margin-top: var(--home-card-gap);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .7rem;
    padding: 1rem;
    border-radius: 20px;
    border: 1px solid var(--border);
    background:
        radial-gradient(circle at 0% 0%, rgba(79, 140, 255, .10), transparent 32%),
        linear-gradient(180deg, var(--surface) 0%, var(--surface-2) 100%);
    box-shadow: var(--shadow-sm);
}

.telemetry-flow span {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: .52rem .72rem;
    border-radius: 999px;
    border: 1px solid rgba(79, 140, 255, .24);
    background: rgba(79, 140, 255, .10);
    color: var(--text);
    font-size: .9rem;
    font-weight: 800;
}

.telemetry-flow i {
    color: var(--status-primary-text);
    font-size: .86rem;
}

.telemetry-note {
    margin-top: 1rem;
    max-width: 920px;
}

html[data-theme="dark"] .telemetry-flow,
[data-theme="dark"] .telemetry-flow {
    background:
        radial-gradient(circle at 0% 0%, rgba(34, 211, 238, .12), transparent 32%),
        linear-gradient(180deg, rgba(15, 23, 42, .88), rgba(8, 15, 28, .86));
    border-color: rgba(56, 189, 248, .18);
}

html[data-theme="dark"] .telemetry-flow span,
[data-theme="dark"] .telemetry-flow span {
    border-color: rgba(56, 189, 248, .28);
    background: rgba(14, 116, 144, .22);
    color: var(--readable-text);
}

.scenario-card .flow-list {
    margin-top: .75rem;
    gap: .72rem;
}

.scenario-card .flow-item {
    grid-template-columns: 34px 1fr;
    gap: .7rem;
}

.scenario-card .flow-number {
    width: 34px;
    height: 34px;
    border-radius: 11px;
    font-size: .9rem;
    box-shadow: var(--shadow-sm);
}

.scenario-result {
    margin-top: 1rem;
    padding: .85rem .95rem;
    border-radius: 16px;
    border: 1px solid var(--status-success-border);
    background: var(--status-success-bg);
    color: var(--status-success-text);
    font-weight: 800;
    line-height: 1.45;
}

.readiness-card .module-badge {
    min-width: 42px;
    justify-content: center;
}

.faq-card {
    background:
        linear-gradient(180deg, rgba(255,255,255,.082), rgba(255,255,255,.045)),
        radial-gradient(circle at 100% 0%, rgba(34, 211, 238, .08), transparent 30%);
}

.company-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(340px, .92fr);
    gap: var(--home-card-gap);
    align-items: stretch;
    min-width: 0;
}

/* Карточки */
.card,
.role-card,
.asset-card,
.module-card,
.economics-card,
.step-card,
.contact-card,
.about-card,
.integration-card,
.audience-card,
.pilot-card {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: var(--industrial-panel);
    border: 1px solid var(--industrial-border);
    border-radius: 24px;
    box-shadow: var(--industrial-shadow);
    transition: var(--transition);
    padding: var(--home-card-padding);
}

.card::after,
.role-card::after,
.asset-card::after,
.module-card::after,
.economics-card::after,
.step-card::after,
.contact-card::after,
.about-card::after,
.integration-card::after,
.audience-card::after,
.pilot-card::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: var(--industrial-line);
    opacity: .22;
    pointer-events: none;
}

[data-theme="light"] .card::after,
[data-theme="light"] .role-card::after,
[data-theme="light"] .asset-card::after,
[data-theme="light"] .module-card::after,
[data-theme="light"] .economics-card::after,
[data-theme="light"] .step-card::after,
[data-theme="light"] .contact-card::after,
[data-theme="light"] .about-card::after,
[data-theme="light"] .integration-card::after,
[data-theme="light"] .audience-card::after,
[data-theme="light"] .pilot-card::after {
    opacity: .16;
}

.card > *,
.role-card > *,
.asset-card > *,
.module-card > *,
.economics-card > *,
.step-card > *,
.contact-card > *,
.about-card > *,
.integration-card > *,
.audience-card > *,
.pilot-card > * {
    position: relative;
    z-index: 1;
}

.card:hover,
.role-card:hover,
.asset-card:hover,
.module-card:hover,
.economics-card:hover,
.step-card:hover,
.contact-card:hover,
.about-card:hover,
.integration-card:hover,
.audience-card:hover,
.pilot-card:hover {
    transform: translateY(-4px);
    border-color: var(--industrial-border-strong);
    box-shadow: var(--shadow-lg);
    background: var(--industrial-panel-hover);
}

.module-card {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.module-card .list {
    margin-top: auto;
    padding-top: 1rem;
}

.module-footer {
    margin-top: 1.1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--border);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    font-size: .88rem;
    font-weight: 800;
    color: var(--status-primary-text);
}

.icon-box {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(79,140,255,.22);
    color: var(--status-primary-text);
    border: 1px solid rgba(147,197,253,.32);
    margin-bottom: .95rem;
    font-size: 1.15rem;
}

.card-title {
    font-size: 1.18rem;
    font-weight: 800;
    line-height: 1.32;
    margin-bottom: .7rem;
}

.card-text {
    color: var(--readable-text-soft);
    font-size: 1rem;
    line-height: 1.62;
    max-width: 62ch;
}

.list {
    list-style: none;
    display: grid;
    gap: .5rem;
    margin-top: 1rem;
}

.list li {
    display: flex;
    gap: .55rem;
    align-items: flex-start;
    color: var(--readable-text-soft);
    font-size: .96rem;
    line-height: 1.48;
}

.list i {
    color: var(--primary);
    margin-top: .13rem;
}

/* Специфические компоненты */
.platform-layout,
.ops-layout {
    display: grid;
    grid-template-columns: 1.02fr .98fr;
    gap: var(--home-card-gap);
}

.flow-list {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
}

.flow-item {
    display: grid;
    grid-template-columns: 46px 1fr;
    gap: .85rem;
}

.flow-number {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--gradient-primary);
    color: #fff;
    font-weight: 900;
    box-shadow: var(--shadow-md);
}

.flow-title {
    font-weight: 800;
    margin-bottom: .2rem;
}

.flow-desc {
    color: var(--readable-text-soft);
    font-size: .98rem;
    line-height: 1.58;
}

.ops-list {
    display: grid;
    gap: .75rem;
    margin-top: 1rem;
}

.ops-item {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: .95rem;
    border-radius: 18px;
    background: rgba(255,255,255,.075);
    border: 1px solid rgba(203,213,225,.14);
    line-height: 1.58;
}

.ops-item i {
    color: var(--primary);
    margin-top: .12rem;
}

.ops-table {
    display: grid;
    gap: .7rem;
}

.ops-row {
    display: grid;
    grid-template-columns: 1.1fr .85fr .95fr .7fr;
    gap: .75rem;
    align-items: center;
    padding: .9rem 1rem;
    border-radius: 16px;
    background: rgba(255,255,255,.075);
    border: 1px solid rgba(203,213,225,.14);
}

.ops-row.head {
    background: transparent;
    border: 0;
    padding-top: 0;
    padding-bottom: 0;
    color: var(--readable-label);
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-weight: 800;
}

.ops-asset {
    font-size: .92rem;
    font-weight: 800;
}

.ops-asset-sub {
    display: block;
    color: var(--readable-panel-muted);
    font-size: .82rem;
    margin-top: .14rem;
    font-weight: 600;
}

/* Стили для ролей и аудитории */
.role-title {
    font-size: 1rem;
    font-weight: 800;
    margin-bottom: .45rem;
}

.role-desc {
    color: var(--readable-text-soft);
    font-size: .96rem;
    line-height: 1.55;
    margin-bottom: .8rem;
}

.role-focus {
    display: inline-flex;
    padding: .32rem .58rem;
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 800;
    background: rgba(79,140,255,.22);
    color: var(--status-primary-text);
    border: 1px solid rgba(147,197,253,.32);
}

.asset-label,
.module-badge,
.integration-badge,
.audience-badge,
.pilot-badge {
    display: inline-flex;
    padding: .34rem .62rem;
    border-radius: 999px;
    background: rgba(79,140,255,.22);
    border: 1px solid rgba(147,197,253,.32);
    color: var(--status-primary-text);
    font-size: .8rem;
    font-weight: 800;
    margin-bottom: .8rem;
}

.economics-card {
    text-align: center;
}

.economics-value {
    font-size: 2rem;
    line-height: 1;
    font-weight: 900;
    letter-spacing: 0;
    color: var(--status-primary-text);
    margin-bottom: .45rem;
}

.economics-title {
    font-weight: 800;
    margin-bottom: .4rem;
}

.economics-text {
    color: var(--readable-text-soft);
    font-size: .96rem;
    line-height: 1.55;
}

.step-card {
    position: relative;
    overflow: hidden;
}

.step-num {
    position: absolute;
    top: .9rem;
    right: .95rem;
    font-size: 2.5rem;
    line-height: 1;
    font-weight: 900;
    color: var(--readable-text-subtle);
    opacity: .24;
}

.step-title {
    font-size: 1.04rem;
    font-weight: 800;
    margin-bottom: .55rem;
    position: relative;
    z-index: 1;
}

.step-text {
    color: var(--readable-text-soft);
    font-size: .96rem;
    line-height: 1.55;
    position: relative;
    z-index: 1;
}

.about-highlight {
    background:
        radial-gradient(circle at 0% 0%, rgba(79,140,255,.18), transparent 26%),
        radial-gradient(circle at 100% 40%, rgba(123,97,255,.16), transparent 26%),
        linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.045));
}

.about-kpis {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .85rem;
    margin-top: 1rem;
}

.about-kpi {
    padding: 1rem;
    border-radius: 18px;
    background: rgba(255,255,255,.075);
    border: 1px solid rgba(203,213,225,.14);
    text-align: center;
}

.about-kpi strong {
    display: block;
    font-size: 1.45rem;
    font-weight: 900;
    color: var(--status-primary-text);
}

.about-kpi span {
    color: var(--readable-panel-muted);
    font-size: .9rem;
    line-height: 1.4;
}

.company-panel,
.company-status-panel,
.company-status-card {
    background:
        radial-gradient(circle at 0% 0%, rgba(79,140,255,.20), transparent 30%),
        radial-gradient(circle at 100% 25%, rgba(34,211,238,.12), transparent 28%),
        linear-gradient(180deg, rgba(255,255,255,.080), rgba(255,255,255,.046));
    border: 1px solid var(--border);
    border-radius: 24px;
    box-shadow: var(--shadow-sm);
    min-width: 0;
    overflow: hidden;
}

.company-panel {
    padding: var(--home-card-padding);
}

.company-main-card {
    align-self: stretch;
}

.company-kicker {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    max-width: 100%;
    padding: .36rem .65rem;
    border-radius: 999px;
    color: var(--status-primary-text);
    background: rgba(79,140,255,.22);
    border: 1px solid rgba(147,197,253,.34);
    font-size: .78rem;
    font-weight: 900;
    line-height: 1.35;
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-bottom: .9rem;
}

.company-panel-title {
    max-width: 780px;
    font-size: clamp(1.45rem, 2.2vw, 2.15rem);
    line-height: 1.18;
    font-weight: 900;
    letter-spacing: 0;
    margin-bottom: .8rem;
}

.company-panel-text {
    max-width: 820px;
    color: var(--readable-text-soft);
    font-size: 1.03rem;
    line-height: 1.66;
}

.company-facts-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--home-card-inner-gap);
    margin-top: var(--home-card-gap);
    min-width: 0;
}

.company-fact {
    min-height: 100%;
    min-width: 0;
    padding: var(--home-card-inner-gap);
    border-radius: 18px;
    border: 1px solid rgba(147,197,253,.22);
    background: rgba(255,255,255,.055);
}

.company-fact span {
    display: inline-flex;
    margin-bottom: .42rem;
    color: var(--readable-label);
    font-size: .78rem;
    line-height: 1.35;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.company-fact p {
    color: var(--readable-text-soft);
    font-size: .94rem;
    line-height: 1.55;
}

.company-status-panel {
    display: grid;
    align-self: stretch;
    grid-template-rows: auto minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--home-card-inner-gap);
    padding: var(--home-card-inner-gap);
    min-width: 0;
}

.company-status-panel__head {
    padding: .15rem .1rem .25rem;
}

.company-status-panel__head span {
    color: var(--readable-label);
    font-size: .82rem;
    line-height: 1.35;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.company-status-card {
    padding: var(--home-card-inner-gap);
    border-radius: 18px;
    background: rgba(255,255,255,.055);
    min-width: 0;
}

.company-status-panel .company-status-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.company-status-card--skolkovo {
    --skolkovo-digital: #b4ff0a;
    position: relative;
    overflow: hidden;
    grid-template-columns: 1fr;
    padding: var(--home-card-inner-gap);
    border-color: rgba(180, 255, 10, 0.32);
    background:
        radial-gradient(circle at 16% 0%, rgba(180, 255, 10, 0.16), transparent 34%),
        radial-gradient(circle at 100% 20%, rgba(79,140,255,.12), transparent 28%),
        linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.046));
}

.company-status-card__accent {
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: var(--skolkovo-digital);
    opacity: .9;
}

.company-status-card--skolkovo > :not(.company-status-card__accent) {
    position: relative;
    z-index: 1;
}

.company-status-card__head {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 1rem;
    margin-bottom: .7rem;
}

.company-status-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.company-status-card--skolkovo .company-status-logo--skolkovo {
    display: block;
    justify-content: flex-start;
    width: 220px;
    max-width: min(220px, 100%);
    min-height: 0;
    margin-top: 1.1rem;
    flex: 0 0 auto;
}

.company-status-card--skolkovo .company-status-logo--skolkovo img {
    display: block;
    width: 220px;
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

.company-status-badge {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    max-width: 100%;
    border: 1px solid rgba(180, 255, 10, 0.42);
    background: rgba(180, 255, 10, 0.10);
    color: var(--skolkovo-digital);
    border-radius: 999px;
    padding: .38rem .62rem;
    font-size: .78rem;
    font-weight: 900;
    line-height: 1.25;
    white-space: normal;
    overflow-wrap: anywhere;
}

.company-status-badge--neutral {
    color: var(--status-primary-text);
    background: rgba(79,140,255,.16);
    border-color: rgba(147,197,253,.28);
}

.company-status-title {
    font-size: 1.12rem;
    line-height: 1.3;
    font-weight: 900;
    margin-bottom: .35rem;
    overflow-wrap: anywhere;
    word-break: normal;
}

.company-status-text {
    color: var(--readable-text-soft);
    font-size: .94rem;
    line-height: 1.52;
    max-width: 100%;
}

.company-certificate {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    gap: .65rem;
    margin-top: 0;
    padding: var(--home-card-inner-gap);
    border-radius: 16px;
    border: 1px solid rgba(147,197,253,.28);
    background: rgba(6,11,20,.30);
    min-height: 100%;
    min-width: 0;
}

.company-certificate-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--home-card-inner-gap);
    align-items: stretch;
}

.company-certificate strong {
    color: var(--readable-text);
    font-size: .98rem;
    line-height: 1.42;
    max-width: 34rem;
}

.company-certificate span {
    color: var(--status-primary-text);
    font-size: .9rem;
    font-weight: 900;
    line-height: 1.4;
}

.company-certificate em {
    color: var(--readable-text-muted);
    font-size: .82rem;
    font-style: normal;
    font-weight: 900;
    line-height: 1.46;
}

.company-certificate-note {
    margin-top: .55rem;
    color: var(--readable-text-muted);
    font-size: .84rem;
    line-height: 1.45;
}

.company-certificate-link {
    width: fit-content;
    align-self: end;
    margin-top: .25rem;
    padding: .72rem .92rem;
    font-size: .9rem;
}

.company-status-card-certificate {
    grid-column: 1 / -1;
    display: grid;
    gap: var(--home-card-inner-gap);
    padding: var(--home-card-padding);
    border-color: rgba(147,197,253,.38);
}

.company-status-card-certificate .company-status-title {
    color: var(--readable-text);
    margin-top: .75rem;
    margin-bottom: 0;
}

.company-certificate-head {
    display: grid;
    grid-template-columns: minmax(260px, .68fr) minmax(0, 1fr);
    gap: var(--home-card-inner-gap);
    align-items: end;
}

.company-certificate-head .company-status-text {
    max-width: 760px;
    margin-left: auto;
}

.company-registry-note {
    display: grid;
    grid-template-columns: minmax(220px, .42fr) minmax(0, 1fr) auto;
    gap: .85rem;
    align-items: center;
    padding: .95rem 1rem;
    border-radius: 16px;
    border: 1px solid rgba(147,197,253,.24);
    background: rgba(79,140,255,.10);
}

.company-registry-note span {
    color: var(--status-primary-text);
    font-size: .82rem;
    font-weight: 900;
    line-height: 1.35;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.company-registry-note p {
    color: var(--readable-text-soft);
    font-size: .92rem;
    line-height: 1.45;
    margin: 0;
}

.company-registry-note a {
    color: var(--status-primary-text);
    font-size: .9rem;
    font-weight: 900;
    text-decoration: none;
    white-space: nowrap;
}

.company-registry-note a:hover {
    text-decoration: underline;
}

.integration-list,
.pilot-list {
    list-style: none;
    display: grid;
    gap: .6rem;
    margin-top: .9rem;
}

.integration-list li,
.pilot-list li {
    display: flex;
    align-items: flex-start;
    gap: .55rem;
    color: var(--readable-text-soft);
    font-size: .96rem;
    line-height: 1.5;
}

.integration-list i,
.pilot-list i {
    color: var(--primary);
    margin-top: .12rem;
}

.audience-metric {
    margin-top: .9rem;
    padding-top: .9rem;
    border-top: 1px solid var(--border);
    color: var(--readable-text-muted);
    font-size: .9rem;
    line-height: 1.5;
}

/* CTA секция */
.cta-section {
    padding-block: var(--home-section-y-sm);
}

.cta-card {
    background:
        radial-gradient(circle at 12% 12%, rgba(255,255,255,.08), transparent 26%),
        radial-gradient(circle at 88% 18%, rgba(255,255,255,.06), transparent 24%),
        var(--gradient-primary);
    color: #fff;
    border-radius: 32px;
    padding: clamp(1.5rem, 2.6vw, 2.2rem);
    box-shadow: var(--shadow-xl);
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    gap: var(--home-card-gap);
    align-items: center;
}

.cta-title {
    font-size: clamp(1.85rem, 2.9vw, 2.8rem);
    line-height: 1.14;
    font-weight: 900;
    letter-spacing: 0;
    margin-bottom: .8rem;
}

.cta-text {
    color: rgba(255,255,255,.92);
    max-width: 700px;
    font-size: 1.05rem;
    line-height: 1.65;
}

.cta-list {
    display: grid;
    gap: .7rem;
}

.cta-list-item {
    display: flex;
    gap: .7rem;
    align-items: center;
    color: rgba(255,255,255,.98);
    font-weight: 600;
}

.cta-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    margin-top: 1.2rem;
}

.cta-actions .btn {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.22);
    color: #fff;
}

.cta-actions .btn:hover {
    background: rgba(255,255,255,.2);
    transform: translateY(-1px);
}

/* Контакты и формы */
.contact-list {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
}

.contact-item {
    display: flex;
    align-items: flex-start;
    gap: .9rem;
}

.contact-icon {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(79,140,255,.22);
    border: 1px solid rgba(147,197,253,.32);
    color: var(--status-primary-text);
}

.contact-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    margin-top: 1rem;
}

.mini-action-btn {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .58rem .82rem;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: rgba(255,255,255,.075);
    color: var(--text);
    cursor: pointer;
    transition: var(--transition);
}

.mini-action-btn:hover {
    color: var(--text);
    border-color: var(--border-strong);
    transform: translateY(-1px);
}

.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .95rem;
}

.field-group {
    margin-bottom: .95rem;
}

.field-label {
    display: block;
    font-size: .9rem;
    color: var(--readable-label);
    font-weight: 700;
    margin-bottom: .38rem;
}

.field-input,
.field-textarea {
    width: 100%;
    border-radius: 16px;
    border: 1px solid var(--border);
    background: rgba(255,255,255,.075);
    color: var(--text);
    padding: .92rem 1rem;
    transition: var(--transition);
    font-size: 1rem;
    line-height: 1.5;
}

.field-input::placeholder,
.field-textarea::placeholder {
    color: var(--readable-placeholder);
    opacity: 1;
}

.field-input:focus,
.field-textarea:focus {
    border-color: rgba(79,140,255,.45);
    box-shadow: 0 0 0 4px rgba(79,140,255,.08);
    outline: none;
}

.field-textarea {
    min-height: 140px;
    resize: vertical;
}

.field-help {
    margin-top: .38rem;
    font-size: .84rem;
    color: var(--readable-text-muted);
    line-height: 1.45;
}

.field-input.is-invalid,
.field-textarea.is-invalid {
    border-color: rgba(239, 68, 68, 0.58);
    box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.08);
}

.quick-topics {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    margin-bottom: 1rem;
}

.topic-chip {
    padding: .48rem .72rem;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: rgba(255,255,255,.075);
    color: var(--text);
    font-size: .86rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--transition);
}

.topic-chip:hover,
.topic-chip.is-active {
    border-color: var(--border-strong);
    color: var(--text);
    transform: translateY(-1px);
    background: rgba(255,255,255,.12);
}

.form-note {
    margin-top: .9rem;
    color: var(--readable-text-muted);
    font-size: .88rem;
    line-height: 1.5;
}

.consent-label {
    display: flex;
    align-items: flex-start;
    gap: .55rem;
    color: var(--readable-text-soft);
    line-height: 1.45;
}

.consent-label a {
    color: var(--status-primary-text);
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.consent-label input {
    margin-top: .2rem;
    flex: 0 0 auto;
}

.consent-label input.is-invalid {
    outline: 3px solid rgba(239, 68, 68, 0.34);
    outline-offset: 2px;
}

.submit-state {
    opacity: .7;
    pointer-events: none;
}

.submit-spinner {
    width: 14px;
    height: 14px;
    border-radius: 999px;
    border: 2px solid rgba(255,255,255,.35);
    border-top-color: #fff;
    animation: spin .7s linear infinite;
}

/* Footer */
.footer {
    border-top: 1px solid var(--border);
    background: rgba(255,255,255,.055);
    padding: 2rem 0;
}

.footer-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.footer-text {
    color: var(--readable-text-soft);
    font-size: .9rem;
}

.footer-links {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.footer-links a {
    color: var(--readable-text-soft);
    font-size: .9rem;
    line-height: 1.45;
}

.footer-links a:hover {
    color: var(--text);
}

/* Floating actions */
.floating-actions {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    z-index: 1250;
    display: grid;
    gap: .65rem;
}

.floating-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    min-height: 48px;
    padding: .82rem 1rem;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: rgba(11, 18, 32, 0.94);
    backdrop-filter: blur(16px);
    color: var(--text);
    box-shadow: var(--shadow-lg);
    transition: var(--transition);
    cursor: pointer;
}

.floating-action:hover {
    transform: translateY(-2px);
    border-color: var(--border-strong);
}

.floating-action-primary {
    background: var(--gradient-primary);
    color: #fff;
    border-color: transparent;
}

/* Toast уведомления */
.toast-stack {
    position: fixed;
    right: 1rem;
    bottom: 5.4rem;
    z-index: 1300;
    display: grid;
    gap: .65rem;
    pointer-events: none;
}

.toast {
    min-width: 280px;
    max-width: 360px;
    padding: .9rem 1rem;
    border-radius: 18px;
    border: 1px solid var(--border);
    background: rgba(11, 18, 32, 0.96);
    color: var(--text);
    box-shadow: var(--shadow-xl);
    backdrop-filter: blur(18px);
    opacity: 0;
    transform: translateY(10px);
    transition: opacity .22s ease, transform .22s ease;
    pointer-events: auto;
}

[data-theme="light"] .toast {
    background: rgba(255, 255, 255, 0.96);
}

[data-theme="light"] .glass-shell,
[data-theme="light"] .mock-card,
[data-theme="light"] .feed-item,
[data-theme="light"] .trust-item,
[data-theme="light"] .card,
[data-theme="light"] .role-card,
[data-theme="light"] .asset-card,
[data-theme="light"] .module-card,
[data-theme="light"] .economics-card,
[data-theme="light"] .step-card,
[data-theme="light"] .contact-card,
[data-theme="light"] .company-panel,
[data-theme="light"] .company-status-panel,
[data-theme="light"] .company-status-card,
[data-theme="light"] .company-fact,
[data-theme="light"] .company-certificate,
[data-theme="light"] .about-card,
[data-theme="light"] .integration-card,
[data-theme="light"] .audience-card,
[data-theme="light"] .pilot-card,
[data-theme="light"] .ops-item,
[data-theme="light"] .ops-row,
[data-theme="light"] .about-kpi,
[data-theme="light"] .fleet-sidebar,
[data-theme="light"] .metric-tile,
[data-theme="light"] .oil-card,
[data-theme="light"] .component-card,
[data-theme="light"] .spares-card,
[data-theme="light"] .executive-card,
[data-theme="light"] .fleet-panel,
[data-theme="light"] .fleet-table-row,
[data-theme="light"] .spares-row,
[data-theme="light"] .feed-item-compact,
[data-theme="light"] .oil-stat,
[data-theme="light"] .exec-metric,
[data-theme="light"] .component-metric {
    background: var(--industrial-panel);
    border-color: var(--industrial-border);
    box-shadow: var(--industrial-shadow);
}

[data-theme="light"] .section-muted,
[data-theme="light"] .footer {
    background:
        radial-gradient(circle at 12% 0%, rgba(37, 99, 235, .11), transparent 30%),
        radial-gradient(circle at 86% 18%, rgba(14, 165, 233, .08), transparent 30%),
        linear-gradient(180deg, rgba(248, 251, 255, .96), rgba(238, 246, 255, .90));
    border-color: rgba(37, 99, 235, .16);
}

[data-theme="light"] .trust-strip-wrap {
    color: #0f172a;
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .045) 1px, transparent 1px),
        linear-gradient(180deg, rgba(14, 165, 233, .035) 1px, transparent 1px),
        radial-gradient(circle at 12% 0%, rgba(59, 130, 246, .12), transparent 30%),
        radial-gradient(circle at 85% 0%, rgba(34, 211, 238, .13), transparent 30%),
        linear-gradient(180deg, rgba(255, 255, 255, .90), rgba(239, 247, 255, .84));
    background-size: 56px 56px, 56px 56px, auto, auto, auto;
    border-color: rgba(37, 99, 235, .18);
}

[data-theme="light"] .trust-item {
    background:
        radial-gradient(circle at 10% 0%, rgba(37, 99, 235, .10), transparent 32%),
        linear-gradient(180deg, rgba(255, 255, 255, .92), rgba(248, 251, 255, .82));
    border-color: rgba(37, 99, 235, .20);
    box-shadow: 0 12px 28px rgba(15, 23, 42, .06), inset 0 1px 0 rgba(255, 255, 255, .84);
}

[data-theme="light"] .trust-item-label {
    color: #1e3a8a;
}

[data-theme="light"] .trust-item-value {
    color: #0f172a;
}

[data-theme="light"] .field-input,
[data-theme="light"] .field-textarea,
[data-theme="light"] .topic-chip,
[data-theme="light"] .mini-action-btn {
    background: rgba(255, 255, 255, .98);
    border-color: rgba(30, 58, 138, 0.22);
    color: var(--readable-text);
}

[data-theme="light"] .field-label,
[data-theme="light"] .consent-label {
    color: #1e293b;
}

[data-theme="light"] .field-help,
[data-theme="light"] .form-note {
    color: #334155;
}

[data-theme="light"] .module-footer,
[data-theme="light"] .consent-label a {
    color: #1d4ed8;
}

[data-theme="light"] .module-footer {
    display: inline-flex;
    width: fit-content;
    padding: .65rem .85rem;
    border: 1px solid #2563eb;
    border-radius: 999px;
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(29, 78, 216, 0.12);
    font-weight: 900;
}

[data-theme="light"] .module-footer i,
[data-theme="light"] .module-footer span {
    color: #1d4ed8;
}

[data-theme="light"] .subnav-link,
[data-theme="light"] .mobile-nav-link {
    background: rgba(37, 99, 235, 0.08);
    border-color: rgba(37, 99, 235, 0.22);
    color: #0f172a;
}

[data-theme="light"] .role-focus,
[data-theme="light"] .asset-label,
[data-theme="light"] .module-badge,
[data-theme="light"] .integration-badge,
[data-theme="light"] .audience-badge,
[data-theme="light"] .pilot-badge {
    align-self: flex-start;
    width: fit-content;
    max-width: 100%;
    background: #ffffff;
    color: #172554;
    border-color: #1d4ed8;
    box-shadow: 0 6px 14px rgba(29, 78, 216, 0.10);
    font-weight: 900;
}

[data-theme="light"] .company-panel,
[data-theme="light"] .company-status-panel,
[data-theme="light"] .company-status-card {
    background:
        radial-gradient(circle at 0% 0%, rgba(37,99,235,.06), transparent 30%),
        radial-gradient(circle at 100% 25%, rgba(14,165,233,.05), transparent 28%),
        rgba(255, 255, 255, .94);
    border-color: rgba(37, 99, 235, 0.16);
    box-shadow: 0 16px 38px rgba(15, 23, 42, .07);
}

[data-theme="light"] .company-certificate {
    background: #ffffff;
    border-color: rgba(37, 99, 235, 0.18);
}

[data-theme="light"] .company-registry-note {
    background: rgba(37, 99, 235, 0.06);
    border-color: rgba(37, 99, 235, 0.16);
}

[data-theme="light"] .company-fact {
    background: #ffffff;
    border-color: rgba(37, 99, 235, 0.16);
}

[data-theme="light"] .company-status-card--skolkovo {
    border-color: rgba(95, 137, 0, 0.30);
    background:
        radial-gradient(circle at 16% 0%, rgba(180, 255, 10, 0.18), transparent 34%),
        radial-gradient(circle at 100% 20%, rgba(37,99,235,.08), transparent 28%),
        #ffffff;
}

[data-theme="light"] .company-status-badge {
    color: #3f5f00;
}

[data-theme="light"] .company-status-badge--neutral {
    color: #172554;
}

[data-theme="light"] .mock-title,
[data-theme="light"] .panel-title,
[data-theme="light"] .metric-tile-label,
[data-theme="light"] .oil-stat-name,
[data-theme="light"] .exec-metric-label {
    color: #0f172a;
    font-weight: 900;
}

[data-theme="light"] .feed-meta,
[data-theme="light"] .sample-subtitle,
[data-theme="light"] .component-gauge-value span {
    color: #1e293b;
    font-weight: 700;
}

[data-theme="light"] .status-pill {
    background: var(--badge-neutral-bg);
    color: var(--badge-neutral-text);
    border: 2px solid var(--badge-neutral-border);
    font-weight: 900;
}

[data-theme="light"] .badge-warning {
    color: var(--status-warning-text);
    background: var(--status-warning-bg);
    border: 2px solid var(--status-warning-border);
    box-shadow: 0 4px 10px rgba(120, 53, 15, 0.10);
    font-weight: 900;
}

[data-theme="light"] .badge-danger {
    color: var(--status-danger-text);
    background: var(--status-danger-bg);
    border: 2px solid var(--status-danger-border);
    box-shadow: 0 4px 10px rgba(127, 29, 29, 0.10);
    font-weight: 900;
}

[data-theme="light"] .badge-success {
    color: var(--status-success-text);
    background: var(--status-success-bg);
    border: 2px solid var(--status-success-border);
    box-shadow: 0 4px 10px rgba(6, 78, 59, 0.10);
    font-weight: 900;
}

[data-theme="light"] .badge-primary {
    color: var(--status-primary-text);
    background: var(--status-primary-bg);
    border: 2px solid var(--status-primary-border);
    box-shadow: 0 4px 10px rgba(30, 58, 138, 0.10);
    font-weight: 900;
}

[data-theme="light"] .floating-action {
    background: #ffffff;
    color: #0f172a;
    border-color: #94a3b8;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.16);
    font-weight: 800;
}

[data-theme="light"] .floating-action i,
[data-theme="light"] .floating-action span {
    color: #0f172a;
}

[data-theme="light"] .floating-action-primary {
    background-color: #2563eb;
    background-image: linear-gradient(135deg, #2563eb 0%, #4f46e5 100%);
    color: #ffffff;
    border-color: transparent;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.28);
}

[data-theme="light"] .floating-action-primary i,
[data-theme="light"] .floating-action-primary span {
    color: #ffffff;
}

[data-theme="light"] .economics-value,
[data-theme="light"] .about-kpi strong {
    color: #1d4ed8;
}

[data-theme="light"] .bar::after,
[data-theme="light"] .fleet-table-row.head,
[data-theme="light"] .spares-row.head {
    color: #1e293b;
    font-weight: 900;
}

[data-theme="light"] .metric-tile-trend,
[data-theme="light"] .component-metric,
[data-theme="light"] .fleet-nav-item {
    color: #1e293b;
    font-weight: 700;
}

body[data-theme="light"],
html[data-theme="light"] body {
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .038) 1px, transparent 1px),
        linear-gradient(180deg, rgba(14, 165, 233, .030) 1px, transparent 1px),
        radial-gradient(circle at 12% 0%, rgba(37, 99, 235, .12), transparent 28%),
        radial-gradient(circle at 88% 6%, rgba(14, 165, 233, .10), transparent 30%),
        radial-gradient(circle at 54% 36%, rgba(79, 70, 229, .045), transparent 34%),
        linear-gradient(180deg, #eef6ff 0%, #fbfdff 34%, #f0f7ff 100%);
    background-size: 56px 56px, 56px 56px, auto, auto, auto, auto;
    background-attachment: fixed;
}

html[data-theme="light"] .navbar,
body[data-theme="light"] .navbar,
[data-theme="light"] .navbar {
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .035) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 255, 255, .92), rgba(239, 247, 255, .86));
    background-size: 56px 56px, auto;
    border-bottom-color: rgba(37, 99, 235, .18);
    box-shadow: 0 12px 34px rgba(15, 23, 42, .07), inset 0 1px 0 rgba(255, 255, 255, .92);
    backdrop-filter: blur(20px) saturate(1.14);
}

html[data-theme="light"] .nav-link:hover,
html[data-theme="light"] .nav-link.active,
body[data-theme="light"] .nav-link:hover,
body[data-theme="light"] .nav-link.active,
[data-theme="light"] .nav-link:hover,
[data-theme="light"] .nav-link.active {
    background: rgba(37, 99, 235, .09);
    box-shadow: inset 0 0 0 1px rgba(37, 99, 235, .16);
    color: #0f172a;
}

html[data-theme="light"] .theme-toggle,
html[data-theme="light"] .menu-toggle,
body[data-theme="light"] .theme-toggle,
body[data-theme="light"] .menu-toggle,
[data-theme="light"] .theme-toggle,
[data-theme="light"] .menu-toggle {
    background: rgba(255, 255, 255, .82);
    border-color: rgba(37, 99, 235, .20);
    box-shadow: 0 10px 24px rgba(15, 23, 42, .06), inset 0 1px 0 rgba(255, 255, 255, .9);
}

html[data-theme="light"] .section-title,
body[data-theme="light"] .section-title,
[data-theme="light"] .section-title,
html[data-theme="light"] .card-title,
body[data-theme="light"] .card-title,
[data-theme="light"] .card-title {
    color: #071a33;
}

html[data-theme="light"] .section-subtitle,
body[data-theme="light"] .section-subtitle,
[data-theme="light"] .section-subtitle,
html[data-theme="light"] .card-text,
body[data-theme="light"] .card-text,
[data-theme="light"] .card-text,
html[data-theme="light"] .list li,
body[data-theme="light"] .list li,
[data-theme="light"] .list li {
    color: #253247;
}

html[data-theme="light"] .btn-primary,
body[data-theme="light"] .btn-primary,
[data-theme="light"] .btn-primary {
    background: linear-gradient(135deg, #155ee8 0%, #2563eb 46%, #0891b2 100%);
    box-shadow: 0 16px 34px rgba(37, 99, 235, .28), inset 0 1px 0 rgba(255, 255, 255, .20);
}

html[data-theme="light"] .btn-primary:hover,
body[data-theme="light"] .btn-primary:hover,
[data-theme="light"] .btn-primary:hover {
    box-shadow: 0 20px 42px rgba(37, 99, 235, .34), 0 0 0 1px rgba(14, 165, 233, .20);
}

html[data-theme="light"] .btn-secondary,
body[data-theme="light"] .btn-secondary,
[data-theme="light"] .btn-secondary,
html[data-theme="light"] .btn-ghost,
body[data-theme="light"] .btn-ghost,
[data-theme="light"] .btn-ghost {
    background: rgba(255, 255, 255, .78);
    border-color: rgba(37, 99, 235, .22);
    box-shadow: 0 10px 24px rgba(15, 23, 42, .06), inset 0 1px 0 rgba(255, 255, 255, .86);
}

html[data-theme="light"] .hero-title,
body[data-theme="light"] .hero-title,
[data-theme="light"] .hero-title {
    color: #071a33;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .70);
}

html[data-theme="light"] .hero-title-accent,
body[data-theme="light"] .hero-title-accent,
[data-theme="light"] .hero-title-accent {
    background: linear-gradient(135deg, #0f4fc8 0%, #0e7490 48%, #2563eb 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

html[data-theme="light"] .hero-subtitle,
body[data-theme="light"] .hero-subtitle,
[data-theme="light"] .hero-subtitle {
    color: #243044;
}

html[data-theme="light"] .hero-grid > :first-child,
body[data-theme="light"] .hero-grid > :first-child,
[data-theme="light"] .hero-grid > :first-child {
    background:
        linear-gradient(124deg, rgba(255, 255, 255, .88), rgba(255, 255, 255, .62) 54%, rgba(219, 234, 254, .40)),
        radial-gradient(circle at 4% 0%, rgba(14, 165, 233, .10), transparent 34%),
        radial-gradient(circle at 100% 16%, rgba(37, 99, 235, .08), transparent 32%);
    border-color: rgba(37, 99, 235, .16);
    box-shadow: 0 22px 58px rgba(15, 23, 42, .07), inset 0 1px 0 rgba(255, 255, 255, .90);
}

html[data-theme="light"] .glass-shell,
body[data-theme="light"] .glass-shell,
[data-theme="light"] .glass-shell {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .82), rgba(219, 234, 254, .46)),
        radial-gradient(circle at 12% 0%, rgba(14, 165, 233, .16), transparent 34%),
        radial-gradient(circle at 88% 20%, rgba(37, 99, 235, .13), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(240, 247, 255, .88));
    border-color: rgba(37, 99, 235, .24);
    box-shadow: 0 28px 78px rgba(15, 23, 42, .14), 0 0 0 1px rgba(255, 255, 255, .75) inset;
}

html[data-theme="light"] .ui-window,
body[data-theme="light"] .ui-window,
[data-theme="light"] .ui-window {
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .032) 1px, transparent 1px),
        linear-gradient(180deg, rgba(14, 165, 233, .026) 1px, transparent 1px),
        radial-gradient(circle at 8% 0%, rgba(37, 99, 235, .10), transparent 30%),
        radial-gradient(circle at 96% 12%, rgba(14, 165, 233, .09), transparent 32%),
        linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(244, 249, 255, .92));
    background-size: 44px 44px, 44px 44px, auto, auto, auto;
    border-color: rgba(37, 99, 235, .22);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .92), 0 18px 42px rgba(15, 23, 42, .09);
}

html[data-theme="light"] .ui-window::before,
body[data-theme="light"] .ui-window::before,
[data-theme="light"] .ui-window::before {
    background:
        radial-gradient(circle, rgba(37, 99, 235, .55) 0 28%, transparent 30%) 0 50% / 18px 10px no-repeat,
        radial-gradient(circle, rgba(14, 165, 233, .42) 0 28%, transparent 30%) 50% 50% / 18px 10px no-repeat,
        radial-gradient(circle, rgba(99, 102, 241, .32) 0 28%, transparent 30%) 100% 50% / 18px 10px no-repeat;
}

html[data-theme="light"] .mock-card,
html[data-theme="light"] .feed-item,
body[data-theme="light"] .mock-card,
body[data-theme="light"] .feed-item,
[data-theme="light"] .mock-card,
[data-theme="light"] .feed-item {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .92), rgba(248, 251, 255, .84));
    border-color: rgba(37, 99, 235, .18);
}

html[data-theme="light"] .sticky-subnav-wrap,
body[data-theme="light"] .sticky-subnav-wrap,
[data-theme="light"] .sticky-subnav-wrap {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .86), rgba(239, 247, 255, .78));
    border-bottom-color: rgba(37, 99, 235, .18);
    box-shadow: 0 12px 32px rgba(15, 23, 42, .055);
    backdrop-filter: blur(18px) saturate(1.12);
}

html[data-theme="light"] .seo-nav-card__label,
body[data-theme="light"] .seo-nav-card__label,
[data-theme="light"] .seo-nav-card__label,
html[data-theme="light"] .seo-nav-card--tires.tire-home-card .tire-home-card__badge,
body[data-theme="light"] .seo-nav-card--tires.tire-home-card .tire-home-card__badge,
[data-theme="light"] .seo-nav-card--tires.tire-home-card .tire-home-card__badge {
    display: inline-flex;
    align-items: center;
    gap: .48rem;
    background: linear-gradient(180deg, rgba(255, 255, 255, .92), rgba(226, 239, 255, .76));
    border-color: rgba(37, 99, 235, .24);
    color: #1d4ed8;
    box-shadow:
        0 8px 20px rgba(37, 99, 235, .10),
        0 1px 0 rgba(255, 255, 255, .82) inset;
}

html[data-theme="light"] .seo-nav-card__label::before,
body[data-theme="light"] .seo-nav-card__label::before,
[data-theme="light"] .seo-nav-card__label::before,
html[data-theme="light"] .seo-nav-card--tires.tire-home-card .tire-home-card__badge::before,
body[data-theme="light"] .seo-nav-card--tires.tire-home-card .tire-home-card__badge::before,
[data-theme="light"] .seo-nav-card--tires.tire-home-card .tire-home-card__badge::before {
    content: "";
    flex: 0 0 auto;
    width: .48rem;
    height: .48rem;
    border-radius: 999px;
    background: linear-gradient(135deg, #4f8cff, #22d3ee);
    box-shadow: 0 0 12px rgba(34, 211, 238, .42);
}

html[data-theme="light"] .card,
html[data-theme="light"] .role-card,
html[data-theme="light"] .asset-card,
html[data-theme="light"] .module-card,
html[data-theme="light"] .economics-card,
html[data-theme="light"] .step-card,
html[data-theme="light"] .contact-card,
html[data-theme="light"] .about-card,
html[data-theme="light"] .integration-card,
html[data-theme="light"] .audience-card,
html[data-theme="light"] .pilot-card,
body[data-theme="light"] .card,
body[data-theme="light"] .role-card,
body[data-theme="light"] .asset-card,
body[data-theme="light"] .module-card,
body[data-theme="light"] .economics-card,
body[data-theme="light"] .step-card,
body[data-theme="light"] .contact-card,
body[data-theme="light"] .about-card,
body[data-theme="light"] .integration-card,
body[data-theme="light"] .audience-card,
body[data-theme="light"] .pilot-card,
[data-theme="light"] .card,
[data-theme="light"] .role-card,
[data-theme="light"] .asset-card,
[data-theme="light"] .module-card,
[data-theme="light"] .economics-card,
[data-theme="light"] .step-card,
[data-theme="light"] .contact-card,
[data-theme="light"] .about-card,
[data-theme="light"] .integration-card,
[data-theme="light"] .audience-card,
[data-theme="light"] .pilot-card,
html[data-theme="light"] .seo-nav-card,
body[data-theme="light"] .seo-nav-card,
[data-theme="light"] .seo-nav-card {
    background: var(--industrial-panel);
    border-color: var(--industrial-border);
    box-shadow: var(--industrial-shadow);
}

html[data-theme="light"] .card:hover,
html[data-theme="light"] .role-card:hover,
html[data-theme="light"] .asset-card:hover,
html[data-theme="light"] .module-card:hover,
html[data-theme="light"] .economics-card:hover,
html[data-theme="light"] .step-card:hover,
html[data-theme="light"] .contact-card:hover,
html[data-theme="light"] .about-card:hover,
html[data-theme="light"] .integration-card:hover,
html[data-theme="light"] .audience-card:hover,
html[data-theme="light"] .pilot-card:hover,
html[data-theme="light"] .seo-nav-card:hover,
html[data-theme="light"] .seo-nav-card:focus-visible,
body[data-theme="light"] .card:hover,
body[data-theme="light"] .role-card:hover,
body[data-theme="light"] .asset-card:hover,
body[data-theme="light"] .module-card:hover,
body[data-theme="light"] .economics-card:hover,
body[data-theme="light"] .step-card:hover,
body[data-theme="light"] .contact-card:hover,
body[data-theme="light"] .about-card:hover,
body[data-theme="light"] .integration-card:hover,
body[data-theme="light"] .audience-card:hover,
body[data-theme="light"] .pilot-card:hover,
body[data-theme="light"] .seo-nav-card:hover,
body[data-theme="light"] .seo-nav-card:focus-visible,
[data-theme="light"] .card:hover,
[data-theme="light"] .role-card:hover,
[data-theme="light"] .asset-card:hover,
[data-theme="light"] .module-card:hover,
[data-theme="light"] .economics-card:hover,
[data-theme="light"] .step-card:hover,
[data-theme="light"] .contact-card:hover,
[data-theme="light"] .about-card:hover,
[data-theme="light"] .integration-card:hover,
[data-theme="light"] .audience-card:hover,
[data-theme="light"] .pilot-card:hover,
[data-theme="light"] .seo-nav-card:hover,
[data-theme="light"] .seo-nav-card:focus-visible {
    border-color: var(--industrial-border-strong);
    box-shadow: 0 28px 68px rgba(15, 23, 42, .14), 0 0 0 1px rgba(14, 165, 233, .12);
}

html[data-theme="light"] .role-focus,
html[data-theme="light"] .asset-label,
html[data-theme="light"] .module-badge,
html[data-theme="light"] .integration-badge,
html[data-theme="light"] .audience-badge,
html[data-theme="light"] .pilot-badge,
body[data-theme="light"] .role-focus,
body[data-theme="light"] .asset-label,
body[data-theme="light"] .module-badge,
body[data-theme="light"] .integration-badge,
body[data-theme="light"] .audience-badge,
body[data-theme="light"] .pilot-badge,
[data-theme="light"] .role-focus,
[data-theme="light"] .asset-label,
[data-theme="light"] .module-badge,
[data-theme="light"] .integration-badge,
[data-theme="light"] .audience-badge,
[data-theme="light"] .pilot-badge {
    background: linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(239, 246, 255, .90));
    color: #173b8f;
    border-color: rgba(37, 99, 235, .32);
}

html[data-theme="light"] .cta-card,
body[data-theme="light"] .cta-card,
[data-theme="light"] .cta-card {
    background:
        radial-gradient(circle at 12% 12%, rgba(255, 255, 255, .20), transparent 28%),
        radial-gradient(circle at 88% 18%, rgba(34, 211, 238, .20), transparent 24%),
        linear-gradient(135deg, #155ee8 0%, #2563eb 48%, #0e7490 100%);
    box-shadow: 0 30px 84px rgba(37, 99, 235, .26), inset 0 1px 0 rgba(255, 255, 255, .22);
}

html[data-theme="light"] .field-input,
html[data-theme="light"] .field-textarea,
body[data-theme="light"] .field-input,
body[data-theme="light"] .field-textarea,
[data-theme="light"] .field-input,
[data-theme="light"] .field-textarea {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 251, 255, .94));
    border-color: rgba(37, 99, 235, .22);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .90);
}

html[data-theme="light"] .field-input:focus,
html[data-theme="light"] .field-textarea:focus,
body[data-theme="light"] .field-input:focus,
body[data-theme="light"] .field-textarea:focus,
[data-theme="light"] .field-input:focus,
[data-theme="light"] .field-textarea:focus {
    border-color: rgba(37, 99, 235, .54);
    box-shadow: 0 0 0 4px rgba(37, 99, 235, .11), 0 12px 26px rgba(15, 23, 42, .06);
}

html[data-theme="light"] .topic-chip:hover,
html[data-theme="light"] .topic-chip.is-active,
body[data-theme="light"] .topic-chip:hover,
body[data-theme="light"] .topic-chip.is-active,
[data-theme="light"] .topic-chip:hover,
[data-theme="light"] .topic-chip.is-active {
    background: rgba(219, 234, 254, .92);
    border-color: rgba(37, 99, 235, .38);
}

html[data-theme="light"] .footer,
body[data-theme="light"] .footer,
[data-theme="light"] .footer {
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .035) 1px, transparent 1px),
        radial-gradient(circle at 16% 0%, rgba(37, 99, 235, .10), transparent 32%),
        radial-gradient(circle at 84% 24%, rgba(14, 165, 233, .08), transparent 32%),
        linear-gradient(180deg, rgba(248, 251, 255, .96), rgba(230, 240, 255, .92));
    background-size: 56px 56px, auto, auto, auto;
    border-top-color: rgba(37, 99, 235, .18);
}

html[data-theme="light"] .floating-action,
body[data-theme="light"] .floating-action,
[data-theme="light"] .floating-action {
    background: rgba(255, 255, 255, .88);
    border-color: rgba(37, 99, 235, .22);
    box-shadow: 0 16px 34px rgba(15, 23, 42, .14), inset 0 1px 0 rgba(255, 255, 255, .90);
    backdrop-filter: blur(16px);
}

html[data-theme="light"] .floating-action:hover,
body[data-theme="light"] .floating-action:hover,
[data-theme="light"] .floating-action:hover {
    border-color: rgba(37, 99, 235, .36);
    box-shadow: 0 20px 42px rgba(15, 23, 42, .16), 0 0 0 1px rgba(14, 165, 233, .12);
}

/* Final light premium industrial visual system. */
body[data-theme="light"],
html[data-theme="light"] body {
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .054) 1px, transparent 1px),
        linear-gradient(180deg, rgba(14, 165, 233, .044) 1px, transparent 1px),
        linear-gradient(180deg, transparent 0 16%, rgba(14, 165, 233, .072) 16% 16.26%, transparent 16.26% 42%, rgba(37, 99, 235, .058) 42% 42.22%, transparent 42.22% 100%),
        radial-gradient(circle at 10% 0%, rgba(37, 99, 235, .18), transparent 30%),
        radial-gradient(circle at 88% 7%, rgba(14, 165, 233, .16), transparent 32%),
        radial-gradient(circle at 54% 38%, rgba(79, 70, 229, .075), transparent 36%),
        linear-gradient(180deg, #eaf5ff 0%, #fbfdff 30%, #edf7ff 100%);
    background-size: 52px 52px, 52px 52px, auto, auto, auto, auto, auto;
    background-attachment: fixed;
}

html[data-theme="light"] main,
body[data-theme="light"] main,
[data-theme="light"] main {
    background:
        radial-gradient(circle at 8% 12%, rgba(37, 99, 235, .075), transparent 28%),
        radial-gradient(circle at 92% 18%, rgba(14, 165, 233, .065), transparent 30%),
        linear-gradient(180deg, rgba(255, 255, 255, .34), rgba(235, 245, 255, .44));
    color: #0f172a;
}

html[data-theme="light"] .section,
html[data-theme="light"] .section-sm,
body[data-theme="light"] .section,
body[data-theme="light"] .section-sm,
[data-theme="light"] .section,
[data-theme="light"] .section-sm {
    background:
        linear-gradient(115deg, transparent 0 62%, rgba(37, 99, 235, .052) 62% 62.18%, transparent 62.18% 100%),
        radial-gradient(circle at 12% 0%, rgba(37, 99, 235, .070), transparent 30%),
        radial-gradient(circle at 88% 10%, rgba(14, 165, 233, .058), transparent 32%),
        linear-gradient(180deg, rgba(255, 255, 255, .78), rgba(239, 247, 255, .62));
    color: #0f172a;
}

html[data-theme="light"] .section-muted,
body[data-theme="light"] .section-muted,
[data-theme="light"] .section-muted {
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .050) 1px, transparent 1px),
        linear-gradient(180deg, rgba(14, 165, 233, .040) 1px, transparent 1px),
        radial-gradient(circle at 12% 0%, rgba(37, 99, 235, .15), transparent 31%),
        radial-gradient(circle at 88% 10%, rgba(14, 165, 233, .13), transparent 32%),
        linear-gradient(180deg, #edf7ff 0%, #f9fcff 58%, #eaf4ff 100%);
    background-size: 52px 52px, 52px 52px, auto, auto, auto;
    border-color: rgba(37, 99, 235, .22);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .86);
}

html[data-theme="light"] .section:not(.seo-nav-section)::before,
html[data-theme="light"] .section-sm:not(.seo-nav-section)::before,
body[data-theme="light"] .section:not(.seo-nav-section)::before,
body[data-theme="light"] .section-sm:not(.seo-nav-section)::before,
[data-theme="light"] .section:not(.seo-nav-section)::before,
[data-theme="light"] .section-sm:not(.seo-nav-section)::before {
    background:
        linear-gradient(115deg, transparent 0 58%, rgba(37, 99, 235, .070) 58% 58.22%, transparent 58.22% 100%),
        linear-gradient(180deg, transparent 0 36%, rgba(14, 165, 233, .070) 36% 36.22%, transparent 36.22% 100%),
        var(--industrial-grid);
    background-size: auto, auto, 60px 60px, 60px 60px;
    opacity: .22;
    pointer-events: none;
}

html[data-theme="light"] .seo-nav-section,
body[data-theme="light"] .seo-nav-section,
[data-theme="light"] .seo-nav-section {
    background:
        radial-gradient(circle at 12% 8%, rgba(79, 140, 255, .16), transparent 28%),
        radial-gradient(circle at 86% 18%, rgba(34, 211, 238, .12), transparent 24%),
        linear-gradient(90deg, rgba(37, 99, 235, .055) 1px, transparent 1px),
        linear-gradient(180deg, rgba(37, 99, 235, .045) 1px, transparent 1px),
        linear-gradient(115deg, transparent 0 62%, rgba(79, 140, 255, .080) 62% 62.22%, transparent 62.22% 100%),
        linear-gradient(180deg, #f7fbff 0%, #edf6ff 52%, #f8fbff 100%);
    background-size: auto, auto, 72px 72px, 72px 72px, auto, auto;
    border-top-color: rgba(37, 99, 235, .22);
    border-bottom-color: rgba(37, 99, 235, .22);
}

html[data-theme="light"] .navbar,
body[data-theme="light"] .navbar,
[data-theme="light"] .navbar {
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .046) 1px, transparent 1px),
        radial-gradient(circle at 12% 0%, rgba(37, 99, 235, .12), transparent 28%),
        linear-gradient(180deg, rgba(255, 255, 255, .94), rgba(232, 244, 255, .88));
    background-size: 52px 52px, auto, auto;
    border-bottom-color: rgba(37, 99, 235, .26);
    box-shadow: 0 18px 46px rgba(15, 23, 42, .105), inset 0 1px 0 rgba(255, 255, 255, .96);
    backdrop-filter: blur(24px) saturate(1.22);
}

html[data-theme="light"] .hero,
body[data-theme="light"] .hero,
[data-theme="light"] .hero {
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .070) 1px, transparent 1px),
        linear-gradient(180deg, rgba(14, 165, 233, .056) 1px, transparent 1px),
        linear-gradient(180deg, transparent 0 17%, rgba(14, 165, 233, .13) 17% 17.38%, transparent 17.38% 43%, rgba(59, 130, 246, .095) 43% 43.28%, transparent 43.28% 100%),
        radial-gradient(circle at 8% 8%, rgba(37, 99, 235, .24), transparent 30%),
        radial-gradient(circle at 88% 11%, rgba(14, 165, 233, .22), transparent 32%),
        radial-gradient(circle at 58% 86%, rgba(79, 70, 229, .11), transparent 30%),
        linear-gradient(180deg, #f4fbff 0%, #e7f5ff 54%, #f9fcff 100%);
    background-size: 52px 52px, 52px 52px, auto, auto, auto, auto, auto;
    border-bottom-color: rgba(37, 99, 235, .26);
}

html[data-theme="light"] .hero::before,
body[data-theme="light"] .hero::before,
[data-theme="light"] .hero::before {
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .072) 1px, transparent 1px),
        linear-gradient(180deg, rgba(14, 165, 233, .058) 1px, transparent 1px),
        linear-gradient(180deg, transparent 0 24%, rgba(14, 165, 233, .14) 24% 24.46%, transparent 24.46% 64%, rgba(59, 130, 246, .105) 64% 64.32%, transparent 64.32% 100%),
        radial-gradient(circle at 18% 22%, rgba(37, 99, 235, .15), transparent 0 28%),
        radial-gradient(circle at 82% 18%, rgba(14, 165, 233, .13), transparent 0 27%);
    background-size: 60px 60px, 60px 60px, auto, auto, auto;
    opacity: .84;
    pointer-events: none;
    z-index: 0;
}

html[data-theme="light"] .hero::after,
body[data-theme="light"] .hero::after,
[data-theme="light"] .hero::after {
    background:
        radial-gradient(circle at 70% 18%, rgba(14, 165, 233, .18), transparent 27%),
        radial-gradient(circle at 20% 74%, rgba(59, 130, 246, .13), transparent 29%),
        linear-gradient(116deg, transparent 0 57%, rgba(37, 99, 235, .16) 57% 57.24%, transparent 57.24% 100%),
        linear-gradient(132deg, transparent 0 71%, rgba(14, 165, 233, .11) 71% 71.18%, transparent 71.18% 100%),
        linear-gradient(180deg, rgba(255, 255, 255, .68), rgba(255, 255, 255, .22) 42%, transparent 72%);
    opacity: .68;
    pointer-events: none;
    z-index: 0;
}

html[data-theme="light"] .hero-title,
body[data-theme="light"] .hero-title,
[data-theme="light"] .hero-title {
    color: #061a33;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .86), 0 20px 52px rgba(37, 99, 235, .13);
}

html[data-theme="light"] .hero-title-accent,
body[data-theme="light"] .hero-title-accent,
[data-theme="light"] .hero-title-accent {
    color: #1d4ed8;
    background: linear-gradient(135deg, #1e40af 0%, #4f8cff 26%, #7b61ff 50%, #22d3ee 74%, #0369a1 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: saturate(1.28) contrast(1.22) drop-shadow(0 8px 18px rgba(79, 140, 255, .22));
    text-shadow: 0 1px 0 rgba(255, 255, 255, .45), 0 1px 1px rgba(30, 64, 175, .22), 0 10px 28px rgba(79, 140, 255, .28), 0 18px 44px rgba(34, 211, 238, .18);
}

html[data-theme="light"] .hero-grid > :first-child,
body[data-theme="light"] .hero-grid > :first-child,
[data-theme="light"] .hero-grid > :first-child {
    background:
        linear-gradient(124deg, rgba(255, 255, 255, .95), rgba(255, 255, 255, .76) 54%, rgba(219, 234, 254, .54)),
        radial-gradient(circle at 4% 0%, rgba(14, 165, 233, .16), transparent 34%),
        radial-gradient(circle at 100% 16%, rgba(37, 99, 235, .13), transparent 32%);
    border-color: rgba(37, 99, 235, .24);
    box-shadow: 0 30px 78px rgba(15, 23, 42, .11), inset 0 1px 0 rgba(255, 255, 255, .94), 0 0 0 7px rgba(37, 99, 235, .032);
    backdrop-filter: blur(14px) saturate(1.12);
}

html[data-theme="light"] .glass-shell,
body[data-theme="light"] .glass-shell,
[data-theme="light"] .glass-shell {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .94), rgba(219, 234, 254, .58)),
        radial-gradient(circle at 12% 0%, rgba(14, 165, 233, .23), transparent 34%),
        radial-gradient(circle at 88% 20%, rgba(37, 99, 235, .20), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, .99), rgba(232, 242, 255, .94));
    border-color: rgba(37, 99, 235, .34);
    box-shadow: 0 38px 104px rgba(15, 23, 42, .20), 0 0 0 1px rgba(255, 255, 255, .92) inset, 0 0 0 8px rgba(37, 99, 235, .040);
}

html[data-theme="light"] .ui-window,
body[data-theme="light"] .ui-window,
[data-theme="light"] .ui-window {
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .052) 1px, transparent 1px),
        linear-gradient(180deg, rgba(14, 165, 233, .040) 1px, transparent 1px),
        radial-gradient(circle at 8% 0%, rgba(37, 99, 235, .16), transparent 30%),
        radial-gradient(circle at 96% 12%, rgba(14, 165, 233, .14), transparent 32%),
        linear-gradient(180deg, rgba(255, 255, 255, .99), rgba(236, 247, 255, .95));
    background-size: 40px 40px, 40px 40px, auto, auto, auto;
    border-color: rgba(37, 99, 235, .32);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .96), inset 0 -22px 54px rgba(37, 99, 235, .052), 0 28px 70px rgba(15, 23, 42, .15);
}

html[data-theme="light"] .mock-card,
html[data-theme="light"] .feed-item,
body[data-theme="light"] .mock-card,
body[data-theme="light"] .feed-item,
[data-theme="light"] .mock-card,
[data-theme="light"] .feed-item {
    background:
        radial-gradient(circle at 10% 0%, rgba(37, 99, 235, .075), transparent 30%),
        linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(240, 247, 255, .92));
    border-color: rgba(37, 99, 235, .24);
    box-shadow: 0 12px 30px rgba(15, 23, 42, .075), inset 0 1px 0 rgba(255, 255, 255, .92);
}

html[data-theme="light"] .card,
html[data-theme="light"] .role-card,
html[data-theme="light"] .asset-card,
html[data-theme="light"] .module-card,
html[data-theme="light"] .economics-card,
html[data-theme="light"] .step-card,
html[data-theme="light"] .contact-card,
html[data-theme="light"] .about-card,
html[data-theme="light"] .integration-card,
html[data-theme="light"] .audience-card,
html[data-theme="light"] .pilot-card,
body[data-theme="light"] .card,
body[data-theme="light"] .role-card,
body[data-theme="light"] .asset-card,
body[data-theme="light"] .module-card,
body[data-theme="light"] .economics-card,
body[data-theme="light"] .step-card,
body[data-theme="light"] .contact-card,
body[data-theme="light"] .about-card,
body[data-theme="light"] .integration-card,
body[data-theme="light"] .audience-card,
body[data-theme="light"] .pilot-card,
[data-theme="light"] .card,
[data-theme="light"] .role-card,
[data-theme="light"] .asset-card,
[data-theme="light"] .module-card,
[data-theme="light"] .economics-card,
[data-theme="light"] .step-card,
[data-theme="light"] .contact-card,
[data-theme="light"] .about-card,
[data-theme="light"] .integration-card,
[data-theme="light"] .audience-card,
[data-theme="light"] .pilot-card,
html[data-theme="light"] .seo-nav-card,
body[data-theme="light"] .seo-nav-card,
[data-theme="light"] .seo-nav-card {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 12% 0%, rgba(79, 140, 255, .10), transparent 34%),
        linear-gradient(145deg, rgba(255, 255, 255, .94), rgba(239, 247, 255, .82)),
        var(--industrial-panel);
    border-color: rgba(37, 99, 235, .22);
    box-shadow:
        0 18px 48px rgba(15, 23, 42, .10),
        0 0 0 1px rgba(255, 255, 255, .72) inset,
        0 0 34px rgba(79, 140, 255, .10);
    backdrop-filter: blur(18px);
}

html[data-theme="light"] .seo-nav-card::before,
body[data-theme="light"] .seo-nav-card::before,
[data-theme="light"] .seo-nav-card::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(79, 140, 255, .75), rgba(34, 211, 238, .38), transparent 56%) top left / 100% 3px no-repeat,
        linear-gradient(135deg, transparent 0 48%, rgba(255, 255, 255, .70) 49%, transparent 51%),
        radial-gradient(circle at 88% 84%, rgba(37, 99, 235, .18) 1px, transparent 1.5px);
    background-size:
        100% 3px,
        100% 100%,
        12px 12px;
    opacity: .72;
}

html[data-theme="light"] .seo-nav-card::after,
body[data-theme="light"] .seo-nav-card::after,
[data-theme="light"] .seo-nav-card::after {
    content: "";
    position: absolute;
    z-index: 0;
    right: -48px;
    bottom: -54px;
    width: 140px;
    height: 140px;
    pointer-events: none;
    background: radial-gradient(circle, rgba(34, 211, 238, .22), transparent 68%);
    opacity: .58;
}

html[data-theme="light"] .seo-nav-card:hover,
html[data-theme="light"] .seo-nav-card:focus-visible,
body[data-theme="light"] .seo-nav-card:hover,
body[data-theme="light"] .seo-nav-card:focus-visible,
[data-theme="light"] .seo-nav-card:hover,
[data-theme="light"] .seo-nav-card:focus-visible {
    transform: translateY(-7px);
    background:
        radial-gradient(circle at 12% 0%, rgba(79, 140, 255, .13), transparent 34%),
        linear-gradient(145deg, rgba(255, 255, 255, .97), rgba(232, 242, 255, .88)),
        var(--industrial-panel-hover);
    border-color: rgba(37, 99, 235, .36);
    box-shadow:
        0 28px 72px rgba(15, 23, 42, .14),
        0 0 0 1px rgba(255, 255, 255, .82) inset,
        0 0 46px rgba(79, 140, 255, .18);
}

html[data-theme="light"] .seo-nav-card:hover::before,
html[data-theme="light"] .seo-nav-card:focus-visible::before,
body[data-theme="light"] .seo-nav-card:hover::before,
body[data-theme="light"] .seo-nav-card:focus-visible::before,
[data-theme="light"] .seo-nav-card:hover::before,
[data-theme="light"] .seo-nav-card:focus-visible::before {
    opacity: .90;
}

html[data-theme="light"] .seo-nav-card h3,
body[data-theme="light"] .seo-nav-card h3,
[data-theme="light"] .seo-nav-card h3 {
    color: #07152d;
}

html[data-theme="light"] .seo-nav-card p,
body[data-theme="light"] .seo-nav-card p,
[data-theme="light"] .seo-nav-card p {
    color: #334155;
}

html[data-theme="light"] .cta-card,
body[data-theme="light"] .cta-card,
[data-theme="light"] .cta-card {
    background:
        linear-gradient(90deg, rgba(255, 255, 255, .12) 1px, transparent 1px),
        radial-gradient(circle at 12% 12%, rgba(255, 255, 255, .28), transparent 28%),
        radial-gradient(circle at 88% 18%, rgba(34, 211, 238, .28), transparent 24%),
        linear-gradient(135deg, #155ee8 0%, #2563eb 46%, #0e7490 100%);
    background-size: 52px 52px, auto, auto, auto;
    box-shadow: 0 36px 98px rgba(37, 99, 235, .34), inset 0 1px 0 rgba(255, 255, 255, .28);
}

html[data-theme="light"] .footer,
body[data-theme="light"] .footer,
[data-theme="light"] .footer {
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .050) 1px, transparent 1px),
        radial-gradient(circle at 16% 0%, rgba(37, 99, 235, .16), transparent 32%),
        radial-gradient(circle at 84% 24%, rgba(14, 165, 233, .13), transparent 32%),
        linear-gradient(180deg, rgba(248, 251, 255, .99), rgba(222, 237, 255, .96));
    background-size: 52px 52px, auto, auto, auto;
    border-top-color: rgba(37, 99, 235, .24);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .92);
}

.toast.show {
    opacity: 1;
    transform: translateY(0);
}

.toast-title {
    font-size: .88rem;
    font-weight: 800;
    margin-bottom: .18rem;
}

.toast-text {
    font-size: .88rem;
    color: var(--readable-text-soft);
    line-height: 1.45;
}

/* Анимации */
.reveal {
    opacity: 1;
    transform: none;
    transition: transform .45s ease;
}

.reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/* ========================================
   🔥 АДАПТИВНОСТЬ
   ======================================== */
@media (max-width: 1280px) {
    .hero-grid,
    .platform-layout,
    .ops-layout,
    .about-grid,
    .cta-card,
    .contacts-grid,
    .mockup-showcase,
    .pilot-grid {
        grid-template-columns: 1fr;
    }

    .roles-grid,
    .asset-grid,
    .economics-grid,
    .steps-grid,
    .audience-grid,
    .scenario-grid,
    .readiness-grid,
    .faq-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .seo-nav-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .integration-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .trust-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 1024px) {
    :root {
        --home-section-y: 3.5rem;
        --home-section-y-sm: 2.75rem;
        --home-section-head-gap: 1.75rem;
    }

    .nav-links {
        display: none;
    }

    .menu-toggle {
        display: inline-flex;
    }

    .mobile-menu {
        display: block;
    }

    .hero-trust,
    .card-grid-3,
    .module-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .company-layout {
        grid-template-columns: 1fr;
        padding-right: 0;
    }

    .company-status-panel {
        grid-template-rows: auto;
    }

    .company-status-panel .company-status-card {
        justify-content: flex-start;
    }

    .company-certificate-head,
    .company-certificate-list,
    .company-registry-note {
        grid-template-columns: 1fr;
    }

    .company-certificate-head .company-status-text {
        margin-left: 0;
    }

    .company-registry-note a {
        width: fit-content;
    }

    .ops-row {
        grid-template-columns: 1fr;
        gap: .45rem;
    }

    .ops-row.head {
        display: none;
    }

    .mock-grid-2 {
        grid-template-columns: 1fr;
    }

    .floating-actions {
        left: .75rem;
        right: .75rem;
        bottom: .75rem;
        grid-template-columns: repeat(3, 1fr);
    }

    .floating-action {
        width: 100%;
        padding: .8rem .75rem;
    }

    .toast-stack {
        left: .75rem;
        right: .75rem;
        bottom: 5.1rem;
    }

    .toast {
        min-width: 100%;
        max-width: none;
    }

}

@media (max-width: 720px) {
    :root {
        --home-section-y: 2.75rem;
        --home-section-y-sm: 2.25rem;
        --home-section-head-gap: 1.5rem;
        --home-card-gap: .9rem;
        --home-card-inner-gap: .8rem;
        --home-card-padding: 1.15rem;
    }

    .container {
        width: min(var(--container), calc(100% - 1rem));
    }

    .logo-subtitle,
    .logo-meta {
        display: none;
    }

    .navbar .app-logo {
        flex: 0 0 auto;
        max-width: 52px;
        min-width: 52px;
    }

    .navbar .app-logo__image {
        display: block;
        width: 52px;
        height: 52px;
        flex-basis: 52px;
        min-width: 52px;
        opacity: 1;
        visibility: visible;
    }

    .nav-actions .btn-ghost,
    .nav-actions .btn-primary {
        display: none;
    }

    .hero {
        padding-top: 4.5rem;
    }

    html[data-theme="light"] .hero::before,
    body[data-theme="light"] .hero::before,
    [data-theme="light"] .hero::before {
        opacity: .46;
    }

    html[data-theme="light"] .hero::after,
    body[data-theme="light"] .hero::after,
    [data-theme="light"] .hero::after {
        opacity: .38;
    }

    html[data-theme="light"] .hero-grid > :first-child,
    body[data-theme="light"] .hero-grid > :first-child,
    [data-theme="light"] .hero-grid > :first-child {
        padding: 1rem;
        border-radius: 22px;
        backdrop-filter: blur(6px);
    }

    html[data-theme="light"] .section,
    html[data-theme="light"] .section-sm,
    body[data-theme="light"] .section,
    body[data-theme="light"] .section-sm,
    [data-theme="light"] .section,
    [data-theme="light"] .section-sm {
        background:
            radial-gradient(circle at 12% 0%, rgba(37, 99, 235, .050), transparent 32%),
            radial-gradient(circle at 90% 10%, rgba(14, 165, 233, .045), transparent 34%),
            linear-gradient(180deg, rgba(255, 255, 255, .84), rgba(239, 247, 255, .68));
    }

    html[data-theme="light"] .section:not(.seo-nav-section)::before,
    html[data-theme="light"] .section-sm:not(.seo-nav-section)::before,
    body[data-theme="light"] .section:not(.seo-nav-section)::before,
    body[data-theme="light"] .section-sm:not(.seo-nav-section)::before,
    [data-theme="light"] .section:not(.seo-nav-section)::before,
    [data-theme="light"] .section-sm:not(.seo-nav-section)::before {
        opacity: .13;
    }

    .hero-title {
        font-size: 2.55rem;
        line-height: 1.08;
    }

    .hero-trust,
    .roles-grid,
    .asset-grid,
    .module-grid,
    .economics-grid,
    .steps-grid,
    .about-kpis,
    .integration-grid,
    .audience-grid,
    .seo-nav-grid,
    .telemetry-grid,
    .scenario-grid,
    .readiness-grid,
    .faq-grid,
    .trust-strip {
        grid-template-columns: 1fr;
    }

    .section-title {
        font-size: 2rem;
        line-height: 1.16;
    }

    .company-panel {
        padding: 1.15rem;
        border-radius: 20px;
    }

    .company-status-card-certificate {
        padding: 1.15rem;
        border-radius: 20px;
    }

    .company-facts-grid {
        grid-template-columns: 1fr;
    }

    .company-status-card {
        grid-template-columns: 1fr;
        padding: 1rem;
        border-radius: 18px;
    }

    .company-status-card--skolkovo .company-status-logo--skolkovo {
        width: 180px;
        max-width: min(180px, 100%);
        margin-top: .9rem;
    }

    .company-status-card--skolkovo .company-status-logo--skolkovo img {
        width: 180px;
        max-width: 100%;
    }

    .company-certificate-link {
        width: 100%;
    }

    .theme-toggle,
    .menu-toggle {
        width: 40px;
        height: 40px;
    }

    .form-row {
        grid-template-columns: 1fr;
    }

    .floating-action span {
        display: none;
    }

    .floating-actions {
        left: auto;
        right: .75rem;
        grid-template-columns: 48px;
        width: 48px;
    }

    .floating-action {
        width: 48px;
        min-height: 48px;
        padding: 0;
    }

    .cta-actions {
        flex-direction: column;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    .reveal,
    .toast,
    .floating-action {
        transition: none !important;
    }

    .submit-spinner {
        animation: none !important;
    }

    * {
        transition: none !important;
        animation: none !important;
    }
}


/* Extracted helper classes for formerly inline home-page mockups. */
.is-hidden {
    display: none !important;
}

.home-noscript-warning {
    padding: 1rem;
    text-align: center;
    background: #f59e0b;
    color: #111;
}

.honeypot-field {
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.mock-card-offset {
    margin-top: 1.2rem;
}

.home-stack {
    display: grid;
    gap: var(--home-card-gap);
    min-width: 0;
}

.mockup-showcase > .glass-shell,
.mockup-showcase > .home-stack {
    min-width: 0;
}

.fleet-screen {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: .9rem;
    min-height: 560px;
}

.fleet-sidebar {
    background: rgba(255,255,255,.07);
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: .9rem;
}

.fleet-brand {
    display: flex;
    align-items: center;
    gap: .7rem;
    padding-bottom: .8rem;
    border-bottom: 1px solid var(--border);
    margin-bottom: .9rem;
}

.fleet-brand-logo {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: var(--gradient-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 900;
}

.ui-title-compact {
    font-size: .9rem;
}

.fleet-nav {
    display: grid;
    gap: .35rem;
    margin-bottom: 1rem;
}

.fleet-nav-item {
    display: flex;
    align-items: center;
    gap: .7rem;
    padding: .72rem .8rem;
    border-radius: 14px;
    color: var(--text);
    font-weight: 700;
}

.fleet-nav-item.active {
    background: rgba(79,140,255,.24);
    color: var(--text);
    border: 1px solid rgba(147,197,253,.30);
}

.fleet-alert-box {
    margin-top: 1rem;
    padding: .9rem;
    border-radius: 16px;
    background: rgba(239,68,68,.18);
    border: 1px solid rgba(252,165,165,.28);
}

.mock-title-spaced {
    margin-bottom: .45rem;
}

.fleet-main {
    display: grid;
    gap: .9rem;
}

.fleet-top-metrics {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .8rem;
}

.metric-tile,
.oil-card,
.component-card,
.spares-card,
.executive-card {
    background: rgba(255,255,255,.07);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: .95rem;
}

.oil-card,
.component-card,
.spares-card,
.executive-card {
    border-radius: 22px;
    padding: 1rem;
}

.metric-tile-label,
.oil-stat-name,
.exec-metric-label {
    font-size: .8rem;
    color: var(--mock-label-text);
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-bottom: .4rem;
    font-weight: 800;
}

.oil-stat-name {
    font-size: .8rem;
    margin-bottom: .2rem;
}

.metric-tile-value {
    font-size: 1.45rem;
    font-weight: 900;
    color: var(--readable-panel-text);
}

.metric-tile-trend {
    margin-top: .25rem;
    font-size: .84rem;
    color: var(--readable-text-soft);
    line-height: 1.42;
}

.fleet-mid {
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    gap: .8rem;
}

.fleet-bottom {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .8rem;
}

.fleet-panel {
    background: rgba(255,255,255,.07);
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: .95rem;
}

.panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .6rem;
    margin-bottom: .85rem;
}

.panel-title {
    font-size: .84rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--mock-label-text);
}

.fleet-table,
.spares-table,
.component-metrics {
    display: grid;
    gap: .55rem;
}

.fleet-table-row,
.spares-row {
    display: grid;
    gap: .6rem;
    align-items: center;
    border-radius: 14px;
    padding: .72rem .8rem;
    background: rgba(255,255,255,.08);
    font-size: .9rem;
    line-height: 1.42;
}

.fleet-table-row {
    grid-template-columns: 1.1fr .75fr .85fr .7fr;
}

.spares-row {
    grid-template-columns: 1.1fr .55fr .65fr .7fr;
}

.fleet-table-row.head,
.spares-row.head {
    background: transparent;
    padding: 0 .2rem .2rem;
    color: var(--mock-label-text);
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-weight: 800;
}

.tiny-line-chart {
    height: 180px;
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(79,140,255,.1), rgba(79,140,255,.02)), linear-gradient(90deg, transparent 0 10%, rgba(255,255,255,.04) 10% 11%, transparent 11% 20%, rgba(255,255,255,.04) 20% 21%, transparent 21% 30%, rgba(255,255,255,.04) 30% 31%, transparent 31% 40%, rgba(255,255,255,.04) 40% 41%, transparent 41%);
    position: relative;
    overflow: hidden;
}

.tiny-line-chart::before,
.tiny-line-chart::after {
    content: "";
    position: absolute;
    left: 6%;
    right: 6%;
    height: 2px;
    border-radius: 3px;
}

.tiny-line-chart::before {
    top: 38%;
    background: linear-gradient(90deg, #4f8cff, #7b61ff);
    transform: skewY(-7deg);
}

.tiny-line-chart::after {
    top: 58%;
    background: linear-gradient(90deg, #22d3ee, #22c55e);
    transform: skewY(5deg);
    opacity: .75;
}

.feed-list {
    display: grid;
    gap: .65rem;
}

.feed-item-compact {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: .8rem;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(203,213,225,.16);
    padding: .72rem .8rem;
    border-radius: 14px;
}

.sample-meta {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: .8rem;
    margin-bottom: .9rem;
}

.sample-title {
    font-size: 1rem;
    font-weight: 800;
    color: var(--readable-panel-text);
    line-height: 1.35;
}

.sample-subtitle {
    font-size: .84rem;
    color: var(--mock-meta-text);
    margin-top: .15rem;
    line-height: 1.42;
}

.severity-strip {
    display: flex;
    gap: .35rem;
    margin-bottom: .8rem;
}

.severity-step {
    flex: 1;
    height: 8px;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
}

.severity-step.low {
    background: #22c55e;
}

.severity-step.mid {
    background: #f59e0b;
}

.severity-step.high {
    background: #ef4444;
}

.oil-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .6rem;
    margin-bottom: .9rem;
}

.oil-stat,
.exec-metric {
    padding: .75rem;
    border-radius: 14px;
    background: rgba(255,255,255,.08);
}

.oil-stat-value {
    font-size: 1rem;
    font-weight: 800;
    color: var(--readable-panel-text);
}

.insight-box {
    padding: .85rem;
    border-radius: 16px;
    background: rgba(79,140,255,.18);
    border: 1px solid rgba(147,197,253,.28);
    font-size: .94rem;
    color: var(--readable-text-soft);
    line-height: 1.58;
}

.component-layout {
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    gap: .85rem;
    align-items: center;
}

.component-gauge {
    position: relative;
    width: 180px;
    height: 180px;
    margin: 0 auto;
    border-radius: 50%;
    background: radial-gradient(circle at center, transparent 55%, rgba(255,255,255,.04) 56%), conic-gradient(#22c55e 0 45%, #f59e0b 45% 72%, #ef4444 72% 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.component-gauge-value {
    position: absolute;
    text-align: center;
}

.component-gauge-value strong {
    display: block;
    font-size: 1.8rem;
    font-weight: 900;
    color: var(--readable-panel-text);
    line-height: 1;
}

.component-gauge-value span {
    font-size: .84rem;
    color: var(--mock-meta-text);
}

.component-metric {
    display: flex;
    justify-content: space-between;
    gap: .7rem;
    padding: .72rem .8rem;
    border-radius: 14px;
    background: rgba(255,255,255,.08);
    font-size: .9rem;
    line-height: 1.42;
}

.executive-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: .75rem;
    margin-top: .8rem;
}

.exec-metric {
    padding: .85rem;
    border-radius: 16px;
}

.exec-metric-value {
    font-size: 1.2rem;
    font-weight: 900;
    color: var(--readable-panel-text);
}

.mini-bars {
    display: flex;
    align-items: end;
    gap: .35rem;
    min-height: 90px;
    margin-top: .7rem;
}

.mini-bar {
    flex: 1;
    border-radius: 8px 8px 4px 4px;
    background: linear-gradient(180deg, #8dbdff, #4f8cff);
}

.bar-h-36 { height: 36px; }
.bar-h-42 { height: 42px; }
.bar-h-46p { height: 46%; }
.bar-h-48p { height: 48%; }
.bar-h-58 { height: 58px; }
.bar-h-58p { height: 58%; }
.bar-h-61p { height: 61%; }
.bar-h-63 { height: 63px; }
.bar-h-70p { height: 70%; }
.bar-h-72 { height: 72px; }
.bar-h-72p { height: 72%; }
.bar-h-80 { height: 80px; }
.bar-h-84p { height: 84%; }
.bar-h-86p { height: 86%; }

@media (max-width: 1024px) {
    .fleet-screen,
    .fleet-mid,
    .fleet-bottom,
    .component-layout {
        grid-template-columns: 1fr;
    }

    .fleet-sidebar {
        display: none;
    }
}

@media (max-width: 720px) {
    .fleet-top-metrics,
    .oil-grid,
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .fleet-table-row,
    .spares-row {
        grid-template-columns: 1fr;
    }
}

/* Landing mockup layout marker: 20260622-mockup-layout-v1 */
/* Landing command workspace marker: 20260622-command-workspace-v1 */
/* Landing mockups stacked layout marker: 20260622-mockups-stack-v1 */
#mockups .mockup-showcase {
    display: block;
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    overflow: visible;
}

#mockups .glass-shell,
#mockups .command-workspace-shell,
#mockups .ui-window,
#mockups .fleet-screen,
#mockups .home-stack,
#mockups .home-stack > * {
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
    width: 100%;
}

#mockups .ui-window {
    overflow: visible;
    padding: clamp(.82rem, 1.2vw, 1.08rem);
}

#mockups .fleet-screen {
    grid-template-columns: minmax(172px, 212px) minmax(0, 1fr);
    gap: clamp(.78rem, 1.3vw, 1rem);
    min-height: 0;
    align-items: stretch;
    max-width: 100%;
    overflow: hidden;
}

#mockups .fleet-sidebar,
#mockups .fleet-main,
#mockups .fleet-panel,
#mockups .metric-tile,
#mockups .oil-card,
#mockups .component-card,
#mockups .spares-card,
#mockups .executive-card,
#mockups .sample-meta > div {
    min-width: 0;
}

#mockups .fleet-sidebar {
    padding: .78rem;
}

#mockups .fleet-brand {
    gap: .55rem;
    margin-bottom: .72rem;
    padding-bottom: .7rem;
}

#mockups .fleet-nav {
    gap: .28rem;
    margin-bottom: .75rem;
}

#mockups .fleet-nav-item {
    gap: .55rem;
    padding: .58rem .62rem;
    font-size: .86rem;
    line-height: 1.25;
}

#mockups .fleet-alert-box {
    margin-top: .75rem;
    padding: .72rem;
}

#mockups .fleet-main {
    gap: .76rem;
    overflow: hidden;
}

#mockups .fleet-top-metrics {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .58rem;
}

#mockups .metric-tile {
    padding: .72rem;
    border-radius: 16px;
}

#mockups .metric-tile-label,
#mockups .panel-title,
#mockups .oil-stat-name,
#mockups .exec-metric-label {
    font-size: .72rem;
    letter-spacing: .035em;
}

#mockups .metric-tile-value {
    font-size: clamp(1.05rem, 1.35vw, 1.28rem);
    line-height: 1.08;
    white-space: nowrap;
}

#mockups .metric-tile-trend {
    font-size: .78rem;
    line-height: 1.32;
}

#mockups .fleet-mid {
    grid-template-columns: minmax(0, 1.55fr) minmax(250px, .72fr);
    gap: .78rem;
    align-items: stretch;
    min-width: 0;
}

#mockups .fleet-bottom {
    grid-template-columns: minmax(0, 1.1fr) minmax(250px, .9fr);
    gap: .78rem;
    min-width: 0;
}

#mockups .fleet-panel {
    padding: .72rem;
    border-radius: 17px;
}

#mockups .panel-header {
    gap: .45rem;
    margin-bottom: .58rem;
}

#mockups .fleet-table,
#mockups .spares-table,
#mockups .component-metrics,
#mockups .feed-list {
    gap: .42rem;
}

#mockups .fleet-table-row,
#mockups .spares-row {
    gap: .45rem;
    padding: .52rem .58rem;
    border-radius: 12px;
    font-size: .82rem;
    line-height: 1.3;
}

#mockups .fleet-table-row {
    grid-template-columns: minmax(110px, 1.05fr) minmax(86px, .72fr) minmax(180px, 1.55fr) max-content;
}

#mockups .fleet-priorities {
    min-width: 0;
}

#mockups .fleet-priority-row {
    grid-template-columns: minmax(110px, 1.05fr) minmax(86px, .72fr) minmax(180px, 1.55fr) max-content;
}

#mockups .fleet-priority-row > * {
    min-width: 0;
}

#mockups .fleet-priority-machine,
#mockups .fleet-priority-type,
#mockups .fleet-priority-event {
    overflow: hidden;
    overflow-wrap: normal;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-break: normal;
}

#mockups .fleet-priority-machine {
    color: var(--readable-panel-text);
    font-weight: 800;
}

#mockups .fleet-priority-type,
#mockups .fleet-priority-event {
    color: var(--readable-text-soft);
}

#mockups .fleet-risk-badge {
    justify-self: end;
    max-width: 100%;
    white-space: nowrap;
}

#mockups .spares-row {
    grid-template-columns: minmax(0, 1.16fr) minmax(42px, .42fr) minmax(44px, .48fr) minmax(92px, .7fr);
}

#mockups .fleet-table-row.head,
#mockups .spares-row.head {
    padding: 0 .2rem .12rem;
    font-size: .72rem;
}

#mockups .feed-name,
#mockups .feed-meta,
#mockups .sample-title,
#mockups .sample-subtitle {
    overflow-wrap: anywhere;
}

#mockups .fleet-table .feed-name,
#mockups .fleet-table .feed-meta {
    overflow-wrap: normal;
    word-break: normal;
}

#mockups .fleet-trends {
    display: grid;
    align-content: start;
}

#mockups .tiny-line-chart {
    height: clamp(96px, 7.4vw, 118px);
}

#mockups .feed-item-compact {
    padding: .58rem .64rem;
    gap: .55rem;
    border-radius: 12px;
}

#mockups .bars {
    min-height: 104px;
}

#mockups .home-stack {
    gap: clamp(1.1rem, 2vw, 1.75rem);
    align-content: start;
}

#mockups .mockup-cards-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 1240px;
    margin: clamp(1.5rem, 3vw, 2.5rem) auto 0;
}

#mockups .oil-card,
#mockups .component-card,
#mockups .spares-card,
#mockups .executive-card {
    display: grid;
    gap: .78rem;
    padding: clamp(.88rem, 1.25vw, 1rem);
    border-radius: 20px;
}

#mockups .sample-meta {
    align-items: flex-start;
    gap: .7rem;
    margin-bottom: 0;
}

#mockups .sample-meta .badge {
    flex: 0 0 auto;
    white-space: nowrap;
}

#mockups .severity-strip,
#mockups .oil-grid,
#mockups .executive-grid {
    margin-bottom: 0;
}

#mockups .oil-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .52rem;
}

#mockups .oil-stat,
#mockups .exec-metric,
#mockups .component-metric {
    min-width: 0;
    padding: .62rem;
    border-radius: 12px;
}

#mockups .insight-box {
    padding: .72rem;
    border-radius: 14px;
    font-size: .88rem;
    line-height: 1.48;
}

#mockups .component-layout {
    grid-template-columns: minmax(128px, .72fr) minmax(0, 1.28fr);
    gap: .72rem;
}

#mockups .component-gauge {
    width: clamp(122px, 11vw, 152px);
    height: clamp(122px, 11vw, 152px);
}

#mockups .component-gauge-value strong {
    font-size: 1.55rem;
}

#mockups .component-metric {
    align-items: flex-start;
    font-size: .84rem;
}

#mockups .component-metric span {
    min-width: 0;
}

#mockups .component-metric strong {
    text-align: right;
    overflow-wrap: anywhere;
}

#mockups .executive-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .58rem;
}

#mockups .exec-metric-value {
    font-size: 1.05rem;
}

#mockups .mini-bars {
    min-height: 72px;
    margin-top: 0;
}

@media (max-width: 1024px) {
    #mockups .fleet-screen {
        grid-template-columns: 1fr;
    }

    #mockups .fleet-sidebar {
        display: grid;
    }

    #mockups .fleet-nav {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    #mockups .fleet-alert-box {
        margin-top: 0;
    }

    #mockups .fleet-mid {
        grid-template-columns: minmax(0, 1.35fr) minmax(220px, .72fr);
    }
}

@media (max-width: 900px) {
    #mockups .mockup-cards-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    #mockups .ui-window {
        overflow: hidden;
    }

    #mockups .fleet-top-metrics,
    #mockups .fleet-mid,
    #mockups .fleet-bottom,
    #mockups .home-stack,
    #mockups .component-layout,
    #mockups .oil-grid,
    #mockups .executive-grid {
        grid-template-columns: 1fr;
    }

    #mockups .fleet-sidebar {
        display: none;
    }

    #mockups .spares-row {
        grid-template-columns: 1fr;
    }

    #mockups .fleet-priority-row {
        grid-template-columns: minmax(86px, 1fr) minmax(128px, 1.32fr) max-content;
        gap: .5rem;
    }

    #mockups .fleet-priority-row > :nth-child(2) {
        display: none;
    }

    #mockups .fleet-priority-row.head > :nth-child(3) {
        font-size: 0;
    }

    #mockups .fleet-priority-row.head > :nth-child(3)::after {
        content: "Событие";
        font-size: .72rem;
    }

    #mockups .sample-meta {
        display: grid;
    }

    #mockups .sample-meta .badge {
        width: fit-content;
        white-space: normal;
    }
}

@media (max-width: 1600px) {
    .floating-actions {
        display: none !important;
    }
}

/* Landing company layout marker: 20260622-company-layout-v3 */

@font-face {
    font-family: "Homepage Font Awesome 6 Free";
    font-style: normal;
    font-weight: 900;
    font-display: block;
    src: url("/static/fonts/home-fa-solid-subset-6.5.2.woff") format("woff");
}

.fas,
.fa-solid,
[class^="fa-"],
[class*=" fa-"] {
    display: inline-block;
    width: 1em;
    min-width: 1em;
    height: 1em;
    font-family: "Homepage Font Awesome 6 Free";
    font-style: normal;
    font-weight: 900;
    line-height: 1;
    text-rendering: auto;
}

.fas::before,
.fa-solid::before,
[class^="fa-"]::before,
[class*=" fa-"]::before {
    display: inline-block;
}

.fa-arrow-right::before { content: "\f061"; }
.fa-arrow-up::before { content: "\f062"; }
.fa-award::before { content: "\f559"; }
.fa-bars::before { content: "\f0c9"; }
.fa-boxes-stacked::before { content: "\f468"; }
.fa-briefcase::before { content: "\f0b1"; }
.fa-building::before { content: "\f1ad"; }
.fa-calculator::before { content: "\f1ec"; }
.fa-calendar-check::before { content: "\f274"; }
.fa-chart-column::before { content: "\e0e3"; }
.fa-chart-line::before { content: "\f201"; }
.fa-chart-pie::before { content: "\f200"; }
.fa-check::before { content: "\f00c"; }
.fa-check-circle::before,
.fa-circle-check::before { content: "\f058"; }
.fa-circle::before { content: "\f111"; }
.fa-circle-question::before { content: "\f059"; }
.fa-clock::before { content: "\f017"; }
.fa-copy::before { content: "\f0c5"; }
.fa-database::before { content: "\f1c0"; }
.fa-desktop::before { content: "\f390"; }
.fa-diagram-project::before { content: "\f542"; }
.fa-envelope::before { content: "\f0e0"; }
.fa-file-shield::before { content: "\e4f0"; }
.fa-helmet-safety::before { content: "\f807"; }
.fa-layer-group::before { content: "\f5fd"; }
.fa-location-dot::before { content: "\f3c5"; }
.fa-microchip::before { content: "\f2db"; }
.fa-moon::before { content: "\f186"; }
.fa-oil-can::before { content: "\f613"; }
.fa-paper-plane::before { content: "\f1d8"; }
.fa-phone::before { content: "\f095"; }
.fa-plug::before { content: "\f1e6"; }
.fa-right-to-bracket::before { content: "\f2f6"; }
.fa-rocket::before { content: "\f135"; }
.fa-route::before { content: "\f4d7"; }
.fa-satellite-dish::before { content: "\f7c0"; }
.fa-sitemap::before { content: "\f0e8"; }
.fa-sun::before { content: "\f185"; }
.fa-tools::before { content: "\f7d9"; }
.fa-triangle-exclamation::before { content: "\f071"; }
.fa-truck-monster::before { content: "\f63b"; }
.fa-user-clock::before { content: "\f4fd"; }
.fa-user-gear::before { content: "\f4fe"; }
.fa-user-shield::before { content: "\f505"; }
.fa-users-gear::before { content: "\f509"; }
.fa-xmark::before { content: "\f00d"; }