@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@300;400;600;700;800;900&family=Barlow:wght@300;400;500;600&family=Noto+Sans:wght@300;400;500&display=swap');

/* ── TOKENS ── */
:root {
  --orange:      #f7931d;
  --orange-dark: #d4780f;
  --orange-dim:  rgba(247,147,29,0.12);
  --orange-line: rgba(247,147,29,0.20);
  --dark:        #0e0f10;
  --dark-2:      #161718;
  --dark-3:      #1e1f21;
  --dark-4:      #252628;
  --text:        #e6e6e6;
  --muted:       #7a7b7d;
  --border:      rgba(255,255,255,0.07);
  --radius:      0px;
  /* unified font stack: Barlow handles Latin perfectly,
     Noto Sans fills in Cyrillic at matching weight */
  --font-body:    'Barlow', 'Noto Sans', sans-serif;
  --font-display: 'Barlow Condensed', 'Noto Sans', sans-serif;
}

/* ── RESET ── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }
body { font-family: var(--font-body); background:var(--dark); color:var(--text); overflow-x:hidden; line-height:1.6; }
img  { display:block; max-width:100%; }
a    { color:inherit; text-decoration:none; }

/* ── TYPOGRAPHY ── */
.display {
  font-family: var(--font-display);
  font-weight:900; text-transform:uppercase;
  line-height:.9; letter-spacing:-.02em;
}
.heading {
  font-family: var(--font-display);
  font-weight:800; text-transform:uppercase;
  line-height:.95; letter-spacing:-.01em;
}
.label-tag {
  font-family: var(--font-display);
  font-size:10px; font-weight:700;
  letter-spacing:.2em; text-transform:uppercase;
  color:var(--orange);
  display:inline-flex; align-items:center; gap:8px;
}
.label-tag::before { content:''; width:20px; height:1px; background:var(--orange); flex-shrink:0; }

/* ── BUTTONS ── */
.btn {
  font-family:'Barlow Condensed',sans-serif;
  font-size:13px; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase;
  display:inline-flex; align-items:center; gap:8px;
  padding:12px 28px; cursor:pointer; border:none;
  transition:all .2s; text-decoration:none;
  clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%);
}
.btn-orange { background:var(--orange); color:#0e0f10; }
.btn-orange:hover { background:var(--orange-dark); }
.btn-ghost  { background:transparent; color:var(--text); border:1px solid var(--border); clip-path:none; }
.btn-ghost:hover { border-color:var(--orange); color:var(--orange); }

/* ── NAV ── */
#nav {
  position:fixed; top:0; left:0; right:0; z-index:200;
  height:64px;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 48px;
  background:rgba(14,15,16,.92);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--border);
  transition:background .3s;
}
.nav-logo { display:flex; align-items:center; }
.nav-logo svg { height:32px; width:auto; }
.nav-links { display:flex; gap:32px; list-style:none; }
.nav-links a {
  font-family:'Barlow Condensed',sans-serif;
  font-size:12px; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted); transition:color .2s;
}
.nav-links a:hover,
.nav-links a.active { color:var(--orange); }
.nav-right { display:flex; align-items:center; gap:12px; }

/* mobile nav toggle */
.nav-burger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:4px; }
.nav-burger span { width:22px; height:1.5px; background:var(--text); transition:.3s; display:block; }

/* ── LAYOUT ── */
.container { max-width:1280px; margin:0 auto; padding:0 48px; }
.section    { padding:88px 0; }
.section-sm { padding:56px 0; }

/* ── GRID LINES decoration ── */
.grid-overlay {
  position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(247,147,29,.03) 1px, transparent 1px),
    linear-gradient(90deg,rgba(247,147,29,.03) 1px, transparent 1px);
  background-size:64px 64px;
}

/* ── CARDS ── */
.card {
  background:var(--dark-2);
  border:1px solid var(--border);
  position:relative; overflow:hidden;
  transition:border-color .3s, background .3s;
}
.card:hover { border-color:var(--orange-line); background:var(--dark-3); }
.card-accent {
  position:absolute; top:0; left:0; right:0; height:2px;
  background:var(--orange);
  transform:scaleX(0); transform-origin:left;
  transition:transform .4s ease;
}
.card:hover .card-accent { transform:scaleX(1); }

/* ── TAGS / BADGES ── */
.badge {
  font-family:'Barlow Condensed',sans-serif;
  font-size:9px; font-weight:700; letter-spacing:.15em; text-transform:uppercase;
  padding:3px 10px;
  background:var(--orange-dim); color:var(--orange);
  border:1px solid var(--orange-line);
}

/* ── DIVIDER ── */
.divider { border:none; border-top:1px solid var(--border); }

/* ── FORM ELEMENTS ── */
.field { display:flex; flex-direction:column; gap:6px; }
.field label {
  font-family:'Barlow Condensed',sans-serif;
  font-size:10px; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; color:var(--muted);
}
.field input, .field select, .field textarea {
  background:var(--dark-3); border:1px solid var(--border);
  color:var(--text); font-family:'Barlow',sans-serif;
  font-size:14px; font-weight:300; padding:11px 14px;
  outline:none; transition:border-color .2s; width:100%;
}
.field input:focus, .field select:focus, .field textarea:focus { border-color:var(--orange); }
.field textarea { resize:vertical; min-height:90px; }

/* ── ANIMATIONS ── */
@keyframes fadeUp {
  from { opacity:0; transform:translateY(20px); }
  to   { opacity:1; transform:translateY(0); }
}
.fade-up { animation:fadeUp .6s ease both; }
.delay-1 { animation-delay:.1s; }
.delay-2 { animation-delay:.2s; }
.delay-3 { animation-delay:.3s; }
.delay-4 { animation-delay:.4s; }
.delay-5 { animation-delay:.5s; }

/* ── FOOTER ── */
#footer {
  background:var(--dark-2);
  border-top:1px solid var(--border);
  padding:40px 0 24px;
}
.footer-grid {
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1fr;
  gap:40px;
  padding-bottom:40px;
  border-bottom:1px solid var(--border);
  margin-bottom:24px;
}
.footer-logo svg { height:28px; width:auto; margin-bottom:14px; }
.footer-desc { font-size:13px; font-weight:300; color:var(--muted); line-height:1.7; max-width:220px; }
.footer-col h5 {
  font-family:'Barlow Condensed',sans-serif;
  font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--orange); margin-bottom:16px;
}
.footer-col ul { list-style:none; display:flex; flex-direction:column; gap:8px; }
.footer-col ul li a { font-size:13px; font-weight:300; color:var(--muted); transition:color .2s; }
.footer-col ul li a:hover { color:var(--text); }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; }
.footer-copy { font-size:11px; color:var(--muted); }

/* ── RESPONSIVE ── */
@media (max-width:1024px) {
  #nav { padding:0 24px; }
  .container { padding:0 24px; }
  .nav-links { display:none; }
  .nav-burger { display:flex; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:32px; }
}
@media (max-width:640px) {
  .section { padding:60px 0; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column; gap:12px; text-align:center; }
}
