/* MARA LABS — polices du design auto-hébergées (Outfit display + Inter texte, licence SIL OFL) */
@font-face {
  font-family: "Outfit";
  src: url("/assets/fonts/outfit-var.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/inter-var.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* MARA LABS — raffinements visuels (chargé après le bundle, n'altère aucune mise en page) */

/* Rendu typographique plus net */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Titres display : tracking légèrement resserré, plus éditorial */
h1, h2, h3 { letter-spacing: -0.015em; }
h1 { letter-spacing: -0.025em; }

/* Sélection de texte aux couleurs de la marque */
::selection { background: hsl(221 83% 53% / 0.9); color: #fff; }

/* Défilement doux pour les ancres */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

/* Focus clavier visible et soigné (accessibilité) */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 2px solid hsl(221 83% 53% / 0.65);
  outline-offset: 3px;
  border-radius: 6px;
}

/* Cartes : micro-élévation au survol, ombre plus organique */
.glass-card {
  transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.25s ease;
}
.glass-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 34px -14px hsl(222 47% 11% / 0.16);
}
@media (prefers-reduced-motion: reduce) {
  .glass-card, .glass-card:hover { transition: none; transform: none; }
}

/* Liens du pied de page : soulignement animé discret */
footer a { text-underline-offset: 4px; }
footer a:hover { text-decoration: underline; text-decoration-thickness: 1px; }

/* Barre de défilement discrète (navigateurs WebKit) */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: hsl(215 16% 72% / 0.6); border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: hsl(215 16% 60% / 0.8); }

/* Logo : ne jamais couper le wordmark (les h2 légaux ne sont pas concernés — ce sont des <h2>) */
span.font-display.text-xl { white-space: nowrap; margin-right: 1.25rem; }
