/* ============================================================
   FinCont.ro — foaie de stil
   ------------------------------------------------------------
   CULORILE SE SCHIMBĂ DINTR-UN SINGUR LOC: blocul :root de mai jos.
   Modifică --brand și --brand-dark și tot site-ul se adaptează.
   Câteva palete gata făcute găsești în README.md.
   ============================================================ */

/* ============================================================
   Fontul Inter — găzduit local, în folderul `fonts/`
   ------------------------------------------------------------
   NU se încarcă de la Google: site-ul nu face niciun apel către
   servere străine, deci IP-ul vizitatorului nu ajunge la nimeni.
   Fișierele sunt fonturi variabile: acoperă toate grosimile
   folosite (400, 500, 600, 700) din același fișier.
   `latin-ext` conține diacriticele românești (ă, â, î, ș, ț).
   Licență: SIL Open Font License 1.1 — vezi fonts/LICENSE.txt
   ============================================================ */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/inter-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
                 U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF,
                 U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
                 U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
                 U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* --- Culori de brand (SCHIMBĂ AICI) --- */
  --brand:        #1e5f8c;   /* albastru principal — butoane, accente */
  --brand-dark:   #14405f;   /* varianta închisă — hover, footer */
  --brand-light:  #e8f1f7;   /* fundal foarte deschis — carduri, secțiuni */
  --accent:       #c9974a;   /* auriu discret — detalii, sublinieri */

  /* --- Neutre --- */
  --ink:          #16202a;   /* text principal */
  --ink-soft:     #55636f;   /* text secundar */
  --line:         #dde4ea;   /* borduri */
  --line-strong:  #bccddb;   /* borduri accentuate — buton secundar, linia din hero */
  --bg:           #ffffff;
  --bg-alt:       #f6f8fa;

  /* --- Tipografie și spațiere --- */
  --font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --radius: 14px;
  --radius-sm: 9px;
  --shadow: 0 1px 2px rgba(22, 32, 42, .05), 0 8px 28px rgba(22, 32, 42, .07);
  --wrap: 1140px;
}

/* ---------------- Reset ---------------- */
*, *::before, *::after { box-sizing: border-box; }
/* Fără `scroll-behavior: smooth`, intenționat. Alunecarea lină arăta bine, dar
   pe un site de o singură pagină butoanele din meniu SUNT navigarea, iar animația
   se anulează la orice atingere a rotiței — vizitatorul rămânea la mijlocul paginii
   și credea că butonul nu merge. Saltul instantaneu nu poate fi întrerupt.
   Dacă vrei alunecarea înapoi, adaugă `scroll-behavior: smooth;` mai jos.

   `scroll-padding-top` rămâne: el ține conținutul să nu ajungă sub antetul fix. */
html { scroll-padding-top: 80px; }
body {
  margin: 0;
  font-family: var(--font);
  color: var(--ink);
  background: var(--bg);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3 { line-height: 1.2; margin: 0 0 .5em; letter-spacing: -.02em; }
h1 { font-size: clamp(2rem, 4.5vw, 3.15rem); font-weight: 700; }
h2 { font-size: clamp(1.6rem, 3vw, 2.15rem); font-weight: 700; }
h3 { font-size: 1.08rem; font-weight: 600; }
p  { margin: 0 0 1em; }
a  { color: var(--brand); text-decoration: none; }
a:hover { text-decoration: underline; }
img, svg { max-width: 100%; }
ul { margin: 0; padding: 0; list-style: none; }

.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: 22px; }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ---------------- Butoane ---------------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: .5rem; padding: .8rem 1.5rem;
  border-radius: 999px; border: 1px solid transparent;
  font-size: .95rem; font-weight: 600; cursor: pointer;
  transition: background .18s, color .18s, border-color .18s, transform .18s;
  text-decoration: none;
}
.btn:hover { text-decoration: none; transform: translateY(-1px); }
.btn-primary { background: var(--brand); color: #fff; }
.btn-primary:hover { background: var(--brand-dark); color: #fff; }
.btn-ghost {
  background: rgba(255, 255, 255, .92); color: var(--brand-dark);
  border-color: var(--line-strong); font-weight: 700;
}
.btn-ghost:hover { border-color: var(--brand); background: var(--brand-light); }
.btn-sm { padding: .55rem 1.1rem; font-size: .875rem; }
.btn-block { width: 100%; }

/* ---------------- Header ---------------- */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255, 255, 255, .9);
  backdrop-filter: saturate(1.6) blur(10px);
  border-bottom: 1px solid var(--line);
}
.header-inner { display: flex; align-items: center; justify-content: space-between; min-height: 68px; }
.brand { display: flex; align-items: center; gap: .6rem; color: var(--ink); font-weight: 700; font-size: 1.12rem; }
.brand:hover { text-decoration: none; }
.brand-mark {
  display: grid; place-items: center; width: 36px; height: 36px;
  border-radius: 10px; background: var(--brand); color: #fff;
  font-size: .82rem; letter-spacing: .02em;
}
/* Logo-ul din header — ajustează doar înălțimea, lățimea se calculează singură.
   Recomandat: PNG cu fundal transparent, minimum 120px înălțime, sau SVG. */
