body {
font-family:"Arial",sans-serif;
margin:0;
padding:0;
background-color:#0a0a0a;
color:#e0e0e0;
display:flex;
flex-direction:column;
min-height:100vh
}

html {
scroll-behavior:smooth
}

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

::-webkit-scrollbar {
width:12px
}

::-webkit-scrollbar-track {
background:#2f2e2f;
border-radius:6px
}

::-webkit-scrollbar-thumb {
background-color:#e5e5e5;
border-radius:6px;
border:3px solid #2f2e2f
}

::-webkit-scrollbar-thumb:hover {
background-color:#d0d0d0
}

.navbar {
background-color:#171717;
color:#e0e0e0;
padding:12px 0;
box-shadow:0 2px 10px #0000004d;
border-bottom:1px solid #2f2e2f;
position:sticky;
top:0;
z-index:1000
}

.navbar-container {
max-width:1200px;
margin:0 auto;
padding:0 20px
}

.navbar-content {
display:flex;
justify-content:space-between;
align-items:center
}

.navbar-left,.navbar-right {
flex:1
}

.navbar-center {
display:flex;
gap:20px;
align-items:center
}

.navbar-brand-title {
color:#e5e5e5;
font-size:28px;
font-weight:700;
margin:0;
letter-spacing:1px
}

.navbar-link {
display:flex;
align-items:center;
gap:8px;
padding:12px 20px;
color:#e5e5e5;
text-decoration:none;
border-radius:8px;
transition:all .3s ease;
font-size:14px;
font-weight:700;
background-color:#212121;
border:1px solid #2f2e2f
}

.navbar-link:hover {
background-color:#e5e5e5;
color:#0a0a0a;
border-color:#e5e5e5
}

.navbar-icon {
width:16px;
height:16px;
display:block;
flex-shrink:0;
filter:invert(95%) sepia(5%) saturate(5%) hue-rotate(314deg) brightness(100%) contrast(96%);
transition:filter .3s ease
}

.navbar-link:hover .navbar-icon,body:has(#mirrors:target) .navbar-link[href="#mirrors"] .navbar-icon,body:has(#telegram:target) .navbar-link[href="#telegram"] .navbar-icon,body:has(#pgp:target) .navbar-link[href="#pgp"] .navbar-icon,body:has(#features:target) .navbar-link[href="#features"] .navbar-icon {
filter:invert(4%) sepia(0%) saturate(0%) hue-rotate(314deg) brightness(0%) contrast(100%)
}

body:has(#mirrors:target) .navbar-link[href="#mirrors"],body:has(#telegram:target) .navbar-link[href="#telegram"],body:has(#pgp:target) .navbar-link[href="#pgp"],body:has(#features:target) .navbar-link[href="#features"],body:has(#about:target) .navbar-link[href="#about"] {
background-color:#e5e5e5;
color:#0a0a0a;
border-color:#e5e5e5
}

.content-section {
display:none
}

#welcome {
display:block
}

.content-section:target {
display:block
}

.content-section:target ~ #welcome {
display:none
}

.main-content {
flex:1;
padding:40px 0
}

.section-card {
background-color:#171717;
border-radius:12px;
padding:40px;
box-shadow:0 6px 25px #0000004d;
border:1px solid #2f2e2f
}

.section-title {
color:#e5e5e5;
font-size:32px;
font-weight:700;
margin:0 0 30px;
text-align:center;
transition:all .3s ease
}

.btn-primary {
background-color:#e5e5e5;
color:#0a0a0a
}

.btn-primary:hover {
background-color:#d0d0d0
}

.btn-secondary {
background-color:#212121;
color:#e5e5e5;
border:1px solid #2f2e2f
}

.btn-secondary:hover {
background-color:#e5e5e5;
color:#0a0a0a;
border-color:#e5e5e5
}

.footer {
background-color:#171717;
color:#e0e0e0;
padding:20px 0 15px;
border-top:1px solid #2f2e2f;
margin-top:auto
}

.footer-container {
max-width:1200px;
margin:0 auto;
padding:0 20px
}

.footer-content {
display:flex;
justify-content:center;
align-items:center;
margin-bottom:15px
}

