/* ============================================================
   Buhalteris 2.0 — Darbo užmokesčio programa · Landing page
   Design system
   ============================================================ */

:root {
  /* Palette — warm cream surface, confident deep-blue accent, charcoal ink */
  --bg:        #FAF8F3;
  --bg-2:      #F3F0E8;
  --surface:   #FFFFFF;
  --ink:       #16191D;
  --ink-soft:  #51565F;
  --ink-faint: #868C95;
  --line:      rgba(18, 24, 31, 0.09);
  --line-2:    rgba(18, 24, 31, 0.05);

  /* Accent (tweakable). Deep blue by default. */
  --accent:        oklch(0.50 0.15 258);
  --accent-strong: oklch(0.43 0.15 258);
  --accent-soft:   oklch(0.95 0.03 258);
  --accent-line:   oklch(0.83 0.07 258);
  --accent-ink:    #FFFFFF;

  /* Radii + shadow */
  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 22px;
  --r-xl: 30px;
  --shadow-sm: 0 1px 2px rgba(18,24,31,.05), 0 2px 6px rgba(18,24,31,.04);
  --shadow-md: 0 4px 12px rgba(18,24,31,.06), 0 12px 28px rgba(18,24,31,.06);
  --shadow-lg: 0 8px 24px rgba(18,24,31,.08), 0 30px 60px rgba(18,24,31,.10);

  /* Type */
  --font: "Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --maxw: 1180px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--ink);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-feature-settings: "ss01", "cv01";
  overflow-x: hidden;
}

::selection { background: var(--accent-soft); color: var(--accent-strong); }

a { color: inherit; text-decoration: none; }
img, svg { display: block; max-width: 100%; }

/* Keyboard focus ring (only for keyboard users, not mouse clicks) */
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.btn:focus-visible { outline-offset: 3px; }
:focus:not(:focus-visible) { outline: none; }

/* ---------- Layout helpers ---------- */
.wrap { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: 24px; }
.section { padding-block: clamp(64px, 9vw, 128px); }
.section--tight { padding-block: clamp(48px, 6vw, 88px); }

.eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 600; letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--accent-strong);
}
.eyebrow::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: var(--accent); display: inline-block;
}

.section-head { max-width: 680px; }
.section-head.center { margin-inline: auto; text-align: center; }
.section-head .eyebrow.center { display: inline-flex; }

h1, h2, h3 { line-height: 1.08; letter-spacing: -0.02em; font-weight: 600; text-wrap: balance; }

.h-display { font-size: clamp(38px, 5.4vw, 66px); letter-spacing: -0.03em; }
.h-section { font-size: clamp(30px, 3.6vw, 44px); margin-top: 18px; }
.lead { font-size: clamp(17px, 1.4vw, 20px); color: var(--ink-soft); line-height: 1.6; text-wrap: pretty; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  font-family: inherit; font-size: 15.5px; font-weight: 550;
  padding: 13px 22px; border-radius: 999px; border: 1px solid transparent;
  cursor: pointer; transition: transform .18s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
  white-space: nowrap; line-height: 1;
}
.btn:active { transform: translateY(1px); }
.btn--primary {
  background: var(--accent); color: var(--accent-ink);
  box-shadow: 0 1px 1px rgba(18,24,31,.12), 0 8px 20px -8px var(--accent);
}
.btn--primary:hover { background: var(--accent-strong); box-shadow: 0 1px 1px rgba(18,24,31,.12), 0 12px 26px -8px var(--accent); transform: translateY(-1px); }
.btn--ghost { background: var(--surface); color: var(--ink); border-color: var(--line); box-shadow: var(--shadow-sm); }
.btn--ghost:hover { border-color: var(--accent-line); color: var(--accent-strong); transform: translateY(-1px); }
.btn--lg { padding: 16px 28px; font-size: 16.5px; }
.btn--block { width: 100%; }
.btn .arrow { transition: transform .2s ease; }
.btn:hover .arrow { transform: translateX(3px); }

/* ---------- Reveal animation ---------- */
.reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.in { opacity: 1; transform: none; }
.reveal[data-delay="1"] { transition-delay: .07s; }
.reveal[data-delay="2"] { transition-delay: .14s; }
.reveal[data-delay="3"] { transition-delay: .21s; }
.reveal[data-delay="4"] { transition-delay: .28s; }
.reveal[data-delay="5"] { transition-delay: .35s; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
}