/* =========================================================
   CODEX.RO — HEADER CASSIOPEIA
   Versiune curată: logo + meniu + asistență + autentificare
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@400;500;600;700;800&family=Source+Serif+4:opsz,wght@8..60,400;8..60,600;8..60,700&display=swap');

/* =========================================================
   VARIABILE CODEX
   ========================================================= */

:root {
  --codex-primary: #123C45;
  --codex-secondary: #8FAF9B;
  --codex-bg: #F7F3EA;
  --codex-articol: #FAF7F0;
  --codex-white: #FFFFFF;
  --codex-text: #202426;
  --codex-muted: #667275;
  --codex-muted2: #B8C8C3;
  --codex-accent: #D89A2B;
  --codex-accent-hover: #B77D1F;

  --codex-font-ui: "Source Sans 3", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --codex-font-title: "Source Serif 4", Georgia, serif;
  --codex-content-max: 1180px;
}

html {
  background: var(--codex-bg);
}

a:not([class]) {
    text-decoration: none;
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
  color: var(--codex-primary);
  font-family: var(--codex-font-title);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: 0;
}

h1, .h1 {
  font-size: clamp(38px, 5vw, 64px);
}

h2, .h2 {
  font-size: clamp(30px, 3.4vw, 46px);
}

h3, .h3 {
  font-size: clamp(25px, 2.6vw, 36px);
}

h4, .h4 {
  font-size: clamp(21px, 2vw, 28px);
}

h5, .h5 {
  font-size: clamp(18px, 1.5vw, 23px);
}

h6, .h6 {
  font-size: clamp(16px, 1.2vw, 19px);
}

body {
  /*background: var(--codex-white);*/
  color: var(--codex-text);
 /* font-family: var(--codex-font-ui);*/
}

.site-grid, .container-component, main
 {
    background: var(--codex-white) !important;
}

.site-grid,
.container-component,
main {
  background: var(--codex-bg);
}

.container-header + *,
.container-header + .site-grid,
.site-grid > .grid-child:first-child {
  margin-top: 0;
}

.container-header + .site-grid {
  row-gap: 0;
}

.moduletable:has(.cx-hero),
.mod-custom:has(.cx-hero),
.site-grid > .grid-child:has(.cx-hero),
.container-component:has(.cx-hero),
main:has(.cx-hero) {
  margin-top: 0;
  padding-top: 0;
}

.moduletable:has(.cx-hero),
.mod-custom:has(.cx-hero) {
  margin-bottom: 0;
  padding-bottom: 0;
  background: var(--codex-primary);
}

.codex-section {
  background: var(--codex-bg);
  padding: clamp(48px, 7vw, 84px) clamp(20px, 5vw, 64px);
}

.codex-section-inner {
  width: min(var(--codex-content-max), 100%);
  margin: 0 auto;
}

.codex-section-white {
  background: var(--codex-white);
}

.cjforum-container .z-50 {
     z-index: 1; !important
}



/* =========================================================
   HEADER GENERAL
   ========================================================= */

.container-header {
  background: var(--codex-primary);
  color: var(--codex-white);
  font-family: var(--codex-font-ui);

  min-height: 0;
  padding-top: 0;
  padding-bottom: 10px;

  box-shadow: none;
  border-bottom: 0;

  /* Header-ul (din core Cassiopeia) are z-index:10 — mai jos decât bara de
     acțiuni a articolului (.codex-article-actions, z-index:20, sticky). Cum
     .container-header e propriul context de stivuire (position:relative +
     z-index din core), TOT ce e în interior (logo, nav simplă, fundal) pierde
     în fața barei sticky, nu doar dropdown-urile (alea au fost reparate izolat
     în cap. 28/34 cu z-index:1100 pe .codex-mega-menu — un patch parțial).
     Fix real: ridicăm z-index-ul întregului header, o dată pentru totdeauna. */
  z-index: 1100;
}

/* Bandă top-menu — discretă, la dreapta */
.container-header .container-below-top {
  display: flex;
  justify-content: flex-end;
  padding: 5px clamp(16px, 3vw, 40px) 5px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.container-header .container-below-top .mod-menu {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex: none;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
}

.container-header .container-below-top .mod-menu li {
  margin: 0;
  padding: 0;
}

.container-header .container-below-top .mod-menu a {
  display: block;
  padding: 2px 14px;
  font-size: 12px;
  font-weight: 600;
  color: rgba(255,255,255,.55);
  text-decoration: none;
  letter-spacing: .03em;
  transition: color .15s ease;
  border-right: 1px solid rgba(255,255,255,.14);
}

.container-header .container-below-top .mod-menu li:last-child a {
  border-right: none;
}

.container-header .container-below-top .mod-menu a:hover {
  color: rgba(255,255,255,.9);
}

/* CODEX PATCH (2026-07-15) — pe mobil, bara de sus (Zona de lucru/Devino
   Membru/Newsletter/Creaza un cont GRATUIT) trebuie să rămână pe UN SINGUR
   rând (comprimat), nu să se rupă pe 4 rânduri stivuite — ocupa prea multă
   înălțime din ecran înaintea conținutului. flex-wrap:nowrap + white-space:
   nowrap forțează un singur rând; dacă tot nu încape, derulează orizontal
   în loc să rupă rândul sau să taie textul. */
@media (max-width: 991.98px) {
  .container-header .container-below-top {
    justify-content: flex-start;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .container-header .container-below-top::-webkit-scrollbar {
    display: none;
  }

  .container-header .container-below-top .mod-menu {
    flex-wrap: nowrap;
  }

  .container-header .container-below-top .mod-menu a {
    padding: 2px 10px;
    font-size: 11px;
    white-space: nowrap;
  }
}


/* Elimină eventuale fundaluri implicite Cassiopeia */
.container-header .container-nav,
.container-header .container-search {
  background: transparent;
}


/* Aliniere generală în header + compactare înălțime */
.container-header .grid-child,
.container-header .container {
  align-items: center;
}

.container-header > .grid-child:not(.container-below-top):not(.container-nav) {
  padding-top: 6px;
  padding-bottom: 6px;
}


/* =========================================================
   LOGO
   ========================================================= */

.container-header .navbar-brand {
  display: flex;
  align-items: center;

  padding-top: 0;
  padding-bottom: 0;
  margin-bottom: 0;
}

.container-header .navbar-brand .brand-logo img {
  width: 165px;
  height: auto;
  max-height: 56px;
  display: block;
}


/* Titlu site, dacă este activat în Joomla */
.container-header .navbar-brand .site-title {
  color: var(--codex-white);
  font-family: var(--codex-font-title);
  font-weight: 700;
  font-size: 1.6rem;
  line-height: 1.1;
  letter-spacing: 0;
}

.container-header .navbar-brand .site-description {
  color: rgba(255, 255, 255, 0.78);
  font-family: var(--codex-font-ui);
  font-size: 0.95rem;
}


/* =========================================================
   ZONA DE NAVIGAȚIE
   ========================================================= */

.container-header .container-nav {
  margin-top: 4px;
  padding-top: 0;
  padding-bottom: 8px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 1.5rem;
}

/* Asistență + buton — grup strâns la dreapta */
.container-header .container-nav > .mod-custom:has(.header-asistenta) {
  margin-left: auto;
}


/* Meniu principal */
.container-header .mod-menu,
.container-header .navbar-nav {
  display: flex;
  align-items: center;
  gap: 1.3rem;

  font-family: var(--codex-font-ui);
  font-size: 0.98rem;
  font-weight: 700;
}

body:not(.codex-subscriber-area) .container-header .container-nav > ul.mod-menu ~ ul.mod-menu {
  display: none !important;
}

body:not(.codex-subscriber-area) .container-header .container-nav .moduletable:has(.mod-menu) ~ .moduletable:has(.mod-menu),
body:not(.codex-subscriber-area) .container-header .container-nav .mod-custom:has(.mod-menu) ~ .mod-custom:has(.mod-menu),
body:not(.codex-subscriber-area) .container-header .container-nav nav:has(.mod-menu) ~ nav:has(.mod-menu),
body:not(.codex-subscriber-area) .container-header .container-nav div:has(> .mod-menu) ~ div:has(> .mod-menu) {
  display: none !important;
}


/* Linkuri meniu */
.container-header .mod-menu > li > a,
.container-header .mod-menu > li > span,
.container-header .navbar-nav .nav-link {
  color: var(--codex-white);

  padding-top: 0;
  padding-bottom: 0;

  line-height: 1.2;
  text-decoration: none;

  transition:
    color 0.18s ease,
    background-color 0.18s ease;
}


/* Hover meniu */
.container-header .mod-menu > li > a:hover,
.container-header .mod-menu > li > span:hover,
.container-header .navbar-nav .nav-link:hover,
.container-header .navbar-nav .nav-link:focus {
  color: var(--codex-accent);
  background: transparent;
}


/* Item activ */
.container-header .mod-menu > li.active > a,
.container-header .mod-menu > li.current > a,
.container-header .navbar-nav .active > .nav-link,
.container-header .navbar-nav .nav-link.active {
  color: var(--codex-accent);
}


/* Săgeți dropdown meniu */
.container-header .mod-menu .metismenu-item > button,
.container-header .metismenu.mod-menu .mm-toggler {
  color: var(--codex-white);
}

.container-header .mod-menu .metismenu-item > button:hover,
.container-header .metismenu.mod-menu .mm-toggler:hover {
  color: var(--codex-accent);
}


/* =========================================================
   DROPDOWN MENU
   ========================================================= */

.container-header .metismenu.mod-menu .mm-collapse,
.container-header .dropdown-menu {
  background: var(--codex-white);

  border: 1px solid rgba(18, 60, 69, 0.12);
  border-radius: 10px;

  padding: 0.45rem;

  box-shadow: 0 14px 35px rgba(18, 60, 69, 0.18);
}


/* Linkuri dropdown */
.container-header .metismenu.mod-menu .mm-collapse a,
.container-header .dropdown-menu .dropdown-item {
  color: var(--codex-text);

  font-family: var(--codex-font-ui);
  font-weight: 600;

  border-radius: 7px;
  padding: 0.1rem 0.8rem;
}


/* Hover dropdown */
.container-header .metismenu.mod-menu .mm-collapse a:hover,
.container-header .dropdown-menu .dropdown-item:hover,
.container-header .dropdown-menu .dropdown-item:focus {
  color: var(--codex-primary);
  background: #EAF1ED;
}

@media (min-width: 992px) {
  .container-header .container-nav {
    position: relative;
  }

  /* Ancoră pentru .codex-mega-menu (top:100%; mai jos) — trebuie să fie
     UL-ul propriu-zis al meniului, nu .container-nav. .container-nav e un
     flex row cu align-items:center care conține și blocul "Asistență
     membri + telefon + buton Autentificare", mai înalt decât UL-ul de
     meniu — asta lăsa un gol de ~18px sub itemul de meniu (top:100% cădea
     la marginea de jos a lui .container-nav, nu a UL-ului), gol în care
     :hover se pierdea la mutarea mouse-ului spre panou → mega-meniul se
     închidea instant înainte să apuci să dai click pe ceva din el. */
  .container-header .metismenu.mod-menu {
    position: relative;
  }

  .container-header .metismenu.mod-menu > .metismenu-item:not(.codex-has-mega) {
    position: relative;
  }

  .container-header .metismenu.mod-menu > .codex-has-mega {
    position: static;
  }

  .container-header .metismenu.mod-menu > .metismenu-item > .mm-collapse {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 220px;
    z-index: 1100;
    display: block;
    height: auto !important;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    overflow: visible;
    transform: translateY(8px);
    transition:
      opacity .18s ease,
      transform .18s ease,
      visibility .18s ease;
  }

  .container-header .metismenu.mod-menu > .metismenu-item:hover > .mm-collapse,
  .container-header .metismenu.mod-menu > .metismenu-item:focus-within > .mm-collapse {
    display: block;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
  }

  .container-header .metismenu.mod-menu > .codex-has-mega > .codex-mega-menu {
    left: 0;
    right: auto;
    width: min(1080px, calc(100vw - 48px));
    min-width: 0;
    padding: 0;
    display: none;
    grid-template-columns: minmax(220px, .82fr) minmax(260px, 1fr);
    gap: 0;
    transform: translateY(8px);
  }

  .container-header .metismenu.mod-menu > .codex-has-mega:hover > .codex-mega-menu,
  .container-header .metismenu.mod-menu > .codex-has-mega:focus-within > .codex-mega-menu {
    display: grid;
    transform: translateY(0);
  }

  .container-header .metismenu.mod-menu > .codex-has-mega > .codex-mega-menu--columns-3 {
    grid-template-columns: minmax(220px, .72fr) minmax(260px, 1fr) minmax(260px, 1fr);
  }
}

.container-header .codex-mega-menu,
.container-header .codex-mega-menu__list {
  margin: 0;
  list-style: none;
}

/* z-index din core (1001) e ignorat de browser fără o poziționare explicită —
   fără asta, meniul mega apărea sub bara sticky de acțiuni a articolului
   (.codex-article-actions, z-index: 20 dar position: sticky, deci activ).
   position:relative singur nu ajunge — .codex-mega-menu tot nu avea z-index
   propriu, deci pierdea în fața lui .codex-article-actions oriunde acesta
   se afla mai jos în DOM cu un z-index explicit mai mare decât "auto".
   Aliniat la z-index-ul dropdown-ului simplu (.mm-collapse: 1100). */
.container-header .codex-mega-menu {
  position: relative;
  z-index: 1100;
}

.container-header .codex-mega-menu__nav,
.container-header .codex-mega-menu__module {
  min-width: 0;
  padding: clamp(18px, 2vw, 26px);
}

.container-header .codex-mega-menu__nav {
  background: rgba(143, 175, 155, .10);
}

.container-header .codex-mega-menu__list {
  display: grid;
  gap: 4px;
  padding: 0;
}

.container-header .codex-mega-menu__nav > .codex-mega-menu__list.mm-collapse,
.container-header .codex-mega-menu__list .mm-collapse {
  display: grid;
  height: auto !important;
  position: static;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: none;
}

.container-header .codex-mega-menu__list .metismenu-item > ul {
  position: static;
  width: 100%;
  margin: 6px 0 0 10px;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.container-header .codex-mega-menu__module {
  border-left: 1px solid rgba(18, 60, 69, .12);
}

.container-header .codex-mega-menu__module h3,
.container-header .codex-mega-menu__module h4,
.container-header .codex-mega-menu__module .module-title {
  margin: 0 0 10px;
  color: var(--codex-primary);
  font-family: var(--codex-font-title);
  font-size: clamp(21px, 1.8vw, 28px);
  line-height: 1.1;
}

.container-header .codex-mega-menu__module p {
  margin: 0 0 12px;
  color: var(--codex-muted);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.45;
}

.container-header .codex-mega-menu__module a {
  display: inline;
  padding: 0;
  color: var(--codex-primary);
  background: transparent;
  border-radius: 0;
  font-weight: 700;
}

.container-header .codex-mega-menu__module a:hover,
.container-header .codex-mega-menu__module a:focus {
  color: var(--codex-accent-hover);
  background: transparent;
}

@media (max-width: 991.98px) {
  .container-header .codex-mega-menu {
    display: block;
    width: 100%;
  }

  .container-header .codex-mega-menu__nav {
    padding: 10px 0;
    border-left: 0;
  }

  /* Ascunde complet modulele (carduri/liste) din mega menu pe mobil */
  .container-header .codex-mega-menu__module {
    display: none !important;
  }

  /* Expandează toate sub-meniurile pe mobil — fără accordion */
  .container-header .metismenu.mod-menu .mm-collapse {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
    position: static !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    pointer-events: auto !important;
  }

  /* Ascunde butoanele de toggle (nu mai e nevoie, totul e deschis) */
  .container-header .metismenu.mod-menu .mm-toggler {
    display: none !important;
  }

  /* Sub-itemii: indentați, vizibili pe fond închis */
  .container-header .metismenu.mod-menu .mm-collapse a {
    font-size: 14px !important;
    font-weight: 400 !important;
    padding: 0.35rem 0.8rem 0.35rem 1.6rem !important;
    color: rgba(255,255,255,.75) !important;
    border-radius: 6px !important;
  }
  .container-header .metismenu.mod-menu .mm-collapse a:hover {
    color: #fff !important;
    background: rgba(255,255,255,.10) !important;
  }

  /* Separatoare vizuale între secțiunile de meniu */
  .container-header .metismenu.mod-menu > .metismenu-item {
    border-bottom: 1px solid rgba(18,60,69,.08);
  }
  .container-header .metismenu.mod-menu > .metismenu-item:last-child {
    border-bottom: none;
  }

  /* Padding mai generos pentru linkurile de top-level */
  .container-header .metismenu.mod-menu > .metismenu-item > a {
    padding: 0.65rem 0.8rem !important;
    font-size: 15px !important;
    font-weight: 700 !important;
  }
}

/* ── CODEX PATCH (2026-07-16) — buton hamburger meniu principal, doar mobil ──
   Vezi COMPONENT_PATCHES.md, secțiunea Core Joomla (com_content, module core).
   Ascunde meniul principal pe mobil până la apăsarea butonului; pe desktop
   butonul nu se vede și meniul se comportă exact ca înainte. ── */
.codex-mobile-nav-toggler {
  display: none;
}

/* Pe desktop, wrapper-ul nou nu trebuie să existe din punct de vedere al
   layout-ului flex din .container-nav — display:contents îl face "invizibil"
   pentru calculul de aliniere, copiii lui (ul.metismenu) rămân exact ca
   înainte, ca și cum wrapper-ul nici nu ar exista. */
.codex-mobile-nav {
  display: contents;
}

@media (max-width: 991.98px) {
  /* Pe mobil wrapper-ul trebuie să fie un bloc real, ca max-height/overflow
     din regula de mai jos să poată funcționa (display:contents nu suportă
     max-height/overflow deloc). */
  .codex-mobile-nav {
    display: block;
  }


  .codex-mobile-nav-toggler {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    padding: 0;
    margin: 0.4rem 0;
    border: none;
    border-radius: 8px;
    background: transparent;
    cursor: pointer;
  }

  .codex-mobile-nav-toggler span {
    display: block;
    width: 24px;
    height: 2.5px;
    border-radius: 2px;
    background: #eeefef;
    transition: transform 0.25s ease, opacity 0.2s ease;
  }

  .codex-mobile-nav-toggler[aria-expanded="true"] span:nth-child(1) {
    transform: translateY(7.5px) rotate(45deg);
  }

  .codex-mobile-nav-toggler[aria-expanded="true"] span:nth-child(2) {
    opacity: 0;
  }

  .codex-mobile-nav-toggler[aria-expanded="true"] span:nth-child(3) {
    transform: translateY(-7.5px) rotate(-45deg);
  }

  .codex-mobile-nav {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.35s ease, opacity 0.25s ease;
  }

  .codex-mobile-nav.codex-mobile-nav--open {
    max-height: 3000px;
    opacity: 1;
  }
}

/* ── CODEX PATCH (2026-07-15) — buton Autentificare/Deconectare, poziție proprie
   "header-auth". Randat ca frate al drawer-ului colapsabil (#codex-mobile-nav),
   nu în interiorul lui — rămâne mereu vizibil pe mobil, fără să fie nevoie să
   deschizi meniul hamburger. margin-left:auto îl împinge la capătul din
   dreapta al rândului, atât pe desktop (după linkurile de meniu) cât și pe
   mobil (lângă butonul hamburger, pe primul rând, înainte ca drawer-ul să
   treacă pe rândul următor datorită flex-wrap:wrap moștenit pe .container-nav). */
.codex-header-auth {
  display: flex;
  align-items: center;
  margin-left: auto;
}

@media (max-width: 991.98px) {
  .codex-mobile-nav-toggler {
    order: 1;
  }

  .codex-header-auth {
    order: 2;
    margin-left: auto;
  }

  .codex-mobile-nav {
    order: 3;
    flex: 1 1 100%;
  }

  .container-header .container-nav .container-search {
    order: 4;
    flex: 1 1 100%;
  }

  /* Compact pe mobil — pe desktop .btn-login e deja stilizat corect;
     aici anulăm width:100% (gândit pentru butonul din interiorul drawer-ului). */
  .codex-header-auth .btn-login {
    width: auto;
    margin-top: 0;
    padding: 0.5rem 0.9rem;
    font-size: 0.85rem;
    transform: none;
  }
}


/* =========================================================
   BLOC ASISTENȚĂ MEMBRI
   ========================================================= */

.header-asistenta {
  display: flex;
  flex-direction: column;
  justify-content: center;

  text-align: right;
  line-height: 1.1;

  margin-top: 0;
  transform: translateY(2px);

  font-family: var(--codex-font-ui);
}

.header-asistenta .label {
  color: var(--codex-secondary);

  margin-bottom: 0.1rem;

  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.header-asistenta .phone {
  color: var(--codex-white);

  font-size: 1.22rem;
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: 0.01em;
}

.header-asistenta .phone:hover {
  color: var(--codex-accent);
}


/* =========================================================
   BUTON AUTENTIFICARE / NUME USER
   ========================================================= */

.btn-login {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;

  align-self: center;

  background: var(--codex-accent);
  color: var(--codex-text) !important;

  padding: 0.75rem 1.45rem;

  border: 1px solid rgba(216, 154, 43, 0.35);
  border-radius: 9px;

  font-family: var(--codex-font-ui);
  font-size: 1rem;
  font-weight: 800;
  line-height: 1;

  text-decoration: none !important;
  white-space: nowrap;
  cursor: pointer;

  box-shadow: 0 6px 16px rgba(216, 154, 43, 0.22);

  transform: translateY(1px);

  transition:
    background-color 0.18s ease,
    color 0.18s ease,
    transform 0.1s ease,
    box-shadow 0.18s ease;
}

.btn-login:hover,
.btn-login:focus {
  background: var(--codex-accent-hover);
  color: var(--codex-white) !important;

  transform: translateY(1px);

  box-shadow: 0 8px 20px rgba(183, 125, 31, 0.28);
}

.btn-login:active {
  transform: translateY(2px);
}


/* Iconiță user pentru butonul cu nume */
.btn-user::before {
  content: "\f007";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  margin-right: 0.5rem;
}


/* =========================================================
   WRAPPER DREAPTA: ASISTENȚĂ + AUTENTIFICARE
   Folosește dacă modulele au clasa header-right
   ========================================================= */

.container-header .header-right,
.container-header .moduletable.header-right,
.container-header .mod-custom.header-right {
  display: flex;
  align-items: center;
  gap: 2.2rem;

  margin-bottom: 0;
}


/* Curățare spații module */
.container-header .moduletable,
.container-header .mod-custom {
  margin-bottom: 0;
}


/* =========================================================
   CĂUTARE ÎN HEADER, DACĂ EXISTĂ
   ========================================================= */

.container-header .mod-finder,
.container-header .search {
  font-family: var(--codex-font-ui);
}

.container-header input[type="search"],
.container-header .form-control {
  background: rgba(255, 255, 255, 0.96);
  color: var(--codex-text);

  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 9px;

  font-family: var(--codex-font-ui);
}

.container-header input[type="search"]:focus,
.container-header .form-control:focus {
  border-color: var(--codex-accent);
  box-shadow: 0 0 0 0.18rem rgba(216, 154, 43, 0.24);
}


/* =========================================================
   MODAL LOGIN — CODEX
   ========================================================= */

/* CODEX PATCH (2026-07-15) — pluginul Regular Labs "Modals" randează popup-ul
   de autentificare cu z-index:1000 fix (media/modals/css/style.css), sub
   z-index:1100 al .container-header (cap. 36 din MAINTENANCE_SITE.md). Pe
   mobil asta face ca modalul să apară vizual SUB header/hamburger — nu e o
   problemă de scroll, e strict conflict de z-index. Ridicăm modalul deasupra
   a tot ce are site-ul (inclusiv .codex-mega-menu / .container-header, 1100). */
[data-modals-element="modal"] {
  z-index: 2000 !important;
}

#loginModal .modal-content {
  background: var(--codex-white);
  color: var(--codex-text);

  border: 1px solid rgba(18, 60, 69, 0.12);
  border-radius: 14px;

  box-shadow: 0 22px 60px rgba(18, 60, 69, 0.24);

  font-family: var(--codex-font-ui);
}

#loginModal .modal-header {
  background: var(--codex-primary);
  color: var(--codex-white);

  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 14px 14px 0 0;
}

#loginModal .modal-title {
  color: var(--codex-white);

  font-family: var(--codex-font-title);
  font-weight: 700;
}

#loginModal .btn-close {
  filter: invert(1);
  opacity: 0.85;
}

#loginModal .modal-body {
  background: var(--codex-bg);
}