.brand-logo { display: block; height: 38px; width: auto; }
[hidden] { display: none !important; }
.brand-dot { color: var(--accent); }
.nav { display: flex; align-items: center; gap: 1.6rem; }
.nav > a { color: var(--ink-soft); font-size: .94rem; font-weight: 500; }
.nav > a:hover { color: var(--brand); text-decoration: none; }
.nav > a.btn { color: #fff; }

.nav-toggle {
  display: none; flex-direction: column; gap: 5px;
  background: none; border: 0; padding: 10px; cursor: pointer;
}
.nav-toggle span { display: block; width: 22px; height: 2px; background: var(--ink); border-radius: 2px; }

/* ---------------- Hero ---------------- */
.hero {
  background:
    radial-gradient(900px 420px at 78% -10%, var(--brand-light), transparent 65%),
    linear-gradient(180deg, var(--bg), var(--bg-alt));
  border-bottom: 1px solid var(--line);
}

/* POZA DE FUNDAL din hero.
   Nu se modifică nimic aici: pui `hero.jpg` în folder și clasa `cu-poza`
   se adaugă singură (vezi finalul din script.js). Fără fișier, rămâne degradeul de mai sus.
   Voalul alb de deasupra ține textul închis la culoare lizibil peste orice fotografie —
   dacă poza ta e deschisă și vrei să se vadă mai bine, coboară cele două valori .92 / .84. */
.hero.cu-poza {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .80), rgba(255, 255, 255, .70)),
    var(--poza-hero) center / cover no-repeat,
    radial-gradient(900px 420px at 78% -10%, var(--brand-light), transparent 65%),
    linear-gradient(180deg, var(--bg), var(--bg-alt));
}
.hero-inner { padding: clamp(3.5rem, 8vw, 6.5rem) 22px clamp(3rem, 6vw, 4.5rem); max-width: 860px; }
.eyebrow {
  font-size: .8rem; font-weight: 600; letter-spacing: .09em; text-transform: uppercase;
  color: var(--brand); margin-bottom: 1rem;
}
.lead { font-size: 1.1rem; color: var(--ink-soft); max-width: 60ch; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.8rem; }
.hero-stats {
  display: flex; flex-wrap: wrap; gap: 2.6rem;
  margin-top: 3rem; padding-top: 2rem; border-top: 2px solid var(--line-strong);
}
.hero-stats li { display: flex; flex-direction: column; }
.hero-stats strong { font-size: 1.75rem; font-weight: 700; color: var(--brand); line-height: 1.1; }
.hero-stats span { font-size: .9rem; font-weight: 500; color: var(--ink); }

/* ---------------- Secțiuni ---------------- */
/* Spațiul dintre secțiuni. Valoarea se adună de două ori între oricare două
   secțiuni (jos la una, sus la următoarea), deci fiecare rem tăiat aici
   scurtează pagina cu dublu. Coborâtă de la 6rem, pentru că între „Despre noi"
   și calculator se aduna prea mult gol. Nu coborî sub ~2.5rem: secțiunile
   încep să pară lipite. */
.section { padding: clamp(2.5rem, 5vw, 4rem) 0; }
.section-alt { background: var(--bg-alt); border-block: 1px solid var(--line); }
.section-tag {
  font-size: .78rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  color: var(--accent); margin-bottom: .55rem;
}
.section-title { max-width: 22ch; }
/* Marja de sub subtitlu e ultimul lucru dinaintea conținutului propriu-zis
   (formularul calculatorului, grila de contact). Coborâtă de la 2.6rem. */
