/* ============================================================================
   x431.ro — foaia de stil unică. Fără framework, fără CDN, fonturi self-hosted.
   Identitate: „panou de atelier" — Roboto (cerut de Marius, 21.08.2026), titluri
   cu majuscule și greutate mare, text tehnic lizibil, portocaliu de semnalizare,
   gri de scule. Ierarhia vine din greutate și majuscule, nu din două familii.
   Deliberat diferit de magazin (care e albastru comercial) și de autel.ro.
   ========================================================================== */


*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--font-b);font-size:1.0313rem;line-height:1.62;
  -webkit-font-smoothing:antialiased;}
img{max-width:100%;height:auto;display:block;}
a{color:var(--semnal-inchis);text-underline-offset:.18em;}
a:hover{color:var(--semnal);}
/* Roboto nu e condensat: la aceeași dimensiune, un titlu cu majuscule ocupă cu
   ~20% mai multă lățime decât în Barlow Condensed și se rupe pe telefon. De aceea
   scad dimensiunile, cresc puțin înălțimea rândului (Roboto are x-height mai mare,
   1,06 îl sufoca) și strâng spațierea, ca titlul să rămână un bloc compact. */
h1,h2,h3,h4{font-family:var(--font-t);font-weight:700;line-height:1.14;
  letter-spacing:-.015em;margin:0 0 .5em;text-wrap:balance;}
h1{font-size:clamp(1.85rem,5vw,2.9rem);text-transform:uppercase;}
h2{font-size:clamp(1.38rem,3vw,1.95rem);text-transform:uppercase;}
h3{font-size:clamp(1.14rem,2vw,1.32rem);letter-spacing:-.01em;}
h4{font-size:1.02rem;letter-spacing:-.01em;}
p{margin:0 0 1.05em;}
ul,ol{padding-left:1.15rem;}
li{margin-bottom:.4em;}
hr{border:0;border-top:1px solid var(--line);margin:2.5rem 0;}
table{border-collapse:collapse;width:100%;}
:focus-visible{outline:3px solid var(--semnal);outline-offset:2px;}

.wrap{max-width:var(--lat);margin:0 auto;padding:0 1.15rem;}
.wrap--ingust{max-width:780px;}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.skip{position:absolute;left:-9999px;}
.skip:focus{left:.5rem;top:.5rem;z-index:99;background:var(--alb);padding:.6rem 1rem;}

/* ── eticheta („sticker de verificare”) ──────────────────────────────────── */
.eticheta{display:inline-block;font-family:var(--font-t);font-weight:700;
  font-size:.74rem;letter-spacing:.09em;text-transform:uppercase;
  padding:.28rem .55rem;background:var(--semnal-plin);color:var(--alb);border-radius:2px;}
.eticheta--gol{background:transparent;color:var(--ink-2);border:1px solid var(--line);}
.eticheta--verde{background:var(--verde);}

/* ── bara de dev ─────────────────────────────────────────────────────────── */
.bara-dev{background:var(--dev-fundal);color:var(--dev-text);font-family:var(--font-t);font-weight:600;
  font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;text-align:center;
  padding:.42rem 1rem;}

/* ── antet ───────────────────────────────────────────────────────────────── */
.antet{background:var(--dark);color:var(--alb);position:sticky;top:0;z-index:40;
  border-bottom:3px solid var(--semnal);}
.antet__rand{display:flex;align-items:center;gap:1rem;min-height:62px;}
.marca{display:inline-flex;align-items:center;gap:.3rem;color:var(--alb);
  text-decoration:none;font-family:var(--font-t);font-weight:700;
  font-size:1.42rem;letter-spacing:-.02em;text-transform:uppercase;}
/* Înălțimea e fixată, lățimea se calculează singură. `height` în CSS + `width`/`height`
   în HTML: browserul rezervă locul corect ÎNAINTE să descarce imaginea, deci antetul nu sare. */
.marca img{height:40px;width:auto;display:block;}
.marca b{color:var(--semnal);font-weight:700;}
.marca span{font-family:var(--font-b);font-size:.66rem;font-weight:600;
  letter-spacing:.15em;color:var(--pe-dark-2);text-transform:uppercase;}
