/*
 * Rangée « Aktuelles » : une vidéo (16:9) et des posts Instagram (4:5) en cartes.
 * Couleurs, polices et espacements : presets theme.json du thème Nomoss, avec repli.
 * Mouvement : gris → couleur au survol, révélation au défilement en CSS seul, rien sous
 * prefers-reduced-motion.
 */
.nomoss-aktuelles{
	--na-vert:var(--wp--preset--color--accent-1,#336633);
	--na-laiton:var(--wp--preset--color--accent-3,#8A6D3B);
	--na-gris:var(--wp--preset--color--accent-4,#5F635F);
	--na-papier:var(--wp--preset--color--accent-5,#ECE7DC);
	--na-encre:var(--wp--preset--color--contrast,#1F2420);
	--na-fond:var(--wp--preset--color--base,#F7F5F0);
	--na-titre:var(--wp--preset--font-family--oswald,inherit);
	--na-petit:var(--wp--preset--font-size--small,.875rem);
	--na-grand:var(--wp--preset--font-size--large,1.25rem);
	--na-pad:var(--wp--preset--spacing--80,4rem);
	--na-gap:var(--wp--preset--spacing--50,1.5rem);
	container-type:inline-size;
	padding-block:var(--na-pad);
	padding-inline:var(--na-gap)
}
.nomoss-aktuelles__inner{max-width:1200px;margin-inline:auto}
.nomoss-aktuelles__head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:var(--na-gap);margin-bottom:var(--na-gap)}
.nomoss-aktuelles__head h2{margin:.2em 0 0}
.nomoss-aktuelles__links{margin:0;font-family:var(--na-titre);text-transform:uppercase;letter-spacing:.08em;font-size:var(--na-petit)}
.nomoss-aktuelles__links a{text-decoration:none;color:var(--na-gris)}
.nomoss-aktuelles__links a:hover,.nomoss-aktuelles__links a:focus-visible{color:var(--na-vert)}

.nomoss-aktuelles__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:var(--na-gap);align-items:start}
/* Avec des posts Instagram : la vidéo prend deux colonnes (1 vidéo + 3 posts = 5 colonnes). Seule : au plus 720 px. */
.has-instagram.nomoss-aktuelles__grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))}
@container (min-width:620px){.has-instagram .nomoss-aktuelles__card.is-youtube{grid-column:span 2}}
.nomoss-aktuelles__card:only-child{max-width:720px}

.nomoss-aktuelles__card{margin:0;display:grid;gap:.8em}
.nomoss-aktuelles__media{position:relative;display:block;overflow:hidden;border-radius:2px;background:var(--na-papier);aspect-ratio:4/5}
.is-youtube .nomoss-aktuelles__media{aspect-ratio:16/9}
.nomoss-aktuelles__media img{display:block;width:100%;height:100%;object-fit:cover;transition:filter .3s ease,transform .3s ease}
.nomoss-aktuelles__card:hover img,.nomoss-aktuelles__card:focus-within img{transform:scale(1.02)}
@media (hover:hover){
	.nomoss-aktuelles__media img{filter:grayscale(1)}
	.nomoss-aktuelles__card:hover img,.nomoss-aktuelles__card:focus-within img{filter:none}
}
.nomoss-aktuelles__iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

.nomoss-aktuelles__play{position:absolute;inset:0;width:100%;border:0;padding:0;background:transparent;cursor:pointer;display:grid;place-items:center;color:var(--na-fond)}
.nomoss-aktuelles__play svg{width:64px;height:64px;opacity:.9;transition:opacity .2s,transform .2s}
.nomoss-aktuelles__play circle{fill:var(--na-vert);stroke:var(--na-fond);stroke-width:1.5}
.nomoss-aktuelles__play path{fill:currentColor}
.nomoss-aktuelles__card:hover .nomoss-aktuelles__play svg,.nomoss-aktuelles__play:focus-visible svg{opacity:1;transform:scale(1.08)}
.nomoss-aktuelles__play:focus-visible{outline:2px solid var(--na-vert);outline-offset:-2px}

.nomoss-aktuelles__text{display:grid;gap:.25em}
.nomoss-aktuelles__meta{margin:0;font-family:var(--na-titre);text-transform:uppercase;letter-spacing:.12em;font-size:var(--na-petit);color:var(--na-gris)}
.nomoss-aktuelles__badge{color:var(--na-laiton);margin-inline-end:.6em}
.nomoss-aktuelles__title{margin:0;font-family:var(--na-titre);font-weight:500;line-height:1.25;font-size:var(--na-grand);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.is-instagram .nomoss-aktuelles__title{font-family:inherit;font-weight:400;font-size:inherit;line-height:1.45}
.nomoss-aktuelles__title a{color:inherit;text-decoration:none}
.nomoss-aktuelles__title a:hover,.nomoss-aktuelles__title a:focus-visible{text-decoration:underline;text-underline-offset:.15em}

@media (prefers-reduced-motion:no-preference){
	@supports (animation-timeline:view()){
		.nomoss-aktuelles__card{animation:nomoss-aktuelles-reveal linear both;animation-timeline:view();animation-range:entry 0% entry 35%}
		@keyframes nomoss-aktuelles-reveal{from{opacity:.15;transform:translateY(18px)}}
	}
}
@media (prefers-reduced-motion:reduce){
	.nomoss-aktuelles__media img,.nomoss-aktuelles__play svg{transition:none}
	.nomoss-aktuelles__card:hover img,.nomoss-aktuelles__card:focus-within img{transform:none}
}