/* Route announcer */
	.astro-route-announcer {
		position: absolute;
		left: 0;
		top: 0;
		clip: rect(0 0 0 0);
		clip-path: inset(50%);
		overflow: hidden;
		white-space: nowrap;
		width: 1px;
		height: 1px;
	}a[data-astro-cid-6nlbk6ah] {
  text-decoration: none;
  color: inherit;
  display: flex;
  align-items: center;
}

img[data-astro-cid-6nlbk6ah] {
  display: block;
  width: var(--sponsor-item-icon-size, 80px);
  height: var(--sponsor-item-icon-size, 80px);
  object-fit: contain;
}

.nom[data-astro-cid-6nlbk6ah] {
  flex: 1;
}
.grid[data-astro-cid-fn43irff] {
  display: grid;
  grid-template-columns: auto auto;
  place-items: center;
  width: 100%;
  padding: 8px 16px;
  font-size: .8rem;
  background: #0101011a;
  --sponsor-item-icon-size: 50px;
}

.bug[data-astro-cid-fn43irff], .sponsor[data-astro-cid-fn43irff] {
  flex: 1 0 300px;
  box-sizing: border-box;
}

.bug[data-astro-cid-fn43irff] {
  display: grid;
  gap: 12px;
  text-align: center;
}

a[data-astro-cid-fn43irff] {
  display: block;
  text-align: center;
  color: #212945;
  font-weight: bold;
}

.sponsor-title[data-astro-cid-fn43irff] {
  font-weight: bold;
}
* {
  box-sizing: border-box;
  /* color */
  --app-primary-color: #3d4b7e;
  --app-primary-light-color: #5b70bd;
  /* channel forms, for rgb(var(--token) / <alpha>) */
  --app-primary-rgb: 61 75 126;
  --app-primary-light-rgb: 90 111 168;
  --app-secondary-color: #585858;
  --app-muted-color: #64748b;
  --app-accent-color: #00c853;
  --light-primary-color: #c5cae9;
  --primary-container: white;
  --on-primary-container: #3d4b7e;
  --on-light-primary-color: #2d385e;
  --error-color: #B3261E;
  --separator-color: lightgray;
  --min-height: calc(100vh - 2vw - 162px);
  --border-radius: 8px;
  --box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
  --hover-color: lightgray;
  /* button */
  --button-background: var(--app-primary-light-color);
  --button-color: white;
  --button-padding: 4px 8px;
  --button-box-shadow: var(--box-shadow);
  /* item */
  --item-display: flex;
  --item-padding: 16px;
  --item-separator: 1px solid var(--separator-color);
  /* form */
  --form-box-shadow: var(--box-shadow);
  /* list */
  --list-background: white;
  --list-style: none;
  --list-margin: 0;
  --list-padding: 0;
  --li-padding: 16px;
  --li-hover-box-shadow: 0 1px 8px gray;

  /* grid */
  --grid-gap: 1vw;

  --padding: 16px;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  margin: 0;
  padding: 0;
  min-height: 100vh;
  background-color: #c5cae9;
  /* #E1E2E1; */
  color: #333;
}

.inherit {
  display: flex;
  align-items: center;
  color: inherit;
  text-decoration: none;
}

h1 {
  color: var(--app-primary-color);
  margin: 0;
}

h2 {
  color: var(--app-primary-color);
  padding: 16px 0;
  margin: 0;
}

/* @view-transition { navigation: auto; } *//**
 * Button Variants - Modern Design System
 *
 * Modern button system with:
 * - Gradient backgrounds and glass-morphism effects
 * - Smooth animations and fluid transitions
 * - Ripple effects on interaction
 * - Enhanced accessibility
 * - Contemporary design patterns
 */

/* ========== ANIMATIONS ========== */
@keyframes buttonRipple {
  0% {
    transform: scale(0);
    opacity: 0.6;
  }

  100% {
    transform: scale(4);
    opacity: 0;
  }
}

@keyframes slideInFromLeft {
  from {
    transform: translateX(-8px);
    opacity: 0;
  }

  to {
    transform: translateX(0);
    opacity: 1;
  }
}

