/*
	Designerii.

	Folosim tokenurile temei (--verde, --chenar, --sp-*) — extensia nu-și aduce
	altă paletă și alt font. Dacă tema se schimbă, blocul se schimbă cu ea.
*/

/* Povestea gamei: text, nu chenar. Nu concurează cu blocul designerului de sub
   ea, care are fundal — două cutii colorate una peste alta ar face pagina zebră. */
.colectie {
	margin-block: var(--sp-5);
}

.colectie__titlu {
	margin: 0 0 var(--sp-2);
	font-size: var(--t-h3);
	color: var(--text);
}

.colectie__text {
	max-width: 46rem;
	margin: 0;
	line-height: 1.7;
	color: var(--text-secundar);
}

.designer {
	margin-block: var(--sp-5);
	padding: var(--sp-4);
	border: 1px solid var(--chenar);
	border-radius: var(--rotunjire);
	background: var(--fundal-verde);
}

.designer__titlu {
	margin: 0 0 var(--sp-3);
	font-size: var(--t-h3);
	color: var(--text);
}

.designer__rand {
	display: flex;
	gap: var(--sp-4);
	align-items: flex-start;
}

.designer__portret {
	flex: 0 0 auto;
	width: 96px;
	height: 96px;
	object-fit: cover;
	border-radius: 50%;
	background: var(--fundal-blanda);
}

.designer__text { min-width: 0; }

.designer__nume {
	margin: 0;
	font-weight: 600;
	font-size: var(--t-mediu);
}

.designer__nume a {
	color: var(--verde-text);
	text-decoration: none;
}

.designer__nume a:hover,
.designer__nume a:focus-visible { text-decoration: underline; }

.designer__rol {
	margin: .15em 0 var(--sp-2);
	font-size: var(--t-mic);
	color: var(--text-stins);
}

/* Citatul: ghilimeaua e decor, deci nu intră în textul citit cu voce tare. */
.designer__citat,
.designer-fisa__citat {
	position: relative;
	margin: 0;
	padding-left: var(--sp-4);
	border-left: 3px solid var(--verde);
	font-style: italic;
	color: var(--text-secundar);
	line-height: 1.6;
}

.designer__rezumat {
	margin: 0;
	color: var(--text-secundar);
}

/* --- pagina designerului --- */

.designer-fisa { margin-block: var(--sp-6); }

.designer-fisa__cap {
	display: flex;
	gap: var(--sp-4);
	align-items: center;
	margin-bottom: var(--sp-5);
}

.designer-fisa__portret {
	width: 160px;
	height: 160px;
	object-fit: cover;
	border-radius: 50%;
	background: var(--fundal-blanda);
}

.designer-fisa__nume {
	margin: 0;
	font-size: var(--t-h1);
	color: var(--text);
}

.designer-fisa__rol {
	margin: .2em 0 0;
	color: var(--text-stins);
}

.designer-fisa__citat {
	max-width: 46rem;
	margin-bottom: var(--sp-5);
	font-size: var(--t-mediu);
}

.designer-fisa__poveste {
	max-width: 46rem;
	margin-bottom: var(--sp-5);
	line-height: 1.7;
}

.designer-fisa__game {
	margin-bottom: var(--sp-5);
	font-size: var(--t-mic);
	color: var(--text-stins);
}

.designer-fisa__produse h2 {
	margin: 0 0 var(--sp-4);
	font-size: var(--t-h2);
}

@media (max-width: 40rem) {
	.designer__rand,
	.designer-fisa__cap {
		flex-direction: column;
		align-items: flex-start;
	}
}