.nav{display:none;margin-left:auto;gap:.15rem;}
.nav a{color:var(--pe-dark-nav);text-decoration:none;font-family:var(--font-t);font-weight:500;
  font-size:.92rem;letter-spacing:.02em;text-transform:uppercase;
  padding:.45rem .58rem;border-radius:var(--r);}
.nav a:hover,.nav a[aria-current]{background:var(--dark-hover);color:var(--alb);}
.antet__tel{margin-left:auto;display:inline-flex;align-items:center;gap:.4rem;
  background:var(--semnal-plin);color:var(--alb);text-decoration:none;font-family:var(--font-t);
  font-weight:700;font-size:.94rem;letter-spacing:.02em;padding:.5rem .8rem;border-radius:var(--r);
  white-space:nowrap;}
/* Pe telefon, logo + MENIU + număr nu încap la dimensiunea de desktop, iar numărul se rupea
   pe două rânduri (14.09.2026). Butonul se strânge, nu se rupe. */
@media(max-width:420px){
  .antet__tel{font-size:.84rem;padding:.45rem .55rem;margin-left:.5rem;letter-spacing:0;}
  .meniu-buton{font-size:.85rem;padding:.38rem .55rem;}
}
.antet__tel:hover{background:var(--alb);color:var(--dark);}
.meniu-buton{margin-left:auto;background:none;border:1px solid var(--dark-linie-2);color:var(--alb);
  font-family:var(--font-t);font-weight:700;font-size:.95rem;letter-spacing:.08em;
  text-transform:uppercase;padding:.42rem .7rem;border-radius:var(--r);cursor:pointer;}
.nav-mobil{display:none;background:var(--dark-2);padding:.5rem 0 1rem;}
.nav-mobil.deschis{display:block;}
.nav-mobil a{display:block;color:var(--pe-dark-nav);text-decoration:none;font-family:var(--font-t);
  font-weight:600;font-size:1.12rem;text-transform:uppercase;letter-spacing:.03em;
  padding:.6rem 1.15rem;border-bottom:1px solid var(--dark-linie);}
@media(min-width:1000px){
  .nav{display:flex;}
  .meniu-buton{display:none;}
  .antet__tel{margin-left:.8rem;}
}

/* ── firimituri ──────────────────────────────────────────────────────────── */
.firimituri{font-size:.83rem;color:var(--ink-3);padding-top:.85rem;padding-bottom:.85rem;}
.firimituri ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem;}
.firimituri li+li::before{content:"›";margin-right:.4rem;color:var(--line);}
.firimituri a{color:var(--ink-3);}

/* ── erou ────────────────────────────────────────────────────────────────── */
.erou{background:var(--dark);color:var(--alb);padding:3rem 0 3.2rem;
  background-image:repeating-linear-gradient(135deg,var(--erou-dunga-1) 0 12px,var(--erou-dunga-2) 12px 24px);}
.erou h1{color:var(--alb);margin-bottom:.35em;}
.erou__sub{font-size:1.12rem;color:var(--pe-dark-text);max-width:62ch;margin:0 0 1.6rem;}
.erou__actiuni{display:flex;flex-wrap:wrap;gap:.65rem;}

@media (max-width:520px){.marca img{height:30px;} .marca span{font-size:.58rem;letter-spacing:.1em;}}

/* ── erou cu fotografie de fundal ────────────────────────────────────────────
   Imaginea e un <img> real, nu `background-image`: așa o vede scanerul de
   preîncărcare al browserului, primește `srcset` (deci telefonul ia 20 KB, nu 75)
   și poate fi marcată `fetchpriority="high"`. Un fundal din CSS se descoperă abia
   după ce se parsează foaia de stil — adică prea târziu pentru LCP.
   Voalul de deasupra NU e decorativ: fără el, textul alb pe o fotografie reală
   coboară sub pragul de contrast în zonele luminoase, și se vede exact pe telefon. */
.erou--foto{position:relative;overflow:hidden;padding:4.2rem 0 4.4rem;
  background:var(--dark);background-image:none;}
.erou__fundal{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:72% 50%;z-index:0;}
.erou--foto::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,var(--erou-voal-95) 0%,var(--erou-voal-88) 40%,
    var(--erou-voal-42) 72%,var(--erou-voal-18) 100%);}
