/* Cash Boost — typographie élégante et lisible */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');

:root{
  --cb-font-body:'Manrope','Inter',system-ui,-apple-system,sans-serif;
  --cb-font-display:'Cormorant Garamond',Georgia,serif;
}

html,body,button,input,select,textarea{font-family:var(--cb-font-body)}
body{font-size:15px;line-height:1.58;font-weight:400;color:var(--text)}

/* Sélecteurs plus précis pour dépasser les anciennes règles .hero h1 et .service-title h2 */
h1,h2,h3,h4,
.hero h1,.hero h2,.service-title h2,
.svc-title,.hero-title,.cbh-title,
.section-head h2,.account-section-title{
  font-family:var(--cb-font-display);
  font-weight:600;
  letter-spacing:-.025em;
  line-height:1.12;
  text-wrap:balance;
}

h1,.hero h1{font-size:clamp(30px,6vw,38px);font-weight:700}
h2{font-weight:600;line-height:1.18}
h3,h4{font-weight:600;line-height:1.22}
.service-title h2{font-size:20px;font-weight:600;line-height:1.12}
.svc-title{font-size:clamp(27px,5vw,34px);line-height:1.08;font-weight:600}
.hero-title,.cbh-title{font-size:clamp(32px,6vw,42px);line-height:1.05;font-weight:700}
.section-head h2{letter-spacing:-.02em}
p,.field-help,.field-note,.note{font-family:var(--cb-font-body);line-height:1.6}
label,.field label{font-family:var(--cb-font-body);font-weight:600;letter-spacing:-.01em}
button,.primary-btn,.secondary-btn,.ghost-btn{font-family:var(--cb-font-body);font-weight:600;letter-spacing:.005em}
input,textarea,select{font-family:var(--cb-font-body);font-weight:400}
input::placeholder,textarea::placeholder{font-weight:400;opacity:.72}

/* La marque et les éléments de navigation restent modernes */
.brand,.splash-title{font-family:'Space Grotesk','Manrope',sans-serif}
@media(max-width:480px){
  body{font-size:14.5px}
  .svc-title{font-size:29px}
  .section-head h2{font-size:24px}
}

/* Tiret d'union du titre Services : plus court et mieux équilibré */
.hero h1 .title-hyphen{
  display:inline-block;
  transform:none;
  margin-inline:.06em;
  font-family:var(--cb-font-body);
  font-size:.78em;
  font-weight:500;
  line-height:1;
  vertical-align:-.02em;
}
/* Tiret droit et régulier dans Nord-Amérique, indépendant de la police serif */
.svc-no-break{white-space:nowrap;display:inline-block}
.svc-no-break .svc-hyphen{font-family:var(--cb-font-body);font-style:normal;font-weight:500;display:inline-block;transform:none;margin:0 .045em;vertical-align:-.02em}

/* ── Écran de démarrage : « Lancement... » animé comme Izy-Store ──
   Vidéo de référence : l'espacement des lettres ne bouge pas. Une vague
   traverse le mot : chaque lettre, à tour de rôle, passe de petite et pâle
   à grande et sombre, puis revient. Cycle d'environ 1,5 s en boucle.
   Placé en dernier pour remplacer les anciennes règles du splash. */
#bootSplash .splash-loading-label{
  color:#222!important;
  opacity:1!important;
  animation:none!important;
  font-size:10px!important;
  font-weight:500!important;
  letter-spacing:3px!important;
  line-height:1.6!important;
  display:flex!important;
  justify-content:center!important;
  align-items:baseline!important;
}
#bootSplash .splash-loading-label .splash-letter,
#bootSplash .splash-loading-label .splash-dots{
  display:inline-block!important;
  color:#222!important;
  transform-origin:50% 65%!important;
  animation:cbIzyLetter 1.5s ease-in-out infinite!important;
  will-change:transform,opacity;
}
#bootSplash .splash-loading-label .splash-letter:nth-child(1){animation-delay:0s!important}
#bootSplash .splash-loading-label .splash-letter:nth-child(2){animation-delay:.09s!important}
#bootSplash .splash-loading-label .splash-letter:nth-child(3){animation-delay:.18s!important}
#bootSplash .splash-loading-label .splash-letter:nth-child(4){animation-delay:.27s!important}
#bootSplash .splash-loading-label .splash-letter:nth-child(5){animation-delay:.36s!important}
#bootSplash .splash-loading-label .splash-letter:nth-child(6){animation-delay:.45s!important}
#bootSplash .splash-loading-label .splash-letter:nth-child(7){animation-delay:.54s!important}
#bootSplash .splash-loading-label .splash-letter:nth-child(8){animation-delay:.63s!important}
#bootSplash .splash-loading-label .splash-letter:nth-child(9){animation-delay:.72s!important}
#bootSplash .splash-loading-label .splash-dots{animation-delay:.81s!important}
@keyframes cbIzyLetter{
  0%,100%{opacity:.18;transform:scale(.62)}
  40%{opacity:1;transform:scale(1.4)}
  70%{opacity:.55;transform:scale(.92)}
}
@media(max-width:540px){
  #bootSplash .splash-loading-label{font-size:10px!important;letter-spacing:3px!important}
}

