/* style.css · Ceemplify · v1.0.0 · 2026-10-12 */
/* ---------- fonturi ---------- */
@font-face { font-family: "Schibsted Grotesk"; font-style: normal; font-weight: 400 900; font-display: swap;
  src: url("fonts/schibsted-grotesk-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; }
@font-face { font-family: "Schibsted Grotesk"; font-style: normal; font-weight: 400 900; font-display: swap;
  src: url("fonts/schibsted-grotesk-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: "Source Sans 3"; font-style: normal; font-weight: 200 900; font-display: swap;
  src: url("fonts/source-sans-3-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; }
@font-face { font-family: "Source Sans 3"; font-style: normal; font-weight: 200 900; font-display: swap;
  src: url("fonts/source-sans-3-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; }

/* ---------- tokenuri ---------- */
:root {
  --navy: #011d56;
  --navy-text: #18305e;
  --auriu: #ebaa12;
  --auriu-2: #d4980f;
  --auriu-text: #b8820c;
  --bleu: #b3d9f4;
  --bleu-pal: #e7f2fb;
  --bleu-contur: #3f7db6;
  --bleu-text: #3870a3;
  --fond: #f4f7fb;
  --alb: #ffffff;
  --gri: #55627a;
  --gri-2: #8792a5;
  --linie: #dde3ec;
  --umbra-1: 0 1px 2px rgba(1,29,86,.06), 0 10px 28px -14px rgba(1,29,86,.22);
  --umbra-2: 0 2px 4px rgba(1,29,86,.08), 0 24px 44px -18px rgba(1,29,86,.32);
  --r: 14px;
  --titlu: "Schibsted Grotesk", "Segoe UI", -apple-system, "Helvetica Neue", Arial, sans-serif;
  --corp: "Source Sans 3", "Segoe UI", -apple-system, "Helvetica Neue", Arial, sans-serif;
  --masura: 70rem;
  --text: 44rem;
  --t: .2s cubic-bezier(.2,.7,.2,1);
}

/* ---------- bază ---------- */
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--alb); color: var(--navy); font-family: var(--corp); font-size: 17px; line-height: 1.55; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
a { color: inherit; }

[tabindex="-1"]:focus { outline: none; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--auriu-text); outline-offset: 3px; border-radius: 4px; }
p { margin: 0 0 1em; text-wrap: pretty; }
h1, h2, h3, h4 { margin: 0; font-family: var(--titlu); font-weight: 600; line-height: 1.15; letter-spacing: -0.02em; text-wrap: balance; }
h2 { font-size: clamp(26px, 3vw, 36px); margin-bottom: 28px; }
h3 { font-size: 24px; margin-bottom: 10px; }
img { max-width: 100%; display: block; }
.coloana { max-width: var(--masura); margin: 0 auto; padding: 0 40px; }
.text { max-width: var(--text); }
.sectiune { margin-top: 104px; }
.sectiune.strans { margin-top: 64px; }
.lovitura { color: var(--auriu-text); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ---------- antet ---------- */
.antet { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 22px 0 18px; border-bottom: 1px solid var(--linie); }
.antet .marca { display: flex; align-items: center; gap: 16px; text-decoration: none; }
.antet .logo { height: 26px; width: auto; }
.antet .marca-grup { display: flex; align-items: center; gap: 16px; }
.antet .nume { display: inline-flex; align-items: center; gap: 7px; font-family: var(--titlu); font-weight: 500; font-size: 15px; color: var(--gri); padding-left: 16px; border-left: 1px solid var(--linie); line-height: 1.2; text-decoration: none; transition: color var(--t); }
.antet .nume-in { flex: none; width: 18px; height: 17px; display: block; }
.antet .nume:focus-visible { color: var(--navy); text-decoration: underline; text-underline-offset: 4px; }
@media (hover: hover) { .antet .nume:hover { color: var(--navy); text-decoration: underline; text-underline-offset: 4px; } }
.antet nav { display: flex; gap: 28px; font-size: 15px; font-weight: 500; }
.antet nav a { color: var(--gri); text-decoration: none; position: relative; padding: 4px 0; transition: color var(--t); }
.antet nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--auriu); transform: scaleX(0); transform-origin: left; transition: transform .22s ease; }
.antet nav a[aria-current="page"] { color: var(--navy); }
@media (hover: hover) { .antet nav a:hover { color: var(--navy); } }
.antet nav a[aria-current="page"]::after { transform: scaleX(1); }
@media (hover: hover) { .antet nav a:hover::after { transform: scaleX(1); } }

/* ---------- butoane ---------- */
.buton { display: inline-flex; align-items: center; justify-content: center; height: 52px; padding: 0 26px; border-radius: 10px; background: var(--auriu); color: var(--navy); font-family: var(--titlu); font-weight: 600; font-size: 16px; text-decoration: none; border: 1px solid transparent; box-shadow: 0 1px 0 rgba(1,29,86,.08), 0 8px 18px -10px rgba(235,170,18,.9); transition: transform var(--t), box-shadow var(--t), background var(--t); white-space: nowrap; cursor: pointer; }
@media (hover: hover) { .buton:hover { background: var(--auriu-2); transform: translateY(-1px); box-shadow: 0 2px 0 rgba(1,29,86,.08), 0 14px 26px -12px rgba(235,170,18,.95); } }
.buton:active { transform: translateY(0); box-shadow: 0 1px 0 rgba(1,29,86,.08); }
.buton.secundar { height: 42px; padding: 0 18px; font-size: 15px; background: transparent; color: var(--navy); border-color: var(--navy); box-shadow: none; }
@media (hover: hover) { .buton.secundar:hover { background: var(--bleu-pal); transform: none; } }
.cta { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }

.nota { font-size: 14px; color: var(--gri); }

/* ---------- marcaje de lucru ---------- */
.lipsa { display: inline-block; font-family: var(--corp); font-weight: 500; font-size: .8em; line-height: 1.3; color: var(--navy); background: var(--bleu-pal); border: 1px dashed var(--bleu); border-radius: 6px; padding: 2px 8px; vertical-align: middle; letter-spacing: 0; text-wrap: pretty; }
.rezervat { border: 1px dashed var(--bleu); border-radius: var(--r); padding: 22px 24px; font-size: 15px; color: var(--gri); max-width: var(--text); background: var(--bleu-pal); }

/* ---------- STIL 1 · primul ecran ---------- */
.hero { padding: 76px 0 84px; max-width: 54rem; }
.hero .intro { font-size: 18px; color: var(--gri); margin: 0 0 20px; max-width: 40rem; line-height: 1.5; }
.hook { font-size: clamp(32px, 4.2vw, 52px); line-height: 1.08; letter-spacing: -0.025em; font-weight: 600; margin: 0 0 14px; }
.hero .lovitura { font-family: var(--titlu); font-weight: 600; font-size: clamp(24px, 3vw, 34px); line-height: 1.2; letter-spacing: -0.02em; margin: 0 0 26px; }
.hero .cta { margin-bottom: 30px; }
.operator { font-size: 15px; color: var(--gri); margin: 0; max-width: 40rem; }
.operator b { font-family: var(--titlu); font-weight: 600; color: var(--navy); }
.operator .link { margin-left: 6px; white-space: nowrap; }

.hero { animation: intrare .7s cubic-bezier(.2,.7,.2,1) both; }
@keyframes intrare { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

/* ---------- STIL 1 · nu sunt / sunt ---------- */


/* ---------- STIL 2 · banda ofertei ---------- */

.oferta { background: var(--fond); box-shadow: 0 0 0 100vmax var(--fond); clip-path: inset(0 -100vmax); padding: 72px 0; }
.oferta > * { max-width: var(--masura); margin-left: auto; margin-right: auto; }
.oferta .cap { text-align: center; margin-bottom: 36px; }
.oferta .cap h2 { margin-bottom: 8px; }
.oferta .cap p { margin: 0; color: var(--gri); font-size: 17px; }
.card { background: var(--alb); border: 1px solid var(--linie); border-radius: var(--r); box-shadow: var(--umbra-1); }
.link { color: var(--navy); font-weight: 500; font-size: 15px; text-decoration: none; border-bottom: 1px solid var(--bleu); transition: border-color var(--t); }
@media (hover: hover) { .link:hover { border-color: var(--navy); } }
.jos { margin-top: auto; padding-top: 22px; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }

/* ---------- STIL 2 · cardurile configuratorului ---------- */
@keyframes aparitie { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.buton.incepe { background: transparent; color: var(--navy); border: 2px solid var(--navy); box-shadow: none; padding: 0 30px; }
@media (hover: hover) { .buton.incepe:hover { background: var(--bleu-pal); transform: translateY(-1px); box-shadow: none; } }
.optiuni { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.optiuni.patru { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.optiune { display: flex; align-items: center; gap: 14px; width: 100%; text-align: left; font: inherit; font-size: 17px; line-height: 1.35; color: var(--navy); background: var(--alb); border: 1px solid var(--linie); border-radius: var(--r); box-shadow: var(--umbra-1); padding: 20px 22px; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, border-color var(--t); }
.optiune::before { content: ""; width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--bleu); flex: none; transition: all var(--t); }
@media (hover: hover) { .optiune:hover { transform: translateY(-2px); box-shadow: var(--umbra-2); border-color: var(--bleu); } }
@media (hover: hover) { .optiune:hover::before { background: var(--auriu); border-color: var(--auriu); } }
.card-arbore { padding: 30px 30px 28px; display: flex; flex-direction: column; }
.card-arbore h3 { font-size: 28px; margin-bottom: 12px; }
.card-arbore p { margin: 0 0 12px; color: var(--navy-text); }
.card-arbore dl { margin: 0 0 6px; display: grid; grid-template-columns: 9rem minmax(0, 1fr); gap: 10px 20px; }
.card-arbore dt { font-weight: 600; font-size: 14px; color: var(--gri); padding-top: 3px; }
.card-arbore dd { margin: 0; color: var(--navy-text); }
.card-arbore .conditie { margin: 14px 0 0; padding: 12px 16px; background: var(--bleu-pal); border-radius: 10px; font-size: 15px; color: var(--navy); }
.card-arbore .optiuni { margin-top: 18px; }
.card-arbore .optiune { box-shadow: none; background: var(--fond); }

.config .pas { display: none; }
.config .pas.activ { display: block; animation: aparitie .32s cubic-bezier(.2,.7,.2,1) both; }
.config .pornire { text-align: center; padding: 6px 0 2px; }
.config .pornire h3 { margin-bottom: 8px; }
.config .pornire p { max-width: 36rem; margin-left: auto; margin-right: auto; }
.config .pornire .buton { margin-top: 10px; }
.config .pornire .nota { margin: 12px auto 0; }
.config .intrebare { font-family: var(--titlu); font-weight: 600; font-size: 22px; margin: 0 0 16px; }
.config .optiuni { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.config .optiune { box-shadow: none; background: var(--fond); }
.config .inapoi { margin-top: 12px; background: none; border: 0; padding: 12px 0; min-height: 44px; min-width: 44px; text-align: left; font: inherit; font-size: 15px; color: var(--gri); cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }
@media (hover: hover) { .config .inapoi:hover { color: var(--navy); } }
.config h3 { font-size: 26px; }

.rez-cap { margin-bottom: 18px; }
.rez-cap p { margin-bottom: 12px; }
.pastile { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.pastile li { font-size: 13px; line-height: 1.3; color: var(--navy); background: var(--bleu-pal); border: 1px solid var(--bleu); border-radius: 999px; padding: 5px 12px; }

.carduri-rol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.carduri-rol > li[hidden] { display: none; }
.carduri-rol b { font-family: var(--titlu); font-weight: 600; font-size: 16px; color: var(--navy); line-height: 1.2; }
.carduri-rol p { margin: 0; font-size: 14px; line-height: 1.45; color: var(--navy-text); }
.carduri-rol .text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.carduri-rol > li.erou { display: flex; align-items: center; gap: 18px; padding: 22px 22px; border: 1px solid var(--linie); border-radius: 12px; background: var(--alb); }
.carduri-rol > li.erou b { font-size: 22px; }
.carduri-rol > li.erou p { font-size: 15px; }
.carduri-rol .robot { position: relative; width: 72px; height: 72px; flex: none; display: block; }
.carduri-rol .robot > svg { width: 72px; height: 72px; display: block; }
.carduri-rol .robot .insigna { position: absolute; right: -6px; bottom: -2px; }
.carduri-rol .insigna { width: 28px; height: 28px; border-radius: 50%; background: var(--auriu); display: grid; place-items: center; box-shadow: 0 0 0 2px var(--alb); flex: none; }
.carduri-rol .insigna svg { width: 15px; height: 15px; display: block; }
.carduri-rol > li.eu { background: var(--bleu-pal); border-color: var(--bleu); }
.carduri-rol > li.eu .poza { width: 72px; height: 72px; border-radius: 50%; overflow: hidden; flex: none; box-shadow: 0 0 0 2px var(--auriu); }
.carduri-rol > li.eu .poza img { width: 100%; height: 100%; object-fit: cover; display: block; }
.carduri-rol > li.eu b { color: var(--navy); }
.carduri-rol > li:not(.erou) { grid-column: 1 / -1; display: grid; grid-template-columns: 28px 12rem minmax(0, 1fr); gap: 4px 16px; align-items: start; padding: 12px 4px; border-top: 1px solid var(--linie); }

.carduri-rol > li[hidden], .carduri-rol > li.erou[hidden] { display: none !important; }
.carduri-rol > li:not(.erou) .text { display: contents; }
.carduri-rol > li:not(.erou) b { padding-top: 4px; }
.carduri-rol > li:not(.erou) p { padding-top: 5px; }
.carduri-rol > li.erou + li:not(.erou), .carduri-rol > li.eu + li:not(.erou) { margin-top: 8px; }
.config .conditie { margin-top: 18px; }

/* ---------- STIL 1 · portofoliul de clienți ---------- */
.rulant { display: block; width: 100%; min-width: 0; padding: 10px 0; border-radius: 6px; cursor: pointer; }
.rulant-pista { display: flex; overflow: hidden; width: 100%; min-width: 0;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.rulant .portofoliu { flex: none; display: flex; flex-wrap: nowrap; align-items: center; gap: 0 64px; padding: 0 64px 0 0; margin: 0; list-style: none; animation: rulare 38s linear infinite; }
.rulant:focus .portofoliu, .rulant:focus-within .portofoliu, .rulant:active .portofoliu, .rulant.oprita .portofoliu { animation-play-state: paused; }
@media (hover: hover) { .rulant:hover .portofoliu { animation-play-state: paused; } }
.pauza-banda { justify-self: end; min-height: 44px; padding: 0 2px; background: none; border: 0; font: inherit; font-size: 14px; color: var(--gri); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
@media (hover: hover) { .pauza-banda:hover { color: var(--navy); } }
.pauza-banda[hidden] { display: none; }
.dovada .bloc.bloc-portofoliu > .pauza-banda.pauza-banda { grid-column: 1; }
.rulant:focus-visible { outline: 2px solid var(--auriu-text); outline-offset: 4px; border-radius: 4px; }
@keyframes rulare { from { transform: translateX(0); } to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) {
  .rulant { cursor: default; }
  .rulant-pista { -webkit-mask-image: none; mask-image: none; flex-wrap: wrap; overflow: visible; }
  .rulant .portofoliu { animation: none; flex: 1 1 100%; min-width: 0; flex-wrap: wrap; gap: 18px 40px; padding-right: 0; }
  .rulant .portofoliu[aria-hidden="true"] { display: none; }
}
.portofoliu img { height: 28px; width: auto; display: block; filter: grayscale(1) opacity(.62); transition: filter var(--t); }
@media (hover: hover) { .portofoliu li:hover img { filter: grayscale(1) opacity(1); } }

/* ---------- STIL 1 · dovada ---------- */
.dovada .bloc { display: grid; grid-template-columns: 12rem minmax(0, 1fr); gap: 8px 32px; padding: 24px 0; border-top: 1px solid var(--linie); max-width: 58rem; }
.dovada .bloc > :not(.eticheta):not(.rulant) { grid-column: 2; }
.dovada .bloc.bloc-portofoliu { max-width: none; grid-template-columns: 1fr; border-top: 1px solid var(--navy); padding: 18px 0; }

/* ---------- competențe ---------- */
.competente { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.competente .bloc-c { border-top: 1px solid var(--navy); padding-top: 18px; display: flex; flex-direction: column; }
.competente .verb { font-family: var(--titlu); font-weight: 600; font-size: clamp(28px, 3.2vw, 38px); line-height: 1; letter-spacing: -0.025em; margin: 0 0 14px; }
.competente p { margin: 0 0 6px; color: var(--navy-text); font-size: 16px; }
.competente .cifre { margin-top: auto; padding-top: 14px; border-top: 1px solid var(--linie); font-size: 15px; color: var(--navy); line-height: 1.5; }
.competente .cifre b { font-weight: 600; }
.roluri { list-style: none; margin: 0; padding: 0; max-width: 54rem; }
.roluri li { display: grid; grid-template-columns: 11rem minmax(0, 1fr); gap: 8px 28px; padding: 20px 0; border-top: 1px solid var(--linie); }
.roluri li:first-child { border-top: 1px solid var(--navy); }
.roluri .cand { font-family: var(--titlu); font-weight: 600; }
.roluri .cand small { display: block; font-family: var(--corp); font-weight: 400; font-size: 14px; color: var(--gri); margin-top: 2px; font-variant-numeric: tabular-nums; }
.roluri p { margin: 0; color: var(--navy-text); }

/* ---------- STIL 2 · planurile S / M / L ---------- */
.planuri { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.plan { padding: 28px 26px 26px; display: flex; flex-direction: column; }
.plan h3 { font-size: 26px; margin-bottom: 6px; }
.plan .pret { font-family: var(--titlu); font-size: 20px; font-weight: 600; margin: 0 0 18px; }
.plan .pret small { display: block; font-family: var(--corp); font-size: 13px; color: var(--gri); font-weight: 400; margin-top: 2px; }
.plan dl { margin: 0 0 22px; flex: 1; font-size: 15px; }
.plan dt { font-weight: 600; font-size: 13px; color: var(--gri); border-top: 1px solid var(--linie); padding-top: 10px; margin-top: 10px; }
.plan dl > dt:first-child, .plan dl > div:first-child > dt { border-top: 0; margin-top: 0; padding-top: 0; }
.plan dd { margin: 2px 0 0; color: var(--navy-text); }
.plan .buton { width: 100%; }
.bife { list-style: none; margin: 0 0 20px; padding: 0; font-size: 15px; color: var(--navy-text); }
.bife li { padding: 8px 0 8px 26px; border-top: 1px solid var(--linie); position: relative; }
.bife li:first-child { border-top: 0; }
.bife li::before { content: ""; position: absolute; left: 3px; top: 15px; width: 10px; height: 5px; border-left: 2px solid var(--auriu); border-bottom: 2px solid var(--auriu); transform: rotate(-45deg); }

/* ---------- STIL 1 · treptele, detalii ---------- */

/* ---------- STIL 2 · cardul produsului ---------- */
.card-produs { padding: 32px 30px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 44px; }
.card-produs h3 { font-size: 15px; color: var(--gri); margin-bottom: 10px; }
.card-produs .bife { margin-bottom: 0; }
.card-produs .pret-bloc { grid-column: 1 / -1; border-top: 1px solid var(--linie); padding-top: 24px; display: flex; justify-content: center; }
.echipa { margin-top: 18px; }
.echipa svg { width: 100%; height: auto; display: block; }
.echipa figcaption { font-size: 13px; color: var(--gri); margin-top: 8px; }

/* ---------- subsol ---------- */

.subsol { margin-top: 104px; background: var(--navy); color: rgba(255,255,255,.78); padding: 48px 0 56px; font-size: 14px; }
.subsol .in { max-width: var(--masura); margin: 0 auto; padding: 0 40px; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 32px; align-items: start; }
.subsol nav a, .subsol a.link { display: inline-block; padding: 11px 0; min-width: 44px; }
.subsol .logo { height: 24px; width: auto; margin-bottom: 18px; }
.subsol p { margin: 0 0 6px; }
.subsol a { color: var(--alb); }
.subsol .lipsa { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.3); color: var(--alb); }
.subsol nav { display: flex; gap: 22px; margin-bottom: 14px; flex-wrap: wrap; }
.subsol nav a { text-decoration: none; }
@media (hover: hover) { .subsol nav a:hover { text-decoration: underline; text-underline-offset: 4px; } }

/* ---------- telefon ---------- */
@media (max-width: 800px) {
  .coloana { padding: 0 20px; }
  .sectiune { margin-top: 72px; }
  .sectiune.strans { margin-top: 48px; }
  .antet { padding: 8px 0 4px; gap: 0 14px; flex-wrap: wrap; }
  .antet .nume { display: none; }
  .antet .marca { padding: 11px 0; }
  .antet .logo { height: 22px; }
  .antet nav { width: 100%; gap: 20px; font-size: 15px; }
  .antet nav a { white-space: nowrap; padding: 12px 0; min-width: 44px; display: inline-block; }

  .subsol .in { padding: 0 20px; }
  .hero { padding: 44px 0 56px; }
  .hook { font-size: clamp(30px, 8.4vw, 38px); }
  .hero .lovitura { font-size: clamp(21px, 6vw, 26px); }
  .buton { width: 100%; }
  .buton.secundar { width: auto; }
  .oferta { padding-top: 48px; padding-bottom: 56px; }
  .oferta .cap { text-align: left; }
  .optiuni, .optiuni.patru, .planuri, .card-produs, .competente { grid-template-columns: 1fr; }
  .card-arbore { padding: 22px 20px; }
  .card-arbore dl { grid-template-columns: 1fr; gap: 2px 0; }
  .config .optiuni { grid-template-columns: 1fr; }
  .carduri-rol { grid-template-columns: 1fr; }
  .carduri-rol > li:not(.erou) { grid-template-columns: 28px minmax(0, 1fr); }
  .carduri-rol > li:not(.erou) p { grid-column: 2; padding-top: 0; }
  .card-arbore dd { margin-bottom: 10px; }
  .plan, .card-produs { padding: 22px 20px; }
  .dovada .bloc { grid-template-columns: 1fr; gap: 6px; }
  .dovada .bloc > :not(.eticheta):not(.rulant) { grid-column: 1; }
  .roluri li { grid-template-columns: 1fr; gap: 4px; }
  .subsol .in { grid-template-columns: 1fr; }
}

/* ---------- STIL 1 · primul ecran al landing-ului: „Operatorul" ---------- */
.hero-operator { padding-bottom: 56px; }
.kicker { display: flex; align-items: center; gap: 12px; font-family: var(--titlu); font-weight: 500; font-size: 15px; color: var(--gri); margin: 0 0 22px; }
.kicker::before { content: ""; width: 28px; height: 1px; background: var(--navy); flex: none; }
.titlu-mare { font-size: clamp(40px, 6vw, 76px); line-height: 1.02; letter-spacing: -0.03em; font-weight: 600; margin: 0 0 16px; max-width: 14em; }
.hero-operator .lovitura { font-size: clamp(28px, 3.6vw, 44px); line-height: 1.1; letter-spacing: -0.025em; margin: 0 0 24px; }
.hero-operator .paragraf { font-size: 19px; line-height: 1.5; color: var(--navy-text); max-width: 36rem; margin: 0 0 30px; }
.hero-operator .cta { margin-bottom: 0; }

.cifre-banda { list-style: none; margin: 0; padding: 24px 0 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; border-top: 1px solid var(--linie); }
.cifre-banda li { color: var(--gri); font-size: 15px; line-height: 1.35; }
.cifre-banda li + li { border-left: 1px solid var(--linie); padding-left: 24px; }
.cifre-banda span { display: block; }
.cifre-banda .mare { font-family: var(--titlu); font-weight: 600; font-size: clamp(22px, 2.4vw, 30px); line-height: 1.1; letter-spacing: -0.02em; margin-bottom: 4px; }

/* ---------- STIL 1 · ce știu să fac: titlul la stânga , cinci linii la dreapta, un buton ---------- */
.stiu { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 0 56px; align-items: start; }
.stiu-cap { position: sticky; top: 28px; }
.stiu-cap h2 { margin-bottom: 12px; }
.stiu-cap p { color: var(--gri); font-size: 17px; margin: 0; max-width: 18rem; }
.stiu-lista { list-style: none; margin: 0; padding: 0; }
.stiu-lista li { padding: 22px 0 20px; border-top: 1px solid var(--linie); }
.stiu-lista li:first-child { border-top: 1px solid var(--navy); }
.stiu-lista h3 { font-size: clamp(20px, 2vw, 24px); margin-bottom: 6px; }
.stiu-lista p { margin: 0; color: var(--navy-text); font-size: 16px; }
.stiu-lista .link { margin-left: 4px; white-space: nowrap; }
.stiu-jos { grid-column: 2; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; padding-top: 26px; border-top: 1px solid var(--linie); }
.stiu-jos .nota { margin: 0; max-width: 26rem; }

/* ---------- STIL 2 · întrebarea simplă, două ieșiri egale ---------- */
.intrebare-simpla { max-width: 60rem; text-align: center; }
.intrebare-simpla h2 { margin-bottom: 30px; }
.iesiri { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; text-align: left; }
.iesire { display: flex; flex-direction: column; min-height: 232px; padding: 32px 30px 28px; text-decoration: none; color: var(--navy); transition: transform .2s ease, box-shadow .2s ease, border-color var(--t); }
@media (hover: hover) { .iesire:hover { transform: translateY(-3px); box-shadow: var(--umbra-2); border-color: var(--bleu); } }
.iesire:focus-visible { border-radius: var(--r); }
.iesire-titlu { font-family: var(--titlu); font-weight: 600; font-size: clamp(22px, 2.3vw, 28px); line-height: 1.15; letter-spacing: -0.02em; text-wrap: balance; }
.iesire-text { margin-top: 12px; font-size: 16px; color: var(--navy-text); }
.iesire-sageata { margin-top: auto; align-self: flex-start; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--navy); display: grid; place-items: center; transition: background var(--t), color var(--t); }
.iesire-text { margin-bottom: 28px; }
@media (hover: hover) { .iesire:hover .iesire-sageata { background: var(--navy); color: var(--alb); } }

/* ---------- banda de clienți: celula text pentru Oilright, până vine logo-ul ---------- */
.portofoliu .lipsa { font-size: 12px; white-space: nowrap; }

/* ---------- STIL 1 · testimoniale: grilă fără JavaScript, carusel cu JavaScript ---------- */
.carusel-cap { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.carusel-cap h2 { margin: 0; }
.sageti { display: flex; gap: 10px; flex: none; }
.sageti[hidden], .puncte[hidden] { display: none; }
.sageata { width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--navy); background: var(--alb); color: var(--navy); display: grid; place-items: center; cursor: pointer; padding: 0; transition: background var(--t), color var(--t), border-color var(--t); }
@media (hover: hover) { .sageata:hover { background: var(--bleu-pal); } }
.sageata[aria-disabled="true"] { cursor: default; background: var(--alb); color: rgba(1, 29, 86, .32); border-color: rgba(1, 29, 86, .32); }
.sageata:focus-visible { border-radius: 50%; }
.carusel { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.carusel-activ .carusel { display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; padding: 4px; margin: -4px; scroll-padding: 0 4px; }
.carusel-activ .carusel::-webkit-scrollbar { display: none; }
.carusel-activ .testimonial { flex: 0 0 calc((100% - 40px) / 3); scroll-snap-align: start; }
.testimonial { background: var(--alb); border: 1px solid var(--linie); border-radius: var(--r); padding: 26px 26px 22px; display: flex; flex-direction: column; min-width: 0; }
.testimonial:focus-visible { outline: 2px solid var(--auriu-text); outline-offset: 1px; }
.testimonial .marcaj { margin: 0 0 14px; }
.testimonial .spus { font-size: 15px; line-height: 1.55; color: var(--navy-text); margin: 0 0 20px; }
.testimonial .cine { margin: auto 0 0; padding-top: 14px; border-top: 1px solid var(--linie); font-size: 13px; color: var(--gri); }
.testimonial.liber { border-style: dashed; border-color: var(--bleu); }
.testimonial.liber { min-height: 300px; justify-content: space-between; }
.testimonial.liber .spus { margin: 0; }
.puncte { display: flex; justify-content: center; gap: 0; margin-top: 14px; }
.punct { width: 44px; height: 44px; border: 0; background: none; padding: 0; cursor: pointer; display: grid; place-items: center; }
.punct::before { content: ""; width: 8px; height: 8px; border-radius: 4px; background: var(--gri-2); transition: width var(--t), background var(--t); }
@media (hover: hover) { .punct:hover::before { background: var(--gri); } }
.punct[aria-current="true"]::before { width: 24px; background: var(--navy); }

/* ---------- subsolul, partea de sus: banda „În presă", pe fundal deschis ---------- */
.presa { margin-top: 104px; background: var(--fond); border-top: 1px solid var(--linie); padding: 40px 0 44px; }
.presa .in { max-width: var(--masura); margin: 0 auto; padding: 0 40px; }
.presa h2 { font-size: 15px; font-weight: 600; letter-spacing: 0; color: var(--gri); margin: 0 0 20px; }
.presa-lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 30px 32px; }
.presa + .subsol { margin-top: 0; }

/* ---------- /produs: hook-ul ca prim ecran ---------- */
.hero-produs { animation: none; padding-bottom: 8px; }
.oferta .cap-produs { text-align: left; max-width: var(--masura); margin-bottom: 28px; }
.cap-produs h2 { font-size: clamp(30px, 3.6vw, 44px); margin-bottom: 10px; }
.oferta .cap-produs .subtitlu { font-size: clamp(18px, 2vw, 21px); color: var(--navy-text); margin: 0; max-width: 40rem; line-height: 1.4; }
.oferta .cap-produs .lovitura { color: var(--auriu-text); font-family: var(--titlu); font-weight: 600; font-size: clamp(22px, 2.6vw, 30px); letter-spacing: -0.02em; line-height: 1.2; margin: 12px 0 0; }

@media (max-width: 800px) {
  .hero-operator { padding-bottom: 40px; }
  .titlu-mare { font-size: clamp(34px, 10vw, 44px); }
  .hero-operator .lovitura { font-size: clamp(24px, 7vw, 30px); }
  .hero-operator .paragraf { font-size: 18px; }
  .cifre-banda { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 16px; }
  .cifre-banda li + li { border-left: 0; padding-left: 0; }
  .cifre-banda .mare { font-size: 22px; }
  .stiu { grid-template-columns: 1fr; }
  .stiu-cap { position: static; margin-bottom: 24px; }
  .stiu-jos { grid-column: 1; }
  .iesiri { grid-template-columns: 1fr; gap: 14px; }
  .iesire { min-height: 0; padding: 24px 22px 22px; }
  .intrebare-simpla { text-align: left; }
  .carusel { grid-template-columns: 1fr; }
  .carusel-activ .testimonial { flex: 0 0 100%; }
  .carusel-cap { align-items: center; }
  .sageata { width: 44px; height: 44px; }
  .presa { margin-top: 72px; padding: 32px 0 36px; }
  .presa .in { padding: 0 20px; }

  .presa-lista { grid-template-columns: 1fr; gap: 18px; }
}

/* ---------- hero pe două rânduri ---------- */
.titlu-mare { font-size: clamp(36px, 4.7vw, 60px); line-height: 1.05; max-width: none; }
.titlu-mare .rand { display: block; }
.hero-operator { padding-top: 56px; max-width: none; }
/* ---------- configurator: după „Înapoi", pasul vine sub marginea de sus ---------- */
.config .pas { scroll-margin-top: 24px; }

@media (max-width: 800px) {
  .titlu-mare { font-size: clamp(30px, 8.6vw, 38px); }
  .hero-operator { padding-top: 36px; }
}

/* ---------- În presă: doar logo-urile, fiecare e linkul ---------- */
.presa-logo-uri { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.presa-logo-uri li { display: flex; }
.presa-logo-uri a { display: flex; align-items: center; justify-content: center; min-height: 56px; min-width: 44px; border-radius: 6px; }
.presa-logo-uri img { height: auto; width: auto; max-height: var(--h); max-width: 100%; object-fit: contain; filter: grayscale(1) opacity(.6); transition: filter var(--t); }
.presa-logo-uri img.alb { filter: brightness(0) opacity(.55); }
.presa-logo-uri a:focus-visible img { filter: none; }
@media (hover: hover) { .presa-logo-uri a:hover img { filter: none; } }
.presa-logo-uri a:focus-visible img.alb { filter: brightness(0) opacity(.9); }
@media (hover: hover) { .presa-logo-uri a:hover img.alb { filter: brightness(0) opacity(.9); } }
@media (max-width: 800px) {
  .presa-logo-uri { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 8px 0; }
  .presa-logo-uri li { grid-column: span 3; justify-content: center; }
  .presa-logo-uri li:nth-child(n+5) { grid-column: span 4; }
  .presa-logo-uri a { min-height: 48px; padding: 0 6px; width: 100%; }
  .presa-logo-uri img { max-height: var(--hm, calc(var(--h) * .72)); }
}

/* ---------- În presă: nouă publicații, 5 + 4 pe laptop, 3 × 3 pe telefon ---------- */
.presa-logo-uri.noua { display: grid; grid-template-columns: repeat(20, minmax(0, 1fr)); gap: 12px 0; }
.presa-logo-uri.noua li { grid-column: span 4; justify-content: center; }
.presa-logo-uri.noua li:nth-child(n+6) { grid-column: span 5; }
.presa-logo-uri.noua a { width: 100%; padding: 0 10px; text-decoration: none; }
.presa-logo-uri img.fond-alb { mix-blend-mode: multiply; }
.presa-logo-uri img.deschis { filter: url(#gri-inchis) opacity(.7); }
.filtre { position: absolute; width: 0; height: 0; overflow: hidden; }
.presa-logo-uri a:focus-visible img.deschis { filter: none; }
@media (hover: hover) { .presa-logo-uri a:hover img.deschis { filter: none; } }
.presa-logo-uri .nume-presa { font-family: var(--titlu); font-weight: 700; font-size: 20px; letter-spacing: -0.02em; color: var(--navy); filter: grayscale(1) opacity(.6); white-space: nowrap; }
.presa-logo-uri a:focus-visible .nume-presa { filter: none; }
@media (hover: hover) { .presa-logo-uri a:hover .nume-presa { filter: none; } }
.presa-logo-uri .lipsa { font-size: 11px; margin-left: 6px; white-space: nowrap; }
.presa-logo-uri a:has(.nume-presa) { flex-wrap: wrap; gap: 2px 0; }
@media (max-width: 800px) {
  .presa-logo-uri.noua { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px 0; }
  .presa-logo-uri.noua li, .presa-logo-uri.noua li:nth-child(n+6) { grid-column: auto; }
  .presa-logo-uri.noua a { padding: 0 8px; }
}

/* ---------- primul ecran fără paragraf ---------- */
.hero-operator { padding-top: 72px; padding-bottom: 64px; }
.hero-operator .lovitura { margin-bottom: 32px; }
@media (max-width: 800px) {
  .hero-operator { padding-top: 40px; padding-bottom: 44px; }
  .hero-operator .lovitura { margin-bottom: 24px; }
}

/* ---------- competențele, imediat sub hero ---------- */
.competente.sub-hero { margin-top: 0; padding-top: 8px; }

/* ---------- capabilitățile, etichete în blocurile de competențe ---------- */
.arii { list-style: none; margin: 12px 0 18px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.arii li { font-size: 14px; line-height: 1.25; color: var(--navy-text); background: var(--fond); border: 1px solid var(--linie); border-radius: 16px; padding: 6px 12px; }

/* ---------- primul ecran cu poză: text în stânga, poza în dreapta ---------- */
.hero-foto { position: relative; overflow: hidden; background: var(--alb); }
.hero-poza { position: absolute; top: 0; right: 0; bottom: 0; width: 66%; }
.hero-poza picture, .hero-poza img { display: block; width: 100%; height: 100%; }
.hero-poza img { object-fit: cover; object-position: 72% 50%; }
.hero-poza::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--alb) 0%, rgba(255,255,255,.96) 18%, rgba(255,255,255,.7) 32%, rgba(255,255,255,0) 50%); }
.hero-in { position: relative; z-index: 1; max-width: var(--masura); margin: 0 auto; padding: 56px 40px 64px; min-height: 680px; display: flex; align-items: center; }
.hero-text { max-width: 38rem; }
.hero-foto .titlu-mare { font-size: clamp(36px, 4vw, 52px); line-height: 1.06; margin: 0 0 14px; }
.hero-foto .lovitura { font-family: var(--titlu); font-weight: 600; font-size: clamp(28px, 3.2vw, 40px); line-height: 1.1; letter-spacing: -0.025em; margin: 0 0 28px; }
.hero-foto + .coloana > .competente.sub-hero { padding-top: 64px; }
@media (max-width: 800px) {
  .hero-foto { display: flex; flex-direction: column; }
  .hero-in { order: 1; min-height: 0; padding: 36px 20px 28px; display: block; }
  .hero-poza { order: 2; position: relative; width: 100%; height: 340px; }
  .hero-poza img { object-position: 66% 40%; }
  .hero-poza::after { background: linear-gradient(180deg, var(--alb) 0%, rgba(255,255,255,0) 18%); }
  .hero-foto .titlu-mare { font-size: clamp(30px, 8.6vw, 38px); }
  .hero-foto .lovitura { font-size: clamp(24px, 7vw, 30px); margin-bottom: 24px; }
  .hero-foto + .coloana > .competente.sub-hero { padding-top: 48px; }
}

/* ---------- unde intră AI, și cât ---------- */
.ai-mix h2 { margin-bottom: 10px; }
.ai-mix-sub { color: var(--gri); font-size: 17px; margin: 0 0 32px; }
.ai-mix-grila { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
.ai-mix-bloc { border-top: 1px solid var(--navy); padding-top: 18px; }
.ai-mix-bloc h3 { font-size: 26px; margin-bottom: 16px; }
.scala { display: grid; grid-template-columns: auto auto; justify-content: space-between; align-items: center; gap: 12px 16px; margin-bottom: 18px; }
.scala-et { font-size: 14px; color: var(--gri); }
.bile { display: inline-flex; gap: 6px; }
.bile i { width: 13px; height: 13px; border-radius: 50%; border: 1.5px solid var(--navy); background: var(--alb); }
.bile.om i.plin { background: var(--navy); }
.bile.ai i { border-color: var(--bleu-contur); }
.bile.ai i.plin { background: var(--bleu); }
.ai-mix-text { font-size: 15px; line-height: 1.5; color: var(--navy-text); margin: 0 0 6px; }
.ai-mix-text b { font-weight: 600; color: var(--navy); }
@media (max-width: 800px) {
  .ai-mix-grila { grid-template-columns: 1fr; gap: 28px; }
}

/* ---------- testimonial static, în dovada de pe /produs ---------- */

/* ---------- controlul de pauză al benzii: ascuns vizual, vizibil doar la focus de tastatură ---------- */
.pauza-banda:not(:focus-visible) { position: absolute; width: 1px; height: 1px; min-height: 0; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.dovada .bloc.bloc-portofoliu { position: relative; }
.dovada .bloc.bloc-portofoliu > .pauza-banda.pauza-banda:focus-visible { position: absolute; right: 0; top: 100%; margin-top: 4px; }   /* apare în golul de sub bandă, fără să împingă pagina */

/* ---------- întrebarea simplă cu trei ieșiri ---------- */
.intrebare-simpla:has(.iesiri.trei) { max-width: none; }
.iesiri.trei { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 800px) { .iesiri.trei { grid-template-columns: 1fr; } }

/* ---------- subsol: iconițele de contact ---------- */
.contact { display: flex; gap: 6px; margin: 0 0 0 -10px; }   /* iconița, nu ținta de 44 px, se aliniază cu logo-ul */
.contact-ic { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 8px; color: var(--alb); opacity: .88; transition: opacity var(--t), background var(--t); }
.contact-ic img, .contact-ic svg { width: 24px; height: auto; display: block; }
.contact-ic:focus-visible { border-radius: 8px; }
@media (hover: hover) { .contact-ic:hover { opacity: 1; background: rgba(255,255,255,.08); } }

/* ---------- om / AI în blocurile de competențe ---------- */
.bara-om-ai { display: flex; gap: 2px; height: 11px; margin: 4px 0 14px; border-radius: 6px; overflow: hidden; }
.bara-om-ai .om { background: var(--navy); }
.bara-om-ai .ai { background: var(--bleu); box-shadow: inset 0 0 0 1px var(--bleu-contur); }
.competente .bloc-c .ai-mix-text { margin: 0 0 6px; }

/* ---------- bara om / AI segmentată: 5 segmente egale ---------- */
.bara-om-ai.segmente { gap: 3px; border-radius: 0; overflow: visible; }
.bara-om-ai.segmente > span { flex: 1 1 0; border-radius: 2px; }
.bara-om-ai.segmente > span:first-child { border-radius: 6px 2px 2px 6px; }
.bara-om-ai.segmente > span:last-child { border-radius: 2px 6px 6px 2px; }

/* ---------- etichete sub bara om / AI ---------- */
.bara-bloc .bara-om-ai { margin-bottom: 0; }
.competente .bloc-c .bara-etichete { display: flex; justify-content: space-between; margin: 5px 0 0; font-size: 13px; line-height: 1.3; color: var(--gri); }
.competente .bloc-c .bara-etichete span { font-weight: 700; }
.competente .bloc-c .bara-etichete span:first-child { color: var(--navy); }
.competente .bloc-c .bara-etichete span:last-child { color: var(--bleu-text); }
.competente .bloc-c .ai-mix-text b.om { color: var(--navy); }
.competente .bloc-c .ai-mix-text b.ai { color: var(--bleu-text); }

/* ---------- competențe: un panou cât hero-ul pentru fiecare bloc, alternat stânga / dreapta ---------- */
.competente.panouri { display: block; }
.competente.panouri .bara-bloc { margin-bottom: 16px; }
.competente.panouri .ai-mix-text { font-size: 17px; }
.competente.panouri .arii li { font-size: 15px; }
@media (min-width: 801px) {
  .competente.panouri .bloc-c { min-height: 520px; padding: 56px 0; justify-content: center; }
  .competente.panouri .bloc-c:last-child { min-height: 0; padding-bottom: 0; }   /* după ultimul panou, doar golul standard până la secțiunea următoare */
  .competente.panouri .bloc-c:first-child { margin-top: 0; }
  .competente.panouri .verb { font-size: clamp(48px, 5.6vw, 76px); margin-bottom: 18px; }
  .competente.panouri .verb + p { font-size: 22px; line-height: 1.4; margin-bottom: 14px; }
}

/* panou bleu-pal cu o cifră, alternat stânga / dreapta lângă text, cât coloana de text */
@media (min-width: 801px) {
  .competente.panouri .bloc-c { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); grid-template-rows: 1fr repeat(5, auto) 1fr; column-gap: 72px; }
  .competente.panouri .bloc-c > * { grid-column: 1; }
  .competente.panouri .bloc-c > .verb { grid-row: 2; }
  .competente.panouri .bloc-c > .verb + p { grid-row: 3; }
  .competente.panouri .bloc-c > .arii { grid-row: 4; }
  .competente.panouri .bloc-c > .bara-bloc { grid-row: 5; }
  .competente.panouri .bloc-c > .om-ai-text { grid-row: 6; }
  .competente.panouri .bloc-c > .cifre { grid-column: 2; grid-row: 2 / 7; }
  .competente.panouri .bloc-c:nth-child(even) { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  .competente.panouri .bloc-c:nth-child(even) > * { grid-column: 2; }
  .competente.panouri .bloc-c:nth-child(even) > .cifre { grid-column: 1; }
}
.competente.panouri .cifre { display: flex; flex-direction: column; justify-content: center; margin: 0; padding: 40px 44px; min-height: 0; background: var(--bleu-pal); border: 0; border-radius: 4px; }
.competente.panouri .cifre .cifra-nr { display: block; font-family: var(--titlu); font-weight: 700; font-size: clamp(72px, 8vw, 112px); line-height: 1; letter-spacing: -0.035em; font-variant-numeric: tabular-nums; color: var(--navy); margin-bottom: 12px; }
.competente.panouri .cifre .cifra-rest { display: block; font-family: var(--titlu); font-size: clamp(20px, 1.9vw, 24px); line-height: 1.25; letter-spacing: -0.01em; color: var(--navy); }
.ascuns-vizual { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }

@media (max-width: 800px) {
  .competente.panouri .bloc-c { padding: 28px 0 40px; }
  .competente.panouri .verb { font-size: clamp(36px, 10vw, 46px); }
  .competente.panouri .verb + p { font-size: 18px; line-height: 1.45; }
  .competente.panouri .cifre { margin-top: 18px; padding: 26px 24px; }
  .competente.panouri .cifre .cifra-nr { font-size: 64px; }
  .competente.panouri .cifre .cifra-rest { font-size: 20px; }
}

/* ---------- /produs: cele trei imagini ale poveștii ---------- */
.poveste { margin: 0; }
.poveste picture, .poveste img { display: block; width: 100%; height: auto; }
.poveste img { border-radius: 4px; background: var(--fond); }
@media (max-width: 800px) {
}

/* ---------- /produs: imaginile de fază se topesc în fondul alb ---------- */
.poveste-lata img {
  border-radius: 0; background: none;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 12%, #000 88%, transparent 100%), linear-gradient(to bottom, transparent 0%, #000 14%, #000 86%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to right, transparent 0%, #000 12%, #000 88%, transparent 100%), linear-gradient(to bottom, transparent 0%, #000 14%, #000 86%, transparent 100%);
  mask-composite: intersect;
}

/* ---------- /produs: imaginile de fază, pe toată lățimea ferestrei (în afara coloanei) ---------- */
@media (min-width: 801px) {
  .poveste-lata { height: min(75vh, 56.25vw); }
  .poveste-lata picture, .poveste-lata img { height: 100%; }
  .poveste-lata img { object-fit: cover; object-position: 50% 4%; }
}
@media (max-width: 800px) {
  .poveste-lata { margin: 0 20px; }
}

/* ---------- /produs: primul ecran cu poză (tiparul hero-foto) ---------- */
.hero-produs-foto .hero-poza { width: 72%; }
.hero-produs-foto .hero-poza img { object-position: 100% 45%; }
.hero-produs-foto .hero-poza::after { background: linear-gradient(90deg, var(--alb) 0%, rgba(255,255,255,.96) 24%, rgba(255,255,255,.7) 36%, rgba(255,255,255,0) 52%); }
.hero-produs-foto .hero-in { min-height: 640px; }
.hero-produs-foto .hook { font-size: clamp(36px, 3.45vw, 44px); line-height: 1.08; margin: 0 0 14px; }
.hero-produs-foto .lovitura { font-size: clamp(22px, 2.2vw, 28px); line-height: 1.2; letter-spacing: -0.02em; margin: 0 0 26px; }
@media (max-width: 800px) {
  .hero-produs-foto .hero-poza { width: 100%; }
  .hero-produs-foto .hero-poza img { object-position: 86% 40%; }
  .hero-produs-foto .hero-poza::after { background: linear-gradient(180deg, var(--alb) 0%, rgba(255,255,255,0) 18%); }
  .hero-produs-foto .hook { font-size: clamp(30px, 8.4vw, 38px); }
  .hero-produs-foto .lovitura { font-size: clamp(21px, 6vw, 26px); margin-bottom: 24px; }
}

/* ---------- /produs: sau construiesc eu, alternativa la produs ---------- */
@media (max-width: 800px) {
}

/* ---------- landing: ce problemă rezolvăm, Consultanță / AI în firma ta ---------- */
.intrebare-simpla:has(.iesiri.alegeri) { max-width: none; }
.alegere { display: flex; flex-direction: column; padding: 32px 30px 28px; text-align: left; }
.alegere .iesire-titlu { margin: 0; color: var(--navy); }
.alegere .iesire-text { margin: 12px 0 24px; }
.alegere .cta { margin-top: 0; }
.cai { list-style: none; margin: auto 0 0; padding: 0; border-top: 1px solid var(--linie); }
.cai li { border-bottom: 1px solid var(--linie); }
.cai a { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto; column-gap: 16px; align-items: center; min-height: 44px; padding: 12px 0; text-decoration: none; color: var(--navy); }
.cai .cale-titlu { font-family: var(--titlu); font-weight: 600; font-size: 18px; line-height: 1.25; }
.cai .cale-text { grid-row: 2; font-size: 14px; color: var(--gri); }
.cai .cale-sageata { grid-row: 1 / 3; grid-column: 2; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--navy); display: grid; place-items: center; transition: background var(--t), color var(--t); }
.cai a:focus-visible { border-radius: 6px; }
@media (hover: hover) { .cai a:hover .cale-sageata { background: var(--navy); color: var(--alb); } .cai a:hover .cale-titlu { text-decoration: underline; text-underline-offset: 4px; } }
@media (max-width: 800px) {
  .alegere { padding: 24px 22px 22px; }
}

/* ---------- /produs: povestea în trei faze ---------- */
.faza { margin-top: 104px; }
.faza-titlu { font-size: clamp(28px, 3.4vw, 44px); line-height: 1.1; letter-spacing: -0.025em; margin: 0; max-width: 46rem; }
.hero-produs-foto .hero-text .kicker { margin-bottom: 18px; }
@media (max-width: 800px) {
  .faza { margin-top: 72px; }
}

/* ---------- /produs: cifra fazei, mare, deasupra kicker-ului ---------- */
.faza-nr { display: block; font-family: var(--titlu); font-weight: 700; font-size: 144px; line-height: .82; letter-spacing: -0.05em; color: var(--auriu-text); margin: 0 0 18px -6px; }
@media (max-width: 800px) {
  .faza-nr { font-size: 96px; margin: 0 0 14px -4px; }
}

/* ---------- /produs: cele trei hero-uri, legate, unul după altul ---------- */
.hero-foto + .faza, .faza + .faza { margin-top: 56px; }
@media (min-width: 801px) {
  .faza .poveste-lata { height: min(62vh, 56.25vw); }
  #faza-3 .poveste-lata img { object-position: 50% 0%; }
}
@media (max-width: 800px) {
  .hero-foto + .faza, .faza + .faza { margin-top: 40px; }
}

/* ---------- landing: fondurile abstracte ale casetelor cu cifre ---------- */
.competente.panouri .cifre { position: relative; overflow: hidden; isolation: isolate; }
.cifre-fond { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; display: block; }

/* ---------- /produs: cum se întâmplă, patru cadre la scara ferestrei ---------- */
.cum-se-intampla { margin-top: 72px; }
.cadre-rand { width: min(100% - 80px, 1680px); margin: 0 auto; }
.cadre { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr) 24px minmax(0, 1fr) 24px minmax(0, 1fr) 24px minmax(0, 1fr); grid-template-rows: repeat(6, auto) minmax(96px, 1fr); min-height: clamp(520px, 78vh, 880px); }
.cadru { background: var(--navy); color: var(--alb); border-radius: 28px; padding: clamp(24px, 2.4vw, 40px) clamp(22px, 2.2vw, 36px) 0; grid-row: 1 / -1; display: grid; grid-template-rows: subgrid; overflow: hidden; }
.cadru p { margin: 0; }
.cadru .cadru-kicker { font-family: var(--titlu); font-weight: 600; font-size: clamp(15px, 1vw, 17px); letter-spacing: .02em; color: var(--auriu-text); margin-bottom: 16px; }
.cadru-titlu { font-family: var(--titlu); font-weight: 600; font-size: clamp(32px, 2.6vw, 48px); line-height: 1.04; letter-spacing: -0.03em; color: var(--alb); }
.cadru .cadru-eticheta { font-size: 16px; color: var(--bleu); margin: 6px 0 14px; }
.cadru-text { font-size: clamp(17px, 1.1vw, 19px); line-height: 1.45; color: var(--alb); }
.cadru-desen { display: block; align-self: end; width: calc(100% + 2 * clamp(22px, 2.2vw, 36px)); height: 100%; min-height: 96px; max-height: 340px; margin: 16px calc(-1 * clamp(22px, 2.2vw, 36px)) 0; }
.cadru-sageata { display: grid; place-items: center; color: var(--gri-2); grid-row: 1 / -1; }
.cadre-sageti { justify-content: flex-end; margin-top: 18px; }
@media (min-width: 1024px) { .cadre-sageti { display: none; } }
@media (max-width: 1023px) {
  .cadre-rand { width: 100%; }
  .cadre { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: min(calc((100% + 20px) / 1.15), 420px); column-gap: 16px; min-height: clamp(480px, 64vh, 600px); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; padding: 0 20px; scroll-padding: 0 20px; }
  .cadre::-webkit-scrollbar { display: none; }
  .cadru { scroll-snap-align: start; padding: 26px 24px 0; }
  .cadru-desen { width: calc(100% + 48px); margin: 16px -24px 0; }
  .cadru-sageata { display: none; }
  .cadre-sageti { padding: 0 20px; }
}
@media (max-width: 800px) {
  .cum-se-intampla { margin-top: 48px; }
}

/* ---------- /produs: hero 3, plecarea (imaginea în dreapta, textul pe peretele din stânga) ---------- */
.hero-plecare .hero-poza { width: min(100%, 1280px); }
.hero-plecare .hero-poza img { object-position: 100% 50%; }
.hero-plecare .hero-poza::after { background: linear-gradient(270deg, rgba(255,255,255,0) 60.5%, rgba(255,255,255,.8) 64.5%, rgba(255,255,255,.86) 90%, var(--alb) 100%); }
.hero-plecare .hero-in { min-height: min(720px, 56.25vw); }
.hero-plecare .hero-text { max-width: min(34rem, 26vw); }
.hero-plecare .faza-titlu { font-size: clamp(30px, 2.6vw, 44px); }
.hero-plecare .kicker { margin-bottom: 14px; }
@media (max-width: 800px) {
  .hero-plecare .hero-poza { width: 100%; height: 260px; }
  .hero-plecare .hero-poza::after { background: linear-gradient(180deg, var(--alb) 0%, rgba(255,255,255,0) 16%); }
  .hero-plecare .hero-in { min-height: 0; padding-bottom: 20px; }
  .hero-plecare .hero-text { max-width: none; }
}

/* ---------- /produs: „nu sunt / sunt" în cadre ---------- */
.cadru .cadru-nusunt { position: relative; margin-top: 20px; padding-top: 16px; font-size: clamp(15px, 1vw, 17px); line-height: 1.45; color: var(--alb); }
.cadru-nusunt::before { content: ""; position: absolute; top: 0; left: 20%; width: 60%; border-top: 1px solid rgba(179, 217, 244, .28); }
.cadru-nusunt b { font-family: var(--titlu); font-weight: 600; }
.cadru .cadru-lovitura { margin-top: 22px; container-type: inline-size; font-family: var(--titlu); font-weight: 600; line-height: 1.04; letter-spacing: -0.03em; color: var(--auriu-text); text-align: center; white-space: nowrap; }
.cadru-lovitura > span { display: block; font-size: min(clamp(32px, 2.6vw, 48px), 10.1cqw); }

/* ---------- /produs: conținutul cadrelor, centrat ---------- */
.cadru > p { text-align: center; }

/* ---------- /produs: hero 2, biroul (imaginea în stânga, textul pe geamul mat din dreapta) ---------- */
.hero-birou .hero-poza { left: 0; right: auto; width: min(100%, 1280px); }
.hero-birou .hero-poza img { object-position: 0% 50%; }
.hero-birou .hero-poza::after { background: linear-gradient(90deg, rgba(255,255,255,0) 65%, rgba(255,255,255,.8) 67.5%, rgba(255,255,255,.86) 90%, var(--alb) 100%); }
.hero-birou .hero-in { min-height: min(720px, 56.25vw); justify-content: flex-end; max-width: none; padding-right: max(40px, min(100% - 1240px, 50% - 520px)); }
.hero-birou .hero-text { max-width: min(34rem, 26vw); }
.hero-birou .faza-titlu { font-size: clamp(30px, 2.6vw, 44px); }
.hero-birou .kicker { margin-bottom: 14px; }
@media (max-width: 800px) {
  .hero-birou .hero-poza { width: 100%; height: 260px; }
  .hero-birou .hero-poza::after { background: linear-gradient(180deg, var(--alb) 0%, rgba(255,255,255,0) 16%); }
  .hero-birou .hero-in { min-height: 0; padding-bottom: 20px; padding-right: 20px; }
  .hero-birou .hero-text { max-width: none; }
}

/* ---------- /produs: studii de caz, patru cadre alternate alb / navy ---------- */
.studii { margin-top: 104px; }
.studii-cap { width: min(100% - 80px, 1680px); margin: 0 auto 32px; }
.studii-cap h2 { margin: 0; }
.studii-cadre { grid-template-rows: auto 1fr; }
@media (min-width: 1024px) { .studii-cadre { grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 24px; } }
.cadru.studiu { text-align: center; padding-bottom: clamp(24px, 2.4vw, 40px); }
.cadru.studiu.alb { background: var(--alb); color: var(--navy); border: 1px solid var(--linie); box-shadow: var(--umbra-1); }
.studiu-logo { display: flex; align-items: center; justify-content: center; height: 72px; margin: 12px 0 0; }
.studiu-logo img { height: 64px; width: auto; max-width: 70%; object-fit: contain; }
.cadru.studiu.navy .studiu-logo img[src$=".png"] { filter: brightness(0) invert(1); }
.studiu-logo img[src$=".svg"] { height: auto; width: 70%; max-height: 64px; }
.studiu-logo img.logo-patrat { height: 72px; }
.studiu-text { text-align: left; }
.studiu-text p { margin: 28px 0 0; font-size: clamp(15px, 1vw, 16px); line-height: 1.5; color: inherit; }
@media (max-width: 800px) {
  .studii { margin-top: 72px; }
  .studii-cap { width: calc(100% - 40px); }
}

/* ---------- /produs: construiesc eu, bandă navy de la margine la margine ---------- */
.construiesc-banda { background: var(--navy); padding: 88px 40px; text-align: center; }
.construiesc-banda > * { max-width: var(--masura); margin-left: auto; margin-right: auto; }
.construiesc-text { font-family: var(--titlu); font-weight: 600; font-size: clamp(22px, 2vw, 30px); line-height: 1.3; letter-spacing: -0.015em; color: var(--alb); max-width: none; margin: 0 auto 32px; text-wrap: balance; }
.construiesc-text > span { display: block; }
.construiesc-text > span + span { margin-top: .35em; }
.construiesc-banda .cta { justify-content: center; }
@media (max-width: 800px) { .construiesc-banda { padding: 72px 20px; } }

/* ---------- /build-lab: două programe (S, M) și Enterprise, șase pași ---------- */
.planuri.doua { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.oferta.lat > * { max-width: none; width: min(100% - 80px, 1680px); }
.plan .amortizare-tipica { margin: -4px 0 18px; font-size: 18px; line-height: 1.45; color: var(--navy); }
.amortizare-tipica [data-tipic] { font-size: 19px; font-weight: 700; color: var(--auriu-text); }
.link-calcul { display: flex; align-items: center; width: max-content; min-height: 44px; color: var(--navy); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.treapta-l { margin-top: 64px; }
.plan .buton.secundar { width: 100%; height: auto; min-height: 52px; padding: 12px 20px; font-size: 16px; white-space: normal; text-align: center; line-height: 1.25; }
.treapta-l .cap { text-align: center; margin-bottom: 32px; }
.treapta-l .l-sub { font-family: var(--corp); font-weight: 400; font-size: .62em; letter-spacing: 0; color: var(--gri); white-space: nowrap; }
.treapta-l .cap h3 { margin: 0; font-size: clamp(24px, 2.4vw, 30px); }
.pasi-l { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr) 18px minmax(0, 1fr) 18px minmax(0, 1fr) 18px minmax(0, 1fr) 18px minmax(0, 1fr) 18px minmax(0, 1fr); column-gap: 6px; }
.pas-l { background: var(--navy); color: var(--alb); border-radius: 20px; padding: 20px 18px 22px; }
.pas-l-nr { margin: 0 0 6px; font-family: var(--titlu); font-weight: 600; font-size: 28px; line-height: 1; letter-spacing: -0.02em; color: var(--auriu-text); }
.pas-l h4 { margin: 0 0 8px; font-family: var(--titlu); font-weight: 600; font-size: 18px; line-height: 1.15; letter-spacing: -0.01em; color: var(--bleu); hyphens: manual; }
.pas-l-text { margin: 0; font-size: 15px; line-height: 1.45; }
.pas-l-sageata { display: grid; place-items: center; color: var(--gri-2); }
@media (min-width: 1024px) and (max-width: 1279px) {
  .pasi-l { grid-template-columns: minmax(0, 1fr) 18px minmax(0, 1fr) 18px minmax(0, 1fr) 18px minmax(0, 1fr) 18px minmax(0, 1fr) 18px minmax(0, 1fr); column-gap: 2px; }
  .pas-l { padding: 18px 14px 20px; }
  .pas-l h4 { font-size: 17px; }
}
.treapta-l .cta { margin-top: 32px; justify-content: center; }
@media (max-width: 1023px) {
  .pasi-l { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  .pas-l-sageata { display: none; }
}
@media (max-width: 800px) {
  .planuri.doua { grid-template-columns: 1fr; }
  .oferta.lat > * { width: calc(100% - 40px); }
  .treapta-l { margin-top: 44px; }
  .treapta-l .cap { text-align: left; margin-bottom: 24px; }
  .pasi-l { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .pas-l { padding: 18px 16px 20px; }
  .pas-l h4 { font-size: 17px; }
  .pas-l-text { font-size: 14.5px; }
}

/* ---------- /build-lab: amortizare, două calculatoare ---------- */
#amortizare .subtitlu { font-size: clamp(18px, 2vw, 21px); color: var(--navy-text); margin: -14px 0 32px; max-width: 40rem; line-height: 1.4; }
.calcule { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.calcul { padding: 22px 24px 22px; display: flex; flex-direction: column; }
.calcul .calcul-kicker { margin: 0 0 4px; font-family: var(--titlu); font-weight: 700; font-size: 19px; line-height: 1.3; letter-spacing: .01em; color: var(--auriu-text); }
.calcul h3 { font-size: 26px; margin: 0 0 6px; }
.calcul > p { margin: 0 0 14px; color: var(--navy-text); font-size: 16px; line-height: 1.5; }
.glisor { margin-bottom: 12px; }
.glisor-cap { display: block; line-height: 1.35; }
.glisor-cap label { font-size: 15px; font-weight: 600; color: var(--navy); }
.glisor-val { white-space: nowrap; }
.glisor-sep { font-weight: 600; color: var(--navy); }
.glisor-cap output { font-family: var(--titlu); font-weight: 700; font-size: 18px; color: var(--navy); white-space: nowrap; }
.glisor input[type="range"] { display: block; width: 100%; height: 24px; margin: 4px 0 0; accent-color: var(--navy); cursor: pointer; }
.glisor-cap output small { margin-left: 6px; font-family: var(--corp); font-weight: 500; font-size: 13px; color: var(--gri); }
.glisor-cap .eticheta-mic { display: block; margin-top: 2px; font-size: 13px; font-weight: 500; color: var(--bleu-text); }
.glisor-nota { margin: 6px 0 0; font-size: 19px; font-weight: 700; line-height: 1.35; color: var(--auriu-text); }
.ani { border: 0; margin: 0 0 22px; padding: 0; min-width: 0; }
.ani legend { padding: 0; margin-bottom: 6px; font-size: 15px; font-weight: 600; color: var(--navy); }
.ani-optiuni { display: flex; gap: 8px; }
.ani-optiuni label { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; border: 1px solid var(--linie); border-radius: 10px; font-weight: 600; color: var(--navy); cursor: pointer; }
.ani-optiuni input { margin: 0; accent-color: var(--navy); }
.ani-optiuni label:has(input:checked) { border-color: var(--navy); background: var(--bleu-pal); }
.ani.program { max-width: 460px; margin: 0 0 28px; }
.rezultat { margin-top: auto; background: var(--bleu-pal); border-radius: 12px; padding: 12px 18px; }
.rezultat p { margin: 0 0 4px; font-size: 16px; line-height: 1.45; color: var(--navy); }
.rezultat p:last-child { margin-bottom: 0; }
.rezultat b { font-family: var(--titlu); font-weight: 700; }
.rezultat .mic { font-size: 13px; color: var(--gri); }
.bife.bife-calcul { margin: -6px 0 8px; font-size: 15px; line-height: 1.35; color: var(--navy); }
.bife.bife-calcul li { padding: 2px 0 2px 26px; }
.bife.bife-calcul li::before { top: 7px; }
.calcul-b > p { margin-bottom: 10px; }
.calcul-b .ani { margin-bottom: 8px; }
@media (min-width: 801px) { .calcul-b .ani-optiuni label { min-height: 40px; } }
.calcul-b .glisor { margin-bottom: 8px; }
.rezultat-a { margin-top: auto; }
.calcul-b .rezultat { background: var(--alb); border: 1px solid var(--linie); }
.calcul-b .rezultat [data-r="b-lunar"], .calcul-b .rezultat [data-r="b-per-util"], .calcul-b .rezultat [data-r="b-lei"], .calcul-b .rezultat [data-r="b-lei-util"] { font-family: var(--titlu); font-size: 19px; font-weight: 700; color: var(--auriu-text); }
.calcul-b .rezultat [data-r="b-ani"], .calcul-b .rezultat [data-r="b-util"], .calcul-b .rezultat [data-r="prog-nume"] { font-weight: 700; color: var(--navy); }
.casete-cifra { container-type: inline-size; display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
.caseta-cifra { margin: 0; display: flex; flex-direction: column; background: var(--alb); border: 1px solid var(--linie); border-radius: 12px; padding: 10px 16px 12px; }
.caseta-et { font-family: var(--titlu); font-weight: 600; font-size: 26px; line-height: 1.15; letter-spacing: -0.02em; color: var(--navy); margin-bottom: 4px; }
.caseta-cifra b { font-family: var(--titlu); font-weight: 700; font-size: 34px; line-height: 1.05; letter-spacing: -0.03em; color: var(--auriu-text); }
.caseta-cifra b[data-r="a-an"] { white-space: nowrap; }
.rezultat-a .mic { margin: 6px 0 0; font-size: 13px; color: var(--gri); }
.promisiune { margin: 22px 0 0; background: var(--navy); border-radius: var(--r); padding: 22px 32px; text-align: center; }
.promisiune p { max-width: 70ch; margin: 0 auto; font-size: 19px; line-height: 1.45; color: var(--alb); }
.promisiune b { font-weight: 700; color: var(--auriu-text); }
@media (max-width: 1023px) {
  .calcule { grid-template-columns: 1fr; gap: 16px; }
  .promisiune { margin-top: 16px; }
}
@media (max-width: 800px) {
  .caseta-cifra { padding: 12px 14px 14px; }
  .caseta-et { font-size: 23px; }
  .caseta-cifra b { font-size: 28px; }
  .calcul { padding: 20px 18px; }
  .promisiune { padding: 20px 18px; text-align: left; }
  .promisiune p { font-size: 18px; }
  .calcul h3 { font-size: 23px; }
  .rezultat { padding: 12px 14px; }
}

/* ---------- /build-lab: hero cu poză (poza întreagă, ancorată în dreapta; textul pe peretele din stânga) ---------- */
.hero-buildlab .hero-poza { width: auto; aspect-ratio: 1672 / 941; }
.hero-buildlab .hero-poza img { object-fit: cover; object-position: 100% 50%; }
.hero-buildlab .hero-poza::after { background: linear-gradient(90deg, var(--alb) 0%, rgba(255,255,255,0) 18%); }
.hero-buildlab .hero-in { min-height: clamp(500px, 44vw, 720px); padding-top: 40px; padding-bottom: 48px; }
.hero-buildlab .hero-text { max-width: min(36rem, calc(100vw - 1.2438 * clamp(500px, 44vw, 720px) - max(40px, (100vw - 1120px) / 2 + 40px) - 60px)); }
.hero-buildlab .titlu-mare { font-size: clamp(44px, 5vw, 72px); line-height: 1; margin: 0 0 18px; }
.hero-buildlab .subtitlu { font-size: clamp(18px, 1.55vw, 22px); line-height: 1.45; color: var(--navy-text); margin: 0 0 26px; }
@media (max-width: 1100px) {
  .hero-buildlab { display: flex; flex-direction: column; }
  .hero-buildlab .hero-in { order: 1; width: 100%; max-width: none; margin: 0; min-height: 0; padding: 36px 40px 28px; display: block; }
  .hero-buildlab .hero-text { max-width: 40rem; }
  .hero-buildlab .hero-poza { order: 2; position: relative; inset: auto; width: 100%; height: auto; }
  .hero-buildlab .hero-poza::after { background: linear-gradient(180deg, var(--alb) 0%, rgba(255,255,255,0) 14%); }
}
@media (max-width: 800px) {
  .hero-buildlab .hero-in { padding: 28px 20px 24px; }
  .hero-buildlab .hero-poza { height: 260px; aspect-ratio: auto; }
  .hero-buildlab .hero-poza img { object-position: 100% 50%; }
}

/* ---------- /build-lab: ce spun participanții ---------- */
.participanti { margin-top: 104px; padding: 72px 0 80px; background: var(--fond); }
.participanti > * { width: min(100% - 80px, 1680px); margin-left: auto; margin-right: auto; }
.participanti h2 { margin-bottom: 28px; }
.participanti-grila { list-style: none; margin-top: 0; margin-bottom: 0; padding: 0 0 4px; container-type: inline-size; display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 3 * 22px) / 3.5); gap: 22px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; }
.participanti-grila::-webkit-scrollbar { display: none; }
.participanti .testimonial { min-height: calc((100cqw - 3 * 22px) / 3.5 * 4 / 3); scroll-snap-align: start; position: relative; padding: 24px 24px 0; }
.participanti .testimonial .spus { font-size: clamp(15px, 1.05vw, 18px); margin-bottom: 14px; }
.participanti .testimonial .cine { margin: 0; font-size: 14px; }
.testim-ilustratie { flex: 1 1 auto; min-height: 90px; position: relative; overflow: hidden; margin: 14px -24px 0; border-radius: 0 0 var(--r) var(--r); }
.testim-ilustratie picture, .testim-ilustratie img { position: absolute; inset: 0; width: 100%; height: 100%; }
.testim-ilustratie img { object-fit: cover; object-position: 50% 100%; opacity: .3; -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 45%); mask-image: linear-gradient(180deg, transparent 0%, #000 45%); }
.testim-sageti { justify-content: flex-end; margin-top: 18px; }
@media (max-width: 800px) {
  .participanti { margin-top: 72px; padding: 48px 0 56px; }
  .participanti > * { width: calc(100% - 40px); }
  .participanti-grila { grid-auto-columns: calc((100% - 16px) / 1.15); gap: 16px; }
  .participanti .testimonial { padding: 20px 20px 0; min-height: calc((100cqw - 16px) / 1.15 * 4 / 3); }
  .testim-ilustratie { margin: 12px -20px 0; }
}

/* ---------- /build-lab: rezultatele, în cifre ---------- */
.rezultate { margin-top: 88px; text-align: center; }
.rezultate > * { width: min(100% - 80px, 1680px); margin-left: auto; margin-right: auto; }
.rezultate h2 { margin-bottom: 10px; }
.rezultate .rezultate-sub { max-width: 60rem; margin-top: 0; margin-bottom: 32px; font-size: clamp(17px, 1.3vw, 19px); line-height: 1.45; color: var(--gri); }
.placi-rezultate { list-style: none; margin-top: 0; margin-bottom: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.placa-rez { display: flex; flex-direction: column; align-items: center; background: var(--alb); border: 1px solid var(--linie); border-radius: var(--r); box-shadow: var(--umbra-1); padding: 30px 22px 28px; }
.placa-nr { display: block; font-family: var(--titlu); font-weight: 700; font-size: clamp(56px, 6vw, 84px); line-height: 1; letter-spacing: -0.03em; color: var(--auriu-text); margin-bottom: 14px; }
.placa-et { display: block; max-width: 16em; min-height: 2.8em; font-size: 17px; line-height: 1.4; color: var(--navy); }
.rezultate .rezultate-nota { max-width: 70ch; margin-top: 24px; margin-bottom: 0; font-size: 15px; line-height: 1.5; color: var(--gri); }
.cta-final { justify-content: center; margin-top: 64px; }
@media (max-width: 1023px) { .placi-rezultate { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; } }
@media (max-width: 599px) { .placi-rezultate { grid-template-columns: minmax(0, 1fr); gap: 14px; } }
@media (max-width: 800px) {
  .rezultate { margin-top: 56px; }
  .rezultate > * { width: calc(100% - 40px); }
  .cta-final { margin-top: 48px; }
}

/* ---------- T-114: reparații după QA 5 ---------- */
.nowrap { white-space: nowrap; }
.sageata-text { display: inline-block; width: 1em; height: 1em; vertical-align: -0.12em; margin-left: .15em; }
/* rândurile derulabile: nume accesibil + inelul casei */
[data-cadre]:focus-visible, [data-testim]:focus-visible { outline: 2px solid var(--auriu-text); outline-offset: 4px; border-radius: 6px; }
/* rândurile de cadre ocupă toată lățimea sub 1024 px: inelul intră înăuntru, iar cadrele stau la 4 px de el */
@media (max-width: 1023px) {
  [data-cadre]:focus-visible { outline-offset: -2px; }
  .cadre { padding-top: 4px; padding-bottom: 4px; }
}
/* studii de caz sub 1024 px: umbra cardurilor nu mai e tăiată */
@media (max-width: 1023px) { .studii-cadre { padding-bottom: 20px; } }
/* hero landing + hero 1 /produs, 801–1100 px: textul pe alb sus, poza întreagă dedesubt */
@media (min-width: 801px) and (max-width: 1100px) {
  .hero-foto:not(.faza):not(.hero-buildlab) { display: flex; flex-direction: column; }
  .hero-foto:not(.faza):not(.hero-buildlab) .hero-in { order: 1; width: 100%; max-width: none; margin: 0; min-height: 0; padding: 44px 40px 32px; display: block; }
  .hero-foto:not(.faza):not(.hero-buildlab) .hero-text { max-width: 40rem; }
  .hero-foto:not(.faza):not(.hero-buildlab) .hero-poza { order: 2; position: relative; inset: auto; width: 100%; height: clamp(380px, 48vw, 520px); }
  .hero-foto:not(.faza):not(.hero-buildlab) .hero-poza::after { background: linear-gradient(180deg, var(--alb) 0%, rgba(255,255,255,0) 16%); }
  .hero-foto:not(.faza):not(.hero-buildlab):not(.hero-produs-foto) .hero-poza img { object-position: 66% 30%; }
  .hero-produs-foto .hero-poza img { object-position: 86% 40%; }
}
/* toate hero-urile cu poză, sub 800 px: textul la 20 px, ca restul paginii */
@media (max-width: 800px) {
  .hero-foto .hero-in { width: 100%; max-width: none; margin: 0; }
}

/* ---------- T-115: după QA 6 ---------- */
/* hero 1 /produs, 1101–1224 px: coloana de text mai îngustă, ca h1 să nu atingă figura */
@media (min-width: 1101px) and (max-width: 1224px) {
  .hero-produs-foto .hero-text { max-width: 33rem; }
}
/* butoanele aurii pe fond deschis: inel navy (peste umbra aurie rămâne ≥ 3:1); pe fond navy rămâne auriu */
.buton:not(.secundar):not(.incepe):focus-visible { outline-color: var(--navy); }
:is(.construiesc-banda, .cadru, .pas-l, .promisiune, .subsol) .buton:not(.secundar):not(.incepe):focus-visible { outline-color: var(--auriu-text); }
/* linkurile din antet pe telefon: inelul rămâne deasupra liniei antetului */
@media (max-width: 800px) {
  .antet nav a { padding: 12px 8px; margin: 0 -8px; }
  .antet nav a:focus-visible { outline-offset: 0; }
  .antet nav a::after { left: 8px; right: 8px; }
}
/* configurator: „Reia de la început”, la dreapta lui „Înapoi”, același stil */
.config .inapoi.reia { margin-left: 28px; }

/* ---------- T-116: pagina 404 ---------- */
/* pagină scurtă: subsolul stă jos pe ecranele înalte */
.pagina-404 { min-height: 100vh; display: flex; flex-direction: column; }
.pagina-404 > .coloana { flex: 1 0 auto; width: 100%; }

/* ---------- T-119: Start / Plus, rândurile aliniate între carduri ---------- */
/* obiectivul și linkul „Calculează” sunt acum rânduri separate; spațiul de sub ele rămâne același */
.plan .amortizare-tipica:has(+ .link-calcul) { margin-bottom: 0; }
.plan > .link-calcul { margin: 0 0 18px; }
/* cât timp stau alăturate: 9 rânduri comune (titlu, preț, obiectiv, link, 4 perechi, buton), liniile la același y */
@media (min-width: 801px) {
  .planuri.doua { grid-template-rows: repeat(9, auto); row-gap: 0; }
  .planuri.doua .plan { display: grid; grid-template-rows: subgrid; grid-row: span 9; row-gap: 0; align-content: start; }
  .planuri.doua .plan dl { display: contents; }
  .planuri.doua .plan dl > div:last-child { margin-bottom: 22px; }
  .planuri.doua .plan > .link-calcul { justify-self: start; }
  .planuri.doua .plan > .buton { align-self: end; }
}

/* ---------- T-120: slidere fără salt (B-014) ---------- */
/* valoarea ține mereu lățimea celei mai late valori: rândul etichetei nu se mai rupe diferit în timpul tragerii */
.glisor-cap output { display: inline-block; }
#a-zile-val { min-width: 170px; }
#a-cost-val { min-width: 88px; }
#b-util-val { min-width: 24px; }
.glisor input[type="range"] { touch-action: pan-y; }
/* titlul calculatorului A: minimul programului, o treaptă mai mic decât titlul */
.calcul h3 .titlu-min { font-size: .8em; font-weight: 500; white-space: nowrap; }

/* ---------- T-121: bara om / AI mai înaltă și mai vizibilă ---------- */
.bara-om-ai.segmente { height: 32px; gap: 6px; }
.bara-om-ai.segmente > span, .bara-om-ai.segmente > span:first-child, .bara-om-ai.segmente > span:last-child { border-radius: 8px; }
.competente .bloc-c .bara-etichete { margin-top: 8px; font-size: 17px; }
@media (max-width: 800px) { .bara-om-ai.segmente { height: 24px; } }

/* ---------- addendum 2 T-121: calculatorul A, rezultatele imediat sub slidere; cardul rămâne cât conținutul ---------- */
.calcule { align-items: start; }
.rezultat-a { margin-top: 10px; }

/* ---------- T-123: „Până acum” deasupra cifrei din tile-uri ---------- */
.competente.panouri .cifre .cifra-eticheta { display: block; margin: 0 0 2px; font-family: var(--corp); font-size: 14px; font-weight: 500; line-height: 1.3; color: var(--gri); }
/* cifra mare are spațiu gol deasupra glifei (≈0,15 em): îl compensăm, ca eticheta să stea la ~8 px de cifră la orice mărime */
.competente.panouri .cifre .cifra-nr { margin-top: -0.146em; }

/* ---------- T-124 (încercare): banda parcursului 1·2·3 pe hero-urile /produs + „Faza N ·” vizibil ---------- */
.parcurs { margin: 0 0 22px; }
.parcurs-et { margin: 0 0 8px; font-size: 16px; font-weight: 700; line-height: 1.3; color: var(--navy); }
.parcurs-pasi { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; }
.parcurs-pas { display: inline-flex; align-items: center; gap: 8px; min-height: 28px; font-size: 14px; line-height: 1.3; color: var(--gri); text-decoration: none; }
a.parcurs-pas:hover { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }
.parcurs-nr { flex: none; display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; border: 1px solid currentColor; font-family: var(--titlu); font-weight: 600; font-size: 12px; line-height: 1; }
.parcurs-pas.curent { color: var(--navy); font-weight: 700; }
.parcurs-pas.curent .parcurs-nr { background: var(--auriu); border-color: var(--auriu); color: var(--navy); }
.hero-foto .kicker b { font-weight: 700; color: var(--navy); }

/* ---------- T-126: hero landing ≥ 1101 px, voal mai ușor, legat de marginea dreaptă a textului ---------- */
/* --t = marginea dreaptă a textului, măsurată de la marginea stângă a pozei (poza începe la 34 % din lățime) */
@media (min-width: 1101px) {
  .hero-foto:not(.faza):not(.hero-produs-foto):not(.hero-buildlab) .hero-poza::after {
    --t: calc(max(40px, 50vw - 520px) + 520px - 34vw);
    background: linear-gradient(90deg, var(--alb) 0, rgba(255,255,255,.9) calc(var(--t) - 60px), rgba(255,255,255,.85) calc(var(--t) + 40px), rgba(255,255,255,0) calc(var(--t) + 130px));
  }
}

/* ---------- T-130: datele firmei, ultimul rând din subsol ---------- */
.subsol .firma { grid-column: 1 / -1; margin: 12px 0 0; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.14); font-size: 13px; line-height: 1.5; color: rgba(255,255,255,.7); }
@media (max-width: 800px) { .subsol .firma .firma-1 { display: block; } }
/* addendum T-124: la ≥ 1101 px cei trei pași stau pe un singur rând; banda poate depăși coloana de text */
@media (min-width: 1101px) {
  .parcurs { width: max-content; max-width: 720px; }
  .parcurs-pasi { flex-wrap: nowrap; }
  .parcurs-pas { white-space: nowrap; }
  /* hero 2 are textul lângă marginea dreaptă: banda se aliniază la dreapta coloanei, ca să nu iasă din ecran */
  .hero-birou .parcurs { position: relative; left: 100%; transform: translateX(-100%); }
}
/* hero 2, 1101–1599: coloana e prea îngustă pentru un rând; pașii se rup în coloană, ca să nu intre peste poză */
@media (min-width: 1101px) and (max-width: 1599px) {
  .hero-birou .parcurs { width: auto; max-width: none; left: auto; transform: none; }
  .hero-birou .parcurs-pasi { flex-wrap: wrap; }
}
@media (min-width: 1101px) and (max-width: 1280px) {
  .parcurs-pas { font-size: 13px; }
  .parcurs-pasi { gap: 6px 14px; }
}

/* ---------- T-131: hero landing pe toată lățimea, poza hero v5, fără voal ---------- */
/* 801–1100: stiva rămâne, cu poza nouă */
@media (min-width: 801px) and (max-width: 1100px) {
  .hero-foto:not(.faza):not(.hero-produs-foto):not(.hero-buildlab) .hero-poza img { object-position: 78% 30%; }
}
/* ≥ 1101: poza pe toată lățimea, ancorată la stânga (fereastra liberă stă sub text); hero mai înalt pe ecrane late, ca Andrei să rămână întreg */
@media (min-width: 1101px) {
  .hero-foto:not(.faza):not(.hero-produs-foto):not(.hero-buildlab) .hero-poza { left: 0; right: 0; width: auto; }
  .hero-foto:not(.faza):not(.hero-produs-foto):not(.hero-buildlab) .hero-poza img { object-position: min(0px, 100vw - 1305px) 30%; }
  .hero-foto:not(.faza):not(.hero-produs-foto):not(.hero-buildlab) .hero-poza::after { display: none; }
  .hero-foto:not(.faza):not(.hero-produs-foto):not(.hero-buildlab) .hero-in { min-height: max(620px, 35vw); }
  .hero-foto:not(.faza):not(.hero-produs-foto):not(.hero-buildlab) .hero-in { padding-bottom: calc(64px + 100px); }
  .hero-foto:not(.faza):not(.hero-produs-foto):not(.hero-buildlab) .kicker, .hero-foto:not(.faza):not(.hero-produs-foto):not(.hero-buildlab) .lovitura, .hero-foto:not(.faza):not(.hero-produs-foto):not(.hero-buildlab) .nota { color: var(--navy); }
}

/* ---------- T-133: reparații QA 7 ---------- */
/* QA7-001: hero 2 /produs, 801–1100: stivă ca hero 1 (textul pe alb sus, poza dedesubt) */
@media (min-width: 801px) and (max-width: 1100px) {
  .hero-birou { display: flex; flex-direction: column; }
  .hero-birou .hero-in { order: 1; width: 100%; max-width: none; margin: 0; min-height: 0; padding: 44px 40px 32px; display: block; }
  .hero-birou .hero-text { max-width: 40rem; }
  .hero-birou .hero-poza { order: 2; position: relative; inset: auto; width: 100%; height: clamp(380px, 48vw, 520px); }
  .hero-birou .hero-poza::after { background: linear-gradient(180deg, var(--alb) 0%, rgba(255,255,255,0) 16%); }
  .hero-birou .hero-poza img { object-position: 30% 50%; }
}
/* QA7-002: hero 2, 1101–1599: coloana are cel puțin cât doi pași (301 px), deci banda stă pe maximum 2 rânduri; coloana rămâne pe zona albă */
@media (min-width: 1101px) {
  .hero-birou .hero-text { max-width: max(min(34rem, 26vw), 304px); }
}