.footer-brand {
text-align:center
}

.footer-brand-title {
color:#e5e5e5;
font-size:24px;
font-weight:700;
margin:0 0 8px
}

.footer-brand-link {
color:#e5e5e5;
text-decoration:none;
transition:color .3s ease
}

.footer-brand-link:hover {
color:#d0d0d0
}

.footer-brand-description {
color:#e0e0e0;
font-size:16px;
margin:0
}

.footer-bottom {
text-align:center;
padding-top:10px;
border-top:1px solid #2f2e2f
}

.footer-bottom p {
margin:0;
font-size:14px;
color:#a0a0a0
}

@media (max-width: 480px) {
.navbar-container {
padding:0 10px
}

.navbar-center {
gap:5px;
flex-wrap:wrap;
justify-content:center
}

.navbar-link {
font-size:12px;
padding:8px 12px
}

.navbar-brand-title {
font-size:22px
}
}

@media (max-width: 768px) {
.navbar-center {
gap:8px
}

.navbar-link {
font-size:13px;
padding:10px 14px
}

.navbar-icon {
width:14px;
height:14px
}

.section-card {
padding:20px
}

.section-title {
font-size:24px
}

.features-grid,.pgp-keys-grid,.welcome-features {
grid-template-columns:1fr
}

.pgp-keys-grid {
grid-template-columns:1fr;
gap:20px
}

.about-stats {
flex-direction:column;
gap:30px
}

.footer-content {
flex-direction:column;
gap:15px
}

.group-header {
flex-direction:column;
gap:15px;
align-items:flex-start
}

.sublink-item {
flex-direction:column;
gap:10px;
align-items:flex-start
}

.sublink-image {
width:30px;
height:30px
}

.telegram-bot-feature {
padding:20px
}

.bot-feature-highlights {
justify-content:center;
gap:10px
}

.bot-highlight {
padding:4px 8px;
font-size:12px
}

.mirror-item {
flex-direction:column;
gap:15px;
align-items:flex-start
}

.mirror-url {
word-break:break-all;
font-size:13px
}

.pgp-key-details p {
word-break:break-all;
word-wrap:break-word;
font-size:12px;
line-height:1.4;
overflow-wrap:anywhere
}

.pgp-key-block {
overflow-x:auto;
max-width:100%
}

.pgp-key-block pre {
font-size:9px;
line-height:1.2;
word-break:break-all;
white-space:pre-wrap;
overflow-wrap:break-word
}

.pgp-key-item {
padding:15px;
max-width:100%;
overflow:hidden
}

.pgp-keys-grid {
gap:15px
}
}

.section-content {
color:#e0e0e0
}

.section-description {
text-align:center;
font-size:16px;
margin-top:30px;
color:#a0a0a0
}

.welcome-content {
text-align:center
}

.welcome-hero {
margin-bottom:50px
}

.welcome-hero h3 {
color:#e5e5e5;
font-size:28px;
font-weight:700;
margin:0 0 20px
}

.welcome-hero p {
font-size:18px;
line-height:1.6;
color:#b0b0b0;
max-width:800px;
margin:0 auto
}

.welcome-features {
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:30px;
margin:40px 0
}

.welcome-feature {
background-color:#212121;
border:1px solid #2f2e2f;
border-radius:12px;
padding:25px;
transition:all .3s ease
}

.welcome-feature:hover {
border-color:#e5e5e5;
transform:translateY(-2px)
}

.welcome-feature h4 {
color:#e5e5e5;
font-size:18px;
font-weight:700;
margin:0 0 15px
}

.welcome-feature p {
color:#a0a0a0;
font-size:16px;
line-height:1.6;
margin:0
}

.welcome-cta {
margin-top:40px;
padding:25px;
background-color:#212121;
border:1px solid #2f2e2f;
border-radius:12px
}

.welcome-cta p {
font-size:16px;
color:#e0e0e0;
margin:0
}

.welcome-cta-buttons {
display:flex;
gap:20px;
justify-content:center;
flex-wrap:wrap
}

.mirrors-grid {
display:grid;
grid-template-columns:1fr;
gap:20px;
margin:30px 0
}

