/*
 * Stilurile blocurilor de conţinut (modulele de prezentare, întrebări, galerie,
 * produse, servicii, evenimente, blog).
 *
 * DE CE STĂ AICI, ŞI NU ÎN VIEW-URI:
 * aceste stiluri erau scrise în blocuri <style> chiar în view-urile modulelor.
 * Pagina publică le încărca, dar canvasul editorului Puck încarcă doar foile de
 * stil ale frontendului (window.__PUCK_FRONT_CSS__), deci în editor blocurile
 * apăreau fără stiluri — exact discrepanţa dintre backend şi frontend.
 *
 * Acum există o singură sursă de adevăr: fişierul de faţă. El se încarcă atît pe
 * paginile publice, cît şi în canvasul editorului (vezi Config\Assets::$frontCSS),
 * aşa că blocul editat arată la fel în editor şi pe site.
 *
 * Selectoarele sînt prefixate pe modul (wyb-<modul>-…), deci nu se pot ciocni
 * între ele. Nu adăuga aici stiluri de admin sau de temă: acelea stau în
 * theme.css, respectiv în css/wyb.css.
 */


/* ---------------------------------------------------------------
 * Pagina „Despre” (/despre)
 * --------------------------------------------------------------- */

local, cu clase prefixate
 * `wyb-prezentare-*`: nu ating CSS-ul temei şi se pot scoate cu totul dacă
 * tema îşi aduce propriile carduri.
 */
$showSocial = ! empty($settings['show_social_links']);

// Iniţialele pentru avatarul de rezervă, cînd membrul nu are fotografie.
$initials = static function (string $name): string {
    $out = '';

    foreach (preg_split('/\s+/u', trim($name)) ?: [] as $part) {
        if ($part === '') {
            continue;
        }
        $out .= mb_strtoupper(mb_substr($part, 0, 1, 'UTF-8'), 'UTF-8');
        if (mb_strlen($out, 'UTF-8') >= 2) {
            break;
        }
    }

    return $out !== '' ? $out : '?';
};
?>

