/* Общие стили AviDrive: тёмная тема, адаптивность и неоновые акценты. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;600&display=swap');

:root { --bg:#0a0e1a; --panel:rgba(18,25,43,.72); --line:rgba(139,155,190,.2); --muted:#8b92a8; --text:#eef4ff; --green:#00ff9d; --cyan:#00d4ff; --purple:#8b5cf6; --danger:#ff5d73; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; color:var(--text); background:var(--bg); font-family:Inter,system-ui,sans-serif; line-height:1.6; }
body::before { content:""; position:fixed; inset:0; z-index:-2; opacity:.28; background-image:linear-gradient(rgba(0,212,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(0,212,255,.08) 1px,transparent 1px); background-size:56px 56px; mask-image:linear-gradient(to bottom,#000,transparent 75%); }
body::after { content:""; position:fixed; width:420px; height:420px; z-index:-1; top:-180px; right:-120px; border-radius:50%; background:rgba(139,92,246,.16); filter:blur(80px); }
a { color:inherit; text-decoration:none; }
.container { width:min(1140px,calc(100% - 40px)); margin:auto; }
.site-header { border-bottom:1px solid rgba(139,155,190,.12); background:rgba(10,14,26,.72); backdrop-filter:blur(16px); position:relative; z-index:3; }
.nav { min-height:78px; display:flex; align-items:center; gap:34px; }
.brand { display:flex; align-items:center; gap:10px; font-size:20px; font-weight:800; letter-spacing:-.5px; margin-right:auto; }
.brand svg { width:38px; height:38px; }
.brand-gradient { animation:gradientShift 6s ease-in-out infinite alternate; }
@keyframes gradientShift { to { stop-color:#8b5cf6; } }
.nav-links { display:flex; align-items:center; gap:25px; color:var(--muted); font-size:14px; }
.nav-links a { transition:color .2s; } .nav-links a:hover,.nav-links .active { color:var(--green); }
button,.button { border:0; cursor:pointer; font:inherit; transition:transform .2s,box-shadow .2s,background .2s; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:12px 20px; border-radius:8px; font-weight:600; font-size:14px; }
.button:hover { transform:translateY(-2px); }
.button-primary { color:#04130e; background:var(--green); box-shadow:0 0 22px rgba(0,255,157,.25); }
.button-primary:hover { box-shadow:0 0 30px rgba(0,255,157,.45); }
.button-outline { color:var(--text); border:1px solid rgba(0,212,255,.5); background:rgba(0,212,255,.06); }
.button-outline:hover { border-color:var(--cyan); background:rgba(0,212,255,.12); }
.hero { padding:105px 0 80px; max-width:850px; }
.eyebrow { color:var(--green); font:600 12px 'JetBrains Mono',monospace; text-transform:uppercase; letter-spacing:2px; }
h1,h2,h3,p { margin-top:0; } h1 { margin:14px 0 20px; font-size:clamp(38px,6vw,68px); line-height:1.08; letter-spacing:-2.8px; } h2 { font-size:clamp(28px,4vw,42px); line-height:1.2; letter-spacing:-1px; } h3 { margin-bottom:8px; }
.hero p { max-width:650px; color:var(--muted); font-size:18px; }
.actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.section { padding:40px 0 100px; } .section-heading { margin-bottom:30px; }
.section-heading p,.page-intro { color:var(--muted); }
.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.card,.info-box,.modal-card { border:1px solid var(--line); background:var(--panel); backdrop-filter:blur(14px); border-radius:14px; }
.feature { padding:26px; min-height:190px; } .feature-icon { font-size:27px; margin-bottom:18px; } .feature p { color:var(--muted); font-size:14px; }
.page { padding:78px 0 110px; min-height:calc(100vh - 150px); } .page-header { max-width:700px; margin-bottom:38px; } .page-header h1 { font-size:clamp(36px,5vw,56px); } .page-header p { color:var(--muted); }
.pricing-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; align-items:stretch; }
.pricing-card { padding:24px 20px; display:flex; flex-direction:column; position:relative; } .pricing-card.featured { border-color:rgba(0,255,157,.65); box-shadow:0 0 28px rgba(0,255,157,.08); }
.tag { position:absolute; top:-12px; right:16px; padding:3px 9px; border-radius:20px; color:#071810; background:var(--green); font-size:11px; font-weight:700; }
.pricing-card .plan { color:var(--cyan); font:600 13px 'JetBrains Mono',monospace; } .price { margin:14px 0 8px; font-size:28px; font-weight:800; } .price small { color:var(--muted); font-size:13px; font-weight:400; }
.storage { color:var(--muted); font-size:14px; margin-bottom:22px; } .features { padding:18px 0; margin:0 0 22px; border-top:1px solid var(--line); list-style:none; color:#c9d2e5; font-size:13px; flex:1; } .features li { margin:9px 0; } .features li::before { content:'✓'; color:var(--green); margin-right:8px; }
.warning { margin-top:13px; color:var(--muted); font-size:11px; line-height:1.45; } .warning strong { color:#ffc45c; font-size:14px; margin-right:4px; }
.faq { max-width:820px; } details { border-bottom:1px solid var(--line); padding:20px 0; } summary { cursor:pointer; font-weight:600; } details p { color:var(--muted); margin:14px 0 0; font-size:14px; }
.support-grid { display:grid; grid-template-columns:1.3fr .7fr; gap:45px; } .info-box { padding:25px; } .info-box h3 { color:var(--cyan); } .email { color:var(--green); font:600 15px 'JetBrains Mono',monospace; word-break:break-word; }
.code-block { overflow:auto; padding:20px; margin:18px 0 28px; border:1px solid var(--line); border-radius:10px; background:#070b13; color:#b9d3f4; font:13px/1.7 'JetBrains Mono',monospace; } .code-key { color:#c084fc; } .code-string { color:var(--green); }
.register-wrap { display:grid; place-items:center; text-align:center; min-height:calc(100vh - 300px); } .register-card { max-width:680px; } .lock-icon { width:76px; height:76px; margin-bottom:20px; filter:drop-shadow(0 0 15px rgba(0,255,157,.35)); } .register-card h1 { font-size:clamp(32px,5vw,52px); } .register-card > p { color:var(--muted); } .register-card .info-box { text-align:left; margin:30px 0; color:#b7c2d6; font-size:14px; } .register-card .info-box p { margin:8px 0; }
.site-footer { padding:25px 0; border-top:1px solid rgba(139,155,190,.12); color:var(--muted); font-size:12px; } .footer-links { display:flex; gap:18px; flex-wrap:wrap; } .footer-inner { display:flex; justify-content:space-between; gap:20px; }
.modal { position:fixed; inset:0; z-index:10; display:none; place-items:center; padding:20px; background:rgba(3,6,12,.75); backdrop-filter:blur(8px); } .modal.open { display:grid; } .modal-card { width:min(460px,100%); padding:30px; position:relative; box-shadow:0 20px 80px #0008; } .close { position:absolute; top:13px; right:16px; color:var(--muted); background:transparent; font-size:25px; } .modal-card h2 { font-size:26px; margin-bottom:5px; } .modal-card > p { color:var(--muted); font-size:13px; } label { display:block; margin:16px 0 6px; color:#c5cde0; font-size:13px; } input { width:100%; padding:12px 13px; color:var(--text); border:1px solid var(--line); border-radius:7px; outline:0; background:#080d18; font:inherit; } input:focus { border-color:var(--cyan); box-shadow:0 0 0 3px rgba(0,212,255,.1); } .password-wrap { position:relative; } .password-wrap input { padding-right:45px; } .toggle-password { position:absolute; top:8px; right:8px; padding:5px; color:var(--muted); background:transparent; } .login-form .button { width:100%; margin-top:22px; } .loader { display:none; margin:20px auto 0; width:22px; height:22px; border:3px solid #ffffff30; border-top-color:var(--green); border-radius:50%; animation:spin .7s linear infinite; } .loading .loader { display:block; } .loading .submit-text { opacity:.5; } @keyframes spin { to { transform:rotate(360deg); } } .error { display:none; margin-top:18px; padding:11px; border:1px solid #ff5d7355; border-radius:7px; color:#ff8292; background:#ff5d7312; font-size:13px; } .error.visible { display:block; } .registration-note { margin-top:22px; padding:15px; border:1px solid rgba(0,212,255,.25); border-radius:8px; color:#9baac2; background:rgba(0,212,255,.05); font-size:12px; line-height:1.5; }
@media (max-width:850px) { .nav { flex-wrap:wrap; padding:15px 0; gap:15px; } .nav-links { order:3; width:100%; justify-content:space-between; gap:8px; } .pricing-grid { grid-template-columns:repeat(2,1fr); } .support-grid { grid-template-columns:1fr; gap:25px; } }
@media (max-width:560px) { .container { width:min(100% - 28px,1140px); } .hero { padding:65px 0 55px; } h1 { letter-spacing:-1.8px; } .cards,.pricing-grid { grid-template-columns:1fr; } .footer-inner { flex-direction:column; } .brand { margin-right:0; } .nav > .button { margin-left:auto; padding:9px 13px; } .nav-links { font-size:12px; } .page { padding-top:55px; } }
