/* picant-grup.ro — „Oțel și cântar”: fundal de oțel închis, titluri condensate, verdele PICANT ca lumină, tăietura cu flacără
   între secțiuni. Pagina hubului folosește același vocabular, pe albastru închis, cu „bara colectoare” care străbate pagina. */

@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 500; font-display: swap; src: url(/assets/fonts/barlow-500-latin-ext.woff2?v=3facdf66b6) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 500; font-display: swap; src: url(/assets/fonts/barlow-500-latin.woff2?v=cd759df8ef) 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: 'Barlow'; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/fonts/barlow-700-latin-ext.woff2?v=88c786d5fa) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/fonts/barlow-700-latin.woff2?v=2d797dd8b3) 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: 'Barlow Condensed'; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/barlow-condensed-600-latin-ext.woff2?v=aef7edf54f) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/barlow-condensed-600-latin.woff2?v=215a93c696) 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: 'Barlow Condensed'; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/fonts/barlow-condensed-700-latin-ext.woff2?v=9d351bd922) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/fonts/barlow-condensed-700-latin.woff2?v=3787a5a419) 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; }

/* Culorile. Baza e deschisă (alb-gri curat, cu verdele siglei). „Zonele” (.zona: antetele mari, banda diviziilor, subsolul,
   meniul de pe telefon) sunt pe antracit, cu linii de lumină verde: varianta „mixt”, aleasă de proprietar la 13.10.2026.
   --verde-viu = verdele pentru linii, umpleri și contururi; --verde-text = verdele pentru text; --stralucire = culoarea luminii (r g b);
   --trasaj = linia desenelor; --pagina = fundalul paginii, pentru marginile înclinate ale zonelor. */
:root {
  --pagina: #f5f6f3; --fund: #f5f6f3; --fund-2: #fff; --fund-3: #e9ece6; --linie: #dcdfd8; --linie-2: #b4bbb0;
  --otel: #59625b; --text: #232a25; --tare: #111612;
  --verde: #6ea21c; --verde-viu: #6ea21c; --verde-text: #47750b; --stralucire: 110 162 28;
  --flacara: #f86635; --flacara-viu: #ffb347; --chihlimbar: #a5630a; --op: #2c6c98;
  --trasaj: #2a332c; --caroiaj: rgb(60 80 70 / .080);
  --buton-fund: #6ea21c; --buton-text: #fff; --buton-peste: #5a8a12;
  --ft: 'Barlow Condensed', 'Arial Narrow', 'Roboto Condensed', sans-serif;
  --fx: 'Barlow', Arial, 'Helvetica Neue', sans-serif;
  --lat: 1180px; --g: clamp(18px, 4.500vw, 44px);
  color-scheme: light;
}
/* paleta antracit a „zonelor”: antetele mari, banda diviziilor, subsolul, antetul cât stă peste ele și meniul de pe telefon */
.zona, .antet:not(.jos), .deschis .antet {
  --fund: #1b2428; --fund-2: #232e33; --fund-3: #2c3940; --linie: #36454d; --linie-2: #52646e;
  --otel: #aab7bf; --text: #edf1f3; --tare: #fff;
  --verde-viu: #a8e03a; --verde-text: #b7ea55; --stralucire: 168 224 58;
  --chihlimbar: #f2b24c; --op: #8fb8dd; --trasaj: #d2dde5; --caroiaj: rgb(150 175 190 / .070);
  --buton-fund: #a8e03a; --buton-text: #10160f; --buton-peste: #c4f25e;
  --duo-lumini: #b9ee55; --duo-umbre: #0c1411; --raster: .300;
}
.zona { background-color: var(--fund); color: var(--text); }
/* marginea de jos a unei zone, tăiată înclinat, cu linia de lumină verde pe ea; --dedesubt = culoarea a ce urmează */
.taiata { --panta: clamp(28px, 5vw, 72px); position: relative; padding-bottom: calc(var(--panta) + clamp(28px, 4vw, 56px)) !important; }
.taiata::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: var(--panta); z-index: 2; pointer-events: none; background: linear-gradient(to bottom right, transparent calc(50% - 3px), var(--verde-viu) calc(50% - 2.500px), var(--verde-viu) calc(50% - .500px), var(--dedesubt, var(--pagina)) 50%); filter: drop-shadow(0 -3px 9px rgb(var(--stralucire) / .600)); }
/* piesele care rămân deschise în orice temă (plăcuța, cântarul comenzii) își țin culorile lor */
.placuta, .c-cantar { --linie: #d5dacf; --linie-2: #a8b2a0; --otel: #5a665a; --text: #283028; --tare: #121912; --verde-text: #47750b; --chihlimbar: #a5630a; }

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--fund); color: var(--text); font: 500 17px/1.6 var(--fx); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img, svg { max-width: 100%; display: block; }
img { height: auto; }
a { color: inherit; }
h1, h2, h3 { font-family: var(--ft); font-weight: 700; line-height: .96; margin: 0; text-transform: uppercase; letter-spacing: .005em; text-wrap: balance; }
h2 { font-size: clamp(2.100rem, 6vw, 4.200rem); }
h3 { font-size: clamp(1.350rem, 3vw, 1.800rem); line-height: 1.050; }
p { margin: 0 0 1em; }
.larg { width: min(var(--lat), 100% - 2 * var(--g)); margin-inline: auto; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.sari { position: fixed; left: 12px; top: -60px; z-index: 120; background: var(--buton-fund); color: var(--buton-text); padding: 10px 16px; font-weight: 700; text-decoration: none; }
.sari:focus { top: 12px; }
:focus-visible { outline: 2px solid var(--verde-viu); outline-offset: 3px; }
.lead { font-size: clamp(1.120rem, 2.200vw, 1.380rem); line-height: 1.450; color: var(--tare); max-width: 46ch; }
.mic, small { font-size: .860rem; color: var(--otel); }
.ic { width: 1.250em; height: 1.250em; display: inline-block; vertical-align: -.240em; fill: none; stroke: currentColor; stroke-width: 1.600; stroke-linecap: round; stroke-linejoin: round; flex: none; }

/* ——— Butoane ——— */
.butoane { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; }
.buton { display: inline-flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 24px; font: 700 1.120rem/1 var(--ft); letter-spacing: .050em; text-transform: uppercase; text-decoration: none; color: var(--buton-text); background: var(--buton-fund); border: 0; cursor: pointer; position: relative; clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px)); transition: background .25s, transform .25s; }
.buton .ic { transition: transform .25s; }
.buton:hover { background: var(--buton-peste); }
.buton:hover .ic { transform: translateX(5px); }
.buton.contur { background: transparent; color: var(--text); box-shadow: inset 0 0 0 1.500px var(--linie-2); clip-path: none; }
.buton.contur:hover { box-shadow: inset 0 0 0 1.500px var(--verde-viu); color: var(--verde-text); }
.leg { display: inline-flex; align-items: center; gap: 6px; color: var(--verde-text); text-decoration: none; border-bottom: 1px solid transparent; transition: border-color .2s; }
.leg:hover { border-color: currentColor; }

/* ——— Antet și meniu ——— */
.antet { color: var(--text); position: fixed; inset: 0 0 auto 0; z-index: 60; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 12px var(--g); transition: background .35s, box-shadow .35s; }
.antet:not(.jos)::before { content: ''; position: absolute; inset: 0 0 -34px 0; z-index: -1; pointer-events: none; background: linear-gradient(180deg, color-mix(in srgb, var(--fund) 94%, transparent) 0, color-mix(in srgb, var(--fund) 70%, transparent) 55%, transparent); }
.deschis .antet::before { display: none; }
.antet.jos { background: color-mix(in srgb, var(--fund) 88%, transparent); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 1px 0 var(--linie); }
.deschis .antet.jos { background: none; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
html:not(.js) .antet { position: absolute; }
.marca { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; font: 700 1.450rem/1 var(--ft); letter-spacing: .080em; position: relative; z-index: 2; }
.marca .sigla { width: 40px; height: 40px; color: var(--verde); }
.sigla { fill: currentColor; }
.marca b { color: var(--verde); font-weight: 700; }
.nav { display: flex; align-items: center; gap: clamp(14px, 2.200vw, 30px); }
.nb { white-space: nowrap; }
.nav > a { white-space: nowrap; position: relative; display: inline-flex; align-items: center; gap: 5px; padding: 12px 0; font: 700 1.100rem/1 var(--ft); letter-spacing: .070em; text-transform: uppercase; text-decoration: none; color: var(--text); }
.nav > a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 4px; height: 2px; background: var(--verde-viu); box-shadow: 0 0 10px var(--verde-viu); transform: scaleX(0); transform-origin: left; transition: transform .35s cubic-bezier(.6, 0, .2, 1); }
.nav > a::before { content: ''; position: absolute; left: -9px; bottom: 2px; width: 6px; height: 6px; border-radius: 50%; background: var(--linie-2); transition: background .2s .1s, box-shadow .2s .1s; opacity: 0; }
.nav > a:hover::after, .nav > a.activ::after { transform: scaleX(1); }
.nav > a:hover::before, .nav > a.activ::before { opacity: 1; background: var(--verde-viu); box-shadow: 0 0 8px var(--verde-viu); }
.ext { width: 11px; height: 11px; fill: none; stroke: currentColor; stroke-width: 1.400; opacity: .7; }
.limbi { display: inline-flex; border: 1px solid var(--linie-2); }
.limbi a { padding: 7px 10px; font: 700 .950rem/1 var(--ft); letter-spacing: .080em; text-decoration: none; color: var(--otel); }
.limbi a.activ { background: var(--buton-fund); color: var(--buton-text); }
.comutator { display: none; position: relative; z-index: 2; width: 48px; height: 48px; padding: 0; background: none; border: 1px solid var(--linie-2); color: var(--text); cursor: pointer; }
.comutator svg { width: 44px; height: 44px; fill: none; stroke: currentColor; stroke-width: 1.800; stroke-linecap: round; }
.comutator circle { fill: var(--fund); }
.comutator .lama { transform-origin: 9px 24px; transform: rotate(-28deg); transition: transform .4s cubic-bezier(.6, 0, .2, 1.300), stroke .3s; }
.comutator[aria-expanded="true"] { color: var(--verde-text); border-color: var(--verde-viu); }
.comutator[aria-expanded="true"] .lama { transform: rotate(0); }

