/*
 * Prototipul A „Blazonul”, peugeot.neomotors.ro (21.10.2026; runda 3: scutul se deschide la derulare, fără intro,
 * schimbarea modelului în 160 ms, meniul pe grupuri). CSS scris de mână, fără framework.
 * Negru, alb, linii de 1 px și un singur albastru (#0074e8), doar pe butoanele primare și pe focus.
 * Fără gradienți, umbre, colțuri rotunjite, iconițe.
 */

/* ---- Fonturi (OFL, locale, latin + literele românești) -------------------------------------------------------------- */
/* T15: în locul latin-ext (79 KB), doar literele românești Ă ă Ș ș Ț ț (și formele cu sedilă), 9 KB, preîncărcate */
@font-face { font-family: 'Saira'; font-style: normal; font-weight: 100 900; font-stretch: 50% 125%; font-display: swap;
  src: url('/assets/fonts/Saira-normal-ro.woff2') format('woff2');
  unicode-range: U+0102-0103, U+015E-015F, U+0162-0163, U+0218-021B; }
@font-face { font-family: 'Saira'; font-style: normal; font-weight: 100 900; font-stretch: 50% 125%; font-display: swap;
  src: url('/assets/fonts/Saira-normal-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: 'Host Grotesk'; font-style: normal; font-weight: 300 800; font-display: swap;
  src: url('/assets/fonts/HostGrotesk-normal-ro.woff2') format('woff2');
  unicode-range: U+0102-0103, U+015E-015F, U+0162-0163, U+0218-021B; }
@font-face { font-family: 'Host Grotesk'; font-style: normal; font-weight: 300 800; font-display: swap;
  src: url('/assets/fonts/HostGrotesk-normal-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; }

/* ---- Jetoane -------------------------------------------------------------------------------------------------- */
:root {
  --negru: #000; --alb: #fff; --gri-f: #f7f7f7;
  --gri-n: #adaeb2;            /* text secundar pe negru, 9,47:1 */
  --gri-a: #5d5e65;            /* text secundar pe alb, 6,45:1 */
  --linie-a: #e2e2e5; --linie-n: rgba(255, 255, 255, .17);
  --albastru: #0074e8;
  --f-titlu: 'Saira', 'Arial Narrow', Arial, sans-serif;
  --f-text: 'Host Grotesk', 'Segoe UI', Arial, sans-serif;
  --antet: 80px;
  /* containerul: 1312 px la 1440, crește cu ecranul până la 1600 px (la 1920 marginile de 304 px lăsau
     coloanele blazonului peste scut) */
  --m: max(64px, calc((100vw - 1600px) / 2));
  color-scheme: light;
}
@media (max-width: 1099px) { :root { --antet: 64px; } }
@media (max-width: 899px) { :root { --m: 16px; } }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; background: #000; scroll-padding-top: calc(var(--antet) + 16px); }
body { margin: 0; background: #fff; color: #000; font: 400 16px/1.55 var(--f-text); -webkit-font-smoothing: antialiased; overflow-x: clip; }
img, svg { display: block; }
img { max-width: 100%; height: auto; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }
p, h1, h2, h3, ul, dl, dd, figure { margin: 0; }
ul { padding: 0; list-style: none; }
[hidden] { display: none !important; }
:focus { outline: none; }
:focus-visible { outline: 2px solid var(--albastru); outline-offset: 3px; }
/* P3-4: în Chromium segmentele zi / lună / an din input[type=date] nu primesc :focus-visible la Tab: inelul pe câmp */
input[type="date"]:focus, input[type="date"]:focus-within { outline: 2px solid var(--albastru); outline-offset: 3px; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.sari { position: fixed; left: 16px; top: -60px; z-index: 200; background: var(--albastru); color: #fff; padding: 12px 18px; font: 600 12px var(--f-titlu); font-stretch: 125%; text-transform: uppercase; letter-spacing: .07em; text-decoration: none; }
.sari:focus { top: 12px; }
main { display: block; }
main:focus { outline: none; }
.container { margin-left: var(--m); margin-right: var(--m); }
.cifre { font-variant-numeric: tabular-nums; }

/* ---- Tipografie ------------------------------------------------------------------------------------------------- */
.eticheta { font: 500 11.5px/1.3 var(--f-titlu); font-stretch: 125%; text-transform: uppercase; letter-spacing: .07em; }
.titlu { font: 400 48px/1.05 var(--f-titlu); font-stretch: 125%; margin: 10px 0 0; }
.nota { font-size: 13px; line-height: 1.45; }
.credit { font-size: 12px; line-height: 1.4; color: var(--gri-a); }
[data-ton="noapte"] .credit, [data-ton="noapte"] .nota { color: var(--gri-n); }
.link { text-decoration: none; background: none; border: 0; padding: 0 0 1px; cursor: pointer; font: inherit; color: inherit; border-bottom: 1px solid currentColor; }
.link:focus-visible { border-bottom-color: transparent; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
@media (hover: hover) { .link:hover { border-bottom-color: transparent; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; } }
@media (max-width: 899px) {
  .eticheta { font-size: 10.5px; }
  .titlu { font-size: 34px; }
}

/* ---- Butoane ---------------------------------------------------------------------------------------------------- */
.buton { --fg: #000; --bg: #fff; display: inline-flex; align-items: center; justify-content: space-between; gap: 20px; height: 52px; padding: 0 24px; min-width: 240px;
  font: 600 12px/1 var(--f-titlu); font-stretch: 125%; text-transform: uppercase; letter-spacing: .07em; text-decoration: none; border: 1px solid transparent;
  transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s; white-space: nowrap; }
.buton .sageata { font-family: var(--f-text); font-size: 17px; font-weight: 400; letter-spacing: 0; transition: transform .2s ease-out; }
.buton:focus-visible .sageata { transform: translateX(6px); }
/* Perechile primar / secundar (Vlad, 22.10.2026: „pare că se înnegresc amândouă sau se fac albe amândouă”): niciun
   buton nu ia aspectul celuilalt în nicio stare. Primarul rămâne plin (la hover și apăsat doar o nuanță a aceleiași
   umpleri), secundarul rămâne contur (la hover un fundal translucid și linia dublată). Focusul = doar inelul albastru.
   :hover doar pe dispozitivele cu mouse, ca pe telefon starea să nu rămână „lipită” după tap. */
.buton--primar { background: var(--albastru); color: #fff; border-color: var(--albastru); }
.buton--sec { --hov: rgba(0, 0, 0, .07); --apasat: rgba(0, 0, 0, .12); background: transparent; color: var(--fg); border-color: var(--fg); }
[data-ton="noapte"] .buton--sec, .buton--alb { --fg: #fff; --bg: #000; --hov: rgba(255, 255, 255, .14); --apasat: rgba(255, 255, 255, .22); }
[data-ton="zi"] .buton--sec:not(.buton--alb) { --fg: #000; --bg: #fff; --hov: rgba(0, 0, 0, .07); --apasat: rgba(0, 0, 0, .12); }
.buton--plin { background: #fff; color: #000; border-color: #fff; }
.buton--negru { background: #000; color: #fff; border-color: #000; }
@media (hover: hover) {
  .buton:hover .sageata { transform: translateX(6px); }
  .buton--primar:hover { background: #0062c4; border-color: #0062c4; }      /* alb pe #0062c4: 5,9:1 */
  .buton--plin:hover { background: #dcdcdc; border-color: #dcdcdc; }        /* negru pe #dcdcdc: 15:1 */
  .buton--negru:hover { background: #333; border-color: #333; }             /* alb pe #333: 12,6:1 */
  .buton--sec:hover { background: var(--hov); box-shadow: inset 0 0 0 1px var(--fg); }
}
.buton--primar:active { background: #0052a3; border-color: #0052a3; }
.buton--plin:active { background: #c8c8c8; border-color: #c8c8c8; }
.buton--negru:active { background: #4a4a4a; border-color: #4a4a4a; }
.buton--sec:active { background: var(--apasat); box-shadow: inset 0 0 0 1px var(--fg); }
.buton--antet { height: 40px; min-width: 0; padding: 0 18px; gap: 14px; }
.buton--mic { height: 44px; min-width: 0; padding: 0 18px; }
@media (max-width: 899px) { .buton { min-width: 0; width: 100%; } .buton--antet, .buton--mic { width: auto; } }

/* ---- Antetul ---------------------------------------------------------------------------------------------------- */
.antet { position: fixed; top: 0; left: 0; right: 0; height: var(--antet); z-index: 60; background: #000; color: #fff; border-bottom: 1px solid var(--linie-n);
  transition: background-color .2s, color .2s, border-color .2s; }
.antet[data-ton="zi"] { background: #fff; color: #000; border-bottom-color: var(--linie-a); }
.antet__in { height: 100%; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 var(--m); }
.antet__st { display: flex; align-items: center; gap: 36px; min-width: 0; }
.marca { display: flex; flex-direction: column; text-decoration: none; line-height: 1.2; flex: none; }
.marca__nume { font: 600 17px/1.15 var(--f-titlu); font-stretch: 125%; white-space: nowrap; }
.marca__loc { font-size: 12px; color: var(--gri-n); white-space: nowrap; }
.antet[data-ton="zi"] .marca__loc { color: var(--gri-a); }
.antet__nav { display: flex; gap: 26px; }
.antet__nav a { font: 500 15px/1 var(--f-text); text-decoration: none; padding: 8px 0; white-space: nowrap; }
.antet__nav a:hover, .antet__nav a:focus-visible, .antet__nav a[aria-current] { text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 1px; }
.emblema { position: relative; display: block; width: 37px; height: 40px; color: inherit; }
.emblema svg { position: absolute; inset: 0; width: 100%; height: 100%; transition: opacity .2s; }
.emblema__plina { opacity: 0; }
a.emblema:hover .emblema__plina, a.emblema:focus-visible .emblema__plina { opacity: 1; }
a.emblema:hover .emblema__contur, a.emblema:focus-visible .emblema__contur { opacity: 0; }
.antet__dr { justify-self: end; display: flex; align-items: center; gap: 22px; }
.antet__tel { font: 500 15px/1 var(--f-titlu); font-stretch: 112%; text-decoration: none; letter-spacing: .02em; white-space: nowrap; }
.antet__tel:hover, .antet__tel:focus-visible { text-decoration: underline; text-underline-offset: 5px; }
.antet__meniu { display: none; font: 600 12px/1 var(--f-titlu); font-stretch: 125%; text-transform: uppercase; letter-spacing: .07em; text-decoration: none; padding: 16px 0; }
@media (max-width: 1099px) {
  .antet__nav, .antet__tel, .buton--antet { display: none; }
  .antet__meniu { display: block; }
  .emblema { width: 30px; height: 32px; }
  .marca__loc { display: none; }
}

/* ---- Blazonul (primul ecran) --------------------------------------------------------------------------------- */
/* Runda 3 (21.10.2026): scutul se deschide LA DERULARE spre tot ecranul (Vlad: „aia la scroll era mișto”); fără intro
   la încărcare și fără selector. Fotografia stă sub un strat negru cu gaura în forma scutului; site.js (blazon())
   mărește stratul prin transform. Desktop: patru colțuri în jurul scutului. Telefon: scutul, textele, butoanele. */
.blazon { position: relative; background: #000; color: #fff; }
.blazon__scena {
  --sus: 34px;                 /* de la antet la marginea de sus a scutului (inelul e cu 15 px mai sus) */
  --rez: 56px;                 /* sub scut: inelul și aerul */
  --col: 268px;                /* coloanele minime din stânga și din dreapta */
  --gol: 54px;                 /* de la scut la coloană: inelul (14 px) + 40 px */
  --io: 14px;                  /* inelul, la 14 px de scut */
  --ftop: calc(var(--antet) + var(--sus));
  --fh: max(340px, min(calc(100svh - var(--ftop) - var(--rez)), calc((100vw - 2 * var(--m) - 2 * var(--col) - 2 * var(--gol)) / var(--ar))));
  --fw: calc(var(--fh) * var(--ar));
  position: relative; overflow: hidden; min-height: 100svh;
  display: grid; grid-template-columns: minmax(0, 1fr) var(--fw) minmax(0, 1fr); grid-template-rows: var(--fh);
  grid-template-areas: "st scut dr"; column-gap: var(--gol); align-content: start;
  padding: var(--ftop) var(--m) var(--rez); }
.blazon__gaura { grid-area: scut; }
/* fotografia: încadrarea din ferestre.php, raportată la scutul din grilă (aceleași --fw, --fh, --ftop) */
.blazon__foto, .blazon__strat-foto { position: absolute; inset: 0; overflow: hidden; }
.blazon__img { position: absolute; max-width: none;
  --iw: calc(max(var(--fw) * var(--k1), var(--fh) * var(--k2)) * var(--z));
  width: var(--iw); height: calc(var(--iw) / var(--a));
  left: calc(50% - var(--iw) * var(--fx));
  top: calc(var(--ftop) + var(--fh) * var(--ty) - var(--iw) / var(--a) * var(--fy));
  transform-origin: calc(var(--iw) * var(--fx)) calc(var(--iw) / var(--a) * var(--fy)); }
.blazon__strat { position: absolute; left: calc(50% - var(--fw) / 2); top: var(--ftop); width: var(--fw); height: var(--fh); overflow: visible; fill: #000; pointer-events: none; }
.blazon__inel { position: absolute; left: calc(50% - var(--fw) / 2 - var(--io)); width: calc(var(--fw) + 2 * var(--io)); height: calc((var(--fw) + 2 * var(--io)) / var(--ar));
  top: calc(var(--ftop) + var(--fh) / 2 - (var(--fw) + 2 * var(--io)) / var(--ar) / 2);
  overflow: visible; fill: none; stroke: rgba(255, 255, 255, .35); stroke-width: 1px; pointer-events: none; }
.blazon__st, .blazon__dr { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: space-between; min-width: 0; container-type: inline-size; }
.blazon__st { grid-area: st; }
.blazon__dr { grid-area: dr; align-items: flex-end; }
.blazon .eticheta { color: #fff; }
.blazon__nume { --fs: min(112px, calc(100cqw / var(--nk))); font: 400 var(--fs)/.86 var(--f-titlu); font-stretch: 125%; white-space: nowrap; margin: 0 0 22px -.05em; }
.blazon__seg { font-size: 16px; line-height: 1.4; }
.blazon__pret-tel { display: none; }
.blazon__dr > .blazon__sus { width: min(100%, 300px); }
.blazon--model .blazon__dr > .blazon__sus { width: min(100%, 340px); }
.blazon__butoane { display: flex; flex-direction: column; gap: 10px; width: min(100%, 268px); }
.blazon__butoane .buton { width: 100%; min-width: 0; }
/* la schimbarea modelului (gamă, meniu), textele noi revin din 35% opacitate (160 ms) */
.schimbat { animation: revine .16s ease-out; }
@keyframes revine { from { opacity: .35; } to { opacity: 1; } }

/* deschiderea la derulare: doar cu JS și fără „reduce motion”; secțiunea e mai înaltă, scena stă lipită */
@media (prefers-reduced-motion: no-preference) {
  .js .blazon--model:not(.fara-deschidere) { height: 150svh; }
  .js .blazon:not(.fara-deschidere) .blazon__scena { position: sticky; top: 0; height: 100svh; min-height: 0; }
}

@media (min-width: 900px) and (max-width: 1279px) {
  .blazon__scena { --col: 220px; --gol: 44px; }
}
@media (max-width: 899px) {
  .blazon__scena { --sus: 16px; --io: 10px; --rez-t: 250px;
    --fw: max(200px, min(calc(100vw - 40px), calc((100svh - var(--ftop) - var(--rez-t)) * var(--ar))));
    --fh: calc(var(--fw) / var(--ar));
    grid-template-columns: minmax(0, 1fr); grid-template-rows: var(--fh) 1fr auto; grid-template-areas: "scut" "st" "dr";
    column-gap: 0; padding: var(--ftop) 16px max(16px, env(safe-area-inset-bottom)); }
  .blazon--model .blazon__scena { --rez-t: 320px; }
  .p-util .blazon--model .blazon__scena { --rez-t: 390px; }
  .blazon__img { --iw: calc(max(var(--fw) * var(--k1), var(--fh) * var(--k2t)) * var(--zt)); top: calc(var(--ftop) + var(--fh) * var(--tyt) - var(--iw) / var(--a) * var(--fy)); }
  /* numele și prețul stau la mijloc între scut și butoane; butoanele, jos, sub degetul mare */
  .blazon__st, .blazon__dr { container-type: normal; align-items: center; justify-content: center; text-align: center; }
  .blazon__st > .blazon__jos { padding-bottom: 8px; }
  .blazon__st > .blazon__sus { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  /* înălțimea rândului numelui e fixă: numele lungi nu împing butoanele */
  .blazon__nume { --fs: min(64px, calc((100vw - 32px) / var(--nk))); height: 56px; display: flex; align-items: flex-end; justify-content: center; margin: 22px 0 8px; }
  .blazon__seg { font-size: 14px; color: var(--gri-n); }
  .blazon__pret-tel { display: block; margin-top: 10px; font-size: 14px; color: var(--gri-n); }
  .blazon__pret-tel .cifre { font: 500 20px/1.2 var(--f-titlu); font-stretch: 112%; color: #fff; margin: 0 2px; }
  .blazon--model .blazon__pret-tel { display: flex; flex-direction: column; align-items: center; gap: 4px; }
  .blazon--model .blazon__pret-tel .eticheta { color: var(--gri-n); }
  .blazon__pret-mic { font-size: 13px; color: var(--gri-n); }
  .blazon__dr > .blazon__sus { display: none; }
  .blazon__butoane { flex-direction: row; width: 100%; margin-top: 20px; gap: 8px; }
  .blazon__butoane .buton { flex: 1 1 0; padding: 0 12px; justify-content: center; gap: 10px; }
  .blazon--model .blazon__butoane { flex-direction: column; }
  .blazon--model .blazon__butoane .buton { flex: none; height: 48px; }
  .cifre-instr { justify-content: center; }
}
@media (max-width: 374px) {
  .blazon__butoane { flex-direction: column; }
  .blazon__butoane .buton { flex: none; height: 46px; }
}

/* ---- Fereastra-scut (primul ecran, gamă, meniu, test drive) ---------------------------------------------------- */
.scut { position: relative; }
.scut > .fer { position: absolute; inset: 0; }
.fer { clip-path: url(#clip-scut); container-type: size; overflow: hidden; background: #141414; }
.scut--vitrina .fer { background: var(--gri-f); }
.fer__strat { position: absolute; inset: 0; }
/* încadrarea (ferestre.php): centrul mașinii (fx, fy) cade la (50%, ty) din scut; imaginea acoperă scutul (k1, k2) */
.fer__img { position: absolute; max-width: none;
  --iw: calc(max(100cqw * var(--k1), 100cqh * var(--k2)) * var(--z));
  width: var(--iw); height: calc(var(--iw) / var(--a));
  left: calc(50% - var(--iw) * var(--fx)); top: calc(100cqh * var(--ty) - var(--iw) / var(--a) * var(--fy)); }
@media (max-width: 899px) {
  .fer__img { --iw: calc(max(100cqw * var(--k1), 100cqh * var(--k2t)) * var(--zt)); top: calc(100cqh * var(--tyt) - var(--iw) / var(--a) * var(--fy)); }
}
/* trecerea la alt model: stratul nou apare peste cel vechi în 160 ms (cu intenția de 40 ms și decodarea, sub 300 ms) */
.fer__strat--nou { opacity: 0; transform: scale(1.015); }
.fer__strat--nou.e-gata { opacity: 1; transform: none; transition: opacity .16s cubic-bezier(.2, .7, .2, 1), transform .16s cubic-bezier(.2, .7, .2, 1); }
.inel { position: absolute; left: -14px; top: 50%; width: calc(100% + 28px); height: auto; aspect-ratio: var(--ar); transform: translateY(-50%); overflow: visible;
  fill: none; stroke: rgba(255, 255, 255, .35); stroke-width: 1px; pointer-events: none; }
.scut--vitrina .inel { stroke: #000; }
@media (max-width: 899px) { .inel { left: -10px; width: calc(100% + 20px); } }

/* ---- Gama: inscripția ------------------------------------------------------------------------------------------- */
/* Numele, fără prețuri, urmează marginea stângă a scutului (site.js, aseaza); în dreapta, modelul ales, cu prețul
   de pornire cu TVA. Schimbarea: 220 ms (Fereastra). */
.gama { background: #fff; color: #000; padding: 120px 0; }
/* pe /modele/ (.gama--modele) gama vine după primul ecran („Cifrele”), cu spațierea de pe acasă; „Toată gama ↓”
   (#gama) o aduce cu marginea de sus chiar sub antet (html are scroll-padding-top = antet + 16 px) */
.gama--modele { scroll-margin-top: -16px; }
.gama__cap { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; }
.gama__corp { position: relative; margin-top: 64px; --gh: min(680px, calc(100svh - 200px)); --gw: calc(var(--gh) * var(--ar)); height: calc(var(--gh) + 56px); }
.gama__scena { position: absolute; left: calc(50% - var(--gw) / 2); top: 0; width: var(--gw); }
.scut--vitrina { width: var(--gw); height: var(--gh); }
.gama__mob { display: none; }
.gama__lista { position: absolute; top: calc(var(--gh) * .035); right: calc(50% + var(--gw) / 2 + 14px + 40px); width: 300px; }
.gama__grup { color: var(--gri-a); text-align: right; height: 30px; display: flex; align-items: center; justify-content: flex-end; }
.gama__lista ul + .gama__grup { margin-top: 40px; }
.irand-li { display: flex; height: max(36px, calc(var(--gh) * .052)); }
.irand { position: relative; flex: 1; display: flex; justify-content: flex-end; align-items: center; text-decoration: none; }
.irand__nume { font: 500 24px/1 var(--f-titlu); font-stretch: 125%; white-space: nowrap; color: #6e6f75; transition: color .15s; }
.irand.activ .irand__nume, .irand:hover .irand__nume, .irand:focus-visible .irand__nume { color: #000; }
.irand__vezi { display: none; }
.irand__ghidaj { position: absolute; left: calc(100% + 8px); top: 50%; width: 32px; height: 1px; background: #000; opacity: 0; transition: opacity .15s; }
.irand__ghidaj::after { content: ''; position: absolute; right: -2.5px; top: -2px; width: 5px; height: 5px; background: #000; border-radius: 50%; }
.irand.activ .irand__ghidaj { opacity: 1; }
.gama__det { position: absolute; top: calc(var(--gh) * .035); left: calc(50% + var(--gw) / 2 + 14px + 48px); right: var(--m); max-width: 340px; container-type: inline-size; }
.gama__det .eticheta { color: var(--gri-a); }
/* margin-top 29 px: fără eticheta „Autoturism / Utilitar” de deasupra (auditul textelor), numele stă tot în dreptul
   primului rând al listei, ca înainte (14 px + rândul etichetei) */
.gama__nume { --fs: min(68px, calc(100cqw / var(--nk))); font: 400 var(--fs)/.95 var(--f-titlu); font-stretch: 125%; margin: 29px 0 14px -.04em; white-space: nowrap; height: 66px; display: flex; align-items: flex-end; }
.gama__seg { font-size: 17px; }
.gama__en { font-size: 15px; color: var(--gri-a); margin-top: 4px; }
.gama__dela { margin-top: 32px; padding-top: 22px; border-top: 1px solid #000; }
.gama__pret { font: 400 44px/1 var(--f-titlu); font-stretch: 118%; margin-top: 10px; white-space: nowrap; }
.gama__tva { font-size: 15px; color: var(--gri-a); margin-top: 8px; }
.gama__butoane { display: flex; flex-direction: column; gap: 10px; margin-top: 32px; }
.gama__butoane .buton { width: min(300px, 100%); min-width: 0; }
.gama__toata { display: none; }
@media (max-width: 1279px) and (min-width: 1100px) {
  .gama__corp { --gh: min(560px, calc(100svh - 220px)); }
  .gama__lista { width: 240px; }
  .irand__nume { font-size: 20px; }
  .gama__butoane .buton { width: 100%; }
}
/* T3: aspectul de telefon al gamei ține până la 1099 px (între 900 și 1100 prețul și butoanele ieșeau din ecran) */
@media (max-width: 1099px) {
  .gama { padding: 72px 0; }
  .gama__cap { flex-direction: column; align-items: flex-start; gap: 12px; }
  .gama__corp { height: auto; margin-top: 24px; --gw: min(calc(100vw - 56px), calc(36svh * var(--ar))); --gh: calc(var(--gw) / var(--ar)); }
  .gama__scena { position: sticky; top: var(--antet); left: auto; width: auto; z-index: 3; background: #fff; padding: 18px var(--m) 12px; border-bottom: 1px solid var(--linie-a); }
  .scut--vitrina { margin: 0 auto; }
  .gama__mob { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-top: 14px; }
  .gama__mnume { font: 400 28px/1 var(--f-titlu); font-stretch: 125%; white-space: nowrap; }
  .gama__mpret { display: flex; align-items: baseline; gap: 6px; font: 500 20px/1.1 var(--f-titlu); font-stretch: 112%; white-space: nowrap; }
  .gama__mmic { font: 400 13px/1.3 var(--f-text); color: var(--gri-a); }
  .gama__lista { position: static; width: auto; padding: 0 var(--m); }   /* pe telefon --m = 16 px, pe tabletă cât containerul */
  .gama__grup { justify-content: flex-start; height: auto; padding: 24px 0 8px; border-bottom: 1px solid #000; }
  .gama__lista ul + .gama__grup { margin-top: 12px; }
  .irand-li { height: auto; min-height: 52px; border-bottom: 1px solid var(--linie-a); }
  .irand { justify-content: space-between; transform: none !important; }
  .irand__nume { font-size: 20px; }
  .irand.activ .irand__vezi { display: inline-flex; gap: 8px; font: 600 11.5px/1 var(--f-titlu); font-stretch: 125%; text-transform: uppercase; letter-spacing: .07em; }
  .irand__ghidaj { display: none; }
  .gama__toata { display: inline-flex; gap: 10px; margin-top: 28px; font: 600 12px/1 var(--f-titlu); font-stretch: 125%; text-transform: uppercase; letter-spacing: .07em; text-decoration: none; padding: 14px 0; }
  .gama__det { display: none; }
}

/* ---- Service ---------------------------------------------------------------------------------------------------- */
.service { background: #000; color: #fff; }
.service__in { display: grid; grid-template-columns: 5fr 7fr; min-height: 640px; }
.service__text { padding: 120px 64px 120px var(--m); display: flex; flex-direction: column; }
.service__lista { margin-top: 40px; border-top: 1px solid var(--linie-n); }
.service__lista li { min-height: 72px; display: flex; flex-direction: column; justify-content: center; padding: 12px 0; border-bottom: 1px solid var(--linie-n); }
.service__nume { font: 500 22px/1.2 var(--f-titlu); font-stretch: 125%; }
.service__det { font-size: 15px; color: var(--gri-n); margin-top: 2px; }
.service__program { margin-top: 28px; font-size: 16px; }
.service__butoane { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.service__foto { position: relative; min-height: 640px; }
.service__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 899px) {
  .service__in { grid-template-columns: 1fr; }
  .service__foto { order: -1; min-height: 0; aspect-ratio: 16 / 10; }
  .service__text { padding: 32px 16px 72px; }
}

/* ---- Pipera 48 / contact --------------------------------------------------------------------------------------- */
.pipera, .contact, .variante, .pagina-form { background: #fff; color: #000; }
.pipera { padding: 128px 0; }
.pipera__grila { display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px; margin-top: 48px; border-top: 1px solid #000; padding-top: 24px; }
.pipera__col .eticheta { margin-bottom: 14px; color: var(--gri-a); }
.pipera__col p + p { margin-top: 10px; }
.pipera__adresa { font-size: 17px; max-width: 24ch; }
.pipera__tel { font: 500 22px/1.2 var(--f-titlu); font-stretch: 112%; text-decoration: none; }
.pipera__col a:not(.pipera__tel) { text-decoration: none; border-bottom: 1px solid currentColor; }
.pipera__butoane { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-top: 56px; }
.pipera__butoane .link { margin-left: 12px; }
.program div { display: flex; justify-content: space-between; gap: 16px; padding: 9px 0; border-bottom: 1px solid var(--linie-a); font-size: 15px; }
.program dt { color: var(--gri-a); }
.program dd { white-space: nowrap; }
[data-ton="noapte"] .program div, .program--noapte div { border-bottom-color: var(--linie-n); }
[data-ton="noapte"] .program dt, .program--noapte dt { color: var(--gri-n); }
/* Pipera 48 pe acasă (runda 3): adresa ca titlu mare, ca numele modelelor; programele și acțiunile în dreapta */
.pipera__in { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 64px; align-items: end; }
.pipera__st { container-type: inline-size; }
.pipera__titlu { font: 400 min(184px, calc(100cqw / 5.5))/.86 var(--f-titlu); font-stretch: 125%; white-space: nowrap; margin: 0 0 40px -.05em; }
.pipera__st .pipera__adresa { font-size: 17px; max-width: none; }
.pipera__st .pipera__tel { display: inline-block; margin-top: 14px; font: 400 40px/1.1 var(--f-titlu); font-stretch: 118%; }
.pipera__st .pipera__tel:hover, .pipera__st .pipera__tel:focus-visible { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }
.pipera__mail { margin-top: 16px; font-size: 15px; line-height: 1.9; }
.pipera__mail a { text-decoration: none; border-bottom: 1px solid var(--linie-a); }
.pipera__mail a:hover, .pipera__mail a:focus-visible { border-bottom-color: currentColor; }
.pipera__prog { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.pipera__prog .eticheta { color: var(--gri-a); padding-bottom: 10px; border-bottom: 1px solid #000; }
.pipera__in .pipera__butoane { flex-direction: column; align-items: stretch; margin-top: 44px; }
.pipera__in .pipera__butoane .buton { width: 100%; }
.pipera__harta { display: inline-block; margin-top: 20px; font-size: 15px; }
@media (max-width: 899px) {
  .pipera { padding: 72px 0; }
  .pipera__grila { grid-template-columns: 1fr; gap: 32px; }
  .pipera__butoane { flex-direction: column; align-items: stretch; }
  .pipera__butoane .link { margin: 12px 0 0; align-self: flex-start; }
  .pipera__in { grid-template-columns: minmax(0, 1fr); gap: 44px; }
  .pipera__titlu { margin: 0 0 24px -.04em; }
  .pipera__st .pipera__tel { font-size: 32px; }
  .pipera__prog { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .pipera__in .pipera__butoane { margin-top: 32px; }
}

/* ---- Subsolul --------------------------------------------------------------------------------------------------- */
.subsol { position: relative; overflow: hidden; background: #000; color: #fff; padding: 96px 0 32px; }
/* filigranul leului: coborât sub rândurile programului și estompat, ca să nu mai treacă pe sub text */
.subsol__leu { position: absolute; right: var(--m); bottom: -290px; height: 560px; width: auto; color: #0d0d0d; pointer-events: none; }
.subsol__in { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; margin: 0 var(--m); }
.subsol__col .eticheta { color: var(--gri-n); margin-bottom: 16px; }
.subsol__col li { padding: 4px 0; }
.subsol__col a { text-decoration: none; }
.subsol__col a:hover, .subsol__col a:focus-visible { text-decoration: underline; text-underline-offset: 4px; }
/* „Toată gama →” sub cele două coloane de modele (pagina /modele/) */
.subsol__toata { display: inline-flex; gap: 10px; margin-top: 22px; padding: 10px 0; font: 600 12px/1 var(--f-titlu); font-stretch: 125%; text-transform: uppercase; letter-spacing: .07em; }
.subsol__toata .sageata { font-family: var(--f-text); transition: transform .2s ease-out; }
.subsol__toata:hover .sageata, .subsol__toata:focus-visible .sageata { transform: translateX(6px); }
.subsol__date { margin-top: 18px; font-size: 14px; color: var(--gri-n); line-height: 1.7; }
.subsol__date a { color: #fff; }
.subsol__prog-titlu { font-size: 14px; margin: 4px 0 2px; }
.subsol .program div { padding: 6px 0; font-size: 14px; }
.subsol__prog-titlu + .program + .subsol__prog-titlu { margin-top: 16px; }
.subsol__jos { position: relative; margin: 96px var(--m) 0; padding-top: 20px; border-top: 1px solid var(--linie-n); display: flex; flex-wrap: wrap; gap: 8px 32px; font-size: 12px; color: var(--gri-n); }
/* paginile de informații (sub utilitare), paginile legale și pictograma SAL (22.10.2026) */
.subsol__info-et { margin-top: 40px; }
.subsol__legal { position: relative; margin: 96px var(--m) 0; padding: 20px 0; border-top: 1px solid var(--linie-n); display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px 32px; }
.subsol__legal ul { display: flex; flex-wrap: wrap; gap: 6px 28px; font-size: 14px; }
.subsol__legal ul a { text-decoration: none; color: var(--gri-n); }
.subsol__legal ul a:hover, .subsol__legal ul a:focus-visible { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.subsol__sal { display: block; flex: none; }
.subsol__sal img { width: 201px; height: 50px; }
.subsol__legal + .subsol__jos { margin-top: 0; }
.subsol__jos p:nth-child(2) { flex: 1 1 420px; }
@media (max-width: 899px) {
  .subsol { padding: 64px 0 24px; }
  .subsol__in { grid-template-columns: 1fr 1fr; gap: 36px 16px; }
  .subsol__col:nth-child(3), .subsol__col:nth-child(4) { grid-column: span 2; }
  .subsol__leu { height: 360px; bottom: -170px; right: -40px; }
  .subsol__jos { margin-top: 56px; flex-direction: column; }
  .subsol__legal { margin-top: 56px; flex-direction: column; align-items: flex-start; }
  .subsol__legal ul { flex-direction: column; gap: 4px; }
  .subsol__legal ul a { display: inline-block; padding: 6px 0; }
  .subsol__jos p:nth-child(2) { flex: none; }
}

/* ---- Meniul ----------------------------------------------------------------------------------------------------- */
/* Runda 3: un dialog, trei moduri (data-mod). „autoturisme” / „utilitare”: doar grupul ales și fereastra cu modelul de
   sub cursor; bara de sus copiază antetul, iar cele două butoane comută grupul. „tot” (sub 1100 px): grupurile, apoi
   Service, Contact, telefonul; „Test drive” lipit jos. Nimic repetat. */
.meniu { position: fixed; inset: 0; z-index: 100; color: #fff; }
.meniu__cutie { position: relative; height: 100%; overflow-y: auto; overscroll-behavior: contain; opacity: 0; transition: opacity .18s ease-out; display: flex; flex-direction: column; background: #000; }
.meniu.deschis .meniu__cutie { opacity: 1; }
.meniu__antet { height: var(--antet); flex: none; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 var(--m); border-bottom: 1px solid var(--linie-n); }
.meniu__ast { display: flex; align-items: center; gap: 36px; min-width: 0; }
.meniu__nav { display: flex; gap: 26px; }
.meniu__nav > a, .meniu__fila { font: 500 15px/1 var(--f-text); text-decoration: none; padding: 8px 0; white-space: nowrap; color: #fff; }
.meniu__nav > a:hover, .meniu__nav > a:focus-visible, .meniu__fila:hover, .meniu__fila:focus-visible, .meniu__fila[aria-expanded="true"] { text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 1px; }
.meniu__antet .marca__loc { color: var(--gri-n); }
.emblema--meniu { justify-self: center; }
.meniu__adr { justify-self: end; display: flex; align-items: center; gap: 22px; }
.meniu__inchide { font: 600 12px/1 var(--f-titlu); font-stretch: 125%; text-transform: uppercase; letter-spacing: .07em; padding: 16px 0; }
.meniu__inchide:hover, .meniu__inchide:focus-visible { text-decoration: underline; text-underline-offset: 5px; }
.meniu__corp { flex: 1; display: grid; grid-template-columns: minmax(360px, 5fr) 7fr; gap: 56px; padding: 56px var(--m) 48px; align-items: start; }
.meniu__et { color: var(--gri-n); padding-bottom: 10px; border-bottom: 1px solid var(--linie-n); }
.mrand { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 13px 0 12px; border-bottom: 1px solid var(--linie-n); text-decoration: none; }
.mrand__nume { font: 400 34px/1.05 var(--f-titlu); font-stretch: 125%; color: #8c8d92; transition: color .12s; white-space: nowrap; }
.mrand__pret { font: 500 16px/1 var(--f-titlu); font-stretch: 112%; color: #8c8d92; white-space: nowrap; transition: color .12s; }
.mrand.activ .mrand__nume, .mrand.activ .mrand__pret, .mrand:hover .mrand__nume, .mrand:hover .mrand__pret, .mrand:focus-visible .mrand__nume, .mrand:focus-visible .mrand__pret { color: #fff; }
/* „De la, cu TVA”: eticheta coloanei de prețuri, deasupra primului preț (în locul notei de sub listă) */
.meniu__dela { color: var(--gri-n); text-align: right; padding-bottom: 10px; }
/* sub listă: „Toată gama →” (pagina /modele/) ca buton alb conturat */
.meniu__subsol { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; margin-top: 28px; }
.meniu__toata { min-width: 260px; }
/* paginile de informații, discret: sub „Toată gama” (modurile unui grup) sau sub Pipera 48 (modul „tot”) */
.meniu__info { display: flex; flex-wrap: wrap; gap: 4px 24px; }
.meniu__info a { display: inline-block; padding: 6px 0; font-size: 14px; color: var(--gri-n); text-decoration: none; }
.meniu__info a:hover, .meniu__info a:focus-visible { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.meniu__info--tot { margin-top: 18px; }
.meniu[data-mod="tot"] .meniu__subsol .meniu__info { display: none; }
.meniu__vitrina { --mh: min(600px, calc(100svh - var(--antet) - 150px)); --mw: calc(var(--mh) * var(--ar)); justify-self: center; width: var(--mw); text-align: center; }
.scut--meniu { width: var(--mw); height: var(--mh); }
.meniu__linkuri a { display: flex; align-items: center; min-height: 54px; border-bottom: 1px solid var(--linie-n); font: 500 21px/1.2 var(--f-titlu); font-stretch: 125%; text-decoration: none; }
.meniu__linkuri a:hover, .meniu__linkuri a:focus-visible { text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }
.meniu__jos { position: sticky; bottom: 0; margin-top: auto; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); background: #000; border-top: 1px solid var(--linie-n); }
.meniu__jos .buton { width: 100%; }
/* modul unui grup (desktop): doar grupul ales; eticheta lui e butonul din bară, deci aici e doar pentru cititoare */
.meniu:not([data-mod="tot"]) .meniu__grup > .meniu__et { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; padding: 0; }
.meniu:not([data-mod="tot"]) .meniu__lista { border-top: 1px solid var(--linie-n); }
.meniu[data-mod="autoturisme"] .meniu__grup[data-grup="utilitare"], .meniu[data-mod="utilitare"] .meniu__grup[data-grup="autoturisme"],
.meniu:not([data-mod="tot"]) .meniu__alte, .meniu:not([data-mod="tot"]) .meniu__jos { display: none; }
/* modul „tot” (telefon, tabletă): grupurile cu etichete, apoi Neo Motors; fără fereastră */
.meniu[data-mod="tot"] .meniu__vitrina { display: none; }
.meniu[data-mod="tot"] .meniu__corp { grid-template-columns: minmax(0, 1fr); gap: 36px; padding: 8px 16px 28px; }
.meniu[data-mod="tot"] .meniu__et { padding-top: 18px; border-bottom-color: #fff; }
.meniu[data-mod="tot"] .meniu__grup + .meniu__grup { margin-top: 14px; }
/* „tot”: eticheta prețurilor stă în rândul titlului de grup, în dreapta, la ambele grupuri (P3-6: pe paginile
   utilitarelor prețul mare e fără TVA, deci și sub „Utilitare” trebuie spus că lista e cu TVA, ca pe desktop) */
.meniu[data-mod="tot"] .meniu__grup { position: relative; }
.meniu[data-mod="tot"] .meniu__dela { position: absolute; right: 0; top: 18px; padding: 0; }
.meniu[data-mod="tot"] .mrand { align-items: center; min-height: 52px; padding: 8px 0; }
.meniu[data-mod="tot"] .mrand__nume { font: 500 21px/1.2 var(--f-titlu); font-stretch: 125%; color: #fff; }
.meniu[data-mod="tot"] .mrand__pret { font-size: 15px; color: #fff; }
/* telefon, tabletă: „Toată gama →” deasupra listelor, vizibil fără derulare în meniu (Vlad: „la /modele/ cum se ajunge?”) */
.meniu[data-mod="tot"] .meniu__gama { display: flex; flex-direction: column; }
.meniu[data-mod="tot"] .meniu__subsol { order: -1; margin: 18px 0 4px; gap: 12px; align-items: stretch; }
.meniu[data-mod="tot"] .meniu__toata { min-width: 0; width: 100%; }
@media (min-width: 700px) {
  .meniu[data-mod="tot"] .meniu__corp { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; padding: 24px var(--m) 40px; }
}
@media (max-width: 1279px) { .mrand__nume { font-size: 28px; } .meniu__tel-sus { display: none; } }
/* 1100–1279 px: antetul și bara meniului aveau doar 6 px între „Contact” și emblemă */
@media (min-width: 1100px) and (max-width: 1279px) {
  .antet__st, .meniu__ast { gap: 26px; }
  .antet__nav, .meniu__nav { gap: 18px; }
}
@media (max-width: 1099px) {
  .meniu__nav, .meniu__tel-sus, .meniu__td-sus, .meniu__antet .marca__loc { display: none; }
}
.fara-derulare { overflow: hidden; }

/* ---- Pagina de model ------------------------------------------------------------------------------------------- */
.comutator__grupuri { display: flex; flex-wrap: wrap; gap: 0 18px; border-bottom: 1px solid var(--linie-n); margin: 10px 0 2px; }
.cfila { height: 44px; font: 500 12px/1 var(--f-titlu); font-stretch: 125%; text-transform: uppercase; letter-spacing: .07em; color: var(--gri-n); border-bottom: 1px solid transparent; margin-bottom: -1px; white-space: nowrap; }
.cfila[aria-selected="true"] { color: #fff; border-bottom-color: #fff; }
@media (hover: hover) { .cfila:hover { color: #fff; } }
.comutator__energii { margin-top: 10px; border-top: 1px solid var(--linie-n); }
.crand { position: relative; width: 100%; display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; min-height: 64px; padding: 12px 0; border-bottom: 1px solid var(--linie-n); text-align: left; color: var(--gri-n); text-decoration: none; }
.crand__st { display: flex; flex-direction: column; gap: 3px; }
.crand__nume { font: 500 17px/1.2 var(--f-titlu); font-stretch: 125%; }
.crand__det, .crand__mic { font: 400 13px/1.35 var(--f-text); color: var(--gri-n); }
.crand__pret { font: 500 19px/1.2 var(--f-titlu); font-stretch: 112%; white-space: nowrap; }
.crand[aria-selected="true"] { color: #fff; }
@media (hover: hover) { .crand:hover { color: #fff; } }
.crand__ghidaj { position: absolute; right: calc(100% + 8px); top: 50%; height: 1px; width: var(--gl, 0px); background: rgba(255, 255, 255, .55); opacity: 0; pointer-events: none; }
.crand__ghidaj::before { content: ''; position: absolute; left: -2.5px; top: -2px; width: 5px; height: 5px; border-radius: 50%; background: #fff; }
.crand[aria-selected="true"] .crand__ghidaj { opacity: 1; }
.crand--link .crand__pret { font: 400 14px/1.3 var(--f-text); }
.crand--link:hover .crand__nume { text-decoration: underline; text-underline-offset: 5px; }
.cifre-instr { display: flex; gap: 24px; margin: 18px 0 6px; }
.ci { display: flex; flex-direction: column; }
/* 44 px treceau peste inelul scutului la 1440 („650 kg” atingea conturul); mărimea urmează lățimea ecranului */
.ci__val { font: 400 clamp(30px, 2.5vw, 40px)/1 var(--f-titlu); font-stretch: 125%; white-space: nowrap; }
.ci__et { font-size: 13px; color: var(--gri-n); margin-top: 6px; }
.slot-telefon { display: none; }
@media (max-width: 899px) {
  .slot-telefon { display: block; background: #000; color: #fff; padding: 8px 16px 40px; }
  .slot-telefon .comutator__grupuri { margin-top: 0; overflow-x: auto; }
  .crand__ghidaj { display: none; }
  .ci__val { font-size: 30px; }
  .cifre-instr { gap: 24px; margin: 10px 0 2px; }
}

/* șina din stânga și bara de jos */
.sina { position: fixed; left: 24px; top: 50%; transform: translateY(-50%); z-index: 40; opacity: 0; pointer-events: none; transition: opacity .2s; }
.sina.vizibila { opacity: 1; pointer-events: auto; }
.sina li a { position: relative; display: block; padding: 6px 0; font: 500 11px/1.2 var(--f-titlu); font-stretch: 125%; text-transform: uppercase; letter-spacing: .07em; text-decoration: none; color: var(--gri-a); }
.sina.pe-noapte li a { color: var(--gri-n); }
.sina li a[aria-current="true"] { color: #000; }
.sina.pe-noapte li a[aria-current="true"] { color: #fff; }
.sina li a[aria-current="true"]::after { content: ''; position: absolute; left: calc(100% + 10px); top: 50%; width: 24px; height: 1px; background: currentColor; }
.bara-jos { display: none; }
@media (max-width: 1099px) {
  .sina { display: none; }
  .bara-jos { position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; height: calc(60px + env(safe-area-inset-bottom)); padding: 8px 16px env(safe-area-inset-bottom); background: #000; color: #fff; border-top: 1px solid var(--linie-n);
    display: flex; align-items: center; justify-content: space-between; gap: 12px; transform: translateY(100%); transition: transform .25s ease-out; }
  .bara-jos.vizibila { transform: none; }
  /* când „208 · de la 21.200 € cu TVA” sau „Partner · de la 21.450 € + TVA” nu încape pe un rând, prețul trece întreg pe rândul doi */
  .bara-jos__pret { font: 500 15px/1.15 var(--f-titlu); font-stretch: 112%; white-space: normal; min-width: 0; }
  .bara-jos__pret [data-bara-pret] { white-space: nowrap; }
  .bara-jos > .buton { flex: none; }
}
@media (min-width: 1100px) {
  .p-model main > section:not(.blazon) > .container { margin-left: max(var(--m), 220px); }
  .p-model .galerie__rand { padding-left: max(var(--m), 220px); scroll-padding-left: max(var(--m), 220px); }
}

/* motorizări */
.motorizari { background: #000; color: #fff; padding: 120px 0; }
.mot__file { display: none; }
.mot__grila { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); margin-top: 56px; border-top: 1px solid var(--linie-n); }
/* runda 3 (audit P2.12): toate coloanele rămân albe (nealese păreau dezactivate); cea aleasă are o regulă de 2 px sus */
.mot__col { position: relative; padding: 0 32px 0 0; color: #fff; }
.mot__col + .mot__col { padding-left: 32px; border-left: 1px solid var(--linie-n); }
.mot__col::before { content: ''; position: absolute; left: 0; right: 0; top: -1px; height: 2px; background: #fff; opacity: 0; transition: opacity .15s; }
.mot__col.ales::before { opacity: 1; }
.mot__col.ales .mot__en { text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }
.mot__cap { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 22px 0 18px; text-align: left; width: 100%; color: inherit; }
.mot__cap:hover .mot__en { text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }
.mot__en { font: 500 17px/1.2 var(--f-titlu); font-stretch: 125%; }
.mot__mot { font-size: 13px; line-height: 1.45; min-height: 1.45em; color: var(--gri-n); }
.mot__cifre div { padding: 14px 0; border-top: 1px solid var(--linie-n); }
.mot__cifre dt { font-size: 13px; color: var(--gri-n); }
.mot__cifre dd { margin-top: 4px; white-space: nowrap; }
.mv { font: 400 40px/1 var(--f-titlu); font-stretch: 125%; }
.mu { font: 400 16px/1 var(--f-titlu); font-stretch: 125%; color: var(--gri-n); margin-left: .35em; }
@media (max-width: 1279px) { .mv { font-size: 32px; } }
@media (max-width: 899px) {
  .motorizari { padding: 72px 0; }
  .mot__file { display: flex; gap: 20px; margin-top: 28px; border-bottom: 1px solid var(--linie-n); overflow-x: auto; }
  .mfila { height: 44px; font: 500 12px/1 var(--f-titlu); font-stretch: 125%; text-transform: uppercase; letter-spacing: .07em; color: var(--gri-n); border-bottom: 1px solid transparent; margin-bottom: -1px; white-space: nowrap; }
  .mfila[aria-selected="true"] { color: #fff; border-bottom-color: #fff; }
  .mot__grila { grid-template-columns: 1fr; margin-top: 0; border-top: 0; }
  .mot__col { padding: 0 !important; border: 0 !important; }
  .mot__col:not(.ales) { display: none; }
  .mot__cap { pointer-events: none; }
  .mot__mot:empty { display: none; }   /* o singură coloană: n-are cu ce se alinia */
  .mv { font-size: 34px; }
}

/* culori */
.culori { background: var(--gri-f); color: #000; padding: 120px 0 96px; }
.culori__scena { position: relative; width: min(1100px, calc(100vw - 32px)); margin: 8px auto 0; }
/* cu șina din stânga, scena se centrează în coloana conținutului (altfel spatele mașinii atingea șina) */
@media (min-width: 1100px) {
  .p-model .culori__scena { width: min(1100px, calc(100% - max(var(--m), 220px) - var(--m)));
    margin-left: calc(max(var(--m), 220px) + (100% - max(var(--m), 220px) - var(--m) - min(1100px, calc(100% - max(var(--m), 220px) - var(--m)))) / 2); }
}
.culori__masina { position: relative; width: 100%; aspect-ratio: 2.25; }
.culori__img { position: absolute; left: 0; bottom: calc(var(--cj) * -100% * 2.25); /* % din înălțime: cj e fracție din lățime (2,25 × înălțimea) */ width: 100%; height: auto; transition: opacity .22s; }
.culori__img:not(.este) { opacity: 0; }
.culori__podea { display: block; height: 1px; background: var(--linie-a); }
/* runda 3: titlul secțiunii e numele culorii alese; prețul ei dedesubt */
.culori__et { color: var(--gri-a); }
.culori__ales { min-height: 84px; }
.culori__nume { margin-top: 10px; }
.culori__pret { font-size: 15px; color: var(--gri-a); margin-top: 8px; }
.culori__mostre { display: flex; flex-wrap: wrap; justify-content: center; margin-top: 48px; }
.mostra { position: relative; width: 48px; height: 48px; display: grid; place-items: center; }
.mostra::before { content: ''; width: 24px; height: 24px; background: var(--hex); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12); }
.mostra::after { content: ''; position: absolute; left: 9px; top: 9px; width: 30px; height: 30px; border: 1px solid transparent; }
.mostra[aria-checked="true"]::after { border-color: #000; }
@media (max-width: 899px) {
  .culori { padding: 72px 0; }
  .culori__scena { margin-top: 16px; }
  .culori__ales { min-height: 0; }
  .culori__nume { font-size: 30px; }
}

/* versiuni și prețuri */
.versiuni { background: #fff; color: #000; padding: 120px 0 96px; }
.filtre, .file { display: flex; flex-wrap: wrap; gap: 0 26px; border-bottom: 1px solid var(--linie-a); margin-top: 40px; }
.filtru, .fila { min-width: 44px; height: 44px; font: 500 12px/1 var(--f-titlu); font-stretch: 125%; text-transform: uppercase; letter-spacing: .07em; color: var(--gri-a); border-bottom: 1px solid transparent; margin-bottom: -1px; white-space: nowrap; }
.filtru[aria-selected="true"], .fila[aria-selected="true"] { color: #000; border-bottom-color: #000; }
@media (hover: hover) { .filtru:hover, .fila:hover { color: #000; } }
.tabel-v { width: 100%; border-collapse: collapse; margin-top: 8px; }
.tabel-v th, .tabel-v td { text-align: left; padding: 0 16px 0 0; vertical-align: middle; font-weight: 400; }
.tabel-v thead th { font: 500 11px/1.2 var(--f-titlu); font-stretch: 125%; text-transform: uppercase; letter-spacing: .07em; color: var(--gri-a); padding-top: 18px; padding-bottom: 10px; border-bottom: 1px solid #000; }
.tabel-v .num { text-align: right; }
.tv-grupa__et { font: 500 11px/1.2 var(--f-titlu) !important; font-stretch: 125% !important; text-transform: uppercase; letter-spacing: .07em; color: var(--gri-a); padding: 28px 0 8px !important; border-bottom: 1px solid var(--linie-a); text-align: left; }
.tv__rand > * { height: 64px; border-bottom: 1px solid var(--linie-a); }
.tv__ech { font: 500 15px/1.2 var(--f-titlu) !important; font-stretch: 125% !important; letter-spacing: .03em; white-space: nowrap; }
.tv__car { font-size: 14px; color: var(--gri-a); }
.tv__mot { font-size: 15px; }
.tv__cp { font-size: 15px; }
.tv__mare { font: 500 22px/1 var(--f-titlu); font-stretch: 112%; white-space: nowrap; }
.tv__mare sup { font-size: 12px; margin-left: 2px; }
.tv__mic { font-size: 13px; color: var(--gri-a); white-space: nowrap; }
.tv__tva { font-size: 12px; color: var(--gri-a); font-family: var(--f-text); font-stretch: 100%; font-weight: 400; }
/* pe desktop capul tabelului spune TVA-ul („Preț cu TVA / Fără TVA”, la utilitare „Fără TVA / Cu TVA”); pe telefon
   capul nu se vede, deci sufixele apar lângă fiecare preț */
.tabel-v .tv__tva { display: none; }
.tv__act { white-space: nowrap; text-align: right !important; padding-right: 0 !important; }
.tv__oferta { font-size: 14px; margin-left: 16px; }
/* „Dotări +” (V1): text vizibil și semn; „+” închis, „−” deschis */
.tv__des { display: inline-flex; align-items: center; gap: 12px; height: 36px; padding: 0 12px 0 14px; vertical-align: middle; border: 1px solid var(--linie-a);
  font: 500 11px/1 var(--f-titlu); font-stretch: 125%; text-transform: uppercase; letter-spacing: .07em; transition: border-color .2s, box-shadow .2s; }
.tv__des[aria-expanded="true"] { border-color: #000; }
@media (hover: hover) { .tv__des:hover { border-color: #000; box-shadow: inset 0 0 0 1px #000; } }
.tv__plus { position: relative; width: 12px; height: 12px; flex: none; }
.tv__plus::before, .tv__plus::after { content: ''; position: absolute; left: 50%; top: 50%; width: 12px; height: 1px; background: #000; transform: translate(-50%, -50%); transition: transform .3s; }
.tv__plus::after { transform: translate(-50%, -50%) rotate(90deg); }
.tv__des[aria-expanded="true"] .tv__plus::after { transform: translate(-50%, -50%) rotate(0deg); }
.tv__plusrand td { padding: 0 !important; }
.tv__desc { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .3s ease; }
.tv__desc > div { overflow: hidden; }
.tv__desc.deschis { grid-template-rows: 1fr; }
.tv__desc.deschis > div { padding: 18px 0 24px; border-bottom: 1px solid var(--linie-a); }
.tv__plus-titlu { font-size: 14px; color: var(--gri-a); margin-bottom: 10px; }
.tv__tot { margin-top: 28px; }
.tv__jos { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-top: 18px; font-size: 14px; }
.tv__jos .link { position: relative; }
.tv__jos .link::after { content: ''; position: absolute; inset: -12px -6px; }   /* ținta de atingere ≥ 44 px, fără să mute linia */
.tv__inchide { margin-left: auto; }
.lista-dotari { columns: 2; column-gap: 40px; font-size: 14px; line-height: 1.45; }
.lista-dotari li { break-inside: avoid; padding: 7px 0; border-bottom: 1px solid var(--linie-a); }
.lista-dotari--3 { columns: 3; font-size: 15px; }
.lista-dotari .peste { display: none; }
.lista-dotari.toate .peste { display: block; }
.versiuni__note { margin-top: 28px; font-size: 13px; color: var(--gri-a); display: grid; gap: 6px; }
@media (max-width: 899px) {
  .versiuni { padding: 72px 0; }
  .filtre { flex-wrap: nowrap; overflow-x: auto; gap: 0 20px; }
  /* P3-2: cât mai e ceva de derulat la dreapta (la 320 px „Diesel” / „Electric” la 308), marginea se estompează */
  .filtre.mai-e, .file.mai-e { -webkit-mask-image: linear-gradient(90deg, #000 78%, transparent); mask-image: linear-gradient(90deg, #000 78%, transparent); }
  .tabel-v thead { display: none; }
  .tabel-v, .tabel-v tbody, .tabel-v .tv-grupa tr, .tabel-v .tv__plusrand, .tabel-v .tv__plusrand td { display: block; }
  /* „Dotări” lângă preț, „Cere ofertă” sub el (V1: la 320 px cele două nu mai încap pe un rând cu prețul) */
  .tabel-v tr.tv__rand { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "ech ech" "car car" "mot mot" "mare des" "mic of"; padding: 14px 0; border-bottom: 1px solid var(--linie-a); column-gap: 12px; }
  .tv__rand > * { height: auto; border: 0 !important; padding: 0 !important; }
  .tv__ech { grid-area: ech; white-space: normal; font-size: 14px !important; }
  .tv__mot { grid-area: mot; font-size: 14px; color: var(--gri-a); }
  /* caroseria rămâne pe telefon (verificatorul, 22.10.2026): la Expert / Boxer / Partner / 308 deosebește rândurile la fel */
  .tv__car { grid-area: car; font-size: 14px; }
  .tv__cp { display: none; }
  .tv__mare { grid-area: mare; margin-top: 10px; text-align: left !important; }
  .tv__mic { grid-area: mic; text-align: left !important; margin-top: 4px; }
  .tv__act { display: contents; }
  .tv__oferta { grid-area: of; justify-self: end; align-self: end; margin: 8px 0 0; font-size: 13px; }
  .tv__des { grid-area: des; justify-self: end; align-self: end; height: 44px; }
  .tv-grupa__et { display: block; }
  .lista-dotari, .lista-dotari--3 { columns: 1; }
  .tabel-v .tv__tva { display: inline; }
}

/* dotări */
.dotari { background: #fff; color: #000; padding: 96px 0; border-top: 1px solid var(--linie-a); }
.dotari__bara { display: flex; justify-content: space-between; align-items: flex-end; gap: 0 24px; flex-wrap: wrap; border-bottom: 1px solid var(--linie-a); margin-top: 40px; }
.dotari__bara .file { margin-top: 0; border-bottom: 0; }
.comut { display: inline-flex; align-items: center; gap: 12px; font-size: 14px; min-height: 44px; cursor: pointer; }
.comut input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.comut__pista { position: relative; width: 36px; height: 20px; border: 1px solid #000; flex: none; }
.comut__pista::after { content: ''; position: absolute; left: 3px; top: 3px; width: 12px; height: 12px; background: #000; transition: transform .2s; }
.comut input:checked + .comut__pista::after { transform: translateX(16px); }
.comut input:focus-visible + .comut__pista { outline: 2px solid var(--albastru); outline-offset: 3px; }
.dotari__panou { margin-top: 24px; }
.dotari__fata { font-size: 14px; color: var(--gri-a); margin-bottom: 8px; }
.dotari__toate { margin-top: 20px; font-size: 15px; }
@media (max-width: 899px) { .dotari { padding: 72px 0; } .dotari__bara .file { flex-wrap: nowrap; overflow-x: auto; max-width: 100%; } }

/* specificații */
.specificatii { background: #fff; color: #000; padding: 96px 0 120px; border-top: 1px solid var(--linie-a); overflow-x: clip; }
.desen { width: min(940px, calc(100vw - 2 * var(--m) - 300px)); margin: 56px auto 0; }
@media (min-width: 1100px) { .p-model .desen { margin-left: max(220px, calc(50% - 470px + 40px)); } }
.desen__cutie { position: relative; width: 100%; aspect-ratio: var(--w) / var(--h); margin-bottom: calc((var(--sub) - var(--h)) / var(--w) * 100% + 52px); }
.desen__img { position: absolute; inset: 0; width: 100%; height: 100%; }
.desen__cote { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; fill: none; stroke: #000; stroke-width: 1px; }
.desen__cote .podea { stroke: var(--linie-a); }
.cota-cutie { stroke-dasharray: 3 4; }
.cota-et { position: absolute; transform: translateX(-50%); font-size: 13px; color: var(--gri-a); white-space: nowrap; }
.cota-et .cifre { font: 500 15px/1 var(--f-titlu); font-stretch: 112%; color: #000; margin-right: 4px; }
.cota-et--h { transform: translateY(-50%); }
.cota-et--a { transform: translateX(-50%); }
.marfa { margin-top: 8px; padding-top: 18px; border-top: 1px solid var(--linie-a); }
.marfa .eticheta { color: var(--gri-a); }
.marfa__cifre { display: flex; flex-wrap: wrap; gap: 12px 40px; margin-top: 12px; }
.marfa__cifre dt { font-size: 13px; color: var(--gri-a); }
.marfa__cifre dd { font: 500 22px/1.2 var(--f-titlu); font-stretch: 112%; }
.spec__file { margin-top: 48px; }
.spec__bloc { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 56px; margin-top: 32px; align-items: start; }
.spec__sec { margin-bottom: 28px; }
.spec__titlu { color: var(--gri-a); padding-bottom: 8px; border-bottom: 1px solid #000; margin: 0; }
.spec__randuri div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; padding: 9px 0; border-bottom: 1px solid var(--linie-a); }
.spec__randuri dt { font-size: 14px; color: var(--gri-a); overflow-wrap: anywhere; }
.spec__randuri dd { font-size: 15px; overflow-wrap: anywhere; }
/* masele pe motorizări (Partner): tabel pe toată lățimea, un rând pe motorizare */
.spec__sec--lat { grid-column: 1 / -1; }
.spec__matrice-cutie { overflow-x: auto; }
.spec__matrice { width: 100%; border-collapse: collapse; font-size: 15px; }
.spec__matrice th, .spec__matrice td { padding: 10px 0 10px 20px; border-bottom: 1px solid var(--linie-a); text-align: right; font-weight: 400; vertical-align: top; }
.spec__matrice th:first-child, .spec__matrice td:first-child { padding-left: 0; text-align: left; }
.spec__matrice thead th { font: 500 11px/1.35 var(--f-titlu); font-stretch: 125%; text-transform: uppercase; letter-spacing: .07em; color: var(--gri-a); vertical-align: bottom; padding-top: 14px; }
.spec__matrice tbody th[scope="row"] { font-size: 15px; white-space: nowrap; }
.spec__mgrup th { padding-top: 22px; font-size: 13px; color: var(--gri-a); border-bottom-color: #000; }
.spec__matrice td { white-space: nowrap; }
@media (max-width: 899px) {
  .specificatii { padding: 72px 0; }
  .desen { width: calc(100vw - 96px); margin: 32px 0 0 16px; }
  .cota-et--h { writing-mode: vertical-rl; transform: translate(-4px, -50%) rotate(180deg); }
  .spec__file { flex-wrap: nowrap; overflow-x: auto; }
  .spec__bloc { grid-template-columns: minmax(0, 1fr); }   /* minmax: tabelul de mase (620 px) nu mai lățește coloana */
  .spec__randuri div { grid-template-columns: 1fr; gap: 2px; }
  .spec__matrice { min-width: 620px; font-size: 14px; }
  .cota-et { font-size: 11px; }
  .cota-et--a { display: none; }
  .cota-et .cifre { font-size: 13px; }
}

/* galerie */
.galerie { background: #000; color: #fff; padding: 120px 0 96px; }
.galerie .eticheta { color: var(--gri-n); }
.galerie__cap { display: flex; justify-content: space-between; align-items: flex-end; }
.galerie__nav { display: flex; gap: 10px; }
.galerie__b { width: 48px; height: 48px; border: 1px solid #fff; font-size: 22px; line-height: 1; }
@media (hover: hover) { .galerie__b:hover { background: rgba(255, 255, 255, .14); box-shadow: inset 0 0 0 1px #fff; } }
.galerie__rand { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 48px var(--m) 20px; scroll-padding: 0 var(--m); scrollbar-width: thin; scrollbar-color: #444 #000; }
.galerie__el { flex: none; width: min(72vw, 1040px); aspect-ratio: 16 / 9; scroll-snap-align: start; }
.galerie__img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 899px) {
  .galerie { padding: 72px 0; }
  .galerie__nav { display: none; }
  .galerie__rand { padding: 24px 16px 16px; scroll-padding: 0 16px; }
  .galerie__el { width: 88vw; }
}

/* test drive */
.td { background: #000; color: #fff; padding: 120px 0; }
.td--pagina { padding-top: calc(var(--antet) + 72px); min-height: 100svh; }
.td__in { display: grid; grid-template-columns: 6fr 6fr; gap: 64px; margin: 0 var(--m); align-items: start; }
.td .eticheta { color: var(--gri-n); }
.td__intro { margin-top: 14px; color: var(--gri-n); max-width: 40ch; }
.td__fer { --tw: min(100%, 460px); display: flex; flex-direction: column; align-items: center; padding-top: 20px; }
.scut--td { width: var(--tw); aspect-ratio: var(--ar); }
@media (min-width: 1100px) { .p-model .td__in { margin-left: max(var(--m), 220px); } }
@media (max-width: 899px) {
  .td { padding: 72px 0; }
  .td--pagina { padding-top: calc(var(--antet) + 32px); }
  .td__in { grid-template-columns: 1fr; gap: 48px; margin: 0 16px; }
  .td__fer { --tw: min(100%, 300px); }
  /* /test-drive/ pe telefon: scutul, apoi titlul și formularul (adresa și programul stau în subsol) */
  .td--pagina .td__fer { display: contents; }
  .td--pagina .scut--td { order: -2; justify-self: center; }
}

/* formulare */
.formular { margin-top: 36px; display: grid; gap: 18px; max-width: 640px; }
.camp-rand { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.camp { position: relative; display: flex; flex-direction: column; min-width: 0; }
.camp__et { font-size: 13px; color: var(--gri-n); margin-bottom: 6px; }
.formular input:not([type="checkbox"]), .formular select, .formular textarea { width: 100%; min-height: 52px; padding: 12px 14px; border: 1px solid rgba(255, 255, 255, .35); border-radius: 0; background: transparent; color: inherit; font-size: 16px; }
.formular select { appearance: none; -webkit-appearance: none; padding-right: 40px; }
.camp--select::after { content: ''; position: absolute; right: 18px; top: 44px; width: 7px; height: 7px; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: rotate(45deg); pointer-events: none; }
.formular select option, .formular select optgroup { background: #000; color: #fff; }
.formular textarea { resize: vertical; min-height: 96px; }
.formular input::-webkit-calendar-picker-indicator { filter: invert(1); }
.formular .invalid input, .formular .invalid select, .formular .invalid textarea { border-color: #ff8a80; }
.camp__eroare { font-size: 13px; color: #ff8a80; margin-top: 6px; }
.camp__eroare:empty { display: none; }
.bifa { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; line-height: 1.45; cursor: pointer; }
.bifa input { width: 20px; height: 20px; margin: 1px 0 0; flex: none; accent-color: var(--albastru); }
.formular .buton { justify-self: start; min-width: 240px; }
.formular__stare { font-size: 15px; padding: 12px 0; border-top: 1px solid currentColor; }
.formular__stare:empty { display: none; }
.formular--zi .camp__et { color: var(--gri-a); }
.formular--zi input:not([type="checkbox"]), .formular--zi select, .formular--zi textarea { border-color: #000; }
.formular--zi select option, .formular--zi select optgroup { background: #fff; color: #000; }
.formular--zi input::-webkit-calendar-picker-indicator { filter: none; }
.formular--zi .camp__eroare { color: #b3261e; }
.formular--zi .invalid input, .formular--zi .invalid select, .formular--zi .invalid textarea { border-color: #b3261e; }
@media (max-width: 899px) {
  .camp-rand { grid-template-columns: 1fr; }
  .formular .buton { width: 100%; justify-self: stretch; }
}

/* formularele reale: butonul cât pleacă cererea, linkul din bifă, confirmarea care ia locul formularului */
.formular .buton[aria-disabled="true"] { opacity: .6; pointer-events: none; }
.bifa .link { padding-bottom: 0; }
.formular-gata { margin-top: 36px; max-width: 640px; padding-top: 20px; border-top: 1px solid currentColor; display: grid; gap: 14px; }
.formular-gata:focus { outline: none; }
.formular-gata .eticheta { color: var(--gri-n); }
.formular-gata__titlu { font: 400 26px/1.2 var(--f-titlu); font-stretch: 112%; }
.formular-gata__text { color: var(--gri-n); max-width: 52ch; }
.formular-gata__text .link { color: #fff; }
[data-ton="zi"] .formular-gata .eticheta, [data-ton="zi"] .formular-gata__text { color: var(--gri-a); }
[data-ton="zi"] .formular-gata__text .link { color: #000; }
.pagina-form .formular-gata { margin-top: 0; }
.td .pagina-form__versiune { border-top-color: #fff; border-bottom-color: var(--linie-n); max-width: 640px; }

/* pagini simple */
.pagina-form { padding: 96px 0 128px; border-top: 1px solid var(--linie-a); }
.pagina-form__in { display: grid; grid-template-columns: 5fr 7fr; gap: 64px; }
.pagina-form__intro { margin-top: 14px; color: var(--gri-a); max-width: 36ch; }
.pagina-form__mail { margin-top: 20px; }
.pagina-form__versiune { margin-top: 16px; font-size: 15px; padding: 12px 0; border-top: 1px solid #000; border-bottom: 1px solid var(--linie-a); }
.pagina-form .formular { margin-top: 0; }
.contact { padding: calc(var(--antet) + 72px) 0 64px; }
.contact .eticheta { color: var(--gri-a); }
.contact .link { display: inline-block; margin-top: 32px; }
.p-service .service { padding-top: var(--antet); }
.eroare { background: #000; color: #fff; min-height: 70svh; padding: calc(var(--antet) + 96px) 0 96px; }
.eroare .eticheta { color: var(--gri-n); }
.eroare__linkuri { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 40px; }
/* /modele/: toate variantele, pe familii (o familie = o pagină de model): 4 coloane pe desktop, una pe telefon */
.variante { padding: 0 0 128px; }
.variante__titlu { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px 40px; flex-wrap: wrap; }
.variante__nota { color: var(--gri-a); }
.variante__cat { color: var(--gri-a); margin-top: 56px; padding-bottom: 10px; border-bottom: 1px solid #000; }
.variante__grila { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 44px 40px; margin-top: 28px; }
.vfam__cap { margin: 0; }
.vfam__cap a { display: inline-flex; align-items: baseline; gap: 12px; font: 400 26px/1.1 var(--f-titlu); font-stretch: 125%; text-decoration: none; padding: 2px 0 12px; white-space: nowrap; }
.vfam__cap .sageata { font: 400 17px/1 var(--f-text); transition: transform .2s ease-out; }
.vfam__cap a:hover .sageata, .vfam__cap a:focus-visible .sageata { transform: translateX(6px); }
.vfam ul { border-top: 1px solid var(--linie-a); }
@media (max-width: 1199px) { .variante__grila { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 899px) { .variante__grila { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 24px; } .variante__cat { margin-top: 40px; } }
@media (max-width: 599px) { .variante__grila { grid-template-columns: minmax(0, 1fr); gap: 32px; margin-top: 20px; } .vfam__cap a { font-size: 22px; padding-bottom: 10px; } }
.vrand { display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 60px; padding: 10px 0; border-bottom: 1px solid var(--linie-a); text-decoration: none; }
.vrand__st { display: flex; flex-direction: column; min-width: 0; }
.vrand__nume { font: 500 17px/1.2 var(--f-titlu); font-stretch: 125%; }
.vrand__en { font-size: 14px; color: var(--gri-a); }
.vrand__pret { display: flex; flex-direction: column; align-items: flex-end; text-align: right; }
.vrand__pret__mare { font: 500 17px/1.2 var(--f-titlu); font-stretch: 112%; white-space: nowrap; }
.vrand__pret__mic { font-size: 13px; color: var(--gri-a); white-space: nowrap; }
.vrand:hover .vrand__nume, .vrand:focus-visible .vrand__nume { text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }
@media (max-width: 899px) {
  .pagina-form { padding: 56px 0 64px; }
  .pagina-form__in { grid-template-columns: 1fr; gap: 32px; }
  .contact { padding: calc(var(--antet) + 40px) 0 40px; }
  .variante { padding-bottom: 64px; }
}

/* banda de garanție și documente */
.banda { background: #fff; color: #000; padding: 56px 0; border-top: 1px solid var(--linie-a); }
.banda__in { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; }
.banda__rand .eticheta { color: var(--gri-a); margin-bottom: 12px; }
.banda__rand li { padding: 6px 0; font-size: 15px; }
@media (max-width: 899px) { .banda__in { grid-template-columns: 1fr; gap: 32px; } .p-model .banda { padding-bottom: 96px; } }

/* ---- Fără mișcare ----------------------------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; scroll-behavior: auto !important; }
  .schimbat { animation: none; }
}
