/* ========================================================= Signal Matrix — Neon Command Center (v3) html.sm-theme required (set in script.js) ========================================================= */ @import url('https://fonts.googleapis.com/css2?family=Exo+2:wght@600;700&family=JetBrains+Mono:wght@400;500;600;700&display=swap&subset=cyrillic,cyrillic-ext,latin,latin-ext'); html.sm-theme { color-scheme: dark; --font-display: 'Space Grotesk', system-ui, sans-serif; --font-sans: 'DM Sans', system-ui, sans-serif; --font-mono: 'JetBrains Mono', ui-monospace, monospace; --color-accent: #3dff8a; --color-accent-hover: #6dffb0; --color-accent-2: #a78bfa; --color-accent-3: #22d3ee; --color-accent-soft: rgba(61, 255, 138, .1); --color-accent-glow: rgba(61, 255, 138, .35); --color-positive: #3dff8a; --color-positive-soft: rgba(61, 255, 138, .12); --color-warn: #fbbf24; --color-warn-soft: rgba(251, 191, 36, .14); --color-info: #38bdf8; --color-info-soft: rgba(56, 189, 248, .12); --color-text: #f0f4ff; --color-text-muted: #94a3b8; --color-text-soft: #c5d0e6; --color-ink: #0f172a; /* Background palette — default: slate (see data-bg on ) */ --color-bg: #151c2e; --color-bg-alt: #1a2438; --color-bg-soft: #121829; --color-surface: rgba(26, 36, 58, .85); --color-surface-elevated: rgba(32, 44, 70, .92); --color-border: rgba(167, 139, 250, .2); --color-border-strong: rgba(61, 255, 138, .32); --color-footer: #121829; --radius-sm: 4px; --radius-md: 6px; --radius-lg: 8px; --radius-xl: 12px; /* Rounded panel corner accents (TL + BR), SVG stroke r = --radius-lg */ --sm-corner-tl-green: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M0%2024L0%208Q0%200%208%200L24%200%22%20fill%3D%22none%22%20stroke%3D%22%233dff8a%22%20stroke-width%3D%223.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E"); --sm-corner-br-violet: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M0%2024L16%2024Q24%2024%2024%2016L24%200%22%20fill%3D%22none%22%20stroke%3D%22%23a78bfa%22%20stroke-width%3D%223.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E"); --sm-corner-tl-violet: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M0%2024L0%208Q0%200%208%200L24%200%22%20fill%3D%22none%22%20stroke%3D%22%23a78bfa%22%20stroke-width%3D%223.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E"); --sm-corner-br-green: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M0%2024L16%2024Q24%2024%2024%2016L24%200%22%20fill%3D%22none%22%20stroke%3D%22%233dff8a%22%20stroke-width%3D%223.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E"); --header-h: auto; --hero-content: min(1080px, 100%); --shadow-sm: 0 0 0 1px rgba(61, 255, 138, .08), 0 8px 24px rgba(0, 0, 0, .45); --shadow-md: 0 0 0 1px rgba(167, 139, 250, .12), 0 16px 40px rgba(0, 0, 0, .55); --shadow-lg: 0 0 60px -12px rgba(61, 255, 138, .22), 0 24px 64px rgba(0, 0, 0, .6); --glow-green: 0 0 24px rgba(61, 255, 138, .45); --glow-violet: 0 0 32px rgba(167, 139, 250, .35); } /* --- Background variants (set data-bg on in script.js) --- */ /* ocean — глубокий сине-бирюзовый */ html.sm-theme[data-bg="ocean"] { --color-bg: #0f1f2e; --color-bg-alt: #142a38; --color-bg-soft: #0c1824; --color-surface: rgba(18, 42, 56, .88); --color-surface-elevated: rgba(22, 52, 68, .94); --color-footer: #0c1824; --color-text-muted: #8fb4c4; } /* graphite — тёплый графитовый (без «чёрной дыры») */ html.sm-theme[data-bg="graphite"] { --color-bg: #23262e; --color-bg-alt: #2a2e38; --color-bg-soft: #1c1f26; --color-surface: rgba(42, 46, 56, .9); --color-surface-elevated: rgba(50, 54, 66, .95); --color-footer: #1c1f26; --color-border: rgba(167, 139, 250, .16); } /* dawn — самый светлый тёмный вариант */ html.sm-theme[data-bg="dawn"] { --color-bg: #243044; --color-bg-alt: #2c3a52; --color-bg-soft: #1e2838; --color-surface: rgba(44, 58, 82, .92); --color-surface-elevated: rgba(52, 68, 94, .96); --color-footer: #1e2838; --color-text: #f8fafc; --color-text-muted: #a8b8d0; } /* void — прежний почти чёрный (если понадобится) */ html.sm-theme[data-bg="void"] { --color-bg: #010308; --color-bg-alt: #060a14; --color-bg-soft: #03060d; --color-surface: rgba(12, 18, 36, .72); --color-surface-elevated: rgba(18, 26, 48, .88); --color-footer: #010308; } /* Grid: 100×100 tile — inner lines 1px, cell border 1.25px; crosses 1.5px (JS) */ html.sm-theme { --sm-grid-tile: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22100%22%20height%3D%22100%22%20viewBox%3D%220%200%20100%20100%22%3E%3Cg%20stroke%3D%22rgba%28226%2C232%2C240%2C0.06%29%22%20shape-rendering%3D%22crispEdges%22%3E%3Cg%20stroke-width%3D%221%22%3E%3Cline%20x1%3D%2225%22%20y1%3D%220%22%20x2%3D%2225%22%20y2%3D%22100%22%2F%3E%3Cline%20x1%3D%2250%22%20y1%3D%220%22%20x2%3D%2250%22%20y2%3D%22100%22%2F%3E%3Cline%20x1%3D%2275%22%20y1%3D%220%22%20x2%3D%2275%22%20y2%3D%22100%22%2F%3E%3Cline%20x1%3D%220%22%20y1%3D%2225%22%20x2%3D%22100%22%20y2%3D%2225%22%2F%3E%3Cline%20x1%3D%220%22%20y1%3D%2250%22%20x2%3D%22100%22%20y2%3D%2250%22%2F%3E%3Cline%20x1%3D%220%22%20y1%3D%2275%22%20x2%3D%22100%22%20y2%3D%2275%22%2F%3E%3C%2Fg%3E%3Cg%20stroke-width%3D%221.25%22%3E%3Cline%20x1%3D%225%22%20y1%3D%220%22%20x2%3D%2295%22%20y2%3D%220%22%2F%3E%3Cline%20x1%3D%220%22%20y1%3D%225%22%20x2%3D%220%22%20y2%3D%2295%22%2F%3E%3Cline%20x1%3D%225%22%20y1%3D%22100%22%20x2%3D%2295%22%20y2%3D%22100%22%2F%3E%3Cline%20x1%3D%22100%22%20y1%3D%225%22%20x2%3D%22100%22%20y2%3D%2295%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"); } html.sm-theme[data-bg="void"] { --sm-grid-tile: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22100%22%20height%3D%22100%22%20viewBox%3D%220%200%20100%20100%22%3E%3Cg%20stroke%3D%22rgba%28226%2C232%2C240%2C0.06%29%22%20shape-rendering%3D%22crispEdges%22%3E%3Cg%20stroke-width%3D%221%22%3E%3Cline%20x1%3D%2225%22%20y1%3D%220%22%20x2%3D%2225%22%20y2%3D%22100%22%2F%3E%3Cline%20x1%3D%2250%22%20y1%3D%220%22%20x2%3D%2250%22%20y2%3D%22100%22%2F%3E%3Cline%20x1%3D%2275%22%20y1%3D%220%22%20x2%3D%2275%22%20y2%3D%22100%22%2F%3E%3Cline%20x1%3D%220%22%20y1%3D%2225%22%20x2%3D%22100%22%20y2%3D%2225%22%2F%3E%3Cline%20x1%3D%220%22%20y1%3D%2250%22%20x2%3D%22100%22%20y2%3D%2250%22%2F%3E%3Cline%20x1%3D%220%22%20y1%3D%2275%22%20x2%3D%22100%22%20y2%3D%2275%22%2F%3E%3C%2Fg%3E%3Cg%20stroke-width%3D%221.25%22%3E%3Cline%20x1%3D%225%22%20y1%3D%220%22%20x2%3D%2295%22%20y2%3D%220%22%2F%3E%3Cline%20x1%3D%220%22%20y1%3D%225%22%20x2%3D%220%22%20y2%3D%2295%22%2F%3E%3Cline%20x1%3D%225%22%20y1%3D%22100%22%20x2%3D%2295%22%20y2%3D%22100%22%2F%3E%3Cline%20x1%3D%22100%22%20y1%3D%225%22%20x2%3D%22100%22%20y2%3D%2295%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"); } html.sm-theme body { position: relative; font-family: var(--font-sans); color: var(--color-text); background-color: var(--color-bg); background-image: radial-gradient(ellipse 85% 55% at 12% -8%, rgba(167, 139, 250, .18), transparent 58%), radial-gradient(ellipse 75% 50% at 92% 0%, rgba(34, 211, 238, .12), transparent 52%), radial-gradient(ellipse 65% 45% at 50% 105%, rgba(61, 255, 138, .07), transparent 58%), var(--sm-grid-tile); background-size: auto, auto, auto, 100px 100px; background-position: center, center, center, 0 0; background-repeat: no-repeat, no-repeat, no-repeat, repeat; background-attachment: scroll, scroll, scroll, fixed; } html.sm-theme[data-bg="void"] body { background-image: radial-gradient(ellipse 80% 50% at 15% -10%, rgba(167, 139, 250, .22), transparent 55%), radial-gradient(ellipse 70% 45% at 90% 5%, rgba(34, 211, 238, .14), transparent 50%), radial-gradient(ellipse 60% 40% at 50% 100%, rgba(61, 255, 138, .08), transparent 55%), var(--sm-grid-tile); } /* Animated grid crosses (DOM layer; static corners removed from SVG tile) */ html.sm-theme .sm-grid-crosses { position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; } html.sm-theme .sm-grid-cross { position: absolute; width: 10px; height: 10px; margin: 0; transform: translate(-50%, -50%); transform-origin: center center; /* Rotation paused — set animation-name: sm-grid-cross-sway to re-enable */ animation: none; } html.sm-theme .sm-grid-cross::before, html.sm-theme .sm-grid-cross::after { content: ''; position: absolute; left: 50%; top: 50%; background: color-mix(in srgb, var(--color-accent-2) 42%, transparent); border-radius: 1px; } html.sm-theme .sm-grid-cross::before { width: 10px; height: 1.5px; transform: translate(-50%, -50%); } html.sm-theme .sm-grid-cross::after { width: 1.5px; height: 10px; transform: translate(-50%, -50%); } html.sm-theme[data-bg="void"] .sm-grid-cross::before, html.sm-theme[data-bg="void"] .sm-grid-cross::after { background: color-mix(in srgb, var(--color-accent-2) 38%, transparent); } @keyframes sm-grid-cross-sway { 0% { transform: translate(-50%, -50%) rotate(-28deg); } 100% { transform: translate(-50%, -50%) rotate(28deg); } } @media (prefers-reduced-motion: reduce) { html.sm-theme .sm-grid-crosses { display: none; } } html.sm-theme body::before { content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: 0.12; mix-blend-mode: soft-light; background: repeating-linear-gradient( 0deg, transparent, transparent 3px, rgba(15, 23, 42, .05) 3px, rgba(15, 23, 42, .05) 6px ); } html.sm-theme[data-bg="void"] body::before { opacity: 0.16; mix-blend-mode: overlay; background: repeating-linear-gradient( 0deg, transparent, transparent 2px, rgba(0, 0, 0, .07) 2px, rgba(0, 0, 0, .07) 4px ); } html.sm-theme body::after { content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(circle at 50% 0%, rgba(61, 255, 138, .06), transparent 42%); } html.sm-theme h1, html.sm-theme h2, html.sm-theme h3, html.sm-theme h4 { font-family: var(--font-display); font-weight: 600; color: var(--color-text); letter-spacing: -.015em; line-height: 1.22; } html.sm-theme h1 { font-size: clamp(1.85rem, 4vw, 2.75rem); line-height: 1.25; font-weight: 600; } html.sm-theme h2 { font-size: clamp(1.4rem, 2.5vw, 1.9rem); line-height: 1.28; } html.sm-theme h3 { font-size: 1.125rem; line-height: 1.3; } html.sm-theme :is(h1, h2, h3, h4) .text-accent { font-weight: 800; background: linear-gradient(92deg, var(--color-accent) 0%, var(--color-accent-3) 45%, var(--color-accent-2) 100%); background-size: 200% auto; -webkit-background-clip: text; background-clip: text; color: transparent; animation: sm-accent-shift 6s ease-in-out infinite; } @keyframes sm-accent-shift { 0%, 100% { background-position: 0% center; } 50% { background-position: 100% center; } } html.sm-theme a:hover { color: var(--color-accent); } /* ========== Header: two-row, no pill capsule ========== */ html.sm-theme .site-header::before { display: none !important; } html.sm-theme .site-header, html.sm-theme .site-header--v2 { position: sticky; top: 0; z-index: 50; background: color-mix(in srgb, var(--color-bg) 88%, transparent) !important; backdrop-filter: blur(16px) saturate(160%) !important; -webkit-backdrop-filter: blur(16px) saturate(160%) !important; border-bottom: none !important; box-shadow: 0 1px 0 rgba(61, 255, 138, .12), 0 8px 32px rgba(0, 0, 0, .5) !important; } html.sm-theme .site-header--v2::after { content: ''; display: block !important; height: 2px; background: linear-gradient(90deg, transparent, var(--color-accent) 20%, var(--color-accent-2) 50%, var(--color-accent-3) 80%, transparent); opacity: .85; } html.sm-theme .site-header.scrolled { box-shadow: var(--shadow-sm) !important; background: color-mix(in srgb, var(--color-bg) 96%, transparent) !important; } html.sm-theme .site-header--v2 .header-inner { display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; align-items: center; gap: 0 16px; height: auto; min-height: 0; padding: 14px 0 0; } html.sm-theme .site-header--v2 .logo { grid-column: 1; grid-row: 1; display: inline-flex; align-items: center; gap: 10px; font-family: 'Exo 2', var(--font-display); font-size: 1.25rem; font-weight: 600; letter-spacing: 0.04em; text-transform: none; line-height: 1; } html.sm-theme .logo-text { font-family: inherit; font-size: 1em; font-weight: inherit; letter-spacing: inherit; text-transform: none; } html.sm-theme .logo-text-accent { font-weight: 700; letter-spacing: 0.06em; background: linear-gradient(128deg, #c8ff5a 0%, #3dff8a 42%, #14b8a6 100%); -webkit-background-clip: text; background-clip: text; color: transparent; text-shadow: none; } html.sm-theme .logo-mark { filter: drop-shadow(0 0 12px rgba(61, 255, 138, .4)); } html.sm-theme .logo-svg, html.sm-theme .logo-mark-svg, html.sm-theme .logo-img { filter: none; border: none; } html.sm-theme .logo-img--mark:not(.logo-img--lg) { display: block; width: 52px; height: 52px; object-fit: contain; flex-shrink: 0; image-rendering: auto; } html.sm-theme .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; } html.sm-theme .logo--wordmark { display: inline-flex; align-items: center; line-height: 0; } html.sm-theme .logo-img--wordmark { display: block; width: auto; height: clamp(56px, 12vw, 88px); max-width: min(320px, 82vw); object-fit: contain; flex-shrink: 1; } html.sm-theme .logo--wordmark .logo-text, html.sm-theme .logo--wordmark + .logo-text { display: none; } html.sm-theme .logo-img--lg { width: 140px; height: 140px; object-fit: contain; } html.sm-theme .logo-svg--eye, html.sm-theme .logo-mark-svg.logo-svg--eye { overflow: visible; } html.sm-theme .logo-mark { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; flex-shrink: 0; line-height: 0; } /* About page: emblem above wordmark (FinTrend Lab proportions) */ html.sm-theme .about-hero { padding: 56px 0 48px; } html.sm-theme .about-hero__inner { position: relative; z-index: 1; gap: clamp(20px, 5vw, 36px); } html.sm-theme .about-hero__mark { display: inline-flex; align-items: center; justify-content: center; line-height: 0; } html.sm-theme .about-hero__mark .logo-img--lg { width: clamp(160px, 24vw, 220px); height: clamp(160px, 24vw, 220px); object-fit: contain; } html.sm-theme .about-hero__mark:hover { transform: translateY(-3px); } html.sm-theme .about-hero__title { margin: 0; font-family: 'Exo 2', var(--font-display); font-size: clamp(2.25rem, 5.5vw, 3.25rem); font-weight: 600; line-height: 1.05; letter-spacing: 0.04em; text-transform: none; color: var(--color-text); } html.sm-theme .about-hero__title-accent { font-weight: 700; letter-spacing: 0.06em; background: linear-gradient(128deg, #c8ff5a 0%, #3dff8a 42%, #14b8a6 100%); -webkit-background-clip: text; background-clip: text; color: transparent; text-shadow: none; } html.sm-theme section.about-company { padding-top: 52px; } /* // kicker — green slashes + lavender label (all section/footer/editorial labels) */ html.sm-theme :is( .section-head--v2 .eyebrow, .editorial-panel__eyebrow, .editorial-panel__social-title, .footer-col h4 ) { display: block; margin: 0 0 6px; font-family: var(--font-mono); font-size: .68rem; font-weight: 600; line-height: 1.35; letter-spacing: .14em; text-transform: uppercase; color: var(--color-accent-2); background: none; border: none; border-radius: 0; padding: 0; box-shadow: none; } html.sm-theme :is( .section-head--v2 .eyebrow, .editorial-panel__eyebrow, .editorial-panel__social-title, .footer-col h4 )::before { content: '// '; color: var(--color-accent); } html.sm-theme :is(.editorial-panel__eyebrow, .editorial-panel__social-title) { margin-bottom: 12px; } html.sm-theme .footer-col h4 { margin-bottom: 18px; } html.sm-theme .editorial-panel__heading { margin: 0 0 16px; font-family: 'Exo 2', var(--font-display); font-size: clamp(2rem, 4.2vw, 2.65rem); font-weight: 600; line-height: 1.05; letter-spacing: 0.04em; text-transform: none; color: var(--color-text); } html.sm-theme .editorial-panel__heading .logo-text-accent { font-weight: 700; letter-spacing: 0.06em; } /* ========== CTA panels (teal + gold, not legacy green/amber) ========== */ html.sm-theme .cta-block, html.sm-theme .review-cta-mini { background: var(--color-surface); border: 1px solid var(--color-border-strong); color: var(--color-text); box-shadow: var(--shadow-sm); } html.sm-theme .cta-block::before, html.sm-theme .cta-block::after, html.sm-theme .review-cta-mini::before { display: none; } html.sm-theme .cta-block h2, html.sm-theme .review-cta-mini h3 { color: var(--color-text); } html.sm-theme .cta-block p, html.sm-theme .review-cta-mini p { color: var(--color-text-muted); } html.sm-theme .site-header--v2 .header-right { grid-column: 2; grid-row: 1; } html.sm-theme .site-header--v2 .main-nav { grid-column: 1 / -1; grid-row: 2; width: 100%; border-top: 1px solid var(--color-border); margin-top: 12px; padding: 10px 0 12px; } html.sm-theme .site-header--v2 .main-nav--pills ul { justify-content: center; flex-wrap: wrap; gap: 4px 0; padding: 0; background: transparent !important; border: none !important; border-radius: 0 !important; } html.sm-theme .site-header--v2 .main-nav--pills .nav-pill-indicator { display: none !important; } html.sm-theme .site-header--v2 .main-nav--pills li + li { border-left: none; } html.sm-theme .site-header--v2 .main-nav--pills li:not(:last-child)::after { content: '·'; margin: 0 6px 0 10px; color: var(--color-text-muted); font-weight: 700; pointer-events: none; } html.sm-theme .site-header--v2 .main-nav--pills a { padding: 8px 12px; border-radius: var(--radius-sm); font-family: var(--font-mono); font-size: .7rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-text-muted); background: transparent !important; border: 1px solid transparent; position: relative; } html.sm-theme .site-header--v2 .main-nav--pills a::after { display: block !important; content: ''; position: absolute; left: 10px; right: 10px; bottom: 2px; height: 2px; border-radius: 2px; background: linear-gradient( 90deg, transparent 0%, #9333ea 12%, var(--color-accent-2) 50%, #9333ea 88%, transparent 100% ); box-shadow: none; transform: scaleX(0); opacity: 0; transition: transform .22s ease, opacity .22s ease, box-shadow .22s ease; } html.sm-theme .site-header--v2 .main-nav--pills a:hover, html.sm-theme .site-header--v2 .main-nav--pills a.active { color: var(--color-accent) !important; background: rgba(61, 255, 138, .08) !important; border-color: rgba(61, 255, 138, .28) !important; box-shadow: inset 0 0 16px rgba(61, 255, 138, .06); } html.sm-theme .site-header--v2 .main-nav--pills a.active::after, html.sm-theme .site-header--v2 .main-nav--pills a:hover::after { transform: scaleX(1); opacity: 1; box-shadow: 0 0 5px rgba(196, 181, 253, .8), 0 0 12px rgba(167, 139, 250, .45); } html.sm-theme .site-header--v2 .main-nav--pills a.active::after { animation: sm-nav-underline-glow-soft 2.8s ease-in-out infinite; } @keyframes sm-nav-underline-glow-soft { 0%, 100% { box-shadow: 0 0 4px rgba(167, 139, 250, .65), 0 0 10px rgba(167, 139, 250, .35); } 50% { box-shadow: 0 0 7px rgba(196, 181, 253, .9), 0 0 16px rgba(167, 139, 250, .5); } } @media (prefers-reduced-motion: reduce) { html.sm-theme .site-header--v2 .main-nav--pills a.active::after { animation: none; box-shadow: 0 0 5px rgba(196, 181, 253, .8), 0 0 12px rgba(167, 139, 250, .45); } } html.sm-theme .lang-btn, html.sm-theme .menu-toggle { border-radius: var(--radius-sm); border: 1px solid var(--color-border-strong); background: var(--color-bg-soft); color: var(--color-text); font-family: var(--font-sans); } html.sm-theme .header-cta { font-family: var(--font-mono) !important; font-size: .72rem !important; letter-spacing: .1em !important; text-transform: uppercase !important; } /* ========== Buttons (primary + ghost only) ========== */ html.sm-theme .btn, html.sm-theme .btn-primary, html.sm-theme .btn-ghost, html.sm-theme a.btn-read-full, html.sm-theme .similar-review-card .read-more { border-radius: var(--radius-sm); font-family: var(--font-mono); font-size: .78rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px)); transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease; } html.sm-theme .btn-primary { background: linear-gradient(135deg, var(--color-accent) 0%, #22c55e 100%); color: var(--color-ink); border: none; box-shadow: var(--glow-green), var(--shadow-sm); } html.sm-theme .btn-primary:hover { background: linear-gradient(135deg, var(--color-accent-hover) 0%, var(--color-accent) 100%); color: var(--color-ink); transform: translateY(-2px); box-shadow: 0 0 32px rgba(61, 255, 138, .55), var(--shadow-md); } html.sm-theme .btn-sm { padding: 8px 16px; font-size: .72rem; gap: 6px; } html.sm-theme .btn-ghost { background: color-mix(in srgb, var(--color-bg-soft) 75%, transparent); border: 1px solid var(--color-border-strong); color: var(--color-text-soft); box-shadow: none; } html.sm-theme .btn-ghost:hover { background: rgba(61, 255, 138, .08); border-color: var(--color-accent); color: var(--color-accent); box-shadow: inset 0 0 20px rgba(61, 255, 138, .08); } /* «Читать полный отзыв» — same look/size as btn-primary.btn-sm («Оставить отзыв») */ html.sm-theme a.btn-read-full, html.sm-theme .similar-review-card .read-more { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; margin-top: 10px; padding: 8px 16px; font-size: .72rem; line-height: 1; text-decoration: none; background: linear-gradient(135deg, var(--color-accent) 0%, #22c55e 100%); color: var(--color-ink); border: none; box-shadow: var(--glow-green), var(--shadow-sm); } html.sm-theme a.btn-read-full:hover, html.sm-theme .similar-review-card:hover .read-more { background: linear-gradient(135deg, var(--color-accent-hover) 0%, var(--color-accent) 100%); color: var(--color-ink); transform: translateY(-2px); box-shadow: 0 0 32px rgba(61, 255, 138, .55), var(--shadow-md); } html.sm-theme .similar-review-card .read-more { margin-top: auto; } html.sm-theme a.btn-read-full svg { width: 14px; height: 14px; flex-shrink: 0; transition: transform .2s ease; } html.sm-theme a.btn-read-full:hover svg { transform: translateX(2px); } /* ========== Hero: title band + score dashboard ========== */ html.sm-theme .hero, html.sm-theme .hero--v2 { padding: 0 !important; background: transparent !important; border-bottom: none !important; position: relative; overflow: visible; } html.sm-theme .hero--v2::before, html.sm-theme .hero--v2::after { display: none !important; } html.sm-theme .hero--v2 > .container { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: stretch; gap: clamp(28px, 4vw, 40px); max-width: var(--container); padding-left: var(--container-pad); padding-right: var(--container-pad); padding-bottom: clamp(32px, 4vw, 48px); } html.sm-theme .hero-top { position: relative; isolation: isolate; text-align: center; width: 100%; max-width: 760px; margin: 0 auto; padding: clamp(40px, 5.5vw, 56px) 0 clamp(36px, 4.5vw, 48px); border: none; background: transparent; } html.sm-theme .hero-top::before { content: ''; position: absolute; top: 0; bottom: 0; left: 50%; transform: translateX(-50%); width: 100vw; z-index: -1; pointer-events: none; background: radial-gradient(ellipse 85% 100% at 72% -20%, rgba(34, 211, 238, .12), transparent 58%), radial-gradient(ellipse 65% 80% at 18% 30%, rgba(167, 139, 250, .08), transparent 52%), linear-gradient(180deg, var(--color-bg-alt) 0%, var(--color-bg) 100%); box-shadow: 0 18px 44px rgba(0, 0, 0, .26); } html.sm-theme .hero-top::after { content: ''; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); width: 100vw; height: 3px; background: linear-gradient( 90deg, transparent 0%, var(--color-accent-2) 18%, var(--color-accent) 50%, var(--color-accent-3) 82%, transparent 100% ); box-shadow: 0 0 22px rgba(61, 255, 138, .32); opacity: 1; pointer-events: none; } html.sm-theme .hero-kicker { display: inline-flex; align-items: center; justify-content: center; gap: 8px; margin: 0 auto 18px; padding: 7px 14px; border-radius: 999px; background: rgba(21, 28, 46, .65); border: 1px solid rgba(61, 255, 138, .22); color: var(--color-accent); font-family: var(--font-sans); font-size: .72rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; box-shadow: none; } html.sm-theme .hero-kicker::before { content: none; } html.sm-theme .hero-kicker .ico { width: 14px; height: 14px; color: var(--color-accent-2); flex-shrink: 0; } html.sm-theme .hero--v2 .hero-top h1 { max-width: 720px; margin: 0 auto 16px; font-size: clamp(1.75rem, 3.6vw, 2.5rem); font-weight: 600; letter-spacing: -.02em; line-height: 1.22; } html.sm-theme .hero-sub { max-width: 640px; margin: 0 auto 0; font-size: 1.02rem; line-height: 1.6; color: var(--color-text-soft); } html.sm-theme .hero-sub strong { color: var(--color-text); font-weight: 600; } html.sm-theme .hero-actions { display: flex; flex-direction: column; align-items: center; gap: 16px; width: 100%; max-width: 520px; margin: clamp(22px, 3vw, 28px) auto 0; padding-top: clamp(20px, 3vw, 26px); border-top: 1px solid rgba(61, 255, 138, .14); } html.sm-theme .hero-actions .hero-meta { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0; } html.sm-theme .hero-actions .hero-cta { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; width: 100%; margin: 0; } html.sm-theme .hero-top > .hero-meta, html.sm-theme .hero-top > .hero-cta { justify-content: center; } html.sm-theme .meta-pill { border-radius: 999px; background: var(--color-bg-soft); border: 1px solid var(--color-border); color: var(--color-text-soft); font-family: var(--font-sans); font-size: .8rem; box-shadow: none; } /* Shared panel shell — corner frame + scan wave */ html.sm-theme :is( .score-dashboard, .signal-list, .verdict-col, .reviews-summary--compact, .author-strip__inner, .contact-hub__panel, .score-sidebar, .result-block, .contact-card, .article-card, .cta-block, .review-cta-mini, .review-comment-hub__panel ) { position: relative; overflow: hidden; overflow-x: clip; color: var(--color-text); border: 1px solid var(--color-border-strong); border-radius: var(--radius-lg); background: linear-gradient(160deg, var(--color-surface-elevated) 0%, var(--color-bg) 100%); box-shadow: var(--shadow-lg), inset 0 1px 0 rgba(255, 255, 255, .04); backdrop-filter: blur(12px); } html.sm-theme :is( .score-dashboard, .signal-list, .verdict-col, .reviews-summary--compact, .author-strip__inner, .contact-hub__panel, .score-sidebar, .result-block, .contact-card, .article-card, .cta-block, .review-cta-mini, .review-comment-hub__panel )::before { display: block; content: ''; position: absolute; inset: 0; border-radius: inherit; /* TL / BR corner accents — SVG path follows same radius as panel */ background: var(--sm-corner-tl-green) left top / 24px 24px no-repeat, var(--sm-corner-br-violet) right bottom / 24px 24px no-repeat; pointer-events: none; opacity: .9; z-index: 0; } html.sm-theme :is( .score-dashboard, .signal-list, .verdict-col, .reviews-summary--compact, .author-strip__inner, .contact-hub__panel, .score-sidebar, .result-block, .contact-card, .article-card, .cta-block, .review-cta-mini, .review-comment-hub__panel )::after { content: ''; position: absolute; top: 0; left: 0; width: 45%; height: 100%; z-index: 0; pointer-events: none; background: linear-gradient( 90deg, transparent 0%, rgba(61, 255, 138, .04) 25%, rgba(61, 255, 138, .11) 50%, rgba(61, 255, 138, .04) 75%, transparent 100% ); transform: translate3d(-100%, 0, 0); will-change: transform; animation: sm-panel-scan 5.5s ease-in-out infinite; } html.sm-theme :is( .score-dashboard, .signal-list, .verdict-col, .reviews-summary--compact, .author-strip__inner, .contact-hub__panel, .score-sidebar, .result-block, .contact-card, .article-card, .cta-block, .review-cta-mini, .review-comment-hub__panel ) > * { position: relative; z-index: 1; } @keyframes sm-panel-scan { 0% { transform: translate3d(-100%, 0, 0); } 100% { transform: translate3d(320%, 0, 0); } } html.sm-theme .score-dashboard::after { animation-duration: 5s; animation-delay: 0s; } html.sm-theme .author-strip__inner::after { animation-duration: 6s; animation-delay: 0.6s; } html.sm-theme .verdict-col--plus::after { animation-duration: 5.5s; animation-delay: 1.2s; } html.sm-theme .verdict-col--minus::after { animation-duration: 6.2s; animation-delay: 2.4s; } html.sm-theme .signal-list::after { animation-duration: 6.5s; animation-delay: 0.9s; } html.sm-theme .reviews-summary--compact::after { animation-duration: 5.8s; animation-delay: 1.8s; } html.sm-theme .score-sidebar::after { animation-duration: 5.2s; animation-delay: 0.4s; } html.sm-theme .contact-hub__panel::after { animation-duration: 6.8s; animation-delay: 2s; } html.sm-theme .contact-card::after, html.sm-theme .result-block::after, html.sm-theme .article-card::after, html.sm-theme .cta-block::after, html.sm-theme .review-cta-mini::after, html.sm-theme .review-comment-hub__panel::after { animation-duration: 6s; animation-delay: 1.4s; } /* Score dashboard layout */ html.sm-theme .hero--v2 .score-dashboard { margin: 0; } html.sm-theme .score-dashboard { display: grid; grid-template-columns: minmax(0, 1fr) minmax(200px, 260px); gap: 0 28px; align-items: stretch; width: 100%; max-width: none; margin: 0 0 40px; padding: 28px clamp(20px, 3vw, 32px); } html.sm-theme .score-dashboard__body, html.sm-theme .score-dashboard__aside { position: relative; z-index: 1; } html.sm-theme .score-dashboard__body { display: flex; flex-direction: column; gap: 22px; min-width: 0; } html.sm-theme .score-dashboard__primary { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 24px 32px; align-items: center; } html.sm-theme .score-dashboard__head { display: flex; flex-direction: column; align-items: flex-start; margin: 0; padding-right: 8px; border-right: 1px solid var(--color-border); } html.sm-theme .score-dashboard__figure { display: flex; align-items: baseline; gap: 8px; margin: 10px 0 0; } html.sm-theme .score-dashboard__label { margin: 0; color: var(--color-text-muted); font-family: var(--font-mono); font-size: .68rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; } html.sm-theme .score-dashboard__value { font-family: 'Exo 2', var(--font-display); font-size: clamp(3.25rem, 7vw, 4.75rem); font-weight: 700; line-height: 1; letter-spacing: -.02em; background: linear-gradient(165deg, #f8fafc 0%, var(--color-accent) 55%, var(--color-accent-3) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 0 22px rgba(61, 255, 138, .28)); } html.sm-theme .score-dashboard__max { color: var(--color-text-muted); font-family: 'Exo 2', var(--font-display); font-size: 1.05rem; font-weight: 600; } html.sm-theme .score-dashboard__progress { display: flex; flex-direction: column; gap: 12px; min-width: 0; } html.sm-theme .score-dashboard__progress-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; } html.sm-theme .score-dashboard__percent { font-family: 'Exo 2', var(--font-display); font-size: .9rem; font-weight: 600; letter-spacing: .04em; color: var(--color-text-soft); } html.sm-theme .score-meter { width: 100%; height: 12px; margin: 0; background: rgba(8, 12, 24, .65); border: 1px solid rgba(61, 255, 138, .18); border-radius: 999px; box-shadow: inset 0 1px 3px rgba(0, 0, 0, .35); } html.sm-theme .score-meter__fill { background: linear-gradient(90deg, var(--color-accent-2) 0%, var(--color-accent) 45%, var(--color-accent-3) 100%); border-radius: 999px; box-shadow: 0 0 14px rgba(61, 255, 138, .45); } html.sm-theme .score-dashboard .score-badge { margin: 0; padding: 6px 14px; border: 1px solid rgba(251, 191, 36, .35); background: rgba(251, 191, 36, .12); color: var(--color-warn); border-radius: 999px; font-family: var(--font-sans); font-size: .78rem; font-weight: 600; white-space: nowrap; } html.sm-theme .score-signals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; } html.sm-theme .score-signals li { display: flex; align-items: flex-start; gap: 8px; min-width: 0; padding: 10px 12px; border-radius: var(--radius-sm); border: 1px solid var(--color-border); border-left-width: 3px; background: rgba(8, 12, 24, .4); color: var(--color-text-soft); font-size: .76rem; line-height: 1.35; } html.sm-theme .score-signals li.is-ok { border-left-color: var(--color-positive); } html.sm-theme .score-signals li.is-warn { border-left-color: var(--color-warn); } html.sm-theme .score-signals .ico { flex-shrink: 0; margin-top: 1px; } html.sm-theme .score-dashboard__aside { display: flex; flex-direction: column; justify-content: center; gap: 16px; padding-left: 28px; border-left: 1px solid var(--color-border); text-align: left; } html.sm-theme .score-disclaimer { margin: 0; color: var(--color-text-muted); font-size: .75rem; line-height: 1.5; } /* ========== Author ========== */ html.sm-theme .author-strip { padding: 40px 0 16px; } html.sm-theme .author-strip__inner { display: grid; grid-template-columns: auto 1fr; gap: 20px; padding: 24px 28px; } html.sm-theme .author-strip__name { font-family: 'Exo 2', var(--font-display); font-weight: 600; } html.sm-theme .author-strip__avatar { display: block; flex-shrink: 0; border-radius: 50%; width: 56px; height: 56px; object-fit: cover; object-position: center top; background-color: var(--color-bg-soft); border: 2px solid rgba(61, 255, 138, .55); outline: 1px solid rgba(167, 139, 250, .4); outline-offset: 2px; box-shadow: 0 0 0 1px rgba(8, 12, 24, .9), 0 0 14px rgba(61, 255, 138, .22), 0 0 10px rgba(167, 139, 250, .18); } html.sm-theme .author-strip__role span { color: var(--color-accent); font-weight: 600; } /* ========== Review longread: metrics + result ========== */ html.sm-theme .review-metric-strip { gap: 12px; margin: 12px 0 20px; } html.sm-theme .review-metric-cell { background: var(--color-bg-soft); border-color: var(--color-border-strong); } html.sm-theme .review-metric-cell .num { color: var(--color-accent); } html.sm-theme .result-block { margin: 20px 0 28px; padding: 20px 24px 22px; text-align: left; box-shadow: var(--shadow-lg), inset 0 1px 0 rgba(255, 255, 255, .04), inset 3px 0 0 var(--color-accent); } html.sm-theme .result-block-label { font-family: var(--font-sans); font-size: .7rem; font-weight: 600; letter-spacing: .08em; color: var(--color-accent); margin: 0 0 6px; } html.sm-theme .result-block-value { font-family: var(--font-display); font-size: 1.15rem; font-weight: 600; line-height: 1.35; color: var(--color-text); margin: 0 0 10px; } html.sm-theme .result-block-help { font-size: .9rem; color: var(--color-text-muted); max-width: none; } /* ========== Verdict: pros / cons cards ========== */ html.sm-theme section.verdict-panel { padding: 20px 0 52px; } html.sm-theme .verdict-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: stretch; border: none; background: transparent; box-shadow: none; } html.sm-theme .verdict-col { display: flex; flex-direction: column; padding: 26px 28px; box-shadow: var(--shadow-lg), inset 0 1px 0 rgba(255, 255, 255, .04); } html.sm-theme .verdict-col--plus { box-shadow: var(--shadow-lg), inset 0 1px 0 rgba(255, 255, 255, .04); } html.sm-theme .verdict-col--minus { box-shadow: var(--shadow-lg), inset 0 1px 0 rgba(255, 255, 255, .04); } /* Minuses: violet TL, green BR */ html.sm-theme .verdict-col--minus::before { background: var(--sm-corner-tl-violet) left top / 24px 24px no-repeat, var(--sm-corner-br-green) right bottom / 24px 24px no-repeat; } html.sm-theme .verdict-col--minus h3 { color: var(--color-text); } html.sm-theme .verdict-col--minus .ico { color: var(--color-accent-2); } html.sm-theme .verdict-col h3 { font-family: 'Exo 2', var(--font-display); font-size: 1.05rem; font-weight: 600; letter-spacing: 0.02em; text-transform: none; border: none; padding: 0; } /* ========== Sections ========== */ html.sm-theme .section-alt { background: var(--color-bg-soft); border: none; } html.sm-theme section.section-alt { padding-top: 56px; } html.sm-theme .section-alt + .section-alt { padding-top: 28px; border-top: none; } html.sm-theme .section-alt:has(+ .section-alt) { padding-bottom: 28px; } html.sm-theme .section-head--v2, html.sm-theme .section-head.left.section-head--v2 { border-left: none; padding-left: 0; text-align: center; margin-left: auto; margin-right: auto; margin-bottom: 18px; } html.sm-theme .section-head--v2 + .article, html.sm-theme .section-head.left.section-head--v2 + .article { margin-top: 0; } html.sm-theme .section-head--v2 .section-sub { margin-top: 2px; } html.sm-theme .section-head.left.section-head--v2 { text-align: left; margin-left: 0; } html.sm-theme .section-head--v2::before, html.sm-theme .section-head.left.section-head--v2::before { content: none; } html.sm-theme .section-head--v2 { position: relative; padding-bottom: 18px; margin-bottom: clamp(24px, 4vw, 36px); } html.sm-theme .section-head--v2::after { content: ''; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); width: min(100%, 140px); height: 2px; border-radius: 2px; background: linear-gradient(90deg, transparent, var(--color-accent) 35%, var(--color-accent-3) 65%, transparent); box-shadow: 0 0 14px rgba(61, 255, 138, .28); opacity: .95; } html.sm-theme .section-head.left.section-head--v2::after { left: 0; transform: none; width: min(100%, 120px); } /* Review form header: no decorative divider line */ html.sm-theme #review-form .section-head--v2::after, html.sm-theme #review-form .section-head.left.section-head--v2::after { content: none; } html.sm-theme .section-head--v2 h2 { border: none; margin-bottom: 6px; font-family: var(--font-display); font-weight: 600; letter-spacing: -.02em; line-height: 1.22; } /* Contact hub: title + form in one column */ html.sm-theme .contact-hub__panel:not(:has(.contact-grid)) { display: flex; flex-direction: column; align-items: center; gap: 0; } html.sm-theme .contact-hub__panel:not(:has(.contact-grid)) > .section-head, html.sm-theme .contact-hub__panel:not(:has(.contact-grid)) > .contact-hub__form { width: 100%; max-width: min(760px, 100%); margin-inline: 0; } html.sm-theme .contact-hub__panel:not(:has(.contact-grid)) .about-contacts-head { margin-bottom: clamp(20px, 3vw, 28px); padding-bottom: 18px; } html.sm-theme .contact-hub__panel:not(:has(.contact-grid)) .about-contacts-head::after { width: min(100%, 160px); } html.sm-theme .contact-hub__panel:not(:has(.contact-grid)) .contact-hub__form-lead { max-width: none; } /* ========== Signals: numbered audit list ========== */ html.sm-theme .signal-list { display: flex; flex-direction: column; gap: 0; counter-reset: signal; } html.sm-theme .signal-row { display: grid !important; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 12px 20px; align-items: center; padding: 18px 24px; margin: 0; border: none; border-bottom: 1px solid var(--color-border); border-radius: 0; background: transparent; counter-increment: signal; box-shadow: none !important; transform: none !important; position: relative; z-index: 1; transition: background .2s ease; } html.sm-theme .signal-row:last-child { border-bottom: none; } html.sm-theme .signal-row::before { content: counter(signal, decimal-leading-zero); font-family: 'Exo 2', var(--font-display); font-size: 1.35rem; font-weight: 700; line-height: 1; color: var(--color-accent); opacity: .28; letter-spacing: 0.04em; grid-column: 1; align-self: center; } html.sm-theme .signal-row__icon { display: none; } html.sm-theme .signal-row > div { grid-column: 2; min-width: 0; } html.sm-theme .signal-row h3 { margin: 0 0 4px; font-family: 'Exo 2', var(--font-display); font-size: 1rem; font-weight: 600; letter-spacing: 0.02em; color: var(--color-text); } html.sm-theme .signal-row p { margin: 0; font-size: .82rem; line-height: 1.45; color: var(--color-text-muted); } html.sm-theme .signal-row .status { grid-column: 3; grid-row: 1; align-self: center; margin: 0; padding: 6px 14px; border-radius: 999px; font-family: var(--font-sans); font-size: .74rem; font-weight: 600; letter-spacing: 0.02em; text-transform: none; white-space: nowrap; } html.sm-theme .signal-row .status.status-ok { border: 1px solid rgba(61, 255, 138, .35); background: rgba(61, 255, 138, .1); color: var(--color-positive); } html.sm-theme .signal-row .status.status-warn { border: 1px solid rgba(251, 191, 36, .35); background: rgba(251, 191, 36, .1); color: var(--color-warn); } html.sm-theme .signal-row .status.status-neutral { border: 1px solid var(--color-border); background: rgba(8, 12, 24, .45); color: var(--color-text-soft); } html.sm-theme .signal-row:hover { background: rgba(61, 255, 138, .04); } /* ========== Review longread: sticky author card ========== */ html.sm-theme .review-page-grid { overflow: visible; } html.sm-theme .review-author-card { position: sticky; top: var(--sticky-sidebar-top, 108px); align-self: start; z-index: 5; max-height: calc(100vh - var(--sticky-sidebar-top, 108px) - 24px); overflow-y: auto; scrollbar-width: thin; } html.sm-theme .review-comment-hub { padding-bottom: 64px; } html.sm-theme .review-comment-hub__panel { background: var(--color-surface); border-color: var(--color-border-strong); } html.sm-theme .review-comment-hub__title { font-family: var(--font-display); font-weight: 600; } html.sm-theme .review-comment-hub__panel .contact-form { background: var(--color-bg-soft); } /* Sticky author card ends with main review grid, not the comment form section */ html.sm-theme .review-page-grid .review-author-card { align-self: start; } /* ========== Reviews summary panel ========== */ html.sm-theme .reviews-summary--compact { display: grid; grid-template-columns: minmax(150px, 200px) minmax(0, 1fr); align-items: center; gap: 24px clamp(32px, 5vw, 56px); padding: clamp(24px, 3.5vw, 32px) clamp(28px, 4vw, 40px); position: relative; z-index: 1; } html.sm-theme .reviews-summary--compact .rs-score { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; } html.sm-theme .reviews-summary--compact .rs-num { font-family: 'Exo 2', var(--font-display); font-size: clamp(2.75rem, 5vw, 3.5rem); font-weight: 700; line-height: 1; letter-spacing: -.03em; } html.sm-theme .reviews-summary--compact .rs-stars { display: inline-flex; gap: 4px; margin: 0; } html.sm-theme .reviews-summary--compact .rs-stars .star { width: 20px; height: 20px; } html.sm-theme .reviews-summary--compact .rs-count { font-size: .8rem; color: var(--color-text-muted); max-width: 12rem; line-height: 1.45; } html.sm-theme .reviews-summary--compact .rs-bars { gap: 10px; } html.sm-theme .reviews-summary--compact .rs-row { grid-template-columns: 38px minmax(0, 1fr) 42px; gap: 12px 16px; align-items: center; font-size: .82rem; color: var(--color-text-muted); } html.sm-theme .reviews-summary--compact .rs-row > span:first-child { font-weight: 500; font-variant-numeric: tabular-nums; } html.sm-theme .reviews-summary--compact .rs-row > span:last-child { text-align: right; font-variant-numeric: tabular-nums; color: var(--color-text-soft); } html.sm-theme .reviews-summary--compact .bar { height: 10px; border-radius: 2px; background: rgba(8, 12, 24, .55); border: 1px solid var(--color-border); } html.sm-theme .reviews-summary--compact .bar > div { border-radius: 1px; background: linear-gradient( 90deg, var(--color-accent) 0%, var(--color-accent-3) 55%, var(--color-accent-2) 100% ); box-shadow: 0 0 12px rgba(61, 255, 138, .25); } html.sm-theme .review-list { border: none; gap: 16px; } html.sm-theme .review-row { border-radius: var(--radius-lg); border: 1px solid var(--color-border); background: var(--color-surface); box-shadow: var(--shadow-sm); border-top: 3px solid var(--color-accent); } html.sm-theme .review-row:hover { border-left: 1px solid var(--color-border); border-top-color: var(--color-accent-hover); box-shadow: var(--shadow-md); } html.sm-theme .review-row .avatar, html.sm-theme .similar-review-card .avatar { border-radius: 50%; } html.sm-theme img.avatar, html.sm-theme img.author-avatar { background-color: var(--color-bg-soft); } html.sm-theme .rs-num, html.sm-theme .trust-score-num { color: var(--color-accent); background: none; -webkit-background-clip: unset; } /* ========== FAQ ========== */ html.sm-theme .faq-item { border-radius: var(--radius-md); border: 1px solid var(--color-border); background: var(--color-surface); } html.sm-theme .faq-item[open] { border-color: var(--color-accent); background: var(--color-accent-soft); } html.sm-theme .faq-question { font-family: var(--font-display); font-weight: 600; } /* ========== Footer ========== */ html.sm-theme .site-footer { background: var(--color-footer) !important; color: var(--color-text-soft); border-top: none !important; margin-top: 56px; } html.sm-theme .site-footer a:hover { color: var(--color-accent-hover); } html.sm-theme .footer-col { background: rgba(255, 255, 255, .04); border-color: var(--color-border); border-radius: var(--radius-md); } html.sm-theme .footer-col a { color: var(--color-text-muted); } html.sm-theme .footer-col a:hover { color: var(--color-text); } /* ========== Inner pages: page title band (masks body grid) ========== */ html.sm-theme .page-header { position: relative; isolation: isolate; padding: clamp(44px, 6vw, 60px) 0 clamp(36px, 4.5vw, 48px); margin-bottom: 0; border-bottom: none; background: transparent; box-shadow: 0 16px 48px rgba(0, 0, 0, .28); } html.sm-theme .page-header::before { content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: radial-gradient(ellipse 90% 120% at 78% -30%, rgba(34, 211, 238, .14), transparent 55%), radial-gradient(ellipse 70% 90% at 12% 20%, rgba(167, 139, 250, .1), transparent 50%), linear-gradient(180deg, var(--color-bg-alt) 0%, var(--color-bg) 100%); } html.sm-theme .page-header::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; height: 3px; background: linear-gradient( 90deg, transparent 0%, var(--color-accent-2) 18%, var(--color-accent) 50%, var(--color-accent-3) 82%, transparent 100% ); box-shadow: 0 0 24px rgba(61, 255, 138, .35), 0 1px 0 rgba(0, 0, 0, .4); opacity: 1; } html.sm-theme .page-header .container { position: relative; z-index: 2; } html.sm-theme .page-header h1 { max-width: 820px; margin-bottom: 14px; font-size: clamp(1.85rem, 4vw, 2.75rem); font-weight: 600; letter-spacing: -.015em; line-height: 1.25; } html.sm-theme .page-header .page-sub { color: var(--color-text-soft); } html.sm-theme .page-header .hero-meta { margin-top: 4px; } html.sm-theme main > .page-header + .section, html.sm-theme main > .about-hero + .section { padding-top: clamp(52px, 6vw, 72px); } html.sm-theme .about-hero { position: relative; isolation: isolate; border-bottom: none; box-shadow: 0 12px 40px rgba(0, 0, 0, .22); /* padding set above with logo sizing */ } html.sm-theme .about-hero::before { content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: radial-gradient(ellipse 90% 120% at 78% -30%, rgba(34, 211, 238, .14), transparent 55%), radial-gradient(ellipse 70% 90% at 12% 20%, rgba(167, 139, 250, .1), transparent 50%), linear-gradient(180deg, var(--color-bg-alt) 0%, var(--color-bg) 100%); } html.sm-theme .about-hero::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: linear-gradient( 90deg, transparent 0%, var(--color-accent-2) 18%, var(--color-accent) 50%, var(--color-accent-3) 82%, transparent 100% ); box-shadow: 0 0 20px rgba(61, 255, 138, .3); opacity: 1; pointer-events: none; } html.sm-theme .contact-card, html.sm-theme .article-card { padding: 22px 24px; } html.sm-theme .split-grid--score { overflow: visible; } html.sm-theme .split-grid--score .score-sidebar { display: flex; flex-direction: column; gap: 14px; padding: 22px 24px; align-self: start; position: sticky; top: var(--sticky-sidebar-top, 108px); height: fit-content; max-height: calc(100vh - var(--sticky-sidebar-top, 108px) - 24px); overflow-x: hidden; overflow-y: auto; z-index: 5; color: var(--color-text); border: 1px solid var(--color-border-strong); border-radius: var(--radius-lg); background: linear-gradient(160deg, var(--color-surface-elevated) 0%, var(--color-bg) 100%); box-shadow: var(--shadow-lg), inset 0 1px 0 rgba(255, 255, 255, .04); backdrop-filter: blur(12px); scrollbar-width: thin; } html.sm-theme .score-sidebar > * { position: relative; z-index: 1; } html.sm-theme .score-sidebar__label { font-family: var(--font-mono); font-size: .68rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--color-text-muted); } html.sm-theme .score-sidebar__value { font-family: 'Exo 2', var(--font-display); font-size: clamp(2.5rem, 5vw, 3.25rem); font-weight: 700; line-height: 1; background: linear-gradient(165deg, #f8fafc 0%, var(--color-accent) 55%, var(--color-accent-3) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; } html.sm-theme .score-sidebar__max { font-family: 'Exo 2', var(--font-display); font-size: 1rem; font-weight: 600; color: var(--color-text-muted); } html.sm-theme .score-sidebar .score-meter { width: 100%; height: 10px; margin: 0; background: rgba(8, 12, 24, .65); border: 1px solid rgba(61, 255, 138, .18); border-radius: 999px; } html.sm-theme .score-sidebar .score-badge { align-self: flex-start; margin: 0; padding: 6px 14px; border: 1px solid rgba(251, 191, 36, .35); background: rgba(251, 191, 36, .12); color: var(--color-warn); border-radius: 999px; font-size: .76rem; font-weight: 600; } html.sm-theme .score-sidebar .score-signals { display: flex; flex-direction: column; gap: 8px; margin: 0; } html.sm-theme .score-sidebar .score-signals li { display: flex; align-items: flex-start; gap: 8px; padding: 10px 12px; border-radius: var(--radius-sm); border: 1px solid var(--color-border); border-left-width: 3px; background: rgba(8, 12, 24, .4); font-size: .76rem; line-height: 1.35; color: var(--color-text-soft); } html.sm-theme .score-sidebar .score-signals li.is-ok { border-left-color: var(--color-positive); } html.sm-theme .score-sidebar .score-signals li.is-warn { border-left-color: var(--color-warn); } html.sm-theme .score-sidebar .score-disclaimer { margin: 0; font-size: .72rem; color: var(--color-text-muted); line-height: 1.45; } html.sm-theme input, html.sm-theme textarea, html.sm-theme select { background: var(--color-surface) !important; border: 1px solid var(--color-border-strong) !important; border-radius: var(--radius-sm) !important; color: var(--color-text) !important; } html.sm-theme input:focus, html.sm-theme textarea:focus { border-color: var(--color-accent) !important; box-shadow: 0 0 0 3px var(--color-accent-soft) !important; } /* ========== Responsive ========== */ @media (max-width: 900px) { html.sm-theme .score-dashboard { grid-template-columns: 1fr; gap: 24px; padding: 24px 20px; } html.sm-theme .score-dashboard__primary { grid-template-columns: 1fr; gap: 20px; } html.sm-theme .score-dashboard__head { align-items: center; padding-right: 0; border-right: none; padding-bottom: 16px; border-bottom: 1px solid var(--color-border); width: 100%; } html.sm-theme .score-dashboard__figure { justify-content: center; } html.sm-theme .score-signals { grid-template-columns: 1fr; } html.sm-theme .split-grid--score .score-sidebar { position: relative; top: auto; max-height: none; overflow-x: hidden; overflow-y: visible; } html.sm-theme .score-dashboard__aside { padding-left: 0; padding-top: 20px; border-left: none; border-top: 1px solid var(--color-border); text-align: center; align-items: center; } html.sm-theme .verdict-panel { grid-template-columns: 1fr; } html.sm-theme .site-header--v2 .main-nav--pills li:not(:last-child)::after { display: none; } } @media (max-width: 768px) { html.sm-theme .site-header--v2 .header-inner { grid-template-columns: 1fr auto; } html.sm-theme .hero-top { max-width: 100%; padding-top: 32px; } html.sm-theme .hero-actions .hero-cta { flex-direction: column; align-items: stretch; } html.sm-theme .hero-actions .hero-cta .btn { width: 100%; justify-content: center; } html.sm-theme .reviews-summary--compact { grid-template-columns: 1fr; gap: 24px; padding: 24px 22px; } html.sm-theme .reviews-summary--compact .rs-score { align-items: center; text-align: center; width: 100%; } html.sm-theme .reviews-summary--compact .rs-count { max-width: none; } html.sm-theme .signal-row { grid-template-columns: 40px 1fr; } html.sm-theme .signal-row .status { grid-column: 2; justify-self: start; margin-top: 8px; } } /* ========== RADICAL V3 — cards, sections, footer ========== */ html.sm-theme .meta-pill { font-family: var(--font-mono); font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; border-color: rgba(167, 139, 250, .25); background: color-mix(in srgb, var(--color-bg-soft) 70%, transparent); } html.sm-theme .dot-green { background: var(--color-accent); box-shadow: 0 0 10px var(--color-accent); } html.sm-theme .feature-card, html.sm-theme .article-card, html.sm-theme .contact-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); backdrop-filter: blur(10px); box-shadow: var(--shadow-md); transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; } html.sm-theme .feature-card:hover, html.sm-theme .article-card:hover { transform: translateY(-4px); border-color: var(--color-border-strong); box-shadow: var(--shadow-lg); } html.sm-theme .feature-card .ico, html.sm-theme .article-card .ico { color: var(--color-accent); filter: drop-shadow(0 0 8px rgba(61, 255, 138, .4)); } html.sm-theme .verdict-col { backdrop-filter: blur(12px); } html.sm-theme .review-row { border-radius: var(--radius-lg); border-top: 2px solid var(--color-accent) !important; background: var(--color-surface) !important; backdrop-filter: blur(8px); transition: transform .2s ease, box-shadow .2s ease; } html.sm-theme .review-row:hover { transform: translateX(6px); box-shadow: var(--shadow-lg) !important; } html.sm-theme .review-row .avatar { color: var(--color-ink) !important; box-shadow: 0 0 16px rgba(61, 255, 138, .35); } html.sm-theme .site-footer { position: relative; border-top: none !important; background: linear-gradient(180deg, transparent, var(--color-footer) 24%) !important; } html.sm-theme .site-footer::before { content: ''; display: block; height: 2px; margin-bottom: clamp(28px, 4vw, 40px); background: linear-gradient(90deg, transparent, var(--color-accent-2), var(--color-accent), transparent); opacity: .7; } html.sm-theme .site-footer .footer-grid { padding-top: 0; } html.sm-theme .footer-col { background: rgba(12, 18, 36, .6); border: 1px solid var(--color-border); } html.sm-theme .faq-item[open] { border-color: var(--color-accent); box-shadow: inset 0 0 24px rgba(61, 255, 138, .06); } html.sm-theme .cta-block, html.sm-theme .review-cta-mini { background: linear-gradient(135deg, var(--color-surface), var(--color-bg-alt)); border: 1px solid var(--color-border-strong); box-shadow: var(--shadow-lg); } @media (prefers-reduced-motion: reduce) { html.sm-theme :is(h1, h2, h3, h4) .text-accent, html.sm-theme :is( .score-dashboard, .signal-list, .verdict-col, .reviews-summary--compact, .author-strip__inner, .contact-hub__panel, .score-sidebar, .result-block, .contact-card, .article-card, .cta-block, .review-cta-mini, .review-comment-hub__panel )::after { animation: none; opacity: 0; } }