/* ==========================================================================
   BRS Connect — Base
   Reset, polices, éléments HTML, boutons, formulaires, utilitaires.
   Aucune règle de mise en page de section ici : voir main.css.
   ========================================================================== */

/* --- Polices --------------------------------------------------------------
   Copies locales dans assets/fonts (site autonome, exportable tel quel).
   Source canonique de la marque : brs-design/assets/fonts, à la racine du
   dépôt — à resynchroniser ici manuellement en cas de mise à jour.        */
@font-face{ font-family:'Montserrat'; src:url('../assets/fonts/Montserrat-Regular.ttf')    format('truetype'); font-weight:400; font-style:normal; font-display:swap; }
@font-face{ font-family:'Montserrat'; src:url('../assets/fonts/Montserrat-SemiBold.ttf')   format('truetype'); font-weight:600; font-style:normal; font-display:swap; }
@font-face{ font-family:'Montserrat'; src:url('../assets/fonts/Montserrat-Bold.ttf')       format('truetype'); font-weight:700; font-style:normal; font-display:swap; }
@font-face{ font-family:'Montserrat'; src:url('../assets/fonts/Montserrat-ExtraBold.ttf')  format('truetype'); font-weight:800; font-style:normal; font-display:swap; }
@font-face{ font-family:'Open Sans'; src:url('../assets/fonts/OpenSans-Regular.ttf')       format('truetype'); font-weight:400; font-style:normal; font-display:swap; }
@font-face{ font-family:'Open Sans'; src:url('../assets/fonts/OpenSans-SemiBold.ttf')      format('truetype'); font-weight:600; font-style:normal; font-display:swap; }
@font-face{ font-family:'Open Sans'; src:url('../assets/fonts/OpenSans-Bold.ttf')          format('truetype'); font-weight:700; font-style:normal; font-display:swap; }


/* --- Reset ---------------------------------------------------------------- */
*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; scroll-padding-top:calc(var(--header-h) + var(--space-md)); }

body{
  margin:0;
  font-family:var(--font-body);
  font-size:var(--step-body);
  line-height:1.62;
  color:var(--muted);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}

img,svg,video{ max-width:100%; display:block; height:auto; }

ul,ol{ margin:0; padding:0; }
li{ list-style:none; }

figure{ margin:0; }


/* --- Titres et texte ------------------------------------------------------ */
h1,h2,h3,h4{
  font-family:var(--font-head);
  font-weight:700;
  line-height:1.2;
  color:var(--navy);
  margin:0 0 var(--space-md);
  text-wrap:balance;
}
h1{ font-size:var(--step-h1); letter-spacing:-.015em; }
h2{ font-size:var(--step-h2); letter-spacing:-.01em; }
h3{ font-size:var(--step-h3); }

p{ margin:0 0 var(--space-md); text-wrap:pretty; }
p:last-child{ margin-bottom:0; }

strong{ font-weight:700; color:var(--ink); }

a{ color:var(--navy); text-decoration:none; transition:color var(--transition); }
a:hover{ color:var(--sky-hover); }

code{ font-family:var(--font-mono); font-size:.92em; }


/* --- Accessibilité -------------------------------------------------------- */
:focus-visible{
  outline:2px solid var(--sky);
  outline-offset:2px;
  border-radius:var(--radius-xs);
}

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--navy); color:var(--on-dark);
  padding:var(--space-sm) var(--space-md);
  border-radius:0 0 var(--radius-xs) 0;
}
.skip-link:focus{ left:0; }

.visually-hidden{
  position:absolute!important; width:1px; height:1px;
  padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }
}


/* --- Boutons -------------------------------------------------------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:var(--space-xs);
  font-family:var(--font-body);
  font-size:var(--step-sm);
  font-weight:700;
  letter-spacing:.045em;
  text-transform:uppercase;
  padding:14px 26px;
  border:1.5px solid transparent;
  border-radius:var(--radius-sm);
  cursor:pointer;
  text-align:center;
  transition:background-color var(--transition), border-color var(--transition),
             color var(--transition), transform var(--transition);
}
.btn:hover{ transform:translateY(-1px); }
.btn:active{ transform:translateY(0); }

.btn--primary{
  background:var(--navy); color:var(--on-dark);
  border-color:var(--navy); box-shadow:var(--shadow-cta);
}
.btn--primary:hover{ background:var(--navy-dark); border-color:var(--navy-dark); color:var(--on-dark); }

.btn--ghost{ background:transparent; color:var(--navy); border-color:var(--line); }
.btn--ghost:hover{ border-color:var(--navy); color:var(--navy); }

/* Variantes posées sur les bandes sombres */
.btn--light{ background:var(--surface); color:var(--navy); border-color:var(--surface); }
.btn--light:hover{ background:transparent; color:var(--on-dark); border-color:var(--surface); }

.btn--outline-light{ background:transparent; color:var(--on-dark); border-color:var(--on-dark-line); }
.btn--outline-light:hover{ background:var(--surface); color:var(--navy); border-color:var(--surface); }


/* --- Formulaires ---------------------------------------------------------- */
label{
  display:block;
  font-size:var(--step-xs);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.03em;
  color:var(--ink);
  margin-bottom:6px;
}
label .opt{ font-weight:400; text-transform:none; letter-spacing:0; color:var(--muted); }

input[type=text],input[type=email],input[type=tel],select,textarea{
  width:100%;
  padding:11px 14px;
  font:inherit;
  color:var(--ink);
  background:var(--surface);
  border:1.5px solid var(--line);
  border-radius:var(--radius-xs);
  transition:border-color var(--transition);
}
input::placeholder{ color:var(--muted); opacity:.7; }
input:focus,select:focus,textarea:focus{ border-color:var(--sky); outline:none; }
input:user-invalid,select:user-invalid{ border-color:var(--danger); }

select{
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%235C6B78' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  padding-right:38px;
}
