:root {
  --cerneala: #0d2b33;
  --text: #1d3640;
  --stins: #5b707a;
  --linie: #dbe6e8;
  --fond: #f6faf9;
  --alb: #ffffff;
  --rece: #2bb3b1;
  --rece-inchis: #167c7d;
  --rece-pal: #e3f4f3;
  --cald: #e2663c;
  --cald-pal: #fdeee8;
  --raza: 14px;
  --umbra: 0 1px 2px rgba(13, 43, 51, .06), 0 8px 28px rgba(13, 43, 51, .08);
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--fond);
  color: var(--text);
  font: 17px/1.6 var(--font);
  -webkit-font-smoothing: antialiased;
}
img, svg { max-width: 100%; }
a { color: var(--rece-inchis); }
a:hover { color: var(--cerneala); }
h1, h2, h3 { color: var(--cerneala); line-height: 1.15; letter-spacing: -.02em; margin: 0 0 .5em; }
h1 { font-size: clamp(2.1rem, 5vw, 3.4rem); font-weight: 800; }
h2 { font-size: clamp(1.6rem, 3.2vw, 2.25rem); font-weight: 750; }
h3 { font-size: 1.12rem; font-weight: 700; letter-spacing: -.01em; }
p { margin: 0 0 1em; }

.wrap { width: 100%; max-width: 1140px; margin: 0 auto; padding: 0 20px; }
.wrap-ingust { max-width: 760px; }

