/* --- Fira Sans, gazduit la noi, cu grosimi reale 400 si 700 (2026-09-02) --- Era declarat doar in paginile de rezervare si de masini. Orice alta bucata care cerea 700 sau mai gros cadea pe fontul temei, care are doar 400, iar browserul ingrosa artificial - de acolo veneau diacriticele stalcite (a-breve, s si t cu virgula). Declarat aici, e disponibil pe tot site-ul. */ @font-face{font-family:'Fira Sans DPD';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/dpd/fira-400-latin-ext.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} @font-face{font-family:'Fira Sans DPD';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/dpd/fira-400-latin.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} @font-face{font-family:'Fira Sans DPD';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/dpd/fira-700-latin-ext.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} @font-face{font-family:'Fira Sans DPD';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/dpd/fira-700-latin.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} /* Fontul site-ului, 'Fira Sans', era incarcat DOAR la greutatea normala. Cand pagina cerea bold (700, 800), browserul nu gasea o taietura groasa si o fabrica singur - ingrosa literele subtiri pe orizontala. Se vede cel mai urat la diacritice: caciula de pe ă si virgulita de la ș, ț se ingroasa si se lipesc de litera. Clientul, 23 septembrie: "vezi ca ingroasa diacriticele si e ciudat, probabil de la font nu stiu". Chiar de la font era. Legam si greutatea 700 de fisierele pe care le avem deja pe server (aceleasi folosite de bara cu pasii), asa ca bold-ul e acum taiat de designer, nu fabricat de browser. Nu se incarca nimic in plus: fisierele erau deja cerute. */ @font-face{font-family:'Fira Sans';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/dpd/fira-700-latin-ext.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} @font-face{font-family:'Fira Sans';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/dpd/fira-700-latin.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} /* DPD Rent - Responsive & Design Fixes */ /* 1. Car images - fix stretching */ img.img-fluid[style*="height: 250px"], img.img-fluid[style*="height: 220px"], img[style*="height: 250px"][alt="car-image"], img[style*="height: 220px"][alt="Toyota"] { height: auto !important; max-height: 220px; width: 100%; object-fit: contain; object-position: center; } /* 2. Button hovers */ .btn-order { transition: all 0.3s ease !important; } .btn-order:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,0.15); } .btn.animated-btn { transition: all 0.3s ease !important; } .btn.animated-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,0.15); } /* 3. Card hover */ .listing-item { transition: transform 0.25s ease, box-shadow 0.25s ease !important; border-radius: 10px; overflow: hidden; } .listing-item:hover { transform: translateY(-4px) !important; box-shadow: 0 8px 30px rgba(0,0,0,0.12) !important; } /* 4. Countdown + promo image - always same row */ .search-box-banner .col-5 .title { margin-left: auto !important; margin-right: -5px !important; padding-top: 8px; text-align: right; } .search-box-banner .teeter-element-1 { margin-top: 0 !important; } .search-box-banner .countdown { white-space: nowrap; } @media (max-width: 400px) { .search-box-banner .countdown .num { font-size: 26px !important; } .search-box-banner .col-5 { padding-right: 0 !important; padding-left: 0 !important; } .search-box-banner .col-5 .title { margin-right: -75px !important; } } /* 5. Prevent horizontal scroll */ html, body { overflow-x: clip; scroll-behavior: smooth; } /* 6. Sticky navbar */ .header { position: sticky !important; top: 0 !important; z-index: 999 !important; } /* 7. Search box - no negative margins */ .search-box-banner { margin-left: 0 !important; margin-right: 0 !important; max-width: 100% !important; } @media (max-width: 991px) { .search-box-banner { width: 100% !important; } } /* 8. Language switcher - original positioning */ /* 9. Hamburger animation */ #mobile_btn { cursor: pointer; padding: 8px; } #mobile_btn .bar-icon { display: flex; flex-direction: column; gap: 5px; } #mobile_btn .bar-icon span { display: block; width: 24px; height: 2.5px; background: #201F1D; border-radius: 2px; transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55); } html.menu-opened #mobile_btn .bar-icon span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); } html.menu-opened #mobile_btn .bar-icon span:nth-child(2) { opacity: 0; } html.menu-opened #mobile_btn .bar-icon span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); } /* 10. Hamburger menu - no logo, smooth slide */ .main-menu-wrapper:not(.mobile_display_lang) .menu-header .menu-logo { display: none !important; } .main-menu-wrapper .menu-header { justify-content: flex-end !important; padding: 15px !important; height: 85px !important; align-items: center !important; } @media (max-width: 991px) { .main-menu-wrapper .menu-header { display: flex !important; } } @media (min-width: 992px) { .main-menu-wrapper .menu-header { display: none !important; } } .main-menu-wrapper:not(.mobile_display_lang) { transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1) !important; } html.menu-opened .main-menu-wrapper:not(.mobile_display_lang) { transform: translateX(0) !important; } .sidebar-overlay { position: fixed !important; top: 0; left: 0; width: 100%; height: 100%; z-index: 998; opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0.3s ease !important; background: rgba(0,0,0,0.3) !important; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); } .sidebar-overlay.opened { opacity: 1; visibility: visible; } html.menu-opened, html.menu-opened body { overflow: hidden !important; } /* 11. Logo - desktop big, mobile small */ @media (min-width: 992px) { .navbar-brand.logo-small { display: none !important; } } @media (max-width: 991px) { .navbar-brand.logo:not(.logo-small):not(.desktop-phone) { display: none !important; } .navbar-brand.logo-small { display: inline-block !important; float: none !important; } .navbar-brand.logo-small img { float: none !important; } .navbar-brand.desktop-phone { display: none !important; } } /* 12. Date+Time inline */ .flex-date-time { display: flex !important; flex-wrap: nowrap !important; gap: 8px; align-items: center; } .flex-date-time .form-control { flex: 1 1 0; min-width: 0; } .flex-date-time select.form-control { flex: 0 0 85px !important; max-width: 85px !important; } /* 13. Column group last spacing */ .column-group-last.d-flex { margin-top: 10px !important; } /* 14. Checkbox label margin fix */ .form-check-label { margin-bottom: 0 !important; } /* 14. Help tip "i" icons - inline with checkbox */ .form-check { position: relative; display: flex !important; flex-wrap: wrap; align-items: center; gap: 4px; } .form-check .help-tip1, .form-check .help-tip-unavailable, .form-check .help-tip-abroad { position: relative !important; top: -2px !important; left: auto !important; right: auto !important; bottom: auto !important; transform: none !important; margin: 0 0 0 auto !important; flex-shrink: 0; } /* 14. Banner text shadow */ .banner-imgs .view-all h4 { text-shadow: 0 2px 8px rgba(0,0,0,0.6), 0 1px 3px rgba(0,0,0,0.4) !important; font-weight: 700 !important; } /* 15. Hide "Connect with us" */ .footer-social-widget > p { display: none !important; } /* 16. Login button */ .header-navbar-rht { flex-shrink: 0; padding-right: 15px !important; } @media (max-width: 1299px) { .header .header-navbar-rht { display: none !important; } } /* 17. Mobile text */ @media (max-width: 767px) { h1 { font-size: 28px !important; line-height: 1.2 !important; } .listing-item { margin-bottom: 20px; } .listing-button .btn-order { width: 100%; text-align: center; } .footer-bottom .copyright-text { text-align: center; } } @media (max-width: 479px) { h1 { font-size: 22px !important; } h2 { font-size: 20px !important; } .search-box-banner { padding: 15px !important; } } /* 18. Focus states */ a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible { outline: 2px solid #FFA633; outline-offset: 2px; } /* 19. Navbar - proper desktop layout */ @media (min-width: 992px) { .header .header-nav { flex-wrap: nowrap !important; justify-content: stretch !important; } .header .navbar-header { flex-shrink: 0; } .header .main-menu-wrapper:not(.mobile_display_lang) { flex: 1 1 auto; display: flex !important; justify-content: center; } .header .main-menu-wrapper.mobile_display_lang { display: none !important; } .header .main-menu-wrapper .main-nav { position: static !important; top: auto !important; left: auto !important; justify-content: center; } .header .main-menu-wrapper .main-nav > li > a { padding: 0 12px !important; white-space: nowrap; font-size: 14px !important; } .header .header-navbar-rht { flex-shrink: 0; } } @media (min-width: 992px) and (max-width: 1199px) { .header .main-menu-wrapper .main-nav > li > a { padding: 0 8px !important; font-size: 13px !important; } } /* 20. Listing cards - same height per row */ .listing-item.has-badge { display: flex !important; flex-direction: column; height: 100%; } .listing-item.has-badge .listing-content { flex: 1; display: flex; flex-direction: column; } .listing-item.has-badge .listing-button { margin-top: auto; } .listing-item.has-badge .listing-details-group { flex: 1; } .row > [class*="col-"] > .listing-item.has-badge, .row > [class*="col-"]:has(.listing-item) { height: 100%; } /* 21. Promo banner - desktop redesign */ @media (min-width: 768px) { .section-search.desktop-black-winter { background: linear-gradient(135deg, #1a1a2e 0%, #16213e 40%, #0f3460 100%) !important; border-radius: 18px; margin: 10px auto 20px; max-width: 1140px; padding: 0 !important; overflow: hidden; box-shadow: 0 8px 32px rgba(0,0,0,0.2); position: relative; } .section-search.desktop-black-winter::before { content: ''; position: absolute; top: -50%; right: -10%; width: 300px; height: 300px; background: radial-gradient(circle, rgba(255,166,51,0.15) 0%, transparent 70%); pointer-events: none; } .section-search.desktop-black-winter .container { margin-top: 0 !important; } .section-search.desktop-black-winter .row { margin-top: 0 !important; align-items: center; min-height: 100px; padding: 20px 10px; } .section-search .col-9.teeter-element-1 { display: flex !important; align-items: center; justify-content: center; gap: 0; margin-top: 0 !important; flex: 0 0 75% !important; max-width: 75% !important; } .section-search .col-9.teeter-element-1 > b { background: linear-gradient(135deg, #FFA633, #ff6b35) !important; color: white !important; padding: 14px 30px !important; border-radius: 50px !important; font-size: 18px !important; font-weight: 700 !important; letter-spacing: 0.5px; box-shadow: 0 4px 20px rgba(255,166,51,0.35); white-space: nowrap; animation: dpd-promo-glow 2s ease-in-out infinite; } @keyframes dpd-promo-glow { 0%, 100% { box-shadow: 0 4px 20px rgba(255,166,51,0.35); } 50% { box-shadow: 0 4px 30px rgba(255,166,51,0.6), 0 0 0 6px rgba(255,166,51,0.1); } } .section-search .col-9.teeter-element-1 > img { max-height: 100px !important; width: auto !important; height: auto !important; object-fit: contain; margin-left: -30px !important; margin-top: 0 !important; filter: drop-shadow(0 4px 8px rgba(0,0,0,0.2)); } .section-search .col-3 { margin-top: 0 !important; flex: 0 0 25% !important; max-width: 25% !important; } .section-search .col-3 .countdown .num { color: #fff !important; font-size: 28px !important; font-weight: 700; text-shadow: 0 2px 10px rgba(255,166,51,0.3); } } /* 22. Homepage countdown - push right on desktop */ @media (min-width: 768px) { .search-box-banner .col-5 .title { margin-left: auto !important; margin-right: 0 !important; text-align: right !important; } .search-box-banner .col-5 { display: flex; justify-content: flex-end; align-items: center; } } /* --- Contrast AA (Lighthouse accessibility, 2026-08-17) --- */ /* footer: gri putin mai deschis pe fundalul inchis #201F1D (era #828282 / #787878 = sub 4.5:1) */ .footer .footer-menu ul li a { color: #989898; } .footer p { color: #989898; } .footer .copyright-text p { color: #989898; } .footer a[href*="anpc"] { color: #989898; } .footer a[href*="termeni"] { color: #989898; } /* butoanele portocalii de cautare: text inchis in loc de alb (alb pe portocaliu = 1.9:1); hoverul era deja text inchis pe alb. NU si .btn-primary global: pe paginile din afara homepage-ului e albastru bootstrap cu text alb (regula sta in style-index.css, doar homepage). */ .search-box-banner .search-btn .search-button, .review-sec .search-btn .search-button, .product-detail-head .search-btn .search-button, .search-button, .search-button:focus { color: #201F1D; } /* linkurile catre site-urile partenere (sectiunea de pe homepage): albastru cu contrast AA */ a[href*="dpd-rentacar.ro"], a[href*="tractariauto.co.ro"], a[href*="dpdautomotive.ro"] { color: #0a58ca; } /* --- Meniul hamburger pe mobil (2026-09-01) --- Lista