<style>
    .wyb-prezentare-intro { max-width: 62rem; }
    .wyb-prezentare-section { margin-bottom: 2.5rem; }
    .wyb-prezentare-section__icon { font-size: 1.6rem; color: var(--wyb-blue); margin-right: .35rem; }
    .wyb-prezentare-section__text { color: var(--wyb-text); }
    .wyb-prezentare-section__text p:last-child { margin-bottom: 0; }

    .wyb-prezentare-grid {
        display: grid;
        gap: 1.25rem;
        grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    }

    .wyb-prezentare-card {
        display: flex;
        flex-direction: column;
        height: 100%;
        overflow: hidden;
        background: var(--wyb-card);
        border: 1px solid var(--wyb-line);
        border-radius: .75rem;
        color: inherit;
        text-decoration: none;
        transition: box-shadow .15s ease, transform .15s ease;
    }
    .wyb-prezentare-card:hover { box-shadow: 0 6px 18px rgba(0, 0, 0, .08); transform: translateY(-2px); }
    .wyb-prezentare-card__body { display: flex; flex-direction: column; flex: 1 1 auto; padding: 1.25rem; }
    .wyb-prezentare-card__avatar {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 72px;
        height: 72px;
        margin: 0 auto .75rem;
        overflow: hidden;
        background: var(--wyb-blue-subtle);
        border-radius: 50%;
        color: var(--wyb-blue);
        font-size: 1.35rem;
        font-weight: 700;
    }
    .wyb-prezentare-card__avatar img { width: 100%; height: 100%; object-fit: cover; }
    .wyb-prezentare-card__name { margin-bottom: .15rem; font-size: 1.05rem; font-weight: 600; text-align: center; }
    .wyb-prezentare-card__role { margin-bottom: .75rem; color: var(--wyb-muted); font-size: .875rem; text-align: center; }
    .wyb-prezentare-card__bio { margin-bottom: .75rem; font-size: .9rem; }
    .wyb-prezentare-card__links {
        display: flex;
        flex-wrap: wrap;
        gap: .75rem;
        justify-content: center;
        margin-top: auto;
    }
    .wyb-prezentare-card__links a { color: var(--wyb-blue); font-size: .85rem; text-decoration: none; }
    .wyb-prezentare-card__links a:hover { text-decoration: underline; }

    .wyb-prezentare-media { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
    .wyb-prezentare-media--empty {
        display: flex;
        align-items: center;
        justify-content: center;
        background: var(--wyb-blue-subtle);
        color: var(--wyb-blue);
        font-size: 2rem;
    }
    .wyb-prezentare-card__meta {
        display: flex;
        flex-wrap: wrap;
        gap: .5rem;
        align-items: center;
        margin-bottom: .4rem;
        color: var(--wyb-muted);
        font-size: .8rem;
    }
    .wyb-prezentare-card__title { margin-bottom: .4rem; font-size: 1.05rem; font-weight: 700; }
    .wyb-prezentare-card:hover .wyb-prezentare-card__title { color: var(--wyb-blue); }
    .wyb-prezentare-card__summary { margin-bottom: .75rem; color: var(--wyb-muted); font-size: .9rem; }
    .wyb-prezentare-card__more { margin-top: auto; color: var(--wyb-blue); font-size: .875rem; font-weight: 600; }
    .wyb-prezentare-tag {
        display: inline-block;
        padding: .15rem .55rem;
        background: var(--wyb-blue-subtle);
        border-radius: 999px;
        color: var(--wyb-blue);
        font-size: .75rem;
        font-weight: 600;
    }


/* ---------------------------------------------------------------
 * Întrebări frecvente (/intrebari-frecvente)
 * --------------------------------------------------------------- */

.wyb-faq-hero {
    background: linear-gradient(135deg, rgba(51, 107, 178, .10), rgba(83, 186, 67, .10));
    border: 1px solid var(--wyb-line);
    border-radius: 12px;
}
.wyb-faq-chips .btn { border-radius: 999px; }
.wyb-faq-accordion .accordion-item {
    border: 1px solid var(--wyb-line);
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: .6rem;
    background: var(--wyb-card);
}
.wyb-faq-accordion .accordion-button {
    font-weight: 600;
    background: transparent;
    color: inherit;
}
.wyb-faq-accordion .accordion-button:not(.collapsed) {
    color: #336bb2;
    background: rgba(51, 107, 178, .08);
    box-shadow: none;
}
.wyb-faq-accordion .accordion-button:focus { box-shadow: none; }
.wyb-faq-accordion .accordion-body { color: var(--wyb-muted); line-height: 1.7; }
.wyb-faq-group__title { display: flex; align-items: center; }
.wyb-faq-empty { border: 1px dashed #C9D0DA; border-radius: 10px; }


/* ---------------------------------------------------------------
 * Testimoniale (/testimoniale)
 * --------------------------------------------------------------- */

.wyb-testimoniale-rezumat {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 1.5rem;
    }
    .wyb-testimoniale-rezumat__nota {
        display: flex;
        align-items: baseline;
        gap: .5rem;
        font-size: 2.25rem;
        font-weight: 700;
        line-height: 1;
        color: #336bb2;
    }
    .wyb-testimoniale-rezumat__nota small { font-size: .9rem; font-weight: 500; color: var(--bs-secondary-color); }
    .wyb-testimoniale-stele { color: #f9c114; letter-spacing: .05em; }
    .wyb-testimoniale-lista {
        display: grid;
        gap: 1.25rem;
        grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    }
    .wyb-testimoniale-card { display: flex; flex-direction: column; height: 100%; }
    .wyb-testimoniale-card__text { font-size: 1rem; }
    .wyb-testimoniale-card__persoana { display: flex; align-items: center; gap: .75rem; }
    .wyb-testimoniale-card__poza {
        width: 48px;
        height: 48px;
        border-radius: 50%;
        object-fit: cover;
        flex: 0 0 auto;
    }
    .wyb-testimoniale-card__initial {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 48px;
        height: 48px;
        border-radius: 50%;
        background: rgba(51, 107, 178, .12);
        color: #336bb2;
        font-weight: 700;
        flex: 0 0 auto;
    }
    .wyb-testimoniale-insigna {
        display: inline-flex;
        align-items: center;
        gap: .25rem;
        font-size: .75rem;
        font-weight: 600;
        padding: .15rem .5rem;
        border-radius: 999px;
        background: rgba(83, 186, 67, .15);
        color: #3d8c31;
    }


/* ---------------------------------------------------------------
 * Echipă (bloc de prezentare)
 * --------------------------------------------------------------- */

.wyb-prezentare-team-grid {
        display: grid;
        gap: 1.5rem;
        grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    }
    .wyb-prezentare-member {
        display: flex;
        flex-direction: column;
        height: 100%;
        padding: 1.5rem 1.25rem;
        background: var(--wyb-card);
        border: 1px solid var(--wyb-line);
        border-radius: .75rem;
        text-align: center;
        transition: box-shadow .15s ease, transform .15s ease;
    }
    .wyb-prezentare-member:hover { box-shadow: 0 6px 18px rgba(0, 0, 0, .08); transform: translateY(-2px); }
    .wyb-prezentare-member__avatar {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 96px;
        height: 96px;
        margin: 0 auto 1rem;
        overflow: hidden;
        background: var(--wyb-blue-subtle);
        border-radius: 50%;
        color: var(--wyb-blue);
        font-size: 1.75rem;
        font-weight: 700;
    }
    .wyb-prezentare-member__avatar img { width: 100%; height: 100%; object-fit: cover; }
    .wyb-prezentare-member__name { margin-bottom: .15rem; font-size: 1.15rem; font-weight: 700; }
    .wyb-prezentare-member__role {
        margin-bottom: .85rem;
        color: var(--wyb-blue);
        font-size: .85rem;
        font-weight: 600;
        letter-spacing: .02em;
        text-transform: uppercase;
    }
    .wyb-prezentare-member__bio { margin-bottom: 1rem; color: var(--wyb-muted); font-size: .925rem; text-align: left; }
    .wyb-prezentare-member__contact {
        display: flex;
        flex-direction: column;
        gap: .35rem;
        margin-top: auto;
        font-size: .875rem;
        text-align: left;
    }
    .wyb-prezentare-member__contact a { color: var(--wyb-blue); text-decoration: none; word-break: break-word; }
    .wyb-prezentare-member__contact a:hover { text-decoration: underline; }
    .wyb-prezentare-member__social {
        display: flex;
        flex-wrap: wrap;
        gap: .5rem;
        justify-content: center;
        margin-top: 1rem;
        padding-top: 1rem;
        border-top: 1px solid var(--wyb-line);
    }
    .wyb-prezentare-member__social a { color: var(--wyb-blue); font-size: .85rem; text-decoration: none; }
    .wyb-prezentare-member__social a:hover { text-decoration: underline; }


/* ---------------------------------------------------------------
 * Portofoliu — lista (/portofoliu)
 * --------------------------------------------------------------- */

.wyb-prezentare-grid {
        display: grid;
        gap: 1.5rem;
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    }
    .wyb-prezentare-card {
        display: flex;
        flex-direction: column;
        height: 100%;
        overflow: hidden;
        background: var(--wyb-card);
        border: 1px solid var(--wyb-line);
        border-radius: .75rem;
        color: inherit;
        text-decoration: none;
        transition: box-shadow .15s ease, transform .15s ease;
    }
    .wyb-prezentare-card:hover { box-shadow: 0 6px 18px rgba(0, 0, 0, .08); transform: translateY(-2px); }
    .wyb-prezentare-card__body { display: flex; flex-direction: column; flex: 1 1 auto; padding: 1.25rem; }
    .wyb-prezentare-card__meta {
        display: flex;
        flex-wrap: wrap;
        gap: .5rem;
        align-items: center;
        margin-bottom: .5rem;
        color: var(--wyb-muted);
        font-size: .8rem;
    }
    .wyb-prezentare-card__title { margin-bottom: .5rem; font-size: 1.05rem; font-weight: 700; }
    .wyb-prezentare-card:hover .wyb-prezentare-card__title { color: var(--wyb-blue); }
    .wyb-prezentare-card__summary { margin-bottom: .75rem; color: var(--wyb-muted); font-size: .9rem; }
    .wyb-prezentare-card__more { margin-top: auto; color: var(--wyb-blue); font-size: .875rem; font-weight: 600; }
    .wyb-prezentare-media { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
    .wyb-prezentare-media--empty {
        display: flex;
        align-items: center;
        justify-content: center;
        background: var(--wyb-blue-subtle);
        color: var(--wyb-blue);
        font-size: 2rem;
    }
    .wyb-prezentare-tag {
        display: inline-block;
        padding: .15rem .55rem;
        background: var(--wyb-blue-subtle);
        border-radius: 999px;
        color: var(--wyb-blue);
        font-size: .75rem;
        font-weight: 600;
    }
    .wyb-prezentare-filters { display: flex; flex-wrap: wrap; gap: .5rem; }


/* ---------------------------------------------------------------
 * Portofoliu — lucrarea (/portofoliu/{slug})
 * --------------------------------------------------------------- */

.wyb-prezentare-item__header { max-width: 62rem; }
    .wyb-prezentare-item__meta {
        display: flex;
        flex-wrap: wrap;
        gap: .75rem;
        align-items: center;
        margin-bottom: .75rem;
        color: var(--wyb-muted);
        font-size: .875rem;
    }
    .wyb-prezentare-item__hero { width: 100%; max-height: 26rem; object-fit: cover; }
    .wyb-prezentare-item__content { color: var(--wyb-text); }
    .wyb-prezentare-item__content p:last-child { margin-bottom: 0; }

    .wyb-prezentare-gallery {
        display: grid;
        gap: .75rem;
        grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    }
    .wyb-prezentare-gallery a { display: block; }
    .wyb-prezentare-gallery img {
        display: block;
        width: 100%;
        aspect-ratio: 4 / 3;
        object-fit: cover;
        border: 1px solid var(--wyb-line);
        border-radius: .5rem;
        transition: transform .15s ease;
    }
    .wyb-prezentare-gallery img:hover { transform: scale(1.02); }

    .wyb-prezentare-grid {
        display: grid;
        gap: 1.25rem;
        grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    }
    .wyb-prezentare-card {
        display: flex;
        flex-direction: column;
        height: 100%;
        overflow: hidden;
        background: var(--wyb-card);
        border: 1px solid var(--wyb-line);
        border-radius: .75rem;
        color: inherit;
        text-decoration: none;
        transition: box-shadow .15s ease, transform .15s ease;
    }
    .wyb-prezentare-card:hover { box-shadow: 0 6px 18px rgba(0, 0, 0, .08); transform: translateY(-2px); }
    .wyb-prezentare-card__body { display: flex; flex-direction: column; flex: 1 1 auto; padding: 1.25rem; }
    .wyb-prezentare-card__title { margin-bottom: .5rem; font-size: 1rem; font-weight: 700; }
    .wyb-prezentare-card:hover .wyb-prezentare-card__title { color: var(--wyb-blue); }
    .wyb-prezentare-card__summary { margin-bottom: 0; color: var(--wyb-muted); font-size: .875rem; }
    .wyb-prezentare-media { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
    .wyb-prezentare-media--empty {
        display: flex;
        align-items: center;
        justify-content: center;
        background: var(--wyb-blue-subtle);
        color: var(--wyb-blue);
        font-size: 2rem;
    }
    .wyb-prezentare-tag {
        display: inline-block;
        padding: .15rem .55rem;
        background: var(--wyb-blue-subtle);
        border-radius: 999px;
        color: var(--wyb-blue);
        font-size: .75rem;
        font-weight: 600;
    }


/* ---------------------------------------------------------------
 * Produse — lista (/produse)
 * --------------------------------------------------------------- */

mai jos, cu clase prefixate `wyb-produse-`, ca să nu ating tema.
 *
 * Paginarea e construită aici, nu cu service('pager'): pager-ul CodeIgniter
 * scrie parametrul `page`, iar catalogul foloseşte `pagina`, iar linkurile
 * trebuie să păstreze TOATE filtrele active.
 */

/** Query string-ul filtrelor curente, cu suprascrieri ('' scoate cheia). */
$query = static function (array $extra = []) use ($categorieSlug, $pretMin, $pretMax, $cautare, $sortare, $atributeActive): string {
    $params = array_merge([
        'categorie' => $categorieSlug,
        'pret_min'  => $pretMin !== null ? number_format($pretMin, 2, '.', '') : '',
        'pret_max'  => $pretMax !== null ? number_format($pretMax, 2, '.', '') : '',
        'q'         => $cautare,
        // Sortarea implicită nu se scrie în URL, ca linkurile să rămînă scurte.
        'sort'      => $sortare !== 'nou' ? $sortare : '',
        'atribut'   => $atributeActive !== [] ? $atributeActive : null,
    ], $extra);

    $params = array_filter($params, static function ($value): bool {
        if (is_array($value)) {
            return $value !== [];
        }

        return $value !== '' && $value !== null;
    });

    return $params === [] ? '' : '?' . http_build_query($params);
};

/** Un preţ afişat frumos: 1.234,56 RON */
$pret = static function (object $produs) use ($setari): string {
    if (empty($setari['show_prices']) || $produs->price === null) {
        return '';
    }

    $moneda = trim((string) ($produs->currency ?? '')) ?: (string) $setari['currency'];

    return number_format((float) $produs->price, 2, ',', '.') . ' ' . $moneda;
};

/** Arborele de categorii, ca linkuri (categoria activă e evidenţiată). */
$copac = static function (array $noduri, int $adincime) use (&$copac, $categorieSlug, $query): string {
    $html = '';

    foreach ($noduri as $nod) {
        $activ  = $categorieSlug === (string) $nod->slug;
        $html .= '<a class="wyb-produse-copac__link' . ($activ ? ' is-active' : '') . '"'
            . ' style="padding-left:' . (12 + $adincime * 14) . 'px"'
            . ' href="' . site_url('produse' . $query(['categorie' => $nod->slug])) . '">';

        if ($adincime > 0) {
            $html .= '<i class="ti ti-corner-down-right me-1"></i>';
        }
        if (! empty($nod->icon)) {
            $html .= '<i class="ti ' . esc((string) $nod->icon) . ' me-1"></i>';
        }

        $html .= esc((string) $nod->name) . '</a>';

        if (! empty($nod->children)) {
            $html .= $copac($nod->children, $adincime + 1);
        }
    }

    return $html;
};
?>

<style>
    /* Stiluri proprii catalogului — prefixate, ca să nu atingă tema. */
    .wyb-produse-card { transition: box-shadow .15s ease, transform .15s ease; }
    .wyb-produse-card:hover { box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .12); transform: translateY(-2px); }
    .wyb-produse-card__img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
    .wyb-produse-card__ph {
        aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center;
        background: var(--wyb-soft, #f1f3f7); color: #9aa4b2; font-size: 2.5rem;
    }
    .wyb-produse-pret { font-size: 1.15rem; font-weight: 700; color: #336bb2; }
    .wyb-produse-pret-vechi { text-decoration: line-through; color: #9aa4b2; font-size: .9rem; }
    .wyb-produse-copac { display: flex; flex-direction: column; }
    .wyb-produse-copac__link {
        display: block; padding: .35rem .75rem; border-radius: .375rem;
        color: inherit; text-decoration: none; font-size: .95rem;
    }
    .wyb-produse-copac__link:hover { background: var(--wyb-soft, #f1f3f7); }
    .wyb-produse-copac__link.is-active { background: #336bb2; color: #fff; }
    .wyb-produse-filtre__grup + .wyb-produse-filtre__grup { margin-top: 1rem; }


/* ---------------------------------------------------------------
 * Produse — produsul (/produse/{slug})
 * --------------------------------------------------------------- */

/* Stiluri proprii paginii de produs — prefixate, ca să nu atingă tema. */
    .wyb-produs-imagine { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: .5rem; }
    .wyb-produs-imagine-ph {
        width: 100%; aspect-ratio: 4 / 3; border-radius: .5rem; display: flex;
        align-items: center; justify-content: center; font-size: 3rem;
        background: var(--wyb-soft, #f1f3f7); color: #9aa4b2;
    }
    .wyb-produs-miniatura { width: 84px; height: 64px; object-fit: cover; border-radius: .25rem; display: block; }
    .wyb-produs-miniatura-btn {
        padding: 0; line-height: 0; cursor: pointer; background: none;
        border: 2px solid transparent; border-radius: .375rem;
    }
    .wyb-produs-miniatura-btn.is-active { border-color: #336bb2; }
    .wyb-produs-pret { font-size: 1.7rem; font-weight: 700; color: #336bb2; }
    .wyb-produs-pret-vechi { text-decoration: line-through; color: #9aa4b2; }
    .wyb-produs-descriere img { max-width: 100%; height: auto; }
    .wyb-produs-breadcrumb { font-size: .9rem; }


/* ---------------------------------------------------------------
 * Evenimente — lista (/evenimente)
 * --------------------------------------------------------------- */

.wyb-evenimente-pastila {
    flex: 0 0 auto;
    width: 58px;
    border: 1px solid var(--tblr-border-color, #e6e7e9);
    border-radius: .5rem;
    overflow: hidden;
    text-align: center;
    background: var(--tblr-bg-surface, #fff);
}
.wyb-evenimente-pastila-zi {
    display: block;
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.1;
    padding-top: .35rem;
}
.wyb-evenimente-pastila-luna {
    display: block;
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: #6c7a91;
    padding-bottom: .3rem;
}
.wyb-evenimente-card {
    transition: transform .15s ease, box-shadow .15s ease;
}
.wyb-evenimente-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .08);
}
.wyb-evenimente-card--trecut {
    opacity: .85;
}
.wyb-evenimente-card--trecut .wyb-evenimente-pastila {
    background: #f1f3f5;
}
.wyb-evenimente-luna {
    margin-top: 2rem;
}


/* ---------------------------------------------------------------
 * Evenimente — evenimentul (/evenimente/{slug})
 * --------------------------------------------------------------- */

.wyb-evenimente-hero {
    border-radius: .5rem;
    object-fit: cover;
    max-height: 320px;
    width: 100%;
}
.wyb-evenimente-rand {
    display: flex;
    gap: .5rem;
    align-items: flex-start;
    padding: .5rem 0;
    border-bottom: 1px solid var(--tblr-border-color, #e6e7e9);
}
.wyb-evenimente-rand:last-child {
    border-bottom: 0;
}
.wyb-evenimente-rand i {
    color: #6c7a91;
    margin-top: .15rem;
}
.wyb-evenimente-continut {
    line-height: 1.65;
}
.wyb-evenimente-continut h3 {
    font-size: 1.1rem;
    margin-top: 1.25rem;
}
.wyb-evenimente-mini {
    display: flex;
    gap: .75rem;
    align-items: baseline;
    padding: .6rem 0;
    border-bottom: 1px solid var(--tblr-border-color, #e6e7e9);
    text-decoration: none;
    color: inherit;
}
.wyb-evenimente-mini:last-child {
    border-bottom: 0;
}


/* ---------------------------------------------------------------
 * Galerie — lista de albume (/galerie)
 * --------------------------------------------------------------- */

* cu clase prefixate „wyb-galerie-”, ca să nu atingem CSS-ul temei.
 */
$photos = static fn (int $n): string => $n === 1 ? '1 fotografie' : $n . ' fotografii';
?>

<style>
    /* Grila de albume: se aranjează singură, în funcţie de lăţimea ecranului. */
    .wyb-galerie-albume {
        display: grid;
        gap: 1.25rem;
        grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    }
    .wyb-galerie-album {
        display: flex;
        flex-direction: column;
        height: 100%;
        overflow: hidden;
        text-decoration: none;
        color: inherit;
    }
    .wyb-galerie-album__cover {
        aspect-ratio: 4 / 3;
        width: 100%;
        object-fit: cover;
        background: var(--wyb-line, #e6e9ef);
    }
    .wyb-galerie-album__body { display: flex; flex-direction: column; gap: .35rem; flex: 1; }
    .wyb-galerie-album__meta { font-size: .85rem; }
    .wyb-galerie-badge {
        display: inline-flex;
        align-items: center;
        gap: .25rem;
        font-size: .8rem;
        font-weight: 600;
        padding: .15rem .5rem;
        border-radius: 999px;
        background: rgba(51, 107, 178, .12);
        color: #336bb2;
    }


/* ---------------------------------------------------------------
 * Galerie — albumul (/galerie/{slug})
 * --------------------------------------------------------------- */

/* Grila de imagini: numărul de coloane vine din setările modulului. */
    .wyb-galerie-grid {
        display: grid;
        gap: 1rem;
        grid-template-columns: repeat(var(--wyb-galerie-cols, 3), minmax(0, 1fr));
    }
    @media (max-width: 991.98px) { .wyb-galerie-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
    @media (max-width: 575.98px) { .wyb-galerie-grid { grid-template-columns: 1fr; } }

    .wyb-galerie-item { display: flex; flex-direction: column; height: 100%; overflow: hidden; }
    .wyb-galerie-item__link { display: block; position: relative; }
    .wyb-galerie-item__img {
        aspect-ratio: 4 / 3;
        width: 100%;
        object-fit: cover;
        transition: transform .25s ease;
    }
    .wyb-galerie-item__link:hover .wyb-galerie-item__img { transform: scale(1.03); }
    .wyb-galerie-item__zoom {
        position: absolute;
        right: .5rem;
        bottom: .5rem;
        padding: .2rem .45rem;
        border-radius: 999px;
        color: #fff;
        background: rgba(0, 0, 0, .55);
        font-size: .85rem;
    }
    .wyb-galerie-item__caption { font-size: .9rem; }
    .wyb-galerie-lightbox__img {
        max-width: 100%;
        max-height: 75vh;
        object-fit: contain;
    }


/* ---------------------------------------------------------------
 * Blog — lista (/blog)
 * --------------------------------------------------------------- */

.wyb-blog-chips .btn { border-radius: 999px; }
.wyb-blog-hero {
    background: linear-gradient(135deg, rgba(51, 107, 178, .10), rgba(83, 186, 67, .10));
    border: 1px solid var(--wyb-line);
    border-radius: 12px;
}
.wyb-blog-card { overflow: hidden; height: 100%; transition: transform .15s ease, box-shadow .15s ease; }
.wyb-blog-card:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(51, 107, 178, .14); }
.wyb-blog-card__img { height: 180px; object-fit: cover; }
.wyb-blog-card__meta { font-size: .78rem; color: var(--wyb-muted); }
.wyb-blog-badge {
    background: rgba(51, 107, 178, .12);
    color: #336bb2;
    font-weight: 600;
    border-radius: 999px;
    padding: .18rem .6rem;
    font-size: .74rem;
}
.wyb-blog-featured__card { border-left: 4px solid #f9c114; }
.wyb-blog-empty { border: 1px dashed #C9D0DA; border-radius: 10px; }


/* ---------------------------------------------------------------
 * Blog — articolul (/blog/{slug})
 * --------------------------------------------------------------- */

.wyb-blog-post__hero {
    background: linear-gradient(135deg, rgba(51, 107, 178, .10), rgba(83, 186, 67, .10));
    border: 1px solid var(--wyb-line);
    border-radius: 12px;
}
.wyb-blog-post__meta { font-size: .85rem; color: var(--wyb-muted); }
.wyb-blog-post__image { width: 100%; max-height: 380px; object-fit: cover; border-radius: 12px; }
.wyb-blog-post__body { font-size: 1.05rem; line-height: 1.75; }
.wyb-blog-post__body p { margin-bottom: 1rem; }
.wyb-blog-badge {
    background: rgba(51, 107, 178, .12);
    color: #336bb2;
    font-weight: 600;
    border-radius: 999px;
    padding: .18rem .6rem;
    font-size: .74rem;
}
.wyb-blog-related .card { height: 100%; transition: transform .15s ease; }
.wyb-blog-related .card:hover { transform: translateY(-2px); }