/* =========================================================================== DG26 — dg26-2026.css · UN SINGUR FIȘIER CSS pentru șabloanele 2026 --------------------------------------------------------------------------- Se pune în: themes/agencyblax/css/dg26-2026.css 18 septembrie 2026 CE ESTE Cele trei foi de stil ale designului 2026, lipite cap-coadă, în EXACT ordinea în care WordPress le scotea până acum: 1. css/dg26-baza.css (înlocuitorul lui style.css) 2. dg26-fonturi/dg26-fonturi.css (cele 16 @font-face) 3. css/header-2026-new.css (header, meniu, bara flotantă) DE CE ORDINEA ASTA ȘI NU ALTA Nu e aleasă de mine. Așa ieșeau din WordPress: · `dg26-baza` era pusă în coadă la prioritatea 9998 (snippetul „CSS slim"); · `dg26-fonturi` și apoi `header-2026-new` la 9999 („înregistrare CSS"), header-ul declarat dependent de fonturi ca să nu-l poată depăși. WordPress tipărește foile în ordinea în care intră în coadă, deci baza → fonturi → header. Header-ul rămâne ultimul, adică are ultimul cuvânt acolo unde se contrazice cu regulile de bază. Exact ca înainte. (Fonturile fiind numai @font-face, poziția lor la mijloc nu schimbă nimic — dar le-am lăsat unde erau, ca să nu fie nimic de explicat.) DE CE EXISTĂ FIȘIERUL ĂSTA Trei fișiere înseamnă trei cereri la server înainte ca pagina să poată fi afișată. Pe F.A.Q., măsurat pe 18 septembrie: 1.170 ms de afișare blocată cu trei fișiere, ~150 ms cu unul singur. Nu mărimea e problema (43 KB în total, ~11 KiB comprimat) — ci drumurile dus-întors. SINGURA MODIFICARE FAȚĂ DE ORIGINALE Cele 16 adrese ale fișierelor de font. În `dg26-fonturi.css` erau scrise relativ la locul lui, adică începeau cu files/… — iar fișierul ăsta stă în alt folder, așa că au primit în față ../dg26-fonturi/ Fonturile NU s-au mutat. Sunt tot în `themes/agencyblax/dg26-fonturi/files/`. În rest nu s-a schimbat nicio literă: niciun selector rescris, nicio regulă reordonată, niciun spațiu „optimizat". CE SE ÎNTÂMPLĂ DACĂ ȘTERGI FIȘIERUL ĂSTA Nimic rău. Cele două snippete verifică întâi dacă există; dacă nu-l găsesc, încarcă automat cele trei fișiere de dinainte, care rămân neatinse pe disc. Ăsta e și felul de a da înapoi: redenumești fișierul, golești cache-ul. CELE TREI FIȘIERE ORIGINALE RĂMÂN PE SERVER Nu le șterge. Pe paginile care NU sunt 2026 (blog, taxonomii, pagini vechi) se încarcă mai departe `dg26-fonturi.css` și `header-2026-new.css` de acolo. =========================================================================== */ /* =========================================================================== ↓↓↓ PARTEA 1 din 3 — regulile de bază (fostul style.css, slim) sursa: css/dg26-baza.css =========================================================================== */ /* ───────────────────────────────────────────────────────────────────────── DG26 – CSS de bază pentru șabloanele 2026 Se pune în: themes/agencyblax/css/dg26-baza.css 10 septembrie 2026 ───────────────────────────────────────────────────────────────────────── CE ESTE Înlocuitorul lui `style.css` (145 KB) pe paginile construite cu șabloanele 2026 — deocamdată homepage-ul și cele 123 de pagini de oraș. Conține EXACT regulile din `style.css` care ating ceva pe paginile alea. Nimic rescris, nimic „optimizat de mână": fiecare declarație e copiată cuvânt cu cuvânt, în ordinea originală, ca să cascadeze identic. CUM A FOST ALES CE RĂMÂNE Am extras toate clasele și id-urile din `header-2026-new.php`, `page-city-2026v3.php` și `page-home-2026v3.php` — 141 de clase distincte — și le-am confruntat cu cele 1.687 de selectoare din `style.css`, cu un parser CSS adevărat, nu cu căutare de text. O regulă a rămas doar dacă TOATE clasele și id-urile din selectorul ei există în șabloane. Regulile scrise pe elemente goale (`body`, `h1`, `a`, `img`, `input`…) au rămas toate, pentru că se aplică oriunde. Rezultatul: reguli pe elemente goale ................ 55 selectoare clase care chiar apar în 2026 ........... 3 selectoare clase care NU apar nicăieri în 2026 ..... 1601 selectoare ← scoase Cele trei clase folosite sunt `.site-container`, `.site-inner` și `.logo-image`. Atât. Verificarea decisivă: șabloanele 2026 nu folosesc NICIO clasă Bootstrap — nici `col-`, nici `row`, nici `navbar`, `panel`, `btn`. Cele 289 de selectoare Bootstrap din `style.css` (26,5 KB) nu ating nimic acolo. La fel slick, isotope, swiper, EDD, calendarul, testimonialele, `#footer`-ul vechi și ecranul de încărcare. CIFRELE style.css 148.701 octeți → 27,2 KiB comprimat fișierul ăsta 3.465 octeți → 1,2 KiB comprimat Pachetul CSS al paginii scade de la 42,0 KiB la aproximativ 16 KiB. Era singurul fișier rămas care mai bloca afișarea, cu 340 ms măsurați pe /escort-koeln/ (PageSpeed, mobil, Slow 4G, 10 septembrie 2026). CE NU E AICI, ȘI DE CE E ÎN REGULĂ · @font-face — `style.css` nu avea niciunul; fonturile vin din `dg26-fonturi/dg26-fonturi.css`, neatins de schimbarea asta; · @keyframes „spin" — era doar pentru `.ploading` și `#load_screen`, care nu există pe niciun șablon 2026; · orice `url(...)` — toate cele 20 din `style.css` erau în reguli scoase (pad.png, steagurile vechi, pointy.png…). Fișierul ăsta nu cere niciun fișier extern, deci nu adaugă nicio cerere la server. CE PARE CIUDAT ȘI E LĂSAT INTENȚIONAT · regulile `dl` / `dt` / `dd` apar de mai multe ori, unele contrazicându-se. Așa erau și în `style.css`. Le-am păstrat în aceeași ordine ca rezultatul final să fie identic. Nu le curăța „ca să fie frumos" — ai schimba afișarea; · `input[name=update_cart]`, `input[name="best_news_name"]` și celelalte sunt rămășițe de la un magazin și un formular de newsletter care nu mai există. Ocupă 400 de octeți și nu strică nimic. Le-am lăsat pentru că n-am cum să verific din cod că nu mai sunt folosite nicăieri; · `a[href="/availability/"] { display: none; }` ASCUNDE linkurile către /availability/. E o decizie veche, dinainte. Dacă o scoți, linkurile alea reapar brusc pe site. Lăsat exact cum era. DACĂ TREBUIE DAT ÎNAPOI Dezactivezi snippetul `DG26 – CSS slim` din WPCode și golești cache-ul. `style.css` se întoarce imediat. Fișierul ăsta poate rămâne pe server — nefolosit, nu deranjează pe nimeni. ───────────────────────────────────────────────────────────────────────── */ html { -webkit-font-smoothing: antialiased; } body { background-color: #141414; color: #999999; font-family: "Open Sans", sans-serif; font-size: 18px; overflow-x: hidden; } h1, h2, h3, h4, h5, h6 { color: #ffffff; font-family: times new roman; font-weight: 500; line-height: 1.1; } a:focus, a:hover { color: #ffffff; text-decoration: none; } p { margin: 0 0 30px; } audio { background: #555 none repeat scroll 0 0; border: 1px solid #000; padding: 1px; margin: 10px 0px; } a:hover { color: #ffffff; text-decoration: none; } a:focus { outline: none; } img { max-width: 100%; height: auto; margin: 10px auto; } blockquote { border-left: 5px solid #333; font-size: 17.5px; margin: 0 0 20px; padding: 10px 20px; } .site-container { background-color: #181818; position: relative; top: 0px; } .site-inner { margin-left: auto; margin-right: auto; padding-top: 0px; padding-bottom: 0px; } dl { border-bottom: 1px solid #212121; border-radius: 0; border-top: 1px solid #000; padding: 7px 0; } dl:first-child { border-top: 0 none; } dl:last-child { border-bottom: 0 none; } hr { border-color: #333 -moz-use-text-color -moz-use-text-color; } button, input, select, textarea { background: #222222 none repeat scroll 0 0; border: 0 none; border-radius: 3px; font-family: inherit; font-size: inherit; line-height: inherit; padding: 10px 20px; } dl { border-bottom: 1px solid #262626; border-radius: 0; border-top: 0 none; padding: 7px 0; } dl { margin-bottom: 0px; margin-top: 0; } dt, dd { line-height: 1.42857; } dt { font-weight: normal; } dd { margin-left: 0; } dl { overflow: hidden; } dt { float: left; margin: 0; padding: 0 0.4em 0 0; max-width: 50%; } dd { color: #ccc; float: right; margin: 0; max-width: 40%; padding: 0 0 0 0.4em; text-align: right; } input[type="file"]:focus, input[type="checkbox"]:focus, input[type="radio"]:focus { outline: none; outline-offset: -2px; } textarea { background: #222 none repeat scroll 0 0; border: 0 none; border-radius: 4px; width: 100%; } input[name=update_cart]:hover { color: #000000 !important; } label { color: #ccc; display: inline-block; font-weight: 400; margin-bottom: 5px; max-width: 100%; } pre { background-color: #2b303b; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 4px; color: #83b0ae; display: block; font-size: 16px; line-height: 1.42857; margin: 0 0 25px; padding: 9.5px; word-break: break-all; word-wrap: break-word; } code { background-color: #2b303b; border-radius: 4px; color: #83b0ae; font-size: 90%; padding: 2px 4px; } a { color: #bdb392; } legend { border-color: -moz-use-text-color -moz-use-text-color #333; color: #999; } .logo-image { margin-top: -8px !important; margin-left: -5px; } @media (max-width: 767px) { .site-container { margin-right: 0; margin-left: 0; } figcaption p { font-size: 12px !important; } } @media (max-width: 300px) { figcaption { display: none; } } @media (max-width: 480px) { article { padding: 5px !important; } } @media (max-width: 1199px) { .logo-image { margin: 0 auto; } } input[name="best_news_name"], input[name=best_news_email], input[name=best_new_save] { background: rgba(0,0,0, 0.15) none repeat scroll 0 0; border: 1px solid #333; margin:0px 5px; } input[type=button] { margin:0px; } input[name="best_news_name"]:focus, input[name=best_news_email]:focus { background: #000000; } input[name=best_new_save]:hover { background: #000000; } @media (max-width:768px) { article iframe { max-width: 100%; } } a[href="/availability/"] { display: none; } /* =========================================================================== ↓↓↓ PARTEA 2 din 3 — fonturile găzduite local (16 @font-face) sursa: dg26-fonturi/dg26-fonturi.css · cu căile refăcute =========================================================================== */ /* =========================================================================== DG26 — Fonturi găzduite pe serverul tău --------------------------------------------------------------------------- Înlocuieşte legătura către fonts.googleapis.com. Aceleaşi două familii, aceleaşi greutăţi, aceleaşi litere — dar servite de la tine. DE CE CONTEAZĂ, pe scurt: · viteză — nu se mai aşteaptă conectarea la două domenii străine (fonts.googleapis.com pentru CSS, fonts.gstatic.com pentru fişiere) înainte să apară textul cu fontul corect; · legal — nu se mai trimite adresa IP a fiecărui vizitator german către Google. Tribunalul din München, ianuarie 2022, a decis că e prelucrare de date fără consimţământ. A urmat un val de scrisori de avertizare către site-uri germane. CE CONŢINE Open Sans 400, 600, 700, 800 (normal) Playfair Display 400, 600, 700 normal + 400 italic Exact ce cerea linkul vechi din header. Nimic în plus. SUBSETURI latin — literele obişnuite, inclusiv ä ö ü ß latin-ext — diacritice est-europene, pentru nume de modele `unicode-range` face ca browserul să descarce latin-ext DOAR dacă pe pagină chiar apare o literă din el. Pe o pagină nemţească normală nu se descarcă. `font-display: swap` — textul apare imediat cu fontul de sistem şi se schimbă când soseşte cel adevărat. Fără el, textul stă invizibil. Fişierele vin din pachetele oficiale @fontsource (Google Fonts, licenţă SIL Open Font License 1.1 — găzduirea pe server propriu e permisă). =========================================================================== */ /* ─────────── Open Sans ─────────── */ /* Open Sans 400 — latin */ @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('../dg26-fonturi/files/open-sans-latin-400-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* Open Sans 400 — latin-ext */ @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('../dg26-fonturi/files/open-sans-latin-ext-400-normal.woff2') 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; } /* Open Sans 600 — latin */ @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url('../dg26-fonturi/files/open-sans-latin-600-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* Open Sans 600 — latin-ext */ @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url('../dg26-fonturi/files/open-sans-latin-ext-600-normal.woff2') 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; } /* Open Sans 700 — latin */ @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url('../dg26-fonturi/files/open-sans-latin-700-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* Open Sans 700 — latin-ext */ @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url('../dg26-fonturi/files/open-sans-latin-ext-700-normal.woff2') 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; } /* Open Sans 800 — latin */ @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 800; font-display: swap; src: url('../dg26-fonturi/files/open-sans-latin-800-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* Open Sans 800 — latin-ext */ @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 800; font-display: swap; src: url('../dg26-fonturi/files/open-sans-latin-ext-800-normal.woff2') 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; } /* ─────────── Playfair Display ─────────── */ /* Playfair Display 400 — latin */ @font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 400; font-display: swap; src: url('../dg26-fonturi/files/playfair-display-latin-400-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* Playfair Display 400 — latin-ext */ @font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 400; font-display: swap; src: url('../dg26-fonturi/files/playfair-display-latin-ext-400-normal.woff2') 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; } /* Playfair Display 600 — latin */ @font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 600; font-display: swap; src: url('../dg26-fonturi/files/playfair-display-latin-600-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* Playfair Display 600 — latin-ext */ @font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 600; font-display: swap; src: url('../dg26-fonturi/files/playfair-display-latin-ext-600-normal.woff2') 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; } /* Playfair Display 700 — latin */ @font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 700; font-display: swap; src: url('../dg26-fonturi/files/playfair-display-latin-700-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* Playfair Display 700 — latin-ext */ @font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 700; font-display: swap; src: url('../dg26-fonturi/files/playfair-display-latin-ext-700-normal.woff2') 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; } /* Playfair Display 400 italic — latin */ @font-face { font-family: 'Playfair Display'; font-style: italic; font-weight: 400; font-display: swap; src: url('../dg26-fonturi/files/playfair-display-latin-400-italic.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* Playfair Display 400 italic — latin-ext */ @font-face { font-family: 'Playfair Display'; font-style: italic; font-weight: 400; font-display: swap; src: url('../dg26-fonturi/files/playfair-display-latin-ext-400-italic.woff2') 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; } /* =========================================================================== ↓↓↓ PARTEA 3 din 3 — header, meniu, bara flotantă, căutare sursa: css/header-2026-new.css =========================================================================== */ /* ========================================================= Düsseldorf Girls - Header 2026 v3 (2 zone) + Floating Bar + Search --------------------------------------------------------- v3 — 17 septembrie 2026: ICONIŢE SVG ÎN LOC DE FONTAWESOME MERGE ÎMPREUNĂ CU `header-2026-new.php` v3. Nu urca unul fără celălalt. 1. Selectorii scrişi pe `i` au primit şi `.dg26-ic`. Amândouă variantele rămân: `i` pentru şabloanele care încă folosesc FontAwesome (single-models, homepage), `.dg26-ic` pentru cele trecute pe SVG. Când trec toate, `i` poate fi scos — dar nu strică dacă rămâne. 2. Cele două iconiţe desenate din CSS (săgeata submeniurilor şi lupa de lângă „Städte") nu mai folosesc litere din font. Sunt măşti SVG scrise direct aici. Culoarea vine tot din `var(--dg-new-gold)`. Mărimile şi culorile sunt neschimbate — doar sursa desenului diferă. ========================================================= */ :root { --dg-new-dark: #080809; --dg-new-dark-2: #0d0d0e; --dg-new-gold: #d4af37; --dg-new-gold-light: #e8c866; --dg-new-text: rgba(255,255,255,.9); --dg-new-muted: rgba(255,255,255,.62); --dg-new-line: rgba(255,255,255,.11); } body.dg-2026-new-header-template, body.dg-2026-new-header-template .site-container { background: #0b0b0c; } /* ───────────────────────────────────────────────────────────────────── PLASĂ DE SIGURANȚĂ PENTRU HEADER-UL LIPIT (vezi blocul de la finalul fișierului, „HEADER LIPIT PE ECRAN"). `position: sticky` se strică în tăcere — fără eroare, fără nimic în consolă — dacă vreun element părinte are `overflow` setat pe altceva decât `visible`. Iar `overflow-x: hidden` pe body sau pe containerul principal e una dintre cele mai frecvente reguli din teme, pusă ca să nu apară bară de derulare orizontală. În acest fișier nu există o astfel de regulă, dar ea poate veni din `style.css` al temei, unde nu ne uităm acum. De-aceea o neutralizăm aici, înlocuind-o cu `clip`: taie identic pe orizontală, dar — spre deosebire de `hidden` — nu creează un container de derulare, deci `sticky` continuă să funcționeze. Regula stă INTENȚIONAT sus, înaintea lui `body.dg-search-open`. Cele două au aceeaşi specificitate, deci câştigă cea scrisă mai jos — şi vrem să câştige aceea, ca pagina să rămână blocată cât timp panoul de căutare e deschis. Dacă muţi blocul ăsta mai jos, se strică. ───────────────────────────────────────────────────────────────────── */ @media (min-width: 992px) { /* ── DE CE `:has()` ───────────────────────────────────────────────── Din septembrie 2026 fişierul ăsta nu mai e legat prin direct în header-2026-new.php, ci înregistrat corect în WordPress, ca WP-Optimize să-l poată uni cu restul CSS-ului (vezi snippetul „DG26 – înregistrare CSS"). Asta a economisit 680 ms de blocare, dar înseamnă că fişierul ajunge acum pe TOATE paginile, inclusiv pe cele vechi, care nu folosesc header-ul 2026. Aproape toate regulile de aici sunt legate de clase (`.dg-new-header`, `body.dg-2026-new-header-template`), deci pe paginile vechi pur şi simplu nu se potrivesc cu nimic. Excepţie făceau cele două de mai jos, scrise pe `html`, care s-ar fi aplicat peste tot. `html:has(body.dg-2026-new-header-template)` înseamnă „elementul html, dar numai dacă înăuntru există un body cu clasa asta". Clasa e pusă de header-ul 2026, deci regulile rămân exact unde erau şi înainte. */ html:has( body.dg-2026-new-header-template ) { overflow-x: clip; /* Ancorele din pagină să nu aterizeze sub header-ul lipit. */ scroll-padding-top: 125px; } body.dg-2026-new-header-template, body.dg-2026-new-header-template .site-container { overflow-x: clip; overflow-y: visible; } } .dg-new-header, .dg-new-header *, .dg-new-floatbar, .dg-new-floatbar *, .dg-new-search-overlay, .dg-new-search-overlay * { box-sizing: border-box; } .dg-new-header { position: relative; z-index: 1000; background: var(--dg-new-dark); color: #fff; font-family: "Open Sans", Arial, sans-serif; border-bottom: 1px solid var(--dg-new-line); } .dg-new-header a, .dg-new-header a:hover, .dg-new-header a:focus { text-decoration: none; outline: none; } .dg-new-header__wrap { width: min(1320px, calc(100% - 56px)); margin: 0 auto; } /* ===== ZONA 1: main (logo + contact + lang) ===== */ .dg-new-header__main { background: rgba(10,10,11,.98); } .dg-new-header__main-wrap { min-height: 70px; display: flex; align-items: center; justify-content: space-between; gap: 24px; } .dg-new-logo { display: inline-flex; align-items: center; line-height: 1; flex: 0 0 auto; } .dg-new-logo img, .dg-new-logo .logo-image { width: auto; max-height: 56px; height: auto; display: block; } .dg-new-logo__text { font-family: "Playfair Display", Georgia, serif; font-size: 26px; line-height: 1.15; color: #fff; } .dg-new-logo__text em { font-style: normal; color: var(--dg-new-gold); font-size: 0.78em; letter-spacing: 1.5px; } /* Contact buttons - desktop, in zona 1 */ .dg-new-contact--desktop { display: flex; align-items: center; gap: 12px; margin-left: auto; } .dg-new-contact__link { display: inline-flex; align-items: center; gap: 9px; min-height: 0; padding: 9px 18px; border: 1.5px solid rgba(212,175,55,.45); border-radius: 9px; background: rgba(212,175,55,.08); color: #f0e6c8 !important; font-size: 13px; font-weight: 700; letter-spacing: .02em; line-height: 1; transition: transform .2s ease, border-color .2s ease, background .2s ease; } .dg-new-contact__link i, .dg-new-contact__link .dg26-ic { color: var(--dg-new-gold); font-size: 15px; } .dg-new-contact__link[href*="wa.me"] i, .dg-new-contact__link[href*="wa.me"] .dg26-ic { color: #25D366; } .dg-new-contact__link[href*="t.me"] i, .dg-new-contact__link[href*="t.me"] .dg26-ic { color: #2AABEE; } .dg-new-contact__link:hover { transform: translateY(-1px); border-color: rgba(212,175,55,.8); background: rgba(212,175,55,.15); } .dg-new-header__right { display: flex; align-items: center; gap: 18px; margin-left: 18px; } /* Language switcher - acelasi nivel vizual ca butoanele de contact */ .dg-new-language { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border: 1.5px solid rgba(212,175,55,.45); border-radius: 9px; background: rgba(212,175,55,.08); color: #f0e6c8 !important; font-size: 13px; font-weight: 700; letter-spacing: .02em; line-height: 1; transition: transform .2s ease, border-color .2s ease, background .2s ease; } .dg-new-language:hover { transform: translateY(-1px); border-color: rgba(212,175,55,.8); background: rgba(212,175,55,.15); } .dg-new-flag { display: inline-block; width: 24px; height: 18px; border-radius: 3px; background-size: cover; box-shadow: 0 0 0 1px rgba(255,255,255,.18); flex-shrink: 0; } .dg-new-flag--gb { background: #00247d url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 30'%3E%3Cpath d='M0 0h60v30H0z' fill='%2300247d'/%3E%3Cpath d='M0 0l60 30M60 0L0 30' stroke='%23fff' stroke-width='6'/%3E%3Cpath d='M30 0v30M0 15h60' stroke='%23fff' stroke-width='10'/%3E%3Cpath d='M30 0v30M0 15h60' stroke='%23cf142b' stroke-width='6'/%3E%3Cpath d='M0 0l60 30M60 0L0 30' stroke='%23cf142b' stroke-width='2'/%3E%3C/svg%3E") center/cover; } /* ===== Buton de căutare în header (desktop) ===== Acelaşi limbaj vizual ca butoanele de contact: aceeaşi ramă, acelaşi auriu, aceeaşi înălţime. Nu-şi cere atenţia mai mult decât Anrufen sau WhatsApp. Sub 992px dispare — acolo căutarea stă în bara flotantă de jos. */ .dg-new-searchbtn { display: inline-flex; align-items: center; gap: 9px; padding: 9px 16px; border: 1.5px solid rgba(212,175,55,.45); border-radius: 9px; background: rgba(212,175,55,.08); color: #f0e6c8; font-family: "Open Sans", Arial, sans-serif; font-size: 13px; font-weight: 700; letter-spacing: .02em; line-height: 1; cursor: pointer; transition: transform .2s ease, border-color .2s ease, background .2s ease; } .dg-new-searchbtn i, .dg-new-searchbtn .dg26-ic { color: var(--dg-new-gold); font-size: 15px; } .dg-new-searchbtn:hover { transform: translateY(-1px); border-color: rgba(212,175,55,.8); background: rgba(212,175,55,.15); } .dg-new-searchbtn:focus-visible { outline: 2px solid var(--dg-new-gold); outline-offset: 2px; } /* Cât timp panoul de căutare e deschis, pagina de sub el nu se mai derulează. */ body.dg-search-open { overflow: hidden; } /* Hamburger - fara cerc, cu label MENU */ .dg-new-menu-toggle { display: none; flex-direction: column; align-items: center; gap: 5px; background: none; border: none; padding: 4px; cursor: pointer; } .dg-new-menu-toggle__bars { display: flex; flex-direction: column; gap: 5px; } .dg-new-menu-toggle__bars span { display: block; width: 22px; height: 2px; background: var(--dg-new-gold); border-radius: 1px; transition: transform .2s ease, opacity .2s ease; } .dg-new-menu-toggle__label { font-size: 10px; color: #f0e6c8; letter-spacing: .1em; font-weight: 700; } .dg-new-header.is-menu-open .dg-new-menu-toggle__bars span:nth-child(1) { transform: translateY(7px) rotate(45deg); } .dg-new-header.is-menu-open .dg-new-menu-toggle__bars span:nth-child(2) { opacity: 0; } .dg-new-header.is-menu-open .dg-new-menu-toggle__bars span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); } /* ===== ZONA 2: meniu ===== */ .dg-new-menu { border-top: 1px solid rgba(255,255,255,.08); background: rgba(8,8,9,.98); } .dg-new-menu__mobile-head { display: none; } .dg-new-menu__list, .dg-new-menu__list ul { margin: 0; padding: 0; list-style: none; } .dg-new-menu__list { display: flex; align-items: center; justify-content: center; gap: clamp(18px, 2.2vw, 34px); min-height: 42px; } .dg-new-menu__list > li { position: relative; margin: 0; padding: 0; } .dg-new-menu__list > li > a { position: relative; display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 0; background: transparent !important; border: 0 !important; box-shadow: none !important; color: rgba(255,255,255,.86) !important; font-size: 12px; font-weight: 800; letter-spacing: .12em; line-height: 1; text-transform: uppercase; transition: color .2s ease; } .dg-new-menu__list > li > a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 8px; height: 1px; background: var(--dg-new-gold); opacity: 0; transform: scaleX(.36); transition: opacity .22s ease, transform .22s ease; } .dg-new-menu__list > li > a:hover, .dg-new-menu__list > li.current-menu-item > a, .dg-new-menu__list > li.current-menu-ancestor > a { color: var(--dg-new-gold-light) !important; } .dg-new-menu__list > li > a:hover::after, .dg-new-menu__list > li.current-menu-item > a::after, .dg-new-menu__list > li.current-menu-ancestor > a::after { opacity: 1; transform: scaleX(1); } /* Desktop dropdown */ .dg-new-menu__list .sub-menu { position: absolute; top: 100%; left: 50%; z-index: 20; min-width: 210px; max-height: 70vh; overflow-y: auto; padding: 10px 0; background: #0d0d0e; border: 1px solid rgba(255,255,255,.10); box-shadow: 0 20px 50px rgba(0,0,0,.36); opacity: 0; visibility: hidden; transform: translate(-50%, 8px); transition: opacity .18s ease, transform .18s ease, visibility .18s ease; } .dg-new-menu__list li:hover > .sub-menu, .dg-new-menu__list li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translate(-50%, 0); } .dg-new-menu__list .sub-menu a { display: block; padding: 10px 16px; color: rgba(255,255,255,.78) !important; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; transition: background .2s ease, color .2s ease; } .dg-new-menu__list .sub-menu a:hover { background: rgba(212,175,55,.10); color: #fff !important; } /* ===== Floating bar ===== */ .dg-new-floatbar { display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 1500; background: #0e0e0e; border-top: 1px solid rgba(212,175,55,.25); box-shadow: 0 -4px 18px rgba(0,0,0,.35); } .dg-new-floatbar__item { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 12px 4px; background: none; border: none; color: #f0e6c8; font-size: 12px; font-weight: 700; text-decoration: none; position: relative; } .dg-new-floatbar__item i, .dg-new-floatbar__item .dg26-ic { font-size: 25px; color: var(--dg-new-gold); } .dg-new-floatbar__item span { color: #aaa; } /* Culori specifice per buton — mobile și desktop */ .dg-new-floatbar__item[href*="wa.me"] i, .dg-new-floatbar__item[href*="wa.me"] .dg26-ic, .dg-new-floatbar__item[href*="whatsapp"] i, .dg-new-floatbar__item[href*="whatsapp"] .dg26-ic { color: #25D366; } .dg-new-floatbar__item[href*="t.me"] i, .dg-new-floatbar__item[href*="t.me"] .dg26-ic, .dg-new-floatbar__item[href*="telegram"] i, .dg-new-floatbar__item[href*="telegram"] .dg26-ic { color: #2AABEE; } #dg-new-search-open i, #dg-new-search-open .dg26-ic { color: #FF0000; } .dg-new-floatbar__item:not(:last-child)::after { content: ""; position: absolute; right: 0; top: 10px; bottom: 10px; width: 1px; background: rgba(255,255,255,.08); } /* ===== Model search overlay ===== */ .dg-new-search-overlay { display: none; flex-direction: column; position: fixed; inset: 0; z-index: 2000; background: #0a0a0a; } .dg-new-search-overlay.dg-open { display: flex; } .dg-new-search-overlay__head { display: flex; align-items: center; gap: 10px; padding: 18px 16px; border-bottom: 1px solid rgba(255,255,255,.08); } .dg-new-search-overlay__input-wrap { position: relative; flex: 1; } .dg-new-search-overlay__input-wrap i, .dg-new-search-overlay__input-wrap .dg26-ic { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: #777; font-size: 18px; } .dg-new-search-overlay__input-wrap input { width: 100%; background: rgba(255,255,255,.06); border: 1px solid rgba(212,175,55,.4); border-radius: 10px; padding: 14px 16px 14px 42px; color: #fff; font-size: 18px; } .dg-new-search-overlay__close { background: none; border: none; color: #999; font-size: 24px; flex-shrink: 0; cursor: pointer; } .dg-new-search-overlay__close:hover { color: #ddd; } .dg-new-search-overlay__hint { text-align: center; color: #777; font-size: 15px; line-height: 1.5; margin-top: 36px; padding: 0 24px; } .dg-new-search-overlay__results { overflow-y: auto; padding: 6px 16px; } @media (min-width: 768px) { .dg-new-search-overlay__head, .dg-new-search-overlay__results, .dg-new-search-overlay__hint { max-width: 640px; margin: 0 auto; width: 100%; box-sizing: border-box; } } .dg-new-search-result { display: flex; align-items: center; gap: 14px; padding: 10px; margin-bottom: 10px; border-radius: 12px; background: #141414; border: 1px solid rgba(255,255,255,.08); color: inherit; text-decoration: none; } .dg-new-search-result__img { width: 64px; height: 80px; flex-shrink: 0; border-radius: 9px; overflow: hidden; background: #222; display: block; } .dg-new-search-result__img img { width: 100%; height: 100%; object-fit: cover; display: block; } .dg-new-search-result__info { flex: 1; min-width: 0; } .dg-new-search-result__info strong { display: block; color: #fff; font-size: 18px; font-weight: 700; } .dg-new-search-result__city { display: flex; align-items: center; gap: 5px; color: #aaa; font-size: 14px; margin-top: 5px; } .dg-new-search-result__city i, .dg-new-search-result__city .dg26-ic { color: var(--dg-new-gold); font-size: 13px; } .dg-new-search-result__chevron { color: #555; font-size: 18px; flex-shrink: 0; } .dg-new-search-empty { color: #777; font-size: 15px; text-align: center; margin-top: 30px; } .dg-new-city-result { display: flex; align-items: center; justify-content: space-between; padding: 16px 6px; border-bottom: 1px solid rgba(255,255,255,.07); color: #eee !important; font-size: 17px; font-weight: 500; text-decoration: none; } .dg-new-city-result i, .dg-new-city-result .dg26-ic { color: #555; font-size: 15px; } /* ========================================================= MOBILE (<=991px) ========================================================= */ @media (max-width: 991px) { .dg-new-header__wrap { width: 100%; } .dg-new-header__main-wrap { min-height: 84px; padding: 0 18px; flex-wrap: nowrap; } .dg-new-logo { min-width: 0; flex-shrink: 1; } .dg-new-logo img, .dg-new-logo .logo-image { max-width: 190px; max-height: none; } .dg-new-logo__text { font-size: 24px; } .dg-new-contact--desktop { display: none; } .dg-new-searchbtn { display: none; } .dg-new-header__right { gap: 14px; margin-right: 6px; flex-shrink: 0; } .dg-new-language--single { display: inline-flex; align-items: center; gap: 8px; padding: 0; border: none; background: none; color: #f0e6c8 !important; font-size: 16px; font-weight: 500; font-family: "Open Sans", Arial, sans-serif; letter-spacing: 0.02em; } .dg-new-language--single .dg-new-flag { width: 30px; height: 22px; border-radius: 4px; box-shadow: 0 0 0 1px rgba(255,255,255,.2); } .dg-new-menu-toggle { display: flex; gap: 6px; } .dg-new-menu-toggle__bars span { width: 26px; height: 2.5px; } .dg-new-menu-toggle__label { font-size: 11px; } /* Mobile slide-down menu */ .dg-new-menu { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 1600; overflow-y: auto; background: rgba(8,8,9,.99); border-top: 0; opacity: 0; visibility: hidden; transform: translateY(-12px); transition: opacity .2s ease, transform .2s ease, visibility .2s ease; } .dg-new-header.is-menu-open .dg-new-menu { opacity: 1; visibility: visible; transform: translateY(0); } .dg-new-menu__wrap { width: 100%; padding: 0 22px 26px; } .dg-new-menu__mobile-head { display: flex; align-items: center; justify-content: space-between; padding: 18px 0; border-bottom: 1px solid rgba(255,255,255,.08); margin-bottom: 6px; } .dg-new-menu__mobile-logo { font-family: "Playfair Display", Georgia, serif; font-size: 19px; color: #fff; display:flex; align-items:center; } .dg-new-menu__mobile-logo img { max-width: 175px; height: auto; display:block; } .dg-new-menu__mobile-logo em { font-style: normal; color: var(--dg-new-gold); } .dg-new-menu-close { background: none; border: none; color: #999; font-size: 24px; } .dg-new-menu__list { display: block; min-height: 0; padding: 6px 0 0; } .dg-new-menu__list > li > a { display: flex; justify-content: space-between; width: 100%; min-height: 0; padding: 17px 0; border-bottom: 1px solid rgba(255,255,255,.07) !important; font-size: 16px; letter-spacing: .08em; } .dg-new-menu__list > li > a::after { display: none; } /* Săgeata de la submeniuri. ÎNAINTE era litera „\f078" din fontul FontAwesome. Acum e acelaşi desen, dar ca mască: forma vine din imaginea SVG de mai jos, iar culoarea din `background-color`. Aşa `var(--dg-new-gold)` continuă să decidă culoarea, exact ca înainte, şi nu mai depinde de niciun font. 12×12px = fostul `font-size: 12px`; iconiţa e pătrată (1792×1792 unităţi), deci umple caseta identic cu litera. */ .dg-new-menu__list > li.dg-has-submenu > a::before { content: ""; display: inline-block; width: 12px; height: 12px; margin-left: 10px; background-color: var(--dg-new-gold); -webkit-mask: url("data:image/svg+xml,") center/contain no-repeat; mask: url("data:image/svg+xml,") center/contain no-repeat; transition: transform .2s ease; } .dg-new-menu__list > li.dg-has-submenu.dg-submenu-open > a::before { transform: rotate(180deg); } /* Lupa de lângă „Städte" — acelaşi procedeu ca la săgeata de mai sus. Lăţimea e 13px, nu 14: glifa lupei are 1664 din cele 1792 de unităţi ale pătratului em (0,929), deci la un font-size de 14px ocupa 13px pe orizontală. Păstrăm exact atât, ca spaţierea să nu se schimbe. */ .dg-new-menu__list > li > a.dg-city-trigger::after { content: ""; display: inline-block; width: 13px; height: 14px; margin-left: 10px; background-color: var(--dg-new-gold); -webkit-mask: url("data:image/svg+xml,") center/contain no-repeat; mask: url("data:image/svg+xml,") center/contain no-repeat; } .dg-new-menu__list .sub-menu { position: static; min-width: 0; max-height: 0; overflow: hidden; padding: 0; background: transparent; border: 0; box-shadow: none; opacity: 1; visibility: visible; transform: none; transition: max-height .28s ease; } .dg-new-menu__list > li.dg-submenu-open > .sub-menu { max-height: 60vh; overflow-y: auto; padding: 4px 0 10px 14px; -webkit-overflow-scrolling: touch; } .dg-new-menu__list .sub-menu a { padding: 11px 0; border-bottom: 1px solid rgba(255,255,255,.06); font-size: 13px; color: rgba(255,255,255,.62) !important; white-space: normal; } .dg-new-floatbar { display: flex; } body.dg-2026-new-header-template { padding-bottom: 74px; } } @media (min-width: 992px) { .dg-new-floatbar { display: none !important; } } /* ========================================================= HEADER LIPIT PE ECRAN — doar desktop (≥992px) --------------------------------------------------------- DE CE. Pe mobil există bara flotantă de jos, mereu vizibilă. Pe desktop nu era nimic echivalent: butoanele Anrufen / WhatsApp / Telegram plecau în sus la prima derulare. Pe o pagină de oraş cu peste 200 de fotografii, cine ajunge jos trebuia să urce înapoi ca să poată suna. DE CE `sticky` ŞI NU `fixed`. `fixed` scoate elementul din fluxul paginii; ar fi trebuit să compensăm manual cu `padding-top` pe container, iar orice nepotrivire între înălţimea reală şi padding face ca tot conţinutul să sară la încărcare — adică exact CLS, pe toate paginile site-ului. `sticky` rămâne în flux: nu compensează nimeni nimic, nu sare nimic. DE CE SE LIPEŞTE HEADER-UL ÎNTREG, NU DOAR RÂNDUL CU BUTOANE. Un element `sticky` rămâne prizonier în cutia părintelui său. `.dg-new-header__main` e copilul lui `.dg-new-header`; dacă l-am lipi pe el, s-ar lipi doar cât timp header-ul e vizibil — 113px de derulare — şi apoi ar pleca şi el. DE CE MENIUL NU SE STRÂNGE LA DERULARE. Era ideea evidentă: laşi lipit doar rândul de 70px cu logo şi butoane, iar rândul de meniu (43px) se ascunde. Nu se poate fără preţ: `sticky` fiind în flux, ascunderea meniului scade înălţimea header-ului în flux de la 113px la 70px, iar tot conţinutul de sub el sare în sus cu 43px în timp ce derulezi. COST. 113px permanent pe desktop. Pe mobil, zero — nu se schimbă nimic. ========================================================= */ @media (min-width: 992px) { .dg-new-header { position: sticky; top: 0; } /* Când eşti logat, WordPress pune bara lui neagră fixă în capul paginii. Fără rândul ăsta, header-ul lipit ar intra sub ea şi ţi-ar acoperi butoanele din admin. Bara are 32px de la 783px în sus. */ body.admin-bar .dg-new-header { top: 32px; } } @media (max-width: 380px) { .dg-new-header__main-wrap { padding: 0 14px; } .dg-new-logo img, .dg-new-logo .logo-image { max-width: 165px; max-height: none; } .dg-new-header__right { gap: 10px; margin-right: 2px; } .dg-new-language--single { font-size: 14px; } .dg-new-language--single .dg-new-flag { width: 26px; height: 19px; } } /* ===== sfârșitul lui dg26-2026.css ===== */