/* ==========================================================================
   Стекло — материал из tiana (design-system/src/widget-templates.css, шаблон «Стекло»).
   Слои снизу вверх: контактная тень у кромки, корпусная тень, каустика (светлый просвет),
   взвесь с размытием, ребро со светлой фаской сверху и отражённым светом снизу,
   один диагональный блик. На тёмной странице взвесь тёмная, свет по ребру остаётся белым.
   ========================================================================== */
.glass { position: relative; isolation: isolate; border: 1px solid rgba(255, 255, 255, .22);
  background: rgba(30, 22, 78, .42);
  backdrop-filter: blur(18px) saturate(145%) brightness(1.04); -webkit-backdrop-filter: blur(18px) saturate(145%) brightness(1.04);
  box-shadow:
    0 3px 8px -2px rgba(255, 255, 255, .20),
    0 14px 20px -10px rgba(255, 255, 255, .08),
    0 34px 50px -16px rgba(4, 3, 14, .62),
    0 60px 80px -40px rgba(4, 3, 14, .5),
    inset 0 1.5px 0 rgba(255, 255, 255, .5),
    inset 0 -2px 1px rgba(255, 255, 255, .14),
    inset 1px 0 0 rgba(255, 255, 255, .16),
    inset -1px 0 0 rgba(255, 255, 255, .16); }
.glass::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
  background: linear-gradient(128deg, rgba(255, 255, 255, .24) 0%, rgba(255, 255, 255, .06) 26%, rgba(255, 255, 255, 0) 52%); }
/* Светлое стекло — на светлом разделе: белая взвесь, двухуровневая тень (просвет у кромки, потом тень с зазором) */
.glass-light { position: relative; isolation: isolate; border: 1px solid rgba(255, 255, 255, .85);
  background: rgba(255, 255, 255, .5);
  backdrop-filter: blur(18px) saturate(145%) brightness(1.02); -webkit-backdrop-filter: blur(18px) saturate(145%) brightness(1.02);
  box-shadow:
    0 4px 9px -2px rgba(255, 255, 255, .98),
    0 20px 28px -10px rgba(255, 255, 255, .82),
    0 40px 54px -18px rgba(28, 19, 72, .28),
    0 70px 92px -48px rgba(28, 19, 72, .28),
    inset 0 1.5px 0 rgba(255, 255, 255, .95),
    inset 0 -2px 1px rgba(255, 255, 255, .6),
    inset 1px 0 0 rgba(255, 255, 255, .4),
    inset -1px 0 0 rgba(255, 255, 255, .4),
    inset 0 -3px 4px -2px rgba(28, 19, 72, .14); }
.glass-light::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
  background: linear-gradient(128deg, rgba(255, 255, 255, .62) 0%, rgba(255, 255, 255, .18) 26%, rgba(255, 255, 255, 0) 52%); }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .glass { background: rgba(30, 22, 78, .92); }
  .glass-light { background: rgba(255, 255, 255, .9); }
}
.demo-ctl, .tech-card, .order-side { border-radius: 20px; }
.why-card { border-radius: 22px; }
/* Светлая карточка: белую взвесь даёт стекло, сплошная белая заливка снята */
.why-card.glass-light { background: rgba(255, 255, 255, .5); }
/* Кнопки на стекле — маленькие выпуклые органы того же материала */
.demo-ctl .tgl { background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .2);
  box-shadow: 0 10px 16px -10px rgba(4, 3, 14, .6), inset 0 1.5px 0 rgba(255, 255, 255, .35), inset 0 -1.5px 0 rgba(255, 255, 255, .08); }
.demo-ctl .tgl:hover { background: rgba(255, 255, 255, .16); }
.demo-ctl .tgl[aria-pressed="true"] { background: var(--cold); border-color: rgba(255, 255, 255, .6); color: #0A1430; }
/* Поля заявки — вогнутое стекло: тень уходит внутрь сверху, блик по нижней кромке */
.field input, .field textarea { background: rgba(10, 6, 30, .5); border: 1px solid rgba(255, 255, 255, .16);
  box-shadow: inset 0 3px 7px rgba(4, 3, 14, .5), inset 0 -1.5px 0 rgba(255, 255, 255, .14); }
.field input:hover, .field textarea:hover { background: rgba(10, 6, 30, .62); }