@media (max-width: 1099px) {
  .comutator { display: block; }
  .nav { position: fixed; inset: 0; z-index: 1; flex-direction: column; align-items: flex-start; justify-content: center; gap: 4px; padding: 90px var(--g) 110px; background: var(--fund); background-image: repeating-linear-gradient(0deg, transparent 0 3px, rgb(0 0 0 / .014) 3px 4px); clip-path: inset(0 0 100% 0); visibility: hidden; transition: clip-path .55s cubic-bezier(.7, 0, .2, 1), visibility 0s .55s; }
  .nav::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: linear-gradient(90deg, transparent, var(--flacara) 15%, var(--flacara-viu) 100%); box-shadow: 0 0 22px 3px rgb(248 102 53 / .7); }
  .deschis .nav { clip-path: inset(0); visibility: visible; transition: clip-path .55s cubic-bezier(.7, 0, .2, 1); }
  .nav > a { font-size: clamp(2rem, 9vw, 3.200rem); font-weight: 700; letter-spacing: .010em; padding: 8px 0; opacity: 0; transform: translateY(18px); transition: opacity .35s, transform .35s; }
  .deschis .nav > a { opacity: 1; transform: none; }
  .deschis .nav > a:nth-child(1) { transition-delay: .18s; } .deschis .nav > a:nth-child(2) { transition-delay: .24s; } .deschis .nav > a:nth-child(3) { transition-delay: .30s; } .deschis .nav > a:nth-child(4) { transition-delay: .36s; } .deschis .nav > a:nth-child(5) { transition-delay: .42s; }
  .nav > a::before { display: none; }
  .nav > a::after { bottom: 2px; height: 3px; }
  .limbi { margin-top: 22px; }
  .limbi a { padding: 12px 18px; font-size: 1.200rem; }
  body.deschis { overflow: hidden; }
}

/* ——— Poarta de la prima vizită: emblema se strânge din cele patru săgeți, apoi plăcile verzi se dau la o parte ——— */
.poarta { position: fixed; inset: 0; z-index: 200; pointer-events: none; display: none; }
html.intro .poarta { display: block; }
.poarta i { position: absolute; left: 0; right: 0; height: 50.200%; background: var(--verde); }
.poarta i:nth-child(1) { top: 0; animation: p-sus .7s 1s cubic-bezier(.7, 0, .2, 1) forwards; }
.poarta i:nth-child(2) { bottom: 0; animation: p-jos .7s 1s cubic-bezier(.7, 0, .2, 1) forwards; }
.poarta .sigla { position: absolute; left: 50%; top: 50%; width: clamp(96px, 22vw, 150px); height: auto; translate: -50% -50%; color: #fff; overflow: visible; animation: p-sigla 1.500s .1s both; }
.poarta .sigla path { animation: p-sag .7s cubic-bezier(.2, .8, .2, 1) both; }
.poarta .sigla path:nth-child(1) { --dx: 0px; --dy: -110px; }
.poarta .sigla path:nth-child(2) { --dx: 110px; --dy: 0px; animation-delay: .080s; }
.poarta .sigla path:nth-child(3) { --dx: 0px; --dy: 110px; animation-delay: .160s; }
.poarta .sigla path:nth-child(4) { --dx: -110px; --dy: 0px; animation-delay: .240s; }
@keyframes p-sag { from { opacity: 0; translate: var(--dx) var(--dy); } to { opacity: 1; translate: 0 0; } }
@keyframes p-sigla { 0%, 62% { opacity: 1; scale: 1; } 100% { opacity: 0; scale: 1.350; } }
@keyframes p-sus { to { transform: translateY(-101%); } }
@keyframes p-jos { to { transform: translateY(101%); } }

/* ——— Trecerea între pagini (browserele care știu View Transitions): pagina nouă se deschide din tăietură ——— */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: vt-iese .3s ease both; }
::view-transition-new(root) { animation: vt-intra .55s cubic-bezier(.7, 0, .2, 1) both; }
@keyframes vt-iese { to { opacity: .35; } }
@keyframes vt-intra { from { clip-path: inset(50% 0 50% 0); } to { clip-path: inset(0); } }

/* ——— Apariții la derulare (doar cu JS; fără JS totul e vizibil) ——— */
.js .apare { opacity: 0; transform: translateY(26px); transition: opacity .7s cubic-bezier(.2, .7, .2, 1), transform .7s cubic-bezier(.2, .7, .2, 1); transition-delay: calc(var(--k, 0) * 90ms); }
.js .apare.vazut { opacity: 1; transform: none; }

/* ——— Plăcuța de identificare (ștanțată, cu nituri) ——— */
.placuta { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); margin: 0; position: relative; border: 1px solid var(--linie-2); background: linear-gradient(180deg, #fff, #f0f2ec); box-shadow: inset 0 1px 0 #fff, 0 22px 44px -30px rgb(40 60 30 / .450); }
.placuta::before { content: ''; position: absolute; inset: 7px; pointer-events: none; background: radial-gradient(circle at 4px 4px, var(--otel) 0 2.500px, transparent 3px) 0 0 / 100% 100% no-repeat, radial-gradient(circle at calc(100% - 4px) 4px, var(--otel) 0 2.500px, transparent 3px), radial-gradient(circle at 4px calc(100% - 4px), var(--otel) 0 2.500px, transparent 3px), radial-gradient(circle at calc(100% - 4px) calc(100% - 4px), var(--otel) 0 2.500px, transparent 3px); opacity: .450; }
.placuta > div { padding: 24px 22px 20px; border-left: 1px solid var(--linie); min-width: 0; }
.placuta > div:first-child { border-left: 0; }
.placuta dt { font: 700 clamp(1.500rem, 2.700vw, 2.150rem)/1 var(--ft); letter-spacing: .020em; color: var(--tare); text-shadow: 0 1px 0 #fff; white-space: nowrap; }
.placuta dd { margin: 8px 0 0; font-size: .900rem; line-height: 1.350; color: var(--otel); }
.placuta dd b { display: block; margin-bottom: 4px; font: 700 1.200rem/1.150 var(--ft); letter-spacing: .050em; color: var(--text); }
@media (max-width: 640px) { .placuta { grid-template-columns: 1fr 1fr; } .placuta > div { border-left: 0; border-top: 1px solid var(--linie); padding: 18px 16px 16px; } .placuta > div:nth-child(-n+2) { border-top: 0; } .placuta > div:nth-child(even) { border-left: 1px solid var(--linie); } .placuta > div:last-child:nth-child(odd) { grid-column: 1 / -1; } .placuta dt { white-space: normal; } }
/* plăcuța firmei: patru rubrici; numărul lung de la Registrul Comerțului și rubrica ISO primesc loc cât le trebuie */
.placuta.firma { grid-template-columns: .800fr 1.500fr 1.100fr 1.400fr; }
@media (max-width: 900px) { .placuta.firma { grid-template-columns: 1fr 1fr; } .placuta.firma > div:nth-child(n+3) { border-top: 1px solid var(--linie); } .placuta.firma > div:nth-child(3) { border-left: 0; } }
@media (max-width: 640px) { .placuta.firma dt { white-space: nowrap; } .placuta.firma > div:nth-child(1) { order: 1; } .placuta.firma > div:nth-child(3) { order: 2; border-top: 0; border-left: 1px solid var(--linie); } .placuta.firma > div:nth-child(2) { order: 3; grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--linie); } .placuta.firma > div:nth-child(4) { order: 4; grid-column: 1 / -1; border-left: 0; } }

/* ——— Tăietura cu flacără dintre secțiuni ——— */
.taietura { position: relative; height: 2px; margin: 0; background: var(--linie); overflow: visible; }
.taietura i { position: absolute; inset: 0; transform: scaleX(0); transform-origin: left; background: linear-gradient(90deg, rgb(248 102 53 / .250) 0, var(--flacara) 55%, var(--flacara-viu) 100%); box-shadow: 0 0 14px 1px rgb(248 102 53 / .500); }
.taietura i::after { content: ''; position: absolute; right: -3px; top: -5px; width: 12px; height: 12px; border-radius: 50%; background: radial-gradient(circle, #fff 0 25%, var(--flacara-viu) 45%, rgb(248 102 53 / 0) 72%); filter: blur(.4px); }
.taietura.vazut i { animation: t-taie 1.500s cubic-bezier(.45, 0, .2, 1) forwards, t-raceste 2.200s 1.500s ease forwards; }
@keyframes t-taie { to { transform: scaleX(1); } }
@keyframes t-raceste { to { box-shadow: none; filter: grayscale(1) opacity(.400); } }
.js .taietura:not(.vazut) i { transform: scaleX(0); }
html:not(.js) .taietura i { transform: none; filter: grayscale(1) opacity(.400); box-shadow: none; }

/* ——— Prima pagină ——— */
.sectiune { padding: clamp(64px, 10vw, 128px) 0; position: relative; }
.sectiune h2 { margin-bottom: clamp(22px, 3.500vw, 40px); }
/* antetul primei pagini: cât ecranul, cu titlul uriaș jos-stânga și poza pe dreapta, tăiată oblic, în două culori cu raster;
   pe muchie, linia de lumină verde. Sus, poza se stinge în antracit, ca meniul să se citească. */
.erou { position: relative; min-height: 100svh; display: flex; flex-direction: column; justify-content: flex-end; gap: clamp(28px, 5vw, 56px); padding: 120px 0 clamp(28px, 5vw, 56px); overflow: hidden; isolation: isolate; }
.erou::before { content: ''; position: absolute; inset: 0; z-index: -2; background: linear-gradient(var(--caroiaj) 1px, transparent 1px) 0 0 / 100% 44px, linear-gradient(90deg, var(--caroiaj) 1px, transparent 1px) 0 0 / 44px 100%; }
.erou-foto { position: absolute; inset: 0 0 0 36%; z-index: -1; }
.erou-taiat { position: absolute; inset: 0; clip-path: polygon(22% 0, 100% 0, 100% 100%, 0 100%); overflow: hidden; background: var(--duo-lumini); isolation: isolate; }
.erou-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 40% 50%; filter: grayscale(1) contrast(1.250); mix-blend-mode: multiply; animation: e-respira 18s ease-in-out infinite alternate; }
.erou-taiat::before { content: ''; position: absolute; inset: 0; z-index: 1; background: var(--duo-umbre); mix-blend-mode: lighten; }
.erou-taiat::after { content: ''; position: absolute; inset: 0; z-index: 2; background: radial-gradient(circle, rgb(0 0 0 / var(--raster)) 0 .900px, transparent 1.300px) 0 0 / 4px 4px; mix-blend-mode: multiply; }
.erou-taiat i { position: absolute; inset: 0; z-index: 3; background: linear-gradient(180deg, var(--fund) 0, color-mix(in srgb, var(--fund) 86%, transparent) 84px, transparent 230px), linear-gradient(98deg, color-mix(in srgb, var(--fund) 94%, transparent) 4%, color-mix(in srgb, var(--fund) 42%, transparent) 28%, transparent 54%), linear-gradient(0deg, var(--fund) 2%, color-mix(in srgb, var(--fund) 70%, transparent) 15%, transparent 40%); }
.erou-muchie { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; animation: e-muchie 1.800s .9s cubic-bezier(.5, 0, .2, 1) both; }
.erou-muchie line { stroke: var(--verde-viu); stroke-width: 5; vector-effect: non-scaling-stroke; filter: drop-shadow(0 0 9px rgb(var(--stralucire) / .800)); }
.erou-muchie .halou { stroke-width: 22; opacity: .160; filter: none; }
@keyframes e-respira { from { transform: scale(1.020); } to { transform: scale(1.100) translate(-1.500%, -1%); } }
@keyframes e-muchie { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0); } }
.erou-sus { margin: 0 0 14px; font: 600 1.050rem/1 var(--ft); letter-spacing: .220em; text-transform: uppercase; color: var(--verde-text); }
.erou h1 { font-size: clamp(4.200rem, 17vw, 13.500rem); line-height: .800; letter-spacing: -.012em; position: relative; width: fit-content; color: var(--tare); }
.erou h1 span { display: block; }
.erou h1 span:last-child { color: rgb(var(--stralucire) / .100); -webkit-text-stroke: 2px var(--verde-viu); }
.erou h1::after { content: ''; position: absolute; left: -2%; right: -6%; top: 49.500%; height: 3px; background: linear-gradient(90deg, rgb(248 102 53 / 0), var(--flacara) 30%, var(--flacara-viu)); box-shadow: 0 0 12px 1px rgb(248 102 53 / .500); transform: scaleX(0); transform-origin: left; animation: t-taie 1.100s 1.500s cubic-bezier(.5, 0, .2, 1) forwards, e-kerf 1.600s 2.600s ease forwards; }
@keyframes e-kerf { to { background: var(--fund); box-shadow: none; height: 3px; } }
.erou-sub { max-width: 44ch; margin: clamp(18px, 3vw, 30px) 0 clamp(20px, 3vw, 30px); font-size: clamp(1.100rem, 2.100vw, 1.320rem); line-height: 1.450; color: var(--text); }
@media (max-width: 900px) { .erou { min-height: 0; padding-top: 104px; } .erou-in { order: 1; } .erou-foto { position: relative; inset: auto; order: 2; z-index: 0; } .erou > .larg:last-child { order: 3; } .erou-taiat { position: relative; clip-path: none; } .erou-foto img { height: auto; aspect-ratio: 16 / 10; } .erou-taiat i, .erou-muchie { display: none; } }

