/* ============================================================
   MEGA COURSES — Light design system ("premium SaaS 2027")
   Alb curat · acuarelă abstractă · rețea de noduri · zero emoji
   Fonts: Manrope (display) + Onest (body) — ambele cu chirilic
   ============================================================ */

:root{
  /* Surfaces */
  --bg:#FFFFFF; --bg-soft:#FAFBFC; --bg-tint:#F5F7F9; --card:#FFFFFF;
  --line:#E8EBEF; --line-soft:#F0F2F5;
  /* Ink */
  --ink:#0C1116; --ink-2:#39414D; --muted:#69737F; --faint:#98A1AC;
  /* Accent — smarald profund (moștenirea MEGA, dar sobru) */
  --accent:#0E7C5A; --accent-deep:#0A5C43; --accent-tint:#EAF6F1; --accent-line:#BFE3D5;
  /* Watercolor (folosit doar în ilustrații) */
  --wc-peach:#FFD9C7; --wc-lilac:#E3DAFF; --wc-mint:#CFF3E6; --wc-sky:#D9E9FF; --wc-sand:#FFF0D6;
  /* Elevation */
  --sh-sm:0 1px 2px rgba(12,17,22,.04), 0 1px 3px rgba(12,17,22,.06);
  --sh:0 4px 12px rgba(12,17,22,.05), 0 2px 4px rgba(12,17,22,.04);
  --sh-lg:0 24px 48px rgba(12,17,22,.08), 0 8px 16px rgba(12,17,22,.04);
  --r:14px; --r-lg:20px; --r-xl:28px;
  --display:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --body:'Onest',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --maxw:1140px;
  --e:cubic-bezier(.16,1,.3,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0; background:var(--bg); color:var(--ink); font-family:var(--body);
  font-size:16.5px; line-height:1.68; -webkit-font-smoothing:antialiased; overflow-x:hidden;}
h1,h2,h3,h4{margin:0; font-family:var(--display); font-weight:800; letter-spacing:-.025em; line-height:1.12; color:var(--ink);}
p{margin:0;} a{color:var(--accent); text-decoration:none;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 28px;}

/* Type scale */
.h-display{font-size:clamp(33px,3.7vw,50px); letter-spacing:-.028em; line-height:1.1;}
.h-1{font-size:clamp(29px,3.4vw,44px);}
.h-2{font-size:clamp(23px,2.4vw,31px);}
.lead{font-size:clamp(17px,1.35vw,19.5px); color:var(--ink-2); line-height:1.62;}
.small{font-size:14.5px; color:var(--muted);}

/* Eyebrow — discret, fără emoji */
.eyebrow{display:inline-flex; align-items:center; gap:9px; font-family:var(--display);
  font-size:12.5px; font-weight:700; letter-spacing:.10em; text-transform:uppercase; color:var(--accent);}
.eyebrow::before{content:""; width:16px; height:1.5px; background:var(--accent); border-radius:2px; opacity:.5;}

/* Sections */
section{padding:96px 0;}
section.tint{background:var(--bg-soft); border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft);}
.sec-head{max-width:720px;}
.sec-head .h-1{margin:16px 0 0;}
.sec-head .lead{margin-top:18px;}
.center{text-align:center; margin-left:auto; margin-right:auto;}