.erou--foto .wrap{position:relative;z-index:2;}
@media (max-width:820px){
  .erou--foto{padding:2.6rem 0 2.8rem;}
  .erou__fundal{object-position:64% 50%;}
  /* pe telefon textul stă PESTE toată imaginea, deci voalul trebuie să fie vertical */
  .erou--foto::after{background:linear-gradient(180deg,var(--erou-voal-80) 0%,
    var(--erou-voal-90) 55%,var(--erou-voal-96) 100%);}
}

/* Insigna de dealer — varianta mare, pentru zona de erou. */
.insigna{display:inline-flex;align-items:center;gap:.55rem;
  font-family:var(--font-t);font-weight:700;font-size:.92rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--alb);background:var(--semnal-plin);
  padding:.5rem .95rem;border-radius:3px;margin-bottom:1rem;
  box-shadow:0 2px 14px var(--umbra-buton);}
.insigna svg{flex:none;width:18px;height:18px;}
@media (max-width:520px){.insigna{font-size:.78rem;letter-spacing:.06em;padding:.42rem .7rem;}}

/* ── butoane ─────────────────────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;
  font-family:var(--font-t);font-weight:700;font-size:.99rem;letter-spacing:.02em;
  text-transform:uppercase;text-decoration:none;padding:.72rem 1.25rem;
  border-radius:var(--r);border:2px solid transparent;cursor:pointer;line-height:1.2;}
.btn--primar{background:var(--semnal-plin);color:var(--alb);}
.btn--primar:hover{background:var(--semnal-hover);color:var(--alb);}
.btn--fantoma{background:transparent;color:var(--alb);border-color:var(--fantoma-linie);}
.btn--fantoma:hover{border-color:var(--alb);color:var(--alb);}
.btn--wa{background:var(--verde);color:var(--alb);}
.btn--wa:hover{background:var(--verde-hover);color:var(--alb);}
.btn--linie{background:var(--alb);color:var(--ink);border-color:var(--line);}
.btn--linie:hover{border-color:var(--ink);color:var(--ink);}

/* ── secțiuni ────────────────────────────────────────────────────────────── */
.sect{padding:3.1rem 0;}
.sect--gri{background:var(--bg-2);}
.sect--strans{padding:2rem 0;}
.sect__cap{margin-bottom:1.7rem;}
.sect__cap p{color:var(--ink-2);max-width:66ch;margin:.5rem 0 0;}

/* ── grile ───────────────────────────────────────────────────────────────── */
.grila{display:grid;gap:1.1rem;grid-template-columns:1fr;}
@media(min-width:640px){.grila--2{grid-template-columns:repeat(2,1fr);}}
/* Grilă de produse care nu lasă orfani urâți: trei pe rând, iar ultimul rând se centrează.
   Flex, nu grid — `grid` aliniază ultimul rând la stânga și nu se poate centra fără trucuri. */
.grila--produse{display:flex;flex-wrap:wrap;gap:1.1rem;justify-content:center;}
.grila--produse > *{flex:1 1 280px;}
@media(min-width:640px){.grila--produse > *{max-width:calc((100% - 1.1rem) / 2);}}
@media(min-width:900px){.grila--produse > *{max-width:calc((100% - 2.2rem) / 3);}}

@media(min-width:900px){
  .grila--3{grid-template-columns:repeat(3,1fr);}
  .grila--4{grid-template-columns:repeat(4,1fr);}
  .grila--2-1{grid-template-columns:1.6fr 1fr;gap:2.2rem;}
}

/* ── carduri ─────────────────────────────────────────────────────────────── */
.card{background:var(--alb);border:1px solid var(--line);border-radius:var(--r);
  padding:1.25rem;display:flex;flex-direction:column;}
.card--cat{border-top:4px solid var(--semnal);}
/* ── cardurile de categorie de pe prima pagină: culoare + iconiță pe fundal ──────
   Cerere Marius 14.09.2026 (prima pagină era „flat"). Fiecare categorie are culoarea ei
   în `--c`: bara de sus, o nuanță foarte slabă în colț și iconița mare, la opacitate mică.
   Textul și linkul rămân în culorile site-ului — culoarea e doar decor, deci contrastul
   textului nu se schimbă. Iconițele: includes/iconite-categorii.php. */