.p-mergi { display: inline-flex; align-items: center; gap: 8px; font: 700 1.050rem/1 var(--ft); letter-spacing: .080em; text-transform: uppercase; color: var(--verde-text); }
.p-mergi .ic { transition: transform .3s; }
a:hover > .p-mergi .ic { transform: translateX(5px); }
.p-mergi.in-lucru { color: var(--chihlimbar); }
.p-mergi.in-lucru::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: currentColor; animation: led 1.600s ease-in-out infinite; }
@keyframes led { 50% { opacity: .25; } }

/* cântarul: cifrele firmei, albe pe verdele siglei */
.cifre { padding: clamp(44px, 7vw, 84px) 0; background: var(--verde) repeating-linear-gradient(135deg, rgb(255 255 255 / .060) 0 2px, transparent 2px 9px); }
.cantar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: rgb(255 255 255 / .400); border: 1px solid rgb(255 255 255 / .400); }
.cantar > div { background: var(--verde); padding: clamp(20px, 3vw, 34px) clamp(14px, 2.400vw, 28px); position: relative; overflow: hidden; }
.cantar b { display: inline-block; font: 700 clamp(2.300rem, 5.400vw, 4.200rem)/1 var(--ft); letter-spacing: .030em; color: #fff; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cantar em { font: 700 clamp(1.200rem, 2.400vw, 1.900rem)/1 var(--ft); font-style: normal; color: #fff; opacity: .850; margin-left: 8px; }
.cantar span { display: block; margin-top: 10px; font-size: .900rem; line-height: 1.300; color: rgb(255 255 255 / .920); }
@media (max-width: 760px) { .cantar { grid-template-columns: 1fr 1fr; } }

.doua { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 5vw, 72px); align-items: start; }
@media (max-width: 860px) { .doua { grid-template-columns: 1fr; } }
.repere { list-style: none; margin: 0; padding: 0; counter-reset: r; }
.repere li { position: relative; padding: 20px 0 20px 64px; border-top: 1px solid var(--linie); counter-increment: r; }
.repere li:last-child { border-bottom: 1px solid var(--linie); }
.repere li::before { content: '0' counter(r); position: absolute; left: 0; top: 18px; font: 700 1.900rem/1 var(--ft); color: transparent; -webkit-text-stroke: 1px var(--verde-viu); }
.repere b { display: block; font: 700 1.350rem/1.100 var(--ft); letter-spacing: .030em; text-transform: uppercase; margin-bottom: 6px; }
.repere span { color: var(--otel); font-size: .980rem; line-height: 1.450; display: block; }

