/* ==========================================================================
   Revanzator.ro — Design System (Premium Light)
   Inspirat de referințe minimaliste premium. Light, aerisit, contrast clar.
   ========================================================================== */

:root {
  /* --- Culori de bază --- */
  --rv-bg:            #F6F6F3;   /* fundal pagină — fir de căldură */
  --rv-bg-soft:       #FFFFFF;   /* suprafețe / carduri */
  --rv-bg-elevated:   #FFFFFF;
  --rv-ink:           #0A0A0B;   /* text principal / negru premium */
  --rv-ink-2:         #3A3D44;   /* text secundar */
  --rv-muted:         #5B616B;   /* text discret — contrast mai bun pe alb */
  --rv-line:          #E3E5E9;   /* borduri fine — un pic mai prezente */
  --rv-line-strong:   #D7DAE0;

  /* --- Accente funcționale --- */
  --rv-accent:        #0A0A0B;   /* CTA principal = negru */
  --rv-accent-ink:    #FFFFFF;
  --rv-growth:        #10B981;   /* creștere / profit */
  --rv-growth-soft:   #ECFDF5;
  --rv-risk:          #EF4444;   /* risc / atenție */
  --rv-risk-soft:     #FEF2F2;
  --rv-warn:          #F59E0B;   /* avertizare */
  --rv-warn-soft:     #FFFBEB;
  --rv-info:          #6366F1;   /* premium / AI */
  --rv-info-soft:     #EEF2FF;

  /* --- Gradient subtil argintiu (hero / texte mari) --- */
  --rv-grad-silver:   linear-gradient(180deg, #1A1A1D 0%, #6B7280 100%);
  --rv-grad-glow:     radial-gradient(60% 60% at 50% 40%, rgba(255,255,255,.9) 0%, rgba(247,248,250,0) 70%);

  /* --- Accent de brand „viu" (uplift premium) --- */
  --rv-brand:         #10B981;
  --rv-brand-2:       #0EA5A0;
  --rv-brand-grad:    linear-gradient(120deg, #10B981 0%, #0EA5A0 52%, #0891B2 100%);
  --rv-brand-grad-ink:linear-gradient(135deg, #0A0A0B 0%, #122a25 55%, #0a3f3a 100%);
  --rv-glow-brand:    0 18px 44px rgba(16,185,129,.30);
  --rv-glow-soft:     radial-gradient(50% 42% at 50% 0%, rgba(16,185,129,.13) 0%, rgba(16,185,129,0) 72%);

  /* --- Tipografie --- */
  --rv-font: 'Plus Jakarta Sans', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --rv-fs-hero: clamp(2.6rem, 7vw, 5.5rem);
  --rv-fs-h1: clamp(2rem, 4.5vw, 3.4rem);
  --rv-fs-h2: clamp(1.6rem, 3.4vw, 2.6rem);
  --rv-fs-h3: clamp(1.2rem, 2.2vw, 1.6rem);
  --rv-fs-body: 1.0625rem;
  --rv-fs-small: 0.875rem;

  /* --- Spacing (8px grid) --- */
  --rv-s-1: 8px;
  --rv-s-2: 16px;
  --rv-s-3: 24px;
  --rv-s-4: 32px;
  --rv-s-5: 48px;
  --rv-s-6: 64px;
  --rv-s-7: 96px;
  --rv-s-8: 128px;

  /* --- Forme & umbre --- */
  --rv-radius-sm: 12px;
  --rv-radius: 18px;
  --rv-radius-lg: 26px;
  --rv-radius-pill: 999px;
  --rv-shadow-xs: 0 1px 2px rgba(10,10,11,.04);
  --rv-shadow-sm: 0 2px 12px rgba(10,10,11,.05);
  --rv-shadow: 0 8px 30px rgba(10,10,11,.07);
  --rv-shadow-lg: 0 24px 60px rgba(10,10,11,.10);
  --rv-shadow-btn: 0 10px 24px rgba(10,10,11,.18);

  /* --- Layout --- */
  --rv-container: 1200px;
  --rv-container-wide: 1340px;
  --rv-nav-h: 76px;

  /* --- Tranziții --- */
  --rv-ease: cubic-bezier(.22,1,.36,1);
  --rv-t-fast: .18s var(--rv-ease);
  --rv-t: .32s var(--rv-ease);
  --rv-t-slow: .6s var(--rv-ease);
}

/* ==========================================================================
   DARK MODE — doar în modul-aplicație (body.rv-app-mode.rv-theme-dark).
   Suprascrie DOAR tokenii; tot restul UI-ului se adaptează automat.
   Paginile de marketing (fără rv-app-mode) rămân light, intenționat.
   ========================================================================== */
body.rv-app-mode.rv-theme-dark {
  --rv-bg:          #14161B;
  --rv-bg-soft:     #1C1F26;
  --rv-bg-elevated: #232730;
  --rv-ink:         #F3F4F6;
  --rv-ink-2:       #C9CDD6;
  --rv-muted:       #8A909B;
  --rv-line:        #2A2E37;
  --rv-line-strong: #353A45;
  --rv-accent:      #34D399;   /* în dark, CTA = verde (negru ar fi invizibil) */
  --rv-accent-ink:  #06281D;
  --rv-growth:      #34D399;
  --rv-growth-soft: rgba(52,211,153,.14);
  --rv-risk-soft:   rgba(239,68,68,.14);
  --rv-warn-soft:   rgba(245,158,11,.14);
  --rv-info-soft:   rgba(99,102,241,.16);
  --rv-shadow-xs:   0 1px 2px rgba(0,0,0,.4);
  --rv-shadow-sm:   0 2px 12px rgba(0,0,0,.45);
  --rv-shadow:      0 8px 30px rgba(0,0,0,.5);
  --rv-shadow-lg:   0 24px 60px rgba(0,0,0,.6);
}

/* ==========================================================================
   Componente partajate — skeleton + toast (token-based, merg în ambele moduri)
   ========================================================================== */
.rv-skeleton {
  background: linear-gradient(90deg, var(--rv-line) 25%, var(--rv-bg) 37%, var(--rv-line) 63%);
  background-size: 400% 100%;
  border-radius: var(--rv-radius-sm);
  animation: rv-shimmer 1.4s ease infinite;
}
@keyframes rv-shimmer { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }

.rv-toast-wrap { position: fixed; right: 18px; bottom: 18px; z-index: 10000; display: flex; flex-direction: column; gap: 8px; }
.rv-toast {
  display: flex; align-items: center; gap: 9px;
  background: var(--rv-bg-soft); color: var(--rv-ink);
  border: 1px solid var(--rv-line); border-left: 3px solid var(--rv-growth);
  border-radius: var(--rv-radius-sm); padding: 11px 15px; font-size: .875rem;
  box-shadow: var(--rv-shadow); max-width: 320px;
  animation: rv-toast-in .25s var(--rv-ease);
}
.rv-toast--err { border-left-color: var(--rv-risk); }
@keyframes rv-toast-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

.rv-sidebar__theme {
  display: flex; align-items: center; gap: 10px; width: 100%;
  margin: 8px 0 0; padding: 9px 12px;
  background: var(--rv-bg); border: 1px solid var(--rv-line);
  border-radius: var(--rv-radius-sm); color: var(--rv-ink-2);
  font-size: .85rem; font-weight: 600; cursor: pointer; font-family: inherit;
  transition: background var(--rv-t-fast), border-color var(--rv-t-fast);
}
.rv-sidebar__theme:hover { background: var(--rv-bg-soft); border-color: var(--rv-line-strong); }

/* ==========================================================================
   Reset & baze
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--rv-font);
  font-size: var(--rv-fs-body);
  line-height: 1.6;
  color: var(--rv-ink);
  background: var(--rv-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
img, svg { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; transition: color var(--rv-t-fast); }
button { font-family: inherit; cursor: pointer; }
h1, h2, h3, h4 { line-height: 1.1; font-weight: 700; letter-spacing: -.02em; margin: 0 0 var(--rv-s-2); }
p { margin: 0 0 var(--rv-s-2); color: var(--rv-ink-2); }
::selection { background: var(--rv-ink); color: #fff; }

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

/* ==========================================================================
   Layout helpers
   ========================================================================== */
.rv-container { width: 100%; max-width: var(--rv-container); margin-inline: auto; padding-inline: var(--rv-s-3); }
.rv-container-wide { max-width: var(--rv-container-wide); }
.rv-section { padding-block: var(--rv-s-7); }
.rv-section-sm { padding-block: var(--rv-s-5); }
.rv-center { text-align: center; }
.rv-stack > * + * { margin-top: var(--rv-s-2); }

/* ==========================================================================
   Tipografie utilitară
   ========================================================================== */
.rv-kicker {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: .8rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase;
  color: var(--rv-ink-2);
  background: var(--rv-bg-soft);
  border: 1px solid var(--rv-line);
  padding: 8px 16px; border-radius: var(--rv-radius-pill);
  box-shadow: var(--rv-shadow-sm);
}
.rv-kicker svg { width: 15px; height: 15px; }
.rv-display { font-size: var(--rv-fs-hero); font-weight: 800; letter-spacing: -.035em; }
.rv-gradient-text {
  background: var(--rv-grad-silver);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.rv-lead { font-size: 1.15rem; color: var(--rv-muted); max-width: 60ch; }
.rv-eyebrow { color: var(--rv-muted); font-size: var(--rv-fs-small); }

/* ==========================================================================
   Butoane
   ========================================================================== */
.rv-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font-weight: 600; font-size: 1rem;
  padding: 15px 28px; border-radius: var(--rv-radius-pill);
  border: 1px solid transparent;
  transition: transform var(--rv-t-fast), box-shadow var(--rv-t), background var(--rv-t), color var(--rv-t);
  will-change: transform;
}
.rv-btn:active { transform: translateY(1px) scale(.99); }
.rv-btn--primary { background: var(--rv-accent); color: var(--rv-accent-ink); box-shadow: var(--rv-shadow-btn); }
.rv-btn--primary:hover { transform: translateY(-2px); box-shadow: 0 16px 34px rgba(10,10,11,.26); }
.rv-btn--soft { background: var(--rv-bg-soft); color: var(--rv-ink); border-color: var(--rv-line); box-shadow: var(--rv-shadow-sm); }
.rv-btn--soft:hover { transform: translateY(-2px); box-shadow: var(--rv-shadow); border-color: var(--rv-line-strong); }
.rv-btn--ghost { background: transparent; color: var(--rv-ink); }
.rv-btn--ghost:hover { background: var(--rv-bg-soft); }
.rv-btn svg { width: 18px; height: 18px; }
.rv-btn--lg { padding: 18px 34px; font-size: 1.05rem; }
.rv-btn--block { width: 100%; }

/* ==========================================================================
   Carduri
   ========================================================================== */
.rv-card {
  background: var(--rv-bg-soft);
  border: 1px solid var(--rv-line);
  border-radius: var(--rv-radius-lg);
  padding: var(--rv-s-4);
  box-shadow: var(--rv-shadow-sm);
  transition: transform var(--rv-t), box-shadow var(--rv-t), border-color var(--rv-t);
}
.rv-card--hover:hover { transform: translateY(-4px); box-shadow: var(--rv-shadow); border-color: var(--rv-line-strong); }
.rv-card__icon {
  width: 52px; height: 52px; border-radius: 14px;
  display: grid; place-items: center;
  background: var(--rv-ink); color: #fff;
  box-shadow: var(--rv-shadow);
  margin-bottom: var(--rv-s-2);
}
.rv-card__icon svg { width: 24px; height: 24px; }
.rv-card h3 { font-size: var(--rv-fs-h3); }
.rv-card p { color: var(--rv-muted); margin: 0; }

/* Badge / chip */
.rv-chip {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: .78rem; font-weight: 600;
  padding: 6px 12px; border-radius: var(--rv-radius-pill);
  background: var(--rv-bg); border: 1px solid var(--rv-line); color: var(--rv-ink-2);
}
.rv-chip--growth { background: var(--rv-growth-soft); color: #047857; border-color: transparent; }
.rv-chip--risk { background: var(--rv-risk-soft); color: #B91C1C; border-color: transparent; }
.rv-chip--warn { background: var(--rv-warn-soft); color: #B45309; border-color: transparent; }
.rv-chip--info { background: var(--rv-info-soft); color: #4338CA; border-color: transparent; }

/* ==========================================================================
   Animații (scroll reveal + float + ripple)
   ========================================================================== */
[data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity .7s var(--rv-ease), transform .7s var(--rv-ease); }
[data-reveal].is-visible { opacity: 1; transform: none; }
[data-reveal-delay="1"] { transition-delay: .08s; }
[data-reveal-delay="2"] { transition-delay: .16s; }
[data-reveal-delay="3"] { transition-delay: .24s; }
[data-reveal-delay="4"] { transition-delay: .32s; }

@keyframes rv-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
.rv-float { animation: rv-float 6s ease-in-out infinite; }

@keyframes rv-ripple { 0% { transform: scale(.9); opacity: .55; } 100% { transform: scale(2.4); opacity: 0; } }

@keyframes rv-spin-slow { to { transform: rotate(360deg); } }

@keyframes rv-fade-up { from { opacity:0; transform: translateY(20px);} to { opacity:1; transform:none; } }
.rv-anim-fade-up { animation: rv-fade-up .8s var(--rv-ease) both; }

/* ==========================================================================
   Footer base
   ========================================================================== */
.rv-footer { background: var(--rv-ink); color: #fff; padding-block: var(--rv-s-6) var(--rv-s-4); }
.rv-footer a { color: rgba(255,255,255,.72); }
.rv-footer a:hover { color: #fff; }
.rv-footer__grid { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: var(--rv-s-4); }
.rv-footer__bottom { margin-top: var(--rv-s-4); padding-top: var(--rv-s-3); border-top: 1px solid rgba(255,255,255,.12); display:flex; flex-wrap:wrap; gap:var(--rv-s-2); justify-content: space-between; color: rgba(255,255,255,.5); font-size: var(--rv-fs-small); }
.rv-footer__col-title { color:#fff; font-size:.85rem; text-transform:uppercase; letter-spacing:.05em; opacity:.6; margin:0 0 14px; }
.rv-footer__links { list-style:none; padding:0; margin:0; display:grid; gap:10px; }
.rv-footer__tagline { color:rgba(255,255,255,.6); margin-top:16px; max-width:34ch; font-size:.9rem; line-height:1.6; }
.rv-footer__contact { color:rgba(255,255,255,.5); margin-top:12px; font-size:.82rem; line-height:1.8; }
.rv-footer__contact a { color:rgba(255,255,255,.5); text-decoration:none; }
.rv-footer__contact a:hover { color:#fff; }
.rv-footer__legal-strip { margin-top:28px; padding-top:16px; border-top:1px solid rgba(255,255,255,.08); font-size:.75rem; color:rgba(255,255,255,.38); line-height:1.8; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 980px) {
  :root { --rv-nav-h: 64px; }
  .rv-footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .rv-section { padding-block: var(--rv-s-6); }
  .rv-footer__grid { grid-template-columns: 1fr; gap: var(--rv-s-3); }
  .rv-btn { width: 100%; }
  .rv-hero__actions { flex-direction: column; }
}

/* Skip link a11y */
.rv-skip { position:absolute; left:-9999px; top:0; background:#fff; padding:12px 18px; border-radius:0 0 12px 0; z-index:1000; }
.rv-skip:focus { left:0; }

/* Notification badge in sidebar */
.rv-sidebar__link{position:relative}
.rv-sidebar__badge{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:#ef4444;color:#fff;font-size:.7rem;font-weight:800;min-width:18px;height:18px;border-radius:999px;display:flex;align-items:center;justify-content:center;padding:0 4px;line-height:1}