.section-sub { color: var(--ink-soft); max-width: 65ch; margin-bottom: 1.6rem; }

/* ---------------- Despre noi ---------------- */
.about-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.about-text p { color: var(--ink-soft); }
.check-list { margin-top: 1.6rem; display: grid; gap: .7rem; }
.check-list li { position: relative; padding-left: 1.9rem; font-size: .96rem; }
.check-list li::before {
  content: ""; position: absolute; left: 0; top: .42em;
  width: 1.1rem; height: 1.1rem; border-radius: 50%;
  background: var(--brand-light);
  box-shadow: inset 0 0 0 1.5px var(--brand);
}
.check-list li::after {
  content: ""; position: absolute; left: .33rem; top: .68em;
  width: .42rem; height: .22rem;
  border-left: 2px solid var(--brand); border-bottom: 2px solid var(--brand);
  transform: rotate(-45deg);
}
.about-cards { display: grid; gap: 1rem; }
.card {
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 1.35rem 1.5rem;
  box-shadow: var(--shadow);
}
.card h3 { margin-bottom: .3rem; }
.card p { margin: 0; color: var(--ink-soft); font-size: .93rem; }

/* ---------------- Calculator ---------------- */
/* Unde se oprește pagina la apăsarea pe „Calculator tarife" sau „Calculează tariful".
   Valoarea e NEGATIVĂ intenționat: coboară punctul de oprire cu 65px față de
   marginea secțiunii, sărind peste o parte din spațiul gol de sus. Se văd astfel
   6 câmpuri din formular în loc de 4, fără să se piardă nimic din conținut.

   NU COBORÎ SUB -65px. Antetul fix are 69px înălțime și e semitransparent:
   de la -80px în jos, eticheta „Calculator tarife" ajunge pe sub el și se vede
   tăiată și neclară. La -65px eticheta stă exact la 80px, curat dedesubt.
   (Verificat prin măsurare: -50 și -65 sunt curate, -80 și -95 taie eticheta.) */
#calculator { scroll-margin-top: -65px; }

.calc { display: grid; grid-template-columns: 1.25fr .95fr; gap: 1.6rem; align-items: start; }

.calc-form {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem 1.4rem;
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 1.8rem; box-shadow: var(--shadow);
}
.field { display: flex; flex-direction: column; gap: .5rem; min-width: 0; border: 0; padding: 0; margin: 0; }
/* Fără regula asta, `display: flex` de mai sus învinge atributul `hidden`
   și câmpul ascuns din JavaScript ar rămâne vizibil. */
.field[hidden] { display: none; }
.field-full { grid-column: 1 / -1; }
.field > label, .field > legend {
  font-size: .9rem; font-weight: 600; color: var(--ink); padding: 0;
}
.hint { display: block; font-weight: 400; font-size: .8rem; color: var(--ink-soft); margin-top: .15rem; }

select {
  width: 100%; padding: .7rem .9rem; font: inherit; font-size: .93rem;
  color: var(--ink); background: var(--bg);
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%2355636f' d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right .9rem center; background-size: 11px;
  padding-right: 2.2rem; cursor: pointer;
}
select:focus-visible, input:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

.range-row { display: flex; align-items: center; gap: .9rem; }
input[type="range"] {
  flex: 1; appearance: none; height: 5px; border-radius: 4px; cursor: pointer;
  background: var(--line);
}
input[type="range"]::-webkit-slider-thumb {
  appearance: none; width: 20px; height: 20px; border-radius: 50%;
  background: var(--brand); border: 3px solid #fff; box-shadow: 0 0 0 1px var(--line);
}
input[type="range"]::-moz-range-thumb {
  width: 16px; height: 16px; border-radius: 50%;
  background: var(--brand); border: 3px solid #fff; box-shadow: 0 0 0 1px var(--line);
}
/* Căsuța în care se poate scrie direct numărul, lângă cursor */
.range-num {
  width: 4.6rem; flex: none; text-align: center;
  font: inherit; font-weight: 700; font-size: .95rem;
  color: var(--brand); background: var(--brand-light);
  border: 1px solid transparent; border-radius: var(--radius-sm);
  padding: .35rem .4rem; -moz-appearance: textfield;
}
.range-num::-webkit-outer-spin-button,
.range-num::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.range-num:hover { border-color: var(--line); }
.range-num:focus { border-color: var(--brand); background: var(--bg); }