.grila--cat .card--cat{--c:var(--semnal);position:relative;overflow:hidden;
  border-top-color:var(--c);
  background:radial-gradient(circle at 100% 100%,color-mix(in srgb,var(--c) 9%,var(--alb)) 0,var(--alb) 62%);}
.grila--cat .card--cat > *:not(.card__fundal){position:relative;z-index:1;}
.card__fundal{position:absolute;right:-.6rem;bottom:-.8rem;width:7.5rem;height:7.5rem;
  color:var(--c);opacity:.2;pointer-events:none;transition:opacity .2s,transform .2s;}
.grila--cat .card--cat:hover .card__fundal{opacity:.3;transform:rotate(-6deg) scale(1.04);}
.grila--cat .card--cat-service{--c:var(--semnal);}
.grila--cat .card--cat-profesionale{--c:var(--cat-profesionale);}
.grila--cat .card--cat-programare{--c:var(--cat-programare);}
.grila--cat .card--cat-camioane{--c:var(--cat-camioane);}
.grila--cat .card--cat-ev{--c:var(--cat-ev);}
.grila--cat .card--cat-licente{--c:var(--cat-licente);}
.grila--cat .card--cat-module{--c:var(--cat-module);}
@media(min-width:900px){
  /* 7 carduri pe 3 coloane: al șaptelea ar sta singur, lipit la stânga. Ocupă tot rândul. */
  .grila--cat .card--cat:last-child:nth-child(3n+1){grid-column:1/-1;}
  .grila--cat .card--cat:last-child:nth-child(3n+1) p{max-width:66ch;}
}
@media(prefers-reduced-motion:reduce){.card__fundal{transition:none;}
  .grila--cat .card--cat:hover .card__fundal{transform:none;}}
/* ── cardul de produs, cu poză ────────────────────────────────────────────────
   Poza stă pe un fundal deschis, cu `object-fit:contain`: fotografiile de produs
   vin pe alb, iar `cover` le-ar tăia exact aparatul. Raportul e fixat, deci cardurile
   rămân aliniate chiar dacă pozele au proporții diferite (valiză vs tabletă). */
.card--produs{padding-top:0;overflow:hidden;}
.card__poza{display:block;margin:0 -1.25rem 1rem;background:var(--alb);
  border-bottom:1px solid var(--line);}
.card__poza img{display:block;width:100%;height:auto;aspect-ratio:4/3;
  object-fit:contain;padding:.9rem;background:var(--alb);}
.card h3{margin-bottom:.35em;}
/* titlul cardului din /blog/ e h2 (direct sub h1), cu aspectul unui h3 */
.card h2.card__t{font-size:clamp(1.14rem,2vw,1.32rem);letter-spacing:-.01em;text-transform:none;margin-bottom:.35em;}
.card p{color:var(--ink-2);font-size:.96rem;margin-bottom:1rem;}
.card__jos{margin-top:auto;display:flex;align-items:baseline;justify-content:space-between;gap:.6rem;}
.card a.card__link{font-family:var(--font-t);font-weight:700;text-transform:uppercase;
  letter-spacing:.04em;text-decoration:none;font-size:.98rem;}
.pret{font-family:var(--font-t);font-weight:700;font-size:1.3rem;color:var(--ink);}
.pret small{display:block;font-family:var(--font-b);font-weight:400;font-size:.72rem;
  color:var(--ink-3);letter-spacing:0;text-transform:none;}

/* ── tabel de specificații („fișa”) ──────────────────────────────────────── */
.fisa{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--alb);}
.fisa table{font-size:.95rem;}
.fisa th,.fisa td{text-align:left;padding:.62rem .85rem;border-bottom:1px solid var(--line-2);
  vertical-align:top;}
.fisa th{width:44%;font-weight:600;color:var(--ink-2);background:var(--bg-2);
  font-size:.85rem;letter-spacing:.02em;}
.fisa tr:last-child th,.fisa tr:last-child td{border-bottom:0;}

/* ── casete ──────────────────────────────────────────────────────────────── */
.caseta{border-left:4px solid var(--semnal);background:var(--bg-2);
  padding:1.05rem 1.2rem;border-radius:0 var(--r) var(--r) 0;margin:1.6rem 0;}