#loginModal label {
  color: var(--codex-primary);
  font-weight: 700;
}

#loginModal input {
  background: var(--codex-white);
  color: var(--codex-text);

  border: 1px solid rgba(18, 60, 69, 0.18);
  border-radius: 8px;

  font-family: var(--codex-font-ui);
}

#loginModal input:focus {
  border-color: var(--codex-accent);
  box-shadow: 0 0 0 0.18rem rgba(216, 154, 43, 0.22);
}

#loginModal .btn-primary,
#loginModal button[type="submit"] {
  background: var(--codex-accent);
  color: var(--codex-text);

  border-color: var(--codex-accent);
  border-radius: 9px;

  font-weight: 800;
}

#loginModal .btn-primary:hover,
#loginModal button[type="submit"]:hover {
  background: var(--codex-accent-hover);
  color: var(--codex-white);

  border-color: var(--codex-accent-hover);
}


/* =========================================================
   TOGGLER MOBIL CASSIOPEIA
   ========================================================= */

.container-header .navbar-toggler {
  color: var(--codex-white);

  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 8px;
}

.container-header .navbar-toggler:focus {
  box-shadow: 0 0 0 0.18rem rgba(216, 154, 43, 0.3);
}

.container-header .navbar-toggler-icon {
  filter: brightness(0) invert(1);
}


/* =========================================================
   RESPONSIVE TABLETĂ / MOBIL
   ========================================================= */

@media (max-width: 991.98px) {
  .container-header {
    min-height: auto;
    padding-top: 14px;
    padding-bottom: 18px;
  }

  .container-header .navbar-brand .brand-logo img {
    width: 145px;
    max-height: 50px;
  }

  .container-header .container-nav {
    margin-top: 16px;
    align-items: flex-start;
  }

  /* CODEX PATCH (2026-07-15) — scopat la ".container-nav .mod-menu" (nu la
     orice ".mod-menu" din .container-header): selectorul vechi, mai larg,
     prindea din greșeală și bara de sus (.container-below-top .mod-menu,
     "Zona de lucru/Devino Membru/..."), care e tot un <ul class="mod-menu">
     dar complet altă listă — o forța pe coloană (stivuită vertical, 4
     rânduri) în loc s-o lase pe rândul ei orizontal, comprimat. */
  .container-header .container-nav .mod-menu,
  .container-header .navbar-nav {
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
  }

  .container-header .mod-menu > li > a,
  .container-header .mod-menu > li > span,
  .container-header .navbar-nav .nav-link {
    padding: 0.7rem 0;
  }

  .header-asistenta {
    text-align: left;
    transform: none;
    margin-top: 0.75rem;
  }

  .header-asistenta .phone {
    font-size: 1.08rem;
  }

  .btn-login {
    width: 100%;
    margin-top: 0.75rem;
    transform: none;
  }

  .btn-login:hover,
  .btn-login:focus,
  .btn-login:active {
    transform: none;
  }

  .container-header .header-right,
  .container-header .moduletable.header-right,
  .container-header .mod-custom.header-right {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
  }
}


@media (max-width: 575.98px) {
  .container-header .navbar-brand .brand-logo img {
    width: 132px;
    max-height: 46px;
  }

  .container-header .navbar-brand .site-title {
    font-size: 1.35rem;
  }

  .header-asistenta .label {
    font-size: 0.68rem;
  }

  .header-asistenta .phone {
    font-size: 1rem;
  }
}



/* =========================================================
   LINIA DE DUPA MENU
   ========================================================= */


.card-body {
    padding: var(--card-spacer-y) var(--card-spacer-x);
    color: var(--card-color);
    flex: auto;
    margin-top: -38px;
    margin-bottom: -70px;
}
/* =========================================================
   MODULUL CU AI - CONSTRRUIM IMPREUNA CULTURA 
   ========================================================= */

.cx-hero {
  --cx-petrol: var(--codex-primary);
  --cx-sage: var(--codex-secondary);
  --cx-cream: var(--codex-bg);
  --cx-white: var(--codex-white);
  --cx-text: var(--codex-text);
  --cx-muted: var(--codex-muted);
  --cx-mustard: var(--codex-accent);
  --cx-mustard-dark: var(--codex-accent-hover);

  position: relative;
  width: 100vw;
  max-width: 100vw;
  min-height: clamp(520px, 66vh, 660px);
  margin: -1px calc(50% - 50vw) 0;
  padding: clamp(46px, 7vh, 76px) clamp(20px, 5vw, 64px) clamp(48px, 7vh, 76px);
  display: flex;
  align-items: center;
  box-sizing: border-box;
  overflow: hidden;
  background-color: var(--cx-petrol);
  background-image:
    linear-gradient(105deg,
      rgba(18, 60, 69, 1) 0%,
      rgba(18, 60, 69, .96) 42%,
      rgba(18, 60, 69, .82) 66%,
      rgba(143, 175, 155, .52) 100%),
    linear-gradient(180deg,
      rgba(18, 60, 69, 1) 0%,
      rgba(18, 60, 69, .88) 24%,
      rgba(32, 36, 38, .76) 100%),
    url(/images/joomlart/hero/bg-1.jpg#joomlaImage://local-images/joomlart/hero/bg-1.jpg?width=1920&height=1121);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

.cx-hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 1px;
  background: rgba(247, 243, 234, .35);
  pointer-events: none;
}

.cx-hero-inner {
  position: relative;
  z-index: 1;
  width: min(var(--codex-content-max), 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 500px);
  gap: clamp(28px, 5vw, 64px);
  align-items: center;
}

.cx-hero-left {
  color: var(--cx-white);
}

.cx-hero-right {
  min-width: 0;
}

.cx-hero-title {
  max-width: 700px;
  margin: 0 0 clamp(20px, 3vw, 30px);
  color: var(--cx-white);
  font-family: var(--codex-font-title);
  font-size: clamp(36px, 4.3vw, 56px);
  line-height: 1.06;
  font-weight: 700;
  letter-spacing: 0;
}

.cx-hero-text {
  max-width: 600px;
  margin: 0 0 clamp(28px, 4vw, 42px);
  color: rgba(255, 255, 255, .9);
  font-family: var(--codex-font-ui);
  font-size: clamp(16px, 1.25vw, 18px);
  line-height: 1.62;
  font-weight: 500;
}

.cx-hero-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.cx-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 13px 22px;
  border: 1px solid transparent;
  border-radius: 8px;
  box-sizing: border-box;
  font-family: var(--codex-font-ui);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

.cx-btn:hover,
.cx-btn:focus-visible {
  transform: translateY(-1px);
}

.cx-btn-primary {
  background: var(--cx-white);
  color: var(--cx-petrol);
  border-color: rgba(255, 255, 255, .72);
}

.cx-btn-primary:hover,
.cx-btn-primary:focus-visible {
  background: var(--cx-cream);
  color: var(--cx-petrol);
}

.cx-btn-orange {
  background: var(--cx-mustard);
  color: var(--cx-text);
  border-color: var(--cx-mustard);
}

.cx-btn-orange:hover,
.cx-btn-orange:focus-visible {
  background: var(--cx-mustard-dark);
  border-color: var(--cx-mustard-dark);
  color: var(--cx-white);
}

/* ===== Agent AI ===== */
#codex-chat {
  width: min(100%, 500px);
  margin-left: auto;
  border: 1px solid rgba(143, 175, 155, .46);
  border-radius: 8px;
  overflow: hidden;
  background: var(--cx-white);
  box-shadow: 0 24px 54px rgba(10, 31, 36, .28);
  font-family: var(--codex-font-ui);
}

#codex-chat .cc-header {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 15px 18px;
  background: var(--cx-petrol);
  color: var(--cx-white);
  font-size: 15px;
  font-weight: 700;
}

#codex-chat .cc-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--cx-sage);
  box-shadow: 0 0 0 0 rgba(143, 175, 155, .72);
  animation: ccPulse 2s infinite;
}

@keyframes ccPulse {
  0% { box-shadow: 0 0 0 0 rgba(143, 175, 155, .62); }
  70% { box-shadow: 0 0 0 8px rgba(143, 175, 155, 0); }
  100% { box-shadow: 0 0 0 0 rgba(143, 175, 155, 0); }
}

#codex-chat .cc-messages {
  height: clamp(240px, 30vh, 320px);
  padding: 16px;
  overflow-y: auto;
  background: var(--cx-cream);
}

#codex-chat .cc-msg {
  max-width: 88%;
  margin-bottom: 10px;
  padding: 11px 14px;
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.55;
  word-wrap: break-word;
}

#codex-chat .cc-bot {
  background: var(--cx-white);
  border: 1px solid rgba(143, 175, 155, .5);
  color: var(--cx-text);
}

#codex-chat .cc-bot p {
  margin: 0 0 8px;
}

#codex-chat .cc-bot p:last-child {
  margin-bottom: 0;
}

#codex-chat .cc-list {
  margin: 8px 0;
  padding-left: 4px;
  list-style: none;
}

#codex-chat .cc-list li {
  position: relative;
  margin-bottom: 6px;
  padding-left: 20px;
  line-height: 1.5;
}

#codex-chat .cc-list li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 8px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--cx-mustard);
}

#codex-chat .cc-user {
  margin-left: auto;
  background: var(--cx-petrol);
  color: var(--cx-white);
}

#codex-chat .cc-ctas {
  margin-top: 10px;
}

#codex-chat .cc-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 9px 16px;
  border-radius: 8px;
  background: var(--cx-mustard);
  color: var(--cx-text) !important;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none !important;
}

#codex-chat .cc-articles {
  margin: 4px 0 10px;
  padding-top: 8px;
  border-top: 1px dashed rgba(143, 175, 155, .5);
  font-size: 12px;
  font-weight: 600;
  color: var(--cx-text);
}

#codex-chat .cc-article-list {
  margin: 6px 0 0;
  padding: 0;
  list-style: none;
}

#codex-chat .cc-article-list li {
  margin-bottom: 5px;
}

#codex-chat .cc-article-list a {
  font-size: 12.5px;
  font-weight: 500;
  color: var(--cx-petrol) !important;
  text-decoration: underline !important;
}

#codex-chat .cc-article-list a:hover {
  color: var(--cx-mustard) !important;
}

#codex-chat .cc-cta:hover,
#codex-chat .cc-cta:focus-visible {
  background: var(--cx-mustard-dark);
  color: var(--cx-white) !important;
}

#codex-chat .cc-input {
  display: flex;
  border-top: 1px solid rgba(143, 175, 155, .42);
  background: var(--cx-white);
}

#codex-chat .cc-input input {
  flex: 1;
  min-width: 0;
  border: none;
  padding: 15px 16px;
  color: var(--cx-text);
  font-size: 14px;
  outline: none;
}

#codex-chat .cc-input input::placeholder {
  color: var(--cx-muted);
}

#codex-chat .cc-input button {
  min-width: 88px;
  border: none;
  background: var(--cx-mustard);
  color: var(--cx-text);
  padding: 0 20px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}

#codex-chat .cc-input button:hover,
#codex-chat .cc-input button:focus-visible {
  background: var(--cx-mustard-dark);
  color: var(--cx-white);
}

#codex-chat .cc-input button:disabled {
  opacity: .5;
  cursor: default;
}

#codex-chat .cc-typing {
  color: var(--cx-muted);
  font-style: italic;
}

/* ===== Responsive ===== */
@media (max-width: 980px) {
  .cx-hero {
    min-height: auto;
    padding-top: clamp(38px, 6vh, 58px);
    padding-bottom: clamp(42px, 7vh, 64px);
  }

  .cx-hero-inner {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .cx-hero-title,
  .cx-hero-text {
    max-width: 760px;
  }

  #codex-chat {
    width: 100%;
    margin-left: 0;
  }
}

@media (max-width: 640px) {
  .cx-hero {
    min-height: auto;
    padding: 32px 18px 36px;
    align-items: flex-start;
    background-position: 58% center;
  }

  .cx-hero-inner {
    gap: 24px;
  }

  .cx-hero-title {
    margin-bottom: 16px;
    font-size: clamp(31px, 9vw, 38px);
    line-height: 1.1;
  }

  .cx-hero-text {
    margin-bottom: 24px;
    font-size: 16px;
    line-height: 1.55;
  }

  .cx-hero-btns {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .cx-btn {
    width: 100%;
    min-height: 46px;
    padding: 12px 16px;
    font-size: 15px;
  }

  #codex-chat .cc-header {
    padding: 13px 14px;
    font-size: 14px;
  }

  #codex-chat .cc-messages {
    height: 230px;
    padding: 12px;
  }

  #codex-chat .cc-msg {
    max-width: 94%;
    padding: 10px 12px;
    font-size: 13px;
  }

  #codex-chat .cc-input input {
    padding: 13px 12px;
  }

  #codex-chat .cc-input button {
    min-width: 78px;
    padding: 0 14px;
  }
}

/* =========================================================
   STATISTICI HOMEPAGE — CONTINUARE DUPĂ HERO
   ========================================================= */
.container-top-a > *, .container-top-b > *, .container-bottom-a > *, .container-bottom-b > * {
    flex: 1;
    margin: .5em 0;
    background: none;
    border: none;
}

.cx-stats {
  position: relative;
  width: 100vw;
  max-width: 100vw;
  margin: 1px calc(95% - 50vw) 0;

  box-sizing: border-box;
  overflow: hidden;

}

.cx-stats-inner {
  width: min(var(--codex-content-max), 100%);
  margin: 0 auto;
}

.cx-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(10px, 1.2vw, 14px);
}

.cx-stat {
  position: relative;
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  grid-template-areas:
    "icon value"
    "icon label";
  column-gap: 12px;
  align-items: center;
  min-height: 88px;
  padding: 14px 16px;
  border: 1px solid rgba(18, 60, 69, .08);
  border-top: 3px solid rgba(143, 175, 155, .85);
  border-radius: 8px;
  background: var(--codex-primary);
  box-shadow: 0 10px 22px rgba(18, 60, 69, .065);
}

.cx-stat:nth-child(2),
.cx-stat:nth-child(4) {
  border-top-color: var(--codex-accent);
}

.cx-stat-icon {
  grid-area: icon;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 8px;
  color: var(--codex-white);
  background: var(--codex-primary);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14);
  
}

.cx-stat:nth-child(2) .cx-stat-icon,
.cx-stat:nth-child(4) .cx-stat-icon {
  color: var(--codex-text);
  background: var(--codex-accent);
}

.cx-stat-icon svg {
  display: block;
  width: 30px;
  height: 30px;
}

.cx-stat-value {
  grid-area: value;
  display: block;
  color: var(--codex-muted2);
  font-family: var(--codex-font-title);
  font-size: clamp(24px, 1.8vw, 30px);
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: 0;
  white-space: nowrap;
  margin: 0px 0px  0px 20px;
}

.cx-stat-label {
  grid-area: label;
  display: block;
  margin-top: 3px;
  color: var(--codex-muted2);
  font-family: var(--codex-font-ui);
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1.25;
  margin: 0px 0px  0px 20px;
}

@media (max-width: 980px) {
  .cx-stats {
    padding-bottom: clamp(42px, 7vw, 64px);
    background:
      linear-gradient(180deg,
        var(--codex-primary) 0,
        var(--codex-primary) 34px,
        var(--codex-bg) 34px,
        var(--codex-bg) 100%);
    margin: 1px calc(50% - 50vw) 0;
  }

  .cx-stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


@media (max-width: 520px) {
  .cx-stats {
    padding-right: 18px;
    padding-bottom: 38px;
    padding-left: 18px;
    background:
      linear-gradient(180deg,
        var(--codex-primary) 0,
        var(--codex-primary) 24px,
        var(--codex-bg) 24px,
        var(--codex-bg) 100%);
  }

  .cx-stats-grid {
    gap: 10px;
  }

  .cx-stat {
    grid-template-columns: 1fr;
    grid-template-areas:
      "icon"
      "value"
      "label";
    justify-items: start;
    min-height: 112px;
    padding: 13px;
  }

  .cx-stat-icon {
    width: 34px;
    height: 34px;
    margin-bottom: 10px;
  }

  .cx-stat-value {
    font-size: clamp(23px, 7vw, 28px);
  }

  .cx-stat-label {
    font-size: 12px;
  }
}

/* =========================================================
   MODUL AJUTOR — CARDURI DE ORIENTARE
   ========================================================= */

.card:has(.cx-help) {
  --card-bg: transparent;
  --card-border-width: 0;
  --card-border-color: transparent;
  --card-border-radius: 0;
  --card-box-shadow: none;

  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.card:has(.cx-help) > .card-header {
  display: none;
}

.card:has(.cx-help) > .card-body {
  margin-top: 0;
  margin-bottom: 0;
  padding: 0;
  color: inherit;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.cx-help {
  width: 100vw;
  max-width: 100vw;
  margin: 0 calc(50% - 50vw);
  padding: clamp(54px, 7vw, 12px) clamp(20px, 5vw, 64px) clamp(2px, 8vw, 40px);
  box-sizing: border-box;
  background: var(--codex-bg);
}

.cx-help-inner {
  width: min(var(--codex-content-max), 100%);
  margin: 0 auto;
}

.cx-help-header {
  max-width: 820px;
  margin: 0 auto clamp(34px, 5vw, 56px);
  text-align: center;
}

.cx-help-kicker {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 28px;
  margin-bottom: 18px;
  padding: 6px 16px;
  border: 1px solid rgba(18, 60, 69, .42);
  border-radius: 999px;
  color: var(--codex-primary);
  background: rgba(255, 255, 255, .55);
  font-family: var(--codex-font-ui);
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  text-transform: uppercase;
}

.cx-help-kicker::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--codex-primary);
}

.cx-help-title {
  margin: 0;
  color: var(--codex-primary);
  font-family: var(--codex-font-title);
  font-size: clamp(34px, 3.4vw, 48px);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: 0;
}

.cx-help-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(14px, 1.7vw, 22px);
}

.cx-help-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 260px;
  padding: clamp(22px, 2.3vw, 28px);
  border: 1px solid rgba(18, 60, 69, .06);
  border-radius: 8px;
  background: rgba(255, 255, 255, .62);
  box-shadow: 0 12px 28px rgba(18, 60, 69, .045);
}

.cx-help-card-top {
  margin-bottom: clamp(22px, 3vw, 34px);
}

.cx-help-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 0;
  color: var(--codex-primary);
  background: transparent;
}

.cx-help-card:nth-child(2) .cx-help-icon,
.cx-help-card:nth-child(4) .cx-help-icon {
  color: var(--codex-primary);
  background: transparent;
}

.cx-help-icon svg {
  display: block;
  width: 52px;
  height: 52px;
}

.cx-help-card h3 {
  margin: 0 0 12px;
  color: var(--codex-text);
  font-family: var(--codex-font-ui);
  font-size: clamp(20px, 1.55vw, 24px);
  font-weight: 800;
  line-height: 1.16;
  letter-spacing: 0;
}

.cx-help-card p {
  max-width: 280px;
  margin: 0 0 24px;
  color: var(--codex-muted);
  font-family: var(--codex-font-ui);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.58;
}

.cx-help-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: fit-content;
  min-height: 30px;
  margin-top: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--codex-primary) !important;
  background: transparent;
  font-family: var(--codex-font-ui);
  font-size: 15px;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none !important;
  transition: color .18s ease;
}

.cx-help-btn:hover,
.cx-help-btn:focus-visible {
  color: var(--codex-accent-hover) !important;
}

.cx-help-footer {
  max-width: 760px;
  margin: clamp(38px, 5vw, 58px) auto 0;
  text-align: center;
}

.cx-help-footer p {
  margin: 0 auto 24px;
  color: var(--codex-muted);
  font-family: var(--codex-font-ui);
  font-size: clamp(18px, 1.7vw, 24px);
  font-weight: 500;
  line-height: 1.42;
}

.cx-help-main-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  padding: 13px 28px;
  border: 1px solid var(--codex-accent);
  border-radius: 8px;
  color: var(--codex-text) !important;
  background: var(--codex-accent);
  font-family: var(--codex-font-ui);
  font-size: 16px;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none !important;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}

.cx-help-main-btn:hover,
.cx-help-main-btn:focus-visible {
  color: var(--codex-white) !important;
  border-color: var(--codex-accent-hover);
  background: var(--codex-accent-hover);
}

@media (max-width: 1080px) {
  .cx-help-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  .cx-help {
    padding-top: 48px;
    padding-bottom: 56px;
  }

  .cx-help-card {
    min-height: 0;
  }
}

@media (max-width: 520px) {
  .cx-help {
    padding-right: 18px;
    padding-left: 18px;
  }

  .cx-help-title {
    font-size: clamp(31px, 9vw, 38px);
  }

  .cx-help-grid {
    grid-template-columns: 1fr;
  }

  .cx-help-card {
    padding: 22px;
  }

  .cx-help-card h3 {
    font-size: 24px;
  }

  .cx-help-card p {
    font-size: 15px;
  }

  .cx-help-main-btn {
    width: 100%;
  }
}
/* =========================================================
   FOOTER CODEX
   ========================================================= */

.container-footer.footer {
  margin-top: 0;
  color: var(--codex-white);
  background-color: var(--codex-primary);
  background-image: none;
  font-family: var(--codex-font-ui);
}

.container-footer.footer .grid-child {
  align-items: flex-start;
  justify-content: space-between;
  gap: clamp(36px, 5vw, 76px);
  width: min(var(--codex-content-max), 100%);
  max-width: none;
  padding: clamp(56px, 7vw, 84px) clamp(20px, 5vw, 64px);
}

.container-footer.footer .grid-child > * {
  align-self: flex-start;
  flex: 1 1 190px;
  min-width: 180px;
  margin: 0;
}

.container-footer.footer .grid-child > .footer,
.container-footer.footer .grid-child > .no-card,
.container-footer.footer .grid-child > .moduletable,
.container-footer.footer .grid-child > .mod-custom {
  color: inherit;
  background: transparent;
  background-image: none;
  border: 0;
  box-shadow: none;
  padding: 0;
}

