/**
 * RS Cert — Performance / Accessibility fixes
 * Aspect-ratio pentru imagini fara width/height (CLS fix)
 */

/* Imagini block-level rezerva spatiu fara width/height */
img {
    max-width: 100%;
    height: auto;
}

/* Lazy images fade-in smooth */
img[loading="lazy"] {
    transition: opacity 0.3s ease-in;
}

/* Above-the-fold images critice */
img[fetchpriority="high"] {
    contain: paint;
}

/* CLS fix pentru carousel-uri owl/swiper — rezerva inaltime estimata */
.main-slider, .owl-carousel { min-height: 400px; }
@media (max-width: 768px) {
    .main-slider, .owl-carousel { min-height: 300px; }
}

/* Banda de logo-uri clienti (homepage + pagina Clienti) - 24.09.2026
   Regula de mai sus rezerva 400px/300px pentru ORICE carusel owl; logo-urile
   au doar 60px, asa ca banda alba ramanea cu ~340px goi sub ele.
   Rezervam doar inaltimea reala a logo-urilor. */
.brand-two__carousel.owl-carousel { min-height: 60px; }

/* Iconite Font Awesome — folosesc font-display swap */
.fa, .fab, .fas, .far { font-display: swap !important; }

/* Skip link pentru accessibility (vizual ascuns, dar focus visible) */
.skip-link {
    position: absolute;
    top: -40px;
    left: 0;
    background: #191a1c;
    color: #fff;
    padding: 8px 16px;
    z-index: 100000;
    text-decoration: none;
}
.skip-link:focus { top: 0; }

/* Focus visible pe link-uri și butoane */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
    outline: 3px solid #fed03d;
    outline-offset: 2px;
}

/* Improved button contrast (era galben pe alb — slab contrast) */
.thm-btn:hover {
    color: #191a1c !important;
}

/* thm-btn — text negru pe galben pentru contrast adecvat WCAG AA */
.thm-btn {
    color: #191a1c !important;
}
.thm-btn:hover, .thm-btn:focus {
    color: #191a1c !important;
    background-color: #e6b929 !important;
}

/* Footer logo link — adăugăm text screen reader-friendly */
.site-footer a[href="https://rscert.ro"]::after,
.site-footer__bottom-text a[href="https://www.logo1.ro/"]::after {
    /* No content — but improving underline */
    text-decoration: underline;
}

/* Owl carousel buttons aria — adăugat via CSS attribute */
.owl-prev:not([aria-label])::before { content: ""; }
.owl-next:not([aria-label])::before { content: ""; }