.caseta h3,.caseta h4{margin-top:0;}
.caseta p:last-child{margin-bottom:0;}
.caseta--limite{border-left-color:var(--rosu);background:var(--rosu-fundal);}
.caseta--merge{border-left-color:var(--verde);background:var(--verde-fundal);}
.caseta--provizoriu{border-left-color:var(--mov);background:var(--mov-fundal);}

/* ── verdict: merge / nu merge ───────────────────────────────────────────── */
.verdict{display:grid;gap:1rem;grid-template-columns:1fr;margin:1.8rem 0;}
@media(min-width:700px){.verdict{grid-template-columns:1fr 1fr;}}
.verdict__col{border:1px solid var(--line);border-radius:var(--r);padding:1.1rem 1.2rem;background:var(--alb);}
.verdict__col h3{font-size:1.08rem;margin-bottom:.5em;}
.verdict__col ul{margin:0;padding-left:1.1rem;font-size:.96rem;}
.verdict--da{border-top:4px solid var(--verde);}
.verdict--nu{border-top:4px solid var(--rosu);}

/* ── FAQ ─────────────────────────────────────────────────────────────────── */
.faq details{border-bottom:1px solid var(--line);padding:.15rem 0;}
.faq summary{cursor:pointer;list-style:none;padding:.95rem 2rem .95rem 0;position:relative;
  font-family:var(--font-t);font-weight:700;font-size:1.14rem;line-height:1.2;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";position:absolute;right:.2rem;top:.72rem;
  font-size:1.5rem;color:var(--semnal);line-height:1;}
.faq details[open] summary::after{content:"–";}
.faq details>*:not(summary){margin-bottom:1rem;}

/* ── CTA ─────────────────────────────────────────────────────────────────── */
.cta{background:var(--dark);color:var(--alb);border-radius:var(--r);padding:1.7rem 1.5rem;margin:2.2rem 0;}
.cta h2, .cta h3{color:var(--alb);font-size:1.34rem;text-transform:uppercase;}
.cta p{color:var(--pe-dark-text);margin-bottom:1.2rem;}
.cta__butoane{display:flex;flex-wrap:wrap;gap:.6rem;}
.cta__nota{font-size:.82rem;color:var(--pe-dark-nota);margin:1rem 0 0;}

/* ── imagini pe lățime ───────────────────────────────────────────────────── */
.img-lat{margin:1.9rem 0;border:1px solid var(--line);border-radius:var(--r);
  overflow:hidden;background:var(--bg-2);}
.img-lat img{width:100%;}
.img-lat figcaption{font-size:.85rem;color:var(--ink-3);padding:.6rem .85rem;
  border-top:1px solid var(--line);background:var(--alb);}

/* ── proză de articol ────────────────────────────────────────────────────── */
/* ⚠️ `margin-inline:auto` NU e decorativ: fără el coloana de 74ch stă lipită în stânga
   într-un container de 1180 px și pagina arată ruptă pe ecran mare — exact ce s-a
   raportat pe 14.09.2026 („div-ul de jos e pe jumătate de pagină"). Lățimea limitată
   e intenționată (lizibilitate), centrarea o face să arate ca o decizie, nu ca o scăpare. */
.proza{max-width:74ch;margin-inline:auto;}
.proza h2{margin-top:2.4rem;}
.proza h3{margin-top:1.9rem;}
.proza ul{margin-bottom:1.2rem;}
.proza strong{font-weight:600;}

/* ── articol pe două coloane ─────────────────────────────────────────────────
   Textul păstrează lățimea lizibilă, dar pagina nu mai are o coloană îngustă lipită
   într-o parte. ⚠️ `.proza` are `margin-inline:auto` — în grilă îl anulăm, altfel
   textul s-ar centra ÎN coloana lui și ar arăta strâmb față de titlul de deasupra. */
.articol{display:grid;gap:2.4rem;}
.articol .proza{margin-inline:0;max-width:none;}
@media (min-width:1080px){
  .articol{grid-template-columns:minmax(0,1fr) 320px;align-items:start;}
  .articol .proza{max-width:70ch;}
}
.lateral{display:grid;gap:1rem;}
@media (min-width:1080px){.lateral{position:sticky;top:1.2rem;}}
.lateral__cutie{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r);padding:1.1rem 1.2rem;}
.lateral__cutie--intreb{background:var(--dark);color:var(--pe-dark-intreb);border-color:transparent;}
.lateral__cutie--intreb .lateral__titlu{color:var(--alb);}
.lateral__titlu{font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-3);margin:0 0 .7rem;}
.lateral__lista{list-style:none;margin:0;padding:0;}
.lateral__lista li{display:flex;justify-content:space-between;align-items:baseline;gap:.6rem;
  padding:.5rem 0;border-bottom:1px solid var(--line);}
