/* Carte d'article (blog, articles liés, bloc « Derniers articles »).
   Même famille que les cartes du site : fond beige, filet or, rayon 10, titres Gentium. */
.card-article {
	position: relative;
	display: flex; flex-direction: column;
	height: 100%;
	background: var(--c-cream);
	border: 1px solid var(--c-line-gold);
	border-radius: var(--radius);
	overflow: hidden;
	transition: box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.card-article:hover { box-shadow: 0 10px 30px rgba(20, 41, 34, .08); border-color: rgba(169, 138, 82, .35); }
.card-article__media { position: relative; aspect-ratio: 3 / 2; overflow: hidden; background: #ece6da; }
.card-article__img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease); }
.card-article:hover .card-article__img { transform: scale(1.03); }
.card-article__placeholder { display: grid; place-items: center; width: 100%; height: 100%; color: var(--c-gold); }
.card-article__placeholder .icon { width: 64px; height: 64px; opacity: .55; }

.card-article__body { display: flex; flex-direction: column; gap: 12px; flex: 1; padding: 20px; }
.card-article__kicker { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; font-size: var(--fs-small); line-height: 1.3; letter-spacing: .04em; text-transform: uppercase; color: #7d6233; }
.card-article__label {
	display: inline-flex; align-items: center;
	padding: 5px 10px; border-radius: var(--radius-pill);
	background: var(--c-green); color: var(--c-cream);
	font-size: var(--fs-xs); letter-spacing: .06em;
}
.card-article__title { font: 400 var(--fs-h4)/1.25 var(--f-serif); color: var(--c-ink); text-wrap: pretty; }
.card-article__title a { text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .35s var(--ease); }
.card-article__title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.card-article:hover .card-article__title a { background-size: 100% 1px; }
.card-article__excerpt {
	font-size: var(--fs-body); line-height: 1.5; color: #4a524d;
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.card-article__foot {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	margin-top: auto; padding-top: 16px;
	border-top: 1px solid var(--c-line-gold);
}
.card-article__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: var(--fs-small); line-height: 1.3; color: var(--c-muted); }
.card-article__dot { width: 3px; height: 3px; border-radius: 50%; background: currentColor; }
.card-article__arrow { width: 44px; height: 44px; color: var(--c-green); }
.card-article__arrow .icon { width: 22px; height: 22px; }
.card-article:hover .card-article__arrow { background: var(--c-green); color: var(--c-cream); border-color: var(--c-green); }

/* Focus clavier : contour sur toute la carte plutôt que sur le seul titre. */
.card-article:focus-within { outline: 2px solid var(--c-gold); outline-offset: 3px; }
.card-article__title a:focus-visible { outline: none; }

/* Pastille « équipe » (pas de chirurgien auteur) */
.avatar--team { display: inline-grid; place-items: center; flex: none; background: var(--c-green); color: var(--c-cream); }
.avatar--team .icon { width: 58%; height: 58%; }

/* À la une : grande carte horizontale ------------------------------------------- */
.card-article--featured { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); min-height: clamp(420px, 36vw, 540px); }
.card-article--featured .card-article__media { aspect-ratio: auto; min-height: 100%; }
.card-article--featured .card-article__img { position: absolute; inset: 0; }
.card-article--featured .card-article__body { gap: 20px; padding: clamp(1.5rem, .8rem + 2.4vw, 3.125rem); justify-content: center; }
.card-article--featured .card-article__title { font-size: var(--fs-h3); line-height: 1.15; }
.card-article--featured .card-article__excerpt { font-size: var(--fs-lead); line-height: 1.45; -webkit-line-clamp: 4; }
.card-article--featured .card-article__foot { flex-wrap: wrap; margin-top: 12px; padding-top: 20px; }
.card-article__author { display: flex; align-items: center; gap: 12px; flex-basis: 100%; font-size: var(--fs-body); color: var(--c-ink); }
.card-article__author .avatar { width: 44px; height: 44px; }
.card-article--featured .card-article__meta { flex: 1; }
.card-article--featured .card-article__arrow { width: 50px; height: 50px; }

@media (max-width: 900px) {
	.card-article--featured { grid-template-columns: 1fr; min-height: 0; }
	.card-article--featured .card-article__media { aspect-ratio: 3 / 2; min-height: 0; }
}