/* =============================================================
   Paginile redactionale: Despre noi, Noutăți, Pentru firme,
   paginile legale.

   Se incarca numai pe ele, din inc/assets.php, si lucreaza pe
   marcajul pus de inc/editorial.php peste blocurile obisnuite.
   Nimic de aici nu atinge cosul, finalizarea comenzii sau
   paginile cu sablon propriu: toate regulile pornesc de la
   clasa `.bx-editoriala` de pe <body>.

   Latimea: pina acum corpul paginii statea pe 820px, intr-o
   rama de 1280px, deci textul incepea cu 230px in dreapta
   siglei. Acum rama e aceeasi cu a antetului si a subsolului,
   1280px, iar masura de citit se tine din coloana de cuprins
   si dintr-un `max-width` pe proza, nu din ingustarea paginii.
   ============================================================= */

.bx-editoriala .wp-block-post-title,
.bx-editoriala .wp-block-post-featured-image {
	/* Titlul si imaginea reprezentativa se rescriu in banda de sus. */
	display: none;
}

.bx-editoriala .wp-block-post-content {
	max-width: 1280px;
	margin-inline: auto;
}

/*
 * Blocul de continut din page.html isi tine copiii pe masura de citit a
 * temei, 820px. Pe paginile redactionale rama e cea a antetului, deci
 * regula se ridica aici, nu in sablon: sablonul e acelasi pentru cos si
 * pentru finalizarea comenzii, iar acolo latimea trebuie sa ramina cum e.
 */
.bx-editoriala .wp-block-post-content > * {
	max-width: 1280px;
}

