/* Oravo design tokens — consumate de landing, admin și widget */
:root {
  /* culoare */
  --ink: #0B1220;
  --ink-2: #3A4356;
  --muted: #6B7385;
  --bg: #FAFAF8;
  --panel: #FFFFFF;
  --hairline: rgba(11, 18, 32, .08);
  --hairline-2: rgba(11, 18, 32, .14);
  --brand: #4F46E5;
  --brand-2: #7C3AED;
  --brand-grad: linear-gradient(135deg, #4F46E5, #7C3AED);
  --brand-soft: rgba(79, 70, 229, .08);
  --success: #10B981;
  --success-soft: rgba(16, 185, 129, .12);
  --danger: #E11D48;
  --danger-soft: rgba(225, 29, 72, .1);
  --warn: #D97706;
  --warn-soft: rgba(217, 119, 6, .12);

  /* tipografie */
  --font-display: 'Sora', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-ui: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* spațiere pe grilă de 4px */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 20px;
  --s6: 24px; --s8: 32px; --s10: 40px; --s12: 48px; --s16: 64px; --s20: 80px;

  /* forme și umbre */
  --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-xl: 24px;
  --shadow-sm: 0 1px 2px rgba(11, 18, 32, .05), 0 1px 8px rgba(11, 18, 32, .04);
  --shadow-md: 0 2px 6px rgba(11, 18, 32, .06), 0 12px 32px rgba(11, 18, 32, .08);
  --shadow-lg: 0 4px 12px rgba(11, 18, 32, .08), 0 24px 64px rgba(11, 18, 32, .14);

  /* mișcare */
  --ease: cubic-bezier(.2, .8, .2, 1);
  --t-fast: .18s var(--ease);
  --t-slow: .4s var(--ease);
}

/* fonturi variabile self-hosted (GDPR: fără request către Google Fonts) */
@font-face {
  font-family: 'Inter';
  src: url('/fonts/inter.woff2') format('woff2');
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: 'Sora';
  src: url('/fonts/sora.woff2') format('woff2');
  font-weight: 100 800;
  font-display: swap;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font-ui);
  color: var(--ink);
  background: var(--bg);
  line-height: 1.55;
  font-size: 15px;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4 { font-family: var(--font-display); letter-spacing: -.02em; line-height: 1.15; margin: 0 0 var(--s3); }
p { margin: 0 0 var(--s3); }
a { color: var(--brand); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; }
button { font-family: inherit; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}