/**
 * Style « Affiche » (inspiré de Micdrop), en clair (lavande) et en noir :
 * grotesque extra-large en capitales, concerts en tableau, carrés d'accent.
 */

@font-face {
	font-family: "Archivo";
	src: url("../fonts/archivo.woff2") format("woff2");
	font-weight: 100 900;
	font-stretch: 62% 125%;
	font-display: swap;
}

body.aap-style-affiche-clair,
body.aap-style-affiche-noir {
	--display: "Archivo", "Arial Black", Arial, sans-serif;
	--body: "Archivo", "Helvetica Neue", Arial, sans-serif;
	--radius: 0px;
	--display-weight: 800;
	--display-tracking: .01em;
	--display-transform: uppercase;
}

body.aap-style-affiche-clair {
	--bg: #e4e6fb;
	--surface: #f1f2fd;
	--text: #0a0a0a;
	--muted: #4a4a55;
	--rule: #0a0a0a;
}

body.aap-style-affiche-noir {
	--bg: #050505;
	--surface: #121212;
	--text: #f4f4f4;
	--muted: #9d9d9d;
	--rule: #2a2a2a;
}

:is(.aap-style-affiche-clair, .aap-style-affiche-noir) :is(.aap-name, .aap-h2, .aap-title, .aap-callout__title) {
	font-stretch: 125%;
}

:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-name { font-size: clamp(3rem, 11vw, 7.5rem); line-height: .88; }

/* Titre de section : à gauche, très large, filet plein dessous. */
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-h2 {
	align-self: stretch;
	text-align: left;
	background: none;
	font-size: clamp(1.8rem, 5vw, 3rem);
	letter-spacing: .01em;
	color: var(--text);
	padding-bottom: .5rem;
	border-bottom: 2px solid currentColor;
}

/* Petit carré d'accent dans le coin de chaque bande. */
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-section { position: relative; }
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-section::after {
	content: "";
	position: absolute;
	right: clamp(1rem, 3vw, 2rem);
	bottom: 1rem;
	width: .7rem;
	height: .7rem;
	background: var(--aap-accent);
}

/* Concerts en tableau : jour, ville, salle, bouton « Billets ». */
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-date { grid-template-columns: 7rem minmax(0, 1fr) auto; border-bottom-color: color-mix(in srgb, var(--text) 25%, transparent); }
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-date__tile { flex-direction: row; align-items: baseline; gap: .4rem; width: auto; min-height: 0; padding: 0; background: none; box-shadow: none; border-radius: 0; }
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-date__dow { display: none; }
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-date__num { font-size: 2rem; font-stretch: 125%; }
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-date.is-next .aap-date__tile { background: none; box-shadow: none; }
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-date.is-next .aap-date__tile > * { color: var(--text); }
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-date__mon { color: var(--text); }
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-date__place { text-transform: uppercase; font-weight: 700; }
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-date__cta { background: none; color: var(--text); border-radius: 0; box-shadow: inset 0 0 0 1px currentColor; }
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-date__cta:hover { background: var(--text); color: var(--bg); }

/* Accent orange sur lavande : contraste insuffisant pour du texte courant. */
.aap-style-affiche-clair :is(.aap-date__flag, .aap-cta) { color: var(--text); }
.aap-style-affiche-clair .aap-cta { border-bottom-color: var(--aap-accent); }

:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-disco__title { font-stretch: 125%; font-weight: 800; }

/* Réseaux : une ligne de libellés en capitales. */
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-block-links .aap-links { gap: .5rem 2rem; }
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-links__item { background: none; border-radius: 0; text-transform: uppercase; font-weight: 800; font-stretch: 125%; letter-spacing: .04em; }

:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-footer { max-width: none; border-top: 2px solid var(--rule); }

/* Bande d'appel : aplat à l'accent. */
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-site > .aap-section.aap-block-cta:not(.is-dressed) { --sec-bg: var(--aap-accent); --text: var(--aap-on-accent, #111111); --muted: var(--aap-on-accent, #111111); color: var(--aap-on-accent, #111111); }
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-site > .aap-section.aap-block-cta:not(.is-dressed) .aap-button { background: var(--aap-on-accent, #111111); color: var(--aap-accent); }

/* Mise en page d'affiche : tout s'aligne à gauche, sur la largeur des titres. */
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) .aap-dates { max-width: none; }
:is(.aap-style-affiche-clair, .aap-style-affiche-noir) :is(.aap-block-text, .aap-block-paragraph) .aap-prose { margin-inline: 0; }

/* Fond clair : l'accent ne sert jamais d'encre. Bouton principal en encre
   sombre sur l'accent, surtitre de l'en-tête sans photo à l'encre du texte. */
.aap-style-affiche-clair .aap-act--primary { color: var(--aap-on-accent, #111111); }
.aap-style-affiche-clair :is(.aap-hero:not(.has-cover), .aap-hero--ink-dark) .aap-eyebrow { color: var(--aap-eyebrow-ink, var(--text)); }

/* Bande claire choisie par l'artiste : l'accent ne sert plus d'encre. */
.aap-style-affiche-noir .aap-section.on-light :is(.aap-date__mon, .aap-date__flag, .aap-date__cta, .aap-cta, .aap-date.is-next .aap-date__tile > *) { color: var(--text); }