/* Search popup button — accessible */
.search-popup form button[type="submit"]::after {
    content: "";
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* Improve heading semantics — taglines NU sunt headings (era h6) */
.section-title__tagline {
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

/* Skip link visible la focus pentru tastatura */
.skip-link:focus {
    position: fixed;
    top: 10px;
    left: 10px;
    background: #191a1c;
    color: #fed03d;
    padding: 12px 20px;
    z-index: 999999;
    text-decoration: none;
    border-radius: 4px;
    font-weight: 600;
}

/* Reduce layout shift de la lazy images cu min-aspect-ratio */
.about-one img, .why-choose-one img, .feature-one img {
    aspect-ratio: auto;
    min-height: 1px;
}

/* Header mai subtire: reduce padding logo (band thinner) + logo putin mai mare */
.main-menu__logo {
    padding: 6px 0 !important;
}
.main-menu__right {
    padding: 6px 0 !important;
}

/* Sticky-header pe scroll: VERSIUNE COMPACTA + fade SMOOTH
   (similar cu .smaller de pe consultantaisocertificare.ro)
   Logo si padding reduse drastic pentru bara fixa slim ~62px */
.stricky-header.stricky-fixed .main-menu__logo {
    padding: 4px 0 !important;
}
.stricky-header.stricky-fixed .main-menu__logo img {
    width: 60px !important;
    height: auto !important;
}
.stricky-header.stricky-fixed .main-menu__right {
    padding: 4px 0 !important;
}
.stricky-header.stricky-fixed .main-menu__call {
    transform: scale(0.85);
    transform-origin: left center;
}
.stricky-header.stricky-fixed .main-menu__btn-box .thm-btn {
    padding: 10px 22px !important;
    font-size: 14px !important;
}

/* SMOOTH FADE pentru sticky-header: opacity + slide (banda alba se piarde finut) */
.stricky-header {
    opacity: 0 !important;
    transform: translateY(-100%) !important;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1),
                opacity 0.4s ease-out,
                visibility 0.5s !important;
}
.stricky-header.stricky-fixed {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

/* Interior sticky: tranzitii smooth pentru shrink */
.stricky-header .main-menu__logo,
.stricky-header .main-menu__logo img,
.stricky-header .main-menu__right,
.stricky-header .main-menu__call,
.stricky-header .main-menu__btn-box .thm-btn {
    transition: all 0.3s ease-out;
}

/* Logo HD render quality (downscale crisp) */
.main-menu__logo img,
.stricky-header .main-menu__logo img {
    image-rendering: auto;
    -ms-interpolation-mode: bicubic;
}

/* ==========================================================================
   HEADER COMPACT LA PRIMUL IMPACT (non-sticky) PE LAPTOP-URI ≤1500px
   Cerere: logo + banda de sus mai mici / mai subtiri la rezolutii mici
   (ex. 1366px). Starea sticky (la scroll) ramane neschimbata - e OK.
   Nu afecteaza ecranele mari (>1500px) si nici varianta mobila (<992px).
   ========================================================================== */
@media only screen and (min-width: 992px) and (max-width: 1500px) {

    /* --- Banda de contact de sus: mai subtire --- */
    .main-menu__top-inner {
        padding-top: 3px !important;
        padding-bottom: 3px !important;
    }
    .main-menu__contact-list li .text p,
    .main-menu__contact-list li .text p a {
        font-size: 13px !important;
        line-height: 15px !important;
    }
    .main-menu__contact-list li .icon i {
        font-size: 15px !important;
    }

    /* --- Logo mai mic + banda principala mai subtire --- */
    .main-menu__logo {
        padding: 5px 0 !important;
    }
    .main-menu__logo img {
        width: auto !important;
        height: 85px !important;   /* era ~131px natural; sticky ramane 60px */
    }
    .main-menu__right {
        padding: 5px 0 !important;
    }
}

/* ===================================================================
   Formulare de cerere oferta - campuri pe fundal alb, scris negru.
   Implicit tema le randa bleumarin (#00273a) cu text gri, ceea ce arata
   ca si cum campurile ar fi dezactivate. Adaugat 22.09.2026.
   =================================================================== */
.contact-page__form input[type="text"],
.contact-page__form input[type="email"],
.contact-page__form input[type="tel"],
.contact-page__form textarea {
    background-color: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #d9dce3 !important;
}
.contact-page__form input::placeholder,
.contact-page__form textarea::placeholder {
    color: #5a6072 !important;
    opacity: 1;
}
.contact-page__form input:focus,
.contact-page__form textarea:focus {
    background-color: #ffffff !important;
    color: #000000 !important;
    border-color: #f1c40f !important;
    outline: none;
}

/* Subtitlul de sub titlul formularului de contact */
.contact-page__form-subtitle {
    margin: -10px 0 22px;
    font-size: 16px;
    line-height: 1.5;
    color: #757f95;
}

/* ===================================================================
   Pagina de contact: spatiul dintre formular si cele 3 cadrane.

   Dupa inversarea ordinii (formularul inaintea datelor de contact),
   padding-bottom-ul sectiunii formularului (120px) a ajuns lipit de
   padding-top-ul sectiunii cu cadrane (120px) => 240px de gol.
   Le reducem la 45px fiecare, ca sa pastram ritmul de ~90px pe care
   pagina il avea si inainte intre sectiuni.

   Ambele clase exista doar pe pagina de contact (verificat pe home,
   clienti, documente-utile, despre-noi, etape-certificare-iso).
   =================================================================== */
section.contact-page {
    padding-bottom: 45px !important;
}
section.contact-info {
    padding-top: 45px !important;
}

/* ===================================================================
   Harta de pe pagina de contact.

   A fost mutata sub datele de contact (ordinea ceruta: formular, date
   de contact, harta - inclusiv pe telefon, unde coloanele se aseaza una
   sub alta). Inaltimea de 640px era gandita pentru coloana ingusta de
   langa formular; pe toata latimea, si mai ales pe telefon, e mult prea
   inalta.
   =================================================================== */
.contact-page--harta .google-map__one {
    height: 420px !important;
    width: 100% !important;
    display: block;
}

@media (max-width: 767px) {
    .contact-page--harta .google-map__one {
        height: 280px !important;
    }
}

/* Logo-uri clienti in casete albe de aceeasi dimensiune (homepage + pagina Clienti) - 28.09.2026
   Fara banda alba mare: fiecare logo sta centrat intr-o caseta rotunjita 180x100,
   indiferent de proportiile imaginii (logo-urile au 60px inaltime si 42-300px latime). */
.brand-two { padding-top: 60px !important; }
.brand-two.mb-100 { margin-bottom: 60px !important; }
.brand-two__inner { background: transparent !important; padding: 6px 0 !important; border-radius: 0 !important; }
.brand-two__single { padding: 6px 0; }
.brand-two__img {
    display: flex; align-items: center; justify-content: center;
    width: 100%; max-width: 180px; height: 100px; margin: 0 auto;
    padding: 14px 16px; background: #fff;
    border: 1px solid #e3e6eb; border-radius: 16px;
    box-shadow: 0 4px 14px rgba(16, 24, 40, .06);
}
.brand-two__img > img { width: auto !important; max-width: 100%; max-height: 100%; height: auto; object-fit: contain; }

/* Casete logo clienti pe telefon: 2-3 pe rand (vezi script.js), mai compacte */
@media (max-width: 767px) {
    .brand-two { padding-top: 40px !important; }
    .brand-two.mb-100 { margin-bottom: 40px !important; }
    .brand-two__img { height: 84px; padding: 10px 12px; border-radius: 12px; }
}
/* Logo-uri partenere din footer: spatiu si intre randuri cand se aranjeaza pe mai multe randuri */
.footer-widget__client-logos { row-gap: 10px; }