/* Notele explicative de sub câmpuri */
.note {
  margin: 0; font-size: .8rem; line-height: 1.45;
  color: #8a5a00; background: #fff8e6;
  border-left: 3px solid #f0b429; border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  padding: .45rem .6rem;
}
.note-ok { color: var(--ink-soft); background: transparent; border-left: 0; padding: 0; }
.note[hidden] { display: none; }

/* Opțiuni scurte (0 / 1 / 2+) — butoane radio stilizate */
.opts { display: flex; flex-wrap: wrap; gap: .5rem; }
.opt { flex: 1 1 auto; position: relative; }
.opt input {
  position: absolute; opacity: 0; width: 0; height: 0;
}
.opt span {
  display: block; text-align: center; cursor: pointer;
  font-size: .9rem; font-weight: 600; color: var(--ink-soft);
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius-sm); padding: .55rem .7rem;
  transition: background .15s, border-color .15s, color .15s;
}
.opt span:hover { border-color: var(--brand); color: var(--brand); }
.opt input:checked + span {
  color: var(--brand); background: var(--brand-light); border-color: var(--brand);
}
.opt input:focus-visible + span { outline: 2px solid var(--brand); outline-offset: 2px; }

/* Rândul în care se scrie numărul de case de marcat */
.num-row { display: flex; align-items: center; justify-content: space-between; gap: .8rem; }
.num-row[hidden] { display: none; }
.num-label { font-size: .85rem; color: var(--ink-soft); }

.checks { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem 1.2rem; }
.check { display: flex; align-items: flex-start; gap: .6rem; font-size: .9rem; cursor: pointer; }
.check input { margin-top: .28rem; width: 16px; height: 16px; accent-color: var(--brand); cursor: pointer; }

/* --- Panoul de rezultat --- */
.calc-result {
  position: sticky; top: 88px;
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 1.7rem; box-shadow: var(--shadow);
}
.result-head {
  text-align: center; padding-bottom: 1.3rem; margin-bottom: 1.1rem;
  border-bottom: 1px dashed var(--line);
}
.result-label { font-size: .82rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-soft); margin-bottom: .35rem; }
.result-value { font-size: clamp(1.6rem, 3.4vw, 2.1rem); font-weight: 700; color: var(--brand); margin: 0; letter-spacing: -.02em; }
.result-value .dash { color: var(--line); font-weight: 400; }
.result-unit { font-size: .85rem; color: var(--ink-soft); margin: .2rem 0 0; }

.breakdown { width: 100%; border-collapse: collapse; font-size: .88rem; }
.breakdown td { padding: .42rem 0; vertical-align: top; color: var(--ink-soft); }
.breakdown td:last-child { text-align: right; white-space: nowrap; font-weight: 600; color: var(--ink); }
.breakdown tr.total td { border-top: 1px solid var(--line); padding-top: .7rem; color: var(--ink); font-weight: 700; }
.breakdown tr.muted td { color: var(--ink-soft); font-weight: 500; }

.onetime { margin-top: 1.2rem; padding-top: 1rem; border-top: 1px dashed var(--line); }
.onetime-title { font-size: .82rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-soft); margin-bottom: .4rem; }

.result-actions { display: grid; gap: .6rem; margin-top: 1.5rem; }
.disclaimer { font-size: .76rem; line-height: 1.55; color: var(--ink-soft); margin: 1.1rem 0 0; }

/* ---------------- Cerere de ofertă ---------------- */
.oferta {
  display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.6rem, 4vw, 3rem);
  align-items: start; margin-top: 1.6rem;
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); padding: clamp(1.5rem, 3vw, 2.2rem);
  box-shadow: var(--shadow);
  /* Unde se oprește pagina când se apasă „Cere ofertă" sau „Vreau o ofertă".
     90px ar lipi formularul de antet și ar ascunde complet calculatorul.
     Valoarea de mai jos lasă deasupra ultima parte a panoului de rezultat
     (butoanele și estimarea detaliată), ca legătura dintre ele să fie clară.
     Se adaptează la înălțimea ecranului: 28% din el, dar niciodată sub 120px
     (ecrane mici) și niciodată peste 260px (monitoare înalte), altfel ar
     împinge formularul prea jos. */
  scroll-margin-top: clamp(120px, 28vh, 260px);
}
.oferta-intro h3 { font-size: 1.35rem; }
.oferta-intro p { color: var(--ink-soft); font-size: .95rem; }
.oferta-nota {
  border-left: 3px solid var(--brand); padding-left: .9rem;
  font-size: .9rem !important; margin-bottom: 0;
}

