/* Glet — zugrăveli, glet și rigips. Culorile din poze: lumina lămpii, placa de rigips verde, peretele verde din
   camera de alături, gri-albastrul pereților. Un font de titluri (Zilla Slab 700) și unul de text (Instrument Sans). */
:root {
  --cerneala: #1c2421;
  --cerneala-2: #34403b;
  --rigips: #8fb9ae;
  --rigips-linie: #5f877c;
  --lampa: #f0c477;
  --usa: #3e6b3a;
  --usa-2: #2f5530;
  --ardezie: #4a5a6b;
  --var: #fbfaf6;
  --r: 12px;
  --antet: 76px;
  --lat: 1240px;
  --t: "Zilla Slab", Georgia, serif;
  --s: "Instrument Sans", "Helvetica Neue", Arial, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body { margin: 0; font: 400 17px/1.55 var(--s); color: var(--cerneala); background: var(--rigips); }
img, video, canvas { display: block; max-width: 100%; height: auto; }
figure { margin: 0; }
button { font: inherit; color: inherit; background: transparent; border: none; appearance: none; cursor: pointer; padding: 0; }
input, select, textarea { font: inherit; color: var(--cerneala); }
[hidden] { display: none !important; }
a { color: inherit; text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--cerneala); outline-offset: 3px; }
h1, h2, h3 { font-family: var(--t); font-weight: 700; line-height: 1.12; margin: 0 0 .5em; letter-spacing: -.005em; }
h2 { font-size: clamp(1.7rem, 2.6vw, 2.4rem); }
h3 { font-size: 1.3rem; }
p { margin: 0 0 1em; }
.ascuns { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sari { position: absolute; left: 12px; top: -60px; z-index: 50; background: var(--var); padding: 10px 14px; border-radius: var(--r); }
.sari:focus { top: 12px; }

/* ---------- butoane ---------- */
.buton { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 22px;
  border-radius: var(--r); font-weight: 600; text-decoration: none; line-height: 1.2; text-align: center; }
.buton--usa { background: var(--usa); color: #fff; }
.buton--usa:hover { background: var(--usa-2); }
.buton--gol { box-shadow: inset 0 0 0 2px var(--cerneala); color: var(--cerneala); }
.buton--gol:hover { background: rgba(28, 36, 33, .08); }

/* ---------- antetul: paginile în stânga, numele la mijloc, telefonul în dreapta ---------- */
.antet { position: fixed; inset: 0 0 auto 0; z-index: 20; height: var(--antet); display: grid;
  grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; padding: 0 28px; background: var(--rigips);
  border-bottom: 1px solid var(--rigips-linie); }
.antet__pagini ul { display: flex; gap: 22px; list-style: none; margin: 0; padding: 0; }
.antet__pagini a { text-decoration: none; padding: 6px 0; white-space: nowrap; }
.antet__pagini a[aria-current] { box-shadow: inset 0 -2px 0 var(--cerneala); }
.marca { display: flex; flex-direction: column; align-items: center; text-decoration: none; line-height: 1; }
.marca__nume { font: 700 1.9rem/1 var(--t); }
.marca__ce { font-size: .82rem; margin-top: 4px; color: var(--cerneala-2); }
.antet__contact { display: flex; justify-content: flex-end; align-items: center; gap: 18px; }
.antet__tel { font-weight: 600; text-decoration: none; white-space: nowrap; }
.antet__contact .buton { min-height: 44px; padding: 10px 18px; }
main { padding-top: var(--antet); }

/* ---------- Acasă: eroul pe toată lățimea, cu lampa ---------- */
.erou { position: relative; height: calc(100svh - var(--antet)); min-height: 560px; overflow: hidden; }
.erou__poza { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 22% 50%; }
.erou__text { position: absolute; right: max(28px, calc((100vw - var(--lat)) / 2)); top: 50%; transform: translateY(-50%);
  width: min(560px, 44vw); }
.erou h1 { font-size: clamp(2.6rem, 4.4vw, 4.3rem); }
.erou__text > p { font-size: 1.15rem; max-width: 34em; }
.erou__butoane { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 1.4em; }

/* ---------- secțiunile ---------- */
.lampa, .despre, .mini, .lucrari-scurt, .echipa, .preturi-scurt, .intrebare, .contact-scurt,
.cap, .soc, .zile, .manopera, .surse, .lucrare, .etape, .ce-cereti, .pret, .contact, .text-lung {
  max-width: var(--lat); margin-inline: auto; padding-inline: 28px; }

.lampa { max-width: none; background: var(--ardezie); color: #fff; padding-block: 88px; display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 56px; align-items: center;
  padding-inline: max(28px, calc((100vw - var(--lat)) / 2 + 28px)); }
.lampa__cum { font-weight: 600; }
.lampa__butoane { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0; }
.comutator { min-height: 44px; padding: 10px 16px; border-radius: var(--r); box-shadow: inset 0 0 0 2px #fff; color: #fff; }
.comutator[aria-pressed="true"] { background: var(--lampa); color: var(--cerneala); box-shadow: none; }
.lampa__glisor { display: grid; gap: 8px; max-width: 360px; }
.lampa__glisor input { accent-color: var(--lampa); width: 100%; min-height: 32px; }
.lampa__perete canvas { width: 100%; aspect-ratio: 3 / 2; height: auto; border-radius: var(--r); background: #6b7480; touch-action: none; cursor: grab; }
.lampa__perete img { border-radius: var(--r); width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.lampa__perete figcaption { font-size: .9rem; margin-top: 10px; opacity: .92; }
html:not(.js) .lampa__glisor, html:not(.js) .lampa__butoane, html:not(.js) .lampa__cum, html:not(.js) .lampa__perete canvas, html:not(.js) .lampa__perete figcaption { display: none; }

.despre { padding-block: 96px 72px; }
.despre__mare { font: 500 clamp(1.5rem, 2.4vw, 2.1rem)/1.38 var(--t); max-width: 30em; margin: 0; }
.despre__semn { margin-top: 18px; font-weight: 600; }

.mini { max-width: none; background: var(--lampa); padding-block: 72px; padding-inline: max(28px, calc((100vw - var(--lat)) / 2 + 28px)); }
.mini > p { max-width: 46em; }
.mini__cifre { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 32px; margin: 32px 0; }
.mini__cifre div { border-top: 2px solid var(--cerneala); padding-top: 10px; }
.mini__cifre dt { font-size: .95rem; }
.mini__cifre dd { margin: 4px 0 0; font: 700 clamp(1.4rem, 2.2vw, 1.9rem)/1.2 var(--t); }
.mini__sursa { font-size: .95rem; }

.lucrari-scurt { padding-block: 96px 40px; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: 0 48px; align-items: start; }
.lucrari-scurt > h2 { grid-column: 1 / -1; margin-bottom: 32px; }
.lucrare-scurt img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--r); }
.lucrare-scurt--mic { margin-top: 180px; }
.lucrare-scurt--mic img { aspect-ratio: 3 / 4; }
.lucrare-scurt h3 { margin: 16px 0 4px; }
.lucrare-scurt h3 a { text-decoration: none; }
.fapte { color: var(--cerneala-2); }

.echipa { padding-block: 72px; }
.echipa ul { list-style: none; margin: 32px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.echipa img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--r); }
.echipa li p { margin-top: 12px; }
.echipa b { display: block; font: 700 1.25rem/1.3 var(--t); }
.echipa__nota { font-size: .92rem; margin-top: 24px; }

.preturi-scurt { padding-block: 72px; }
.randuri { list-style: none; margin: 24px 0; padding: 0; max-width: 820px; }
.randuri li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 24px; padding: 16px 0; border-bottom: 1px solid var(--rigips-linie); }
.randuri b { font: 700 1.35rem/1.2 var(--t); text-align: right; }
.randuri small { grid-column: 1 / -1; font-size: .92rem; color: var(--cerneala-2); }

.intrebare { padding-block: 64px; }
.intrebare p { max-width: 44em; font-size: 1.1rem; }
.contact-scurt { padding-block: 64px 96px; }
.contact-scurt__tel { font: 700 clamp(2rem, 4vw, 3.2rem)/1.1 var(--t); margin: 12px 0 24px; }
.contact-scurt__tel a { text-decoration: none; }

/* ---------- interioare ---------- */
.cap { padding-block: 72px 40px; }
.cap h1 { font-size: clamp(2.2rem, 4vw, 3.5rem); max-width: 18em; }
.cap p { max-width: 44em; font-size: 1.12rem; }

/* socoteala */
.soc { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 40px; align-items: start; padding-bottom: 48px; }
fieldset { border: none; margin: 0 0 24px; padding: 0; min-width: 0; }
legend { font: 700 1.3rem/1.3 var(--t); margin-bottom: 12px; padding: 0; }
label { display: grid; gap: 6px; margin-bottom: 14px; font-weight: 600; font-size: .98rem; }
input:not([type=checkbox]):not([type=range]), select, textarea { width: 100%; min-height: 48px; padding: 10px 12px; border-radius: 8px;
  border: 2px solid var(--rigips-linie); background: var(--var); font-weight: 400; }
textarea { min-height: 110px; }
.bifa { display: flex; align-items: flex-start; gap: 10px; font-weight: 400; }
.bifa input { width: 22px; height: 22px; margin: 2px 0 0; accent-color: var(--usa); flex: none; }
.trei { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.doi { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.nota { font-size: .92rem; min-height: 1.5em; color: var(--cerneala-2); }
.erori { min-height: 1.5em; font-weight: 600; color: #7a1d12; }
.soc__rez { background: var(--lampa); border-radius: var(--r); padding: 28px; position: sticky; top: calc(var(--antet) + 20px); }
.rez { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 28px; margin: 18px 0 24px; }
.rez div { border-top: 2px solid var(--cerneala); padding-top: 8px; min-width: 0; }
.rez dt { font-size: .92rem; }
.rez dd { margin: 2px 0 0; font: 700 1.5rem/1.25 var(--t); overflow-wrap: anywhere; }
.rez dd small { display: block; font: 400 .9rem/1.4 var(--s); }
.cumparaturi { margin: 8px 0 0; padding-left: 1.2em; }
.cumparaturi li { margin-bottom: 6px; }
.js .nojs { display: none; }

.zile { padding-block: 48px; }
.zile__leg { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px; }
.zile__leg > span { white-space: nowrap; }
.leg { display: inline-block; width: 28px; height: 14px; border-radius: 4px; vertical-align: middle; }
.leg--lucru, .bara .lucru { background: var(--usa); }
.leg--uscare, .bara .uscare { background: repeating-linear-gradient(135deg, var(--lampa) 0 6px, #d9a94e 6px 9px); }
.leg--liber { background: transparent; box-shadow: inset 0 0 0 2px var(--rigips-linie); }
.zile__lista { list-style: none; margin: 24px 0 0; padding: 0 0 0 26px; border-left: 2px solid var(--cerneala); }
.ziua { position: relative; display: grid; grid-template-columns: 11rem minmax(0, 1fr); gap: 6px 24px; padding: 14px 0 18px; }
.ziua::before { content: ""; position: absolute; left: -33px; top: 20px; width: 12px; height: 12px; border-radius: 50%; background: var(--cerneala); }
.ziua--libera::before { background: var(--rigips); box-shadow: inset 0 0 0 2px var(--cerneala); }
.ziua__data b { display: block; font: 700 1.15rem/1.25 var(--t); }
.ziua__data span { font-size: .9rem; }
.bara { position: relative; height: 22px; border-radius: 6px; box-shadow: inset 0 0 0 1px var(--rigips-linie); background: rgba(251, 250, 246, .35); }
.bara span { position: absolute; top: 0; bottom: 0; }
.bara .lucru { border-radius: 4px; }
.ore { position: relative; height: 18px; font-size: .78rem; color: var(--cerneala-2); }
.ore span { position: absolute; transform: translateX(-50%); }
.ziua__ce { margin: 8px 0 0; padding: 0; list-style: none; font-size: .95rem; }
.ziua__ce li { margin-bottom: 2px; }
.ziua__ce .u { color: var(--cerneala-2); }
.zile__final { font: 700 1.3rem/1.35 var(--t); margin-top: 18px; max-width: 40em; }

.manopera { padding-block: 32px 48px; }
.tabel { overflow-x: auto; min-width: 0; }
table { border-collapse: collapse; width: 100%; min-width: 620px; }
th, td { text-align: left; padding: 12px 14px 12px 0; border-bottom: 1px solid var(--rigips-linie); vertical-align: top; }
thead th { font-size: .9rem; font-weight: 600; border-bottom: 2px solid var(--cerneala); }
tbody th { font-weight: 400; }
td.lei, tfoot td { white-space: nowrap; }
tfoot td, tfoot th { font: 700 1.1rem/1.3 var(--t); border-bottom: none; padding-top: 16px; }
.surse { padding-block: 32px 96px; }
.surse ul { max-width: 52em; padding-left: 1.2em; }
.surse li { margin-bottom: 10px; }

/* lucrări: poza mare, textul, poza mică dedesubt */
.lucrare { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 24px 44px; padding-block: 40px 64px; align-items: start; }
.lucrare__mare { grid-row: 1 / span 2; }
.lucrare__mare img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r); }
.lucrare__mic img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--r); }
.lucrare:nth-of-type(even) .lucrare__mare { grid-column: 2; }
.lucrare:nth-of-type(even) { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); }
.lucrare:nth-of-type(even) .lucrare__text, .lucrare:nth-of-type(even) .lucrare__mic { grid-column: 1; }

/* cum lucrăm */
.etape ol { list-style: none; margin: 0; padding: 0 0 48px; }
.etape li { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 40px; padding: 32px 0; border-top: 1px solid var(--rigips-linie); align-items: center; }
.etape img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r); }
.etape p { max-width: 36em; }
.ce-cereti { padding-block: 24px 96px; }

