/* Away Équipe — cartes et fenêtres */
.awe-grid,
.awe-modal {
	--awe-teal: #1d5a4b;
	--awe-purple: #7a3191;
	--awe-cream: #f3efe4;
	--awe-radius: 30px;
	--awe-hover-white: rgba(255, 255, 255, .7);
	/* Voile crème au bas de la photo, pour que le texte reste lisible sur une vraie photo. */
	--awe-veil: linear-gradient(to top, rgba(243, 239, 228, .92) 0%, rgba(243, 239, 228, .6) 30%, rgba(243, 239, 228, 0) 55%);
}

.awe-grid {
	display: grid;
	grid-template-columns: repeat(var(--awe-cols, 5), minmax(0, 1fr));
	gap: 24px;
	margin: 0 0 2em;
}
@media (max-width: 1280px) {
	.awe-grid { grid-template-columns: repeat(var(--awe-cols-md, 4), minmax(0, 1fr)); gap: 20px; }
}
@media (max-width: 1024px) {
	.awe-grid { grid-template-columns: repeat(var(--awe-cols-sm, 3), minmax(0, 1fr)); gap: 16px; }
}
@media (max-width: 680px) {
	.awe-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
	.awe-grid, .awe-modal { --awe-radius: 20px; }
}

/* Carte (bouton quand la fenêtre est active) : on neutralise les styles de bouton du thème. */
.awe-grid .awe-card {
	all: unset;
	box-sizing: border-box;
	container-type: inline-size;
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 314 / 380;
	border-radius: var(--awe-radius);
	overflow: hidden;
	background: var(--awe-cream);
	font-family: "Atkinson Hyperlegible", sans-serif;
	color: var(--awe-teal);
	text-align: left;
}
.awe-grid .awe-card--pop { cursor: pointer; }
.awe-grid .awe-card--pop:focus-visible,
.awe-grid .awe-card--bascule:focus-visible { outline: 3px solid var(--awe-teal); outline-offset: 4px; }

.awe-frame { position: absolute; inset: 0; display: block; }
.awe-frame::after { content: ""; position: absolute; inset: 0; background: var(--awe-veil); pointer-events: none; }
/* Sans photo au survol : voile blanc. */
.awe-frame::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: var(--awe-hover-white);
	opacity: 0;
	transition: opacity .35s ease;
	pointer-events: none;
}

.awe-grid .awe-img {
	position: absolute;
	inset: 0;
	width: 100% !important;
	max-width: none !important;
	height: 100% !important;
	object-fit: cover;
	object-position: center top;
	margin: 0;
	border-radius: 0;
	transition: opacity .35s ease, transform .6s ease;
}
.awe-grid .awe-img--hover { opacity: 0; }
@media (hover: hover) {
	.awe-card--hover:hover .awe-img--hover,
	.awe-card--hover:focus-visible .awe-img--hover,
	.awe-card:not(.awe-card--hover):hover .awe-frame::before,
	.awe-card:not(.awe-card--hover):focus-visible .awe-frame::before { opacity: 1; }
	.awe-card--pop:hover .awe-img { transform: scale(1.03); }
}
/* Écran tactile : pas de survol, le toucher change la photo. */
@media (hover: none) {
	.awe-card--bascule { -webkit-tap-highlight-color: transparent; }
	.awe-card--bascule.is-bascule .awe-img--hover { opacity: 1; }
}

.awe-text {
	position: absolute;
	left: 16%;
	right: 10%;
	bottom: 6%;
	display: block;
	z-index: 1;
}
.awe-name {
	display: block;
	margin: 0 0 .7em;
	font-size: clamp(18px, 11cqi, 34px);
	line-height: 1.12;
	font-weight: 700;
}
.awe-name span { display: block; }
.awe-role {
	display: block;
	font-size: clamp(14px, 7cqi, 22px);
	line-height: 1.25;
}

/* ---------------------------------------------------------------------- *
 * Fenêtre de présentation
 * ---------------------------------------------------------------------- */

html.awe-no-scroll { overflow: hidden; }

.awe-modal {
	box-sizing: border-box;
	width: min(1000px, calc(100vw - 32px));
	max-width: none;
	max-height: calc(100dvh - 32px);
	margin: auto;
	padding: 0;
	border: 0;
	border-radius: var(--awe-radius);
	background: var(--awe-cream);
	color: var(--awe-teal);
	font-family: "Atkinson Hyperlegible", sans-serif;
	overflow: auto;
	overscroll-behavior: contain;
}
.awe-modal[open] { animation: awe-in .3s ease both; }
.awe-modal[open]::backdrop { background: rgba(16, 40, 34, .6); animation: awe-fade .3s ease both; }
.awe-modal.is-closing { animation: awe-out .2s ease both; }
.awe-modal.is-closing::backdrop { animation: awe-fade .2s ease reverse both; }
@keyframes awe-in { from { opacity: 0; transform: translateY(16px) scale(.98); } }
@keyframes awe-out { to { opacity: 0; transform: translateY(16px) scale(.98); } }
@keyframes awe-fade { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
	.awe-modal[open], .awe-modal.is-closing, .awe-modal[open]::backdrop { animation: none; }
}

.awe-modal__body {
	position: relative;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
	padding: 48px;
}
.awe-modal__close {
	all: unset;
	position: absolute;
	top: 20px;
	right: 24px;
	width: 40px;
	height: 40px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	color: var(--awe-teal);
	cursor: pointer;
	z-index: 2;
}
.awe-modal__close:hover { background: rgba(29, 90, 75, .08); }
.awe-modal__close:focus-visible { outline: 2px solid var(--awe-teal); }

.awe-modal__content { align-self: center; min-width: 0; font-size: 17px; line-height: 1.55; }
.awe-modal .awe-modal__role {
	margin: 0 0 8px;
	color: var(--awe-purple);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: .02em;
}
.awe-modal .awe-modal__name {
	margin: 0 0 16px;
	padding: 0;
	color: var(--awe-teal);
	font-family: inherit;
	font-size: clamp(28px, 4vw, 40px);
	line-height: 1.1;
	font-weight: 700;
	text-transform: none;
	letter-spacing: 0;
}
.awe-modal__bio p { margin: 0 0 1em; color: var(--awe-teal); }
.awe-modal__linkedin { display: inline-flex; color: var(--awe-teal); margin-top: 4px; }
.awe-modal__linkedin:hover { color: var(--awe-purple); }

.awe-modal__media {
	aspect-ratio: 314 / 380;
	border-radius: calc(var(--awe-radius) - 10px);
	overflow: hidden;
	background: #fbf8f1;
}
.awe-modal .awe-modal__img {
	width: 100% !important;
	max-width: none !important;
	height: 100% !important;
	object-fit: cover;
	object-position: center top;
	display: block;
	margin: 0;
}

@media (max-width: 760px) {
	.awe-modal__body { grid-template-columns: 1fr; gap: 24px; padding: 64px 24px 32px; }
	.awe-modal__media { order: -1; max-width: 280px; }
	.awe-modal__close { top: 12px; right: 12px; }
}