.lateral__lista li:last-child{border-bottom:0;}
.lateral__lista a{font-weight:600;text-decoration:none;}
.lateral__lista a:hover{text-decoration:underline;}
.lateral__lista span{font-family:var(--font-t);font-weight:700;font-size:.9rem;
  color:var(--ink-2);white-space:nowrap;}
.btn--mic{font-size:.86rem;padding:.5rem .85rem;}
.lateral__pret{font-family:var(--font-t);font-weight:700;font-size:1.5rem;color:var(--ink);margin:0 0 .8rem;}
.lateral__pret small{display:block;font-family:var(--font-b);font-weight:400;font-size:.74rem;
  color:var(--ink-3);letter-spacing:0;}
.lateral__cutie .btn{width:100%;}

/* ── subsol ──────────────────────────────────────────────────────────────── */
.subsol{background:var(--dark);color:var(--pe-dark-2);padding:2.6rem 0 1.6rem;margin-top:3rem;font-size:.93rem;}
/* Titlurile din subsol sunt h3, nu h4: pe paginile unde ultima secțiune are h2,
   un h4 în subsol producea săritură h2→h4 și pica auditul de ierarhie. */
.subsol h3{color:var(--alb);font-family:var(--font-t);font-size:.82rem;letter-spacing:.1em;
  text-transform:uppercase;margin-bottom:.85rem;}
.subsol a{color:var(--pe-dark-link);text-decoration:none;}
.subsol a:hover{color:var(--alb);text-decoration:underline;}
.subsol ul{list-style:none;margin:0;padding:0;}
.subsol li{margin-bottom:.45rem;}
.subsol__jos{border-top:1px solid var(--dark-linie);margin-top:2rem;padding-top:1.2rem;
  display:flex;flex-wrap:wrap;gap:.8rem;justify-content:space-between;font-size:.85rem;}

/* ── utilitare mici ──────────────────────────────────────────────────────── */
.text-mic{font-size:.86rem;color:var(--ink-3);}
.mb0{margin-bottom:0;}
.lista-simpla{list-style:none;padding:0;}
.lista-simpla li{padding-left:1.35rem;position:relative;}
.lista-simpla li::before{content:"▪";position:absolute;left:0;color:var(--semnal);}

/* ── fișa de atelier (fragmentul editorial verificat de QA) ───────────────── */
.dp-pl{max-width:74ch;}
.dp-pl>.eticheta{margin:2.6rem 0 .55rem;}
.dp-pl>.eticheta:first-child{margin-top:0;}
.dp-pl>.eticheta+h2{margin-top:0;}
.dp-pl h2{margin-top:2.4rem;}
.dp-pl h3{margin-top:1.9rem;}
.dp-pl>p>strong,.dp-pl li>strong{font-weight:600;}
.dp-pl .caseta--limite ul{margin:0;padding-left:1.1rem;}
.dp-pl .caseta--limite li{margin-bottom:.6em;}
.dp-pl figure.img-lat img{background:var(--alb);}
/* Pozele de produs sunt pătrate (800×800). Nefrânate, ocupă un ecran întreg și
   rup ritmul citirii. Le ținem la o bandă orizontală, cu produsul întreg vizibil. */
.img-lat img{max-height:380px;width:100%;object-fit:contain;padding:.6rem 0;}
@media(max-width:640px){.img-lat img{max-height:260px;}}

/* tabel de specificații din fragment (fără wrapper .fisa) */
table.fisa-tabel{border:1px solid var(--line);border-radius:var(--r);
  font-size:.95rem;background:var(--alb);margin:1.6rem 0;}
table.fisa-tabel th,table.fisa-tabel td{text-align:left;padding:.62rem .85rem;
  border-bottom:1px solid var(--line-2);vertical-align:top;}
table.fisa-tabel th{width:44%;font-weight:600;color:var(--ink-2);background:var(--bg-2);
  font-size:.85rem;}
