:root{
  --brand-red:#EB4A3B;
  --brand-blue:#15345F;
  --menu-bg:#F5F1E6;
  --text-dark:#10243E;
}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Helvetica,Arial,sans-serif;color:var(--text-dark);}
.navbar{background:var(--menu-bg); box-shadow:0 1px 12px rgba(0,0,0,.06);}
.navbar-brand{font-weight:800;color:var(--brand-blue);}
.navbar .nav-link{font-weight:600;color:var(--brand-blue);}
.navbar .nav-link:hover{color:var(--brand-red);}
.brand-logo{height:28px; width:auto; transition:height .2s ease;}
@media(min-width:992px){.brand-logo{height:34px;}}
/* === Bouton principal orange === */
.btn-brand {
  background-color: var(--brand-red, #EB4A3B);
  color: #fff;
  font-weight: 700;
  border: none;
  transition: background-color 0.2s ease, transform 0.1s ease;
}

/* Effet au survol */
.btn-brand:hover,
.btn-brand:focus {
  background-color: #d93f33; /* version légèrement plus foncée */
  color: #fff;
  transform: scale(1.03); /* petit effet d’élévation */
}

/* Effet quand on clique */
.btn-brand:active {
  background-color: #c6382e; /* encore plus foncé au clic */
  transform: scale(0.98);
}


.btn-outline-brand{border-color:var(--brand-blue);color:var(--brand-blue);font-weight:700;}
.btn-outline-brand:hover{background:var(--brand-blue);color:#fff;}
.hero{background:linear-gradient(180deg,#ffffff 0%,#fff 60%,#f9fbff 100%);padding:clamp(2.5rem,5vw,5rem) 0;}
.section-title{font-weight:800;color:var(--brand-blue);}
footer a{color:#fff;text-decoration:none;} footer a:hover{text-decoration:underline;}

/* ====== Cartes cliquables Inscription ====== */

/* Grille 2 colonnes côte à côte */
.signup-type-wrap{display:flex;justify-content:center;margin-bottom:1.5rem;}
.signup-type{
  display:grid; gap:1rem; width:min(900px,100%);
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:stretch;
}

/* On cache visuellement les radios mais on garde l’ordre input + label */
.signup-radio{position:absolute; opacity:0; pointer-events:none;}

/* Carte */
.signup-choice{
  display:block; height:100%;
  background:#fff; border:2px solid #e6e6e6; border-radius:18px;
  box-shadow:0 4px 14px rgba(0,0,0,.04);
  padding:1.25rem 1.5rem; transition:all .2s ease; cursor:pointer; color:inherit;
}
.signup-choice:hover{transform:translateY(-2px); box-shadow:0 6px 18px rgba(0,0,0,.08);}

/* Contenu interne */
.signup-choice .signup-inner{display:grid; grid-template-columns:72px 1fr; gap:1rem; align-items:center;}
.signup-choice .icon{
  width:64px;height:64px;border-radius:16px;display:grid;place-items:center;
  font-size:32px;background:#FFF0EE; transition:background .2s ease;
}
.signup-choice .title{font-size:1.5rem;font-weight:800;line-height:1.1;margin-bottom:.5rem;color:#222;}
.signup-choice .title .accent{color:#EB4A3B;}
.signup-choice .features{display:flex;flex-direction:column;gap:.25rem;color:#2b2f33;font-size:1rem;line-height:1.4;}
.signup-choice .features .item{padding:.1rem 0;}

/* ÉTAT SÉLECTIONNÉ — grâce à input:checked + label */
.signup-radio:checked + .signup-choice{
  border-color:#EB4A3B;
  background:linear-gradient(0deg,#FFF8F7,#FFF);
  box-shadow:0 8px 22px rgba(235,74,59,.25);
  transform:translateY(-1px);
}
.signup-radio:checked + .signup-choice .icon{ background:#FFE5E0; }
.signup-radio:checked + .signup-choice .title{ color:#EB4A3B; }

/* Accessibilité focus clavier */
.signup-choice:focus-visible{outline:3px solid rgba(235,74,59,.5); outline-offset:2px;}

/* Responsive : empile en 1 colonne */
@media (max-width:768px){
  .signup-type{ grid-template-columns:1fr; }
  .signup-choice .signup-inner{ grid-template-columns:56px 1fr; gap:.75rem; }
  .signup-choice .icon{ width:56px;height:56px;font-size:26px;border-radius:12px; }
  .signup-choice .title{ font-size:1.25rem; }
}