/* === BRAND SKIN (чисто и быстро) ======================================== */

/* Убраны @font-face Geist, чтобы не было 404, используем системные шрифты */

:root{
  --background:#3B5249;
  --background-dark:#22302B;
  --dark-shade-1:#131F1B;
  --dark-shade-2:#090F0D;
  --dark-shade-3:#010402;
  --text:#B8C7AB;
  --text-secondary:#A4B494;
  --text-minor:#7E8578;
  --text-helper:#C0C7AB80;
  --accent:#DAA520;
  --text-accent:#FFE9B2;
  --growth:#0CB043;
  --bg-gradient:linear-gradient(var(--background) 0%, var(--background-dark) 100%);
  --bg-transparent:#B8C7AB30;

  --bg:var(--background-dark);
  --card:var(--dark-shade-1);
  --line:#1b2a24;
  --muted:var(--text-minor);
  --accent-soft:color-mix(in oklab, var(--accent) 12%, transparent);
  --header-bg:#3B5249CC;
  --font:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;

  --radius:999px;
}

html,body{
  background:
    radial-gradient(1100px 600px at 92% -8%, color-mix(in oklab, var(--accent) 9%, transparent) 0%, transparent 60%),
    radial-gradient(900px 520px at -10% 28%, color-mix(in oklab, var(--growth) 8%, transparent) 0%, transparent 60%),
    var(--bg-gradient) fixed;
  color:var(--text);
}
a{ color:var(--accent); }
::-moz-selection{ color:var(--text-accent); background:var(--accent) }
::selection{ color:var(--text-accent); background:var(--accent) }

.card{ background:var(--card); border:1px solid var(--line) }
.section{ border-top:1px solid var(--line) }

/* === Кнопки: outline, без фоновых картинок ============================== */
.btn{
  --h:46px;
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  min-height:var(--h); padding:0 18px; border-radius:var(--radius);
  font-weight:800; line-height:1; cursor:pointer; user-select:none;
  transition:transform .06s ease, background .2s cubic-bezier(.16,1,.3,1);
  background:transparent; color:var(--accent); border:1.5px solid var(--accent);
  box-shadow:none; filter:none;
}
.btn:hover, .btn:focus-visible{ background:var(--accent-soft); outline:0 }
.btn:active{ transform:translateY(.5px) }
.btn.sm{ --h:38px; padding:0 14px; font-size:.92rem }
.btn.lg{ --h:54px; padding:0 22px; font-size:1.05rem }
.btn__arrow{ width:20px; height:20px; flex:0 0 20px;
  background:url("/img/arrow-btn.svg") center/contain no-repeat }

/* иконки */
.icon{ width:18px; height:18px; display:inline-block; background-size:contain; background-position:center; background-repeat:no-repeat }
.icon.tg{ background-image:url("/img/telegram.svg") }
.icon.viber{ background-image:url("/img/viber.svg") }

/* ауры секций */
.bg-hero{
  background:
    radial-gradient(880px 420px at 100% 0%, color-mix(in oklab, var(--accent) 16%, transparent) 0%, transparent 70%),
    radial-gradient(700px 360px at 0% 40%, color-mix(in oklab, var(--growth) 14%, transparent) 0%, transparent 70%);
  border-radius:16px;
}
.bg-aura{
  background:
    radial-gradient(760px 320px at 95% -10%, color-mix(in oklab, var(--accent) 9%, transparent) 0%, transparent 65%),
    radial-gradient(640px 300px at -5% 50%, color-mix(in oklab, var(--growth) 8%, transparent) 0%, transparent 68%);
  border-radius:16px;
}

/* заголовочные утилиты */
.title-text-1{ text-transform:uppercase; font-weight:300; font-size:clamp(2.2rem,4vw,4.5rem); line-height:1; letter-spacing:.02em }
.title-text-2{ text-transform:uppercase; font-weight:800; font-size:clamp(2.2rem,4vw,4.5rem); line-height:1; letter-spacing:.02em }
.subtitle-text-2{ text-transform:uppercase; font-weight:600; font-size:clamp(1.1rem,2.2vw,1.7rem); line-height:1.2 }
.small-text{ font-size:.875rem; line-height:1.25rem }
.main-text{ font-size:.95rem; line-height:1.55rem }
.accent-text{ color:var(--accent); font-weight:600 }