/* Bara de navigație CityTwin, aceeași pe toate paginile publice. Până pe 10 august 2026 doar landing-ul și pagina engleză aveau bară, iar a landing-ului era făcută aproape numai din ancore (#concept, #cum), care nu duc nicăieri de pe altă pagină. Restul paginilor aveau „Înapoi la pagina principală" sau nimic, deci la o pagină internă nu se vedea ce mai există pe site. Din 17 august 2026 bara are UN SINGUR NIVEL: șase intrări în stânga, trei acțiuni în dreapta, fără submeniuri. Grupurile „Produs", „Demonstrație" și „Transparență" au dispărut cu tot cu CSS-ul și JS-ul lor (clasele `.ctnav-grup`, `.ctnav-buton`, `.ctnav-sub`). Paginile care stăteau doar în ele se ajung acum din blocul de legături secundare din subsol (`.ctfoot`, la finalul fișierului). Markup-ul e scris literal în fiecare pagină (nu injectat la build), ca dezvoltarea locală și producția să arate la fel. Un test din tests/test_nav.py compară blocurile între ele și pică dacă unul o ia razna. Paleta e cea din brandul ARSC valabil din 07-08-2026. */ /* 1220 px, nu 1180 ca înainte: șase etichete pe un rând plus cele trei acțiuni cer 1159 px măsurați, iar sub atât una din etichete se rupe în două rânduri în interiorul ei. Aceeași valoare e și pragul spre meniul de mobil, mai jos: sub ea bara nu încape întreagă, deci trece direct pe butonul de meniu, fără stadiu intermediar înghesuit. */ .ctnav{position:sticky;top:0;z-index:900;background:#0D0E10;border-bottom:1px solid rgba(255,255,255,.10)} .ctnav-wrap{max-width:1220px;margin:0 auto;padding:0 22px;display:flex;align-items:center;gap:14px;min-height:60px} .ctnav a{text-decoration:none} .ctnav-brand{display:flex;align-items:center;flex:0 0 auto;padding:8px 0} .ctnav-brand img{height:22px;width:auto;display:block} /* Fără submeniuri, lista nu mai are nevoie să se întindă pe toată înălțimea barii: banda de 6 px dintre etichetă și submeniu, care închidea meniul sub deget, nu mai are ce închide. */ .ctnav-meniu{display:flex;align-items:center;gap:12px;flex:1 1 auto;justify-content:space-between} .ctnav-lista{list-style:none;display:flex;align-items:center;gap:2px;margin:0;padding:0} .ctnav-lista > li{display:flex;align-items:center} /* `white-space:nowrap`: fără el flexboxul preferă să rupă „Cum funcționează" în două rânduri în loc să lase eticheta lată cât îi trebuie. */ .ctnav-simplu{ display:inline-flex;align-items:center;white-space:nowrap; font:inherit;font-size:14px;font-weight:500;color:#D8DAE0; background:none;border:0;padding:9px 9px;border-radius:7px;line-height:1.2; } .ctnav-simplu:hover{color:#fff;background:rgba(255,255,255,.07)} .ctnav-actiuni{display:flex;align-items:center;gap:8px;flex:0 0 auto} /* „Autentificare" e drum de serviciu pentru cine are deja cont, nu invitație: text simplu, fără chenar, ca singurul buton plin din bară să rămână demonstrația. */ .ctnav-cont{font-size:13.5px;font-weight:500;color:#9A9DA5;padding:8px 9px;border-radius:7px} .ctnav-cont:hover{color:#fff;background:rgba(255,255,255,.07)} .ctnav-lang{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:#D8DAE0;padding:8px 10px;border-radius:7px;border:1px solid rgba(255,255,255,.20)} .ctnav-lang:hover{color:#fff;border-color:rgba(255,255,255,.42)} .ctnav-lang svg{width:17px;height:11px;display:block;border-radius:1.5px} .ctnav-cta{font-size:14px;font-weight:600;color:#0D0E10;background:#FF6A00;padding:9px 15px;border-radius:7px;white-space:nowrap} .ctnav-cta:hover{background:#FF8329} /* pagina curentă: marcată din nav.js după `location.pathname`, ca markup-ul să rămână identic în toate fișierele (altfel fiecare pagină ar avea alt atribut și testul de identitate n-ar mai avea ce compara) */ .ctnav [aria-current="page"]{color:#FF9450} .ctnav-toggle{display:none;margin-left:auto;width:42px;height:38px;border:1px solid rgba(255,255,255,.22); border-radius:8px;background:none;cursor:pointer;position:relative} .ctnav-toggle span,.ctnav-toggle span::before,.ctnav-toggle span::after{ content:"";position:absolute;left:11px;width:18px;height:1.8px;background:#fff;border-radius:2px} .ctnav-toggle span{top:18px} .ctnav-toggle span::before{top:-6px;left:0} .ctnav-toggle span::after{top:6px;left:0} /* Pe ecran mic: aceleași șase intrări, în aceeași ordine, tot pe un singur nivel. */ @media (max-width:1220px){ .ctnav-wrap{flex-wrap:wrap;gap:10px} .ctnav-toggle{display:block} .ctnav-meniu{display:none;width:100%;flex-direction:column;align-items:stretch;gap:6px;padding:4px 0 16px} .ctnav[data-meniu="deschis"] .ctnav-meniu{display:flex} .ctnav-lista{flex-direction:column;align-items:stretch;gap:2px} .ctnav-lista > li{display:block} .ctnav-simplu{display:block;padding:11px} .ctnav-actiuni{flex-wrap:wrap;padding:10px 11px 0;border-top:1px solid rgba(255,255,255,.12);margin-top:6px} .ctnav-cta{flex:1 1 auto;text-align:center} } /* Legăturile secundare, în subsolul fiecărei pagini publice cu subsol. Aici stau paginile scoase din bară la trecerea ei pe un singur nivel: nu s-a șters nimic, doar s-a mutat. Blocul nu-și pune culori proprii de fundal sau de text (`color:inherit`): merge la fel pe subsolul întunecat al landing-ului și pe cel alb al paginilor legale. */ .ctfoot{display:flex;flex-wrap:wrap;gap:14px 56px;margin:0 0 22px;padding:0 0 20px; border-bottom:1px solid currentColor;border-color:rgba(128,128,128,.28)} .ctfoot-grup{min-width:170px} .ctfoot-titlu{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase; opacity:.72;margin:0 0 8px} .ctfoot ul{list-style:none;margin:0;padding:0} .ctfoot li{margin:0 0 5px} .ctfoot a{color:inherit;text-decoration:none;font-size:13.5px;line-height:1.5} .ctfoot a:hover{color:#FF6A00;text-decoration:underline} .ctfoot a[aria-current="page"]{font-weight:600} /* ============================================================================ STRATUL ESTETIC AL PAGINILOR PUBLICE (22-08-2026, mockup aprobat de Eduard) Fișierul e legat deja de toate paginile publice, deci schimbarea ajunge în toate dintr-un singur loc: nicio pagină nu se atinge la marcaj. AICI SE SCHIMBĂ NUMAI CULOAREA ȘI SUPRAFEȚELE. Textele, conținutul, butoanele, fonturile, dimensiunile, spațierile și iconurile rămân neatinse. Paleta: alb #FFFFFF · griuri #F7F8FA / #F1F2F5 · linii #E4E6EB / #D3D7DE text #1A1C1F (17,1:1) · secundar #4A4C52 (8,6:1) · stins #6B6E76 (5,1:1) accent #FF6A00 - nuanța exactă din siglă, pentru umpluturi și accente accent-text #C24E00 (4,8:1) - pentru textul și linkurile portocalii Pe umplutura portocalie textul e grafit (5,95:1); alb pe portocaliu dă 2,87:1 și pică AA. Niciun bleumarin, niciun fundal închis. ========================================================================== */ :root{ --ct-alb:#FFFFFF; --ct-gri1:#F7F8FA; --ct-gri2:#F1F2F5; --ct-linie:#E4E6EB; --ct-linie2:#D3D7DE; --ct-text:#1A1C1F; --ct-text2:#4A4C52; --ct-stins:#6B6E76; --muted:#5A5D64; --ct-acc:#FF6A00; --ct-acc-txt:#C24E00; --ct-acc-txt2:#A84300; --ct-acc-bg:#FFF4EC; --ct-acc-linie:#FFD9C2; } /* ---------- bara de navigație ---------- */ .ctnav{background:var(--ct-alb) !important;border-bottom:1px solid var(--ct-linie) !important} .ctnav-simplu{color:var(--ct-text2) !important} .ctnav-simplu:hover{color:var(--ct-text) !important;background:var(--ct-gri1) !important} .ctnav-cont{color:var(--ct-stins) !important} .ctnav-cont:hover{color:var(--ct-text) !important;background:var(--ct-gri1) !important} .ctnav-lang{color:var(--ct-text2) !important;border-color:var(--ct-linie2) !important} .ctnav-lang:hover{color:var(--ct-text) !important;border-color:var(--ct-text) !important} .ctnav [aria-current="page"]{color:var(--ct-acc-txt) !important} .ctnav-toggle{border-color:var(--ct-linie2) !important} .ctnav-toggle span,.ctnav-toggle span::before,.ctnav-toggle span::after{background:var(--ct-text) !important} .ctnav-meniu{background:var(--ct-alb) !important} .ctnav-actiuni{border-top-color:var(--ct-linie) !important} /* ---------- eroul și banda de dovadă ---------- */ header.hero{background:var(--ct-alb) !important;color:var(--ct-text) !important; border-bottom:1px solid var(--ct-linie) !important} header.hero .lead{color:var(--ct-stins) !important} .proof{background:var(--ct-gri1) !important;color:var(--ct-stins) !important; border-bottom:1px solid var(--ct-linie) !important} .proof b{color:var(--ct-text) !important} .proof .dot{color:#8A8D95 !important} /* pastilele de încredere din erou au stil inline gândit pentru fundal închis */ .eu-chips span{background:var(--ct-acc-bg) !important;border-color:var(--ct-acc-linie) !important; color:var(--ct-acc-txt2) !important} /* ---------- butoane: numai culoarea, forma rămâne a lor ---------- */ .btn.primary,.pform button{background:var(--ct-acc) !important;color:var(--ct-text) !important} .btn.primary:hover,.pform button:hover{background:#E85F00 !important;color:#fff !important} .btn.ghost{border-color:var(--ct-linie2) !important;color:var(--ct-text) !important} .btn.ghost:hover{background:var(--ct-gri1) !important} .btn.line{border-color:var(--ct-linie2) !important;color:var(--ct-text) !important} .btn.line:hover{background:var(--ct-gri1) !important} /* ---------- secțiuni, carduri, delimitări ---------- */ .alt{background:var(--ct-gri1) !important} .card,.faq details,.shot svg{border-color:var(--ct-linie) !important} .faq details[open]{border-color:var(--ct-linie2) !important} .shot svg{background:var(--ct-gri1) !important} section .sub,.card p,.shot figcaption,.cardlist li,.datanote,.who span{color:var(--ct-stins) !important} .card h3,.shot figcaption b,.cardlist li b,.who b{color:var(--ct-text) !important} .datanote,.shotnote{border-left-color:var(--ct-linie2) !important;color:var(--ct-stins) !important} .pill{background:var(--ct-acc-bg) !important;color:var(--ct-acc-txt2) !important} .tag.locked{background:var(--ct-acc-bg) !important;color:var(--ct-acc-txt2) !important} a{color:var(--ct-acc-txt)} /* ---------- secțiunea hărții ---------- */ .harta{background:var(--ct-gri1) !important;color:var(--ct-text) !important; border-top:1px solid var(--ct-linie) !important;border-bottom:1px solid var(--ct-linie) !important} .harta h2{color:var(--ct-text) !important} .harta .sub{color:var(--ct-stins) !important} .ct-scena{border-color:var(--ct-linie2) !important} .ct-rezumat,.ct-nota{color:var(--ct-stins) !important} .ct-rezumat b,.ct-nota b{color:var(--ct-text) !important} .ct-nota{border-left-color:var(--ct-linie2) !important} .harta .film figcaption,section.alt .film figcaption,#demo .film figcaption{color:var(--ct-stins) !important} .harta .film figcaption b,section.alt .film figcaption b,#demo .film figcaption b{color:var(--ct-text) !important} /* ---------- subsol ---------- */ footer{background:var(--ct-gri1) !important;color:var(--ct-stins) !important; border-top:1px solid var(--ct-linie) !important} footer b,footer strong,.ctfoot-titlu{color:var(--ct-text) !important} footer a{color:var(--ct-acc-txt) !important} .ctfoot a{color:var(--ct-text2) !important} .ctfoot a:hover{color:var(--ct-acc-txt) !important} .ctfoot-grup{border-color:var(--ct-linie) !important} /* ---------- blocul Rețeaua ARSC ---------- */ .arsc-eco{background:var(--ct-alb) !important;color:var(--ct-text) !important; border-top:1px solid var(--ct-linie) !important} .arsc-eco .eco-title{color:var(--ct-acc-txt) !important} .arsc-eco .eco-lede,.arsc-eco .eco-col h3,.arsc-eco .eco-col a span{color:var(--ct-stins) !important} .arsc-eco .eco-col a{color:var(--ct-text) !important} .arsc-eco .eco-col a:hover{color:var(--ct-acc-txt) !important} .arsc-eco .eco-base{color:var(--ct-stins) !important;border-top-color:var(--ct-linie) !important} .arsc-eco .eco-base a{color:var(--ct-stins) !important} .arsc-eco .eco-base a:hover{color:var(--ct-acc-txt) !important} /* ---------- siglele pe fundal deschis ---------- Aceleași sigle, varianta pentru fundal deschis, care există deja în assets/. Nu e o imagine nouă: e perechea celei inversate, care pe alb ar fi invizibilă. */ .ctnav-brand img[src*="citytwin-logo-reversed"], footer img[src*="citytwin-logo-reversed"]{content:url('/assets/citytwin-logo.png?v=1')} .brand img[src*="citytwin-lockup-reversed"]{content:url('/assets/citytwin-lockup.png?v=1')} .arsc-eco img[src*="arsc-logo-reversed"],footer img[src*="arsc-logo-reversed"]{content:url('/assets/arsc-logo.png')} .arsc-eco-mini{background:var(--ct-gri1) !important;color:var(--ct-text) !important; border:1px solid var(--ct-linie)} .arsc-eco-mini a{color:var(--ct-acc-txt) !important}