/* ==========================================================================
   Первый экран и страницы-заглушки
   ========================================================================== */

/* --- Первый экран ------------------------------------------------------- */
.hero { padding: 12px var(--gutter) 0; }
.hero__card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  max-width: calc(var(--container) + 2 * var(--s-10));
  min-height: min(92vh, 860px);
  margin-inline: auto;
  display: flex;
  align-items: flex-end;
  border-radius: var(--shape-leaf);
  background: var(--c-navy-900) var(--hero-bg) 70% 50% / cover no-repeat;
  color: #fff;
}
.hero__card::before {            /* затемнение под текст */
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(8, 22, 38, .88) 0%, rgba(8, 22, 38, .62) 45%, rgba(8, 22, 38, .15) 100%),
    linear-gradient(0deg, rgba(8, 22, 38, .75) 0%, transparent 45%);
}
.hero__inner { padding-block: 150px clamp(32px, 5vw, 64px); }
.hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 20px;
  padding: 8px 14px 8px 10px;
  border-radius: var(--shape-chip);
  background: rgba(255, 255, 255, .12);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22);
  font-size: 14px;
  font-weight: 600;
}
.hero__eyebrow img { border-radius: 4px 1px 4px 1px; }
.hero__title {
  max-width: 900px;
  margin: 0 0 20px;
  font-family: var(--f-display);
  font-size: var(--fs-3xl);
  font-weight: 800;
  line-height: 1.04;
  letter-spacing: -.025em;
}
.hero__lead { max-width: 640px; margin: 0 0 32px; font-size: var(--fs-md); color: rgba(255, 255, 255, .82); }
.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: clamp(40px, 6vw, 72px); }
.btn--glass {
  --btn-bg: rgba(255, 255, 255, .14);
  --btn-bg-hover: rgba(255, 255, 255, .24);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .3);
}
.btn--glass:hover { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .5); }
.hero__facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  max-width: 900px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.hero__facts li {
  display: grid;
  gap: 2px;
  padding: 16px 20px;
  border-radius: 22px 8px 22px 8px;
  background: rgba(255, 255, 255, .10);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  backdrop-filter: blur(14px) saturate(140%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18);
}
.hero__facts b { font-family: var(--f-display); font-size: var(--fs-lg); font-weight: 800; }
.hero__facts span { font-size: 13px; color: rgba(255, 255, 255, .72); }

@media (max-width: 720px) {
  .hero { padding: 8px 8px 0; }
  .hero__card { min-height: 0; }
  .hero__inner { padding-top: 120px; }
  .hero__facts { grid-template-columns: 1fr; }
  .hero__actions .btn { flex: 1 1 100%; }
}

/* --- Страница-заглушка («колхоз» по заданию: белый фон, заголовок, «в работе») --- */
.page-stub {
  min-height: 100vh;
  padding: 150px var(--gutter) 80px;
  background: #fff;
  font-family: "Times New Roman", Times, serif;
  color: #000;
}
.page-stub__crumbs { margin: 0 0 24px; font-size: 16px; }
.page-stub__crumbs a { color: #00e; }
.page-stub h1 { margin: 0 0 24px; font-size: 44px; font-weight: 700; }
.page-stub__wip {
  display: inline-block;
  margin: 0 0 24px;
  padding: 10px 18px;
  border: 3px dashed #000;
  background: repeating-linear-gradient(45deg, #ffd400 0 16px, #111 16px 32px);
  font: 700 18px/1.3 Arial, sans-serif;
}
.page-stub__wip span { padding: 4px 10px; background: #ffd400; }
.page-stub p { font-size: 18px; }
.page-stub a { color: #00e; }