/* ========== PRIMARY BUTTON ========== */
.btn-primary,
a.btn-primary,
button.btn-primary {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  background: linear-gradient(135deg, var(--app-accent-color) 0%, #ff8a3d 100%);
  color: white;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.3px;
  text-decoration: none;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
  outline: none;
  box-shadow: 0 4px 15px rgba(255, 159, 67, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.15);
  overflow: hidden;
  user-select: none;
}

.btn-primary::before,
a.btn-primary::before,
button.btn-primary::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.5);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.btn-primary:hover,
a.btn-primary:hover,
button.btn-primary:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 12px 28px rgba(255, 159, 67, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.btn-primary:active::before,
button.btn-primary:active::before {
  animation: buttonRipple 0.6s ease-out;
}

.btn-primary:active,
button.btn-primary:active {
  transform: translateY(-1px) scale(0.98);
  box-shadow: 0 4px 12px rgba(255, 159, 67, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.15);
}

.btn-primary:focus,
button.btn-primary:focus {
  outline: 2px solid transparent;
  box-shadow: 0 0 0 3px rgba(255, 159, 67, 0.2), 0 12px 28px rgba(255, 159, 67, 0.4);
}

.btn-primary:disabled,
button.btn-primary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* ========== SECONDARY BUTTON ========== */
.btn-secondary,
a.btn-secondary,
button.btn-secondary {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  background: transparent;
  color: var(--app-primary-color);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.3px;
  text-decoration: none;
  border: 2px solid var(--app-primary-color);
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
  outline: none;
  overflow: hidden;
  user-select: none;
}

.btn-secondary::after,
a.btn-secondary::after,
button.btn-secondary::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: var(--app-primary-color);
  z-index: -1;
  transition: left 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.btn-secondary:hover,
a.btn-secondary:hover,
button.btn-secondary:hover {
  color: white;
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 12px 28px rgb(var(--app-primary-rgb) / 0.3);
}

.btn-secondary:hover::after,
a.btn-secondary:hover::after,
button.btn-secondary:hover::after {
  left: 0;
}

.btn-secondary:active,
button.btn-secondary:active {
  transform: translateY(-1px) scale(0.98);
}

.btn-secondary:focus,
button.btn-secondary:focus {
  outline: 2px solid transparent;
  box-shadow: 0 0 0 3px rgb(var(--app-primary-rgb) / 0.2), inset 0 0 0 2px var(--app-primary-color);
}

.btn-secondary:disabled,
button.btn-secondary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}

/* ========== BACK BUTTON / RETURN LINK ========== */
.btn-back,
a.btn-back,
button.btn-back {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  background: linear-gradient(135deg, rgb(var(--app-primary-rgb) / 0.1), rgb(var(--app-primary-light-rgb) / 0.06));
  border: 2px solid rgb(var(--app-primary-rgb) / 0.2);
  border-radius: 10px;
  color: var(--app-primary-color);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.3px;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
  outline: none;
  box-shadow: 0 2px 8px rgb(var(--app-primary-rgb) / 0.08);
  user-select: none;
  overflow: hidden;
}

.btn-back:hover,
a.btn-back:hover,
button.btn-back:hover {
  background: linear-gradient(135deg, rgb(var(--app-primary-rgb) / 0.15), rgb(var(--app-primary-light-rgb) / 0.1));
  border-color: rgb(var(--app-primary-rgb) / 0.4);
  transform: translateX(-4px);
  box-shadow: 0 8px 20px rgb(var(--app-primary-rgb) / 0.15);
}

.btn-back:active,
button.btn-back:active {
  transform: translateX(-2px) scale(0.98);
}

.btn-back:focus,
button.btn-back:focus {
  outline: 2px solid transparent;
  box-shadow: 0 0 0 3px rgb(var(--app-primary-rgb) / 0.15), 0 8px 20px rgb(var(--app-primary-rgb) / 0.15);
}

.btn-back .material-symbols-rounded {
  font-size: 1.25rem !important;
  transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.btn-back:hover .material-symbols-rounded {
  transform: translateX(-4px);
}

/* ========== TERTIARY BUTTON (Minimal) ========== */
.btn-tertiary,
a.btn-tertiary,
button.btn-tertiary {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: transparent;
  color: var(--app-primary-color);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.3px;
  text-decoration: none;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
  outline: none;
  user-select: none;
}

.btn-tertiary:hover,
a.btn-tertiary:hover,
button.btn-tertiary:hover {
  background: rgb(var(--app-primary-rgb) / 0.08);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgb(var(--app-primary-rgb) / 0.1);
}

.btn-tertiary:active,
button.btn-tertiary:active {
  transform: translateY(0) scale(0.98);
}

.btn-tertiary:focus,
button.btn-tertiary:focus {
  outline: 2px solid transparent;
  box-shadow: 0 0 0 3px rgb(var(--app-primary-rgb) / 0.15);
}

/* ========== DANGER BUTTON ========== */
.btn-danger,
a.btn-danger,
button.btn-danger {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  background: linear-gradient(135deg, var(--error-color) 0%, #c41e3a 100%);
  color: white;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.3px;
  text-decoration: none;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
  outline: none;
  box-shadow: 0 4px 15px rgba(220, 38, 38, 0.3);
  overflow: hidden;
  user-select: none;
}

.btn-danger:hover,
a.btn-danger:hover,
button.btn-danger:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 12px 28px rgba(220, 38, 38, 0.4);
}

.btn-danger:active,
button.btn-danger:active {
  transform: translateY(-1px) scale(0.98);
}

.btn-danger:focus,
button.btn-danger:focus {
  outline: 2px solid transparent;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.2), 0 12px 28px rgba(220, 38, 38, 0.4);
}