/* Butoane */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: .85em 1.4em; border-radius: 999px; border: 2px solid var(--cerneala);
  background: var(--cerneala); color: #fff; font: 600 1rem var(--font);
  text-decoration: none; cursor: pointer; transition: transform .15s, background .15s;
}
.btn:hover { background: #163f4a; color: #fff; transform: translateY(-1px); }
.btn-gol { background: transparent; color: var(--cerneala); }
.btn-gol:hover { background: var(--cerneala); color: #fff; }
.btn-mic { padding: .5em 1em; font-size: .92rem; }

/* Antet */
.sus { position: sticky; top: 0; z-index: 10; background: rgba(246, 250, 249, .9); backdrop-filter: blur(10px); border-bottom: 1px solid var(--linie); }
.sus-in { display: flex; align-items: center; justify-content: space-between; height: 64px; gap: 16px; }
.marca { display: inline-flex; align-items: center; gap: 8px; color: var(--cerneala); text-decoration: none; font-weight: 800; font-size: 1.35rem; letter-spacing: -.03em; }
.marca:hover { color: var(--cerneala); }
.marca-semn { color: var(--cerneala); }
.meniu { display: flex; align-items: center; gap: 22px; }
.meniu a:not(.btn) { color: var(--text); text-decoration: none; font-size: .95rem; font-weight: 500; }
.meniu a:not(.btn):hover { color: var(--rece-inchis); }

/* Erou */
.erou { padding: 64px 0 72px; background: radial-gradient(900px 420px at 85% 10%, var(--rece-pal), transparent 70%); }
.erou-in { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 56px; align-items: center; }
.eticheta { display: inline-block; font-size: .85rem; font-weight: 600; color: var(--rece-inchis); background: var(--rece-pal); padding: .3em .8em; border-radius: 999px; margin-bottom: 1.2em; }
.lead { font-size: 1.2rem; color: var(--stins); max-width: 34em; }
.erou-actiuni { display: flex; flex-wrap: wrap; gap: 12px; margin: 28px 0 24px; }
.bife { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px 22px; font-size: .95rem; color: var(--text); }
.bife li { position: relative; padding-left: 24px; }
.bife li::before { content: ""; position: absolute; left: 0; top: .45em; width: 14px; height: 8px; border-left: 2.5px solid var(--rece); border-bottom: 2.5px solid var(--rece); transform: rotate(-45deg); }

/* Panoul din erou */
.panou { margin: 0; background: var(--alb); border-radius: 20px; padding: 24px; box-shadow: var(--umbra); border: 1px solid var(--linie); position: relative; }
.panou-cap { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.panou-loc { display: block; font-weight: 700; color: var(--cerneala); }
.panou-sub { display: block; font-size: .85rem; color: var(--stins); }
.stare { font-size: .8rem; font-weight: 700; padding: .3em .75em; border-radius: 999px; white-space: nowrap; }
.stare-ok { color: var(--rece-inchis); background: var(--rece-pal); }
.panou-valoare { font-size: 3.6rem; font-weight: 800; color: var(--cerneala); letter-spacing: -.04em; line-height: 1; margin: 18px 0 10px; font-variant-numeric: tabular-nums; }
.panou-valoare span { font-size: 1.5rem; font-weight: 600; color: var(--stins); margin-left: 4px; }
.grafic { display: block; width: 100%; height: 130px; }
.grafic .banda { fill: var(--rece-pal); }
.grafic .prag { stroke: var(--rece); stroke-width: 1; stroke-dasharray: 4 4; opacity: .7; }
.grafic .linie { fill: none; stroke: var(--cerneala); stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.grafic .punct { fill: var(--rece); stroke: #fff; stroke-width: 2; }
.grafic-axa { display: flex; justify-content: space-between; font-size: .75rem; color: var(--stins); margin-top: 4px; }
.sms { margin: 18px -8px -8px auto; max-width: 300px; background: var(--cerneala); color: #e9f3f4; font-size: .9rem; line-height: 1.45; padding: 12px 14px; border-radius: 16px 16px 4px 16px; box-shadow: var(--umbra); }
.sms-de { display: block; font-size: .72rem; opacity: .65; margin-bottom: 2px; letter-spacing: .02em; }

/* Secțiuni */
.sectiune { padding: 80px 0; }
.sectiune h2 { margin-bottom: .8em; }
.sub-titlu { color: var(--stins); font-size: 1.1rem; margin-top: -.6em; margin-bottom: 1.8em; }
.problema { background: var(--alb); border-top: 1px solid var(--linie); border-bottom: 1px solid var(--linie); }
.grila-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.grila-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 48px; }
.card { background: var(--fond); border: 1px solid var(--linie); border-radius: var(--raza); padding: 26px; }
.card p { color: var(--stins); margin: 0; }
.problema .card { border-top: 3px solid var(--cald); }

.pasi { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; counter-reset: none; }
.pasi li { position: relative; }
.pasi p { color: var(--stins); }
.pas-nr { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--cerneala); color: #fff; font-weight: 800; font-size: 1.1rem; margin-bottom: 16px; }

.ce-primiti { background: var(--cerneala); color: #c9dadd; }
.ce-primiti h2 { color: #fff; }
.lista { list-style: none; padding: 0; margin: 0; }
.lista li { padding: 18px 0 18px 34px; border-bottom: 1px solid rgba(255, 255, 255, .1); position: relative; }
.lista li::before { content: ""; position: absolute; left: 4px; top: 1.65em; width: 12px; height: 12px; border-radius: 50%; background: var(--rece); box-shadow: 0 0 0 4px rgba(43, 179, 177, .2); }
.lista strong { color: #fff; display: block; margin-bottom: 2px; }

.etichete { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 1.6em; }
.etichete span { background: var(--alb); border: 1px solid var(--linie); padding: .55em 1.05em; border-radius: 999px; font-weight: 600; font-size: .95rem; color: var(--cerneala); }
.etichete span:first-child { background: var(--cerneala); color: #fff; border-color: var(--cerneala); }
.nota { color: var(--stins); font-size: .97rem; max-width: 46em; }

.pret { background: var(--alb); border-top: 1px solid var(--linie); }
.preturi { margin-bottom: 18px; }
.pret-card { display: flex; flex-direction: column; gap: 6px; }
.pret-et { font-size: .9rem; font-weight: 600; color: var(--stins); }
.pret-suma { font-size: 2.6rem; font-weight: 800; color: var(--cerneala); letter-spacing: -.03em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.pret-suma small { font-size: 1rem; font-weight: 600; color: var(--stins); letter-spacing: 0; }
.pret-card-tare { background: var(--rece-pal); border-color: #bfe5e3; }
.pilot { margin-top: 28px; padding: 20px 24px; border-radius: var(--raza); background: var(--cald-pal); border: 1px solid #f6d3c6; color: var(--text); }
.pilot strong { color: var(--cerneala); }

.intrebari details { border-bottom: 1px solid var(--linie); padding: 4px 0; }
.intrebari summary { cursor: pointer; list-style: none; padding: 18px 40px 18px 0; font-weight: 650; font-size: 1.08rem; color: var(--cerneala); position: relative; }
.intrebari summary::-webkit-details-marker { display: none; }
.intrebari summary::after { content: "+"; position: absolute; right: 6px; top: 12px; font-size: 1.6rem; font-weight: 400; color: var(--rece-inchis); transition: transform .2s; }
.intrebari details[open] summary::after { transform: rotate(45deg); }
.intrebari details p { color: var(--stins); padding-bottom: 8px; }

/* Formular */
.cerere { background: linear-gradient(180deg, var(--fond), var(--rece-pal)); }
.formular { background: var(--alb); border: 1px solid var(--linie); border-radius: 20px; padding: 32px; box-shadow: var(--umbra); }
.formular label { display: block; font-weight: 600; font-size: .92rem; color: var(--cerneala); margin-bottom: 16px; }
.formular input[type=text], .formular input[type=number], .formular select, .formular textarea {
  display: block; width: 100%; margin-top: 6px; padding: .75em .9em; font: 400 1rem var(--font); color: var(--text);
  background: var(--fond); border: 1.5px solid var(--linie); border-radius: 10px; transition: border-color .15s, background .15s;
}
.formular input:focus, .formular select:focus, .formular textarea:focus { outline: none; border-color: var(--rece); background: #fff; }
.formular .rand { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.formular .bifa { display: flex; align-items: center; gap: 10px; font-weight: 500; }
.formular .bifa input { width: 18px; height: 18px; accent-color: var(--rece-inchis); }
.formular .btn { width: 100%; margin-top: 6px; }
.ascuns { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.mic { font-size: .85rem; color: var(--stins); }
.alerta { background: var(--cald-pal); border: 1px solid #f6d3c6; border-radius: 10px; padding: 12px 16px; color: #8a3417; }

/* Pagini simple și legale */
.simplu { min-height: 52vh; }
.text-legal h2 { font-size: 1.3rem; margin-top: 1.8em; }
.text-legal p { color: var(--text); }

/* Subsol */
.jos { background: var(--cerneala); color: #a9bfc4; padding: 48px 0; font-size: .92rem; }
.jos-in { display: flex; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.jos a { color: #d7e7ea; }
.marca-jos, .marca-jos:hover { color: #fff; margin-bottom: 10px; }
.marca-jos .marca-semn { color: #fff; }
.jos-legal { text-align: right; }
.jos-linkuri { display: flex; gap: 18px; justify-content: flex-end; flex-wrap: wrap; }

@media (max-width: 900px) {
  .erou { padding: 40px 0 56px; }
  .erou-in { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .grila-3, .pasi { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .pasi { gap: 28px; }
  .grila-2 { grid-template-columns: minmax(0, 1fr); }
  .sectiune { padding: 56px 0; }
  .meniu a:not(.btn) { display: none; }
}
@media (max-width: 560px) {
  body { font-size: 16px; }
  .wrap { padding: 0 16px; }
  .formular { padding: 22px 18px; }
  .formular .rand { grid-template-columns: minmax(0, 1fr); }
  .panou { padding: 18px; }
  .panou-valoare { font-size: 3rem; }
  .sms { margin-right: 0; }
  .jos-legal { text-align: left; }
  .jos-linkuri { justify-content: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .btn { transition: none; }
}

/* Bara de acord pentru statistici */
#acord { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 50; max-width: 760px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 12px 20px; align-items: center; justify-content: space-between; padding: 16px 20px; background: var(--alb); border: 1px solid var(--linie); border-radius: var(--raza); box-shadow: 0 10px 40px rgba(13, 43, 51, .18); font-size: .92rem; }
#acord p { margin: 0; flex: 1 1 320px; color: var(--text); }
.acord-btn { display: flex; gap: 8px; flex-shrink: 0; }
.jos-linkuri button { background: none; border: 0; padding: 0; color: #d7e7ea; font: inherit; text-decoration: underline; cursor: pointer; }