table.fisa-tabel tr:last-child th,table.fisa-tabel tr:last-child td{border-bottom:0;}

/* FAQ scris ca <p><strong>Întrebare?</strong> (formatul cerut de QA) */
.dp-pl>p>strong:first-child{display:inline-block;margin-bottom:.15rem;}

/* ── tabelul de comparație (11 coloane: trebuie să scrolleze pe mobil) ────── */
.tabel-lat{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--alb);
  -webkit-overflow-scrolling:touch;}
.tabel-comp{font-size:.88rem;min-width:940px;}
.tabel-comp th,.tabel-comp td{padding:.55rem .7rem;border-bottom:1px solid var(--line-2);
  text-align:left;white-space:nowrap;vertical-align:middle;}
.tabel-comp thead th{position:sticky;top:0;background:var(--dark);color:var(--alb);z-index:2;
  font-family:var(--font-t);font-weight:700;font-size:.8rem;letter-spacing:.05em;
  text-transform:uppercase;white-space:normal;line-height:1.15;}
.tabel-comp tbody th{position:sticky;left:0;background:var(--alb);font-weight:600;
  border-right:1px solid var(--line);box-shadow:1px 0 0 var(--line);white-space:normal;
  min-width:190px;font-size:.92rem;}
.tabel-comp tbody tr:nth-child(even) th,.tabel-comp tbody tr:nth-child(even) td{background:var(--bg-2);}
.tabel-comp tbody tr:last-child th,.tabel-comp tbody tr:last-child td{border-bottom:0;}

/* pastilele de capabilitate */
.x431-rzc95c{display:inline-block;font-size:.78rem;font-weight:600;padding:.16rem .45rem;
  border-radius:2px;line-height:1.3;}
.x431-muic9a{background:var(--cap-verde-fundal);color:var(--cap-verde-text);}
.x431-ylajqi{background:var(--cap-rosu-fundal);color:var(--cap-rosu-text);}
.x431-w9doph{background:var(--bg-3);color:var(--ink-2);}

/* notele de sub tabel */
.nota-cap{background:var(--alb);border:1px solid var(--line);border-left:3px solid var(--semnal);
  border-radius:0 var(--r) var(--r) 0;padding:.95rem 1.1rem;}
.nota-cap h3{font-size:1.02rem;margin-bottom:.35em;}
.nota-cap p{font-size:.92rem;color:var(--ink-2);}

/* ── bara de acțiune pe telefon ───────────────────────────────────────────── */
.bara-mobil{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;
  background:var(--dark);border-top:1px solid var(--dark-linie-3);
  padding-bottom:env(safe-area-inset-bottom);}
.bara-mobil__buton{flex:1;display:flex;align-items:center;justify-content:center;gap:.4rem;
  min-height:48px;font-family:var(--font-t);font-weight:700;font-size:1.05rem;
  letter-spacing:.04em;text-transform:uppercase;text-decoration:none;color:var(--alb);}
.bara-mobil__buton--tel{background:var(--semnal-plin);}
.bara-mobil__buton--wa{background:var(--verde);}
.bara-mobil__buton:active{filter:brightness(.9);color:var(--alb);}
@media(min-width:900px){.bara-mobil{display:none;}}
@media(max-width:899px){body{padding-bottom:52px;}}

/* ── imaginea principală de produs (LCP) ──────────────────────────────────── */
.img-erou{margin:1.4rem 0;border:1px solid var(--line);border-radius:var(--r);
  background:var(--alb);overflow:hidden;}
.img-erou img{width:100%;height:auto;max-height:340px;object-fit:contain;padding:.5rem 0;}
@media(max-width:640px){.img-erou img{max-height:250px;}}

/* ── liste pe coloane (proceduri de service) ──────────────────────────────── */
.coloane{columns:2;column-gap:2rem;}
.coloane li{break-inside:avoid;}
@media(max-width:640px){.coloane{columns:1;}}

/* ── blocul „prin ce diferă de" ───────────────────────────────────────────── */
.dif{border-left:3px solid var(--line);padding:.2rem 0 .2rem 1.1rem;margin:1.3rem 0;}
.dif h3{font-size:1.06rem;margin-bottom:.3em;}
.dif p{color:var(--ink-2);}

