/* ==========================================================================
   Illustrationslagret — delad bas
   ==========================================================================
   Används både av sidintro-modulen och av radinställningarna. Positionen för
   varje motiv skrivs per nod; här ligger bara det som är lika överallt.
   ========================================================================== */

.fs-dekor {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	overflow: hidden;
}

.fs-ill {
	position: absolute;
	width: auto;
	max-width: none;

	/* Motivets lutning. Sätts per motiv av den automatiska placeringen och
	   ligger i en variabel just för att driftens keyframes måste kunna
	   återskapa den — en transform i en animation ersätter hela den statiska,
	   och utan variabeln skulle motivet räta upp sig i första bildrutan. */
	--fs-rot: 0deg;
}

/* Dekoren ligger absolut mot .fl-row-content-wrap. BB positionerar den för
   sina egna bakgrundslager, men vi förlitar oss inte på det — utan en
   positionerad förälder skulle motiven hamna mot sidan i stället för raden. */
.fs-rad-har-dekor > .fl-row-content-wrap {
	position: relative;
}

/* Radens innehåll måste ligga över dekoren. */
.fs-rad-har-dekor > .fl-row-content-wrap > .fl-row-content {
	position: relative;
	z-index: 2;
}

/* --- Drift ---------------------------------------------------------------
   Fyra varianter, eftersom transformen måste återskapas i varje bildruta:
   ett centrerat motiv bär translateY(-50%), ett speglat bär scaleX(-1).
   Utan det nollställer animationen placeringen i första bildrutan. */

@keyframes fs-drift-midt {
	0%, 100% { transform: translateY(-50%) rotate(var(--fs-rot)) translate3d(0, 0, 0); }
	50%      { transform: translateY(-50%) rotate(var(--fs-rot)) translate3d(6px, -9px, 0); }
}

@keyframes fs-drift-midt-speil {
	0%, 100% { transform: translateY(-50%) scaleX(-1) rotate(var(--fs-rot)) translate3d(0, 0, 0); }
	50%      { transform: translateY(-50%) scaleX(-1) rotate(var(--fs-rot)) translate3d(5px, 7px, 0); }
}

@keyframes fs-drift-fri {
	0%, 100% { transform: rotate(var(--fs-rot)) translate3d(0, 0, 0); }
	50%      { transform: rotate(var(--fs-rot)) translate3d(-4px, -6px, 0); }
}

@keyframes fs-drift-fri-speil {
	0%, 100% { transform: scaleX(-1) rotate(var(--fs-rot)) translate3d(0, 0, 0); }
	50%      { transform: scaleX(-1) rotate(var(--fs-rot)) translate3d(-4px, -6px, 0); }
}

@media (prefers-reduced-motion: reduce) {
	.fs-ill { animation: none !important; }
}

@media (max-width: 900px) {
	/* Under 900px finns sällan plats bredvid texten. Varje motiv väljer
	   själv om det ska överleva — .fs-ill--mobil sätts av inställningen. */
	.fs-ill:not(.fs-ill--mobil) { display: none; }
}