/* ==========================================================================
   SECTIUNEA CATEGORII RESURSE 
   ========================================================================== */

/* Secțiunea principală */
.art__resources-section {
    margin: 0 auto;
    padding: 40px 64px;
    text-align: center;
    background-color: var(--color-background-light);
    border-top: 0.5px solid var(--color-divider-dark);
    border-bottom: 0.5px solid var(--color-divider-dark);
}

/* Titlul secțiunii */
.art__section-title {
    font-family: var(--font-sans);
    font-size: var(--label);
    font-weight: 500;
    letter-spacing: 0.1em;
    color: var(--color-accent);
    margin-bottom: 60px;
    position: relative;
    display: inline-block;
}

/* Linie decorativă sub titlu */
.art__section-title::after {
    content: '';
    display: block;
    width: 40px;
    height: 0.5px;
    background-color: var(--color-accent);
    margin: 15px auto 0 auto;
}

/* Grid-ul pentru cele 5 coloane */
.art__resources-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 0;
}

/* Card individual */
.art__resource-card {
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    align-items: flex;
    text-align: left;
    background: transparent;
}

/* Linii verticale despărțitoare între carduri */
.art__resource-card:not(:last-child) {
    border-right: 1px solid var(--color-divider-dark);
}

/* Container-ul pentru SVG-uri */
.art__card-icon {
    margin-bottom: 25px;
    height: 60px;
    width: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Forțează SVG-urile să își păstreze proporțiile corecte */
.art__card-icon img {
    height: 100%;
    width: auto;
    object-fit: contain;
}

.art__card-title {
    font-family: var(--font-sans);
    font-size: var(--text);
    font-weight: 600;
    letter-spacing: 0.1em;
    color: var(--color-text);
    margin-bottom: 0.5rem;
    min-height: 40px;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
}

.art__card-text {
    font-family: var(--font-sans);
    font-size: var(--text);
    line-height: 1.6;
    color: var(--color-text);
    font-weight: 400;
    margin-bottom: 30px;
    flex-grow: 1;
}

.art__card-link {
    font-family: var(--font-sans);
    font-size: var(--text-link);
    font-weight: 500;
    letter-spacing: 0.1em;
    color: var(--color-accent);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    transition: color 0.3s ease;
}

.art__card-link:hover {
    color: var(--color-hover);
}

.art__arrow {
    margin-left: 8px;
    font-size: 1rem;
    transition: transform 0.3s ease;
}

.art__card-link:hover .art__arrow {
    transform: translateX(4px);
}


/* ==========================================================================
   SECTIUNEA PARTENERS
   ========================================================================== */

/* Secțiunea Parteneri */
.art__partners-section {
    width: 100%;
    background-color: var(--color-background-soft);
    padding: 40px 64px;
    text-align: center;
    border-top: 0.5px solid var(--color-divider-dark);
    border-bottom: 0.5px solid var(--color-divider-dark);
}

.art__partners-container {
    max-width: 1400px;
    margin: 0 auto;
}

/* Titlul secțiunii */
.art__partners-title {
    font-family: var(--font-sans);
    font-size: var(--label);
    font-weight: 500;
    letter-spacing: 0.1em;
    color: var(--color-accent);
    margin-bottom: 25px;
    position: relative;
    display: inline-block;
}

/* Linie decorativă mică sub titlu */
.art__partners-title::after {
    content: '';
    display: block;
    width: 30px;
    height: 0.5px;
    background-color: var(--color-accent);
    margin: 12px auto 0 auto;
}

/* Container flexibil pentru logouri */
.art__partners-logos {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 0 40px;
}

/* Elemente individuale pentru logouri */
.art__partner-logo-item {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 1;
    filter: grayscale(100%);
    transition: filter 0.3s ease;
}

.art__partner-logo-item:hover {
    opacity: 1;
}

/* Asigură scalarea corectă a imaginilor vectoriale */
.art__partner-logo-item img {
    height: 70px;
    width: auto;
    object-fit: contain;
}

/* ==========================================================================
   SECTIUNEA BLUEPRINT
   ========================================================================== */

/* Secțiunea principală pe desktop - eliminat padding-ul mare care înconjura totul */
.art__free-resource-section {
    width: 100%;
    background-color: var(--color-background-accent);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    /* Eliminat padding-ul exterior pentru a permite lipirea */
}

/* Containerul principal - ocupă 100% lățime pentru a lipi imaginea */
.art__fr-container {
    width: 100%;
    max-width: 100%;
    /* Permite extinderea completă în margini */
    display: grid;
    /* Imaginea are o lățime fixă/proporțională, textul e flexibil, form-ul e fix */
    grid-template-columns: 450px 1fr 400px;
    align-items: stretch;
    /* Forțează toate coloanele să aibă aceeași înălțime cu imaginea */
    gap: 0;
    /* Eliminat gap-ul global pentru a controla spațiul din padding intern */
}

/* --- ZONA STÂNGA: Imaginea --- */
.art__fr-image-box {
    position: relative;
    /* necesar pentru ::after */
    width: 100%;
    height: 100%;
    min-height: 200px;
    max-height: 250px;
    overflow: hidden;
}

.art__fr-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Gradientul suprapus, dinspre dreapta spre stânga */
.art__fr-image-box::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to left,
            var(--color-background-accent) 10%,
            transparent 70%);
    pointer-events: none;
    /* nu blochează click-uri/interacțiuni */
}

