@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=Noto+Sans+SC:wght@300;400;700&display=swap');

:root {
--neon-pink: #ff2d7b;
--neon-cyan: #00f0ff;
--neon-yellow: #ffe600;
--neon-green: #39ff14;
--neon-purple: #b026ff;
--dark-bg: #0a0a1a;
--dark-card: #111128;
--dark-surface: #1a1a3e;
--text-main: #e0e0ff;
--text-muted: #8888aa;
--gap: 10px;
}

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

body {
font-family:'Noto Sans SC','Microsoft YaHei',sans-serif;
background:var(--dark-bg);
color:var(--text-main);
line-height:1.7;
font-size:16px;
min-height:100vh;
background-image:
radial-gradient(ellipse at 20% 50%, rgba(176,38,255,0.08) 0%, transparent 50%),
radial-gradient(ellipse at 80% 20%, rgba(0,240,255,0.06) 0%, transparent 50%);
}

a { color:var(--neon-cyan); text-decoration:none; transition:color 0.2s; }
a:hover { color:var(--neon-pink); }

.site-header {
background:rgba(10,10,26,0.95);
border-bottom:2px solid var(--neon-cyan);
position:sticky;
top:0;
z-index:999;
box-shadow:0 2px 20px rgba(0,240,255,0.15);
}

.header-inner {
max-width:1100px;
margin:0 auto;
padding:10px 20px;
display:flex;
align-items:center;
justify-content:space-between;
}

.logo-link img {
display:block;
border-radius:8px;
box-shadow:0 0 12px rgba(0,240,255,0.4);
}

.burger {
position:relative;
z-index:1002;
background:none;
border:2px solid var(--neon-cyan);
border-radius:6px;
width:44px;
height:38px;
cursor:pointer;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:5px;
padding:6px;
transition:border-color 0.3s;
}

.burger span {
display:block;
width:24px;
height:2px;
background:var(--neon-cyan);
border-radius:2px;
transition:all 0.3s;
}

.burger.open { border-color:var(--neon-pink); }
.burger.open span { background:var(--neon-pink); }
.burger.open span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.burger.open span:nth-child(2) { opacity:0; }
.burger.open span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }

.nav-backdrop {
z-index:1000;
position:fixed;
top:0;left:0;right:0;bottom:0;
background:rgba(0,0,0,0.7);
opacity:0;
pointer-events:none;
transition:opacity 0.3s;
}
.nav-backdrop.open { opacity:1; pointer-events:auto; }

