﻿:root {
    --bg: #070A12;
    --panel: rgba(255, 255, 255, 0.06);
    --panel2: rgba(255, 255, 255, 0.10);
    --text: rgba(255, 255, 255, 0.92);
    --muted: rgba(255, 255, 255, 0.64);
    --accent: #ff7a18;
    --accent2: #ffb000;
    --stroke: rgba(255, 255, 255, 0.10);
    --shadow: 0 18px 60px rgba(0, 0, 0, 0.55);
    --r: 22px;
}

* {
    box-sizing: border-box;
}

html, body {
    height: 100%;
}

body {
    margin: 0;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    color: var(--text);
    background: var(--bg);
}

.container {
    width: min(1100px, calc(100% - 32px));
    margin: 0 auto;
}

.section {
    padding: 26px 0;
}

.section-head {
    margin: 0 0 14px 0;
}

.section-head__title {
    margin: 0;
    font-size: 24px;
    letter-spacing: 0.01em;
}

.section-head__sub {
    margin: 8px 0 0 0;
    color: var(--muted);
    max-width: 78ch;
}

@media (max-width: 360px) {
    .container {
        width: min(1100px, calc(100% - 24px));
    }
}
.proc-bg {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    z-index: -2;
    pointer-events: none;
    opacity: 1;
}

.page__body {
    position: relative;
    min-height: 100vh;
}

.page__body::before {
    content: "";
    position: fixed;
    left: 0;
    right: 0;
    top: -60vh;
    bottom: -60vh;

    z-index: -1;
    pointer-events: none;
    transform: translateZ(0);

    /* Маска поверх canvas, но не убивает его */
    background:
            radial-gradient(900px 520px at 18% 10%, rgba(255, 122, 24, 0.18), transparent 60%),
            radial-gradient(720px 420px at 82% 18%, rgba(255, 176, 0, 0.12), transparent 56%),
            radial-gradient(920px 720px at 40% 94%, rgba(255, 122, 24, 0.10), transparent 60%),
            linear-gradient(to bottom,
            rgba(7, 10, 18, 0.85),
            rgba(7, 10, 18, 0.55) 35%,
            rgba(7, 10, 18, 0.55) 65%,
            rgba(7, 10, 18, 0.85)
            );
}

.site-header,
.site-main,
.site-footer {
    position: relative;
    z-index: 1;
}