:root {
    --cp-bg: #07090f;
    --cp-bg-2: #0d1119;
    --cp-panel: rgba(14, 16, 24, 0.88);
    --cp-panel-2: rgba(20, 23, 34, 0.92);
    --cp-line: rgba(255, 196, 0, 0.18);
    --cp-line-soft: rgba(255, 255, 255, 0.05);
    --cp-yellow: #ffd43b;
    --cp-amber: #ffb703;
    --cp-orange: #ff7b00;
    --cp-red: #ff4d6d;
    --cp-cyan: #00e5ff;
    --cp-text: #f8fafc;
    --cp-muted: #b7c2d0;
    --cp-glow: 0 0 0 1px rgba(255,255,255,.02) inset, 0 0 28px rgba(255,123,0,.07);
}

body {
    background:
        radial-gradient(circle at 18% 18%, rgba(255, 179, 0, 0.16), transparent 22%),
        radial-gradient(circle at 82% 12%, rgba(255, 77, 109, 0.14), transparent 26%),
        radial-gradient(circle at 50% 80%, rgba(0, 229, 255, 0.08), transparent 24%),
        linear-gradient(160deg, #05070d 0%, #090c14 42%, var(--cp-bg-2) 100%) !important;
    color: var(--cp-text) !important;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
        repeating-linear-gradient(to bottom, rgba(255,255,255,.022) 0 1px, transparent 1px 4px),
        linear-gradient(90deg, rgba(255,200,0,.02), transparent 18%, transparent 82%, rgba(0,229,255,.025));
    opacity: .22;
    mix-blend-mode: screen;
    z-index: -2;
}

body::after {
    background: radial-gradient(circle at center, transparent 55%, rgba(0,0,0,.25) 100%) !important;
    opacity: 1 !important;
}

.portal-navbar,
.site-footer,
.cookie-consent-banner,
.panel,
.hero-panel,
.service-item,
.contact-list li,
.legal-content,
.container,
.card,
.tile,
.info-card,
.cta,
.portal-card,
.summary-card,
.admin-table-card,
.chart-panel,
.stat-card,
.profile-card,
.qr-block,
.admin-menu-bar {
    background: linear-gradient(180deg, rgba(17, 20, 30, 0.94), rgba(10, 12, 20, 0.9)) !important;
    border: 1px solid var(--cp-line) !important;
    box-shadow: var(--cp-glow) !important;
}

.portal-navbar,
.card,
.cta,
.panel,
.qr-block,
.hero-panel {
    clip-path: polygon(0 0, 97% 0, 100% 10%, 100% 100%, 3% 100%, 0 90%);
}

.admin-menu-bar {
    clip-path: polygon(0 0, 99% 0, 100% 35%, 100% 100%, 1% 100%, 0 65%);
}

.tile,
.summary-card,
.service-item,
.portal-card,
.info-card {
    clip-path: polygon(0 0, 90% 0, 100% 20%, 100% 100%, 10% 100%, 0 80%);
}

.brand-title-text,
.brand-title,
.brand-word-hel,
.brand-word-system,
.hero h1,
.hero-panel .panel-header h1,
.panel-header h1,
.panel-header h2,
.section h2,
.cta h3,
h1, h2, h3 {
    font-family: 'Orbitron', 'Ubuntu', sans-serif !important;
}

.brand-title-text,
.brand-title {
    text-transform: uppercase !important;
    letter-spacing: .11em !important;
    color: var(--cp-yellow) !important;
    text-shadow: 0 0 7px rgba(255, 212, 59, .92), 0 0 20px rgba(255, 123, 0, .35) !important;
}

.brand-word-system,
.word-system {
    color: var(--cp-amber) !important;
    font-weight: 700 !important;
}

.brand-icon,
.heading-icon,
.portal-card__header .icon,
.download-card-header svg {
    color: var(--cp-yellow) !important;
}

.panel-header h1,
.hero h1,
.hero-panel .panel-header h1,
h1 {
    color: var(--cp-yellow) !important;
    text-transform: uppercase !important;
    letter-spacing: .05em !important;
    text-shadow: 0 0 8px rgba(255, 212, 59, .85), 0 0 22px rgba(255, 123, 0, .35) !important;
}

.panel-header h2,
.section h2,
.cta h3,
h2, h3 {
    color: var(--cp-orange) !important;
    text-transform: uppercase !important;
    letter-spacing: .05em !important;
    text-shadow: 0 0 8px rgba(255, 123, 0, .45) !important;
}

p, li, .note, .hero .note, .panel-header p, .section p, .section ul,
.tile p, .legal-section p, .legal-section li, .footer-bottom,
.foot-links, .portal-card__list, .portal-card .note {
    color: var(--cp-muted) !important;
}

.hero p, .cta p, .contact-list a, .legal-content p, .legal-content li {
    color: var(--cp-text) !important;
}

.site-nav a,
.main-nav .nav-link,
.btn-link,
.button,
.btn-primary,
.btn-ghost,
.btn-outline,
.btn-danger,
.table-action,
.download-actions a,
.login-btn,
.portal-card__button,
.portal-card__button--secondary,
.admin-menu-item {
    background: rgba(16, 22, 32, .88) !important;
    color: var(--cp-text) !important;
    border: 1px solid rgba(0,229,255,.2) !important;
    text-transform: uppercase !important;
    letter-spacing: .08em !important;
    clip-path: polygon(0 0, 94% 0, 100% 30%, 100% 100%, 6% 100%, 0 70%) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.btn-primary,
.button.primary,
.hero-actions .button.primary {
    background: linear-gradient(135deg, #2b1d00, #7c4f00) !important;
    color: #fff6bf !important;
    border: 1px solid rgba(255, 212, 59, .28) !important;
    box-shadow: 0 0 16px rgba(255, 183, 3, .16), inset 0 0 10px rgba(255, 212, 59, .08) !important;
}

.site-nav a:hover,
.main-nav .nav-link:hover,
.main-nav .nav-link.is-active,
.btn-link:hover,
.button:hover,
.btn-primary:hover,
.btn-ghost:hover,
.btn-outline:hover,
.btn-danger:hover,
.table-action:hover,
.download-actions a:hover,
.login-btn:hover,
.portal-card__button:hover,
.portal-card__button--secondary:hover,
.admin-menu-item:hover,
.admin-menu-item.is-active {
    background: linear-gradient(135deg, rgba(255, 183, 3, .14), rgba(255, 123, 0, .18)) !important;
    border-color: rgba(255, 183, 3, 0.28) !important;
    color: #fff !important;
    box-shadow: 0 0 18px rgba(255,123,0,.14) !important;
}

input, textarea, select, .mail-input, .mail-textarea,
.ticket-form input, .ticket-form select, .ticket-form textarea,
.filter-grid input, .filter-grid select {
    background: linear-gradient(180deg, rgba(20, 23, 34, .95), rgba(12, 15, 24, .9)) !important;
    border: 1px solid rgba(255, 183, 3, 0.14) !important;
    color: var(--cp-text) !important;
    clip-path: polygon(0 0, 98% 0, 100% 18%, 100% 100%, 2% 100%, 0 82%) !important;
    border-radius: 0 !important;
}

input:focus, textarea:focus, select:focus,
.mail-input:focus, .mail-textarea:focus,
.ticket-form input:focus, .ticket-form select:focus, .ticket-form textarea:focus,
.filter-grid input:focus, .filter-grid select:focus {
    border-color: rgba(255, 183, 3, 0.45) !important;
    box-shadow: 0 0 0 1px rgba(255, 212, 59, 0.08), 0 0 18px rgba(255, 123, 0, 0.12) !important;
    outline: none !important;
}

label, .ticket-form label, .filter-grid label, .mail-field label {
    color: var(--cp-yellow) !important;
    text-transform: uppercase !important;
    letter-spacing: .08em !important;
    text-shadow: 0 0 4px rgba(255,244,140,.9), 0 0 10px rgba(255,183,3,.78), 0 0 18px rgba(255,123,0,.4) !important;
}

.panel::after,
.hero-panel::after,
.service-item::after,
.contact-list li::after,
.site-footer::after,
.cookie-consent-banner::after,
.portal-navbar::after,
.card::after,
.tile::after,
.cta::after,
.login-btn::after,
.nav-link::after,
.admin-menu-bar::after,
.summary-card::after,
.admin-table-card::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(118deg, transparent 0 18%, rgba(255,183,3,.06) 19% 20%, transparent 21% 62%, rgba(255,123,0,.08) 63% 64%, transparent 65% 100%),
        radial-gradient(circle at 88% 12%, rgba(255,212,59,.12) 0 2px, transparent 3px);
    mix-blend-mode: screen;
    opacity: .55;
}