/* prețuri */
.pret { padding-block: 24px 40px; }
.pret table { max-width: 980px; min-width: 0; }
.pret p { max-width: 46em; margin-top: 18px; }

/* contact */
.contact { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 56px; padding-bottom: 96px; align-items: start; }
.contact__date h2 { font-size: 1.3rem; margin-top: 1.4em; }
.contact__date h2:first-child { margin-top: 0; }
.contact__tel { font: 700 2.2rem/1.1 var(--t); }
.contact__tel a { text-decoration: none; }
.cerere { background: var(--ardezie); color: #fff; border-radius: var(--r); padding: 32px; }
.cerere label { color: #fff; }
.cerere .nota { color: #e9eef2; }
.cerere .erori { color: #ffd98a; }
.cerere a { color: #fff; }
.capcana { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.text-lung { max-width: 820px; padding-bottom: 96px; }
.text-lung h2 { font-size: 1.5rem; margin-top: 1.4em; }

/* ---------- subsolul ---------- */
.subsol { background: var(--usa); color: #fff; padding: 64px max(28px, calc((100vw - var(--lat)) / 2 + 28px)) 32px;
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 3fr) minmax(0, 4fr); gap: 32px 48px; }
.subsol h2 { font-size: 1.1rem; margin-bottom: .8em; }
.subsol ul { list-style: none; margin: 0; padding: 0; }
.subsol li { margin-bottom: 8px; }
.subsol__marca { font: 700 3rem/1 var(--t); margin-bottom: 16px; }
.subsol__jos { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 16px 32px; padding-top: 28px; border-top: 1px solid rgba(255, 255, 255, .35); font-size: .9rem; }
.subsol__jos p { margin: 0; }
.sal img { width: 200px; height: auto; background: #fff; border-radius: 6px; }
.subsol__poze { flex-basis: 100%; }

/* ---------- lățimi ---------- */
@media (max-width: 1100px) {
  :root { --antet: 112px; }
  .antet { grid-template-columns: auto 1fr; grid-template-rows: 64px 48px; height: var(--antet); padding: 0 20px; gap: 0 16px; }
  .marca { grid-row: 1; grid-column: 1; align-items: flex-start; }
  .antet__contact { grid-row: 1; grid-column: 2; }
  .antet__pagini { grid-row: 2; grid-column: 1 / -1; overflow-x: auto; min-width: 0; scrollbar-width: none; }
  .antet__pagini::-webkit-scrollbar { display: none; }
  .antet__pagini ul { gap: 20px; padding-bottom: 4px; }
  .antet__pagini li:first-child { margin-left: 0; }
  .erou__text { width: min(500px, 52vw); }
}
@media (max-width: 900px) {
  .erou { height: auto; min-height: 0; overflow: visible; }
  .erou__poza { position: relative; height: 54svh; min-height: 300px; }
  .erou__text { position: static; transform: none; width: auto; padding: 28px 20px 48px; }
  .lampa, .soc, .contact { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .lampa { padding-block: 64px; }
  .mini__cifre { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lucrari-scurt { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .lucrare-scurt--mic { margin-top: 0; }
  .echipa ul { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .soc__rez { position: static; }
  .lucrare, .lucrare:nth-of-type(even) { grid-template-columns: minmax(0, 1fr); }
  .lucrare__mare, .lucrare:nth-of-type(even) .lucrare__mare { grid-column: 1; grid-row: auto; }
  .lucrare:nth-of-type(even) .lucrare__text, .lucrare:nth-of-type(even) .lucrare__mic { grid-column: 1; }
  .lucrare__mic { max-width: 60%; }
  .etape li { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .subsol { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .subsol__sus { grid-column: 1 / -1; }
  .ziua { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  body { font-size: 16px; }
  .antet__tel { display: none; }
  .marca__nume { font-size: 1.6rem; }
  .lampa, .despre, .mini, .lucrari-scurt, .echipa, .preturi-scurt, .intrebare, .contact-scurt,
  .cap, .soc, .zile, .manopera, .surse, .lucrare, .etape, .ce-cereti, .pret, .contact, .text-lung { padding-inline: 16px; }
  .lampa, .mini { padding-inline: 16px; }
  .subsol { padding-inline: 16px; grid-template-columns: minmax(0, 1fr); }
  .trei { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .trei label:last-child { grid-column: 1 / -1; }
  .rez { grid-template-columns: minmax(0, 1fr); }
  .echipa ul { grid-template-columns: minmax(0, 1fr); }
  .soc__rez, .cerere { padding: 22px 18px; }
  .zile__leg > span { white-space: normal; }
  /* manopera pe telefon: fiecare rând e un bloc, cu eticheta lângă fiecare valoare */
  #manopera { min-width: 0; }
  #manopera thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  #manopera tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4px 16px; padding: 14px 0; border-bottom: 1px solid var(--rigips-linie); }
  #manopera th, #manopera td { display: block; padding: 0; border: none; white-space: normal; }
  #manopera th { grid-column: 1 / -1; font-weight: 600; }
  #manopera td::before { content: attr(data-l); display: block; font: 400 .82rem/1.3 var(--s); color: var(--cerneala-2); }
  #manopera tfoot tr { border-bottom: none; }
}