/* --- ZONA CENTRU: Textul (Aliniat la stânga, cu spațiu adăugat din padding) --- */
.art__fr-content-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* Centrează textul pe verticală în raport cu înălțimea imaginii */
    align-items: flex-start;
    text-align: left;
    padding: 40px 60px;
    /* Spațiu controlat doar în interiorul textului */
}

.art__fr-tag {
    font-family: var(--font-sans);
    font-size: var(--label);
    font-weight: 500;
    letter-spacing: 0.1em;
    color: var(--color-accent);
    margin-bottom: 15px;
    text-transform: uppercase;
}

.art__fr-title {
    font-family: var(--font-serif);
    font-size: var(--title-h2);
    font-weight: 400;
    line-height: 1.2;
    color: var(--color-text);
    margin-bottom: 15px;
}

.art__fr-text {
    font-family: var(--font-sans);
    font-size: var(--text);
    line-height: 1.6;
    color: var(--color-text);
    font-weight: 400;
    max-width: 480px;
}

/* --- ZONA DREAPTA: Formularul (Formă fixă, nedeformabilă) --- */
.art__fr-form-box {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 40px 40px 40px 0;
}

.art__fr-form {
    display: flex;
    flex-direction: column;
    gap: 15px;
    width: 320px;
}

.art__fr-input {
    width: 100%;
    padding: 14px 18px;
    border: 2px solid var(--color-divider-dark);
    background-color: transparent;
    font-family: var(--font-sans);
    font-size: var(--text);
    color: var(--color-text);
    outline: none;
    transition: border-color 0.3s ease;
}

.art__fr-input:focus {
    border-color: var(--color-accent);
}

.art__fr-input::placeholder {
    color: #a3a3a3;
}

/* Butonul portocaliu */
.art__fr-btn {
    width: 100%;
    padding: 14px 18px;
    background-color: var(--color-accent);
    border: none;
    color: white;
    font-family: var(--font-sans);
    font-size: var(--text);
    font-weight: 600;
    letter-spacing: 0.1em;
    cursor: pointer;
    transition: background-color 0.3s ease;
    text-align: center;
}

.art__fr-btn:hover {
    background-color: black;
}

/* ==========================================================================
   SECTIUNEA CARACTERISTICI / BENEFICII
   ========================================================================== */

.art__features-section {
    width: 100%;
    border-top: 0.5px solid var(--color-divider-dark);
    background-color: var(--color-background-soft);
    padding: 30px 64px;
    display: flex;
    justify-content: center;
}

.art__features-grid {
    width: 100%;
    max-width: 1400px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
}

/* Card individual layout asimetric (Iconiță stânga, conținut dreapta) */
.art__feature-card {
    display: flex;
    flex-direction: row;
    align-items: center;
    /* Schimbat de la flex-start la center pentru aliniere pe mijloc */
    padding: 10px 40px;
    text-align: left;
}