/* ── Écran de démarrage : plus de carrés décoratifs bleus ──
   Ces carrés venaient de design.css (.boot-splash::before / ::after). Ils restaient visibles
   car la règle qui les cachait était injectée par splash-progress.js, chargé en dernier.
   Cette règle est dans une feuille de style de l'en-tête : elle agit dès le premier affichage.
   Pour les remettre : supprime ce bloc. */
html #bootSplash::before,
html #bootSplash::after,
html .boot-splash::before,
html .boot-splash::after{
  content:none!important;
  display:none!important;
  background:none!important;
  width:0!important;
  height:0!important;
}


/* Cash Boost — single authoritative splash-caption animation.
   Unique keyframe names avoid collisions with legacy CSS/JS rules.
   Calée sur la vidéo Izy-Store : cycle d'environ 1,2 s, décalage de 0,07 s entre deux lettres
   (la vague traverse le mot en ~0,6 s). Chaque lettre passe de très petite et presque
   invisible à grande et sombre, puis redescend. */
@keyframes cashBoostSplashGlyph {
  0%, 100% { transform: scale(.6); color: #b0b0b0; opacity: .25; }
  30% { transform: scale(1.38); color: #111; opacity: 1; }
  55% { transform: scale(.95); color: #666; opacity: .7; }
}
@keyframes cashBoostSplashPunctuation {
  0%, 100% { transform: scale(.65); color: #b0b0b0; opacity: .25; }
  30% { transform: scale(1.3); color: #111; opacity: 1; }
  55% { transform: scale(.95); color: #666; opacity: .7; }
}
html body #bootSplash p.splash-loading-label {
  display: flex !important;
  justify-content: center !important;
  align-items: baseline !important;
  gap: 0 !important;
  animation: none !important;
  letter-spacing: 3px !important;
}
html body #bootSplash p.splash-loading-label > span.splash-letter {
  display: inline-block !important;
  flex: 0 0 auto !important;
  color: #858585 !important;
  opacity: 1 !important;
  transform-origin: center 65% !important;
  animation: cashBoostSplashGlyph 1.2s ease-in-out infinite !important;
}
html body #bootSplash p.splash-loading-label > span.splash-letter:nth-child(1) { animation-delay: 0s !important; }
html body #bootSplash p.splash-loading-label > span.splash-letter:nth-child(2) { animation-delay: .07s !important; }
html body #bootSplash p.splash-loading-label > span.splash-letter:nth-child(3) { animation-delay: .14s !important; }
html body #bootSplash p.splash-loading-label > span.splash-letter:nth-child(4) { animation-delay: .21s !important; }
html body #bootSplash p.splash-loading-label > span.splash-letter:nth-child(5) { animation-delay: .28s !important; }
html body #bootSplash p.splash-loading-label > span.splash-letter:nth-child(6) { animation-delay: .35s !important; }
html body #bootSplash p.splash-loading-label > span.splash-letter:nth-child(7) { animation-delay: .42s !important; }
html body #bootSplash p.splash-loading-label > span.splash-letter:nth-child(8) { animation-delay: .49s !important; }
html body #bootSplash p.splash-loading-label > span.splash-letter:nth-child(9) { animation-delay: .56s !important; }
html body #bootSplash p.splash-loading-label > span.splash-dots {
  display: inline-block !important;
  flex: 0 0 auto !important;
  transform-origin: center 65% !important;
  animation: cashBoostSplashPunctuation 1.2s ease-in-out infinite !important;
  animation-delay: .63s !important;
}
