/* Mooming 2025/07/11
 - themes simplifiés avec var
 - defaut / defaut-2 / ssj3 / mdl2025 = inline pour commencer car très spécifiques
 - à ajouter prochainement = style="max-width: calc(2em + (164px * img) / 1.7 )
*/
:root {
	--theme-anim:.4s ease 2s infinite anim-004;
	--theme-bkg-pos:50% 25%;
	--theme-bkg-z:-2;
	--theme-cha-pos:50% 25%;
	--theme-cha-size: min(calc(1120px),150%) auto;
	--theme-cha-size-md: min(calc(960px),150%) auto;
	--theme-cha-z:auto;
	--theme-eff-opa:.75;
	--theme-h1-z:2
}
html:not(.load) {
	animation-play-state:paused!important;
	animation:none!important
}
.home>h1,
.highlighted>h2 {
	color:#fff;
	filter:drop-shadow(0 0 2px var(--c-030)) drop-shadow(1px 1px 0 var(--c-030)) drop-shadow(-1px -1px 0 var(--c-030));
	font-size: 150%;
	z-index:var(--theme-h1-z)
}
.highlighted {
	background-image:linear-gradient(180deg,var(--c-0) calc((var(--glo-space-y) + var(--glo-space-150))),var(--c-glo-bg) calc((var(--glo-space-y) + var(--glo-space-150) + 116px)));
	margin-top:calc(1em - (var(--glo-space-y) + var(--glo-space-150) + 132px));
	z-index:2
}
.highlighted.hero>a:nth-last-child(n) {
	width:min(calc(33.333%),var(--w));
	height:min(calc(33.333%),var(--h))
}
.home:not(.defaut) > div:not(:first-of-type)::before {
	display: none
}
.broly-gogeta {
	--theme-c:#2d322e;
	--theme-bkg:url(/img/theme/broly-gogeta-bkg.jpg);
	--theme-cha:url(/img/theme/broly-gogeta-cha.png);
	--theme-eff:url(/img/theme/broly-gogeta-eff-001.png);
	--theme-eff-001:url(/img/theme/broly-gogeta-eff-001.png);
	--theme-eff-002:url(/img/theme/broly-gogeta-eff-002.png);
	--theme-eff-003:url(/img/theme/broly-gogeta-eff-003.png);
	--theme-eff-004:url(/img/theme/broly-gogeta-eff-004.png);
	--theme-cha-z:1
}
.cell-game {
	--theme-anim:1.8s linear 2s infinite anim-012;
	--theme-c:rgba(0,0,0,0);
	--theme-bkg:url(/img/theme/cell-game-bkg.png);
	--theme-bkg-z:2;
	--theme-cha:url(/img/theme/cell-game-cha.png);
	--theme-eff:url(/img/theme/cell-game-eff-001.png);
	--theme-eff-001:url(/img/theme/cell-game-eff-002.png);
	--theme-eff-002:url(/img/theme/cell-game-eff-003.png);
	--theme-eff-003:url(/img/theme/cell-game-eff-001.png);
	--theme-eff-004:url(/img/theme/empty-eff.png);
	--theme-eff-005:url(/img/theme/empty-eff.png);
	--theme-eff-006:url(/img/theme/empty-eff.png);
	--theme-eff-007:url(/img/theme/empty-eff.png);
	--theme-eff-008:url(/img/theme/cell-game-eff-001.png);
	--theme-eff-009:url(/img/theme/empty-eff.png);
	--theme-eff-010:url(/img/theme/empty-eff.png);
	--theme-eff-011:url(/img/theme/empty-eff.png);
	--theme-eff-012:url(/img/theme/empty-eff.png)
}
.clones-rosé {
	--theme-anim:none;
	--theme-c: #0d1a14;
	--theme-bkg:url(/img/theme/clones-rosé-bkg.jpg);
	--theme-cha:url(/img/theme/clones-rosé-cha.png);
	--theme-eff:url(/img/theme/clones-rosé-eff.png);
	--theme-eff-opa:1;
	--theme-h1-z:0
}
.fast-gogeta {
	--theme-anim:none;
	--theme-c:#200b33;
	--theme-bkg:url(/img/theme/fast-gogeta-bkg.jpg);
	--theme-cha:url(/img/theme/fast-gogeta-cha.png);
	--theme-eff:url(/img/theme/fast-gogeta-eff.png);
	--theme-bkg-pos:50% 0%;
	--theme-cha-pos:50% 10%
}
.fast-vegetto {
	--theme-anim:none;
	--theme-c:#0a2333;
	--theme-bkg:url(/img/theme/vegetto-10-ans-bkg.jpg);
	--theme-cha:url(/img/theme/fast-vegetto-cha.png);
	--theme-eff:url(/img/theme/fast-vegetto-eff.png);
	--theme-bkg-pos:50% 66.666%;
	--theme-cha-pos:50% 50%
}
.gogeta-10-ans {
	--theme-anim:1.2s ease 2s infinite anim-012;
	--theme-c:#200b33;
	--theme-bkg:url(/img/theme/fast-gogeta-bkg.jpg);
	--theme-bkg-pos:50% 0%;
	--theme-cha:url(/img/theme/gogeta-10-ans-cha.png);
	--theme-cha-pos:50% 0%;
	--theme-eff:url(/img/theme/gogeta-10-ans-eff-001.png);
	--theme-eff-001:url(/img/theme/gogeta-10-ans-eff-001.png);
	--theme-eff-002:url(/img/theme/gogeta-10-ans-eff-002.png);
	--theme-eff-003:url(/img/theme/gogeta-10-ans-eff-003.png);
	--theme-eff-004:url(/img/theme/gogeta-10-ans-eff-004.png);
	--theme-eff-005:url(/img/theme/gogeta-10-ans-eff-005.png);
	--theme-eff-006:url(/img/theme/gogeta-10-ans-eff-006.png);
	--theme-eff-007:url(/img/theme/gogeta-10-ans-eff-007.png);
	--theme-eff-008:url(/img/theme/gogeta-10-ans-eff-008.png);
	--theme-eff-009:url(/img/theme/gogeta-10-ans-eff-009.png);
	--theme-eff-010:url(/img/theme/gogeta-10-ans-eff-010.png);
	--theme-eff-011:url(/img/theme/gogeta-10-ans-eff-011.png);
	--theme-eff-012:url(/img/theme/gogeta-10-ans-eff-012.png)
}
.heroes {
	--theme-anim:none;
	--theme-c:#1f1333;
	--theme-bkg:url(/img/theme/heroes-bkg.jpg);
	--theme-cha:url(/img/theme/heroes-cha.png);
	--theme-eff:url(/img/theme/heroes-eff.png)
}
.kame-familial {
	--theme-anim:none;
	--theme-c:#2d322e;
	--theme-bkg:url(/img/theme/kame-familial-bkg.jpg);
	--theme-cha:url(/img/theme/kame-familial-cha.png);
	--theme-eff:url(/img/theme/kame-familial-eff-001.png);
	--theme-eff-001:url(/img/theme/kame-familial-eff-001.png);
	--theme-eff-002:url(/img/theme/kame-familial-eff-002.png);
	--theme-eff-003:url(/img/theme/kame-familial-eff-003.png);
	--theme-eff-004:url(/img/theme/kame-familial-eff-004.png)
}
.kame-training {
	--theme-anim:none;
	--theme-c:#332f21;
	--theme-bkg:url(/img/theme/kame-training-bkg.jpg);
	--theme-cha:url(/img/theme/kame-training-cha.png);
	--theme-eff:url(/img/theme/empty-eff.png)
}
.namek-gohan-piccolo {
	--theme-c:#032933;
	--theme-bkg:url(/img/theme/namek-gohan-piccolo-bkg.jpg);
	--theme-cha:url(/img/theme/namek-gohan-piccolo-cha.png);
	--theme-eff:url(/img/theme/namek-gohan-piccolo-eff-001.png);
	--theme-eff-001:url(/img/theme/namek-gohan-piccolo-eff-001.png);
	--theme-eff-002:url(/img/theme/namek-gohan-piccolo-eff-002.png);
	--theme-eff-003:url(/img/theme/namek-gohan-piccolo-eff-003.png);
	--theme-eff-004:url(/img/theme/namek-gohan-piccolo-eff-002.png)
}
.ssj3-vs-majin {
	--theme-anim:none;
	--theme-c:#006d96;
	--theme-bkg:url(/img/theme/ssj3-bkg.jpg);
	--theme-cha:url(/img/theme/ssj3-vs-majin-cha.png);
	--theme-eff:url(/img/theme/ssj3-vs-majin-eff.png)
}
.super-hero {
	--theme-c:#181033;
	--theme-bkg:url(/img/theme/super-hero-bkg.jpg);
	--theme-cha:url(/img/theme/super-hero-cha.png);
	--theme-eff:url(/img/theme/super-hero-eff-001.png);
	--theme-eff-001:url(/img/theme/super-hero-eff-001.png);
	--theme-eff-002:url(/img/theme/super-hero-eff-002.png);
	--theme-eff-003:url(/img/theme/super-hero-eff-003.png);
	--theme-eff-004:url(/img/theme/super-hero-eff-004.png)
}
.survie-univers {
	--theme-c:#1a1733;
	--theme-bkg:url(/img/theme/survie-univers-bkg.jpg);
	--theme-cha:url(/img/theme/survie-univers-cha.png);
	--theme-eff:url(/img/theme/survie-univers-eff-001.png);
	--theme-eff-001:url(/img/theme/survie-univers-eff-001.png);
	--theme-eff-002:url(/img/theme/survie-univers-eff-002.png);
	--theme-eff-003:url(/img/theme/survie-univers-eff-003.png);
	--theme-eff-004:url(/img/theme/survie-univers-eff-004.png)
}
.vegetto-10-ans {
	--theme-c:#332814;
	--theme-bkg:url(/img/theme/vegetto-10-ans-bkg.jpg);
	--theme-bkg-pos:50% 66.666%;
	--theme-cha:url(/img/theme/vegetto-10-ans-cha.png);
	--theme-cha-pos:50% 0%;
	--theme-eff:url(/img/theme/vegetto-10-ans-eff-001.png);
	--theme-eff-001:url(/img/theme/vegetto-10-ans-eff-001.png);
	--theme-eff-002:url(/img/theme/vegetto-10-ans-eff-002.png);
	--theme-eff-003:url(/img/theme/vegetto-10-ans-eff-003.png);
	--theme-eff-004:url(/img/theme/vegetto-10-ans-eff-004.png)
}
.home.banner {
	background-color:var(--theme-c);
	justify-content:start;
	min-height:clamp(136px,100vw,512px)
}
.home::before {
	background-image:var(--theme-bkg);
	background-position:var(--theme-bkg-pos);
	background-size: cover;
	transform-origin:center 256px;
	transform:translatey(0) scale(1.3) rotate(-2deg);
	filter:grayscale(1) blur(0) brightness(1) drop-shadow(0 0 0 var(--theme-c));
	z-index: var(--theme-bkg-z)
}
.home>div::before {
	background-image:var(--theme-eff);
	filter:grayscale(0) blur(8px) brightness(1.1);
	transform:translatey(0) scale(.9)
}
.home::after {
	background-image:var(--theme-cha);
	filter:grayscale(1) blur(0) brightness(2);
	transform:translatey(128px) scale(1.5);
	z-index: var(--theme-cha-z)
}
.home::before,
.home>div::before,
.home::after {
	background-repeat:no-repeat;
	opacity:0
}
.home>div::before,
.home::after {
	background-position: var(--theme-cha-pos);
	background-size: var(--theme-cha-size)
}
.load .home::before,
.load .home>div::before,
.load .home::after {
	filter:grayscale(0) blur(0) brightness(1);
	transform:translatey(0) scale(1);
	opacity:1
}
.load .home::before {
	transition:filter .5s 0s,opacity 1s 0s,transform .75s 0s
}
.load .home::after {
	filter:grayscale(0) blur(0) brightness(1);
	transition:filter 3s .5s,opacity .5s .5s,transform 2s .5s
}
.load .home>div::before {
	animation:var(--theme-anim);
	opacity: var(--theme-eff-opa);
	transition:filter 3s 1.5s,opacity 3s 1.5s,transform 1.5s 0s cubic-bezier(1,.5,.75,1.25);
	z-index: 1
}
@media
(min-width:960px)
{
	.home>div::before,
	.home::after {
		background-size: var(--theme-cha-size-md)
	}
}
@keyframes anim-004 {
	0% {
		background-image:var(--theme-eff-001)
	}
	25% {
		background-image:var(--theme-eff-002)
	}
	50% {
		background-image:var(--theme-eff-003)
	}
	75% {
		background-image:var(--theme-eff-004)
	}
}
@keyframes anim-012 {
	0% {
		background-image:var(--theme-eff-001)
	}
	8% {
		background-image:var(--theme-eff-002)
	}
	16% {
		background-image:var(--theme-eff-003)
	}
	24% {
		background-image:var(--theme-eff-004)
	}
	32% {
		background-image:var(--theme-eff-005)
	}
	40% {
		background-image:var(--theme-eff-006)
	}
	48% {
		background-image:var(--theme-eff-007)
	}
	56% {
		background-image:var(--theme-eff-008)
	}
	64% {
		background-image:var(--theme-eff-009)
	}
	72% {
		background-image:var(--theme-eff-010)
	}
	80% {
		background-image:var(--theme-eff-011)
	}
	88% {
		background-image:var(--theme-eff-012)
	}
}