@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Sora:wght@600;700;800&display=swap');


:root {

  --orange: #FF8000;
  --dark: #000000;
  --gold: #C9A02C;
  --cream: #FAFAF7;

  --gray: #6B7280;
  --gray-light: #D1D5DB;

  --border: rgba(0, 0, 0, 0.15);
  --shadow: 0 10px 30px rgba(0, 0, 0, 0.10);
  --shadow-hover: 0 20px 50px rgba(0, 0, 0, 0.18);

}



/* BASE */

body {

  font-family: Inter, sans-serif;
  background: var(--cream);
  color: #000000;

}



/* TITRES */

h1, h2, h3 {

  font-family: Sora, sans-serif;
  color: var(--dark);
  letter-spacing: -0.02em;

}



/* NAVBAR PROPRE */

header {

  background: var(--cream);
  border-bottom: 1px solid var(--border);

}



/* DESIGN TOKENS */

html {

  scroll-behavior: smooth;

}



/* NAVBAR */

.navbar {

  background: rgba(250,250,247,0.85) !important;
  border-bottom: 1px solid rgba(26,26,26,0.12);

  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

}



.navbar a {

  color: rgba(26,26,26,0.78) !important;

}



.navbar a:hover {

  color: var(--orange) !important;

}



.navbar .text-blue-600,
.navbar a[href*="/login"],
.navbar a[href*="/formations"],
.navbar a[href*="/contact"],
.navbar a[href*="/dashboard"] {

  transition:0.2s ease;

}



.navbar .text-green-600 {

  color: var(--gold) !important;

}



/* OMBRES */

.shadow-glow {

  box-shadow:
  0 10px 30px rgba(26,26,26,0.12),
  0 0 0 1px rgba(201,160,44,0.18);

}



.shadow-soft {

  box-shadow:0 10px 30px rgba(26,26,26,0.08);

}



.glass {

  background:rgba(250,250,247,0.75) !important;

  border-color:rgba(26,26,26,0.12) !important;

  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);

}




/* GRILLE KPI */

.soft-grid {

  background-image:

  linear-gradient(rgba(26,26,26,0.06) 1px, transparent 1px),

  linear-gradient(90deg, rgba(26,26,26,0.06) 1px, transparent 1px);

  background-size:18px 18px;

  background-position:center;

}




/* CARTES */

.rounded-2xl,
.rounded-\[1\.6rem\],
.rounded-\[2rem\] {


  border-radius:14px !important;

  background:#ffffff;

  border:1px solid var(--border);

  box-shadow:var(--shadow);

  transition:all .25s ease;

}



.rounded-2xl:hover,
.rounded-\[1\.6rem\]:hover {


  transform:translateY(-5px);

  box-shadow:var(--shadow-hover);

  border-color:var(--gold);

}




/* BOUTON PRINCIPAL */

a.bg-brand-600,
a[class*="bg-brand"] {


  background:var(--orange) !important;

  color:#FAFAF7 !important;

  border-radius:12px;

  font-weight:700;

  transition:.25s;

}



a.bg-brand-600:hover {


  background:var(--gold) !important;

  color:var(--dark) !important;

}




/* ACCENTS GOLD */

.text-brand-700,
.text-brand-600 {

  color:var(--gold) !important;

}



/* ICONES */

.bg-brand-50 {


  background:rgba(201,160,44,0.12) !important;

  color:var(--dark) !important;

}




/* STATUS */

.text-green {

  color:var(--gold);

}



.text-red {

  color:var(--orange);

}



.text-orange {

  color:var(--orange);

}




/* INPUTS */

input {


  border:1px solid var(--border);

  border-radius:12px;


}



input:focus {


  outline:none;

  border-color:var(--orange);

  box-shadow:0 0 0 3px rgba(246,127,42,0.15);


}




/* HERO */

section .bg-gradient-to-br {


  background:linear-gradient(135deg,var(--dark),#333333) !important;


}




/* ACCESSIBILITE */

:focus-visible {


  outline:none;

  box-shadow:0 0 0 3px rgba(201,160,44,0.35) !important;

  border-color:rgba(201,160,44,0.9) !important;


}




/* TEXTE HERO */

main#accueil h1 {

  color:var(--dark);

}




/* STATISTIQUES */

.text-3xl.font-extrabold {

  color:var(--dark);

}




/* BADGE */

.badge-gold {


  background:var(--gold);

  color:var(--dark);

  padding:4px 10px;

  border-radius:999px;

  font-size:12px;

  font-weight:700;


}




/* SCROLLBAR */

::-webkit-scrollbar {

  width:8px;

}



::-webkit-scrollbar-thumb {

  background:var(--orange);

  border-radius:10px;

}



::-webkit-scrollbar-track {

  background:rgba(26,26,26,0.06);

}




/* NAV LINKS */

nav a.transition {


  transition:color .25s ease, transform .25s ease;


}



nav a.transition:hover {


  color:var(--orange);


}