.container-footer.footer h1,
.container-footer.footer h2,
.container-footer.footer h3,
.container-footer.footer h4,
.container-footer.footer h5,
.container-footer.footer h6 {
  display: block;
  margin: 0 0 18px;
  color: var(--codex-secondary);
  font-family: var(--codex-font-ui);
  font-size: 16px;
  font-weight: 800;
  line-height: 1.22;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.container-footer.footer ul,
.container-footer.footer .mod-menu {
  display: block;
  margin: 0;
  padding: 0;
  list-style: none;
}

.container-footer.footer li,
.container-footer.footer .mod-menu > li {
  margin: 0 0 10px;
  padding: 0;
}

.container-footer.footer a:not(.btn),
.container-footer.footer .btn-link {
  color: rgba(255, 255, 255, .9);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.42;
  text-decoration: none;
}

.container-footer.footer a:not(.btn):hover,
.container-footer.footer a:not(.btn):focus,
.container-footer.footer .btn-link:hover,
.container-footer.footer .btn-link:focus {
  color: var(--codex-accent);
  text-decoration: none;
}

.container-footer.footer p {
  margin: 0 0 10px;
  color: rgba(255, 255, 255, .9);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
}

.container-footer.footer .metismenu.mod-menu .mm-collapse {
  background: var(--codex-primary);
}

@media (max-width: 991.98px) {
  .container-footer.footer .grid-child {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .container-footer.footer .grid-child {
    grid-template-columns: 1fr;
  }
}


/* =========================================================
   FOOTER — MODUL ASOCIATIA CODEX
   ========================================================= */

.container-footer.footer .grid-child > *:has(.cx-footer-brand) {
  flex: 1.45 1 280px;
  min-width: 260px;
  max-width: 340px;
}

.cx-footer-brand {
  color: var(--codex-white);
}

.cx-footer-brand-logo {
  display: inline-flex;
  align-items: center;
  width: min(180px, 100%);
  margin-bottom: 18px;
}

.cx-footer-brand-logo img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 58px;
  object-fit: contain;
}

.cx-footer-brand h2 {
  margin: 0 0 20px;
  color: var(--codex-white);
  font-family: var(--codex-font-title);
  font-size: clamp(25px, 2vw, 32px);
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: 0;
  text-transform: none;
}

.cx-footer-cif-label {
  opacity: 0.55;
  font-size: 0.85em;
  font-weight: 400;
  letter-spacing: 0.02em;
}

.cx-footer-contact {
  display: grid;
  gap: 11px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.cx-footer-contact li {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  margin: 0;
  color: rgba(255, 255, 255, .9);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.45;
}

.cx-footer-contact-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  color: var(--codex-secondary);
}

.cx-footer-contact-icon svg {
  display: block;
  width: 18px;
  height: 18px;
}

.cx-footer-contact a {
  color: rgba(255, 255, 255, .92) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}

.cx-footer-contact a:hover,
.cx-footer-contact a:focus {
  color: var(--codex-accent) !important;
}

.cx-footer-divider {
  width: 100%;
  height: 1px;
  margin: 22px 0 16px;
  background: rgba(143, 175, 155, .32);
}

.cx-footer-social {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.cx-footer-social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1px solid rgba(143, 175, 155, .36);
  border-radius: 8px;
  color: rgba(255, 255, 255, .9) !important;
  text-decoration: none !important;
  transition: color .18s ease, border-color .18s ease, background-color .18s ease;
}

.cx-footer-social a:hover,
.cx-footer-social a:focus {
  color: var(--codex-primary) !important;
  border-color: var(--codex-accent);
  background: var(--codex-accent);
}

.cx-footer-social svg {
  display: block;
  width: 18px;
  height: 18px;
}

@media (max-width: 620px) {
  .container-footer.footer .grid-child > *:has(.cx-footer-brand) {
    max-width: none;
  }
}
/* =========================================================
   COPYRIGHT — POZITIA DEBUG
   ========================================================= */

.codex-copyright {
  width: 100vw;
  max-width: 100vw;
  margin: 0 calc(50% - 50vw);
  padding: 16px clamp(20px, 5vw, 64px);
  box-sizing: border-box;
  color: rgba(255, 255, 255, .76);
  background: #0E3038;
  border-top: 1px solid rgba(143, 175, 155, .22);
  font-family: var(--codex-font-ui);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.55;
  text-align: center;
}

.codex-copyright a {
  color: rgba(255, 255, 255, .9);
  text-decoration: none;
}

.codex-copyright a:hover,
.codex-copyright a:focus {
  color: var(--codex-accent);
}

/* =========================================================
   ARTICOLE — TEMPLATE EDITORIAL CODEX
   ========================================================= */

body.view-article .site-grid,
body.view-article .container-component,
body.view-article .container-component main {
  background: var(--codex-articol) !important;
}

body.view-article .container-component {
  padding: clamp(48px, 6.5vw, 86px) 0 clamp(64px, 8vw, 110px);
}

body.view-article:not(.has-sidebar-left):not(.has-sidebar-right) .container-component {
  justify-self: center;
  width: min(1120px, calc(100% - clamp(32px, 8vw, 128px)));
  max-width: 1120px;
}

body.view-article .com-content-article,
body.view-article .item-page {
  width: min(100%, 940px);
  margin: 0 auto;
  color: var(--codex-text);
  font-family: var(--codex-font-ui);
}

body.view-article .page-header {
  margin: 0 0 18px;
  padding: 0;
  border: 0;
}

body.view-article .page-header h1,
body.view-article .com-content-article > h1,
body.view-article .item-page > h1 {
  max-width: 980px;
  margin: 0;
  color: var(--codex-primary);
  font-family: var(--codex-font-title);
  font-size: clamp(36px, 4.3vw, 56px);
  font-weight: 700;
  line-height: 1.06;
  letter-spacing: 0;
}

body.view-article .fields-container,
body.view-article .fields-container ul,
body.view-article .fields-container ol {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
  overflow: visible;
}

body.view-article .fields-container li,
body.view-article .field-entry {
  margin: 0;
  padding: 0;
  list-style: none;
}

body.view-article .fields-container li::marker,
body.view-article .field-entry::marker {
  content: "";
  font-size: 0;
}

body.view-article .field-entry {
  display: inline-flex;
  align-items: center;
  min-height: 0;
  padding: 0;
  color: var(--codex-muted);
  background: transparent;
  border: 0;
  border-radius: 0;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.35;
}

body.view-article .field-entry .field-label {
  margin-right: 4px;
  color: var(--codex-muted);
  font-weight: 600;
}

body.view-article .field-entry.codex-reading-time,
body.view-article .field-entry.reading-time,
body.view-article .field-entry.timp-citire,
body.view-article .field-entry.durata-citire,
body.view-article .field-entry.field-reading-time {
  color: var(--codex-accent-hover);
}

/* Wrapper meta devine containerul cu borduri — butonul Google stă pe același rând */
body.view-article .codex-article-meta {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 20px;
  margin: 0 0 30px;
  padding: 13px 0 14px;
  border-top: 1px solid rgba(143, 175, 155, .34);
  border-bottom: 1px solid rgba(143, 175, 155, .28);
}

body.view-article .article-info {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  align-items: center;
  align-self: center;
  flex: 1;
  min-width: 0;
  margin: 0;
  color: var(--codex-muted);
  background: transparent;
  border-radius: 0;
  box-shadow: none;
}

body.view-article .codex-article-meta--has-author .article-info {
  padding-left: 52px;
}

body.view-article .codex-article-meta--has-author .article-info::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  transform: translateY(-50%);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23123C45' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21v-1.5a8 8 0 0 1 16 0V21'/%3E%3C/svg%3E") center / 19px 19px no-repeat,
    rgba(143, 175, 155, .18);
  box-shadow: inset 0 0 0 1px rgba(18, 60, 69, .12);
}

body.view-article .codex-article-meta--has-author:has(.codex-author-avatar) .article-info::before {
  display: none;
}

body.view-article .codex-article-meta--has-author .codex-author-avatar {
  position: absolute;
  top: 50%;
  left: 0;
  z-index: 1;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  object-fit: cover;
  transform: translateY(-50%);
  box-shadow:
    0 0 0 1px rgba(18, 60, 69, .12),
    0 8px 18px rgba(18, 60, 69, .10);
}

body.view-article .article-info-term {
  display: none;
}

body.view-article .article-info dd {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  padding: 0 !important;
  color: var(--codex-muted);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.35;
}

body.view-article .article-info dd::before,
body.view-article .article-info [class^="icon-"],
body.view-article .article-info [class*=" icon-"] {
  color: var(--codex-secondary);
}

body.view-article .article-info .createdby [class^="icon-"],
body.view-article .article-info .createdby [class*=" icon-"],
body.view-article .article-info .icon-user {
  display: none;
}

body.view-article .article-info strong,
body.view-article .article-info b {
  color: var(--codex-primary);
  font-weight: 700;
}

body.view-article .article-info .category-name,
body.view-article .article-info .parent-category-name,
body.view-article .codex-article-category {
  color: var(--codex-secondary);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .08em;
  line-height: 1.2;
  text-transform: uppercase;
}

body.view-article .com-content-article > .codex-article-category,
body.view-article .item-page > .codex-article-category {
  display: inline-flex;
  margin: 0 0 13px;
}

body.view-article .article-info .category-name,
body.view-article .article-info .parent-category-name {
  order: -2;
  flex-basis: 100%;
  margin-bottom: 2px;
}

body.view-article .article-info .category-name a,
body.view-article .article-info .parent-category-name a,
body.view-article .codex-article-category a {
  color: inherit;
  text-decoration: none;
}

body.view-article .article-info .category-name a:hover,
body.view-article .article-info .category-name a:focus,
body.view-article .article-info .parent-category-name a:hover,
body.view-article .article-info .parent-category-name a:focus,
body.view-article .codex-article-category a:hover,
body.view-article .codex-article-category a:focus {
  color: var(--codex-accent);
}

/* Nu se afiseaza categoria in blocul info */
body.view-article .article-info .category-name, body.view-article .article-info .parent-category-name {
    order: -2;
    flex-basis: 100%;
    margin-bottom: 2px;
    display: none;
}

body.view-article .tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 2px 0 clamp(28px, 4vw, 42px);
  padding: 0;
  list-style: none;
  overflow: visible;
}

body.view-article .tags .list-inline-item {
  margin: 0;
}

body.view-article .tags a.btn,
body.view-article .tags a,
body.view-article .tag a {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 6px 11px;
  color: var(--codex-primary);
  background: rgba(18, 60, 69, .07);
  border: 1px solid rgba(18, 60, 69, .16);
  border-radius: 6px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.15;
  text-decoration: none;
}

body.view-article .tags a.btn:hover,
body.view-article .tags a.btn:focus,
body.view-article .tags a:hover,
body.view-article .tags a:focus,
body.view-article .tag a:hover,
body.view-article .tag a:focus {
  color: var(--codex-white);
  background: var(--codex-primary);
  border-color: var(--codex-primary);
  text-decoration: none;
}

body.view-article .com-content-article p,
body.view-article .item-page p {
  color: var(--codex-text);
  font-family: var(--codex-font-ui);
  font-size: clamp(17px, 1.2vw, 18.5px);
  font-weight: 400;
  line-height: 1.72;
  letter-spacing: -0.009em;
  margin: 0 0 0.55em;
}

body.view-article .com-content-article li:not(.field-entry):not(.list-inline-item),
body.view-article .item-page li:not(.field-entry):not(.list-inline-item) {
  color: var(--codex-text);
  font-family: var(--codex-font-ui);
  font-size: clamp(16px, 1.15vw, 17.5px);
  font-weight: 400;
  line-height: 1.48;
  letter-spacing: -0.007em;
}

/* Paragrafe în interiorul listelor — fără margin extra */
body.view-article .com-content-article li p,
body.view-article .item-page li p {
  margin-bottom: 0;
}

body.view-article .tags + p,
body.view-article .com-content-article__body > p:first-of-type,
body.view-article [itemprop="articleBody"] > p:first-of-type,
body.view-article .com-content-article > p:first-of-type,
body.view-article .item-page > p:first-of-type {
  color: var(--codex-primary);
  font-family: var(--codex-font-title);
  font-size: clamp(18px, 1.6vw, 20px);
  font-weight: 400;
  line-height: 1.52;
  margin: 0 0 clamp(16px, 2.5vw, 24px);
}

body.view-article .com-content-article h2,
body.view-article .com-content-article h3,
body.view-article .com-content-article h4,
body.view-article .item-page h2,
body.view-article .item-page h3,
body.view-article .item-page h4 {
  color: var(--codex-primary);
  font-family: var(--codex-font-title);
  font-weight: 700;
  letter-spacing: 0;
}

body.view-article .com-content-article h2,
body.view-article .item-page h2 {
  margin: clamp(18px, 2vw, 26px) 0 8px;
  font-size: clamp(22px, 2.3vw, 29px);
  line-height: 1.18;
}

body.view-article .com-content-article h3,
body.view-article .item-page h3 {
  margin: 14px 0 6px;
  font-size: clamp(19px, 1.9vw, 24px);
  line-height: 1.22;
}

body.view-article .com-content-article h4,
body.view-article .item-page h4 {
  margin: 11px 0 5px;
  font-size: clamp(17px, 1.6vw, 20px);
  line-height: 1.26;
}

body.view-article .com-content-article h5,
body.view-article .item-page h5 {
  margin: 16px 0 5px;
  font-size: clamp(15px, 1.35vw, 18px);
  font-family: var(--codex-font-title);
  color: var(--codex-primary);
  font-weight: 700;
  line-height: 1.3;
}

body.view-article .com-content-article h6,
body.view-article .item-page h6 {
  margin: 14px 0 4px;
  font-size: clamp(14px, 1.1vw, 16px);
  font-family: var(--codex-font-ui);
  color: var(--codex-muted);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  line-height: 1.3;
}

body.view-article .item-image,
body.view-article figure {
  margin: 0 0 clamp(24px, 4vw, 42px);
}

body.view-article .item-image img,
body.view-article figure img,
body.view-article .com-content-article img,
body.view-article .item-page img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

/* ── Hero image articol ─────────────────────────────── */
body.view-article figure.cx-article-hero {
  width: 100%;
  margin: 0 0 clamp(28px, 5vw, 48px);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 2px 16px rgba(0,0,0,.10), 0 8px 36px rgba(0,0,0,.09);
  display: flex;
  flex-direction: column;
}

body.view-article figure.cx-article-hero img {
  width: 100%;
  height: auto;
  max-height: 80vh;
  display: block;
}

body.view-article figure.cx-article-hero figcaption {
  padding: 10px 18px;
  font-size: .82rem;
  color: #666;
  background: #fafaf8;
  border-top: 1px solid rgba(0,0,0,.06);
  line-height: 1.45;
  font-style: italic;
}

/* blockquote — definiție completă și unică, vezi secțiunea BLOCKQUOTE de mai jos */

body.view-article .pagenavigation,
body.view-article .pager {
  margin-top: clamp(40px, 6vw, 70px);
}

body.view-article .container-component {
  position: relative;
}

.codex-share-rail {
  display: none;
}

body.view-article .card:has(.codex-share-rail),
body.view-article .moduletable:has(.codex-share-rail),
body.view-article .mod-custom:has(.codex-share-rail) {
  background: transparent;
  border: 0;
  box-shadow: none;
  margin: 0;
  padding: 0;
}

body.view-article .card:has(.codex-share-rail) > .card-body {
  margin: 0;
  padding: 0;
}

body.view-article .field-entry.share2-articol {
  position: absolute;
  top: 0;
  left: -90px;
  z-index: 2;
  display: block;
  width: 58px;
}

body.view-article .field-entry.share2-articol .field-value {
  display: block;
}


body.view-article .codex-share-rail {
  position: static;
  display: grid;
  gap: 18px;
  width: 58px;
  padding: 4px 0;
  color: var(--codex-primary);
  border-right: 1px solid rgba(143, 175, 155, .26);
}

.codex-share-link {
  display: grid;
  gap: 5px;
  justify-items: center;
  width: 58px;
  padding: 4px 0;
  color: var(--codex-primary);
  background: transparent;
  border: 0;
  border-radius: 6px;
  font-family: var(--codex-font-ui);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.1;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: color .18s ease, background-color .18s ease;
}

.codex-share-link svg {
  display: block;
  width: 25px;
  height: 25px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.codex-share-link:hover,
.codex-share-link:focus-visible,
.codex-share-link.is-copied {
  color: var(--codex-accent-hover);
  background: rgba(143, 175, 155, .14);
  text-decoration: none;
}

.codex-share-link.is-copied span {
  font-size: 0;
}

.codex-share-link.is-copied span::after {
  content: "Copiat";
  font-size: 12px;
}

@media (max-width: 1220px) {
  body.view-article .field-entry.share2-articol {
    position: static;
    width: 100%;
  }

  body.view-article .codex-share-rail {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    width: 100%;
    margin: 0 auto 26px;
    padding: 0 0 16px;
    border-bottom: 1px solid rgba(143, 175, 155, .26);
  }

  .codex-share-link {
    width: auto;
    min-width: 58px;
    padding: 8px 10px;
  }
}

@media (max-width: 760px) {
  /* CODEX PATCH (2026-07-15) — selectorul de mai jos trebuie să aibă aceeași
     specificitate ca regula de desktop (":not(.has-sidebar-left):not(.has-sidebar-right)",
     linia ~2281) ca să o poată suprascrie efectiv. Înainte de acest patch,
     regula de desktop câștiga oricum (specificitate mai mare, indiferent de
     ordinea din fișier), iar container-component rămânea la width:min(1120px,
     calc(100% - clamp(32px,8vw,128px))) chiar și pe mobil — de-asta articolele
     (inclusiv pagina Home, care randează prin view-article) apăreau vizibil mai
     înguste decât modulele din top-a/top-b, care nu au acest calc. */
  body.view-article:not(.has-sidebar-left):not(.has-sidebar-right) .container-component {
    width: 100%;
    padding: 38px clamp(14px, 4vw, 20px) 70px;
  }

  /* CODEX PATCH (2026-07-15) — modulele "main-top"/"main-bottom" de pe pagina
     Home (randate ca .card > .card-body > .jacl-layout, ex. module 427/430/467)
     acumulau padding pe 3 niveluri (container-component + .card-body 16px +
     .container bootstrap 9px), lăsând doar ~64% din lățimea ecranului pentru
     conținutul vizibil. Reducem .card-body la mobil și eliminăm gutter-ul
     bootstrap redundant din interiorul cardului.
     Selectorul include "body" ca să depășească specificitatea lui
     ".main-top .card-body" (linia ~3342, fără media query, altfel câștigă
     el la egalitate de specificitate fiind mai jos în fișier). */
  body .container-component .card-body {
    padding-left: 10px;
    padding-right: 10px;
  }

  body .container-component .card-body .container {
    padding-left: 0;
    padding-right: 0;
  }

  body.view-article .com-content-article,
  body.view-article .item-page {
    width: 100%;
  }

  body.view-article .page-header {
    margin-bottom: 16px;
  }

  body.view-article .page-header h1,
  body.view-article .com-content-article > h1,
  body.view-article .item-page > h1 {
    font-size: clamp(32px, 6vw, 43px); !important
    line-height: 1.08;
  }

  body.view-article .article-info {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
    padding: 13px 0 14px;
  }

  body.view-article .codex-article-meta--has-author .article-info::before {
    top: 12px;
    left: 0;
    transform: none;
  }

  body.view-article .codex-article-meta--has-author .article-info {
    padding: 52px 0 14px;
  }

  body.view-article .codex-article-meta--has-author .codex-author-avatar {
    top: 12px;
    transform: none;
  }

  body.view-article .field-entry,
  body.view-article .tags a.btn,
  body.view-article .tags a,
  body.view-article .tag a {
    width: auto;
    max-width: 100%;
  }

  body.view-article .com-content-article p,
  body.view-article .item-page p,
  body.view-article .com-content-article li:not(.field-entry):not(.list-inline-item),
  body.view-article .item-page li:not(.field-entry):not(.list-inline-item) {
    font-size: 17px;
    line-height: 1.74;
  }

  body.view-article .tags + p,
  body.view-article .com-content-article__body > p:first-of-type,
  body.view-article [itemprop="articleBody"] > p:first-of-type,
  body.view-article .com-content-article > p:first-of-type,
  body.view-article .item-page > p:first-of-type {
    font-size: clamp(20px, 6vw, 25px);
    line-height: 1.46;
  }
}

/* =========================================================
   CATEGORII SI FEATURED — LISTE EDITORIALE CODEX
   ========================================================= */

body.view-category .site-grid,
body.view-featured .site-grid,
body.view-category .container-component,
body.view-featured .container-component,
body.view-category .container-component main,
body.view-featured .container-component main {
  background: var(--codex-articol) !important;
}

body.view-category:not(.view-article) .container-component,
body.view-featured .container-component {
  justify-self: center;
  width: min(1240px, calc(100% - clamp(32px, 8vw, 128px)));
  max-width: 1240px;
  padding: clamp(16px, 8vw, 100px) 0 clamp(72px, 8vw, 118px);
}

body.view-category .codex-list-page,
body.view-featured .codex-list-page,
body.view-category .blog,
body.view-category .com-content-category,
body.view-featured .blog-featured {
  width: 100%;
  margin: 0 auto;
  font-family: var(--codex-font-ui);
}

body.view-category .page-header,
body.view-featured .page-header {
  margin: 0 0 18px;
  padding: 0;
  border: 0;
}

body.view-category .page-header h1,
body.view-category .page-header h2,
body.view-featured .page-header h1,
body.view-featured .page-header h2 {
  margin: 0;
  color: var(--codex-primary);
  font-family: var(--codex-font-title);
  font-size: clamp(42px, 5.4vw, 66px);
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: 0;
}

body.view-category .category-desc,
body.view-featured .category-desc {
  max-width: 820px;
  margin: 0 0 clamp(34px, 4vw, 52px);
  color: var(--codex-muted);
  font-family: var(--codex-font-title);
  font-size: clamp(20px, 1.7vw, 25px);
  font-weight: 400;
  line-height: 1.45;
}

body.view-category .category-desc p,
body.view-featured .category-desc p {
  margin: 0;
}

body.view-category .blog-items,
body.view-featured .blog-items,
body.view-category .codex-list-items,
body.view-featured .codex-list-items,
body.view-category .items-leading,
body.view-featured .items-leading {
  display: block !important;
  width: 100%;
  margin: 0;
  padding: 0;
  border-top: 1px solid rgba(18, 60, 69, .16);
}

body.view-category .blog-item,
body.view-featured .blog-item,
body.view-category .items-leading > div,
body.view-featured .items-leading > div {
  width: 100% !important;
  max-width: none;
  margin: 0;
  padding: 0 !important;
  border-bottom: 1px solid rgba(18, 60, 69, .16);
  overflow: visible;
}

body.view-category .codex-list-item,
body.view-featured .codex-list-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(28px, 5vw, 76px);
  align-items: center;
  min-height: clamp(120px, 12vw, 160px);
  padding: clamp(26px, 4vw, 38px) 0;
}

/* A doua coloană apare DOAR dacă există imagine */
body.view-category .codex-list-item:has(.codex-list-image),
body.view-featured .codex-list-item:has(.codex-list-image) {
  grid-template-columns: minmax(0, 1fr) clamp(210px, 21vw, 300px);
  min-height: clamp(148px, 16vw, 190px);
}

.codex-list-content {
  min-width: 0;
}

.codex-list-category {
  display: inline-flex;
  margin: 0 0 8px;
  color: var(--codex-secondary);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .075em;
  line-height: 1.2;
  text-transform: uppercase;
}

.codex-list-category a {
  color: inherit;
  text-decoration: none;
}

.codex-list-category a:hover,
.codex-list-category a:focus {
  color: var(--codex-accent);
}

body.view-category .codex-list-title,
body.view-featured .codex-list-title {
  margin: 0 0 10px;
  color: var(--codex-primary);
  font-family: var(--codex-font-title);
  font-size: clamp(27px, 2.35vw, 36px);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: 0;
}

body.view-category .codex-list-title a,
body.view-featured .codex-list-title a {
  color: inherit;
  text-decoration: none;
}

body.view-category .codex-list-title a:hover,
body.view-category .codex-list-title a:focus,
body.view-featured .codex-list-title a:hover,
body.view-featured .codex-list-title a:focus {
  color: var(--codex-accent-hover);
}

body.view-category .codex-list-intro,
body.view-featured .codex-list-intro {
  max-width: 820px;
  margin-top: 1rem;
  color: var(--codex-text);
  font-size: clamp(17px, 1.18vw, 19px);
  font-weight: 400;
  line-height: 1.58;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Without an image, let the text use the full row width instead of
   stopping at 820px and leaving the rest of the row visually empty. */
body.view-category .codex-list-item:not(:has(.codex-list-image)) .codex-list-intro,
body.view-featured .codex-list-item:not(:has(.codex-list-image)) .codex-list-intro {
  max-width: none;
}

body.view-category .codex-list-intro p,
body.view-featured .codex-list-intro p {
  margin: 0;
}

body.view-category .codex-list-intro img,
body.view-category .codex-list-intro figure,
body.view-category .codex-list-intro .readmore,
body.view-category .codex-list-intro .btn,
body.view-featured .codex-list-intro img,
body.view-featured .codex-list-intro figure,
body.view-featured .codex-list-intro .readmore,
body.view-featured .codex-list-intro .btn {
  display: none;
}

.codex-list-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px clamp(14px, 2vw, 26px);
  align-items: center;
  margin-top: 14px;
  color: var(--codex-muted);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  text-transform: none;
}

.codex-list-author {
  display: inline-flex;
  gap: 9px;
  align-items: center;
  color: var(--codex-muted);
}

.codex-list-author a {
  color: inherit;
  text-decoration: none;
}

.codex-list-author a:hover,
.codex-list-author a:focus {
  color: var(--codex-primary);
  text-decoration: none;
}

.codex-list-author-name,
.codex-list-author-text span {
  color: var(--codex-primary);
  font-weight: 700;
}

.codex-list-meta .codex-author-avatar {
  display: inline-block;
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  object-fit: cover;
  box-shadow:
    0 0 0 1px rgba(18, 60, 69, .12),
    0 6px 14px rgba(18, 60, 69, .10);
}

.codex-list-meta .codex-author-avatar-placeholder {
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23123C45' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21v-1.5a8 8 0 0 1 16 0V21'/%3E%3C/svg%3E") center / 18px 18px no-repeat,
    rgba(143, 175, 155, .18);
}

.codex-list-meta time {
  color: var(--codex-muted);
  letter-spacing: .015em;
  text-transform: uppercase;
}

.codex-list-share {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  color: var(--codex-primary);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}

.codex-list-share span {
  font-size: 15px;
  line-height: 1;
}

.codex-list-share:hover,
.codex-list-share:focus {
  color: var(--codex-accent-hover);
  text-decoration: none;
}

body.view-category .codex-list-image,
body.view-featured .codex-list-image {
  display: block;
  width: 100%;
  height: clamp(122px, 12vw, 170px);
  aspect-ratio: auto;
  overflow: hidden;
  background: rgba(143, 175, 155, .14);
  border-radius: 4px;
}

body.view-category .codex-list-image img,
body.view-featured .codex-list-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}

