@keyframes pulseGlow {
0%, 100% { filter: drop-shadow(0 0 20px rgba(220, 20, 20, 0.4)); transform: scale(1); }
50% { filter: drop-shadow(0 0 40px rgba(220, 20, 20, 0.8)); transform: scale(1.03); }
}

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

body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background: linear-gradient(135deg, #0c0c1a 0%, #1a0a0a 50%, #161313 100%);
color: #e0e0e0;
line-height: 1.7;
min-height: 100vh;
}

.container {
max-width: 900px;
margin: 0 auto;
padding: 40px 20px;
}

header {
text-align: center;
margin-bottom: 50px;
}

.logo {
max-width: 300px;
height: auto;
margin-bottom: 20px;
animation: pulseGlow 3s ease-in-out infinite;
transition: transform 0.4s, filter 0.4s;
cursor: pointer;
}

.logo:hover {
animation: none;
transform: scale(1.05);
filter: drop-shadow(0 0 30px rgba(220, 20, 20, 0.6));
}

h1 {
font-size: 1.8em;
color: #dc143c;
text-shadow: 0 0 10px rgba(220, 20, 60, 0.5);
letter-spacing: 2px;
}

h2 {
font-size: 1.5em;
color: #dc143c;
margin-bottom: 15px;
padding-bottom: 8px;
border-bottom: 2px solid #dc143c;
}

h3 {
font-size: 1.15em;
color: #ff6b6b;
margin-top: 20px;
margin-bottom: 10px;
}

section {
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(220, 20, 60, 0.15);
border-radius: 12px;
padding: 25px;
margin-bottom: 25px;
backdrop-filter: blur(4px);
transition: border-color 0.3s, transform 0.3s, box-shadow 0.3s;
}

section:hover {
border-color: rgba(220, 20, 60, 0.3);
}

p {
margin-bottom: 10px;
}

ul {
list-style: none;
padding-left: 5px;
}

ul li {
padding: 4px 0 4px 24px;
position: relative;
}

ul li::before {
content: "▸";
position: absolute;
left: 0;
color: #dc143c;
font-weight: bold;
}

ul li ul li::before {
content: "–";
}

ul li ul {
margin-top: 4px;
padding-left: 20px;
}

@media (max-width: 600px) {
.container {
padding: 20px 12px;
}

.logo {
max-width: 200px;
}

h1 {
font-size: 1.3em;
}

h2 {
font-size: 1.2em;
}

section {
padding: 18px;
}
}