/* NeiroRazdet — structural chrome: gate, nav, hero, footer, redirect */
@import url("core.css");

/* ===== AGE GATE ===== */
.gate-overlay { position: fixed; inset: 0; z-index: 999; display: flex; align-items: center; justify-content: center; background: rgba(5,5,15,0.94); backdrop-filter: blur(6px); }
.gate-overlay.is-dismissed { display: none; }
.gate-card { width: min(420px, 90vw); background: var(--grd-surface); border: 1px solid var(--c-line-strong); border-radius: var(--rad-l); padding: 36px 30px; text-align: center; }
.gate-mark { width: 60px; height: 60px; margin: 0 auto 18px; border-radius: 50%; background: var(--grd-brand); color: #fff; display: grid; place-items: center; font-weight: 900; font-size: 18px; }
.gate-card h3 { color: var(--c-text); font-size: 19px; margin-bottom: 10px; }
.gate-card p { font-size: 14px; color: var(--c-text-dim); margin-bottom: 22px; }
.gate-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 560px) { .gate-pair { grid-template-columns: 1fr; } }
.gate-pending { display: none; align-items: center; justify-content: center; gap: 10px; margin-top: 16px; font-size: 13px; color: var(--c-text-dim); }
.gate-pending.is-shown { display: flex; }
.gate-spinner { width: 16px; height: 16px; border: 2px solid var(--c-line-strong); border-top-color: var(--c-primary-soft); border-radius: 50%; animation: spin 0.8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ===== BOT REDIRECT ===== */
.transit-overlay { position: fixed; inset: 0; z-index: 998; display: none; align-items: center; justify-content: center; background: rgba(5,5,15,0.94); backdrop-filter: blur(6px); }
.transit-overlay.is-shown { display: flex; }
.transit-card { width: min(400px, 90vw); background: var(--grd-surface); border: 1px solid var(--c-line-strong); border-radius: var(--rad-l); padding: 34px 28px; text-align: center; }
.transit-icon { width: 54px; height: 54px; margin: 0 auto 18px; border-radius: 50%; background: var(--c-panel-raised); border: 1px solid var(--c-primary-deep); display: grid; place-items: center; font-size: 22px; }
.transit-card h3 { color: var(--c-text); font-size: 16px; margin-bottom: 8px; }
.transit-card p { font-size: 13px; color: var(--c-text-dim); margin-bottom: 20px; }
.transit-track { height: 6px; border-radius: 4px; background: var(--c-panel-raised); overflow: hidden; margin-bottom: 12px; }
.transit-fill { height: 100%; background: var(--grd-brand); border-radius: 4px; width: 0%; transition: width 0.1s linear; }
.transit-count { font-size: 12px; color: var(--c-primary-soft); }

/* ===== NAV ===== */
.masthead { position: sticky; top: 0; z-index: 150; background: rgba(5,5,15,0.85); backdrop-filter: blur(14px); border-bottom: 1px solid var(--c-line); }
.masthead-row { display: flex; align-items: center; justify-content: space-between; padding-block: 16px; gap: 20px; }
.mark { display: flex; align-items: center; gap: 10px; font-weight: 800; font-size: 16px; color: var(--c-text); }
.mark-badge { width: 34px; height: 34px; border-radius: 9px; background: var(--grd-brand); color: #fff; display: grid; place-items: center; font-weight: 900; font-size: 13px; flex-shrink: 0; }
.mark .glow { color: var(--c-primary-soft); }

.nav-links { display: flex; align-items: center; gap: 26px; }
.nav-links a { font-size: 14px; font-weight: 600; color: var(--c-text-dim); transition: color var(--dur) ease; }
.nav-links a:hover, .nav-links a.is-current { color: var(--c-text); }

.hamburger { display: none; width: 38px; height: 38px; place-items: center; gap: 4px; }
.hamburger span { display: block; width: 20px; height: 2px; background: var(--c-text-soft); border-radius: 2px; }
.nav-drawer { display: none; flex-direction: column; gap: 2px; padding: 10px 0 18px; }
.nav-drawer a { padding: 12px 4px; font-size: 14px; font-weight: 600; color: var(--c-text-dim); border-top: 1px solid var(--c-line); }
.nav-drawer a:first-child { border-top: none; }
@media (max-width: 880px) { .nav-links { display: none; } .hamburger { display: grid; } .nav-drawer.is-open { display: flex; } }

/* ===== HERO ===== */
.intro { padding: 60px 0 20px; }
.intro-layout { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 48px; align-items: center; }
@media (max-width: 900px) { .intro-layout { grid-template-columns: 1fr; } }
.intro-actions { display: flex; gap: 14px; margin-top: 28px; flex-wrap: wrap; }

/* orbit visual — replaces "terminal"/"phone" mockups from previous sites */
.orbit-visual { width: min(320px, 90vw); margin: 0 auto; position: relative; aspect-ratio: 1; }
.orbit-ring { position: absolute; inset: 0; border: 1px solid var(--c-line-strong); border-radius: 50%; }
.orbit-ring--mid { inset: 15%; border-color: var(--c-line); }
.orbit-ring--in { inset: 32%; border: 1px solid var(--c-primary-deep); box-shadow: 0 0 40px var(--c-glow) inset; }
.orbit-core { position: absolute; inset: 40%; border-radius: 50%; background: var(--grd-brand); box-shadow: 0 0 60px var(--c-glow); display: grid; place-items: center; font-weight: 900; color: #fff; font-size: 22px; }
.orbit-node { position: absolute; width: 12px; height: 12px; border-radius: 50%; background: var(--c-primary-soft); box-shadow: 0 0 12px var(--c-primary-soft); animation: orbit-spin 8s linear infinite; }
.orbit-node--a { top: -6px; left: 50%; margin-left: -6px; }
.orbit-node--b { animation-duration: 12s; animation-direction: reverse; top: 50%; right: -6px; margin-top: -6px; }
@keyframes orbit-spin { from { transform: rotate(0deg) translateX(160px) rotate(0deg); } to { transform: rotate(360deg) translateX(160px) rotate(-360deg); } }

/* ===== FOOTER ===== */
.colophon { border-top: 1px solid var(--c-line); padding: 44px 0 28px; background: var(--c-panel); }
.colophon-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 32px; }
@media (max-width: 720px) { .colophon-grid { grid-template-columns: 1fr 1fr; } }
.colophon-grid h4 { color: var(--c-text); font-size: 13px; margin-bottom: 14px; }
.colophon-grid ul { display: flex; flex-direction: column; gap: 9px; }
.colophon-grid a { font-size: 13px; color: var(--c-text-dim); }
.colophon-grid a:hover { color: var(--c-primary-soft); }
.colophon-base { margin-top: 36px; padding-top: 20px; border-top: 1px solid var(--c-line); display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; font-size: 12px; color: var(--c-text-faint); }
.colophon-base a { color: var(--c-text-faint); }
.colophon-base a:hover { color: var(--c-primary-soft); }