.bx-ed {
	--bx-ed-albastru: var(--wp--preset--color--albastru, #1f6fd0);
	--bx-ed-umbra: rgba(10, 36, 74, 0.08);
	display: flow-root;
}

/* -------------------------------------------------------------
   Banda de titlu
   ------------------------------------------------------------- */

.bx-ed__erou {
	position: relative;
	overflow: hidden;
	padding: clamp(2.25rem, 1.2rem + 3.4vw, 4rem) clamp(1.25rem, 0.4rem + 2.6vw, 3.5rem);
	border: 1px solid var(--wp--preset--color--linie, #e0e0e0);
	border-radius: 18px;
	background-color: #f7f9fc;
	background-image:
		/* Acelasi fir de textura ca subsolul, dus pe fundal deschis. */
		repeating-linear-gradient(
			135deg,
			rgba(31, 111, 208, 0.045) 0,
			rgba(31, 111, 208, 0.045) 2px,
			rgba(31, 111, 208, 0) 2px,
			rgba(31, 111, 208, 0) 7px
		),
		radial-gradient(900px 420px at 92% -30%, rgba(31, 111, 208, 0.16), rgba(31, 111, 208, 0) 64%),
		radial-gradient(620px 320px at -6% 120%, rgba(31, 111, 208, 0.10), rgba(31, 111, 208, 0) 62%);
}

/*
 * Firul de accent de pe muchia de sus. Doua culori ale marcii,
 * nu una: aceeasi semnatura ca pastila de cos si butoanele.
 */
.bx-ed__erou::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 4px;
	background: linear-gradient(90deg, var(--bx-ed-albastru) 0%, #4a60c1 52%, var(--wp--preset--color--rosu, #fe2d34) 100%);
}

.bx-ed__erou-corp {
	max-width: 44rem;
}

.bx-ed__fir {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.45rem;
	margin: 0 0 0.9rem;
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: var(--wp--preset--color--text-stins, #606562);
}

.bx-ed__fir a {
	color: inherit;
	text-decoration: none;
}

.bx-ed__fir a:hover {
	color: var(--bx-ed-albastru);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.bx-ed__fir span[aria-hidden="true"] {
	opacity: 0.45;
}

.bx-ed__fir [aria-current="page"] {
	color: var(--wp--preset--color--text, #1a211e);
}

.bx-ed__titlu {
	margin: 0;
	font-size: var(--wp--preset--font-size--erou, 3rem);
	font-weight: 800;
	line-height: 1.08;
	letter-spacing: -0.028em;
	color: var(--wp--preset--color--text, #1a211e);
	text-wrap: balance;
}

.bx-ed__intro {
	margin: 1rem 0 0;
	max-width: 36rem;
	font-size: var(--wp--preset--font-size--mediu, 1.25rem);
	line-height: 1.6;
	color: var(--wp--preset--color--text-secundar, #4e4e4e);
}

/* -------------------------------------------------------------
   Asezarea: cuprins lipit la derulare + coloana de proza
   ------------------------------------------------------------- */

.bx-ed__grila {
	margin-top: clamp(2rem, 1.2rem + 2.2vw, 3.25rem);
}

.bx-ed__grila--cuprins {
	display: grid;
	grid-template-columns: 15rem minmax(0, 1fr);
	gap: clamp(2rem, 1rem + 3vw, 4.5rem);
	align-items: start;
}

/*
 * Masura de citit nu se tine din latimea coloanei, ci din fiecare
 * element de text in parte. Asa, un rind de produse sau o imagine
 * pot iesi peste masura fara margini negative si fara socoteli de
 * latime: coloana e lata, textul din ea nu.
 */
.bx-ed__proza {
	max-width: none;
}

.bx-ed__proza > p,
.bx-ed__proza > ul,
.bx-ed__proza > ol,
.bx-ed__proza > h2,
.bx-ed__proza > h3,
.bx-ed__proza > h4,
.bx-ed__proza > blockquote,
.bx-ed__proza > hr,
.bx-ed__proza > .wp-block-separator,
.bx-ed__proza > .wp-block-table,
.bx-ed__proza > table {
	max-width: 46rem;
}

/*
 * Fara cuprins, textul se centreaza in rama lata, ca sa nu ramina
 * lipit de marginea stinga a unei pagini de 1280px.
 */
.bx-ed__grila:not(.bx-ed__grila--cuprins) .bx-ed__proza > * {
	margin-inline: auto;
}

/*
 * Exceptia: pe o pagina care are si un bloc lat, adica un rind de produse,
 * centrarea strica alinierea. Blocul lat tine toata coloana, textul tine 46rem
 * centrate in ea, deci titlul si paragraful incep cu vreo 120px in dreapta
 * primului card. Arata ca doua machete puse una peste alta, si asa se si
 * vedea pe Noutati. Cind exista un bloc lat, textul se aliniaza cu el.
 */
.bx-ed--are-lat .bx-ed__grila:not(.bx-ed__grila--cuprins) .bx-ed__proza > * {
	margin-inline: 0;
}

/* Blocul care are voie sa treaca peste masura: randul de produse. */
.bx-ed__lat {
	margin: clamp(2rem, 1.4rem + 1.6vw, 3rem) 0;
	max-width: none;
}

.bx-ed__lat .bx-grila {
	margin: 0;
}

.bx-ed__cuprins {
	position: sticky;
	top: calc(var(--wp--custom--bara--inaltime, 64px) + 1.5rem);
	padding-left: 1rem;
	border-left: 2px solid var(--wp--preset--color--linie, #e0e0e0);
}

.bx-ed__cuprins-titlu {
	margin: 0 0 0.85rem;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-stins, #606562);
}

.bx-ed__cuprins ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
}

.bx-ed__cuprins a {
	display: block;
	font-size: 0.875rem;
	line-height: 1.45;
	color: var(--wp--preset--color--text-secundar, #4e4e4e);
	text-decoration: none;
	transition: color var(--wp--custom--tranzitie, 160ms ease), transform var(--wp--custom--tranzitie, 160ms ease);
}

.bx-ed__cuprins a:hover {
	color: var(--bx-ed-albastru);
	transform: translateX(2px);
}

/* -------------------------------------------------------------
   Tipografia corpului
   ------------------------------------------------------------- */

.bx-ed__proza > :first-child {
	margin-top: 0;
}

.bx-ed__proza p {
	margin: 0 0 1.15rem;
	font-size: 1.0625rem;
	line-height: 1.75;
	color: var(--wp--preset--color--text-secundar, #4e4e4e);
}

.bx-ed__proza h2 {
	margin: 2.75rem 0 1rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--wp--preset--color--linie, #e0e0e0);
	font-size: clamp(1.4rem, 1.15rem + 0.9vw, 1.875rem);
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.02em;
	color: var(--wp--preset--color--text, #1a211e);
	scroll-margin-top: calc(var(--wp--custom--bara--inaltime, 64px) + 2rem);
}

.bx-ed__proza > h2:first-child {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}

.bx-ed__proza h3 {
	margin: 1.9rem 0 0.6rem;
	font-size: 1.1875rem;
	font-weight: 700;
	line-height: 1.3;
	color: var(--wp--preset--color--text, #1a211e);
	scroll-margin-top: calc(var(--wp--custom--bara--inaltime, 64px) + 2rem);
}

.bx-ed__proza a:not(.wp-element-button) {
	color: var(--bx-ed-albastru);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	text-decoration-color: rgba(31, 111, 208, 0.35);
	transition: text-decoration-color var(--wp--custom--tranzitie, 160ms ease);
}

.bx-ed__proza a:not(.wp-element-button):hover {
	text-decoration-color: currentColor;
}

/*
 * Listele: marcaj propriu, nu bulina implicita.
 *
 * Numai listele care sint CHIAR copii ai prozei. Scris la inceput ca
 * `.bx-ed__proza ul`, marcajul cadea si pe grila de produse, care e tot
 * o lista: fiecare card primea un romb albastru in coltul din stinga-sus
 * si un spatiu gol in stinga textului. Grila sta in `.bx-ed__lat`, deci
 * nu e copil direct, iar selectorul de copil direct o lasa in pace.
 */
.bx-ed__proza > ul {
	margin: 0 0 1.3rem;
	padding: 0;
	list-style: none;
}

.bx-ed__proza > ul > li {
	position: relative;
	margin-bottom: 0.65rem;
	padding-left: 1.6rem;
	font-size: 1.0625rem;
	line-height: 1.7;
	color: var(--wp--preset--color--text-secundar, #4e4e4e);
}

.bx-ed__proza > ul > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.72em;
	width: 7px;
	height: 7px;
	border-radius: 2px;
	background: var(--bx-ed-albastru);
	transform: rotate(45deg);
}

.bx-ed__proza > ol {
	margin: 0 0 1.3rem;
	padding-left: 1.3rem;
	counter-reset: bx-numar;
	list-style: none;
}

.bx-ed__proza > ol > li {
	position: relative;
	margin-bottom: 0.65rem;
	padding-left: 0.75rem;
	font-size: 1.0625rem;
	line-height: 1.7;
	color: var(--wp--preset--color--text-secundar, #4e4e4e);
	counter-increment: bx-numar;
}

.bx-ed__proza > ol > li::before {
	content: counter(bx-numar);
	position: absolute;
	left: -1.3rem;
	top: 0.1em;
	width: 1.5rem;
	font-size: 0.8125rem;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	color: var(--bx-ed-albastru);
}

.bx-ed__proza strong {
	color: var(--wp--preset--color--text, #1a211e);
	font-weight: 700;
}

.bx-ed__proza blockquote {
	margin: 1.75rem 0;
	padding: 1.25rem 1.5rem;
	border: 0;
	border-left: 3px solid var(--bx-ed-albastru);
	border-radius: 0 10px 10px 0;
	background: #f4f7fb;
}

.bx-ed__proza blockquote p:last-child {
	margin-bottom: 0;
}

/* Tabelele paginilor legale: cap gri, rinduri alternante, fara chenar dublu. */
.bx-ed__proza table,
.bx-ed__proza .wp-block-table table {
	width: 100%;
	border-collapse: collapse;
	margin: 1.5rem 0;
	font-size: 0.9375rem;
	border: 1px solid var(--wp--preset--color--linie, #e0e0e0);
	border-radius: 10px;
	overflow: hidden;
}

.bx-ed__proza th,
.bx-ed__proza td {
	padding: 0.75rem 1rem;
	border: 0;
	border-bottom: 1px solid var(--wp--preset--color--linie, #e0e0e0);
	text-align: left;
	vertical-align: top;
}

.bx-ed__proza th {
	background: var(--wp--preset--color--fundal-bland, #eef1f0);
	font-weight: 700;
	color: var(--wp--preset--color--text, #1a211e);
}

.bx-ed__proza tr:last-child td {
	border-bottom: 0;
}

/* Separatorul dintre parti, cind pagina are unul scris. */
.bx-ed__proza hr,
.bx-ed__proza .wp-block-separator {
	margin: 2.5rem 0;
	border: 0;
	border-top: 1px solid var(--wp--preset--color--linie, #e0e0e0);
}

/*
 * Numarul de telefon si eticheta lui raman pe acelasi rind. Pus de
 * `bicopyx_editorial_leaga_telefoanele()`, nu scris in text: asa il primesc si
 * paginile scrise de aici incolo, fara sa isi aminteasca nimeni regula.
 */
.bx-nerupt {
	white-space: nowrap;
}

/* -------------------------------------------------------------
   Banda de contact de la final

   Prima varianta era albastra, ca subsolul. Masurat pe pagina
   vie: banda ajungea lipita de subsol, deci doua suprafete
   albastre una peste alta, care se citeau ca una singura si
   inghiteau indemnul. Banda ramine deci deschisa, din acelasi
   material ca banda de titlu de sus, iar albastrul se pastreaza
   pentru butonul principal, unde chiar trage ochiul.
   ------------------------------------------------------------- */

.bx-banda {
	position: relative;
	overflow: hidden;
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: clamp(1.5rem, 0.8rem + 2.2vw, 3rem);
	align-items: center;
	margin-top: clamp(3rem, 2rem + 3vw, 4.5rem);
	margin-bottom: clamp(2.5rem, 1.6rem + 2.4vw, 3.75rem);
	padding: clamp(1.75rem, 1rem + 2.4vw, 2.75rem) clamp(1.5rem, 0.8rem + 2.4vw, 3rem);
	border: 1px solid var(--wp--preset--color--linie, #e0e0e0);
	border-radius: 18px;
	background-color: #f7f9fc;
	background-image:
		repeating-linear-gradient(
			135deg,
			rgba(31, 111, 208, 0.045) 0,
			rgba(31, 111, 208, 0.045) 2px,
			rgba(31, 111, 208, 0) 2px,
			rgba(31, 111, 208, 0) 7px
		),
		radial-gradient(900px 420px at 94% -26%, rgba(31, 111, 208, 0.16), rgba(31, 111, 208, 0) 64%),
		radial-gradient(620px 340px at -4% 124%, rgba(254, 45, 52, 0.07), rgba(254, 45, 52, 0) 62%);
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04), 0 14px 36px rgba(16, 58, 112, 0.08);
}

.bx-banda::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 4px;
	background: linear-gradient(90deg, var(--bx-ed-albastru) 0%, #4a60c1 52%, var(--wp--preset--color--rosu, #fe2d34) 100%);
}

.bx-banda__supra {
	margin: 0 0 0.35rem;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--bx-ed-albastru);
}

.bx-banda__titlu {
	margin: 0;
	font-size: clamp(1.25rem, 1rem + 1vw, 1.75rem);
	font-weight: 800;
	line-height: 1.22;
	letter-spacing: -0.02em;
	color: var(--wp--preset--color--text, #1a211e);
}

.bx-banda__nota {
	margin: 0.5rem 0 0;
	font-size: 0.9375rem;
	color: var(--wp--preset--color--text-secundar, #4e4e4e);
}

.bx-banda__butoane {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.bx-banda__buton {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	padding: 0.7rem 1.1rem;
	border: 1px solid var(--wp--preset--color--linie-tare, #cccfcd);
	border-radius: 10px;
	background: #fff;
	font-size: 0.9375rem;
	font-weight: 700;
	line-height: 1.2;
	color: var(--wp--preset--color--text, #1a211e);
	text-decoration: none;
	transition:
		transform var(--wp--custom--tranzitie, 160ms ease),
		border-color var(--wp--custom--tranzitie, 160ms ease),
		background-color var(--wp--custom--tranzitie, 160ms ease),
		box-shadow var(--wp--custom--tranzitie, 160ms ease);
}

.bx-banda__buton span {
	display: flex;
	flex-direction: column;
	line-height: 1.2;
}

.bx-banda__buton small {
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	opacity: 0.68;
}

.bx-banda__buton:hover {
	border-color: var(--bx-ed-albastru);
	color: var(--wp--preset--color--albastru-apasat, #1a5cad);
	box-shadow: 0 8px 20px rgba(31, 111, 208, 0.14);
	transform: translateY(-2px);
}

/* Butonul principal: albastrul plin, singurul de pe banda. */
.bx-banda__buton--tare {
	background: var(--bx-ed-albastru);
	border-color: var(--bx-ed-albastru);
	color: #fff;
}

.bx-banda__buton--tare:hover {
	background: var(--wp--preset--color--albastru-apasat, #1a5cad);
	border-color: var(--wp--preset--color--albastru-apasat, #1a5cad);
	color: #fff;
	box-shadow: 0 10px 26px rgba(31, 111, 208, 0.3);
}

.bx-banda__buton--sters {
	background: transparent;
	border-style: dashed;
	color: var(--wp--preset--color--text-secundar, #4e4e4e);
}

.bx-banda__buton:focus-visible,
.bx-ed__cuprins a:focus-visible {
	outline: 2px solid var(--bx-ed-albastru);
	outline-offset: 3px;
}

/* -------------------------------------------------------------
   Ecrane mici
   ------------------------------------------------------------- */

@media (max-width: 1100px) {
	.bx-ed__grila--cuprins {
		grid-template-columns: 13rem minmax(0, 1fr);
	}
}

@media (max-width: 900px) {
	/*
	 * Sub 900px cuprinsul nu mai sta lipit intr-o coloana proprie:
	 * trece deasupra textului, ca o lista scurta de sarituri.
	 */
	.bx-ed__grila--cuprins {
		display: block;
	}

	.bx-ed__cuprins {
		position: static;
		margin-bottom: 2rem;
		padding: 1.1rem 1.25rem;
		border-left: 0;
		border: 1px solid var(--wp--preset--color--linie, #e0e0e0);
		border-radius: 12px;
		background: var(--wp--preset--color--fundal-bland, #eef1f0);
	}

	.bx-ed__cuprins ul {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 0.5rem 1.25rem;
	}

	.bx-ed__proza {
		max-width: none;
	}

	.bx-banda {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 600px) {
	.bx-ed__erou {
		border-radius: 14px;
	}

	/*
	 * Pe telefon cuprinsul revine la un titlu pe rind. Asezat pe
	 * rinduri, un titlu scurt ramine linga capatul unuia lung si
	 * cele doua se citesc ca unul singur.
	 */
	.bx-ed__cuprins ul {
		flex-direction: column;
		gap: 0.55rem;
	}

	.bx-banda {
		border-radius: 14px;
	}

	.bx-banda__butoane {
		flex-direction: column;
		align-items: stretch;
	}

	.bx-banda__buton {
		justify-content: center;
	}
}

@media (prefers-reduced-motion: reduce) {
	.bx-ed__cuprins a,
	.bx-banda__buton {
		transition: none;
	}

	.bx-ed__cuprins a:hover,
	.bx-banda__buton:hover {
		transform: none;
	}
}

/* -------------------------------------------------------------
   Blogul: articolul si arhiva lui
   Scris pe 21 octombrie 2026, cerut de Radu, care nu gasea
   blogul in meniu si a cerut articole de calitate premium.

   Articolul foloseste stratul redactional intreg (banda de
   titlu, cuprins lipit, masura de citit), deci aici stau numai
   piesele care exista doar la el: randul cu data si timpul de
   citit, poza de deschidere si cardurile de la final.
   ------------------------------------------------------------- */

/* Randul cu data, timpul de citit si categoria, sub introducere. */
.bx-art__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem 0.75rem;
	margin: 1.25rem 0 0;
	font-size: var(--wp--preset--font-size--mic);
	color: var(--wp--preset--color--text-secundar, #4e4e4e);
}

.bx-art__punct {
	color: var(--wp--preset--color--linie-tare, #cccfcd);
}

.bx-art__data {
	font-weight: 600;
	color: var(--wp--preset--color--text, #1a211e);
}

/*
 * Categoria e o pastila, nu o legatura in text: randul are trei informatii
 * de acelasi fel, iar singura pe care se apasa trebuie sa se vada ca atare.
 * Inaltimea e 44px, masura ceruta pentru tintele de apasat.
 */
.bx-art__categorie {
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
	padding: 0 0.85rem;
	border: 1px solid var(--wp--preset--color--linie-tare, #cccfcd);
	border-radius: var(--wp--custom--raza--rotund, 999px);
	background: #fff;
	font-weight: 600;
	color: var(--wp--preset--color--text, #1a211e);
	text-decoration: none;
	transition: border-color var(--wp--custom--tranzitie, 160ms ease), background-color var(--wp--custom--tranzitie, 160ms ease);
}

.bx-art__categorie:hover {
	border-color: var(--bx-ed-albastru, #1f6fd0);
	color: var(--bx-ed-albastru, #1f6fd0);
	text-decoration: none;
}

/*
 * Poza de deschidere: cat latimea antetului, intre banda de titlu si text.
 * Raportul e fixat, ca sa nu sara asezarea in timp ce imaginea se incarca;
 * `aspect-ratio` plus `object-fit` tin cadrul si cand fotografia are alta
 * forma decat cea asteptata.
 */
.bx-art__poza {
	margin: 0 0 var(--wp--preset--spacing--40, 2.5rem);
}

.bx-art__poza-fisier {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: var(--wp--custom--raza--normala, 12px);
	border: 1px solid var(--wp--preset--color--linie, #e4e7e6);
	background: var(--wp--preset--color--fundal-bland, #eef1f0);
}

.bx-art__poza-credit {
	margin: 0.6rem 0 0;
	font-size: var(--wp--preset--font-size--mic);
	color: var(--wp--preset--color--text-stins, #606562);
}

/* ---- Articolele inrudite, de la finalul articolului ---- */

.bx-art-inrudite {
	margin: var(--wp--preset--spacing--50, 3.5rem) 0 var(--wp--preset--spacing--40, 2.5rem);
	padding-top: var(--wp--preset--spacing--40, 2.5rem);
	border-top: 1px solid var(--wp--preset--color--linie, #e4e7e6);
}

.bx-art-inrudite__titlu {
	margin: 0 0 1.5rem;
	font-size: var(--wp--preset--font-size--titlu);
	font-weight: 700;
	line-height: 1.2;
	color: var(--wp--preset--color--text, #1a211e);
}

.bx-art-inrudite__grila {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
	gap: var(--wp--preset--spacing--30, 1.5rem);
	margin: 0;
	padding: 0;
	list-style: none;
}

/*
 * Toata suprafata cardului duce in articol, nu doar cele doua randuri de
 * titlu: pe telefon o tinta de 44px inaltime e minimul, iar aici cardul
 * intreg e tinta. Legatura se intinde peste card cu un pseudo-element,
 * deci asezarea nu se schimba.
 */
.bx-art-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
	margin: 0;
}

.bx-art-card__poza {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	border-radius: var(--wp--custom--raza--normala, 12px);
	border: 1px solid var(--wp--preset--color--linie, #e4e7e6);
	background: var(--wp--preset--color--fundal-bland, #eef1f0);
}

.bx-art-card__text {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}

.bx-art-card__data {
	margin: 0;
	font-size: var(--wp--preset--font-size--mic);
	color: var(--wp--preset--color--text-stins, #606562);
}

.bx-art-card__titlu {
	margin: 0;
	font-size: var(--wp--preset--font-size--normal);
	font-weight: 700;
	line-height: 1.35;
}

.bx-art-card__titlu a {
	color: var(--wp--preset--color--text, #1a211e);
	text-decoration: none;
}

.bx-art-card__titlu a::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: var(--wp--custom--raza--normala, 12px);
}

.bx-art-card:hover .bx-art-card__titlu a {
	color: var(--bx-ed-albastru, #1f6fd0);
}

.bx-art-card__titlu a:focus-visible::after {
	outline: 2px solid var(--wp--preset--color--albastru-apasat, #17539c);
	outline-offset: 3px;
}

/* ---- Arhiva: /blog-bicopyx/ ---- */

.bx-arh {
	margin-top: var(--wp--preset--spacing--40, 2.5rem);
}

/*
 * Banda de titlu a arhivei e sora bandei din articol: acelasi fir de
 * navigare, acelasi fel de titlu. Stilul firului vine din `.bx-ed__fir`,
 * deci aici se scrie doar ce difera.
 */
.bx-arh__erou {
	margin-bottom: var(--wp--preset--spacing--40, 2.5rem);
	padding-bottom: var(--wp--preset--spacing--40, 2.5rem);
	border-bottom: 1px solid var(--wp--preset--color--linie, #e4e7e6);
}

.bx-arh__titlu {
	margin: 0.75rem 0 0;
	font-size: var(--wp--preset--font-size--erou);
	font-weight: 800;
	line-height: 1.08;
	letter-spacing: -0.02em;
	color: var(--wp--preset--color--text, #1a211e);
}

.bx-arh__intro {
	max-width: 46rem;
	margin: 1rem 0 0;
	font-size: var(--wp--preset--font-size--mediu);
	line-height: 1.55;
	color: var(--wp--preset--color--text-secundar, #4e4e4e);
}

.bx-arh__intro p:last-child {
	margin-bottom: 0;
}

.bx-arh__lista .wp-block-post-template {
	gap: var(--wp--preset--spacing--40, 2.5rem) var(--wp--preset--spacing--30, 1.5rem);
	margin: 0;
	padding: 0;
	list-style: none;
}

.bx-arh__lista .wp-block-post {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.bx-arh__poza img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
	border: 1px solid var(--wp--preset--color--linie, #e4e7e6);
	background: var(--wp--preset--color--fundal-bland, #eef1f0);
}

.bx-arh__data {
	margin: 0;
	color: var(--wp--preset--color--text-stins, #606562);
}

.bx-arh__card-titlu {
	margin: 0;
	font-weight: 700;
	line-height: 1.25;
}

.bx-arh__card-titlu a {
	color: var(--wp--preset--color--text, #1a211e);
	text-decoration: none;
}

/* Cardul intreg e tinta, la fel ca la inrudite. */
.bx-arh__card-titlu a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.bx-arh__lista .wp-block-post:hover .bx-arh__card-titlu a {
	color: var(--bx-ed-albastru, #1f6fd0);
}

.bx-arh__card-titlu a:focus-visible::after {
	outline: 2px solid var(--wp--preset--color--albastru-apasat, #17539c);
	outline-offset: 4px;
	border-radius: var(--wp--custom--raza--normala, 12px);
}

.bx-arh__extras {
	margin: 0;
	font-size: var(--wp--preset--font-size--normal);
	line-height: 1.6;
	color: var(--wp--preset--color--text-secundar, #4e4e4e);
}

/*
 * Legatura "Citeste articolul" din extras sta deasupra legaturii care
 * acopera cardul, altfel ar fi acoperita de ea si nu s-ar mai putea apasa.
 * Nu e o a doua destinatie, e aceeasi: ridicata doar ca sa nu para moarta.
 */
.bx-arh__extras .wp-block-post-excerpt__more-link {
	position: relative;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
	font-weight: 600;
	color: var(--bx-ed-albastru, #1f6fd0);
}

.bx-arh__gol {
	max-width: 46rem;
	font-size: var(--wp--preset--font-size--mediu);
	color: var(--wp--preset--color--text-secundar, #4e4e4e);
}

.bx-arh__pagini {
	margin-top: var(--wp--preset--spacing--50, 3.5rem);
	padding-top: var(--wp--preset--spacing--30, 1.5rem);
	border-top: 1px solid var(--wp--preset--color--linie, #e4e7e6);
}

.bx-arh__pagini a,
.bx-arh__pagini .page-numbers {
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
	padding: 0 0.75rem;
	font-weight: 600;
	color: var(--wp--preset--color--text, #1a211e);
	text-decoration: none;
}

.bx-arh__pagini a:hover {
	color: var(--bx-ed-albastru, #1f6fd0);
}

/* Pe telefon cardurile curg una sub alta, pe toata latimea. */
@media (max-width: 781px) {
	.bx-arh__lista .wp-block-post-template.is-layout-grid {
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	.bx-art__categorie {
		transition: none;
	}
}

/*
 * Butoanele bandei de contact, 21 octombrie 2026: 42 de pixeli masurati,
 * sub masura de 44 ceruta pentru tintele de apasat. Umplutura rimane cum e,
 * creste doar inaltimea minima.
 */
.bx-banda__buton {
	min-height: 2.75rem;
}