.nav {
z-index:1001;
position:fixed;
top:0;
right:-280px;
width:270px;
height:100vh;
background:linear-gradient(180deg,#0d0d2b 0%,#1a1a3e 100%);
border-left:2px solid var(--neon-purple);
transition:right 0.35s ease;
padding:80px 0 30px;
overflow-y:auto;
box-shadow:-5px 0 30px rgba(176,38,255,0.2);
}
.nav.open { right:0; }

.nav ul { list-style:none; }

.nav li { border-bottom:1px solid rgba(255,255,255,0.06); }

.nav a {
display:block;
padding:14px 24px;
font-family:'Orbitron','Noto Sans SC',sans-serif;
font-size:13px;
font-weight:700;
text-transform:uppercase;
letter-spacing:1px;
color:var(--text-main);
transition:all 0.2s;
}
.nav a:hover {
color:var(--neon-cyan);
background:rgba(0,240,255,0.06);
padding-left:30px;
text-shadow:0 0 8px rgba(0,240,255,0.5);
}

.main-content {
max-width:1100px;
margin:0 auto;
padding:20px 20px 30px;
}

.breadcrumbs {
font-size:13px;
color:var(--text-muted);
margin-bottom:var(--gap);
padding:8px 0;
}
.breadcrumbs a { color:var(--neon-cyan); font-size:13px; }
.breadcrumbs span { color:var(--neon-pink); }

.intro-table {
width:100%;
border-collapse:collapse;
background:linear-gradient(135deg,var(--dark-card),var(--dark-surface));
border:2px solid var(--neon-purple);
border-radius:12px;
overflow:hidden;
margin-bottom:var(--gap);
box-shadow:0 0 25px rgba(176,38,255,0.15);
}

.intro-table td {
padding:30px;
}

.intro-table h1 {
font-family:'Orbitron','Noto Sans SC',sans-serif;
font-size:28px;
font-weight:900;
background:linear-gradient(90deg,var(--neon-cyan),var(--neon-pink));
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background-clip:text;
margin-bottom:12px;
line-height:1.3;
}

.intro-table p {
color:var(--text-muted);
font-size:15px;
line-height:1.7;
}

.offers-block {
margin-bottom:var(--gap);
}

.offers-table {
width:100%;
table-layout:fixed;
border-collapse:collapse;
background:#ffffff;
border:2px solid var(--neon-cyan);
border-radius:10px;
overflow:hidden;
box-shadow:0 0 20px rgba(0,240,255,0.15);
}

.offers-table th, .offers-table td { width:33.333%; }

.offers-table tr { border-bottom:1px solid #e0e0e0; }
.offers-table tr:last-child { border-bottom:none; }

.offers-table td {
padding:15px 10px;
text-align:center;
vertical-align:middle;
}

.offer-logo img {
max-width:160px;
height:auto;
}

.offer-bonus {
font-family:'Orbitron',sans-serif;
font-weight:700;
font-size:16px;
color:#1a1a3e;
}

.btn-bonus {
display:inline-block;
background:var(--neon-green);
color:#0a0a1a;
font-family:'Orbitron',sans-serif;
font-weight:900;
font-size:14px;
padding:12px 28px;
border-radius:6px;
text-transform:uppercase;
letter-spacing:2px;
transition:all 0.3s;
box-shadow:0 0 12px rgba(57,255,20,0.4);
}
.btn-bonus:hover {
background:#2de00f;
box-shadow:0 0 25px rgba(57,255,20,0.7);
transform:translateY(-2px);
color:#0a0a1a;
}

.content-image {
margin-bottom:var(--gap);
border-radius:12px;
overflow:hidden;
border:2px solid var(--neon-pink);
box-shadow:0 0 20px rgba(255,45,123,0.15);
}

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

.text-block {
background:linear-gradient(135deg,var(--dark-card),rgba(26,26,62,0.8));
border:1px solid rgba(176,38,255,0.2);
border-radius:12px;
padding:28px;
margin-bottom:var(--gap);
}

.text-block h2 {
font-family:'Orbitron','Noto Sans SC',sans-serif;
font-size:22px;
font-weight:700;
color:var(--neon-yellow);
margin-bottom:14px;
text-shadow:0 0 10px rgba(255,230,0,0.2);
}

.text-block h3 {
font-family:'Orbitron','Noto Sans SC',sans-serif;
font-size:17px;
font-weight:700;
color:var(--neon-cyan);
margin-bottom:10px;
}

.text-block p {
margin-bottom:12px;
line-height:1.8;
color:var(--text-main);
}

.text-block ul, .text-block ol {
margin:12px 0;
padding-left:24px;
}

.text-block li {
margin-bottom:6px;
line-height:1.7;
color:var(--text-main);
}

.text-block li::marker {
color:var(--neon-cyan);
}

.text-block a {
color:var(--neon-pink);
border-bottom:1px dotted var(--neon-pink);
}
.text-block a:hover { color:var(--neon-cyan); border-color:var(--neon-cyan); }

.calculator-block {
background:linear-gradient(135deg,#111128,#1a1a3e);
border:2px solid var(--neon-cyan);
border-radius:12px;
padding:28px;
margin-bottom:var(--gap);
box-shadow:0 0 20px rgba(0,240,255,0.1);
}

.calculator-block h3 {
font-family:'Orbitron','Noto Sans SC',sans-serif;
font-size:18px;
color:var(--neon-cyan);
margin-bottom:16px;
}

.calc-row {
display:flex;
gap:12px;
margin-bottom:12px;
align-items:center;
flex-wrap:wrap;
}

.calc-row label {
font-size:14px;
color:var(--text-muted);
min-width:120px;
}

.calc-row input, .calc-row select {
background:rgba(0,0,0,0.4);
border:1px solid rgba(0,240,255,0.3);
border-radius:6px;
padding:10px 14px;
color:var(--neon-cyan);
font-family:'Orbitron',sans-serif;
font-size:14px;
width:180px;
outline:none;
transition:border-color 0.2s;
}
.calc-row input:focus, .calc-row select:focus {
border-color:var(--neon-pink);
}

.calc-btn {
background:linear-gradient(135deg,var(--neon-pink),var(--neon-purple));
color:#fff;
font-family:'Orbitron',sans-serif;
font-weight:700;
font-size:14px;
border:none;
padding:12px 32px;
border-radius:6px;
cursor:pointer;
text-transform:uppercase;
letter-spacing:2px;
transition:all 0.3s;
margin-top:8px;
}
.calc-btn:hover {
box-shadow:0 0 20px rgba(255,45,123,0.5);
transform:translateY(-2px);
}

.calc-result {
margin-top:14px;
padding:16px;
background:rgba(0,240,255,0.05);
border:1px solid rgba(0,240,255,0.2);
border-radius:8px;
font-family:'Orbitron',sans-serif;
font-size:20px;
color:var(--neon-green);
text-align:center;
min-height:50px;
}

.chart-block {
background:var(--dark-card);
border:1px solid rgba(176,38,255,0.2);
border-radius:12px;
padding:24px;
margin-bottom:var(--gap);
}
.chart-block canvas {
max-width:100%;
}

.faq-block {
margin-bottom:var(--gap);
}

.faq-block h2 {
font-family:'Orbitron','Noto Sans SC',sans-serif;
font-size:24px;
font-weight:900;
color:var(--neon-yellow);
margin-bottom:16px;
text-align:center;
text-shadow:0 0 15px rgba(255,230,0,0.3);
}

.faq-item {
border:1px solid rgba(0,240,255,0.2);
border-radius:10px;
margin-bottom:8px;
overflow:hidden;
background:var(--dark-card);
}

.faq-question {
width:100%;
background:none;
border:none;
padding:18px 24px;
text-align:left;
cursor:pointer;
font-family:'Noto Sans SC',sans-serif;
font-size:16px;
font-weight:700;
color:var(--neon-cyan);
display:flex;
justify-content:space-between;
align-items:center;
transition:background 0.2s;
}
.faq-question:hover { background:rgba(0,240,255,0.04); }

.faq-question::after {
content:'+';
font-family:'Orbitron',sans-serif;
font-size:22px;
color:var(--neon-pink);
transition:transform 0.3s;
flex-shrink:0;
margin-left:12px;
}
.faq-item.open .faq-question::after {
content:'-';
}

.faq-answer {
max-height:0;
overflow:hidden;
transition:max-height 0.35s ease;
}
.faq-item.open .faq-answer {
max-height:500px;
}

.faq-answer-inner {
padding:0 24px 18px;
color:var(--text-muted);
line-height:1.7;
}

.contact-form {
background:linear-gradient(135deg,var(--dark-card),var(--dark-surface));
border:2px solid var(--neon-purple);
border-radius:12px;
padding:30px;
max-width:600px;
margin:0 auto var(--gap);
}

.contact-form .form-group {
margin-bottom:16px;
}

.contact-form label {
display:block;
font-size:14px;
color:var(--neon-cyan);
margin-bottom:6px;
font-family:'Orbitron',sans-serif;
}

.contact-form input,
.contact-form textarea {
width:100%;
background:rgba(0,0,0,0.4);
border:1px solid rgba(176,38,255,0.3);
border-radius:8px;
padding:12px 16px;
color:var(--text-main);
font-family:'Noto Sans SC',sans-serif;
font-size:15px;
outline:none;
transition:border-color 0.2s;
}
.contact-form input:focus,
.contact-form textarea:focus {
border-color:var(--neon-cyan);
box-shadow:0 0 10px rgba(0,240,255,0.15);
}

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

.contact-form button {
background:linear-gradient(135deg,var(--neon-cyan),var(--neon-purple));
color:#fff;
font-family:'Orbitron',sans-serif;
font-weight:700;
font-size:15px;
border:none;
padding:14px 40px;
border-radius:8px;
cursor:pointer;
text-transform:uppercase;
letter-spacing:2px;
transition:all 0.3s;
width:100%;
}
.contact-form button:hover {
box-shadow:0 0 25px rgba(0,240,255,0.4);
transform:translateY(-2px);
}

.site-footer {
background:rgba(10,10,26,0.95);
border-top:2px solid var(--neon-purple);
padding:24px 20px;
text-align:center;
margin-top:20px;
}

.footer-links {
margin-bottom:10px;
}
.footer-links a {
color:var(--text-muted);
font-size:14px;
transition:color 0.2s;
}
.footer-links a:hover { color:var(--neon-cyan); }

.footer-copy {
font-size:13px;
color:var(--text-muted);
}

.legal-text {
background:linear-gradient(135deg,var(--dark-card),rgba(26,26,62,0.8));
border:1px solid rgba(176,38,255,0.2);
border-radius:12px;
padding:28px;
margin-bottom:var(--gap);
}
.legal-text h2 {
font-family:'Orbitron','Noto Sans SC',sans-serif;
font-size:20px;
color:var(--neon-yellow);
margin-bottom:14px;
}
.legal-text p {
margin-bottom:12px;
line-height:1.8;
color:var(--text-main);
}

@media (max-width:768px) {
.intro-table h1 { font-size:22px; }
.intro-table td { padding:20px; }
.text-block { padding:20px; }
.text-block h2 { font-size:19px; }
.offers-table tr {
display:flex;
flex-direction:column;
align-items:center;
padding:15px 10px;
border-bottom:2px solid #e0e0e0;
}
.offers-table td {
width:100%;
border:none;
padding:6px 10px;
}
.calc-row { flex-direction:column; align-items:flex-start; }
.calc-row input, .calc-row select { width:100%; }
.calculator-block { padding:20px; }
}

@media (max-width:480px) {
.intro-table h1 { font-size:19px; }
.nav a { font-size:12px; padding:12px 20px; }
.text-block h2 { font-size:17px; }
.offer-bonus { font-size:14px; }
}