/* Ajustare opțională pentru ca iconița să nu fie împinsă artificial în jos dacă nu există contor */
.art__feature-title.no-counter {
    margin-top: 0;
    /* Schimbat de la 4px la 0 pentru o centrare perfectă */
}

/* Linii verticale despărțitoare subtile între coloane */
.art__feature-card:not(:last-child) {
    border-right: 1px solid var(--color-divider-dark);
}

/* Container iconiță liniară aurie */
.art__feature-icon-box {
    flex: 0 0 60px;
    width: 60px;
    height: auto;
    margin-right: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.art__feature-icon {
    width: 60px;
    height: auto;
    object-fit: contain;
}

/* Container text */
.art__feature-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

/* Numărul decorativ (ex: 40+) */
.art__feature-counter {
    font-family: var(--font-sans);
    font-size: var(--title-h3);
    font-weight: 400;
    color: var(--color-accent);
    line-height: 1;
    margin-bottom: 4px;
}

/* Titlul secțiunii mic încapsulat */
.art__feature-title {
    font-family: var(--font-sans);
    font-size: var(--text);
    font-weight: 600;
    letter-spacing: 0.1em;
    color: var(--color-text);
    margin-bottom: 15px;
    text-transform: uppercase;
}

/* Ajustare top dacă nu există contor deasupra titlului */
.art__feature-title.no-counter {
    margin-top: 4px;
}

/* Textul descriptiv subțire */
.art__feature-text {
    font-family: var(--font-sans);
    font-size: var(--text);
    line-height: 1.6;
    color: var(--color-text);
    font-weight: 400;
}

/* ==========================================================================
   SECTIUNEA CTA DARK
   ========================================================================== */

/* Secțiunea CTA pe fundal închis */
.art__cta-dark-section {
    width: 100%;
    position: relative;
    background-color: var(--color-background-dark);

    /* Înlocuiți calea de mai jos cu imaginea completă de fundal din design */
    background-image: url('./assets/images/bg/cta-dark-bg.jpg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;

    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 60px;
    overflow: hidden;
}

/* Overlay întunecat pentru a asigura un contrast optim pentru text */
.art__cta-dark-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(17, 17, 17, 0.45);
    /* Ajustați opacitatea în funcție de contrastul imaginii folosite */
    z-index: 1;
}

/* Container text și buton */
.art__cta-dark-container {
    position: relative;
    z-index: 2;
    max-width: 800px;
    width: 100%;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Titlul elegant cu font aurit/maroniu deschis */
.art__cta-dark-title {
    font-family: var(--font-sans);
    font-size: var(--label);
    font-weight: 500;
    letter-spacing: 0.1em;
    color: var(--color-accent);
    margin-bottom: 25px;
    line-height: 1.4;
}

/* Textul descriptiv */
.art__cta-dark-text {
    font-family: var(--font-sans);
    font-size: var(--text-bigger);
    line-height: 1.8;
    color: var(--color-dirty-white);
    font-weight: 300;
    letter-spacing: 0.5px;
    margin-bottom: 40px;
}

/* Butonul minimalist cu chenar */
.art__cta-dark-btn {
    background: transparent;
    border: 2px solid var(--color-accent);
    color: var(--color-accent);
    padding: clamp(12px, 1vw, 15px) clamp(20px, 2vw, 30px);
    cursor: pointer;
    font-family: var(--font-sans);
    font-size: 1.2rem;
    letter-spacing: 0.12em;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    text-align: center;
    white-space: nowrap;
    margin-bottom: 1.92rem;
    text-transform: uppercase;
    transition: 0.3s;
}

/* Efect la trecerea mouse-ului peste buton */
.art__cta-dark-btn:hover {
    background-color: var(--color-accent);
    border-color: var(--color-accent);
    color: white;
}

/* Săgeata din interiorul butonului */
.art__cta-dark-btn .art__cta-dark-btn-arrow {
    flex-shrink: 0;
    stroke: currentColor;
    transition: transform 0.3s ease;
}

.art__cta-dark-btn:hover .art__cta-dark-btn-arrow {
    transform: translateX(4px);
}

/* Ascunde ruperea de rând pe ecranele mici */
.art__desktop-only {
    display: inline;
}