/* Страница для обычного браузера и юридические страницы. Не зависит от мини-приложения. */
html.app #landing { display: none; }
html:not(.app) body { margin: 0; background: #06050a; color: #f4efe4; font-family: ui-sans-serif, -apple-system, system-ui, "Segoe UI", Roboto, sans-serif; -webkit-font-smoothing: antialiased; }
html:not(.app) { scroll-behavior: smooth; }

/* Язык: блоки .ru/.en на юридических страницах */
html[lang="ru"] .en, html[lang="en"] .ru { display: none !important; }

#landing { --gold: #e4c27a; --mist: #b7a9d6; position: relative; min-height: 100vh; min-height: 100dvh; overflow: hidden; display: flex; flex-direction: column; box-sizing: border-box; isolation: isolate; }
#landing * { box-sizing: border-box; }

/* Северное сияние и звёзды */
.ld-aurora { position: absolute; inset: 0; z-index: -2; pointer-events: none; }
.ld-aurora i { position: absolute; width: 70vmax; height: 70vmax; border-radius: 50%; filter: blur(80px); opacity: 0.5; will-change: transform; }
.ld-aurora i:nth-child(1) { left: -26vmax; top: -30vmax; background: radial-gradient(circle, #6a3df0, transparent 62%); animation: ld-drift-a 16s ease-in-out infinite alternate; }
.ld-aurora i:nth-child(2) { right: -30vmax; top: 18vmax; background: radial-gradient(circle, #c79645, transparent 60%); opacity: 0.3; animation: ld-drift-b 19s ease-in-out infinite alternate; }
.ld-aurora i:nth-child(3) { left: 8vmax; bottom: -40vmax; background: radial-gradient(circle, #d4478b, transparent 62%); opacity: 0.25; animation: ld-drift-c 22s ease-in-out infinite alternate; }
.ld-stars { position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image:
    radial-gradient(1.2px 1.2px at 12% 18%, #fff, transparent), radial-gradient(1px 1px at 28% 72%, #f3e2b8, transparent),
    radial-gradient(1.4px 1.4px at 44% 12%, #fff, transparent), radial-gradient(1px 1px at 63% 38%, #d9ccff, transparent),
    radial-gradient(1.2px 1.2px at 78% 84%, #fff, transparent), radial-gradient(1px 1px at 90% 22%, #f3e2b8, transparent),
    radial-gradient(1px 1px at 8% 54%, #d9ccff, transparent), radial-gradient(1.3px 1.3px at 54% 90%, #fff, transparent),
    radial-gradient(1px 1px at 36% 44%, #fff, transparent), radial-gradient(1px 1px at 84% 56%, #fff, transparent);
  animation: ld-twinkle 6s ease-in-out infinite; }

/* Верхняя полоса */
.ld-top { display: flex; align-items: center; justify-content: space-between; width: 100%; max-width: 1040px; margin: 0 auto; padding: 18px 20px; }
.ld-logo { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: #f3e2b8; font-family: "Iowan Old Style", "Palatino Linotype", Palatino, serif; font-style: italic; font-size: 22px; }
.ld-logo svg { width: 30px; height: 30px; }
.ld-lang { position: relative; }
.ld-lang-btn { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; padding: 9px 12px 9px 11px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.12); background: rgba(255, 255, 255, 0.06); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); color: rgba(244, 239, 228, 0.85); font: 600 13px/1 ui-sans-serif, system-ui, sans-serif; transition: background 0.2s, border-color 0.2s; }
.ld-lang-btn:hover, .ld-lang-btn[aria-expanded="true"] { background: rgba(228, 194, 122, 0.14); border-color: rgba(228, 194, 122, 0.4); }
.ld-lang-btn svg { width: 17px; height: 17px; fill: none; stroke: #e4c27a; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ld-lang-btn .ld-chev { width: 14px; height: 14px; stroke: rgba(244, 239, 228, 0.55); transition: transform 0.25s ease; }
.ld-lang-btn[aria-expanded="true"] .ld-chev { transform: rotate(180deg); }
.ld-lang-back { position: fixed; inset: 0; z-index: 40; background: rgba(6, 3, 18, 0.55); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); animation: ld-bk 0.2s ease both; }
.ld-lang-menu { position: absolute; z-index: 41; top: calc(100% + 10px); inset-inline-end: 0; width: 300px; max-width: calc(100vw - 32px); padding: 14px; border-radius: 22px; border: 1px solid rgba(228, 194, 122, 0.25); background: rgba(22, 14, 46, 0.94); backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px); box-shadow: 0 24px 60px rgba(0, 0, 0, 0.55); transform-origin: top right; animation: ld-pop 0.22s cubic-bezier(0.2, 0.8, 0.2, 1) both; }
.ld-lang-menu[hidden], .ld-lang-back[hidden] { display: none; }
.ld-lang-title { margin: 2px 4px 10px; font-size: 11px; letter-spacing: 0.24em; text-transform: uppercase; color: rgba(243, 226, 184, 0.6); }
.ld-lang-menu ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; max-height: min(60vh, 380px); overflow-y: auto; }
.ld-lang-menu li { margin: 0; }
.ld-lang-menu li button { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; cursor: pointer; padding: 11px 12px; border-radius: 14px; border: 1px solid transparent; background: rgba(255, 255, 255, 0.04); color: rgba(244, 239, 228, 0.85); font: 500 14.5px/1.1 ui-sans-serif, system-ui, sans-serif; text-align: start; transition: background 0.18s, border-color 0.18s; }
.ld-lang-menu li button:hover { background: rgba(255, 255, 255, 0.09); }
.ld-lang-menu li button[aria-selected="true"] { background: rgba(228, 194, 122, 0.16); border-color: rgba(228, 194, 122, 0.45); color: #f6e2b0; }
.ld-lang-menu li button svg { width: 15px; height: 15px; flex: none; fill: none; stroke: #e4c27a; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; opacity: 0; }
.ld-lang-menu li button[aria-selected="true"] svg { opacity: 1; }
@media (max-width: 640px) {
  /* На телефоне список выезжает снизу шторкой */
  .ld-lang-menu { position: fixed; inset-inline: 0; bottom: 0; top: auto; width: auto; max-width: none; border-radius: 26px 26px 0 0; padding: 12px 16px calc(22px + env(safe-area-inset-bottom)); transform-origin: bottom center; animation: ld-sheet 0.3s cubic-bezier(0.2, 0.8, 0.2, 1) both; }
  .ld-lang-menu::before { content: ""; display: block; width: 40px; height: 4px; margin: 0 auto 14px; border-radius: 4px; background: rgba(255, 255, 255, 0.22); }
  .ld-lang-menu ul { max-height: 52vh; }
}
@keyframes ld-bk { from { opacity: 0; } to { opacity: 1; } }
@keyframes ld-pop { from { opacity: 0; transform: translateY(-6px) scale(0.96); } to { opacity: 1; transform: none; } }
@keyframes ld-sheet { from { transform: translateY(100%); } to { transform: none; } }

/* Главный экран */
.ld-hero { width: 100%; max-width: 560px; margin: 0 auto; padding: 28px 20px 8px; text-align: center; }
.ld-sigil { display: block; width: min(56vw, 210px); height: auto; margin: 0 auto 6px; overflow: visible; animation: ld-float 6s ease-in-out infinite; }
.sg-halo { transform-origin: 100px 100px; animation: ld-breathe 3.6s ease-in-out infinite; }
.sg-ring { fill: none; stroke-width: 1.4; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; animation: ld-draw 1.8s cubic-bezier(0.5, 0, 0.2, 1) 0.1s forwards; }
.sg-ring.b { stroke-width: 1.1; stroke-dasharray: 0.12 0.03; stroke-dashoffset: 0; opacity: 0; transform-origin: 100px 100px; animation: ld-fade 1.2s ease 0.7s forwards, ld-spin 22s linear infinite reverse; }
.sg-ticks { fill: none; stroke: rgba(243, 226, 184, 0.7); stroke-width: 5; stroke-dasharray: 0.16 0.84; opacity: 0; transform-origin: 100px 100px; animation: ld-fade 1.4s ease 0.4s forwards, ld-spin 60s linear infinite; }
.sg-orbit { transform-origin: 100px 100px; opacity: 0; filter: drop-shadow(0 0 4px rgba(243, 226, 184, 0.9)); animation: ld-fade 0.6s ease 1.2s forwards, ld-spin 7s linear 1.2s infinite; }
.sg-orbit.b { filter: drop-shadow(0 0 4px rgba(160, 120, 255, 0.95)); animation: ld-fade 0.6s ease 1.4s forwards, ld-spin 4.6s linear 1.4s infinite reverse; }
.sg-star { transform-origin: 100px 100px; opacity: 0; filter: drop-shadow(0 0 10px rgba(243, 214, 150, 0.85)); animation: ld-star-in 1.1s cubic-bezier(0.2, 0.9, 0.2, 1) 0.5s forwards, ld-pulse 3s ease-in-out 1.6s infinite; }

.ld-badge { display: inline-flex; align-items: center; gap: 9px; padding: 7px 15px; border-radius: 999px; border: 1px solid rgba(228, 194, 122, 0.28); background: rgba(228, 194, 122, 0.07); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); color: #f3e2b8; font-size: 11.5px; letter-spacing: 0.22em; text-transform: uppercase; }
.ld-badge b { width: 7px; height: 7px; border-radius: 50%; background: #4ec27e; box-shadow: 0 0 0 0 rgba(78, 194, 126, 0.7); animation: ld-ping 2s ease-out infinite; }

.ld-hero h1 { margin: 18px 0 0; font-family: "Iowan Old Style", "Palatino Linotype", Palatino, "Times New Roman", serif; font-style: italic; font-weight: 400; font-size: clamp(54px, 16vw, 84px); line-height: 1; letter-spacing: -0.01em; padding: 0 0.12em 0.24em; margin-bottom: -0.24em;
  background: linear-gradient(100deg, #fff1cf 0%, #e4c27a 35%, #fff1cf 50%, #c79645 70%, #e4c27a 100%); background-size: 220% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: ld-sheen 7s ease-in-out infinite; }
.ld-tagline { margin: 12px 0 0; font-size: 13px; letter-spacing: 0.34em; text-transform: uppercase; color: rgba(243, 226, 184, 0.78); }
.ld-lead { margin: 20px auto 0; max-width: 420px; color: #b7a9d6; font-size: 16.5px; line-height: 1.6; }

.ld-cta { position: relative; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; gap: 11px; margin-top: 30px; width: 100%; max-width: 340px; padding: 18px 26px; border-radius: 20px; text-decoration: none; font-size: 17px; font-weight: 700; color: #20150a;
  background: linear-gradient(180deg, #f9e6b5, #c79645); box-shadow: 0 12px 38px rgba(199, 150, 69, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.55); transition: transform 0.18s ease, box-shadow 0.25s ease; }
.ld-cta::after { content: ""; position: absolute; top: 0; bottom: 0; width: 38%; left: -50%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.55), transparent); transform: skewX(-18deg); animation: ld-shine 4.5s ease-in-out 1.5s infinite; }
.ld-cta:hover { transform: translateY(-2px); box-shadow: 0 16px 46px rgba(199, 150, 69, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.55); }
.ld-cta:active { transform: scale(0.98); }
.ld-cta svg { width: 22px; height: 22px; flex: none; }
.ld-hint { margin: 14px 0 0; font-size: 12.5px; color: rgba(244, 239, 228, 0.42); }

/* Возможности */
.ld-feat { width: 100%; max-width: 1040px; margin: 44px auto 0; padding: 0 20px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.ld-card { position: relative; padding: 18px 16px 17px; border-radius: 22px; text-align: left; border: 1px solid rgba(255, 255, 255, 0.08); background: linear-gradient(160deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.02)); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease; }
.ld-card:hover { transform: translateY(-4px); border-color: rgba(228, 194, 122, 0.35); box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35), 0 0 30px rgba(228, 194, 122, 0.08); }
.ld-ico { display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 14px; border: 1px solid rgba(228, 194, 122, 0.3); background: rgba(228, 194, 122, 0.08); color: #f0d79b; }
.ld-ico svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.ld-card strong { display: block; margin-top: 14px; font-size: 16px; font-weight: 600; color: #f6e2b0; }
.ld-card em { display: block; margin-top: 5px; font-style: normal; font-size: 13px; line-height: 1.45; color: rgba(244, 239, 228, 0.55); }

/* Как это работает */
.ld-how { width: 100%; max-width: 1040px; margin: 52px auto 0; padding: 0 20px; }
.ld-how h2 { margin: 0 0 18px; text-align: center; font-family: "Iowan Old Style", "Palatino Linotype", Palatino, serif; font-weight: 400; font-size: 28px; color: #f3e2b8; }
.ld-steps { display: grid; gap: 12px; grid-template-columns: 1fr; counter-reset: s; }
.ld-step { position: relative; display: flex; gap: 14px; align-items: flex-start; padding: 16px; border-radius: 20px; border: 1px solid rgba(255, 255, 255, 0.07); background: rgba(255, 255, 255, 0.03); }
.ld-step::before { counter-increment: s; content: counter(s); flex: none; display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; font-family: "Iowan Old Style", Palatino, serif; font-size: 18px; color: #20150a; background: linear-gradient(180deg, #f9e6b5, #c79645); }
.ld-step strong { display: block; font-size: 15px; color: #f6e2b0; }
.ld-step span { display: block; margin-top: 3px; font-size: 13px; line-height: 1.45; color: rgba(244, 239, 228, 0.55); }

#landing footer, .doc footer { margin-top: auto; padding: 44px 20px 28px; text-align: center; font-size: 12px; line-height: 1.8; color: rgba(244, 239, 228, 0.4); }
#landing footer a, .doc footer a { color: rgba(244, 239, 228, 0.62); text-decoration: none; border-bottom: 1px solid rgba(244, 239, 228, 0.2); }
#landing footer a:hover, .doc footer a:hover { color: #f3e2b8; }
#landing footer p, .doc footer p { margin: 0; }

/* Появление */
.ld-rv { opacity: 0; transform: translateY(14px); animation: ld-rise 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) forwards; animation-delay: var(--d, 0s); }

@media (min-width: 760px) {
  .ld-feat { grid-template-columns: repeat(4, 1fr); }
  .ld-steps { grid-template-columns: repeat(3, 1fr); }
  .ld-hero { padding-top: 44px; }
}

@keyframes ld-draw { to { stroke-dashoffset: 0; } }
@keyframes ld-spin { to { transform: rotate(360deg); } }
@keyframes ld-fade { to { opacity: 1; } }
@keyframes ld-star-in { from { opacity: 0; transform: scale(0.2) rotate(-90deg); } to { opacity: 1; transform: scale(1) rotate(0); } }
@keyframes ld-pulse { 0%, 100% { transform: scale(1) rotate(0); } 50% { transform: scale(1.1) rotate(8deg); } }
@keyframes ld-breathe { 0%, 100% { transform: scale(0.92); opacity: 0.7; } 50% { transform: scale(1.06); opacity: 1; } }
@keyframes ld-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes ld-rise { to { opacity: 1; transform: none; } }
@keyframes ld-sheen { 0%, 100% { background-position: 0% 0; } 50% { background-position: 100% 0; } }
@keyframes ld-shine { 0%, 55% { left: -50%; } 100% { left: 130%; } }
@keyframes ld-ping { 0% { box-shadow: 0 0 0 0 rgba(78, 194, 126, 0.6); } 80%, 100% { box-shadow: 0 0 0 9px rgba(78, 194, 126, 0); } }
@keyframes ld-twinkle { 0%, 100% { opacity: 0.35; } 50% { opacity: 1; } }
@keyframes ld-drift-a { to { transform: translate3d(14vmax, 10vmax, 0) scale(1.15); } }
@keyframes ld-drift-b { to { transform: translate3d(-12vmax, -8vmax, 0) scale(1.1); } }
@keyframes ld-drift-c { to { transform: translate3d(10vmax, -12vmax, 0) scale(1.2); } }

@media (prefers-reduced-motion: reduce) {
  #landing *, #landing *::after { animation-duration: 0.01s !important; animation-iteration-count: 1 !important; animation-delay: 0s !important; }
}

/* Юридические страницы */
.doc { max-width: 720px; margin: 0 auto; padding: 40px 20px 20px; line-height: 1.7; color: rgba(244, 239, 228, 0.82); font-size: 15px; min-height: 100vh; display: flex; flex-direction: column; }
.doc .brand { font-family: "Iowan Old Style", "Palatino Linotype", Palatino, serif; font-style: italic; font-size: 26px; color: #f3e2b8; text-decoration: none; }
.doc h1 { margin: 22px 0 6px; font-family: "Iowan Old Style", "Palatino Linotype", Palatino, serif; font-weight: 400; font-size: 32px; color: #f3e2b8; }
.doc h2 { margin: 30px 0 8px; font-size: 17px; color: #f3e2b8; }
.doc p, .doc li { margin: 8px 0; }
.doc ul { padding-left: 20px; }
.doc small { color: rgba(244, 239, 228, 0.45); }
.doc a { color: #e4c27a; }