.mirror-item {
background-color:#212121;
border:1px solid #2f2e2f;
border-radius:8px;
padding:20px;
display:flex;
justify-content:space-between;
align-items:center
}

.mirror-name {
font-weight:700;
font-size:18px;
color:#e5e5e5;
display:flex;
align-items:center;
gap:15px
}

.mirror-url {
font-family:monospace;
background-color:#121212;
padding:8px 12px;
border-radius:6px;
border:1px solid #2f2e2f;
color:#e0e0e0
}

.status-badge {
padding:4px 8px;
border-radius:12px;
font-size:12px;
font-weight:600
}

.status-badge.working {
background-color:#2e7d32;
color:#fff
}

.status-badge.down {
background-color:#c62828;
color:#fff
}

.status-badge.maintanance {
background-color:#f9a825;
color:#fff
}

.telegram-groups {
display:grid;
grid-template-columns:1fr;
gap:30px;
margin:30px 0
}

.telegram-group {
background-color:#212121;
border:1px solid #2f2e2f;
border-radius:12px;
padding:25px
}

.group-header {
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:20px;
padding-bottom:15px;
border-bottom:1px solid #2f2e2f
}

.group-name {
font-weight:700;
font-size:18px;
color:#e5e5e5;
display:flex;
align-items:center;
gap:15px
}

.group-url {
font-family:monospace;
background-color:#121212;
padding:8px 12px;
border-radius:6px;
border:1px solid #2f2e2f;
color:#e0e0e0;
font-size:16px
}

.group-sublinks {
display:grid;
grid-template-columns:1fr;
gap:15px
}

.sublink-item {
display:flex;
align-items:center;
gap:15px;
background-color:#171717;
border:1px solid #2f2e2f;
border-radius:8px;
padding:15px
}

.sublink-image {
width:40px;
height:40px;
border-radius:6px;
object-fit:cover;
border:1px solid #2f2e2f
}

.sublink-name {
font-weight:600;
font-size:16px;
color:#e0e0e0;
flex:1
}

.sublink-url {
font-family:monospace;
background-color:#121212;
padding:6px 10px;
border-radius:4px;
border:1px solid #2f2e2f;
color:#a0a0a0;
font-size:14px
}

.pgp-keys-grid {
display:grid;
grid-template-columns:repeat(auto-fit,minmax(400px,1fr));
gap:30px;
margin:30px 0
}

.pgp-key-item {
background-color:#212121;
border:1px solid #2f2e2f;
border-radius:12px;
padding:25px
}

.pgp-key-title {
color:#e5e5e5;
font-size:20px;
font-weight:700;
margin:0 0 20px;
text-align:center
}

.pgp-key-details {
margin-bottom:25px
}

.pgp-key-details p {
margin:10px 0;
font-size:14px
}

.pgp-key-details strong {
color:#e5e5e5
}

.pgp-key-actions {
display:flex;
justify-content:center;
margin-bottom:25px
}

.pgp-key-block {
margin-top:20px;
background-color:#121212;
border:1px solid #2f2e2f;
border-radius:8px;
padding:15px;
overflow-x:auto
}

.pgp-key-block pre {
color:#e0e0e0;
font-family:'Courier New',monospace;
font-size:12px;
line-height:1.2;
margin:0;
white-space:pre;
word-wrap:break-word
}

.telegram-bot-feature {
background-color:#212121;
border:1px solid #2f2e2f;
border-radius:12px;
padding:25px;
margin-bottom:30px
}

.bot-feature-content {
width:100%
}

.bot-feature-title {
font-size:24px;
font-weight:700;
color:#e5e5e5;
margin-bottom:15px;
display:flex;
align-items:center;
gap:12px;
justify-content:center
}

.bot-title-icon {
width:36px;
height:36px;
object-fit:contain;
filter:invert(95%) sepia(5%) saturate(5%) hue-rotate(314deg) brightness(100%) contrast(96%)
}

.bot-feature-description {
font-size:16px;
line-height:1.6;
color:#b0b0b0;
margin-bottom:20px
}

.bot-feature-highlights {
display:flex;
gap:15px;
margin-bottom:25px;
flex-wrap:wrap;
justify-content:center
}