.oferta-form { display: grid; gap: 1rem; }
.oferta-form .field { gap: .35rem; }
.oferta-form input[type="text"],
.oferta-form input[type="tel"] {
  width: 100%; padding: .72rem .9rem; font: inherit; font-size: .95rem;
  color: var(--ink); background: var(--bg);
  border: 1px solid var(--line); border-radius: var(--radius-sm);
}
.oferta-form input::placeholder { color: #9aa6b1; }
.oferta-form input.invalid { border-color: #c0392b; background: #fdf3f2; }
/* Câmpul obligatoriu din calculator (forma juridică) */
select.invalid {
  border-color: #c0392b; background-color: #fdf3f2;
  box-shadow: 0 0 0 1px #c0392b, 0 0 0 4px rgba(192, 57, 43, .12);
}
/* Scurtă mișcare când clientul sare peste forma juridică și trece la alte opțiuni. */
@keyframes atentieForma {
  0%, 100% { transform: translateX(0); }
  20%, 60%  { transform: translateX(-5px); }
  40%, 80%  { transform: translateX(5px); }
}
select.atentie { animation: atentieForma .42s ease; }
@media (prefers-reduced-motion: reduce) {
  select.atentie { animation: none; }
}
#errForma:empty { min-height: 0; }
.req { color: #c0392b; font-weight: 700; }
.err { margin: 0; font-size: .8rem; color: #c0392b; min-height: 1.05rem; }

.check-gdpr { font-size: .85rem; color: var(--ink-soft); line-height: 1.5; }
.honeypot { position: absolute; left: -9999px; opacity: 0; width: 0; height: 0; }

.oferta-lipsa {
  margin: 0; font-size: .82rem; color: var(--ink-soft); line-height: 1.45;
}
.oferta-lipsa:empty { display: none; }

#ofertaBtn:disabled {
  background: var(--line); color: #8d99a4; cursor: not-allowed; transform: none;
}
.oferta-status { margin: 0; font-size: .9rem; min-height: 1.2rem; }
.oferta-status.ok {
  color: #1e7a4d; background: #eaf7f0; border: 1px solid #bfe5d0;
  border-radius: var(--radius-sm); padding: .8rem 1rem; font-weight: 500;
}
.oferta-status.eroare {
  color: #a5342a; background: #fdf3f2; border: 1px solid #f0cfcb;
  border-radius: var(--radius-sm); padding: .8rem 1rem;
}

/* ---------------- Contact ---------------- */
.contact-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
.office {
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 1.7rem; box-shadow: var(--shadow);
}
.office-tag {
  font-size: .74rem; font-weight: 600; letter-spacing: .09em; text-transform: uppercase;
  color: var(--accent); margin-bottom: .35rem;
}
.office h3 { margin-bottom: 1.1rem; font-size: 1.15rem; }
.office-list { display: grid; gap: .85rem; }
.office-list li { display: flex; gap: .75rem; align-items: flex-start; font-size: .92rem; color: var(--ink-soft); }
.office-list svg {
  flex: 0 0 20px; width: 20px; height: 20px; margin-top: .12rem;
  fill: none; stroke: var(--brand); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
.office-list a { color: var(--ink); font-weight: 500; }

/* Secțiunea din dreapta numărului: cine răspunde și ce funcție are */
.office-list .tel-row { flex-wrap: wrap; align-items: center; row-gap: .3rem; }
.persoana {
  margin-left: auto; display: flex; flex-direction: column; text-align: right;
  padding-left: .75rem; border-left: 2px solid var(--brand-light); line-height: 1.3;
}
.persoana .nume { font-size: .82rem; font-weight: 600; color: var(--ink); }
.persoana .functie { font-size: .74rem; color: var(--ink-soft); }

.office-social .social-copy { font-size: .92rem; color: var(--ink-soft); }
.linkedin {
  display: inline-flex; align-items: center; gap: .6rem;
  padding: .65rem 1.1rem; border-radius: var(--radius-sm);
  background: var(--brand-light); color: var(--brand-dark); font-weight: 600; font-size: .92rem;
}
.linkedin:hover { background: var(--brand); color: #fff; text-decoration: none; }
.li-icon { width: 20px; height: 20px; fill: currentColor; stroke: none; }
.legal { margin-top: 1.5rem; padding-top: 1.1rem; border-top: 1px solid var(--line); font-size: .82rem; color: var(--ink-soft); }
.legal p { margin: 0 0 .2rem; }

/* ---------------- Pagina 404 (adresă greșită) ---------------- */
.eroare-page { text-align: center; }
.eroare-wrap { max-width: 620px; margin: 0 auto; }
.eroare-cod {
  font-size: clamp(4rem, 14vw, 7rem); font-weight: 700; line-height: 1;
  color: var(--brand-light); margin: 0 0 .2rem; letter-spacing: -.03em;
}
.eroare-page h1 { font-size: clamp(1.6rem, 4vw, 2.2rem); margin-bottom: .6rem; }
.eroare-page .lead { margin: 0 auto 2rem; }
.eroare-actiuni {
  display: flex; flex-wrap: wrap; gap: .7rem; justify-content: center;
  margin-bottom: 2.4rem;
}
.eroare-contact {
  font-size: .9rem; color: var(--ink-soft);
  padding-top: 1.4rem; border-top: 1px solid var(--line);
}
.eroare-contact a { color: var(--brand); font-weight: 600; white-space: nowrap; }

/* ---------------- Pagina de politici (text lung) ---------------- */
.legal-wrap { max-width: 780px; }
.legal-page h1 { font-size: clamp(1.8rem, 4vw, 2.5rem); margin-bottom: .3rem; }
.legal-page h2 {
  font-size: 1.2rem; margin-top: 2.4rem; padding-top: 1.4rem;
  border-top: 1px solid var(--line);
}
.legal-page p { color: var(--ink-soft); }
.legal-page .lead { color: var(--ink); font-size: 1.05rem; margin-bottom: 1rem; }
.legal-date { font-size: .85rem; color: var(--ink-soft); margin-bottom: 1.6rem; }
.legal-list { display: grid; gap: .55rem; margin: 0 0 1em; }
.legal-list li {
  position: relative; padding-left: 1.1rem;
  color: var(--ink-soft); font-size: .95rem; line-height: 1.6;
}
.legal-list li::before {
  content: ""; position: absolute; left: 0; top: .62em;
  width: 5px; height: 5px; border-radius: 50%; background: var(--brand);
}
.legal-list strong { color: var(--ink); }
.legal-back { margin-top: 2.6rem; }

/* Linkul către politică, de sub bifa GDPR */
.gdpr-link { font-size: .82rem; margin: -.4rem 0 0; padding-left: 1.6rem; }

/* ---------------- Footer ---------------- */
.site-footer { background: var(--brand-dark); color: #cfe0ec; padding: 1.8rem 0; font-size: .88rem; }
.footer-inner { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between; }
.footer-inner p { margin: 0; }
.footer-nav { display: flex; flex-wrap: wrap; gap: 1.4rem; }
.footer-nav a { color: #cfe0ec; }
.footer-nav a:hover { color: #fff; }

/* ---------------- Responsive ---------------- */
@media (max-width: 980px) {
  .about-grid, .calc, .oferta { grid-template-columns: 1fr; }
  .calc-result { position: static; }
  .contact-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .nav {
    display: none; position: absolute; inset: 68px 0 auto;
    flex-direction: column; align-items: stretch; gap: 0;
    background: var(--bg); border-bottom: 1px solid var(--line);
    padding: .5rem 22px 1.2rem; box-shadow: var(--shadow);
  }
  .nav.open { display: flex; }
  .nav > a { padding: .8rem 0; border-bottom: 1px solid var(--line); }
  .nav > a.btn { margin-top: .9rem; border-bottom: 0; justify-content: center; }
  .nav-toggle { display: flex; }
  .calc-form { grid-template-columns: 1fr; padding: 1.3rem; }
  .checks { grid-template-columns: 1fr; }
  .contact-grid { grid-template-columns: 1fr; }
  .hero-stats { gap: 1.8rem; }
}

@media (prefers-reduced-motion: reduce) {
  /* `scroll-behavior: auto` nu mai e nevoie aici: pagina nu mai alunecă pentru
     nimeni. Rămâne oprirea mișcării butoanelor la trecerea cu mouse-ul. */
  .btn:hover { transform: none; }
}