/* Nav */
.nav{position:sticky; top:0; z-index:60; background:rgba(255,255,255,.82); backdrop-filter:saturate(180%) blur(14px); border-bottom:1px solid var(--line-soft);}
.nav-in{display:flex; align-items:center; flex-wrap:nowrap; gap:22px; padding:14px 28px; max-width:var(--maxw); margin:0 auto;}
.brand{display:flex; align-items:center; gap:10px; font-family:var(--display); font-weight:800; font-size:16px; letter-spacing:-.02em; color:var(--ink); flex-shrink:0; white-space:nowrap;}
.brand span{color:var(--accent);}
.nav-links{display:flex; gap:24px; margin-left:auto; font-size:15px; flex-shrink:0; white-space:nowrap;}
.nav-links a{color:var(--ink-2); font-weight:500;}
.nav-links a:hover{color:var(--ink);}
.nav .btn{flex-shrink:0; white-space:nowrap;}
.lang{display:flex; gap:1px; background:var(--bg-tint); border-radius:9px; padding:3px; flex-shrink:0;}
.lang a{padding:5px 10px; border-radius:6px; font-size:13px; font-weight:600; color:var(--muted);}
.lang a.on{background:#fff; color:var(--ink); box-shadow:var(--sh-sm);}

/* Buttons */
.btn{display:inline-flex; align-items:center; gap:9px; padding:14px 24px; border-radius:11px;
  font-family:var(--display); font-weight:700; font-size:15.5px; cursor:pointer; border:1px solid transparent;
  transition:transform .18s var(--e), box-shadow .18s var(--e), background .18s;}
.btn-primary{background:var(--accent); color:#fff; box-shadow:0 6px 16px rgba(14,124,90,.20);}
.btn-primary:hover{background:var(--accent-deep); transform:translateY(-1px); box-shadow:0 10px 22px rgba(14,124,90,.26);}
.btn-ghost{background:#fff; border-color:var(--line); color:var(--ink);}
.btn-ghost:hover{border-color:#D3D9E0; transform:translateY(-1px); box-shadow:var(--sh);}
.btn .ic{width:17px; height:17px;}

/* Cards */
.card{background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); padding:30px;
  transition:transform .22s var(--e), box-shadow .22s var(--e), border-color .22s;}
.card:hover{transform:translateY(-3px); box-shadow:var(--sh-lg); border-color:#DFE4EA;}
.grid{display:grid; gap:22px;}
.g2{grid-template-columns:repeat(2,1fr);} .g3{grid-template-columns:repeat(3,1fr);} .g4{grid-template-columns:repeat(4,1fr);}

/* Line-icon tile (înlocuiește emoji) */
.ic-tile{width:44px; height:44px; border-radius:12px; background:var(--accent-tint);
  display:flex; align-items:center; justify-content:center; color:var(--accent); margin-bottom:18px;}
.ic-tile svg{width:22px; height:22px; stroke:currentColor; stroke-width:1.6; fill:none; stroke-linecap:round; stroke-linejoin:round;}

/* Stats */
.stat b{display:block; font-family:var(--display); font-weight:800; font-size:clamp(28px,3vw,40px); letter-spacing:-.03em;}
.stat span{font-size:14px; color:var(--muted);}

/* Numbered index (fără emoji) */
.idx{font-family:var(--display); font-size:13px; font-weight:700; color:var(--accent); letter-spacing:.04em;}

/* Reveal */
.reveal>*{opacity:0; transform:translateY(14px);}
.reveal.in>*{opacity:1; transform:none; transition:opacity .7s var(--e), transform .7s var(--e);}
.reveal.in>*:nth-child(2){transition-delay:.06s} .reveal.in>*:nth-child(3){transition-delay:.12s}
.reveal.in>*:nth-child(4){transition-delay:.18s} .reveal.in>*:nth-child(5){transition-delay:.24s}
.reveal.in>*:nth-child(6){transition-delay:.30s}

/* Watercolor art */
.art{width:100%; height:auto; display:block;}
.wc-node{fill:#fff; stroke:var(--ink); stroke-opacity:.22; stroke-width:1.2;}
.wc-node-core{fill:var(--accent); stroke:none;}
.wc-edge{stroke:var(--ink); stroke-opacity:.14; stroke-width:1; fill:none;}
.wc-float{animation:wcfloat 9s ease-in-out infinite;}
.wc-float:nth-of-type(2n){animation-duration:11s; animation-delay:-2s;}
.wc-float:nth-of-type(3n){animation-duration:13s; animation-delay:-4s;}
@keyframes wcfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}

/* Footer */
footer{border-top:1px solid var(--line); padding:56px 28px; color:var(--muted); font-size:14.5px;}
footer a{color:var(--ink-2);}

/* Nav responsive — praguri reale, ca să nu se rupă între 680 și 1100 */
@media(max-width:1100px){
  .nav-links{display:none;}
  .lang{margin-left:auto;}
  .nav-in{gap:16px; padding:13px 22px;}
}
@media(max-width:560px){
  .nav .btn{padding:10px 14px; font-size:13.5px;}
  .brand{font-size:15px;}
  .nav-in{gap:12px; padding:12px 18px;}
}
/* sub 620px CTA-ul din nav nu mai încape lângă brand+limbi; cel din hero e imediat vizibil */
@media(max-width:620px){ .nav .btn{display:none;} }

@media(max-width:960px){ .g4{grid-template-columns:repeat(2,1fr);} .g3{grid-template-columns:repeat(2,1fr);} section{padding:72px 0;} }
@media(max-width:680px){
  .g2,.g3,.g4{grid-template-columns:1fr;} section{padding:56px 0;} body{font-size:16px;}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important; transition-duration:.001ms !important;}
  .reveal>*{opacity:1; transform:none;}
}