/* ============ ЛЕСНАЯ ГАВАНЬ — дизайн-система v2 ============ */
:root {
  --bg: #0b100d;
  --bg2: #101712;
  --card: rgba(255,255,255,.045);
  --card-solid: #151d17;
  --line: rgba(255,255,255,.09);
  --text: #f2f0e6;
  --muted: #a9b3a4;
  --accent: #cf7a3d;
  --accent2: #e0a468;
  --accent-grad: #cf7a3d;
  --green: #7fae7a;
  --ok: #8fce7f;
  --err: #e08a7a;
  --radius: 20px;
  --font-head: 'Geologica', 'Segoe UI', sans-serif;
  --font-body: 'Manrope', 'Segoe UI', system-ui, sans-serif;
  --shadow: 0 20px 50px rgba(0,0,0,.45);
  --shadow-sm: 0 8px 24px rgba(0,0,0,.35);
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-body); background: var(--bg); color: var(--text);
  line-height: 1.6; overflow-x: hidden; -webkit-font-smoothing: antialiased;
}
/* атмосферный фон: глубокий лес + тёплые пятна */
body::before {
  content: ''; position: fixed; inset: 0; z-index: -2; pointer-events: none;
  background:
    radial-gradient(1100px 600px at 85% -10%, rgba(232,162,92,.10), transparent 60%),
    radial-gradient(900px 700px at -10% 30%, rgba(74,124,78,.16), transparent 60%),
    radial-gradient(800px 500px at 60% 110%, rgba(46,84,58,.20), transparent 60%),
    linear-gradient(180deg, #0b100d 0%, #0d1310 50%, #0b100d 100%);
}
/* зерно плёнки */
body::after {
  content: ''; position: fixed; inset: 0; z-index: 999; pointer-events: none; opacity: .05;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");
}
::selection { background: rgba(232,162,92,.35); }
::-webkit-scrollbar { width: 11px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: #2c3a2e; border-radius: 8px; border: 2px solid var(--bg); }
::-webkit-scrollbar-thumb:hover { background: var(--accent); }

img { display: block; max-width: 100%; }
a { color: var(--accent2); text-decoration: none; transition: .25s; }
.container { max-width: 1220px; margin: 0 auto; padding: 0 24px; }
.muted { color: var(--muted); } .small { font-size: .85rem; } .center { text-align: center; }
.h1 { font-family: var(--font-head); font-weight: 800; font-size: clamp(1.7rem, 4vw, 2.7rem); line-height: 1.15; margin-bottom: .4em; }
.h2 { font-family: var(--font-head); font-weight: 600; font-size: clamp(1.25rem, 3vw, 1.75rem); line-height: 1.2; }
.h3 { font-family: var(--font-head); font-weight: 600; font-size: 1.05rem; }