.certificate { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 3vw, 40px); margin: clamp(30px, 5vw, 56px) 0; }
.certificate figure { margin: 0; }
.certificate a { display: block; position: relative; background: #fff; padding: 8px; box-shadow: 0 26px 50px -30px rgb(40 60 30 / .550), 0 0 0 1px var(--linie); transition: transform .5s cubic-bezier(.2, .8, .2, 1), box-shadow .5s; }
.certificate a:hover { transform: translateY(-8px); box-shadow: 0 40px 60px -30px rgb(40 60 30 / .600), 0 0 0 1px var(--verde-viu), 0 0 30px -8px rgb(var(--stralucire) / .450); }
.certificate img { width: 100%; }
.certificate figcaption { margin-top: 20px; }
.certificate figcaption b { display: block; font: 700 1.550rem/1 var(--ft); letter-spacing: .030em; }
.certificate figcaption span { display: block; color: var(--otel); font-size: .950rem; line-height: 1.350; margin: 6px 0; }
.certificate small a { display: inline; padding: 0; background: none; box-shadow: none; transform: none; color: var(--verde-text); }
.certificate small a:hover { transform: none; box-shadow: none; }
@media (max-width: 700px) { .certificate { grid-template-columns: 1fr; max-width: 360px; } }

.date { margin: 0; border-top: 1px solid var(--linie); }
.date > div { display: grid; grid-template-columns: minmax(150px, 30%) 1fr; gap: 6px 24px; padding: 14px 0; border-bottom: 1px solid var(--linie); }
.date dt { color: var(--otel); font-size: .900rem; }
.date dd { margin: 0; }
@media (max-width: 560px) { .date > div { grid-template-columns: 1fr; } }
.mare { display: inline-flex; align-items: center; gap: 12px; font: 700 clamp(1.500rem, 3.400vw, 2.200rem)/1.100 var(--ft); letter-spacing: .020em; text-decoration: none; transition: color .2s; }
.mare .ic { color: var(--verde-text); }
.mare:hover { color: var(--verde-text); }
#contact p { margin-bottom: 14px; }
.simplu { min-height: 70svh; display: grid; align-items: center; padding-top: 160px; }
.simplu h1 { font-size: clamp(3rem, 9vw, 6rem); margin-bottom: 20px; }

/* ——— Subsol ——— */
.subsol { --panta: clamp(28px, 5vw, 72px); position: relative; padding: calc(var(--panta) + clamp(36px, 5vw, 64px)) 0 110px; background: var(--fund); font-size: .950rem; color: var(--otel); }
.subsol::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: var(--panta); pointer-events: none; background: linear-gradient(to bottom right, var(--pagina) 50%, var(--verde-viu) calc(50% + .500px), var(--verde-viu) calc(50% + 2.500px), transparent calc(50% + 3px)); filter: drop-shadow(0 3px 9px rgb(var(--stralucire) / .500)); }
.subsol-grila { display: grid; grid-template-columns: 1.200fr 1.400fr 1fr 1.300fr; gap: 28px clamp(20px, 4vw, 56px); }
.subsol h2 { font: 700 1rem/1 var(--ft); letter-spacing: .180em; color: var(--text); margin-bottom: 14px; }
.subsol p { margin: 0; line-height: 1.700; }
.subsol a { text-decoration: none; transition: color .2s; }
.subsol a:hover { color: var(--verde-text); }
.subsol-marca .sigla { width: 64px; height: 64px; margin-bottom: 14px; color: var(--verde); }
.subsol-legaturi a { display: block; padding: 3px 0; }
.subsol-jos { margin-top: 40px !important; padding-top: 20px; border-top: 1px solid var(--linie); font-size: .860rem; text-align: center; letter-spacing: .040em; }
@media (max-width: 860px) { .subsol-grila { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .subsol-grila { grid-template-columns: 1fr; } }
@media (min-width: 761px) { .subsol { padding-bottom: clamp(40px, 6vw, 72px); } }

/* ——— Bara de contact de pe telefon: o linie fină și trei inele ——— */
.bara { display: none; }
@media (max-width: 760px) {
  .bara { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; display: flex; justify-content: center; gap: clamp(26px, 10vw, 54px); padding: 9px 16px calc(9px + env(safe-area-inset-bottom)); background: color-mix(in srgb, var(--fund) 86%, transparent); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-top: 1px solid var(--linie); }
  .bara::before { content: ''; position: absolute; left: 0; right: 0; top: -1px; height: 1px; background: linear-gradient(90deg, transparent, var(--verde-viu) 50%, transparent); opacity: .6; }
  .bara a { display: grid; justify-items: center; gap: 4px; text-decoration: none; font: 600 .780rem/1 var(--ft); letter-spacing: .120em; text-transform: uppercase; color: var(--otel); }
  .bara svg { width: 40px; height: 40px; padding: 10px; border: 1px solid var(--linie-2); border-radius: 50%; fill: none; stroke: var(--verde-viu); stroke-width: 1.500; stroke-linecap: round; stroke-linejoin: round; transition: border-color .2s, background .2s; }
  .bara a:active svg { border-color: var(--verde-viu); background: rgb(var(--stralucire) / .100); }
}

/* ============ Pagina hubului ============ */
.h-erou { position: relative; padding: clamp(118px, 15vw, 170px) 0 clamp(36px, 6vw, 72px); overflow: hidden; isolation: isolate; }
.h-erou::before { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(120% 70% at 78% 0, rgb(var(--stralucire) / .120), transparent 62%), linear-gradient(180deg, transparent 60%, var(--fund)), linear-gradient(var(--caroiaj) 1px, transparent 1px) 0 0 / 100% 44px, linear-gradient(90deg, var(--caroiaj) 1px, transparent 1px) 0 0 / 44px 100%; }
.h-stare { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 20px; padding: 7px 12px 7px 10px; border: 1px solid var(--linie-2); font: 600 .950rem/1.200 var(--ft); letter-spacing: .100em; text-transform: uppercase; color: var(--otel); }
.h-stare i { width: 8px; height: 8px; border-radius: 50%; background: var(--chihlimbar); box-shadow: 0 0 10px var(--chihlimbar); animation: led 1.800s ease-in-out infinite; flex: none; }
.h-erou h1 { font-size: clamp(2.900rem, 9.200vw, 7.400rem); line-height: .880; max-width: 13ch; }
.h-sub { max-width: 54ch; margin: clamp(18px, 3vw, 28px) 0 clamp(22px, 3vw, 32px); font-size: clamp(1.100rem, 2.100vw, 1.340rem); line-height: 1.450; }
.h-scena { margin: clamp(28px, 5vw, 60px) 0 clamp(26px, 4vw, 44px); }
.h-scena-in { display: grid; grid-template-columns: 1fr 1fr; width: min(1280px, 100%); margin-inline: auto; }
.h-drum { position: relative; height: 34px; border-block: 1px solid var(--linie-2); background: repeating-linear-gradient(90deg, var(--otel) 0 34px, transparent 34px 78px) 0 50% / 78px 2px repeat-x; animation: drum 1.400s linear infinite; }
.h-drum span { position: absolute; right: var(--g); top: 50%; translate: 0 -50%; padding: 4px 12px; background: var(--buton-fund); color: var(--buton-text); font: 700 .950rem/1 var(--ft); letter-spacing: .120em; }
@keyframes drum { to { background-position: -78px 50%; } }
.h-nota { margin: 16px 0 0; font-size: .900rem; color: var(--otel); max-width: 70ch; }
@media (max-width: 760px) { .h-scena-in { grid-template-columns: 1fr; } .h-scena-in .scena-hub { margin-top: -27%; } }

/* desenele */
.scena, .schema { width: 100%; height: auto; overflow: visible; fill: none; stroke: var(--trasaj); stroke-width: 1.700; stroke-linecap: round; stroke-linejoin: round; }
.scena .fin, .schema .fin { stroke-width: 1.100; opacity: .800; }
.scena .sol { stroke: var(--linie-2); }
.scena .fir { stroke: var(--op); stroke-width: 1.300; }
.scena .plin { fill: var(--fund-2); }
.scena .roata { fill: var(--fund); }
.cablu { stroke: var(--verde-viu); stroke-width: 1.500; stroke-dasharray: 5 6; opacity: .750; }
.et { fill: var(--text); stroke: none; font: 700 19px/1 var(--ft); letter-spacing: .060em; }
.et-mic { font-size: 15.500px; font-weight: 600; fill: var(--otel); }
.et-viu { fill: var(--verde-text); }
.et-val { fill: var(--chihlimbar); }
.et-con { fill: var(--verde-text); }
.puls { fill: var(--op); stroke: none; offset-rotate: 0deg; offset-distance: 0%; opacity: 0; filter: drop-shadow(0 0 4px var(--op)); }
.puls.verde { fill: var(--verde-viu); filter: drop-shadow(0 0 6px var(--verde-viu)); }
.puls.soare { fill: var(--flacara-viu); filter: drop-shadow(0 0 6px var(--flacara-viu)); }
.vezi.vazut .puls, html:not(.js) .puls { animation: puls var(--t, 3s) var(--d, 0s) linear infinite; }
@keyframes puls { 0% { offset-distance: 0%; opacity: 0; } 8% { opacity: 1; } 92% { opacity: 1; } 100% { offset-distance: 100%; opacity: 0; } }
.js .vezi .des > * { stroke-dasharray: 1; stroke-dashoffset: 1; }
.js .vezi .etichete, .js .vezi .cablu, .js .vezi .delim, .js .vezi .rezerva { opacity: 0; }
.js .vezi.vazut .des > * { animation: trage 1.300s calc(var(--i) * .170s) cubic-bezier(.5, 0, .2, 1) forwards; }
.js .vezi.vazut .etichete { animation: iveste .800s 1.300s forwards; }
.js .vezi.vazut .cablu { animation: iveste-c .800s 1.100s forwards; }
.js .vezi.vazut .delim, .js .vezi.vazut .rezerva { animation: iveste .800s 1.200s forwards; }
@keyframes trage { to { stroke-dashoffset: 0; } }
@keyframes iveste { to { opacity: 1; } }
@keyframes iveste-c { to { opacity: .750; } }
.des { transition: stroke .3s, opacity .3s; }
[data-concept].alege .concept-scena .des:not(.aprins) { opacity: .250; }
[data-concept] .concept-scena .des.aprins { stroke: var(--verde-viu); filter: drop-shadow(0 0 6px rgb(var(--stralucire) / .550)); }

/* cuprinsul lipit sus */
.cuprins { position: sticky; top: 68px; z-index: 40; background: color-mix(in srgb, var(--fund) 90%, transparent); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-block: 1px solid var(--linie); }
.cuprins ol { display: flex; gap: 4px; margin: 0 auto; padding: 0 var(--g); list-style: none; width: min(var(--lat) + 2 * var(--g), 100%); overflow-x: auto; scrollbar-width: none; }
.cuprins ol::-webkit-scrollbar { display: none; }
.cuprins a { display: block; padding: 13px 12px; white-space: nowrap; font: 600 .980rem/1 var(--ft); letter-spacing: .080em; text-transform: uppercase; text-decoration: none; color: var(--otel); border-bottom: 2px solid transparent; transition: color .2s, border-color .2s; }
.cuprins b { color: var(--linie-2); font-weight: 700; margin-right: 4px; transition: color .2s; }
.cuprins a:hover, .cuprins a.aici { color: var(--tare); }
.cuprins a.aici { border-color: var(--verde-viu); }
.cuprins a.aici b { color: var(--verde-text); }

/* traseul: bara colectoare care străbate pagina și se pune sub tensiune pe măsură ce cobori */
.traseu { position: relative; padding-left: clamp(30px, 6vw, 84px); }
.traseu::before { content: ''; position: absolute; left: 6px; top: 0; bottom: 0; width: 2px; background: var(--linie); }
.traseu-curent { position: absolute; left: 6px; top: 0; width: 2px; height: calc(var(--p, 0) * 100%); background: linear-gradient(180deg, var(--verde) 0, var(--verde-viu) 100%); box-shadow: 0 0 12px 1px rgb(var(--stralucire) / .600); }
.traseu-curent::after { content: ''; position: absolute; left: -4px; bottom: -5px; width: 10px; height: 10px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 3px var(--verde-viu), 0 0 14px 4px rgb(var(--stralucire) / .450); }
.sec { padding: clamp(60px, 9vw, 116px) 0 0; position: relative; }
.sec:last-child { padding-bottom: clamp(70px, 10vw, 130px); }
.sec-cap { position: relative; margin-bottom: clamp(22px, 3.500vw, 38px); }
.nod { position: absolute; left: calc(-1 * clamp(30px, 6vw, 84px)); top: -3px; width: 14px; height: 14px; border: 2px solid var(--linie-2); border-radius: 50%; background: var(--fund); transition: border-color .4s, box-shadow .4s, background .4s; }
.nod::after { content: ''; position: absolute; left: 12px; top: 4px; height: 2px; width: calc(clamp(30px, 6vw, 84px) - 26px); background: var(--linie); transition: background .4s; }
.sec.activ .nod { border-color: var(--verde-viu); background: var(--verde-viu); box-shadow: 0 0 14px 2px rgb(var(--stralucire) / .700); }
.sec.activ .nod::after { background: var(--verde); }
.sec-nr { margin: 0 0 10px; font: 600 1rem/1 var(--ft); letter-spacing: .160em; text-transform: uppercase; color: var(--otel); }
.sec-nr b { color: var(--verde-text); margin-right: 6px; }
.sec h2 { max-width: 18ch; }
.sec h3 { margin: clamp(34px, 5vw, 56px) 0 18px; color: var(--text); }
.sec .lead { margin-bottom: clamp(26px, 4vw, 44px); max-width: 58ch; }
#contact .lead { margin-bottom: clamp(34px, 5vw, 56px); }
.sec p { max-width: 68ch; }

.patru { list-style: none; margin: clamp(26px, 4vw, 44px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid var(--linie); }
.patru li { padding: 22px 22px 22px 0; border-right: 1px solid var(--linie); padding-left: 22px; }
.patru li:first-child { padding-left: 0; } .patru li:last-child { border-right: 0; }
.patru b { display: block; font: 700 1.350rem/1.050 var(--ft); letter-spacing: .030em; text-transform: uppercase; margin-bottom: 8px; color: var(--tare); }
.patru span { display: block; color: var(--otel); font-size: .960rem; line-height: 1.450; }
@media (max-width: 980px) { .patru { grid-template-columns: 1fr 1fr; } .patru li { border-bottom: 1px solid var(--linie); } .patru li:nth-child(odd) { padding-left: 0; } .patru li:nth-child(even) { border-right: 0; } }
@media (max-width: 520px) { .patru { grid-template-columns: 1fr; } .patru li { padding-left: 0; border-right: 0; } }

.pozitie { border: 1px solid var(--linie); background: var(--fund-2); padding: clamp(20px, 3vw, 30px); }
.pozitie ol { list-style: none; margin: 0 0 22px; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); position: relative; }
.pozitie ol::before { content: ''; position: absolute; left: 7px; right: 16%; top: 6px; height: 2px; background: linear-gradient(90deg, var(--op), var(--otel) 55%, var(--verde-viu)); }
.pozitie li { position: relative; padding-top: 26px; font: 700 1.080rem/1.150 var(--ft); letter-spacing: .050em; text-transform: uppercase; }
.pozitie li::before { content: ''; position: absolute; left: 0; top: 0; width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--op); background: var(--fund-2); }
.pozitie li:nth-child(2)::before { border-color: var(--otel); }
.pozitie li.aici { color: var(--verde-text); }
.pozitie li.aici::before { border-color: var(--verde-viu); background: var(--verde-viu); box-shadow: 0 0 0 5px rgb(var(--stralucire) / .160), 0 0 16px var(--verde-viu); animation: led 2s ease-in-out infinite; }
.pozitie p { margin: 0 0 12px; }

