/* Приложения экосистемы Swiss+ — плитки и шторка «На экран Домой» */
.eco-apps { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
.eco-app { position: relative; display: grid; grid-template-columns: 72px 1fr; grid-template-rows: auto auto; gap: 14px 16px; align-items: center;
  padding: 18px; border-radius: 26px; overflow: hidden; isolation: isolate; color: #fff;
  background: linear-gradient(160deg, rgb(255 255 255 / .07), rgb(255 255 255 / .02)), rgb(8 10 18 / .7);
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / .09), 0 30px 60px -36px rgb(0 0 0 / .9);
  -webkit-backdrop-filter: blur(18px) saturate(1.3); backdrop-filter: blur(18px) saturate(1.3); transition: transform .35s cubic-bezier(.2, .8, .2, 1), box-shadow .35s; }
.eco-app:hover { transform: translateY(-3px); box-shadow: inset 0 0 0 1px rgb(120 200 255 / .25), 0 36px 70px -34px rgb(40 110 255 / .55); }
.eco-glow { position: absolute; inset: -40% -20% auto auto; width: 70%; aspect-ratio: 1; border-radius: 50%; z-index: -1; filter: blur(40px); opacity: .55;
  background: radial-gradient(circle, #2F6BFF, transparent 65%); animation: ecoFloat 9s ease-in-out infinite; }
.eco-app.k-social .eco-glow { background: radial-gradient(circle, #3D8BFF, transparent 65%); animation-delay: -3s; }
.eco-app.k-ai .eco-glow { background: radial-gradient(circle, #6FE6EE, transparent 65%); animation-delay: -6s; }
@keyframes ecoFloat { 50% { transform: translate(-18%, 22%) scale(1.15); } }
.eco-logo { width: 72px; height: 72px; border-radius: 18px; object-fit: cover; background: #000; box-shadow: 0 10px 30px -12px rgb(47 107 255 / .8), inset 0 0 0 1px rgb(255 255 255 / .08); }
.eco-txt b { display: block; font-size: 19px; letter-spacing: -0.02em; }
.eco-txt p { margin: 4px 0 0; font-size: 14px; line-height: 1.4; color: rgb(235 240 255 / .66); }
.eco-act { grid-column: 1 / -1; display: flex; gap: 8px; }
.eco-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 42px; padding: 0 16px; border-radius: 999px; border: 0; cursor: pointer;
  font: inherit; font-size: 14.5px; font-weight: 650; text-decoration: none; transition: transform .15s, background .2s; white-space: nowrap; }
.eco-btn:active { transform: scale(.97); }
.eco-btn svg { width: 17px; height: 17px; }
.eco-btn.solid { background: #fff; color: #05070D; flex: 1; }
.eco-btn.ghost { background: rgb(255 255 255 / .1); color: #fff; box-shadow: inset 0 0 0 1px rgb(255 255 255 / .14); flex: 1; }
.eco-btn.wide { width: 100%; height: 50px; font-size: 16px; }
.eco-sheet { position: fixed; inset: 0; z-index: 400; }
.eco-sheet-bg { position: absolute; inset: 0; background: rgb(0 0 0 / .55); opacity: 0; transition: opacity .25s; }
.eco-sheet-p { position: absolute; left: 0; right: 0; bottom: 0; max-width: 520px; margin: 0 auto; display: grid; gap: 12px; color: #fff;
  padding: 10px 18px calc(18px + env(safe-area-inset-bottom)); border-radius: 26px 26px 0 0; background: rgb(18 21 32 / .97);
  -webkit-backdrop-filter: blur(30px); backdrop-filter: blur(30px); transform: translateY(100%); transition: transform .32s cubic-bezier(.2, .9, .3, 1); }
.eco-sheet.on .eco-sheet-bg { opacity: 1; } .eco-sheet.on .eco-sheet-p { transform: none; }
.eco-grip { display: block; width: 38px; height: 5px; border-radius: 3px; margin: 0 auto 4px; background: rgb(255 255 255 / .25); }
.eco-sheet-h { display: flex; align-items: center; gap: 12px; } .eco-sheet-h img { width: 48px; height: 48px; border-radius: 12px; } .eco-sheet-h b { font-size: 18px; }
.eco-sheet section { padding: 12px 14px; border-radius: 16px; background: rgb(255 255 255 / .05); }
.eco-sheet section.on { background: rgb(47 107 255 / .14); box-shadow: inset 0 0 0 1px rgb(110 160 255 / .3); }
.eco-sheet h4 { margin: 0 0 6px; font-size: 14px; }
.eco-sheet ol { margin: 0; padding-left: 20px; font-size: 14.5px; line-height: 1.55; color: rgb(235 240 255 / .85); }
.eco-note { margin: 0; font-size: 13px; color: rgb(235 240 255 / .55); text-align: center; }
@media (prefers-reduced-motion: reduce) { .eco-glow { animation: none; } }
.eco-page { margin-bottom: 16px; }
.eco-how b { display: block; margin-bottom: 6px; }
.eco-how ul { margin: 0; padding-left: 20px; line-height: 1.6; color: var(--muted, rgb(235 235 245 / .7)); }