/* ── formular ─────────────────────────────────────────────────────────────── */
.formular{max-width:34rem;}
.camp{margin-bottom:1.1rem;}
.camp label{display:block;font-weight:600;font-size:.95rem;margin-bottom:.3rem;}
.camp input[type=text],.camp input[type=tel],.camp textarea{
  width:100%;min-height:48px;padding:.7rem .8rem;font:inherit;font-size:1rem;
  border:1px solid var(--line);border-radius:var(--r);background:var(--alb);color:var(--ink);}
.camp textarea{min-height:9rem;resize:vertical;}
.camp input:focus,.camp textarea:focus{border-color:var(--semnal);outline:2px solid var(--semnal);outline-offset:1px;}
.camp .ajutor{display:block;font-size:.85rem;color:var(--ink-3);margin-top:.25rem;}
.camp--acord label{font-weight:400;font-size:.92rem;display:flex;gap:.5rem;align-items:flex-start;}
.camp--acord input{min-width:20px;min-height:20px;margin-top:.15rem;}
.formular button{min-height:48px;}
/* capcana anti-robot: scoasă din flux, dar NU cu display:none — unii roboți sar peste ce e ascuns așa */
.capcana{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}

/* eticheta „goală" pe fundal închis (subsol): varianta deschisă, 6,66:1 */
.subsol .eticheta--gol{color:var(--pe-dark-2);border-color:var(--dark-linie-2);}

/* ── linia de serviciu opțional (aceeași pe toate fișele de produs) ────────── */
/* Bordură punctată, nu plină: se citește ca notă, nu ca ofertă. Dacă ar arăta ca
   un buton, ar părea taxă obligatorie — exact ce nu e. */
.serviciu{margin:1.1rem 0 0;padding:.75rem .9rem;font-size:.92rem;line-height:1.55;
  border:1px dashed var(--line);border-left:3px solid var(--semnal);
  border-radius:0 var(--r) var(--r) 0;background:var(--bg-2);color:var(--ink-2);}
.serviciu strong{color:var(--ink);}
.serviciu__cap{display:block;font-family:var(--font-t);text-transform:uppercase;
  letter-spacing:.06em;font-size:.76rem;color:var(--ink-2);margin-bottom:.15rem;}
/* ⚠️ --ink-3 (#6d7783) trece pe alb (4,65:1), dar pică pe --bg-2 (#f5f6f7): 4,2:1,
   sub minimul de 4,5 pentru text mic. Griul deschis de fundal fură contrast.
   Regula pentru tot site-ul: text mic pe fundal gri = --ink-2, nu --ink-3. */

/* ── profilurile de atelier din pagina de decizie ─────────────────────────── */
/* Card, nu casetă: sunt patru variante paralele, între care omul alege una.
   Bordura de sus îngroșată le leagă vizual de etichetele de verificare. */
.profil{border:1px solid var(--line);border-top:3px solid var(--semnal);
  border-radius:0 0 var(--r) var(--r);padding:1.15rem 1.25rem;background:var(--bg);}
.profil h3{margin-top:0;margin-bottom:.45em;}
.profil p{font-size:.95rem;margin:0 0 .8rem;}
.profil__cine{color:var(--ink-2);}
.profil__rec{border-left:3px solid var(--verde);background:var(--bg-2);
  padding:.7rem .85rem;border-radius:0 var(--r) var(--r) 0;}

/* Lista „toată gama" de pe prima pagină (15.09.2026). Refolosește cardul de categorie
   (iconița e decor de fundal acolo, nu iconiță de antet), adaugă doar lista de modele. */
.lista-gama{margin:.55rem 0 0;}
.lista-gama li{padding-left:1.35rem;margin:.28rem 0;line-height:1.35;}
.lista-gama a{text-decoration:none;}
.lista-gama a:hover{text-decoration:underline;}
/* Cardul orfan se întinde pe tot rândul (regula de mai sus, rândul 246); atunci lista lui
   curge pe coloane, altfel rămâne o coloană îngustă lângă un câmp gol. */
@media(min-width:900px){
  .grila--cat .card--cat:last-child:nth-child(3n+1) .lista-gama{columns:3;column-gap:1.6rem;}
  .grila--cat .card--cat:last-child:nth-child(3n+1) .lista-gama li{break-inside:avoid;}
}