.btn-danger:disabled,
button.btn-danger:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}

/* ========== SIMPLE LINK ========== */
.btn-link,
a.btn-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0;
  color: var(--app-primary-color);
  text-decoration: none;
  background: transparent;
  border: none;
  cursor: pointer;
  font-weight: 600;
  font-size: 1rem;
  letter-spacing: 0.3px;
  transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
  outline: none;
  position: relative;
  user-select: none;
}

.btn-link::after,
a.btn-link::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, var(--app-accent-color), var(--app-primary-light-color));
  bottom: -4px;
  left: 0;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.btn-link:hover,
a.btn-link:hover {
  color: var(--app-accent-color);
  transform: translateX(2px);
}

.btn-link:hover::after,
a.btn-link:hover::after {
  transform: scaleX(1);
  transform-origin: left;
}

.btn-link:focus,
a.btn-link:focus {
  outline: 2px solid transparent;
  color: var(--app-primary-color);
}

/* ========== SIZE VARIANTS ========== */
.btn-sm,
button.btn-sm {
  padding: 0.5rem 1rem !important;
  font-size: 0.875rem !important;
}

.btn-lg,
button.btn-lg {
  padding: 1rem 2rem !important;
  font-size: 1.125rem !important;
}

/* ========== FULL WIDTH ========== */
.btn-full-width {
  width: 100%;
  box-sizing: border-box;
}

/* ========== BUTTON GROUP ========== */
.btn-group {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
}

.btn-group.vertical {
  flex-direction: column;
  align-items: flex-start;
}

.btn-group.center {
  justify-content: center;
}

.btn-group.right {
  justify-content: flex-end;
}

/* ========== RESPONSIVE ========== */
@media (max-width: 768px) {

  .btn-primary,
  a.btn-primary,
  button.btn-primary,
  .btn-secondary,
  a.btn-secondary,
  button.btn-secondary,
  .btn-back,
  a.btn-back,
  button.btn-back {
    padding: 0.625rem 1.25rem;
    font-size: 0.95rem;
  }

  .btn-group {
    flex-direction: column;
    width: 100%;
  }

  .btn-group>* {
    width: 100%;
  }

  .btn-group.right {
    justify-content: flex-start;
  }

  .btn-link {
    font-size: 0.95rem;
  }
}

/* ========== ACCESSIBILITY ========== */
@media (prefers-reduced-motion: reduce) {

  .btn-primary,
  a.btn-primary,
  button.btn-primary,
  .btn-secondary,
  a.btn-secondary,
  button.btn-secondary,
  .btn-back,
  a.btn-back,
  button.btn-back,
  .btn-tertiary,
  a.btn-tertiary,
  button.btn-tertiary,
  .btn-danger,
  a.btn-danger,
  button.btn-danger,
  .btn-link,
  a.btn-link {
    transition: none;
  }

  .btn-primary::before,
  a.btn-primary::before,
  button.btn-primary::before {
    animation: none;
  }

  .btn-link::after,
  a.btn-link::after {
    transition: none;
  }
}

/* ========== PRINT STYLES ========== */
@media print {

  .btn-primary,
  a.btn-primary,
  button.btn-primary,
  .btn-secondary,
  a.btn-secondary,
  button.btn-secondary,
  .btn-back,
  a.btn-back,
  button.btn-back,
  .btn-tertiary,
  a.btn-tertiary,
  button.btn-tertiary,
  .btn-danger,
  a.btn-danger,
  button.btn-danger {
    box-shadow: none !important;
    transform: none !important;
  }
}

/* ========== KEYBOARD FOCUS ========== */
/*
 * Les anneaux de focus ci-dessus sont des halos colorés à faible opacité
 * (~1,2:1) : insuffisants comme indicateur de focus (WCAG 2.4.11 demande 3:1).
 * On rétablit un contour opaque pour la navigation au clavier uniquement.
 */
.btn-primary:focus-visible,
.btn-secondary:focus-visible,
.btn-back:focus-visible,
.btn-tertiary:focus-visible,
.btn-danger:focus-visible,
.btn-link:focus-visible {
  outline: 2px solid var(--app-primary-color);
  outline-offset: 2px;
}