/* Дизайн-токены langpeak.ru */ :root { /* Фирменные цвета */ --turquoise: #31a2ac; --turquoise-dark: #25818a; --turquoise-soft: #e2f3f4; --lipstick: #af1c1c; --lipstick-dark: #8c1616; --lipstick-soft: #f8e6e6; --paper: #f0effe; --ink: #2f2f28; /* Производные */ /* Зелёный только для кнопки «Далее»: она должна читаться как «идём дальше» и не спорить с бирюзовым, которым помечен верный ответ. */ --green: #3fa34d; --green-dark: #2d7a38; --white: #ffffff; --ink-60: rgba(47, 47, 40, 0.62); --ink-40: rgba(47, 47, 40, 0.40); --ink-15: rgba(47, 47, 40, 0.15); --ink-08: rgba(47, 47, 40, 0.08); --gold: #e2a13c; --gold-soft: #fdf1dd; /* Скругления — мягкие грани везде */ --r-sm: 12px; --r-md: 20px; --r-lg: 28px; --r-pill: 999px; /* Тени */ --shadow-sm: 0 2px 8px rgba(47, 47, 40, 0.06); --shadow-md: 0 6px 20px rgba(47, 47, 40, 0.10); --shadow-lg: 0 14px 40px rgba(47, 47, 40, 0.14); /* Толщина «подложки» у объёмных кнопок */ --lift: 4px; --font: 'Nunito', 'Nunito Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif; --dur: 180ms; --ease: cubic-bezier(0.34, 1.4, 0.64, 1); --shell-max: 760px; --nav-h: 68px; } /* Тёмная тема. Бирюза и помада остаются фирменными, но чуть светлее — на тёмном фоне исходные оттенки читаются глухо. Ставится атрибутом data-theme на (js/theme.js), поэтому системная и ручная тема не спорят друг с другом. */ :root[data-theme='dark'] { --turquoise: #3fbcc7; --turquoise-dark: #2c8d96; --turquoise-soft: #17383b; --lipstick: #e05252; --lipstick-dark: #a83333; --lipstick-soft: #3a1d1d; --green: #4cb85c; --green-dark: #348a41; --paper: #161614; --ink: #ecebe4; --white: #23231f; --ink-60: rgba(236, 235, 228, 0.66); --ink-40: rgba(236, 235, 228, 0.42); --ink-15: rgba(236, 235, 228, 0.18); --ink-08: rgba(236, 235, 228, 0.10); --gold: #e8b45c; --gold-soft: #3a2f1b; --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.35); --shadow-md: 0 6px 20px rgba(0, 0, 0, 0.45); --shadow-lg: 0 14px 40px rgba(0, 0, 0, 0.55); color-scheme: dark; } /* Nunito лежит рядом с проектом — сайт не ходит за шрифтом на сторонние домены. */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 400 900; font-display: swap; src: url('/fonts/nunito-cyrillic.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 400 900; font-display: swap; src: url('/fonts/nunito-latin-ext.woff2') format('woff2'); /* сюда попадают знаки транскрипции: ˈ, ə, ɒ и остальная фонетика */ unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 400 900; font-display: swap; src: url('/fonts/nunito-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F, U+2122, U+2191, U+2193; } @media (prefers-reduced-motion: reduce) { :root { --dur: 1ms; } *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; scroll-behavior: auto !important; } }