body.view-category .codex-list-image:hover img,
body.view-category .codex-list-image:focus img,
body.view-featured .codex-list-image:hover img,
body.view-featured .codex-list-image:focus img {
  transform: scale(1.035);
}

body.view-category .pagination,
body.view-featured .pagination,
body.view-category .com-content-category__pagination,
body.view-featured .com-content-category__pagination {
  margin: clamp(34px, 5vw, 56px) 0 0;
}

@media (max-width: 900px) {
  body.view-category:not(.view-article) .container-component,
  body.view-featured .container-component {
    width: 100%;
    padding: 48px clamp(20px, 6vw, 34px) 76px;
  }

  body.view-category .codex-list-item,
  body.view-featured .codex-list-item {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    min-height: 0;
    padding: 30px 0;
  }

  body.view-category .codex-list-content,
  body.view-featured .codex-list-content {
    order: 1;
  }

  body.view-category .codex-list-image,
  body.view-featured .codex-list-image {
    order: 0;
    width: min(100%, 520px);
    height: auto;
    aspect-ratio: 16 / 9;
    max-width: none;
  }

  body.view-category .codex-list-image img,
  body.view-featured .codex-list-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

@media (max-width: 560px) {
  body.view-category:not(.view-article) .container-component,
  body.view-featured .container-component {
    padding: 42px 24px 68px;
  }

  body.view-category .page-header,
  body.view-featured .page-header {
    margin-bottom: 14px;
  }

  body.view-category .page-header h1,
  body.view-category .page-header h2,
  body.view-featured .page-header h1,
  body.view-featured .page-header h2 {
    font-size: clamp(40px, 12vw, 54px);
    line-height: 1.02;
  }

  body.view-category .category-desc,
  body.view-featured .category-desc {
    margin-bottom: 30px;
    font-size: clamp(19px, 5.3vw, 23px);
    line-height: 1.42;
  }

  body.view-category .codex-list-title,
  body.view-featured .codex-list-title {
    font-size: clamp(25px, 7.6vw, 31px);
    line-height: 1.1;
  }

  body.view-category .codex-list-intro,
  body.view-featured .codex-list-intro {
    font-size: 17px;
    line-height: 1.58;
  }

  body.view-category .codex-list-meta,
  body.view-featured .codex-list-meta {
    gap: 8px 14px;
    font-size: 12.5px;
  }
}

/* MODUL STIRI SI NOUTATI PAGINA HOME */


 .heading-title span {
 	background-color: var(--codex-bg) !important;
    display: inline-block;
    padding-right: calc(var(--global-spacing) * 2);
    color: var(--codex-primary);
  	font-family: var(--codex-font-title);
    font-weight: 700;
  	line-height: 1.12;
  	letter-spacing: 0;
  	font-size: clamp(38px, 5vw, 40px);
text-transform: initial;
}

.heading-style-08 .heading-title {
    border-bottom: 2px solid var(--codex-secondary) !important;
    padding-bottom: calc(var(--global-spacing) * 1.5);
    text-align: center;
}

.heading-desc {
  margin-top: calc(var(--global-spacing) 8px * 3);
  color: var(--codex-primary);
  font-family: var(--codex-font-title);
  font-weight: 600;
  line-height: 1.12;
  letter-spacing: 0;
  font-size: 2rem;
  margin-bottom: 0px;
}
.main-top .card-body {
    padding: var(--card-spacer-y) var(--card-spacer-x);
    background-color: var(--codex-bg);
    flex: auto;
    margin-top: -38px;
    margin-bottom: 0px;
}

.jacl-row.normal-gutters {
    margin-left: calc(var(--grid-gutter-width) / -2);
    margin-right: calc(var(--grid-gutter-width) / -2);
    margin-top: calc(var(--grid-gutter-width) / 4) !important;
    margin-bottom: calc(var(--grid-gutter-width) / 4) !important;
    border-top: 1px solid rgba(18, 60, 69, 0.18);
}

.cxm427 .jacl-row.normal-gutters {
    border-top: none;
}

h4, .h4 {
    font-size: clamp(21px, 2vw, 20px);
}
/* REVISTA CODEX PAGINA 1 */

.cx-magazine-strip {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
  padding: clamp(32px, 5vw, 58px) 0;
  border-top: 1px solid rgba(18, 60, 69, .16);
  border-bottom: 1px solid rgba(18, 60, 69, .16);
  color: var(--codex-text, #202426);
}

.cx-magazine-kicker {
  margin-bottom: -50px;
  color: var(--codex-primary, #123C45);
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.cx-magazine-header {
  margin-bottom: clamp(22px, 3vw, 34px);
}

.cx-magazine-header h2 {
  max-width: 850px;
  margin: 0;
  color: var(--codex-primary, #123C45);
  font-family: var(--codex-font-title, Georgia, serif);
  font-size: clamp(12px, 2.4vw, 30px); !important
  line-height: 0.05 !important;
}

.cx-magazine-header p {
  margin: 10px 0 0;
  color: var(--codex-muted, #667275);
  font-size: 18px;
  font-weight: 600;
}


.cx-magazine-layout {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr) 310px;
  gap: clamp(22px, 4vw, 42px);
  align-items: stretch;
}

.cx-magazine-issue {
  display: grid;
  align-content: start;
  gap: 18px;
  padding-right: 20px;
  border-right: 1px solid rgba(18, 60, 69, .14);
}

.cx-magazine-issue img {
  width: 112px;
  max-width: 100%;
  border-radius: 3px;
  box-shadow: 0 14px 30px rgba(18, 60, 69, .16);
}

.cx-magazine-links {
  display: grid;
  gap: 10px;
}

.cx-magazine-links a,
.cx-magazine-contents a {
  color: var(--codex-primary, #123C45);
  text-decoration: none;
}

.cx-magazine-links a {
  font-size: 15px;
  font-weight: 700;
}

.cx-magazine-links a::after {
  content: " →";
  color: var(--codex-accent, #D89A2B);
}

.cx-magazine-visual {
  min-height: 330px;
  margin: 0;
  overflow: hidden;
  /*background: rgba(143, 175, 155, .14);*/
  border-radius: 4px;
}

.cx-magazine-visual img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 330px;
  object-fit: cover;
}

.cx-magazine-contents {
  padding-left: 20px;
  border-left: 1px solid rgba(18, 60, 69, .14);
}

.cx-magazine-contents {
  color: var(--codex-primary, #123C45);
  font-family: var(--codex-font-title, Georgia, serif);
  font-size: clamp(28px, 2.6vw, 38px);
  line-height: 1.05;
  font-weight: 700;
}

.cx-magazine-contents-title {
  display: block;
  margin-bottom: 18px;
  padding-bottom: 12px;
  border-bottom: 5px solid rgba(18, 60, 69, .18);

  color: var(--codex-primary, #123C45);
  font-family: var(--codex-font-title, Georgia, serif);
  font-size: clamp(28px, 2.6vw, 30px);
  line-height: 1.05;
  font-weight: 700;
}

.cx-magazine-contents ol {
  display: grid;
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.cx-magazine-contents li {
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(18, 60, 69, .12);
}

.cx-magazine-contents a {
  font-family: var(--codex-font-title, Georgia, serif);
  font-size: clamp(21px, 2vw, 20px);
  font-weight: 500;
  line-height: 1.12; !important
}

.cx-magazine-links a:hover,
.cx-magazine-contents a:hover {
  color: var(--codex-accent-hover, #B77D1F);
}

@media (max-width: 900px) {
  .cx-magazine-layout {
    grid-template-columns: 1fr;
  }

  .cx-magazine-issue,
  .cx-magazine-contents {
    padding: 0;
    border: 0;
  }

  .cx-magazine-issue {
    grid-template-columns: 96px 1fr;
    align-items: end;
  }

  .cx-magazine-visual,
  .cx-magazine-visual img {
    min-height: 240px;
  }
}
/* =========================================================
   ASCUNDE FIELDUL - DE PUS IN MENU
   ========================================================= */

   
body.itemid-2398 .fields-container li,
body.itemid-2398 .field-entry {
  display: none !important;
}

body.ascunde-field .fields-container,
body.ascunde-field .fields-container li,
body.ascunde-field .field-entry {
  display: none !important;

}

/* =========================================================
  CUPRINS
   ========================================================= */
.cuprins {
  width: min(100%, 940px);
  margin: 24px auto;
  padding: 18px;
  background: #FFFFFF;
  border: 1px solid rgba(18, 60, 69, .12);
  border-radius: 8px;
  box-shadow: 0 14px 34px rgba(18, 60, 69, .08);
  font-family: var(--codex-font-ui);
}

.cuprins h3 {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 14px;
  padding: 0 0 12px;
  border-bottom: 1px solid rgba(18, 60, 69, .1);
  color: #123C45;
  font-family: var(--codex-font-ui);
  font-size: 19px;
  font-weight: 800;
  line-height: 1.2;
  text-align: left;
}

.cuprins h3::before {
  content: "";
  width: 9px;
  height: 9px;
  flex: 0 0 auto;
  background: #D89A2B;
  border-radius: 999px;
  box-shadow: 0 0 0 4px rgba(216, 154, 43, .18);
}

.cuprins .cuprins-item {
  position: relative;
  display: block;
  min-height: 36px;
  margin: 0 0 4px;
  padding: 8px 42px 8px 10px;
  color: #243235;
  background: #FBFCFB;
  border: 1px solid transparent;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.28;
  text-decoration: none !important;
  transition: background-color .16s ease, border-color .16s ease, color .16s ease;
}

.cuprins .cuprins-item:hover,
.cuprins .cuprins-item:focus,
.cuprins .cuprins-item.active {
  color: #123C45;
  background: #EEF4F1;
  border-color: rgba(18, 60, 69, .12);
}

.cuprins .cuprins-item.level-0 {
  margin-top: 7px;
  color: #123C45;
  background: #F2F6F4;
  border-color: rgba(18, 60, 69, .1);
  font-weight: 800;
  cursor: pointer;
}

.cuprins .cuprins-item.level-1,
.cuprins .cuprins-item.level-2,
.cuprins .cuprins-item.level-3,
.cuprins .cuprins-item.level-4,
.cuprins .cuprins-item.level-5 {
  display: none;
  background: #FFFFFF;
  font-size: 13.5px;
}

.cuprins .cuprins-item.level-1 {
  margin-left: 18px;
}

.cuprins .cuprins-item.level-2 {
  margin-left: 36px;
}

.cuprins .cuprins-item.level-3 {
  margin-left: 54px;
}

.cuprins .cuprins-item.level-4 {
  margin-left: 72px;
}

.cuprins .cuprins-item.level-5 {
  margin-left: 90px;
}

.cuprins .toggle-indicator {
  position: absolute;
  top: 50%;
  right: 10px;
  display: inline-flex;
  width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
  color: #123C45;
  background: rgba(18, 60, 69, .08);
  border-radius: 999px;
  font-size: 16px;
  font-weight: 800;
  line-height: 1;
  transform: translateY(-50%);
}

.cuprins .expanded .toggle-indicator {
  color: #FFFFFF;
  background: #123C45;
}

@media (max-width: 768px) {
  .cuprins {
    width: 100%;
    margin: 18px 0;
    padding: 12px;
  }

  .cuprins .cuprins-item.level-1 {
    margin-left: 10px;
  }

  .cuprins .cuprins-item.level-2 {
    margin-left: 20px;
  }

  .cuprins .cuprins-item.level-3,
  .cuprins .cuprins-item.level-4,
  .cuprins .cuprins-item.level-5 {
    margin-left: 30px;
  }
}


/* =========================================================
   TIPOGRAFIE EDITORIALĂ — ARTICOLE CODEX
   Linkuri, liste, ghilimele, elemente inline, distanțe
   ========================================================= */

:root {
  --codex-link:            #1A6E7D;
  --codex-link-deco:       rgba(26, 110, 125, 0.28);
  --codex-link-hover:      #B77D1F;
  --codex-link-hover-deco: rgba(183, 125, 31, 0.45);
}

/* Dimensiune de baza a textului general */
body {
  font-size: 18px; 
}

/* ----------------------------------------------------------
   LINKURI ÎN CORPUL ARTICOLULUI
   Elegante, distincte față de text, fără ostentație.
   Excludem titluri, carduri, taguri, meniuri, butoane.
   ---------------------------------------------------------- */
body.view-article .com-content-article p a,
body.view-article .item-page p a,
body.view-article .com-content-article li:not(.field-entry):not(.list-inline-item) a:not(.btn):not(.tag),
body.view-article .item-page li:not(.field-entry):not(.list-inline-item) a:not(.btn):not(.tag),
body.view-article .com-content-article td a,
body.view-article .item-page td a {
  color: var(--codex-link);
  text-decoration: underline;
  text-decoration-color: var(--codex-link-deco);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  font-weight: inherit;
  transition: color 0.18s ease, text-decoration-color 0.18s ease;
}

body.view-article .com-content-article p a:hover,
body.view-article .item-page p a:hover,
body.view-article .com-content-article li:not(.field-entry):not(.list-inline-item) a:not(.btn):not(.tag):hover,
body.view-article .item-page li:not(.field-entry):not(.list-inline-item) a:not(.btn):not(.tag):hover,
body.view-article .com-content-article td a:hover,
body.view-article .item-page td a:hover {
  color: var(--codex-link-hover);
  text-decoration-color: var(--codex-link-hover-deco);
}

/* ----------------------------------------------------------
   LISTE ÎN ARTICOLE — BULLETS PERSONALIZATE
   Cercuri cu culoarea secondary (sage green), elegante
   ---------------------------------------------------------- */
body.view-article .com-content-article ul:not([class]):not(.tags):not(.fields-container):not(.cuprins-list),
body.view-article .item-page ul:not([class]):not(.tags):not(.fields-container):not(.cuprins-list) {
  margin: 0 0 0.7em 0;
  padding: 0 0 0 1.8em;
  list-style: none;
}

body.view-article .com-content-article ul:not([class]) > li,
body.view-article .item-page ul:not([class]) > li {
  position: relative;
  padding-left: 1.5em;
  margin-bottom: 0.18em;
  line-height: 1.5;
  font-size: 0.97em;
}

body.view-article .com-content-article ul:not([class]) > li::before,
body.view-article .item-page ul:not([class]) > li::before {
  content: "";
  position: absolute;
  left: 0.1em;
  top: 50%;
  transform: translateY(-50%);
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--codex-accent);
  flex-shrink: 0;
}

/* Sub-liste bullets — fără indentare dublă (a browser-ului + a li-ului), cerc gol */
body.view-article .com-content-article ul:not([class]) ul,
body.view-article .item-page ul:not([class]) ul {
  list-style: none !important;
  padding-left: 0;
  margin-top: 0.4em;
  margin-bottom: 0.2em;
}

body.view-article .com-content-article ul:not([class]) ul > li::before,
body.view-article .item-page ul:not([class]) ul > li::before {
  width: 5px;
  height: 5px;
  background: transparent;
  border: 1.5px solid var(--codex-accent);
}

/* Nivel 3+ — cerc gol, mai mic, pentru diferențiere suplimentară la indentări succesive */
body.view-article .com-content-article ul:not([class]) ul ul > li::before,
body.view-article .item-page ul:not([class]) ul ul > li::before {
  width: 4px;
  height: 4px;
}

/* ----------------------------------------------------------
   LISTE NUMEROTATE — cifre cu cerc primary
   ---------------------------------------------------------- */
body.view-article .com-content-article ol:not([class]),
body.view-article .item-page ol:not([class]) {
  margin: 0 0 0.7em 0;
  padding: 0 0 0 1.8em;
  list-style: none;
  counter-reset: codex-ol;
}

body.view-article .com-content-article ol:not([class]) > li,
body.view-article .item-page ol:not([class]) > li {
  position: relative;
  padding-left: 2.2em;
  margin-bottom: 0.2em;
  counter-increment: codex-ol;
  line-height: 1.5;
  font-size: 0.97em;
}

body.view-article .com-content-article ol:not([class]) > li::before,
body.view-article .item-page ol:not([class]) > li::before {
  content: counter(codex-ol);
  position: absolute;
  left: 0;
  top: 0.12em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.55em;
  height: 1.55em;
  border-radius: 50%;
  background: var(--codex-primary);
  color: var(--codex-white);
  font-size: 0.72em;
  font-weight: 700;
  line-height: 1;
  font-family: var(--codex-font-ui);
}

/* Sub-liste numerotate */
body.view-article .com-content-article ol:not([class]) ol,
body.view-article .item-page ol:not([class]) ol {
  list-style: none !important;
  counter-reset: codex-ol-2;
  margin-top: 0.4em;
  margin-bottom: 0;
}

body.view-article .com-content-article ol:not([class]) ol > li,
body.view-article .item-page ol:not([class]) ol > li {
  counter-increment: codex-ol-2;
}

body.view-article .com-content-article ol:not([class]) ol > li::before,
body.view-article .item-page ol:not([class]) ol > li::before {
  content: counter(codex-ol-2, lower-alpha);
  background: rgba(18, 60, 69, 0.12);
  color: var(--codex-primary);
}

/* ----------------------------------------------------------
   GHILIMELE — q inline și blockquote
   ---------------------------------------------------------- */

/* Ghilimele inline — q element */
body.view-article .com-content-article q,
body.view-article .item-page q {
  quotes: "\201E" "\201D" "\2039" "\203A";
  font-style: italic;
  color: var(--codex-primary); 
}

body.view-article .com-content-article q::before,
body.view-article .item-page q::before {
  content: open-quote;
  color: var(--codex-accent);
  font-style: normal;
  font-weight: 700;
  margin-right: 0.05em;
}

body.view-article .com-content-article q::after,
body.view-article .item-page q::after {
  content: close-quote;
  color: var(--codex-accent);
  font-style: normal;
  font-weight: 700;
  margin-left: 0.05em;
}

/* ----------------------------------------------------------
   BLOCKQUOTE în articole — definiție unică și completă
   ---------------------------------------------------------- */
body.view-article blockquote,
body.view-article .com-content-article blockquote {
  position: relative;
  margin: clamp(28px, 4vw, 48px) 0;
  padding: clamp(72px, 8vw, 92px) clamp(24px, 3vw, 38px) clamp(20px, 2.5vw, 30px);
  color: var(--codex-primary, #123C45);
  background: rgba(216, 154, 43, 0.07);
  border-left: 3px solid var(--codex-accent, #D89A2B);
  border-radius: 0 8px 8px 0;
  font-family: var(--codex-font-title, "Source Serif 4", Georgia, serif);
  font-size: clamp(17px, 1.6vw, 20px);
  font-style: italic;
  line-height: 1.65;
}

body.view-article blockquote p,
body.view-article .com-content-article blockquote p {
  margin: 0 0 0.6em;
  font-size: inherit;
  font-style: inherit;
  color: inherit;
}

body.view-article blockquote p:last-child,
body.view-article .com-content-article blockquote p:last-child {
  margin-bottom: 0;
}

/* Ghilimea decorativă „ — 220px, aur, în spatele textului */
body.view-article blockquote::before,
body.view-article .com-content-article blockquote::before {
  content: "\201C";
  position: absolute;
  top: -4px;
  left: clamp(18px, 2.5vw, 28px);
  font-family: var(--codex-font-title, "Source Serif 4", Georgia, serif);
  font-size: 220px;
  line-height: 1;
  color: var(--codex-accent, #D89A2B);
  opacity: 0.45;
  font-style: normal;
  pointer-events: none;
  user-select: none;
}

/* ----------------------------------------------------------
   ELEMENTE INLINE — bold, italic, mark, code, abbr
   ---------------------------------------------------------- */

body.view-article .com-content-article strong,
body.view-article .com-content-article b,
body.view-article .item-page strong,
body.view-article .item-page b {
  color: var(--codex-primary);
  font-weight: 700;
}

body.view-article .com-content-article em,
body.view-article .com-content-article i,
body.view-article .item-page em,
body.view-article .item-page i {
  color: inherit;
  font-style: italic;
}

/* Highlight / mark */
body.view-article .com-content-article mark,
body.view-article .item-page mark {
  background: rgba(216, 154, 43, 0.2);
  color: var(--codex-primary);
  padding: 0.08em 0.28em;
  border-radius: 3px;
  font-weight: inherit;
}

/* Cod inline */
body.view-article .com-content-article code:not([class]),
body.view-article .item-page code:not([class]) {
  background: rgba(18, 60, 69, 0.07);
  color: var(--codex-primary);
  padding: 0.15em 0.42em;
  border-radius: 4px;
  font-size: 0.86em;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  border: 1px solid rgba(18, 60, 69, 0.11);
}

/* Cod bloc */
body.view-article .com-content-article pre,
body.view-article .item-page pre {
  margin: clamp(16px, 2.5vw, 28px) 0;
  padding: clamp(14px, 2vw, 22px);
  background: rgba(18, 60, 69, 0.04);
  border: 1px solid rgba(18, 60, 69, 0.10);
  border-left: 3px solid var(--codex-secondary);
  border-radius: 6px;
  overflow-x: auto;
  font-size: 0.88em;
  line-height: 1.65;
}

/* Abrevieri */
body.view-article .com-content-article abbr[title],
body.view-article .item-page abbr[title] {
  text-decoration: underline dotted;
  text-decoration-color: var(--codex-secondary);
  text-underline-offset: 2px;
  cursor: help;
}

/* Superscript / Subscript */
body.view-article .com-content-article sup,
body.view-article .com-content-article sub,
body.view-article .item-page sup,
body.view-article .item-page sub {
  font-size: 0.72em;
  color: var(--codex-muted);
  line-height: 0;
}

/* Separator orizontal */
body.view-article .com-content-article hr,
body.view-article .item-page hr {
  margin: clamp(32px, 5vw, 52px) 0;
  border: 0;
  border-top: 1px solid rgba(143, 175, 155, 0.40);
}


/* ----------------------------------------------------------
   TABEL ÎN ARTICOLE
   Responsive: JS din template înfășoară fiecare <table> în
   <div class="cx-table-wrap"> — stilizarea e pe wrapper + table
   ---------------------------------------------------------- */

.cx-table-wrap {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: clamp(20px, 3vw, 36px) 0;
  border-radius: 6px;
}

.cx-table-wrap table,
.item-page table,
body.view-article .com-content-article table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--codex-font-ui, "Source Sans 3", sans-serif);
  font-size: 15px;
  line-height: 1.5;
  background: #fff;
  margin: 0;
}

/* Toate celulele <th> — fundal deschis derivat din culoarea primară, text închis */
.cx-table-wrap th,
.item-page th,
body.view-article .com-content-article th {
  padding: 11px 15px;
  background: rgba(18, 60, 69, 0.08);
  color: var(--codex-primary, #123C45);
  font-weight: 700;
  text-align: left;
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-bottom: 2px solid rgba(18, 60, 69, 0.18);
  border-top: none;
  border-left: none;
  border-right: none;
}

/* Celule date */
.cx-table-wrap td,
.item-page td,
body.view-article .com-content-article td {
  padding: 10px 15px;
  border-bottom: 1px solid rgba(18, 60, 69, 0.09);
  border-top: none;
  border-left: none;
  border-right: none;
  color: var(--codex-text, #202426);
  vertical-align: top;
}

/* Ultimul rând fără border-bottom */
.cx-table-wrap tbody tr:last-child td,
.item-page tbody tr:last-child td,
body.view-article .com-content-article tbody tr:last-child td {
  border-bottom: none;
}

/* Zebra striping pe td (th-urile au deja fundal petrol) */
.cx-table-wrap tr:nth-child(even) td,
.item-page tr:nth-child(even) td,
body.view-article .com-content-article tr:nth-child(even) td {
  background: rgba(143, 175, 155, 0.06);
}

/* Hover rând */
.cx-table-wrap tr:hover td,
.item-page tr:hover td,
body.view-article .com-content-article tr:hover td {
  background: rgba(143, 175, 155, 0.13);
}

/* ----------------------------------------------------------
   BREADCRUMB — fara underline, discret
   ---------------------------------------------------------- */
.breadcrumb-item a,
nav[aria-label="breadcrumb"] a {
  text-decoration: none;
  color: var(--codex-muted);
  transition: color 0.18s ease;
}

.breadcrumb-item a:hover,
nav[aria-label="breadcrumb"] a:hover {
  color: var(--codex-primary);
  text-decoration: none;
}



/* =========================================================
   GLOSAR PUBLIC — CAMP CAUTARE
   ========================================================= */

.codex-glossary-search {
  display: grid;
  gap: 6px;
}

.codex-glossary-search__inner {
  position: relative;
  display: flex;
  align-items: center;
}

.codex-glossary-search__icon {
  position: absolute;
  left: 14px;
  color: #6A7978;
  pointer-events: none;
}

.codex-glossary-search__input {
  width: 100%;
  padding: 11px 14px 11px 42px;
  border: 1px solid rgba(0, 0, 0, .18);
  border-radius: 10px;
  font-family: inherit;
  font-size: 14px;
  line-height: 1.4;
  transition: border-color .16s, box-shadow .16s;
  -webkit-appearance: none;
  appearance: none;
}

.codex-glossary-search__input::placeholder {
  color: #999;
}

.codex-glossary-search__input:focus {
  outline: none;
  border-color: var(--codex-primary, #123C45);
  box-shadow: 0 0 0 3px rgba(18, 60, 69, .10);
}

.codex-glossary-search__hint {
  margin: 0;
  color: #6A7978;
  font-size: 12px;
  min-height: 1.4em;
}

/* =========================================================
   MOD_RELATED_ITEMS — Articole similare după tag
   ========================================================= */

.cx-related {
  margin-top: 2.5rem;
  padding-top: 2rem;
  border-top: 1px solid rgba(18, 60, 69, .1);
}

.cx-related__heading {
  font-family: var(--codex-font-title, "Source Serif 4", Georgia, serif);
  font-size: clamp(18px, 1.6vw, 22px);
  font-weight: 700;
  color: var(--codex-primary, #123C45);
  margin: 0 0 1.25rem;
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.cx-related__heading::before {
  content: '';
  display: inline-block;
  width: 4px;
  height: 1.1em;
  background: var(--codex-accent, #D89A2B);
  border-radius: 2px;
  flex-shrink: 0;
}

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

.cx-related__card {
  display: flex;
  flex-direction: column;
  background: #FFFFFF;
  border: 1px solid rgba(18, 60, 69, .13);
  border-radius: 10px;
  overflow: hidden;
  text-decoration: none !important;
  color: inherit !important;
  box-shadow: 0 2px 8px rgba(18, 60, 69, .06);
  transition: box-shadow 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
}

.cx-related__card:hover {
  box-shadow: 0 8px 24px rgba(18, 60, 69, .13);
  transform: translateY(-2px);
  border-color: rgba(216, 154, 43, .4);
  text-decoration: none !important;
  color: inherit !important;
}

.cx-related__card * {
  text-decoration: none !important;
}

.cx-related__img-wrap {
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  flex-shrink: 0;
}

.cx-related__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.3s ease;
}

.cx-related__card:hover .cx-related__img {
  transform: scale(1.04);
}

/* Fallback: logo Codex centrat pe fond crem */
.cx-related__img-wrap--logo {
  background: var(--codex-bg, #F7F3EA);
  display: flex;
  align-items: center;
  justify-content: center;
}

.cx-related__img-wrap--logo .cx-related__img {
  width: 50%;
  height: auto;
  object-fit: contain;
  opacity: 0.55;
  transition: opacity 0.2s ease;
}

.cx-related__card:hover .cx-related__img-wrap--logo .cx-related__img {
  opacity: 0.75;
  transform: none;
}

.cx-related__body {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0.9rem 1rem 0.85rem;
  flex: 1;
}

.cx-related__cat {
  font-family: var(--codex-font-ui, "Source Sans 3", sans-serif);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--codex-accent, #D89A2B);
  line-height: 1;
}

.cx-related__title {
  font-family: var(--codex-font-title, "Source Serif 4", Georgia, serif);
  font-size: clamp(14px, 1.1vw, 16px);
  font-weight: 700;
  color: var(--codex-primary, #123C45);
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.cx-related__card:hover .cx-related__title {
  color: var(--codex-accent, #D89A2B);
}

.cx-related__intro {
  font-family: var(--codex-font-ui, "Source Sans 3", sans-serif);
  font-size: 13px;
  color: var(--codex-muted, #667275);
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.cx-related__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: auto;
  padding-top: 0.5rem;
}

.cx-related__date {
  font-family: var(--codex-font-ui, "Source Sans 3", sans-serif);
  font-size: 11px;
  color: var(--codex-muted2, #B8C8C3);
}

.cx-related__cta {
  font-family: var(--codex-font-ui, "Source Sans 3", sans-serif);
  font-size: 12px;
  font-weight: 700;
  color: var(--codex-accent, #D89A2B);
  display: flex;
  align-items: center;
  gap: 3px;
  transition: gap 0.18s ease;
}

.cx-related__card:hover .cx-related__cta {
  gap: 6px;
}

/* =========================================================
   CLASE CONȚINUT ARTICOLE — cx-* (înlocuiesc xtypo_*)
   ========================================================= */

/* ── Intro text articol (lead/sumar) ── */
.cx-article-intro,
p.article-intro {
  font-family: var(--codex-font-title, "Source Serif 4", Georgia, serif);
  font-size: clamp(1.05rem, 1.4vw, 1.2rem);
  line-height: 1.65;
  color: var(--codex-primary, #123C45);
  font-style: italic;
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid rgba(18, 60, 69, .1);
  font-weight: 400;
}
.cx-article-intro > *:last-child,
p.article-intro:last-child {
  margin-bottom: 0;
}
.cx-article-intro strong,
.cx-article-intro b,
p.article-intro strong {
  font-weight: 700;
  font-style: normal;
}

/* ── Linkuri în articole ── */
.item-page .article-fulltext a:not(.cx-download):not([class*="btn"]):not([class*="cx-"]) {
  color: var(--codex-primary, #123C45);
  text-decoration: underline;
  text-decoration-color: rgba(216, 154, 43, .4);
  text-underline-offset: 3px;
  transition: color .15s ease, text-decoration-color .15s ease;
}
.item-page .article-fulltext a:not(.cx-download):not([class*="btn"]):not([class*="cx-"]):hover {
  color: var(--codex-accent, #D89A2B);
  text-decoration-color: var(--codex-accent, #D89A2B);
}

/* ── Link descărcare (edocman) ── */
.cx-download {
  display: inline-flex;
  align-items: center;
  gap: 0.4em;
  background: var(--codex-accent, #D89A2B);
  color: #FFFFFF !important;
  padding: 0.4em 0.9em 0.4em 0.75em;
  border-radius: 7px;
  font-family: var(--codex-font-ui, "Source Sans 3", sans-serif);
  font-weight: 700;
  font-size: 0.875em;
  text-decoration: none !important;
  transition: background .18s ease, box-shadow .18s ease;
  box-shadow: 0 2px 8px rgba(216, 154, 43, .25);
  vertical-align: middle;
}
.cx-download::before {
  content: '';
  display: inline-block;
  width: 1em;
  height: 1em;
  flex-shrink: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpolyline points='7 10 12 15 17 10'/%3E%3Cline x1='12' y1='15' x2='12' y2='3'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
}
.cx-download:hover {
  background: var(--codex-accent-hover, #B77D1F);
  color: #FFFFFF !important;
  box-shadow: 0 4px 14px rgba(216, 154, 43, .35);
}

/* ── Avertisment (xtypo_warning) ── */
.cx-warning {
  background: #FFF8E6;
  border-left: 4px solid var(--codex-accent, #D89A2B);
  padding: 1rem 1.25rem;
  border-radius: 0 8px 8px 0;
  margin: 1.5rem 0;
  color: var(--codex-text, #202426);
}
.cx-warning > *:last-child { margin-bottom: 0; }

/* ── Info (xtypo_info) ── */
.cx-info {
  background: rgba(18, 60, 69, .05);
  border-left: 4px solid var(--codex-primary, #123C45);
  padding: 1rem 1.25rem;
  border-radius: 0 8px 8px 0;
  margin: 1.5rem 0;
  color: var(--codex-text, #202426);
}
.cx-info > *:last-child { margin-bottom: 0; }

/* ── Notă / sticky (xtypo_sticky, xtypo_note) ── */
.cx-note {
  background: #F5F5F0;
  border: 1px solid rgba(18, 60, 69, .12);
  border-left: 4px solid var(--codex-secondary, #8FAF9B);
  padding: 1rem 1.25rem;
  border-radius: 0 8px 8px 0;
  margin: 1.5rem 0;
  font-style: italic;
  color: var(--codex-text, #202426);
}
.cx-note > *:last-child { margin-bottom: 0; }

/* .cx-quote eliminat — blockquote stilizat direct, clase au fost șterse din articole */

/* ── Cutie rotunjită (xtypo_rounded1/2) ── */
.cx-box {
  background: #FFFFFF;
  border: 1px solid rgba(18, 60, 69, .12);
  border-radius: 10px;
  padding: 1.25rem 1.5rem;
  margin: 1.5rem 0;
  box-shadow: 0 2px 8px rgba(18, 60, 69, .06);
}
.cx-box > *:last-child { margin-bottom: 0; }

/* ── Cutie dreapta float (xtypo_rounded2_right) ── */
.cx-box-right {
  float: right;
  margin: 0 0 1rem 1.5rem;
  max-width: 220px;
  background: #FFFFFF;
  border: 1px solid rgba(18, 60, 69, .12);
  border-radius: 10px;
  padding: 1rem;
  box-shadow: 0 2px 8px rgba(18, 60, 69, .06);
}
.cx-box-right img {
  width: 100%;
  height: auto;
  display: block;
}
@media (max-width: 600px) {
  .cx-box-right {
    float: none;
    margin: 1rem 0;
    max-width: 100%;
  }
}

/* ── Drop cap (xtypo_dropcap) ── */
.cx-dropcap {
  float: left;
  font-family: var(--codex-font-title, "Source Serif 4", Georgia, serif);
  font-size: 3.5em;
  line-height: 0.78;
  padding: 0 0.1em 0 0;
  margin-top: 0.06em;
  color: var(--codex-primary, #123C45);
  font-weight: 700;
}

/* ── Tabel responsive wrapper pentru module custom ── */
.cx-table-wrap {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: clamp(20px, 3vw, 36px) 0;
}
.cx-table-wrap table {
  min-width: 100%;
  border-collapse: collapse;
  font-family: var(--codex-font-ui, "Source Sans 3", sans-serif);
  font-size: 15px;
  background: #fff;
  margin: 0;
}
.cx-table-wrap thead th {
  padding: 11px 15px;
  background: var(--codex-primary, #123C45);
  color: #fff;
  font-weight: 700;
  text-align: left;
  font-size: 12.5px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  border: none;
  white-space: nowrap;
}
.cx-table-wrap td,
.cx-table-wrap tbody th {
  padding: 10px 15px;
  border-bottom: 1px solid rgba(18, 60, 69, 0.09);
  border-top: none;
  border-left: none;
  border-right: none;
  color: var(--codex-text, #202426);
  vertical-align: top;
}
.cx-table-wrap tbody tr:last-child td { border-bottom: none; }
.cx-table-wrap tr:nth-child(even) td  { background: rgba(143, 175, 155, 0.06); }
.cx-table-wrap tr:hover td            { background: rgba(143, 175, 155, 0.12); }

/* ── Card autor (xtypo_rounded2 în snippets de autor) ── */
.cx-autor {
  background: var(--codex-bg, #F7F3EA);
  border: 1px solid rgba(18, 60, 69, .1);
  border-radius: 12px;
  padding: 1.5rem;
  margin: 2.5rem 0 1rem;
}
.cx-autor h3 {
  font-family: var(--codex-font-title, "Source Serif 4", Georgia, serif);
  font-size: 1rem;
  color: var(--codex-muted, #667275);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0 0 1rem;
}
.cx-autor .author-container {
  display: flex;
  gap: 1.25rem;
  align-items: flex-start;
}
.cx-autor .author-container img {
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 50%;
  flex-shrink: 0;
  border: 2px solid rgba(18, 60, 69, .12);
}
.cx-autor .author-details {
  flex: 1;
  min-width: 0;
}
.cx-autor .author-details strong,
.cx-autor .author-details b {
  display: block;
  font-family: var(--codex-font-title, "Source Serif 4", Georgia, serif);
  font-size: 1.05rem;
  color: var(--codex-primary, #123C45);
  margin-bottom: 0.25rem;
}
.cx-autor .author-details p {
  font-size: 0.88em;
  color: var(--codex-muted, #667275);
  margin: 0;
  line-height: 1.5;
}
@media (max-width: 500px) {
  .cx-autor .author-container {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
}

/* ── Grid layout (xtypo-grid) ── */
.cx-grid {
  display: flex;
  gap: 1.5rem;
  align-items: flex-start;
  margin: 1.5rem 0;
  flex-wrap: wrap;
}
.cx-col { flex: 1 1 200px; min-width: 0; }
.cx-col--30 { flex: 0 0 28%; max-width: 28%; }
.cx-col--50 { flex: 0 0 48%; max-width: 48%; }
.cx-col--70 { flex: 0 0 68%; max-width: 68%; }
@media (max-width: 700px) {
  .cx-grid { flex-direction: column; }
  .cx-col--30,
  .cx-col--50,
  .cx-col--70 { flex: 1 1 100%; max-width: 100%; }
}

/* ═══════════════════════════════════════════════════════
   cx-disclaimer — Snippet: Disclaimer + Drept utilizare
   ═══════════════════════════════════════════════════════ */
.cx-disclaimer {
  margin-top: 3rem;
  border-top: 2px solid rgba(18,60,69,.08);
  padding-top: 1.5rem;
}

/* Notice box (procedure usage note) */
.cx-disclaimer__notice {
  display: flex;
  gap: 0.85rem;
  align-items: flex-start;
  background: rgba(216,154,43,.07);
  border: 1px solid rgba(216,154,43,.28);
  border-left: 3px solid var(--codex-accent, #D89A2B);
  border-radius: 6px;
  padding: 1rem 1.2rem;
  margin-bottom: 0.75rem;
}
.cx-disclaimer__notice-icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  color: var(--codex-accent, #D89A2B);
  margin-top: 2px;
}
.cx-disclaimer__notice-title {
  display: block;
  font-family: var(--codex-font-ui, "Source Sans 3", sans-serif);
  font-size: 0.8rem;
  font-weight: 700;
  color: #7a6000;
  margin-bottom: 0.35rem;
}
.cx-disclaimer__notice-body p {
  font-size: 0.77rem !important;
  line-height: 1.6 !important;
  color: #6b6040 !important;
  margin: 0 0 0.4em !important;
  font-style: normal !important;
}
.cx-disclaimer__notice-body p:last-child { margin-bottom: 0 !important; }
.cx-disclaimer__notice-links {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 0.5rem;
}
.cx-disclaimer__link {
  font-size: 0.77rem !important;
  color: var(--codex-accent, #D89A2B) !important;
  text-decoration: underline !important;
}

/* Footer block (usage rights + copyright) */
.cx-disclaimer__footer {
  background: #FFFFFF;
  border: 1px solid rgba(18,60,69,.1);
  border-radius: 6px;
  overflow: hidden;
}
.cx-disclaimer__usage { display: none; } /* user fields not applicable in visitor zone */
.cx-disclaimer__copyright {
  padding: 0.85rem 1.2rem;
  line-height: 1.6;
}
.cx-disclaimer__copyright strong {
  display: block;
  font-size: 0.71rem;
  letter-spacing: 0.02em;
  color: #909899;
  margin-bottom: 0.3rem;
}
.cx-disclaimer__copyright p {
  margin: 0 !important;
  font-size: 0.72rem !important;
  line-height: 1.58 !important;
  color: #b0b8ba !important;
  font-style: italic !important;
}

/* ============================================================
   CX CARDS — sistem de carduri cu link (visitor zone)
   ============================================================ */

.cx-cards-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--codex-font-ui);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--codex-accent);
  border: 1px solid var(--codex-accent);
  border-radius: 999px;
  padding: 4px 14px;
  margin-bottom: 1rem;
}
.cx-cards-label::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--codex-accent);
}

.cx-cards-title {
  font-family: var(--codex-font-title);
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 400;
  color: var(--codex-primary);
  margin: 0 0 1.75rem;
}

.cx-grid {
  display: grid;
  gap: 16px;
}
.cx-grid--4 {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}
.cx-grid--3 {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.cx-grid--2 {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.cx-card-link {
  text-decoration: none;
  color: inherit;
  display: block;
}

.cx-card {
  background: var(--codex-white);
  border: 1px solid #e2ebe7;
  border-radius: 12px;
  padding: 20px;
  height: 100%;
  box-sizing: border-box;
  transition: border-color .2s, transform .2s;
}
.cx-card-link:hover .cx-card {
  border-color: var(--codex-accent);
  transform: translateY(-2px);
}

.cx-card__img {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  object-fit: cover;
  margin-bottom: 14px;
  display: block;
}

.cx-card__icon-wrap {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  background: rgba(18, 60, 69, .08);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
}
.cx-card__icon-wrap i,
body.view-article .com-content-article .cx-card__icon-wrap i,
body.view-article .item-page .cx-card__icon-wrap i {
  font-size: 26px;
  color: var(--codex-primary);
  font-style: normal !important;
}
.cx-card__icon-wrap img {
  width: 32px;
  height: 32px;
  object-fit: contain;
}

.cx-card__title,
body.view-article .item-page .cx-card__title,
body.view-article .com-content-article .cx-card__title {
  font-family: var(--codex-font-ui) !important;
  font-size: 20px !important;
  font-weight: 900 !important;
  color: var(--codex-primary) !important;
  font-style: normal !important;
  margin: 0 0 7px !important;
  line-height: 1.3 !important;
  letter-spacing: 0.1px;
}

.cx-card__desc,
body.view-article .item-page .cx-card__desc,
body.view-article .com-content-article .cx-card__desc {
  font-family: var(--codex-font-ui) !important;
  font-size: 18px !important;
  font-weight: 200 !important;
  font-style: normal !important;
  color: var(--codex-muted) !important;
  margin: 0 !important;
  line-height: 1.4 !important;
}

.cx-card__arrow {
  display: inline-block;
  margin-top: 12px;
  font-size: 18px;
  color: var(--codex-accent);
  transition: transform .2s;
}
.cx-card-link:hover .cx-card__arrow {
  transform: translateX(4px);
}

@media (max-width: 600px) {
  /* Un card pe rând, full-width — elegant și lizibil */
  .cx-grid--4,
  .cx-grid--3,
  .cx-grid--2 {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .cx-card {
    padding: 18px 20px;
  }
  .cx-card__icon-wrap {
    width: 48px;
    height: 48px;
    margin-bottom: 12px;
  }
  .cx-card__icon-wrap i { font-size: 22px !important; }
  .cx-card__icon-wrap img { width: 28px; height: 28px; }
  .cx-card__img {
    width: 48px;
    height: 48px;
    margin-bottom: 12px;
  }
  .cx-card__title,
  body.view-article .item-page .cx-card__title,
  body.view-article .com-content-article .cx-card__title {
    font-size: 17px !important;
    margin: 0 0 5px !important;
  }
  .cx-card__desc,
  body.view-article .item-page .cx-card__desc,
  body.view-article .com-content-article .cx-card__desc {
    font-size: 14px !important;
    line-height: 1.45 !important;
  }
  .cx-card__arrow { font-size: 16px; margin-top: 10px; }
}

/* CX CARDS — chrome wrapper, centrat, breakout */

.cx-module-cards {
  width: 100%;
  padding: 2.5rem 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

.cx-cards-label {
  display: block;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  width: fit-content;
  font-size: 11px;
}

.cx-cards-title {
  text-align: center;
}

/* Breakout din articol — lățime completă */
.cx-cards-bleed {
  position: relative;
  left: 50%;
  right: 50%;
  width: 100vw;
  margin-left: -50vw;
  margin-right: -50vw;
  padding-left: clamp(16px, 4vw, 60px);
  padding-right: clamp(16px, 4vw, 60px);
  box-sizing: border-box;
}

/* Breakout limitat la max-width site (nu merge din colț în colț pe ecrane mari) */
.cx-cards-contained {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;
  max-width: var(--codex-content-max, 1180px);
  padding-left: clamp(16px, 4vw, 48px);
  padding-right: clamp(16px, 4vw, 48px);
  box-sizing: border-box;
}

/* ============================================================
   CX LEGISLATIE — layout Listă documente legislative
   ============================================================ */

.cx-lege-page {
  max-width: 860px;
  margin: 0 auto;
}

.cx-lege-header {
  margin-bottom: 2rem;
}

.cx-lege-title {
  font-family: var(--codex-font-title);
  font-size: clamp(24px, 3vw, 34px);
  font-weight: 400;
  color: var(--codex-primary);
  margin: 0 0 .5rem;
}

.cx-lege-desc {
  font-family: var(--codex-font-ui);
  font-size: 15px;
  color: var(--codex-muted);
  margin: 0;
}

.cx-lege-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.cx-lege-item {
  border-bottom: 1px solid rgba(18, 60, 69, .1);
}
.cx-lege-item:first-child {
  border-top: 1px solid rgba(18, 60, 69, .1);
}

.cx-lege-link {
  display: flex;
  align-items: baseline;
  gap: .6em;
  padding: .9rem .25rem;
  text-decoration: none;
  color: var(--codex-primary);
  font-family: var(--codex-font-ui);
  font-size: clamp(16px, 1.6vw, 20px);
  font-weight: 400;
  line-height: 1.4;
  transition: color .15s, padding-left .15s;
}
.cx-lege-link:hover {
  color: var(--codex-accent);
  padding-left: .5rem;
}

.cx-lege-icon {
  font-size: 1em;
  flex-shrink: 0;
  color: var(--codex-accent);
  font-style: normal !important;
  opacity: .75;
  position: relative;
  top: .05em;
}

.cx-lege-text {
  flex: 1;
}

.cx-lege-item--hidden {
  display: none;
}

.cx-lege-more-wrap {
  text-align: center;
  margin: 1.75rem 0 1rem;
}

.cx-lege-more-btn {
  display: inline-flex;
  align-items: center;
  gap: .5em;
  background: transparent;
  border: 1.5px solid var(--codex-primary);
  border-radius: 999px;
  color: var(--codex-primary);
  font-family: var(--codex-font-ui);
  font-size: 14px;
  font-weight: 600;
  padding: .55rem 1.6rem;
  cursor: pointer;
  transition: background .18s, color .18s, border-color .18s;
}
.cx-lege-more-btn:hover {
  background: var(--codex-primary);
  color: var(--codex-white);
  border-color: var(--codex-primary);
}
.cx-lege-more-btn i {
  font-style: normal;
  font-size: .85em;
}

.cx-lege-counter {
  font-weight: 400;
  opacity: .65;
  font-size: .9em;
}

.cx-lege-empty {
  font-family: var(--codex-font-ui);
  color: var(--codex-muted);
  font-size: 15px;
}

.cx-lege-pagination {
  margin-top: 2rem;
}

.cx-lege-count {
  font-family: var(--codex-font-ui);
  font-size: 13px;
  color: var(--codex-muted);
  margin: .25rem 0 0;
}

/* ── Badge nivel de acces necesar ──────────────────────────────────── */
.codex-access-badge {
  display: inline-block;
  margin: .5rem 0 .35rem;
  padding: .3em 0.85em;
  border-radius: 2rem;
  background: color-mix(in srgb, var(--codex-badge-color) 14%, #fff);
  color: var(--codex-badge-color) !important;
  border: 1px solid color-mix(in srgb, var(--codex-badge-color) 45%, transparent);
  font-family: var(--codex-font-ui, "Source Sans 3", sans-serif);
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .01em;
  line-height: 1.4;
  text-decoration: none !important;
  cursor: pointer;
  transition: background .15s ease, transform .15s ease;
}

.codex-access-badge:hover,
.codex-access-badge:focus-visible {
  background: color-mix(in srgb, var(--codex-badge-color) 26%, #fff);
  transform: translateY(-1px);
}

/* ── Read More button ──────────────────────────────────────────────── */
.codex-readmore {
  display: inline-flex;
  align-items: center;
  gap: .45em;
  margin-top: .85rem;
  padding: .42em 1.15em;
  background: var(--codex-primary);
  color: #fff !important;
  border-radius: 2rem;
  font-family: var(--codex-font-ui, "Source Sans 3", sans-serif);
  font-size: .82rem;
  font-weight: 600;
  letter-spacing: .02em;
  text-decoration: none !important;
  transition: background .2s ease, gap .15s ease;
}
.codex-readmore:hover {
  background: var(--codex-accent);
  gap: .65em;
}
.codex-readmore i {
  font-style: normal !important;
  font-size: .78em;
  transition: transform .15s ease;
}
.codex-readmore:hover i {
  transform: translateX(3px);
}

/* ── Google Follow Source button ───────────────────────────────────── */
.cx-google-follow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 20px 10px 14px;
  border: 1.5px solid #dadce0;
  border-radius: 8px;
  background: #fff;
  color: #3c4043;
  font-family: var(--codex-font-ui, "Source Sans 3", sans-serif);
  font-size: 14px;
  font-weight: 500;
  text-decoration: none !important;
  line-height: 1;
  transition: box-shadow .18s ease, border-color .18s ease;
  cursor: pointer;
  white-space: nowrap;
  margin-left: auto;
  flex-shrink: 0;
}
.cx-google-follow:hover {
  border-color: #bdc1c6;
  box-shadow: 0 2px 8px rgba(0,0,0,.12);
  color: #3c4043;
  text-decoration: none !important;
}
.cx-google-follow__logo {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

/* ── Mega Menu Cards (cx-mcard) ────────────────────────────────────── */
.cx-mcard {
  display: flex;
  position: relative;
  background: #fff;
  border: 1px solid rgba(18,60,69,.12);
  border-radius: 12px;
  overflow: hidden;
  font-family: var(--codex-font-ui, "Source Sans 3", sans-serif);
  transition: box-shadow .2s ease, transform .15s ease;
  color: inherit;
  text-decoration: none !important;
}
.cx-mcard:hover,
.cx-mcard:has(.cx-mcard__overlay:hover) {
  box-shadow: 0 4px 16px rgba(18,60,69,.16);
  border-color: rgba(18,60,69,.25);
}
.cx-mcard__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  border-radius: inherit;
}
.cx-mcard > p { margin: 0; display: contents; }
.cx-mcard__img {
  object-fit: cover;
  display: block;
  background: var(--codex-bg, #F7F3EA);
  flex-shrink: 0;
}
.cx-mcard__title {
  font-family: var(--codex-font-title, "Source Serif 4", serif);
  font-size: 16px;
  font-weight: 700;
  color: var(--codex-primary, #123C45);
  margin: 0 0 6px;
  line-height: 1.25;
}
.cx-mcard__desc {
  font-size: 13px;
  color: var(--codex-muted, #667275);
  margin: 0;
  line-height: 1.5;
}
/* Tip 1 — Orizontal: imagine stânga, text dreapta */
.cx-mcard--h {
  flex-direction: row;
  align-items: center;
}
.cx-mcard--h .cx-mcard__img {
  width: 72px;
  min-width: 72px;
  height: 72px;
  border-radius: 8px;
  margin: 10px;
}
.cx-mcard--h .cx-mcard__body {
  padding: 10px 14px 10px 4px;
  flex: 1;
  min-width: 0;
}

/* Tip 2 — Vertical compact: imagine top-stânga, text jos */
.cx-mcard--v {
  flex-direction: column;
  padding: 14px;
  gap: 10px;
}
.cx-mcard--v .cx-mcard__img {
  width: 65%;
  max-width: 140px;
  aspect-ratio: 1 / 1;
  border-radius: 10px;
}
.cx-mcard--v .cx-mcard__body {}

/* Tip 3 — Vertical featured: imagine full-width sus, text jos centrat */
.cx-mcard--vf {
  flex-direction: column;
}
.cx-mcard--vf .cx-mcard__img {
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: 0;
}
.cx-mcard--vf .cx-mcard__body {
  padding: 14px 16px;
  text-align: center;
}
.cx-mcard--vf .cx-mcard__title {
  font-size: 15px;
}

/* ── Module liste mega meniu (cx-mlist) ─────────────────────────── */
.cx-mlist__header {
  font-family: var(--codex-font-title, "Source Serif 4", serif);
  font-size: 13px;
  font-weight: 700;
  color: var(--codex-primary, #123C45);
  text-transform: uppercase;
  letter-spacing: .08em;
  margin: 0 0 10px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--codex-accent, #D89A2B);
  line-height: 1.2;
}

.cx-mlist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.cx-mlist__item {}
.cx-mlist__link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 8px;
  border-radius: 8px;
  text-decoration: none !important;
  color: inherit;
  transition: background .15s ease;
}
.cx-mlist__link:hover {
  background: rgba(18,60,69,.07);
  text-decoration: none !important;
}
.cx-mlist__title {
  font-family: var(--codex-font-ui, "Source Sans 3", sans-serif);
  font-size: 13px;
  font-weight: 500;
  color: var(--codex-primary, #123C45);
  line-height: 1.35;
  flex: 1;
  min-width: 0;
}
.cx-mlist__link:hover .cx-mlist__title {
  color: var(--codex-accent, #D89A2B);
}

/* Layout cu imagini */
.cx-mlist--img .cx-mlist__thumb {
  width: 48px;
  min-width: 48px;
  height: 48px;
  border-radius: 6px;
  object-fit: cover;
  display: block;
  background: var(--codex-bg, #F7F3EA);
  flex-shrink: 0;
}
.cx-mlist--img .cx-mlist__thumb--empty {
  background: var(--codex-bg, #F7F3EA);
}
.cx-mlist--img .cx-mlist__thumb--fallback {
  object-fit: contain;
  padding: 7px;
  background: var(--codex-bg, #F7F3EA);
}

/* Layout cu bulete */
.cx-mlist--bullets .cx-mlist__bullet {
  width: 6px;
  min-width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--codex-accent, #D89A2B);
  flex-shrink: 0;
  display: inline-block;
  transition: transform .15s ease;
}
.cx-mlist--bullets .cx-mlist__link:hover .cx-mlist__bullet {
  transform: scale(1.4);
}

/* fix: regulile globale din template (.codex-mega-menu__module a si p) suprascriau
   overlay-ul, titlul listei si stilurile cardurilor/listelor */
.container-header .codex-mega-menu__module .cx-mlist__header {
  font-family: var(--codex-font-title, "Source Serif 4", serif) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--codex-primary, #123C45) !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  margin: 0 0 10px !important;
  padding-bottom: 8px !important;
  border-bottom: 2px solid var(--codex-accent, #D89A2B) !important;
  line-height: 1.2 !important;
}
.container-header .codex-mega-menu__module .cx-mcard__overlay {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background: transparent !important;
  padding: 0 !important;
}
.container-header .codex-mega-menu__module .cx-mcard__title {
  color: var(--codex-primary, #123C45) !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  font-family: var(--codex-font-title, "Source Serif 4", serif) !important;
  line-height: 1.25 !important;
  margin: 0 0 6px !important;
}
.container-header .codex-mega-menu__module .cx-mcard--vf .cx-mcard__title {
  font-size: 17px !important;
}
.container-header .codex-mega-menu__module .cx-mcard__desc {
  color: var(--codex-muted, #667275) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  margin: 0 !important;
}

/* fix: cx-mlist link forțat la display:inline de regula generala pe <a> */
.container-header .codex-mega-menu__module .cx-mlist__link {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 6px 8px !important;
  color: var(--codex-primary, #123C45) !important;
  background: transparent !important;
  text-decoration: none !important;
  border-radius: 8px !important;
}
.container-header .codex-mega-menu__module .cx-mlist__link:hover {
  background: rgba(18,60,69,.07) !important;
  color: var(--codex-primary, #123C45) !important;
}
.container-header .codex-mega-menu__module .cx-mlist__title {
  color: var(--codex-primary, #123C45) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  flex: 1 !important;
}
.container-header .codex-mega-menu__module .cx-mlist__link:hover .cx-mlist__title {
  color: var(--codex-accent, #D89A2B) !important;
}
.container-header .codex-mega-menu__module .cx-mlist--img .cx-mlist__thumb {
  display: block !important;
  width: 48px !important;
  min-width: 48px !important;
  height: 48px !important;
  flex-shrink: 0 !important;
  object-fit: cover !important;
  border-radius: 6px !important;
}
.container-header .codex-mega-menu__module .cx-mlist--img .cx-mlist__thumb--fallback {
  object-fit: contain !important;
  padding: 7px !important;
  background: var(--codex-bg, #F7F3EA) !important;
}
.container-header .codex-mega-menu__module .cx-mlist--bullets .cx-mlist__bullet {
  display: inline-block !important;
  width: 6px !important;
  min-width: 6px !important;
  height: 6px !important;
  flex-shrink: 0 !important;
  border-radius: 50% !important;
  background: var(--codex-accent, #D89A2B) !important;
}

/* Previne MetisMenu să ascundă cx-mlist (adaugă mm-collapse la orice <ul> imbricat) */
.container-header .codex-mega-menu__module .cx-mlist.mm-collapse {
  display: flex !important;
  position: static !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* ascunde carduri și liste pe mobil */
@media (max-width: 991px) {
  .cx-mcard, .cx-mlist { display: none !important; }
}

/* =========================================================
   ZONA DE LUCRU — item evidențiat în mega-meniu (item-2449)
   ========================================================= */

.codex-mega-menu__list li.item-2449 > a.codex-menu-featured,
.codex-mega-menu__list li.item-2449 > a.codex-menu-featured:visited {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 6px 0 4px;
  padding: 7px 16px 7px 12px;
  background: linear-gradient(135deg, var(--codex-primary) 0%, #1a5563 100%);
  color: #fff !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
  font-size: 22px;
  letter-spacing: .03em;
  box-shadow: 0 2px 10px rgba(18,60,69,.25);
  transition: background .15s, box-shadow .15s, transform .12s;
  white-space: nowrap;
}

.codex-mega-menu__list li.item-2449 > a.codex-menu-featured::before {
  content: '';
  display: inline-block;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  background-color: rgba(255,255,255,.9);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'%3E%3Crect x='2' y='7' width='20' height='14' rx='2'/%3E%3Cpath d='M16 7V5a2 2 0 0 0-4 0v2'/%3E%3Cline x1='12' y1='12' x2='12' y2='16'/%3E%3Cline x1='10' y1='14' x2='14' y2='14'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'%3E%3Crect x='2' y='7' width='20' height='14' rx='2'/%3E%3Cpath d='M16 7V5a2 2 0 0 0-4 0v2'/%3E%3Cline x1='12' y1='12' x2='12' y2='16'/%3E%3Cline x1='10' y1='14' x2='14' y2='14'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}

.codex-mega-menu__list li.item-2449 > a.codex-menu-featured:hover,
.codex-mega-menu__list li.item-2449 > a.codex-menu-featured:focus {
  background: linear-gradient(135deg, var(--codex-accent) 0%, #B77D1F 100%) !important;
  color: #fff !important;
  box-shadow: 0 4px 14px rgba(216,154,43,.4) !important;
  transform: translateY(-1px);
}

.codex-mega-menu__list li.item-2449.current > a.codex-menu-featured,
.codex-mega-menu__list li.item-2449.active > a.codex-menu-featured {
  background: linear-gradient(135deg, var(--codex-accent) 0%, #B77D1F 100%) !important;
  box-shadow: 0 4px 14px rgba(216,154,43,.4) !important;
}

/* =========================================================
   HACCP 100 ZILE — TIMELINE INTERACTIV (article id=1973)
   ========================================================= */

.tl-wrap {
  --fill-accent: var(--codex-primary, #123C45);
  --on-accent: #fff;
  --text-accent: var(--codex-primary, #123C45);
  --border-accent: rgba(18,60,69,.45);
  --bg-accent: rgba(18,60,69,.07);
  --text-warning: #92600a;
  --bg-warning: #fef3c7;
  --fill-success: #16a34a;
  --bg-success: #dcfce7;
  --text-success: #15803d;
  --surface-0: var(--codex-bg, #F7F3EA);
  --surface-1: #fff;
  --surface-2: var(--codex-bg, #F7F3EA);
  --text-primary: var(--codex-text, #202426);
  --text-secondary: #4b5563;
  --text-muted: var(--codex-muted, #667275);
  --border: #e2e8f0;
  --radius: 6px;
  --font-sans: var(--codex-font-ui, system-ui, sans-serif);
  font-family: var(--font-sans);
  max-width: 680px;
  padding-bottom: 2.5rem;
}
.tl-lead {
  font-size: 14px;
  line-height: 1.75;
  color: var(--text-secondary);
  padding: 12px 16px;
  background: var(--surface-1);
  border-radius: var(--radius);
  border-left: 3px solid var(--border-accent);
  margin-bottom: 1.5rem;
}
.tl-stats {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 8px;
  margin-bottom: 2rem;
}
.tl-stat {
  text-align: center;
  padding: .8rem .5rem;
  background: var(--surface-1);
  border-radius: var(--radius);
}
.tl-stat strong {
  display: block;
  font-size: 22px;
  font-weight: 500;
  color: var(--text-accent);
}
.tl-stat span { font-size: 11px; color: var(--text-muted); }
.tl-all { position: relative; padding-left: 52px; }
.tl-all::before {
  content: '';
  position: absolute;
  left: 20px; top: 0; bottom: 0;
  width: 2px;
  background: var(--border);
  z-index: 0;
}
details.tl-ph-wrap { margin-top: 0; }
details.tl-ph-wrap + details.tl-ph-wrap { margin-top: 2rem; }
summary.tl-ph {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  padding: 2px 0;
  cursor: pointer;
  list-style: none;
  user-select: none;
  margin-bottom: .35rem;
}
summary.tl-ph::-webkit-details-marker,
summary.tl-ph::marker { display: none; }
summary.tl-ph:hover .tl-ph-t { color: var(--text-accent); }
.tl-ph-n {
  position: absolute;
  left: -52px;
  width: 40px; height: 40px;
  border-radius: 50%;
  background: var(--fill-accent);
  color: var(--on-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  font-size: 15px;
  z-index: 2;
}
.tl-ph-t { font-weight: 600; font-size: 15px; color: var(--text-primary); transition: color .15s; }
.tl-ph-s { font-size: 11px; color: var(--text-muted); margin-top: 2px; }
.tl-ph-l { flex: 1; height: .5px; background: var(--border); margin-left: 4px; }
.tl-ph-arr { flex-shrink: 0; font-size: 16px; color: var(--text-muted); transition: transform .2s; }
details.tl-ph-wrap[open] .tl-ph-arr { transform: rotate(180deg); color: var(--text-accent); }
.tl-ph-body { padding-bottom: .25rem; }
.tl-i { position: relative; margin-bottom: 8px; }
.tl-i::before {
  content: '';
  position: absolute;
  left: -38px; top: 17px;
  width: 12px; height: 12px;
  border-radius: 50%;
  border: 2px solid var(--border-accent);
  background: var(--surface-2);
  z-index: 1;
  transition: background .15s, border-color .15s;
}
.tl-i:has(details[open])::before {
  background: var(--fill-accent);
  border-color: var(--fill-accent);
}
details.tl-card {
  background: var(--surface-1);
  border-radius: var(--radius);
  border: .5px solid var(--border);
  overflow: hidden;
}
details.tl-card[open] { border-color: var(--border-accent); }
summary.tl-sh {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  cursor: pointer;
  list-style: none;
  user-select: none;
}
summary.tl-sh::-webkit-details-marker,
summary.tl-sh::marker { display: none; }
summary.tl-sh:hover { background: var(--surface-0); }
.tl-day {
  font-size: 10px;
  font-weight: 500;
  color: var(--text-warning);
  background: var(--bg-warning);
  border-radius: var(--radius);
  padding: 2px 8px;
  white-space: nowrap;
  flex-shrink: 0;
}
.tl-an { font-size: 10px; color: var(--text-muted); white-space: nowrap; flex-shrink: 0; }
.tl-at { flex: 1; font-weight: 500; font-size: 13px; color: var(--text-primary); line-height: 1.35; min-width: 0; }
.tl-arr { flex-shrink: 0; font-size: 15px; color: var(--text-muted); transition: transform .2s; font-style: normal; }
.tl-arr::before { content: '▾'; }
details.tl-card[open] .tl-arr { transform: rotate(180deg); color: var(--text-accent); }
.tl-ph-arr { flex-shrink: 0; font-size: 16px; color: var(--text-muted); transition: transform .2s; font-style: normal; }
.tl-ph-arr::before { content: '▾'; }
.tl-body { padding: 8px 14px 12px; border-top: .5px solid var(--border); }
.tl-ad { font-size: 13px; color: var(--text-secondary); line-height: 1.6; }
.tl-ad a { color: var(--text-accent); }
.tl-dur { font-size: 11px; color: var(--text-muted); margin-top: 6px; }
.tl-pause { position: relative; margin-bottom: 8px; }
.tl-pause::before {
  content: '';
  position: absolute;
  left: -36px; top: 50%;
  transform: translateY(-50%);
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--fill-success);
  z-index: 1;
}
.tl-pi {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--text-success);
  background: var(--bg-success);
  border-radius: var(--radius);
  padding: 5px 12px;
  font-style: italic;
}
.tl-eval { position: relative; margin-bottom: 8px; }
.tl-eval::before {
  content: '';
  position: absolute;
  left: -38px; top: 50%;
  transform: translateY(-50%);
  width: 12px; height: 12px;
  border-radius: 50%;
  background: var(--fill-accent);
  z-index: 1;
}
.tl-ei {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 13px;
  color: var(--text-accent);
  background: var(--bg-accent);
  border-radius: var(--radius);
  padding: 8px 12px;
}
.tl-final {
  position: relative;
  margin-top: 2rem;
  padding: 1.5rem;
  background: var(--bg-success);
  border-radius: 12px;
  text-align: center;
}
.tl-final::before {
  content: '';
  position: absolute;
  left: -52px; top: 50%;
  transform: translateY(-50%);
  width: 40px; height: 40px;
  border-radius: 50%;
  background: var(--fill-success);
  z-index: 2;
}
.tl-final strong {
  font-size: 18px;
  font-weight: 500;
  color: var(--text-success);
  display: block;
  margin-bottom: 6px;
}
.tl-final p { font-size: 14px; color: var(--text-success); line-height: 1.65; }

/* =====================================================
   CODEX — MembershipPro Registration Pages
   Upgrade-safe: scoped to body.com_osmembership
   Structura reală: #osm-signup-page > .osm-message + form#os_form.row
   ===================================================== */

body.com_osmembership {
  background: #f0f4f2;
}

/* Container îngust centrat */
body.com_osmembership #sp-component .container,
body.com_osmembership .sp-column {
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}

/* ── Card pe containerul exterior (nu pe form, care e un .row Bootstrap) ── */
body.com_osmembership #osm-signup-page {
  background: #ffffff;
  border-radius: 18px;
  padding: 36px 44px 48px;
  box-shadow:
    0 1px 3px rgba(18, 60, 69, .06),
    0 8px 28px rgba(18, 60, 69, .10);
  margin: 8px 0 40px;
}

/* ── Secțiunea descriptivă (înainte de formular) ── */
body.com_osmembership .osm-message {
  margin-bottom: 28px;
  padding-bottom: 24px;
  border-bottom: 1px solid rgba(18, 60, 69, .08);
}

body.com_osmembership .osm-message h2 {
  font-size: 22px;
  font-weight: 800;
  color: #123C45;
  margin: 20px 0 0;
  padding: 0;
}

/* ── Resetează #os_form (e un Bootstrap .row — nu adaugăm padding/shadow) ── */
body.com_osmembership #os_form {
  margin-left: 0 !important;
  margin-right: 0 !important;
  background: transparent;
}

/* ── Rânduri câmpuri ── */
body.com_osmembership #os_form .form-group.form-row {
  margin-bottom: 12px;
  align-items: center;
}

/* ── Label-uri ── */
body.com_osmembership #os_form .form-control-label {
  padding-right: 16px;
}

body.com_osmembership #os_form .form-control-label label {
  font-size: 13.5px;
  font-weight: 700;
  color: #2c4a50;
  line-height: 1.3;
  margin: 0;
  display: block;
}

body.com_osmembership #os_form .star,
body.com_osmembership #os_form .required {
  color: #E8731C;
  font-size: 12px;
  font-weight: 700;
}

/* ── Inputuri text, textarea ── */
body.com_osmembership #os_form input.form-control,
body.com_osmembership #os_form textarea.form-control {
  height: auto;
  padding: 10px 14px;
  font-size: 14.5px;
  color: #1a3438;
  background: #f8fafa;
  border: 1.5px solid rgba(18, 60, 69, .2) !important;
  border-radius: 9px !important;
  transition: border-color .15s, box-shadow .15s, background .15s;
  box-shadow: none !important;
  width: 100%;
}

body.com_osmembership #os_form input.form-control:focus,
body.com_osmembership #os_form textarea.form-control:focus {
  border-color: #123C45 !important;
  background: #ffffff;
  box-shadow: 0 0 0 3px rgba(18, 60, 69, .10) !important;
  outline: none;
}

body.com_osmembership #os_form input.form-control[disabled],
body.com_osmembership #os_form input.form-control[readonly] {
  background: #eef2f0;
  color: #6a8a8e;
  cursor: default;
}

/* ── Select (Bootstrap 5 folosește .form-select, nu .form-control) ── */
body.com_osmembership #os_form select.form-control,
body.com_osmembership #os_form select.form-select {
  height: auto;
  padding: 10px 36px 10px 14px;
  font-size: 14.5px;
  color: #1a3438;
  background-color: #f8fafa;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23123C45' opacity='.5' d='M6 8L0 0h12z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  border: 1.5px solid rgba(18, 60, 69, .2) !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  transition: border-color .15s, box-shadow .15s;
}

body.com_osmembership #os_form select.form-control:focus,
body.com_osmembership #os_form select.form-select:focus {
  border-color: #123C45 !important;
  background-color: #ffffff;
  box-shadow: 0 0 0 3px rgba(18, 60, 69, .10) !important;
  outline: none;
}

/* ── Secțiunea Preț ── */
body.com_osmembership #osm-amount-container,
body.com_osmembership #osm-discount-container,
body.com_osmembership #osm-gross-amount-container {
  background: #f0f7f4;
  border-radius: 10px;
  padding: 12px 16px;
  margin-bottom: 10px;
  border-left: 3px solid #123C45;
}

body.com_osmembership #osm-gross-amount-container {
  background: #e8f3ef;
  border-left-color: #E8731C;
  font-weight: 700;
}

/* .osm-amount class nu există în HTML — targetăm input-ul direct */
body.com_osmembership #osm-signup-page .osm-addon-container {
  display: flex !important;
  flex-wrap: nowrap;
  align-items: center;
}

/* RON mutat vizual după sumă cu order */
body.com_osmembership #osm-signup-page .osm-addon-container .input-group-text {
  order: 2;
  border-radius: 0 8px 8px 0 !important;
  border-left: 0;
  background: rgba(18, 60, 69, .07);
  color: rgba(18, 60, 69, .55);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .05em;
  padding: 6px 10px;
}

body.com_osmembership #osm-signup-page .osm-addon-container .form-control {
  order: 1;
  border-radius: 8px 0 0 8px !important;
  margin-left: 0 !important;
  font-variant-numeric: tabular-nums;
}

/* Suma Totală — valoarea mai proeminentă */
body.com_osmembership #gross_amount {
  font-size: 18px;
  font-weight: 800;
  color: #E8731C;
}

/* ── Metodă de plată ── */
body.com_osmembership #os_form .payment_information {
  background: #fafcfb;
  border-radius: 12px;
  padding: 14px 18px;
  margin-bottom: 12px;
  border: 1px solid rgba(18, 60, 69, .1);
}

/* ── Politică confidențialitate / Termeni ── */
body.com_osmembership .osm-privacy-policy-message,
body.com_osmembership #os_form .alert-info {
  border-radius: 8px;
  border-left: 3px solid #123C45;
  background: #f0f7f4;
  color: #2c4a50;
  padding: 10px 14px;
  font-size: 13px;
}

/* ── Mesaje eroare / succes ── */
body.com_osmembership .osm-error-message,
body.com_osmembership .alert-danger {
  border-radius: 10px;
  border-left: 4px solid #e74c3c;
  background: #fdf0ef;
  color: #8b1a14;
  padding: 12px 16px;
  font-size: 14px;
}

body.com_osmembership .alert-success {
  border-radius: 10px;
  border-left: 4px solid #27ae60;
  background: #edf8f2;
  color: #155a30;
  padding: 12px 16px;
  font-size: 14px;
}

/* ── Buton Submit ── */
body.com_osmembership .form-actions {
  flex: 0 0 100%;
  max-width: 100%;
}

body.com_osmembership .form-actions input#btn-submit {
  display: block;
  width: 100%;
  padding: 15px 32px;
  margin-top: 20px;
  background: #E8731C !important;
  color: #ffffff !important;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: .02em;
  border: none !important;
  border-radius: 12px !important;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(232, 115, 28, .35) !important;
  transition: background .15s, transform .12s, box-shadow .15s;
  text-align: center;
}

body.com_osmembership .form-actions input#btn-submit:hover {
  background: #d4661a !important;
  box-shadow: 0 6px 20px rgba(232, 115, 28, .45) !important;
  transform: translateY(-1px);
}

body.com_osmembership .form-actions input#btn-submit:active {
  transform: translateY(0);
}

/* ── Breadcrumb ── */
body.com_osmembership .mod-breadcrumbs {
  font-size: 12px;
  opacity: .65;
  margin-bottom: 4px;
}

/* ── Responsive mobil ── */
@media (max-width: 768px) {
  body.com_osmembership #osm-signup-page {
    padding: 24px 18px 32px;
    border-radius: 12px;
  }

  body.com_osmembership #os_form .form-control-label,
  body.com_osmembership #os_form .eb-form-control {
    flex: 0 0 100%;
    max-width: 100%;
  }

  body.com_osmembership #os_form .form-control-label {
    padding-right: 0;
    margin-bottom: 4px;
  }

  body.com_osmembership #os_form .form-group.form-row {
    flex-wrap: wrap;
  }

  body.com_osmembership .form-actions input#btn-submit {
    font-size: 15px;
    padding: 13px 24px;
  }
}

@media (max-width: 480px) {
  body.com_osmembership #osm-signup-page {
    padding: 18px 12px 24px;
  }
}

/* =====================================================
   CODEX — MembershipPro Plans List (view-plans / Itemid 2479)
   Structura: #osm-plans-list-default > .osm-item-wrapper[]
   ===================================================== */

/* ── Fiecare plan = card ── */
body.com_osmembership #osm-plans-list-default .osm-item-wrapper {
  background: #ffffff;
  border-radius: 16px;
  padding: 28px 36px 24px;
  box-shadow:
    0 1px 3px rgba(18, 60, 69, .06),
    0 6px 22px rgba(18, 60, 69, .09);
  margin-bottom: 20px;
  overflow: hidden;
}

/* ── Titlu plan ── */
body.com_osmembership #osm-plans-list-default .osm-item-heading-box {
  border-bottom: 1px solid rgba(18, 60, 69, .08);
  margin-bottom: 20px;
  padding-bottom: 14px;
}

body.com_osmembership #osm-plans-list-default .osm-item-title {
  margin: 0;
  font-size: 21px;
  font-weight: 800;
}

body.com_osmembership #osm-plans-list-default .osm-item-title a {
  color: #123C45;
  text-decoration: none;
  transition: color .15s;
}

body.com_osmembership #osm-plans-list-default .osm-item-title a:hover {
  color: #E8731C;
}

/* ── Tabel proprietăți (durată, preț) ── */
body.com_osmembership #osm-plans-list-default .table {
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 10px;
  overflow: hidden;
  width: 100%;
  margin-bottom: 0;
}

body.com_osmembership #osm-plans-list-default .table td {
  border: none;
  border-bottom: 1px solid rgba(18, 60, 69, .07);
  padding: 11px 16px;
  vertical-align: middle;
}

body.com_osmembership #osm-plans-list-default .table tr:last-child td {
  border-bottom: none;
}

body.com_osmembership #osm-plans-list-default .osm-plan-property-label {
  font-size: 11.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: #6a8a8e;
  background: #f0f7f4;
  width: 40%;
}

body.com_osmembership #osm-plans-list-default .osm-plan-property-value {
  font-size: 15px;
  font-weight: 700;
  color: #123C45;
  background: #f8fafa;
}

/* =====================================================
   CODEX — Joomla Login Page (com_users view-login)
   Structura: .com-users-login / .com-users-logout
   ===================================================== */

body.com_users.view-login {
  background: #f0f4f2;
}

/* Container centrat și îngust */
body.com_users.view-login .com-users-login,
body.com_users.view-login .com-users-logout {
  max-width: 540px;
  margin: 0 auto;
}

/* ── Card formular (.well = clase Bootstrap pe form) ── */
body.com_users.view-login .well,
body.com_users.view-login #com-users-login__form,
body.com_users.view-login .com-users-logout__form {
  background: #ffffff !important;
  border: none !important;
  border-radius: 16px !important;
  padding: 32px 36px !important;
  box-shadow: 0 1px 3px rgba(18,60,69,.06), 0 8px 28px rgba(18,60,69,.10) !important;
  margin-bottom: 16px;
}

/* ── Label-uri ── */
body.com_users.view-login .control-label label,
body.com_users.view-login .com-users-login__form label,
body.com_users.view-login .form-label {
  font-size: 13.5px;
  font-weight: 700;
  color: #2c4a50;
  margin-bottom: 5px;
}

/* ── Inputuri ── */
body.com_users.view-login .com-users-login__form input[type="text"],
body.com_users.view-login .com-users-login__form input[type="password"],
body.com_users.view-login .com-users-login__form input.form-control {
  height: auto;
  padding: 10px 14px;
  font-size: 14.5px;
  color: #1a3438;
  background: #f8fafa;
  border: 1.5px solid rgba(18,60,69,.2) !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  width: 100%;
  transition: border-color .15s, box-shadow .15s, background .15s;
}

body.com_users.view-login .com-users-login__form input[type="text"]:focus,
body.com_users.view-login .com-users-login__form input[type="password"]:focus,
body.com_users.view-login .com-users-login__form input.form-control:focus {
  border-color: #123C45 !important;
  background: #ffffff;
  box-shadow: 0 0 0 3px rgba(18,60,69,.10) !important;
  outline: none;
}

/* ── Buton Autentificare ── */
body.com_users.view-login .com-users-login__submit .btn-primary,
body.com_users.view-login .com-users-login__submit .btn {
  background: #E8731C !important;
  border: none !important;
  color: #ffffff !important;
  font-weight: 700;
  font-size: 15px;
  border-radius: 10px;
  padding: 11px 28px;
  width: 100%;
  box-shadow: 0 3px 12px rgba(232,115,28,.30);
  transition: background .15s, transform .1s, box-shadow .15s;
  cursor: pointer;
}

body.com_users.view-login .com-users-login__submit .btn-primary:hover {
  background: #d4661a !important;
  box-shadow: 0 5px 18px rgba(232,115,28,.42) !important;
  transform: translateY(-1px);
}

/* ── Buton Ieșire (logout) ── */
body.com_users.view-login .com-users-logout__submit .btn-primary {
  background: #123C45 !important;
  border: none !important;
  color: #ffffff !important;
  font-weight: 700;
  border-radius: 10px;
  padding: 10px 28px;
  width: 100%;
  transition: background .15s;
}

body.com_users.view-login .com-users-logout__submit .btn-primary:hover {
  background: #1a5060 !important;
}

/* ── Linkuri opțiuni (reset parolă, înregistrare) ── */
body.com_users.view-login .com-users-login__options {
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(18,60,69,.1) !important;
  margin-top: 4px;
}

body.com_users.view-login .com-users-login__options .list-group-item {
  font-size: 13.5px;
  color: #2c4a50;
  padding: 10px 16px;
  border-color: rgba(18,60,69,.07) !important;
  transition: background .12s, color .12s;
  text-decoration: none;
}

body.com_users.view-login .com-users-login__options .list-group-item:hover {
  background: #f0f7f4;
  color: #123C45;
}

/* ── Box ajutor la login (cx-login-info) ── */
body.com_users.view-login .cx-login-info {
  background: #fef9ec;
  border: 1.5px solid rgba(240,165,0,.3);
  border-left: 4px solid #f0a500;
  border-radius: 10px;
  padding: 16px 20px;
  font-size: 13.5px;
  color: #4a3800;
  line-height: 1.65;
  margin-bottom: 20px;
}

body.com_users.view-login .cx-login-info__title {
  display: block;
  font-weight: 800;
  font-size: 14.5px;
  color: #7a5500;
  margin-bottom: 8px;
}

body.com_users.view-login .cx-login-info ul {
  padding-left: 18px;
  margin: 6px 0 10px;
}

/* ── Card utilizator logat (cx-user-card) ── */
body.com_users.view-login .cx-user-card {
  background: #f0f7f4;
  border-radius: 12px;
  padding: 22px 28px;
  margin-bottom: 20px;
  text-align: center;
  border: 1px solid rgba(18,60,69,.1);
}

body.com_users.view-login .cx-user-card__greeting {
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: #6a8a8e;
  margin-bottom: 4px;
}

body.com_users.view-login .cx-user-card__name {
  font-size: 21px;
  font-weight: 800;
  color: #123C45;
  margin: 0 0 8px;
}

body.com_users.view-login .cx-user-card__meta {
  font-size: 12.5px;
  color: #6a8a8e;
  margin-bottom: 14px;
}

body.com_users.view-login .cx-user-card__plan {
  display: inline-block;
  color: #E8731C;
  font-weight: 700;
  font-size: 13.5px;
  text-decoration: none;
  margin-bottom: 14px;
  transition: opacity .12s;
}

body.com_users.view-login .cx-user-card__plan:hover {
  opacity: .75;
  text-decoration: underline;
}

/* ── Buton asistență (ambele contexte) ── */
.cx-btn-assist {
  display: inline-block;
  background: #123C45;
  color: #fff !important;
  border: none;
  padding: 8px 18px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  transition: background .15s;
  margin-top: 6px;
}

.cx-btn-assist:hover {
  background: #1a5060;
}

/* ── Responsive ── */
@media (max-width: 600px) {
  body.com_users.view-login .well,
  body.com_users.view-login #com-users-login__form,
  body.com_users.view-login .com-users-logout__form {
    padding: 22px 18px !important;
    border-radius: 12px !important;
  }

  body.com_users.view-login .cx-user-card {
    padding: 16px 18px;
  }
}

/* Prețul (ultimul rând din tabel) — mai proeminent */
body.com_osmembership #osm-plans-list-default .osm-plan-property:last-child .osm-plan-property-label {
  background: #e8f3ef;
  color: #123C45;
}

body.com_osmembership #osm-plans-list-default .osm-plan-property:last-child .osm-plan-property-value {
  font-size: 20px;
  font-weight: 800;
  color: #E8731C;
  background: #fef6f0;
  font-variant-numeric: tabular-nums;
}

/* ── Bara cu buton Înregistrare ── */
body.com_osmembership #osm-plans-list-default .osm-taskbar {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid rgba(18, 60, 69, .06);
}

body.com_osmembership #osm-plans-list-default .osm-taskbar ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 10px;
}

body.com_osmembership #osm-plans-list-default .osm-taskbar li {
  margin: 0;
  padding: 0;
}

body.com_osmembership #osm-plans-list-default .osm-taskbar .btn-primary {
  background: #E8731C !important;
  border: none !important;
  color: #fff !important;
  font-weight: 700;
  font-size: 14.5px;
  border-radius: 10px;
  padding: 10px 26px;
  text-decoration: none;
  display: inline-block;
  transition: background .15s, transform .1s, box-shadow .15s;
  box-shadow: 0 3px 10px rgba(232, 115, 28, .3);
}

body.com_osmembership #osm-plans-list-default .osm-taskbar .btn-primary:hover {
  background: #d4661a !important;
  box-shadow: 0 5px 16px rgba(232, 115, 28, .42);
  transform: translateY(-1px);
}

/* ── Responsive mobil ── */
@media (max-width: 768px) {
  body.com_osmembership #osm-plans-list-default .osm-item-wrapper {
    padding: 22px 18px 20px;
    border-radius: 12px;
  }

  body.com_osmembership #osm-plans-list-default .osm-description-details,
  body.com_osmembership #osm-plans-list-default .col-md-5 {
    flex: 0 0 100%;
    max-width: 100%;
  }

  body.com_osmembership #osm-plans-list-default .col-md-5 {
    margin-top: 16px;
  }
}

@media (max-width: 480px) {
  body.com_osmembership #osm-plans-list-default .osm-item-wrapper {
    padding: 16px 14px 16px;
  }
}

/* =====================================================
   CODEX — mod_login widget (oriunde e plasat)
   Structura: form.mod-login > .mod-login__userdata
   ===================================================== */

/* ── Label-uri (usetext=1) ── */
.mod-login .form-group > label:not(.form-check-label):not(.visually-hidden) {
  font-size: 13px;
  font-weight: 700;
  color: #2c4a50;
  margin-bottom: 5px;
  display: block;
}

/* ── Inputuri ── */
.mod-login input[type="text"].form-control,
.mod-login input[type="password"].form-control {
  height: auto;
  padding: 10px 14px;
  font-size: 14px;
  color: #1a3438;
  background: #f8fafa;
  border: 1.5px solid rgba(18, 60, 69, .2) !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  transition: border-color .15s, box-shadow .15s, background .15s;
}

.mod-login input[type="text"].form-control:focus,
.mod-login input[type="password"].form-control:focus {
  border-color: #123C45 !important;
  background: #ffffff;
  box-shadow: 0 0 0 3px rgba(18, 60, 69, .10) !important;
  outline: none;
}

/* ── Grup parolă + buton eye ── */
.mod-login .input-group {
  flex-wrap: nowrap;
}

.mod-login .input-group input.form-control {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.mod-login .input-group .btn-secondary.input-password-toggle {
  background: #f0f7f4 !important;
  border: 1.5px solid rgba(18, 60, 69, .2) !important;
  border-left: none !important;
  color: #123C45 !important;
  border-top-right-radius: 9px !important;
  border-bottom-right-radius: 9px !important;
  padding: 0 12px;
  transition: background .12s;
}

.mod-login .input-group .btn-secondary.input-password-toggle:hover {
  background: #daeee7 !important;
}

/* ── input-group-text (mod icon, usetext=0) ── */
.mod-login .input-group-text {
  background: #f0f7f4;
  border: 1.5px solid rgba(18, 60, 69, .2);
  border-left: none;
  color: #123C45;
  border-radius: 0 9px 9px 0;
}

/* ── form-group spacing ── */
.mod-login .mod-login__username,
.mod-login .mod-login__password,
.mod-login .mod-login__remember {
  margin-bottom: 12px;
}

/* ── Buton Autentificare ── */
.mod-login .mod-login__submit .btn-primary.w-100 {
  background: #E8731C !important;
  border: none !important;
  color: #ffffff !important;
  font-weight: 700;
  font-size: 14.5px;
  border-radius: 10px !important;
  padding: 11px 24px;
  box-shadow: 0 3px 10px rgba(232, 115, 28, .28);
  transition: background .15s, transform .1s, box-shadow .15s;
  margin-bottom: 10px;
}

.mod-login .mod-login__submit .btn-primary.w-100:hover {
  background: #d4661a !important;
  box-shadow: 0 5px 16px rgba(232, 115, 28, .40) !important;
  transform: translateY(-1px);
}

/* ── Remember me ── */
.mod-login .mod-login__remember .form-check-label {
  font-size: 13px;
  color: #4a6a6e;
  cursor: pointer;
}

/* ── Linkuri ajutor (parola uitată, înregistrare) ── */
.mod-login .mod-login__options {
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
}

.mod-login .mod-login__options li {
  margin-bottom: 3px;
}

.mod-login .mod-login__options a {
  font-size: 12.5px;
  color: #6a8a8e;
  text-decoration: none;
  transition: color .12s;
}

.mod-login .mod-login__options a:hover {
  color: #E8731C;
  text-decoration: underline;
}

/* ═══════════════════════════════════════════════════════════════════
   PAGINA PREȚURI — .cx-pricing
   ═══════════════════════════════════════════════════════════════════ */
.cx-pricing {
  --cx-p-ink:    #0c2a31;
  --cx-p-teal:   #123C45;
  --cx-p-orange: #E8731C;
  --cx-p-amber:  #b8891a;
  --cx-p-muted:  #4b6569;
  --cx-p-border: rgba(18,60,69,.14);
  padding: 52px 0 72px;
  font-family: -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  font-size: 15px;
  line-height: 1.6;
  color: var(--cx-p-ink);
}

/* ── Header ──────────────────────────────────────────────────── */
.cx-pricing .cx-p-header { text-align: center; margin-bottom: 60px; }

.cx-pricing .cx-p-eyebrow {
  display: inline-block;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--cx-p-orange);
  margin-bottom: 14px;
}

.cx-pricing .cx-p-header h2 {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(26px, 3.8vw, 42px);
  font-weight: 400;
  color: var(--cx-p-teal);
  line-height: 1.12;
  text-wrap: balance;
  margin-bottom: 16px;
  letter-spacing: -.01em;
}

.cx-pricing .cx-p-header-sub {
  color: var(--cx-p-muted);
  font-size: 16px;
  max-width: 520px;
  margin: 0 auto;
  line-height: 1.6;
}

/* ── Grid planuri ────────────────────────────────────────────── */
.cx-pricing .cx-p-plans {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  align-items: stretch;
}

/* ── Card de bază ────────────────────────────────────────────── */
.cx-pricing .cx-plan {
  background: #fff;
  border: 1.5px solid var(--cx-p-border);
  border-radius: 14px;
  padding: 32px 22px 28px;
  display: flex;
  flex-direction: column;
  position: relative;
}

.cx-pricing .cx-plan--featured {
  background: var(--cx-p-teal);
  border-color: var(--cx-p-teal);
  border-radius: 16px;
  padding: 52px 24px 44px;
  margin-top: -20px;
  margin-bottom: -20px;
}

.cx-pricing .cx-plan--premium {
  background: #fefdf7;
  border-color: rgba(184,137,26,.35);
  border-radius: 16px;
  padding: 52px 24px 44px;
  margin-top: -20px;
  margin-bottom: -20px;
}

/* ── Pill plutitor ───────────────────────────────────────────── */
.cx-pricing .cx-plan-pill {
  position: absolute;
  top: -13px;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 4px 13px;
  border-radius: 20px;
}
.cx-pricing .cx-plan-pill--recommended { background: var(--cx-p-orange); color: #fff; }
.cx-pricing .cx-plan-pill--premium     { background: var(--cx-p-amber);  color: #fff; }

/* ── Tier label ──────────────────────────────────────────────── */
.cx-pricing .cx-plan-tier {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--cx-p-muted);
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 7px;
}
.cx-pricing .cx-plan-tier::before {
  content: '';
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--cx-p-border);
  flex-shrink: 0;
}
.cx-pricing .cx-plan--individual .cx-plan-tier::before { background: var(--cx-p-teal); }
.cx-pricing .cx-plan--featured   .cx-plan-tier         { color: rgba(255,255,255,.5); }
.cx-pricing .cx-plan--featured   .cx-plan-tier::before { background: var(--cx-p-orange); }
.cx-pricing .cx-plan--premium    .cx-plan-tier         { color: var(--cx-p-amber); }
.cx-pricing .cx-plan--premium    .cx-plan-tier::before { background: var(--cx-p-amber); }

/* ── Nume plan ───────────────────────────────────────────────── */
.cx-pricing .cx-plan-name {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 22px;
  font-weight: 400;
  color: var(--cx-p-teal);
  line-height: 1.15;
  margin-bottom: 7px;
}
.cx-pricing .cx-plan--featured .cx-plan-name { color: #fff; font-size: 25px; }

/* ── Tagline ─────────────────────────────────────────────────── */
.cx-pricing .cx-plan-tagline {
  font-size: 12.5px;
  font-style: italic;
  color: var(--cx-p-muted);
  line-height: 1.45;
  margin-bottom: 26px;
  min-height: 38px;
}
.cx-pricing .cx-plan--featured .cx-plan-tagline { color: rgba(255,255,255,.62); }

/* ── Preț ────────────────────────────────────────────────────── */
.cx-pricing .cx-plan-price { margin-bottom: 22px; }

.cx-pricing .cx-plan-price-row {
  display: flex;
  align-items: baseline;
  gap: 3px;
  line-height: 1;
}

.cx-pricing .cx-plan-price-amount {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 46px;
  font-weight: 700;
  color: var(--cx-p-teal);
  font-variant-numeric: tabular-nums;
  letter-spacing: -.02em;
}
.cx-pricing .cx-plan--featured .cx-plan-price-amount { color: #fff; font-size: 54px; }

.cx-pricing .cx-plan-price-currency {
  font-size: 16px;
  font-weight: 600;
  color: var(--cx-p-muted);
  margin-bottom: 4px;
}
.cx-pricing .cx-plan--featured .cx-plan-price-currency { color: rgba(255,255,255,.6); }

.cx-pricing .cx-plan-price-free {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 34px;
  color: var(--cx-p-muted);
  font-weight: 400;
  line-height: 1;
}

.cx-pricing .cx-plan-price-note {
  font-size: 11.5px;
  color: var(--cx-p-muted);
  margin-top: 5px;
}
.cx-pricing .cx-plan--featured .cx-plan-price-note { color: rgba(255,255,255,.5); }

/* ── Separator ───────────────────────────────────────────────── */
.cx-pricing .cx-plan-divider {
  height: 1px;
  background: var(--cx-p-border);
  margin-bottom: 20px;
}
.cx-pricing .cx-plan--featured .cx-plan-divider { background: rgba(255,255,255,.16); }
.cx-pricing .cx-plan--premium  .cx-plan-divider { background: rgba(184,137,26,.18); }

/* ── Lista beneficii ─────────────────────────────────────────── */
.cx-pricing .cx-plan-features {
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1;
  margin-bottom: 26px;
}

.cx-pricing .cx-plan-features li {
  font-size: 13px;
  color: #2c4a50;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  line-height: 1.4;
  margin: 0;
}
.cx-pricing .cx-plan--featured .cx-plan-features li { color: rgba(255,255,255,.82); }

.cx-pricing .cx-check { width: 16px; height: 16px; flex-shrink: 0; margin-top: 1px; }

.cx-pricing .cx-plan-features .cx-inherited {
  font-size: 12px;
  font-style: italic;
  color: var(--cx-p-muted);
  padding-left: 24px;
  gap: 0;
}
.cx-pricing .cx-plan--featured .cx-plan-features .cx-inherited { color: rgba(255,255,255,.42); }

.cx-pricing .cx-em                          { font-weight: 600; color: var(--cx-p-teal); }
.cx-pricing .cx-plan--featured .cx-em       { color: #ffd699; }
.cx-pricing .cx-plan--premium  .cx-em       { color: var(--cx-p-amber); }

/* ── Buton CTA ───────────────────────────────────────────────── */
.cx-pricing .cx-plan-cta {
  display: block;
  text-align: center;
  padding: 13px 16px;
  border-radius: 9px;
  font-size: 13.5px;
  font-weight: 600;
  text-decoration: none;
  letter-spacing: .02em;
  transition: filter .15s ease, transform .12s ease;
  cursor: pointer;
  margin-top: auto;
}
.cx-pricing .cx-plan-cta:hover  { filter: brightness(.9); transform: translateY(-1px); }
.cx-pricing .cx-plan-cta:active { transform: translateY(0); }

.cx-pricing .cx-plan--free       .cx-plan-cta { border: 1.5px solid var(--cx-p-border); color: var(--cx-p-muted); background: transparent; }
.cx-pricing .cx-plan--individual .cx-plan-cta { background: var(--cx-p-teal);   color: #fff; }
.cx-pricing .cx-plan--featured   .cx-plan-cta { background: var(--cx-p-orange); color: #fff; }
.cx-pricing .cx-plan--premium    .cx-plan-cta { background: var(--cx-p-ink);    color: #fff; }

/* ── Footer modul ────────────────────────────────────────────── */
.cx-pricing .cx-p-footer {
  text-align: center;
  margin-top: 52px;
  font-size: 13px;
  color: var(--cx-p-muted);
  line-height: 1.7;
}
.cx-pricing .cx-p-footer a {
  color: var(--cx-p-teal);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 900px) {
  .cx-pricing .cx-p-plans    { grid-template-columns: repeat(2, 1fr); gap: 20px; align-items: start; }
  .cx-pricing .cx-plan--featured,
  .cx-pricing .cx-plan--premium { margin: 0; padding: 44px 22px 36px; }
  .cx-pricing .cx-plan-tagline  { min-height: auto; }
}

@media (max-width: 560px) {
  .cx-pricing .cx-p-plans    { grid-template-columns: 1fr; gap: 16px; align-items: start; }
  .cx-pricing .cx-plan--featured,
  .cx-pricing .cx-plan--premium { margin: 0; padding: 44px 22px 36px; }
}

/* ═══════════════════════════════════════════════════════════════════
   INDEX 2026 — arbore de conținut .cx26-wrap
   ═══════════════════════════════════════════════════════════════════ */
.cx26-wrap {
  --cx26-teal:   #123C45;
  --cx26-line:   rgba(18,60,69,.18);
  --cx26-line2:  rgba(18,60,69,.10);
  --cx26-muted:  #4b6569;
  --cx26-orange: #E8731C;
  --cx26-feat:   #0d5260;
  max-width: 860px;
  margin: 0 auto;
  padding: 40px 0 60px;
  font-family: -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: var(--cx26-teal);
}

/* ── Header ─────────────────────────────────────────────────────── */
.cx26-header { margin-bottom: 44px; }

.cx26-eyebrow {
  display: block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--cx26-orange);
  margin-bottom: 8px;
}

.cx26-header .cx26-title {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(22px, 3vw, 32px);
  font-weight: 400;
  color: var(--cx26-teal);
  margin: 0 0 10px;
  letter-spacing: -.01em;
}

.cx26-desc {
  font-size: 13.5px;
  color: var(--cx26-muted);
  margin: 0;
  max-width: 540px;
}

/* ── Root badge ─────────────────────────────────────────────────── */
.cx26-root-label {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 4px;
}

.cx26-badge {
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  color: #fff;
  background: var(--cx26-teal);
  border-radius: 5px;
  padding: 3px 10px;
  white-space: nowrap;
  flex-shrink: 0;
}

.cx26-root-line {
  flex: 1;
  height: 1.5px;
  background: var(--cx26-line);
}

/* ── Tree wrapper ───────────────────────────────────────────────── */
.cx26-tree {
  padding-left: 0;
}

/* ── Branch L2 ──────────────────────────────────────────────────── */
.cx26-branch--l2 {
  position: relative;
  padding-left: 20px;
  margin-top: 1px;
}

/* Linie verticală laterală stânga, continuă pe toată ramura */
.cx26-branch--l2::before {
  content: '';
  position: absolute;
  left: 5px;
  top: 0;
  bottom: 0;
  border-left: 1.5px solid var(--cx26-line);
}
.cx26-branch--l2:last-child::before { bottom: 50%; }

/* ── Node row L2 (categoria) ────────────────────────────────────── */
.cx26-node--l2 {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
}
/* Conector orizontal spre nod */
.cx26-node--l2::before {
  content: '';
  position: absolute;
  left: -20px;
  top: 50%;
  width: 14px;
  border-top: 1.5px solid var(--cx26-line);
}

/* ── Cat link (L2) ──────────────────────────────────────────────── */
.cx26-cat {
  font-size: 14px;
  font-weight: 600;
  color: var(--cx26-teal);
  text-decoration: none;
  letter-spacing: .005em;
  transition: color .12s;
}
.cx26-cat:hover { color: var(--cx26-orange); text-decoration: underline; text-underline-offset: 3px; }

/* ── Sub-tree container ─────────────────────────────────────────── */
.cx26-sub {
  position: relative;
  padding-left: 18px;
  margin-left: 5px;
  border-left: 1.5px solid var(--cx26-line2);
  padding-top: 2px;
  padding-bottom: 2px;
}
.cx26-sub.cx26-hidden { display: none; }

/* ── Branch L3 (subcategorie PRP/PGM) ──────────────────────────── */
.cx26-branch--l3 {
  position: relative;
  margin-bottom: 2px;
}

.cx26-node--l3 {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 0;
}
.cx26-node--l3::before {
  content: '';
  position: absolute;
  left: -18px;
  top: 50%;
  width: 12px;
  border-top: 1px solid var(--cx26-line2);
}

/* ── Sub-cat link (L3) ──────────────────────────────────────────── */
.cx26-subcat {
  font-size: 13px;
  font-weight: 500;
  color: #1e5060;
  text-decoration: none;
  transition: color .12s;
}
.cx26-subcat:hover { color: var(--cx26-orange); text-decoration: underline; text-underline-offset: 3px; }

/* ── Noduri articole ────────────────────────────────────────────── */
.cx26-node--featured,
.cx26-node--doc,
.cx26-toggle-row {
  display: flex;
  align-items: baseline;
  gap: 7px;
  padding: 3px 0;
  position: relative;
}
.cx26-node--featured::before,
.cx26-node--doc::before,
.cx26-toggle-row::before {
  content: '';
  position: absolute;
  left: -18px;
  top: 50%;
  width: 12px;
  border-top: 1px dashed var(--cx26-line2);
}

/* ── Bullet indicators ──────────────────────────────────────────── */
.cx26-bullet--star {
  font-size: 10px;
  color: var(--cx26-orange);
  flex-shrink: 0;
  line-height: 1.6;
}
.cx26-bullet--dots { display: none; } /* nu mai avem nevoie vizual */

/* ── Article links ──────────────────────────────────────────────── */
.cx26-art {
  font-size: 12.5px;
  color: var(--cx26-muted);
  text-decoration: none;
  transition: color .12s;
  line-height: 1.4;
}
.cx26-art:hover { color: var(--cx26-teal); text-decoration: underline; text-underline-offset: 3px; }

.cx26-art--featured {
  font-size: 13px;
  font-weight: 600;
  color: var(--cx26-feat);
}
.cx26-art--featured:hover { color: var(--cx26-orange); }

/* ── Toggle buttons ─────────────────────────────────────────────── */
.cx26-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: 1px solid var(--cx26-line);
  border-radius: 4px;
  background: transparent;
  color: var(--cx26-muted);
  font-size: 11px;
  font-family: inherit;
  padding: 1px 7px 1px 5px;
  cursor: pointer;
  white-space: nowrap;
  transition: border-color .12s, color .12s, background .12s;
  flex-shrink: 0;
  line-height: 1.6;
}
.cx26-btn:hover { border-color: var(--cx26-teal); color: var(--cx26-teal); background: rgba(18,60,69,.04); }

.cx26-btn--expand { font-size: 11.5px; margin-left: auto; }
.cx26-btn--small  { font-size: 10.5px; }

.cx26-btn-icon {
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  color: var(--cx26-teal);
}

.cx26-count {
  background: rgba(18,60,69,.08);
  border-radius: 3px;
  padding: 0 4px;
  font-weight: 700;
  color: var(--cx26-teal);
  font-size: 10px;
}

/* ── L4 doc list ────────────────────────────────────────────────── */
.cx26-tree-l4 { }

/* ── Notă subsol ────────────────────────────────────────────────── */
.cx26-footnote {
  margin-top: 36px;
  font-size: 12px;
  color: var(--cx26-muted);
  line-height: 1.7;
  padding-top: 16px;
  border-top: 1px solid var(--cx26-line2);
}
.cx26-footnote a { color: var(--cx26-teal); text-decoration: underline; text-underline-offset: 3px; }
.cx26-footnote a:hover { color: var(--cx26-orange); }

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 600px) {
  .cx26-wrap { padding: 28px 0 40px; }
  .cx26-branch--l2 { padding-left: 14px; }
  .cx26-sub { padding-left: 12px; }
  .cx26-node--l2::before { left: -14px; width: 10px; }
  .cx26-node--l3::before,
  .cx26-node--featured::before,
  .cx26-node--doc::before,
  .cx26-toggle-row::before { left: -12px; width: 8px; }
}



/* =========================================================
   CODEX ARTICLE ACTION SIDEBAR — cassiopeia_extended (public)
   ========================================================= */

/* Suppress JA Social Share sticky widget on article pages */
body.view-article .sticky,
body.view-article .ja-share-button { display: none !important; }

.codex-article-with-actions {
  display: flex;
  align-items: flex-start;
  gap: 0;
}

.codex-article-content-wrapper {
  flex: 1 1 0;
  min-width: 0;
}

.codex-article-actions {
  flex: 0 0 44px;
  width: 44px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  position: sticky;
  top: 182px;
  align-self: flex-start;
  padding: 6px 0;
  order: -1;
  margin-right: 12px;
  z-index: 20;
  isolation: isolate;
}

.caa-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border: none;
  background: transparent;
  color: #69767A;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
  transition: color .15s, background .15s;
  padding: 0;
  position: relative;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.caa-btn:hover,
.caa-btn:focus-visible {
  color: #123C45;
  background: rgba(18, 60, 69, .08);
  outline: none;
}

.caa-btn svg { display: block; flex-shrink: 0; }

/* Like button — thumbs up, culoare Codex cand e apăsat */
.caa-like-btn[aria-pressed="true"] .caa-star { fill: #123C45; stroke: #123C45; }
.caa-like-btn[aria-pressed="true"] { color: #123C45; }

.caa-like-count {
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -.3px;
  margin-top: 1px;
  min-height: 12px;
  color: inherit;
}

/* Citation count */
.caa-cite-count {
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -.3px;
  margin-top: 1px;
  min-height: 12px;
  color: inherit;
}

.caa-sep {
  width: 20px;
  height: 1px;
  background: #c8d0d3;
  margin: 4px 0;
  flex-shrink: 0;
}

.caa-tooltip {
  position: absolute;
  left: 46px;
  top: 50%;
  transform: translateY(-50%);
  background: #123C45;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 6px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s;
  z-index: 10;
}

.caa-tooltip.is-visible { opacity: 1; }

/* Instant per-button tooltip (replaces native title, which has a browser hover delay) */
.caa-btn[data-tip] { position: relative; }

.caa-btn[data-tip]::after {
  content: attr(data-tip);
  position: absolute;
  left: 46px;
  top: 50%;
  transform: translateY(-50%);
  background: #123C45;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 6px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity .05s;
  z-index: 30;
}

.caa-btn[data-tip]:hover::after,
.caa-btn[data-tip]:focus-visible::after {
  opacity: 1;
}

/* Add to Shortlist — bookmark icon */
.caa-shortlist-btn[aria-pressed="true"] .caa-bookmark { fill: #123C45; stroke: #123C45; }
.caa-shortlist-btn[aria-pressed="true"] { color: #123C45; }
.caa-shortlist-proxy { display: none !important; }
.caa-shortlist-create-form { display: none !important; }

/* Add-to-list popup */
.caa-shortlist-popup {
  position: absolute;
  left: 50px;
  top: 0;
  width: 240px;
  background: #fff;
  border: 1px solid #dce3e5;
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(18, 60, 69, .15);
  z-index: 500;
  padding: 12px 14px 10px;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  isolation: isolate;
}

.caa-shortlist-lists {
  list-style: none;
  margin: 0 0 8px;
  padding: 0;
  max-height: 180px;
  overflow-y: auto;
}

.caa-shortlist-pick {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 12px;
  color: #2d3a3c;
  padding: 7px 8px;
  border-radius: 6px;
  font-family: inherit;
  overflow-wrap: anywhere;
  white-space: normal;
}

.caa-shortlist-pick:hover,
.caa-shortlist-pick:focus-visible {
  background: rgba(18, 60, 69, .08);
  color: #123C45;
  outline: none;
}

.caa-shortlist-pick.is-selected {
  font-weight: 700;
  color: #123C45;
}

.caa-shortlist-newlist {
  display: flex;
  gap: 6px;
  padding-top: 8px;
  border-top: 1px solid #edf0f1;
}

.caa-shortlist-newlist-input {
  flex: 1;
  min-width: 0;
  font-size: 12px;
  padding: 6px 8px;
  border: 1px solid #dce3e5;
  border-radius: 6px;
  font-family: inherit;
}

.caa-shortlist-newlist-submit {
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  background: #123C45;
  border: none;
  border-radius: 6px;
  padding: 6px 10px;
  cursor: pointer;
  white-space: nowrap;
}

.caa-shortlist-newlist-submit:hover { background: #0C2C35; }

.caa-shortlist-popup__msg {
  font-size: 11px;
  color: #69767A;
  margin: 8px 0 0;
}

/* Citation popup */
.caa-popup {
  position: absolute;
  left: 50px;
  top: 0;
  width: 280px;
  background: #fff;
  border: 1px solid #dce3e5;
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(18, 60, 69, .15);
  z-index: 500;
  padding: 12px 14px 10px;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  isolation: isolate;
}

.caa-popup__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid #edf0f1;
}

.caa-popup__title {
  font-size: 12px;
  font-weight: 700;
  color: #123C45;
  line-height: 1.3;
}

.caa-popup__close {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 18px;
  color: #69767A;
  padding: 0;
  line-height: 1;
  flex-shrink: 0;
}

.caa-popup__close:hover { color: #123C45; }

.caa-popup__text {
  font-size: 12px;
  color: #2d3a3c;
  line-height: 1.5;
  margin: 0 0 6px;
  font-style: italic;
}

.caa-popup__count-msg {
  font-size: 11px;
  color: #69767A;
  margin: 0;
}

@media (max-width: 640px) {
  .codex-article-actions { display: none; }
}

/* Mutat in Tassos Code Snippets Pro — snippet CSS "Codex — stiluri comune (EngageBox, ConvertForms, EDocman, Xtypo)", location=Site Header. Vezi COMPONENT_PATCHES.md. */

/* ============================================================
   CX WIP — placeholder "program în lucru", reutilizabil pe mai
   multe meniuri neterminate din Instrumente (vezi MAINTENANCE_SITE.md)
   ============================================================ */

.cx-wip {
  max-width: 620px;
  margin: 2.5rem auto;
  padding: clamp(28px, 4vw, 48px) clamp(20px, 4vw, 40px);
  text-align: center;
  background: var(--codex-white);
  border: 1px solid #e2ebe7;
  border-radius: 18px;
}

.cx-wip__icon-wrap {
  position: relative;
  width: 96px;
  height: 96px;
  margin: 0 auto 20px;
  border-radius: 50%;
  background: rgba(18, 60, 69, .08);
  display: flex;
  align-items: center;
  justify-content: center;
  animation: cx-wip-pulse 2.6s ease-in-out infinite;
}
.cx-wip__icon-wrap i {
  font-size: 40px;
  color: var(--codex-primary);
  font-style: normal !important;
}
.cx-wip__steam {
  position: absolute;
  top: -4px;
  width: 6px;
  height: 16px;
  border-radius: 999px;
  background: rgba(143, 175, 155, .6);
  filter: blur(1px);
  opacity: 0;
  animation: cx-wip-steam 2.4s ease-in infinite;
}
.cx-wip__steam--1 { left: 30px; animation-delay: 0s; }
.cx-wip__steam--2 { left: 45px; animation-delay: .6s; }
.cx-wip__steam--3 { left: 60px; animation-delay: 1.2s; }

.cx-wip__badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--codex-font-ui);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--codex-secondary);
  border: 1px solid var(--codex-secondary);
  border-radius: 999px;
  padding: 4px 14px;
  margin-bottom: 1rem;
}
.cx-wip__badge::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--codex-secondary);
}

.cx-wip__title {
  font-family: var(--codex-font-title);
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 400;
  color: var(--codex-primary);
  margin: 0 0 .9rem;
}

.cx-wip__text {
  max-width: 480px;
  margin: 0 auto 1.6rem;
  color: var(--codex-text);
  font-size: 17px;
  line-height: 1.6;
}

/* Un singur element (nu 3 <span></span> goale) — editorul WYSIWYG (JCE) șterge
   la salvare orice tag complet gol, fără atribute. Cele 3 puncte sunt generate
   din acest element + ::before/::after, imun la "curățarea" editorului. */
.cx-wip__dots {
  position: relative;
  width: 8px;
  height: 8px;
  margin: 0 auto 6px;
  border-radius: 50%;
  background: var(--codex-accent);
  animation: cx-wip-bounce 1.2s ease-in-out infinite;
}
.cx-wip__dots::before,
.cx-wip__dots::after {
  content: '';
  position: absolute;
  top: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--codex-accent);
  animation: cx-wip-bounce 1.2s ease-in-out infinite;
}
.cx-wip__dots::before { left: -14px; animation-delay: .15s; }
.cx-wip__dots::after  { left: 14px;  animation-delay: .3s; }

.cx-wip__dots-label {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: var(--codex-muted);
  margin: 0 0 1.8rem;
}

.cx-wip__cta {
  display: flex;
  justify-content: center;
  margin-bottom: .6rem;
}

.cx-wip__note {
  font-size: 14px;
  color: var(--codex-muted);
  margin: 0;
}

@keyframes cx-wip-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(18, 60, 69, .12); }
  50%      { box-shadow: 0 0 0 10px rgba(18, 60, 69, 0); }
}
@keyframes cx-wip-steam {
  0%   { transform: translateY(0) scaleX(1); opacity: 0; }
  15%  { opacity: .8; }
  100% { transform: translateY(-34px) scaleX(1.6); opacity: 0; }
}
@keyframes cx-wip-bounce {
  0%, 80%, 100% { transform: translateY(0); opacity: .5; }
  40%           { transform: translateY(-6px); opacity: 1; }
}

@media (max-width: 600px) {
  .cx-wip { margin: 1.5rem auto; padding: 28px 20px; }
}


/* ── Layout categorie "Programe Codex" (blog.php varianta: featured hero + grid 3 coloane) ── */
/* Vezi templates/cassiopeia_extended/html/com_content/category/programe.php + programe_item.php */

body.view-category .codex-programe-page .category-desc {
  margin-bottom: clamp(24px, 3vw, 40px);
}

/* Descrierea de categorie e capată implicit la 820px (lizibilitate editorială) —
   componenta .cx-video-story are nevoie de mai mult spațiu (video + citat pe
   orizontală), deci lărgim containerul DOAR când o conține. */
body.view-category .category-desc:has(.cx-video-story) {
  max-width: 1080px;
}

/* Bloc featured — mereu primul, fundal distinct */
body.view-category .codex-programe-featured {
  margin: 0 0 clamp(32px, 4vw, 56px);
}

body.view-category .codex-programe-featured .codex-list-item {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: clamp(24px, 4vw, 48px);
  align-items: center;
  min-height: auto;
  padding: clamp(30px, 4vw, 52px);
  border-radius: 22px;
  background: linear-gradient(135deg, var(--codex-primary) 0%, #0B2429 100%);
  box-shadow: 0 18px 40px rgba(18, 60, 69, .22);
}

body.view-category .codex-programe-featured .codex-list-item:not(:has(.codex-list-image)) {
  grid-template-columns: minmax(0, 1fr);
}

body.view-category .codex-programe-badge {
  display: inline-flex;
  margin: 0 0 14px;
  padding: 6px 14px;
  border-radius: 999px;
  background: var(--codex-accent);
  color: var(--codex-primary);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .075em;
  text-transform: uppercase;
}

body.view-category .codex-programe-featured .codex-list-title,
body.view-category .codex-programe-featured .codex-list-title a {
  color: var(--codex-white);
}

body.view-category .codex-programe-featured .codex-list-title {
  font-size: clamp(28px, 2.6vw, 40px);
}

body.view-category .codex-programe-featured .codex-list-intro,
body.view-category .codex-programe-featured .codex-list-intro p,
body.view-category .codex-programe-featured .codex-list-meta,
body.view-category .codex-programe-featured .codex-list-author-name,
body.view-category .codex-programe-featured .codex-list-author-text span {
  color: rgba(255, 255, 255, .88);
}

body.view-category .codex-programe-featured .codex-list-intro {
  max-width: none;
}

body.view-category .codex-programe-featured .codex-list-share,
body.view-category .codex-programe-featured .codex-readmore {
  color: var(--codex-white);
}

body.view-category .codex-programe-featured .codex-readmore {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  padding: 10px 20px;
  border-radius: 10px;
  background: var(--codex-accent);
  color: var(--codex-primary);
  font-weight: 700;
}

body.view-category .codex-programe-featured .codex-readmore:hover,
body.view-category .codex-programe-featured .codex-readmore:focus {
  background: var(--codex-accent-hover);
  color: var(--codex-white);
}

body.view-category .codex-programe-featured .codex-list-image img {
  border-radius: 14px;
}

/* Grid 3 coloane pentru restul articolelor */
body.view-category .codex-programe-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(20px, 2.4vw, 32px);
}

@media (max-width: 991px) {
  body.view-category .codex-programe-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 599px) {
  body.view-category .codex-programe-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

body.view-category .codex-programe-grid-item .codex-list-item {
  display: flex;
  flex-direction: column;
  min-height: auto;
  padding: 0;
  background: var(--codex-white);
  border: 1px solid rgba(18, 60, 69, .12);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(18, 60, 69, .06);
  transition: box-shadow .2s ease, transform .2s ease;
}

body.view-category .codex-programe-grid-item .codex-list-item:hover {
  box-shadow: 0 12px 28px rgba(18, 60, 69, .14);
  transform: translateY(-3px);
}

body.view-category .codex-programe-grid-item .codex-list-image {
  order: -1;
}

body.view-category .codex-programe-grid-item .codex-list-image img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

body.view-category .codex-programe-grid-item .codex-list-content {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  padding: 20px 22px 24px;
}

body.view-category .codex-programe-grid-item .codex-list-title {
  font-size: 20px;
}

body.view-category .codex-programe-grid-item .codex-list-intro {
  max-width: none;
  font-size: 15px;
  -webkit-line-clamp: 3;
}

body.view-category .codex-programe-grid-item .codex-readmore {
  margin-top: auto;
  padding-top: 14px;
}

/* ============================================================
   CX VIDEO STORY — bloc video + citat + CTA pentru descrierile de
   categorie (ex. "Testul de stres la igienă", categoria 169).
   Înlocuiește markup-ul vechi (inline <style>, .video-wrapper,
   .codex-quote, .codex-btn — toate nedefinite/needitate) cu
   componente reutilizabile, aliniate la brand. Video + citat pe
   orizontală (nu unul sub altul), ca să rămână compact pe înălțime.
   ============================================================ */

.cx-video-story {
  max-width: 1080px;
  margin: 0 auto clamp(40px, 5vw, 64px);
  text-align: center;
}

.cx-video-story .cx-cards-label {
  margin: 0 auto 1rem;
}

.cx-video-story__title {
  max-width: 760px;
  margin: 0 auto .6rem;
  color: var(--codex-primary);
  font-family: var(--codex-font-title);
  font-weight: 700;
  font-size: clamp(26px, 3.2vw, 36px);
  line-height: 1.18;
}

.cx-video-story__hook {
  max-width: 640px;
  margin: 0 auto clamp(28px, 3.5vw, 40px);
  color: var(--codex-muted);
  font-family: var(--codex-font-ui);
  font-size: clamp(17px, 1.6vw, 19px);
  font-weight: 600;
}

.cx-video-story__media {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: clamp(24px, 3vw, 40px);
  align-items: center;
  text-align: left;
}

@media (max-width: 760px) {
  .cx-video-story__media {
    grid-template-columns: minmax(0, 1fr);
    text-align: center;
  }
}

.cx-video-wrapper {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #0B1F24;
  overflow: hidden;
  border-radius: 16px;
  box-shadow: 0 20px 44px rgba(18, 60, 69, .16);
}

.cx-video-wrapper video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cx-video-wrapper .cx-video-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.cx-video-wrapper .cx-video-play {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  transform: translate(-50%, -50%);
  width: 84px;
  height: 84px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--codex-accent);
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 10px 26px rgba(0, 0, 0, .28);
  transition: background-color .2s ease, transform .2s ease;
}

.cx-video-wrapper .cx-video-play:hover {
  background: var(--codex-accent-hover);
  transform: translate(-50%, -50%) scale(1.06);
}

.cx-video-wrapper .cx-video-play::before {
  content: '';
  margin-left: 5px;
  border-style: solid;
  border-width: 13px 0 13px 21px;
  border-color: transparent transparent transparent var(--codex-primary);
}

.cx-video-quote {
  position: relative;
  margin: 0;
  padding: clamp(34px, 5vw, 46px) clamp(22px, 3vw, 30px) clamp(18px, 2vw, 24px);
  background: rgba(216, 154, 43, .07);
  border-left: 3px solid var(--codex-accent);
  border-radius: 0 12px 12px 0;
  color: var(--codex-primary);
  font-family: var(--codex-font-title);
  font-size: clamp(15px, 1.3vw, 17px);
  font-style: italic;
  line-height: 1.56;
  text-align: left;
}

.cx-video-quote p {
  margin: 0 0 .7em;
}

.cx-video-quote footer {
  color: var(--codex-muted);
  font-family: var(--codex-font-ui);
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
}

.cx-video-quote::before {
  content: "\201C";
  position: absolute;
  top: -10px;
  left: clamp(14px, 2vw, 20px);
  font-family: var(--codex-font-title);
  font-size: 100px;
  line-height: 1;
  color: var(--codex-accent);
  opacity: .45;
  pointer-events: none;
  user-select: none;
}

/* CTA — un singur buton "sursă" (.cx-video-story__btn) folosit pe ambele
   elemente (button[data-ebox] + <a>), ca să fie identice garantat — nu mai
   depinde deloc de stilurile [data-ebox]/.xtypo_button1 (diferă la font-size/
   padding/line-height, de-asta arătau inegale). Fără fundal, outline, egale. */
.cx-video-story__cta {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  margin-top: clamp(32px, 4vw, 44px);
}

.cx-video-story__cta .cx-video-story__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 1 260px;
  min-height: 52px;
  margin: 0;
  padding: 13px 22px;
  background: transparent;
  border: 2px solid var(--codex-primary);
  border-radius: 9px;
  color: var(--codex-primary);
  font-family: var(--codex-font-ui);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  box-shadow: none;
  transition: background-color .15s ease, color .15s ease;
}

.cx-video-story__cta .cx-video-story__btn:hover,
.cx-video-story__cta .cx-video-story__btn:focus-visible {
  background: var(--codex-primary);
  color: #fff;
}

@media (max-width: 600px) {
  .cx-video-story__cta .cx-video-story__btn {
    flex: 1 1 100%;
  }
}