.bot-highlight {
background-color:#2f2e2f;
color:#e0e0e0;
padding:6px 12px;
border-radius:6px;
font-size:13px;
font-weight:600;
white-space:nowrap;
border:1px solid #3f3e3f
}

.bot-launch-btn {
font-size:16px;
padding:14px 28px
}

.bot-button-container {
text-align:center;
margin-top:5px
}

.features-grid {
display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
gap:30px;
margin:30px 0
}

.feature-item {
background-color:#212121;
border:1px solid #2f2e2f;
border-radius:12px;
padding:30px;
text-align:center;
transition:all .3s ease
}

.feature-item:hover {
border-color:#e5e5e5;
transform:translateY(-2px)
}

.feature-title {
color:#e5e5e5;
font-size:20px;
font-weight:700;
margin:0 0 15px
}

.feature-description {
color:#a0a0a0;
font-size:16px;
line-height:1.6;
margin:0
}

.about-content {
text-align:center
}

.about-intro {
margin-bottom:40px
}

.about-intro h3 {
color:#e5e5e5;
font-size:24px;
font-weight:700;
margin:0 0 20px
}

.about-intro p {
font-size:18px;
line-height:1.6;
color:#e0e0e0;
max-width:800px;
margin:0 auto
}

.about-stats {
display:flex;
justify-content:center;
gap:60px;
margin:40px 0
}

.stat-item {
text-align:center
}

.stat-number {
color:#e5e5e5;
font-size:36px;
font-weight:700;
margin-bottom:10px
}

.stat-label {
color:#a0a0a0;
font-size:16px;
font-weight:600
}

.about-mission {
background-color:#212121;
border:1px solid #2f2e2f;
border-radius:12px;
padding:30px;
margin-top:40px
}

.about-mission h4 {
color:#e5e5e5;
font-size:20px;
font-weight:700;
margin:0 0 20px
}

.about-mission p {
font-size:16px;
line-height:1.6;
margin:0
}

.btn {
padding:12px 20px;
border-radius:8px;
font-weight:700;
text-align:center;
transition:all .3s ease;
cursor:pointer;
border:none;
text-decoration:none;
font-size:14px;
display:inline-block
}

.btn-primary {
background-color:#e5e5e5;
color:#0a0a0a
}

.btn-primary:hover {
background-color:#d0d0d0
}

.btn-secondary {
background-color:#212121;
color:#e5e5e5;
border:1px solid #2f2e2f
}

.btn-secondary:hover {
background-color:#e5e5e5;
color:#0a0a0a;
border-color:#e5e5e5
}

.footer {
background-color:#171717;
color:#e0e0e0;
padding:20px 0 15px;
border-top:1px solid #2f2e2f;
margin-top:auto
}

.footer-container {
max-width:1200px;
margin:0 auto;
padding:0 20px
}

.footer-content {
display:flex;
justify-content:center;
align-items:center;
margin-bottom:15px
}

.footer-brand {
text-align:center
}

.footer-brand-title {
color:#e5e5e5;
font-size:24px;
font-weight:700;
margin:0 0 8px
}

.footer-brand-link {
color:#e5e5e5;
text-decoration:none;
transition:color .3s ease
}

.footer-brand-link:hover {
color:#d0d0d0
}

.footer-brand-description {
color:#e0e0e0;
font-size:16px;
margin:0
}

.footer-bottom {
text-align:center;
padding-top:10px;
border-top:1px solid #2f2e2f
}

.footer-bottom p {
margin:0;
font-size:14px;
color:#a0a0a0
}

@media (max-width: 768px) {
.navbar-center {
gap:10px
}

.navbar-link {
font-size:13px;
padding:10px 16px
}

.section-card {
padding:20px
}

.section-title {
font-size:24px
}

.features-grid,.pgp-keys-grid,.welcome-features {
grid-template-columns:1fr
}

.pgp-key-block pre {
font-size:10px
}

.about-stats {
flex-direction:column;
gap:30px
}

.footer-content {
flex-direction:column;
gap:15px
}

.group-header {
flex-direction:column;
gap:15px;
align-items:flex-start
}

.sublink-item {
flex-direction:column;
gap:10px;
align-items:flex-start
}
}