.activ-grila { display: grid; grid-template-columns: minmax(0, 1.250fr) minmax(0, 1fr); gap: clamp(26px, 4.500vw, 60px); align-items: start; }
@media (max-width: 1020px) { .activ-grila { grid-template-columns: 1fr; } .schema-cadru { max-width: 520px; } }
.fisa { border-top: 2px solid var(--linie-2); }
.fisa-cap, .fisa-rand { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.350fr) minmax(0, .900fr); gap: 6px 18px; padding: 13px 0; border-bottom: 1px solid var(--linie); align-items: baseline; }
.fisa-cap { font: 600 .900rem/1 var(--ft); letter-spacing: .160em; text-transform: uppercase; color: var(--otel); }
.fisa-rand b { font-weight: 700; color: var(--tare); }
.fisa-rand span:nth-child(2) { color: var(--text); font-size: .970rem; line-height: 1.400; }
@media (max-width: 640px) { .fisa-cap { display: none; } .fisa-rand { grid-template-columns: 1fr; gap: 4px; } }
.stare { display: inline-flex; align-items: baseline; gap: 7px; font: 600 .900rem/1.200 var(--ft); font-style: normal; letter-spacing: .070em; text-transform: uppercase; color: var(--verde-text); }
.stare::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; translate: 0 -1px; }
.stare.s-op { color: var(--op); } .stare.s-val { color: var(--chihlimbar); }
.schema-cadru { margin: 0; padding: clamp(16px, 2.500vw, 26px); border: 1px solid var(--linie); background: linear-gradient(var(--caroiaj) 1px, transparent 1px) 0 0 / 100% 22px, linear-gradient(90deg, var(--caroiaj) 1px, transparent 1px) 0 0 / 22px 100%, var(--fund-2); }
.schema .ex { stroke: var(--trasaj); }
.schema .op { stroke: var(--op); }
.schema .con { stroke: var(--verde-viu); }
.schema .bara { stroke-width: 4.500; }
.schema .glif { stroke-width: 1.500; }
.schema .delim { stroke: var(--chihlimbar); stroke-width: 1.200; stroke-dasharray: 3 6; }
.schema .rezerva { stroke: var(--chihlimbar); stroke-width: 1.500; stroke-dasharray: 6 5; }
.legenda { list-style: none; display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 14px 0 12px; padding: 0; font: 600 .860rem/1.200 var(--ft); letter-spacing: .070em; text-transform: uppercase; color: var(--otel); }
.legenda li::before { content: ''; display: inline-block; width: 16px; height: 3px; margin-right: 7px; vertical-align: middle; background: var(--trasaj); }
.legenda .l-op::before { background: var(--op); } .legenda .l-con::before { background: var(--verde-viu); } .legenda .l-val::before { background: repeating-linear-gradient(90deg, var(--chihlimbar) 0 4px, transparent 4px 7px); }
.schema-cadru figcaption { font-size: .860rem; line-height: 1.450; color: var(--otel); }
.zece { list-style: none; margin: 0; padding: 0; counter-reset: z; columns: 2; column-gap: clamp(26px, 5vw, 64px); }
.zece li { counter-increment: z; break-inside: avoid; position: relative; padding: 12px 0 12px 52px; border-top: 1px solid var(--linie); }
.zece li::before { content: counter(z, decimal-leading-zero); position: absolute; left: 0; top: 9px; font: 700 1.500rem/1 var(--ft); color: transparent; -webkit-text-stroke: 1px var(--verde-viu); }
@media (max-width: 700px) { .zece { columns: 1; } }

.concept { display: grid; grid-template-columns: minmax(0, 1.100fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: center; }
.concept-scena { padding: clamp(12px, 2vw, 24px); border: 1px solid var(--linie); background: var(--fund-2); position: sticky; top: 140px; }
.concept-lista { list-style: none; margin: 0; padding: 0; }
.concept-lista li { display: flex; gap: 18px; align-items: flex-start; padding: 16px 14px 16px 0; border-top: 1px solid var(--linie); cursor: default; position: relative; transition: padding .3s, background .3s; }
.concept-lista li:last-child { border-bottom: 1px solid var(--linie); }
.concept-lista li::before { content: ''; position: absolute; left: 0; top: -1px; height: 1px; width: 100%; background: var(--verde-viu); transform: scaleX(0); transform-origin: left; transition: transform .4s cubic-bezier(.6, 0, .2, 1); }
.concept-lista li:hover, .concept-lista li:focus-visible { padding-left: 14px; background: rgb(var(--stralucire) / .040); outline: 0; }
.concept-lista li:hover::before, .concept-lista li:focus-visible::before { transform: scaleX(1); }
.concept-lista .ic { width: 34px; height: 34px; color: var(--verde-text); stroke-width: 1.300; margin-top: 2px; }
.concept-lista b { display: block; font: 700 1.400rem/1.050 var(--ft); letter-spacing: .030em; text-transform: uppercase; color: var(--tare); margin-bottom: 4px; }
.concept-lista span { color: var(--otel); font-size: .970rem; line-height: 1.450; display: block; }
@media (max-width: 900px) { .concept { grid-template-columns: 1fr; } .concept-scena { position: static; } }
.nota-larga { margin: clamp(22px, 3.500vw, 36px) 0 0; padding: 16px 0 0 20px; border-left: 2px solid var(--linie-2); color: var(--otel); max-width: 74ch !important; }

.trepte { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); align-items: end; gap: 0; }
.trepte li { position: relative; padding: 22px 22px 24px; border: 1px solid var(--linie-2); border-right-width: 0; background: linear-gradient(180deg, rgb(var(--stralucire) / .090), transparent 70%), var(--fund-2); min-height: 150px; }
.trepte li:nth-child(2) { min-height: 210px; } .trepte li:nth-child(3) { min-height: 270px; border-right-width: 1px; }
.trepte li::before { content: ''; position: absolute; left: -1px; right: -1px; top: -1px; height: 3px; background: var(--verde-viu); box-shadow: 0 0 12px rgb(var(--stralucire) / .600); }
.trepte b { display: block; font: 700 1rem/1 var(--ft); letter-spacing: .180em; text-transform: uppercase; color: var(--verde-text); margin-bottom: 12px; }
.trepte span { font: 700 clamp(1.250rem, 2.500vw, 1.700rem)/1.080 var(--ft); letter-spacing: .010em; text-transform: uppercase; display: block; }
@media (max-width: 760px) { .trepte { grid-template-columns: 1fr; } .trepte li, .trepte li:nth-child(n) { min-height: 0; border-right-width: 1px; border-bottom-width: 0; margin-left: calc(var(--k) * 18px); } .trepte li:last-child { border-bottom-width: 1px; } }
.dim { max-width: 860px; }
.dim-rand { display: grid; grid-template-columns: minmax(120px, .800fr) minmax(0, 2fr) minmax(0, 1.300fr); gap: 8px 20px; align-items: center; padding: 12px 0; }
.dim-rand > span { font: 600 1.050rem/1.150 var(--ft); letter-spacing: .080em; text-transform: uppercase; color: var(--otel); }
.dim-rand > b { font: 700 1.350rem/1.150 var(--ft); letter-spacing: .020em; color: var(--tare); }
.dim-rand.deschis > b { font: 500 .950rem/1.400 var(--fx); color: var(--otel); letter-spacing: 0; }
.dim-linie { position: relative; height: 16px; background: linear-gradient(90deg, var(--linie) 1px, transparent 1px) 0 0 / 25% 100%; border-right: 1px solid var(--linie); }
.dim-linie i { position: absolute; left: var(--a); width: calc(var(--b) - var(--a)); top: 3px; bottom: 3px; background: var(--verde-viu); box-shadow: 0 0 12px rgb(var(--stralucire) / .500); transform-origin: left; }
.js .dim .dim-linie i { transform: scaleX(0); transition: transform 1.100s .2s cubic-bezier(.5, 0, .2, 1); }
.js .dim.vazut .dim-linie i { transform: none; }
.dim-rand.deschis .dim-linie i { background: repeating-linear-gradient(90deg, var(--chihlimbar) 0 6px, transparent 6px 12px); box-shadow: none; top: 6px; bottom: 6px; }
.dim-axa { display: grid; grid-template-columns: minmax(120px, .800fr) minmax(0, 2fr) minmax(0, 1.300fr); gap: 0 20px; font: 600 .860rem/1 var(--ft); letter-spacing: .080em; color: var(--otel); }
.dim-axa span { grid-column: 2; grid-row: 1; }
.dim-axa span:nth-child(1) { justify-self: start; } .dim-axa span:nth-child(2) { margin-left: 25%; translate: -50%; justify-self: start; } .dim-axa span:nth-child(3) { justify-self: center; } .dim-axa span:nth-child(4) { margin-left: 75%; translate: -50%; justify-self: start; } .dim-axa span:nth-child(5) { justify-self: end; }
@media (max-width: 640px) { .dim-rand { grid-template-columns: 1fr; gap: 6px; } .dim-axa { grid-template-columns: 1fr; } .dim-axa span { grid-column: 1; } }

.temeiuri { list-style: none; margin: 0 0 clamp(26px, 4vw, 40px); padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--linie); border: 1px solid var(--linie); }
.temeiuri li { background: var(--fund-2); padding: 24px 22px 20px; display: flex; flex-direction: column; }
.temeiuri b { font: 700 1.450rem/1.050 var(--ft); letter-spacing: .020em; text-transform: uppercase; color: var(--tare); margin-bottom: 10px; }
.temeiuri span { color: var(--text); font-size: .970rem; line-height: 1.450; flex: 1; }
.temeiuri small { margin-top: 14px; font: 600 .860rem/1 var(--ft); letter-spacing: .100em; text-transform: uppercase; color: var(--op); }
@media (max-width: 900px) { .temeiuri { grid-template-columns: 1fr 1fr; } } @media (max-width: 560px) { .temeiuri { grid-template-columns: 1fr; } }
.sursa { margin-top: 22px; padding: 16px 18px; border: 1px dashed var(--linie-2); font-size: .900rem; line-height: 1.500; color: var(--otel); max-width: 82ch !important; }
.sursa a { color: var(--verde-text); }

.validari { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 clamp(24px, 4vw, 56px); }
.validari li { display: grid; grid-template-columns: 22px 1fr auto; gap: 14px; align-items: center; padding: 16px 0; border-top: 1px solid var(--linie); }
.validari i { width: 20px; height: 20px; border: 1.500px solid var(--chihlimbar); position: relative; }
.validari i::after { content: ''; position: absolute; inset: 5px; background: var(--chihlimbar); opacity: .250; animation: led 2.200s ease-in-out infinite; }
.validari b { display: block; font: 700 1.300rem/1.100 var(--ft); letter-spacing: .020em; text-transform: uppercase; color: var(--tare); }
.validari span { display: block; color: var(--otel); font-size: .920rem; line-height: 1.350; margin-top: 3px; }
.validari em { font: 700 .780rem/1 var(--ft); font-style: normal; letter-spacing: .160em; text-transform: uppercase; color: var(--chihlimbar); border: 1px solid currentColor; padding: 5px 7px 4px; transform: rotate(-4deg); opacity: .850; white-space: nowrap; }
@media (max-width: 760px) { .validari { grid-template-columns: 1fr; } }

.modele { list-style: none; margin: 0 0 clamp(24px, 4vw, 40px); padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.modele li { padding: 14px 18px 13px; border: 1px solid var(--linie-2); font: 700 1.250rem/1.100 var(--ft); letter-spacing: .030em; text-transform: uppercase; position: relative; transition: border-color .3s, color .3s, background .3s; }
.modele li::before { content: ''; display: inline-block; width: 8px; height: 8px; margin-right: 12px; border-radius: 50%; background: var(--verde-viu); box-shadow: 0 0 10px var(--verde-viu); vertical-align: 2px; }
.modele li:hover { border-color: var(--verde-viu); background: rgb(var(--stralucire) / .060); }

.contact-grila { display: grid; grid-template-columns: minmax(0, 1.400fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
@media (max-width: 900px) { .contact-grila { grid-template-columns: 1fr; } }
.formular { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 24px; }
.formular .lat, .formular fieldset { grid-column: 1 / -1; margin: 0; }
.formular label > span, .formular legend { display: block; font: 600 .900rem/1 var(--ft); letter-spacing: .160em; text-transform: uppercase; color: var(--otel); margin-bottom: 6px; padding: 0; }
.formular input:not([type=radio]), .formular textarea { width: 100%; background: transparent; border: 0; border-bottom: 1.500px solid var(--linie-2); padding: 9px 0 10px; color: var(--tare); font: 500 1.100rem/1.400 var(--fx); border-radius: 0; transition: border-color .3s, box-shadow .3s; }
.formular textarea { resize: vertical; min-height: 84px; }
.formular input:focus, .formular textarea:focus { outline: 0; border-color: var(--verde-viu); box-shadow: 0 10px 14px -12px var(--verde-viu); }
.formular fieldset { border: 0; padding: 0; min-width: 0; }
.alegeri { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.alegeri label { position: relative; cursor: pointer; }
.alegeri input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.alegeri span { display: block; margin: 0 !important; padding: 11px 14px 10px !important; border: 1px solid var(--linie-2); font: 600 1.020rem/1 var(--ft) !important; letter-spacing: .060em !important; color: var(--text) !important; transition: background .2s, color .2s, border-color .2s; }
.alegeri input:checked + span { background: var(--buton-fund); border-color: var(--buton-fund); color: var(--buton-text) !important; }
.alegeri input:focus-visible + span { outline: 2px solid var(--verde-viu); outline-offset: 3px; }
.formular p { margin: 0; }
@media (max-width: 560px) { .formular { grid-template-columns: 1fr; } }
.direct h3 { margin: 0 0 14px; font-size: 1rem; letter-spacing: .180em; color: var(--otel); }
.direct h3:not(:first-child) { margin-top: 30px; }
.direct p { margin-bottom: 12px; }
.direct .mare { font-size: clamp(1.350rem, 2.800vw, 1.800rem); }

/* ============ Diviziile ============ */
/* prima pagină: cele cinci divizii sunt vedetele — cinci panouri înclinate, despărțite de linii de lumină verde.
   Mișcare puțină: la apariție lumina trece o singură dată prin panouri; panoul de sub cursor se umple de lumină, se lărgește,
   iar pe linia lui curge un punct. Pe telefon panourile stau unul sub altul, cu linia înclinată între ele. */
.divizii-banda h2 { margin-bottom: clamp(28px, 4vw, 52px); }
.divizii { --inclinare: -7deg; display: flex; padding: 0 clamp(44px, 5vw, 90px); overflow: hidden; }
.div { flex: 1 1 0; min-width: 0; min-height: clamp(500px, 42vw, 600px); position: relative; display: block; text-decoration: none; transform: skewX(var(--inclinare)); border-left: 2px solid rgb(var(--stralucire) / .550); box-shadow: -1px 0 14px -2px rgb(var(--stralucire) / .500); transition: flex-grow .6s cubic-bezier(.2, .8, .2, 1), opacity .7s, transform .7s cubic-bezier(.2, .7, .2, 1); }
.div:last-child { border-right: 2px solid rgb(var(--stralucire) / .550); }
.js .div { opacity: 0; transform: skewX(var(--inclinare)) translateY(46px); transition-delay: 0s, calc(var(--k) * 110ms), calc(var(--k) * 110ms); }
.js .div.vazut { opacity: 1; transform: skewX(var(--inclinare)); }
.div::before { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgb(var(--stralucire) / .340), rgb(var(--stralucire) / .060) 55%, transparent 80%); opacity: 0; transition: opacity .4s; }
.js .div.vazut::before { animation: unda 1.700s ease-out calc(var(--k) * .160s + .500s) 1 both; }
.div:hover::before, .div:focus-visible::before { opacity: 1; animation: none; }
@keyframes unda { 0%, 100% { opacity: 0; } 35% { opacity: .750; } }
.div::after { content: ''; position: absolute; left: -4px; top: -90px; width: 6px; height: 90px; border-radius: 3px; background: linear-gradient(180deg, transparent, #fff 55%, var(--verde-viu)); filter: drop-shadow(0 0 8px rgb(var(--stralucire) / 1)); opacity: 0; }
.div:hover::after, .div:focus-visible::after { opacity: 1; animation: curge 2.600s linear infinite; }
@keyframes curge { from { top: -90px; } to { top: 100%; } }
.divizii .div { overflow: clip; overflow-clip-margin: 6px; }
.div-in { position: relative; z-index: 1; min-height: inherit; display: flex; flex-direction: column; padding: clamp(22px, 2.400vw, 36px) 42px clamp(26px, 3vw, 40px); transform: skewX(calc(var(--inclinare) * -1)); }
.div:hover, .div:focus-visible { flex-grow: 1.600; outline: 0; }
.div-nr { font: 700 clamp(3.400rem, 5.600vw, 5.400rem)/1 var(--ft); color: transparent; -webkit-text-stroke: 1.500px rgb(var(--stralucire) / .700); transition: color .4s, text-shadow .4s; }
.div:hover .div-nr, .div:focus-visible .div-nr { color: var(--verde-viu); text-shadow: 0 0 26px rgb(var(--stralucire) / .700); }
.div .glif { width: min(100%, 230px); margin: clamp(16px, 2.400vw, 32px) 0; transition: filter .4s, stroke .4s; }
.div:hover .glif, .div:focus-visible .glif { stroke: #fff; filter: drop-shadow(0 0 10px rgb(var(--stralucire) / .700)); }
.div h3 { font-size: clamp(1.200rem, 1.650vw, 1.750rem); line-height: 1.040; margin: auto 0 10px; color: var(--tare); hyphens: auto; }
.div p { margin: 0 0 16px; color: var(--otel); font-size: .940rem; line-height: 1.450; }
.scena .viu { stroke: var(--verde-viu); }
.scena .viu.fin { opacity: .5; }
@media (max-width: 980px) {
  .divizii { --inclinare: 0deg; flex-direction: column; padding: 0; }
  .div { flex: none; min-height: 0; border-left: 0; box-shadow: none; }
  .div:last-child { border-right: 0; }
  .div:hover, .div:focus-visible { flex-grow: 0; }
  .div::after, .div:hover::after { opacity: 1; left: 0; right: 0; top: 0; width: auto; height: 26px; border-radius: 0; background: linear-gradient(to bottom right, transparent calc(50% - 2px), var(--verde-viu) calc(50% - 1.500px), var(--verde-viu) calc(50% + 1px), transparent calc(50% + 1.500px)); animation: none; filter: drop-shadow(0 0 7px rgb(var(--stralucire) / .900)); }
  .div-in { display: grid; grid-template-columns: 104px 1fr; gap: 2px 18px; align-items: start; padding: 44px var(--g) 26px; }
  .div .glif { grid-column: 1; grid-row: 1 / span 4; width: 104px; margin: 6px 0 0; }
  .div-nr, .div h3, .div p, .div .p-mergi { grid-column: 2; }
  .div-nr { font-size: 2rem; }
  .div h3 { margin: 4px 0 6px; font-size: 1.550rem; }
  .div p { margin-bottom: 10px; }
}

/* antetul comun al unei divizii */
.d-erou { position: relative; padding: clamp(118px, 14vw, 172px) 0 clamp(40px, 6vw, 84px); overflow: hidden; isolation: isolate; }
.d-erou::before { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(110% 70% at 80% 0, rgb(var(--stralucire) / .130), transparent 62%), linear-gradient(180deg, transparent 55%, var(--fund)), linear-gradient(var(--caroiaj) 1px, transparent 1px) 0 0 / 100% 44px, linear-gradient(90deg, var(--caroiaj) 1px, transparent 1px) 0 0 / 44px 100%; }
.d-erou-grila { display: grid; grid-template-columns: minmax(0, 1.050fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.d-nr { display: flex; align-items: baseline; gap: 14px; margin: 0 0 20px; }
.d-nr b { font: 700 clamp(3.400rem, 7vw, 5.600rem)/.800 var(--ft); color: transparent; -webkit-text-stroke: 1.500px var(--verde-viu); }
.d-nr span { font: 600 1rem/1 var(--ft); letter-spacing: .160em; text-transform: uppercase; color: var(--otel); }
.d-erou h1 { font-size: clamp(2.400rem, 5.200vw, 4.500rem); line-height: .930; }
.d-erou .lead { margin: clamp(18px, 3vw, 28px) 0 clamp(22px, 3vw, 32px); max-width: 50ch; }
.d-grafica { position: relative; padding: clamp(14px, 2.400vw, 30px); border: 1px solid var(--linie); background: linear-gradient(var(--caroiaj) 1px, transparent 1px) 0 0 / 100% 22px, linear-gradient(90deg, var(--caroiaj) 1px, transparent 1px) 0 0 / 22px 100%, var(--fund-2); }
.cu-foto .d-grafica { padding: 0; border: 0; background: none; }
.d-foto { position: relative; clip-path: polygon(9% 0, 100% 0, 100% 100%, 0 100%); overflow: hidden; }
.d-foto img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.cu-foto .d-grafica::after { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 9%; pointer-events: none; background: linear-gradient(to bottom right, transparent calc(50% - 2.500px), var(--verde-viu) calc(50% - 2px), var(--verde-viu) calc(50% + 2px), transparent calc(50% + 2.500px)); filter: drop-shadow(0 0 8px rgb(var(--stralucire) / .900)); }
@media (max-width: 900px) { .d-erou-grila { grid-template-columns: 1fr; } .d-foto { clip-path: none; } }

/* hala care se ridică și se demolează */
.hala-svg .h-el { transform-box: fill-box; transform-origin: 50% 100%; }
.hala-svg .plin { fill: var(--fund-3); }
.hala-svg .acoperis { stroke: var(--verde-viu); stroke-width: 4.500; }
.hala.sus .h-el { animation: h-urca .750s calc(var(--i) * .240s + .300s) cubic-bezier(.2, .8, .2, 1) both; }
.hala.jos .h-el { animation: h-cade .850s calc((11 - var(--i)) * .220s + .900s) cubic-bezier(.6, 0, .9, .4) both; }
@keyframes h-urca { from { opacity: 0; transform: translateY(-46px); } to { opacity: 1; transform: none; } }
@keyframes h-cade { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(74px) rotate(var(--r)); } }
.h-macara { stroke: var(--otel); transition: opacity .6s; }
.hala.jos .h-macara { opacity: .220; }
.h-carlig { animation: carlig 3.400s ease-in-out infinite; }
@keyframes carlig { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(48px); } }
.h-container { stroke: var(--otel); opacity: .300; transition: opacity .6s; }
.hala.jos .h-container { opacity: 1; }
.h-moloz { fill: var(--flacara); stroke: none; opacity: 0; transform-box: fill-box; transform-origin: 50% 100%; transform: scaleY(0); transition: transform .4s, opacity .4s; }
.hala.jos .h-moloz { transform: none; opacity: .800; transition: transform 2.800s 1.400s ease-out, opacity .5s 1.400s; }
.h-scantei { opacity: 0; }
.h-scantei circle { fill: var(--flacara-viu); stroke: none; filter: drop-shadow(0 0 8px var(--flacara)); }
.h-scantei path { stroke: var(--flacara-viu); stroke-width: 2.500; filter: drop-shadow(0 0 6px var(--flacara)); transform-box: fill-box; transform-origin: left; transform: scaleX(0); }
.hala.jos .h-scantei { animation: scantei 3s .1s ease-out both; }
.hala.jos .h-scantei path { animation: t-taie 1.100s .1s cubic-bezier(.5, 0, .2, 1) both; }
@keyframes scantei { 0% { opacity: 0; } 8% { opacity: 1; } 75% { opacity: 1; } 100% { opacity: 0; } }
.hala-comenzi { display: inline-flex; margin-top: 14px; border: 1px solid var(--linie-2); }
.hala-comenzi button { padding: 12px 20px 11px; background: none; border: 0; color: var(--otel); font: 700 1.050rem/1 var(--ft); letter-spacing: .080em; text-transform: uppercase; cursor: pointer; transition: background .3s, color .3s; }
.hala-comenzi button[aria-pressed="true"] { background: var(--buton-fund); color: var(--buton-text); }
.hala.jos .hala-comenzi button[aria-pressed="true"] { background: var(--flacara); color: #fff; }

/* dosarul și stiva */
.dosar-svg .plin { fill: var(--fund-2); }
.stiva-svg .plin { fill: var(--fund-3); }
.js .vezi .cade { opacity: 0; }
.js .vezi.vazut .cade { animation: cade .650s calc(var(--i) * .110s + .700s) cubic-bezier(.3, 1.300, .5, 1) both; }
@keyframes cade { from { opacity: 0; transform: translateY(-90px); } to { opacity: 1; transform: none; } }

/* circuitul: pașii legați de o linie pe care merge un punct de lumină */
.circuit { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); position: relative; }
.circuit.trei { grid-template-columns: repeat(3, 1fr); margin-bottom: clamp(36px, 6vw, 64px); }
.circuit::before { content: ''; position: absolute; left: 0; right: 0; top: 21px; height: 2px; background: var(--linie-2); }
.circuit::after { content: ''; position: absolute; top: 17px; left: 0; width: 10px; height: 10px; border-radius: 50%; background: var(--verde-viu); box-shadow: 0 0 0 5px rgb(var(--stralucire) / .220); animation: merge 5.500s linear infinite; }
@keyframes merge { from { left: 0; } to { left: calc(100% - 10px); } }
.circuit li { position: relative; padding: 64px 26px 0 0; }
.circuit li > span { position: absolute; top: 0; left: 0; width: 44px; height: 44px; display: grid; place-items: center; border: 2px solid var(--verde-viu); border-radius: 50%; background: var(--fund); font: 700 1.100rem/1 var(--ft); color: var(--verde-text); z-index: 1; }
.circuit b { display: block; font: 700 1.500rem/1.050 var(--ft); text-transform: uppercase; letter-spacing: .020em; margin-bottom: 8px; color: var(--tare); }
.circuit p { margin: 0; color: var(--otel); font-size: .970rem; line-height: 1.450; max-width: 30ch; }
@media (max-width: 760px) {
  .circuit, .circuit.trei { grid-template-columns: 1fr; gap: 26px; }
  .circuit::before { left: 21px; right: auto; top: 0; bottom: 0; width: 2px; height: auto; }
  .circuit::after { left: 17px; top: 0; animation-name: merge-v; }
  .circuit li { padding: 6px 0 0 64px; min-height: 44px; }
}
@keyframes merge-v { from { top: 0; } to { top: calc(100% - 10px); } }

.randuri { border-top: 1px solid var(--linie); margin-top: clamp(24px, 4vw, 40px); }
.randuri a { display: grid; grid-template-columns: minmax(200px, 1fr) 2fr auto; gap: 6px 24px; align-items: baseline; padding: 20px 6px; border-bottom: 1px solid var(--linie); text-decoration: none; }
.js .randuri a.apare { transition: opacity .7s, transform .7s, padding .3s, background .3s; }
.randuri a:hover { padding-left: 18px; background: rgb(var(--stralucire) / .040); }
.randuri b { font: 700 1.500rem/1.050 var(--ft); text-transform: uppercase; letter-spacing: .020em; }
.randuri span { color: var(--otel); }
.randuri .ic { color: var(--verde-text); }
@media (max-width: 640px) { .randuri a { grid-template-columns: 1fr auto; } .randuri span { grid-column: 1; } }
.cantar.mic { grid-template-columns: 1fr 1fr; }
.cantar.mic b { font-size: clamp(2rem, 4vw, 3rem); }

/* povestea consultanței: pașii stau pe traseu; în stânga legea, în dreapta ce facem noi */
.poveste .traseu { margin-top: clamp(10px, 3vw, 30px); }
.sec.pas { padding-top: clamp(40px, 6vw, 68px); }
.sec.pas:last-child { padding-bottom: 6px; }
.sec.pas h3 { margin: 0; font-size: clamp(1.700rem, 3.600vw, 2.600rem); color: var(--tare); max-width: 22ch; }
.pas-grila { display: grid; grid-template-columns: 1.150fr 1fr; gap: 1px; background: var(--linie); border: 1px solid var(--linie); }
.pas-grila > div { background: var(--fund-2); padding: clamp(18px, 2.600vw, 28px); }
.pas-grila .pas-noi { background: linear-gradient(135deg, rgb(var(--stralucire) / .080), transparent 62%), var(--fund-2); }
.pas-grila h4 { margin: 0 0 10px; font: 700 .950rem/1 var(--ft); letter-spacing: .160em; text-transform: uppercase; color: var(--op); }
.pas-noi h4 { color: var(--verde-text); }
.pas-grila p { margin: 0; line-height: 1.500; max-width: none; }
.pas-lege p { color: var(--text); font-size: .980rem; }
.pas-lege small { display: block; margin-top: 12px; font: 600 .860rem/1.350 var(--ft); letter-spacing: .080em; text-transform: uppercase; color: var(--op); }
@media (max-width: 760px) { .pas-grila { grid-template-columns: 1fr; } }

.marimi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.marimi article { position: relative; padding: clamp(22px, 3vw, 34px); border: 1px solid var(--linie); background: var(--fund-2); }
.marimi article::before { content: ''; position: absolute; left: -1px; right: -1px; top: -1px; height: 3px; background: var(--verde-viu); transform: scaleX(.180); transform-origin: left; transition: transform .6s cubic-bezier(.6, 0, .2, 1); }
.marimi article:hover::before { transform: none; }
.marimi article > span { font: 700 2.600rem/1 var(--ft); color: transparent; -webkit-text-stroke: 1px var(--verde-viu); }
.marimi h3 { margin: 14px 0 8px; font-size: clamp(1.500rem, 2.600vw, 2rem); }
.marimi p { color: var(--otel); margin: 0 0 16px; }
.marimi ul { list-style: none; margin: 0; padding: 0; }
.marimi li { position: relative; padding: 10px 0 10px 22px; border-top: 1px solid var(--linie); font-size: .970rem; line-height: 1.400; }
.marimi li::before { content: ''; position: absolute; left: 0; top: 20px; width: 9px; height: 2px; background: var(--verde-viu); }
@media (max-width: 900px) { .marimi { grid-template-columns: 1fr; } }
.fluxuri { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.fluxuri li { padding: 11px 15px 10px; border: 1px solid var(--linie-2); font: 600 1.080rem/1.100 var(--ft); letter-spacing: .040em; text-transform: uppercase; }
.acte { list-style: none; margin: 0 0 20px; padding: 0; border-top: 1px solid var(--linie); }
.acte li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 24px; padding: 16px 0; border-bottom: 1px solid var(--linie); }
.acte a { color: var(--tare); text-decoration: none; font-weight: 700; transition: color .2s; }
.acte a:hover { color: var(--verde-text); }
.acte .ic { color: var(--verde-text); }
.divizie .sursa { max-width: 82ch; }

.d-contact { padding-top: 0; }
.d-contact-in { border: 1px solid var(--linie); background: var(--fund-2); padding: clamp(24px, 4vw, 48px); display: grid; grid-template-columns: 1.200fr 1fr; gap: 24px 48px; align-items: center; }
.d-contact-in .lead { margin: 0; }
.d-contact-leg { display: grid; gap: 14px; margin: 0; }
@media (max-width: 800px) { .d-contact-in { grid-template-columns: 1fr; } }
.d-alte { border-top: 1px solid var(--linie); padding: clamp(40px, 6vw, 72px) 0; }
.d-alte h2 { font-size: 1rem; letter-spacing: .180em; color: var(--otel); margin-bottom: 20px; }
.d-alte-grila { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--linie); border: 1px solid var(--linie); }
.d-alte a { display: grid; grid-template-columns: 64px 1fr; gap: 8px 14px; align-items: center; padding: 20px; background: var(--fund); text-decoration: none; transition: background .3s; }
.d-alte a:hover { background: var(--fund-2); }
.d-alte a > span { grid-column: 1 / -1; font: 700 1rem/1 var(--ft); letter-spacing: .140em; color: var(--verde-text); }
.d-alte .glif { width: 64px; }
.d-alte b { font: 700 1.150rem/1.100 var(--ft); text-transform: uppercase; letter-spacing: .020em; }
@media (max-width: 980px) { .d-alte-grila { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .d-alte-grila { grid-template-columns: 1fr; } }

/* cererea de ofertă: configuratorul (produs → dimensiune → grosime → cantitate), lista de repere și cântarul comenzii minime */
.comanda { max-width: none; }
.cfg { display: grid; grid-template-columns: minmax(0, 1.550fr) minmax(0, 1fr); gap: clamp(20px, 3vw, 44px); align-items: start; }
.cfg-pasi { display: grid; gap: clamp(22px, 3vw, 32px); min-width: 0; }
.cfg-pas h3, .lista h3 { display: flex; align-items: baseline; gap: 10px; margin: 0 0 12px; font-size: 1rem; letter-spacing: .160em; color: var(--otel); }
.cfg-pas h3 b { font-size: 1.700rem; letter-spacing: 0; color: transparent; -webkit-text-stroke: 1px var(--verde-viu); }
.cfg-produse { display: grid; grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); gap: 8px; }
.cfg-produse button { display: grid; justify-items: center; align-content: start; gap: 8px; padding: 14px 6px 12px; background: var(--fund-2); border: 1px solid var(--linie); color: var(--text); font: 700 .960rem/1.100 var(--ft); letter-spacing: .040em; text-transform: uppercase; cursor: pointer; transition: border-color .2s, background .2s, color .2s, box-shadow .2s; }
.cfg-produse svg { width: 40px; height: 40px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.cfg-produse svg .plin { fill: currentColor; stroke: none; }
.cfg-produse button:hover { border-color: var(--linie-2); }
.cfg-produse button[aria-pressed="true"] { border-color: var(--verde-viu); background: rgb(var(--stralucire) / .100); color: var(--verde-text); box-shadow: inset 0 -3px 0 var(--verde-viu); }
.cfg-optiuni { display: flex; flex-wrap: wrap; gap: 6px; }
.cfg-optiuni button { min-width: 58px; padding: 11px 12px 10px; background: var(--fund-2); border: 1px solid var(--linie-2); color: var(--text); font: 600 1.040rem/1 var(--ft); letter-spacing: .030em; white-space: nowrap; cursor: pointer; transition: border-color .2s, background .2s, color .2s; }
.cfg-optiuni button:hover { border-color: var(--verde-viu); }
.cfg-optiuni button[aria-pressed="true"] { background: var(--buton-fund); border-color: var(--buton-fund); color: var(--buton-text); }
.cfg-pas-gros[hidden] { display: none; }
/* fișa reperului ales: ca o plăcuță, cu greutățile și cantitatea */
.cfg-rezultat { position: sticky; top: 92px; padding: clamp(18px, 2.400vw, 26px); border: 1px solid var(--linie-2); background: linear-gradient(180deg, #fff, #f0f2ec); box-shadow: inset 0 1px 0 #fff, 0 22px 44px -30px rgb(40 60 30 / .450); }
.cfg-nume { margin: 0 0 16px; font: 700 clamp(1.500rem, 2.600vw, 1.950rem)/1.050 var(--ft); letter-spacing: .010em; text-transform: uppercase; color: var(--tare); min-height: 2.100em; }
.cfg-rezultat dl { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 0 0 18px; background: var(--linie); border: 1px solid var(--linie); }
.cfg-rezultat dl div { padding: 12px 14px; background: #fff; }
.cfg-rezultat dt { font: 600 .820rem/1 var(--ft); letter-spacing: .140em; text-transform: uppercase; color: var(--otel); }
.cfg-rezultat dd { margin: 7px 0 0; font: 700 1.650rem/1 var(--ft); color: var(--tare); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cfg-cant { display: grid; grid-template-columns: 1fr auto 1fr; gap: 12px; align-items: end; margin-bottom: 18px; }
.cfg-cant em { padding-bottom: 13px; font-style: normal; color: var(--otel); }
.cfg-cant input { font-variant-numeric: tabular-nums; }
.cfg-rezultat .buton { width: 100%; justify-content: center; }
.lista table { width: 100%; border-collapse: collapse; }
.lista th { padding: 10px 8px; border-bottom: 2px solid var(--linie-2); text-align: left; font: 600 .820rem/1 var(--ft); letter-spacing: .140em; text-transform: uppercase; color: var(--otel); }
.lista td { padding: 13px 8px; border-bottom: 1px solid var(--linie); font-variant-numeric: tabular-nums; }
.lista td:first-child { font-weight: 700; color: var(--tare); }
.lista .nr { text-align: right; white-space: nowrap; }
.lista td:last-child { width: 44px; text-align: right; }
.lista td button { width: 34px; height: 34px; display: inline-grid; place-items: center; background: none; border: 1px solid var(--linie-2); color: var(--otel); cursor: pointer; transition: color .2s, border-color .2s; }
.lista td button:hover { color: var(--flacara); border-color: var(--flacara); }
.lista-goala { margin: 0 !important; padding: 16px 8px; border-bottom: 1px solid var(--linie); color: var(--otel); }
.lista.are .lista-goala, .lista:not(.are) table { display: none; }
.js .lista tr.nou td { animation: rand-nou 1.200s ease-out; }
@keyframes rand-nou { from { background: rgb(var(--stralucire) / .280); } to { background: transparent; } }
.cfg-alt { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, .800fr) auto; gap: 16px; align-items: end; padding: 18px 20px; border: 1px dashed var(--linie-2); }
.formular select { width: 100%; background: var(--fund-2); border: 0; border-bottom: 1.500px solid var(--linie-2); padding: 10px 0 11px; color: var(--tare); font: 500 1.100rem/1.400 var(--fx); border-radius: 0; }
.formular select:focus { outline: 0; border-color: var(--verde-viu); }
.c-cantar { position: relative; display: grid; grid-template-columns: auto 1fr; gap: 12px 30px; align-items: center; padding: 24px; background: linear-gradient(180deg, #e9eee1, #d9e1ce); border: 1px solid var(--linie-2); box-shadow: inset 0 2px 6px rgb(40 60 30 / .160); transition: border-color .3s; }
.c-afisaj b { font: 700 clamp(2.600rem, 6vw, 4rem)/1 var(--ft); color: var(--chihlimbar); font-variant-numeric: tabular-nums; transition: color .3s; }
.c-afisaj em { font: 700 1.600rem/1 var(--ft); font-style: normal; color: var(--chihlimbar); opacity: .750; margin-left: 8px; }
.c-cantar.atins .c-afisaj b, .c-cantar.atins .c-afisaj em { color: var(--verde-text); }
.c-bara { position: relative; height: 18px; margin-top: 16px; border: 1px solid var(--linie-2); background: linear-gradient(90deg, var(--linie) 1px, transparent 1px) 0 0 / 10% 100%; }
.c-bara i { position: absolute; inset: 2px auto 2px 2px; width: calc(var(--f, 0) * (100% - 4px)); background: var(--chihlimbar); transition: width .5s cubic-bezier(.2, .8, .2, 1), background .3s; }
.c-cantar.atins .c-bara i { background: #6ea21c; }
.c-bara span { position: absolute; right: 0; top: -22px; font: 700 .860rem/1 var(--ft); letter-spacing: .100em; color: var(--otel); }
.c-stare { grid-column: 1 / -1; margin: 0 !important; color: var(--otel); font-size: .950rem; }
.c-cantar.eroare { border-color: var(--flacara); }
.c-cantar.eroare .c-stare { color: #b3361a; }
@media (max-width: 900px) {
  .cfg { grid-template-columns: 1fr; }
  .cfg-rezultat { position: static; }
}
@media (max-width: 640px) {
  .cfg-produse { grid-template-columns: repeat(3, 1fr); }
  .cfg-produse button { font-size: .860rem; padding: 12px 4px 10px; }
  .cfg-alt { grid-template-columns: 1fr 1fr; padding: 16px; }
  .cfg-alt label:first-child { grid-column: 1 / -1; }
  .c-cantar { grid-template-columns: 1fr; }
  .lista thead { display: none; }
  .lista tr { display: grid; grid-template-columns: 1fr auto auto; gap: 2px 12px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--linie); }
  .lista td { padding: 0; border: 0; }
  .lista td:first-child { grid-column: 1 / 3; }
  .lista td:nth-child(2) { display: none; }
  .lista td:nth-child(3)::after { content: ' buc'; color: var(--otel); }
  .lista td:nth-child(4)::after { content: ' t'; color: var(--otel); }
  .lista td:nth-child(3), .lista td:nth-child(4) { text-align: left; }
  .lista td:last-child { grid-column: 3; grid-row: 1 / 3; }
}

@media (prefers-reduced-motion: reduce) {
  .js .vezi .cade { opacity: 1; }
  .circuit::after { display: none; }
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; animation-delay: 0s !important; transition-duration: .01ms !important; transition-delay: 0s !important; }
  .puls { display: none; }
  .js .apare { opacity: 1; transform: none; }
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}
@media print { .antet, .bara, .poarta, .cuprins, .h-drum { display: none !important; } body { background: #fff; color: #000; } .js .apare { opacity: 1; transform: none; } }