/* =========================================================
   Bricks Du Lac — Tarifs & abonnements Services
   Module "Assistance" (design validé v4, sans Workshop)

   Toutes les règles sont limitées à #pricing-services et
   toutes les classes sont préfixées .bdl-svc-
   => aucun impact possible sur styles.css ni sur le reste du site.
   ========================================================= */

/* Le site ne charge Raleway qu'en 400/500/600. La maquette v4 utilise
   Raleway 700 et 800 : sans ces graisses réelles, le navigateur simulait
   un faux gras et la typographie de la carte n'était pas fidèle.
   Cet import n'ajoute que les deux graisses manquantes. */
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@700;800&display=swap');

/* ---------- Typographie de la carte (reprise de la maquette v4) ---------- */
/* Limité à #pricing-services : aucune autre section n'est affectée. */

#pricing-services .section-inner {
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}

#pricing-services .section-title {
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  font-size: 32px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: .3px;
  color: #ffffff;
  margin: 0 0 10px;
}

#pricing-services .section-intro {
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  font-size: 20px;
  font-style: italic;
  font-weight: 500;
  line-height: 1.4;
  color: rgba(255, 255, 255, .85);
  max-width: 760px;
  margin: 0 auto;
}

#pricing-services .bdl-svc {
  --bdl-svc-green: #339933;
  --bdl-svc-blue: #66CCFF;
  --bdl-svc-gold: #C9971C;

  max-width: 1100px;
  margin: 32px auto 0;
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}

#pricing-services .bdl-svc *,
#pricing-services .bdl-svc *::before,
#pricing-services .bdl-svc *::after {
  box-sizing: border-box;
}

/* ---------- Cartes horaires ---------- */

#pricing-services .bdl-svc-hourly {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin: 0 0 36px;
}

#pricing-services .bdl-svc-hourly-card,
#pricing-services .bdl-svc-sub-card,
#pricing-services .bdl-svc-info {
  background: #ffffff;
  border-radius: 18px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, .1);
}

#pricing-services .bdl-svc-hourly-card {
  padding: 20px 24px;
  text-align: center;
}

#pricing-services .bdl-svc-duration {
  font-size: 30px;
  font-weight: 800;
  color: #000000;
  line-height: 1.1;
  margin: 0 0 14px;
}

#pricing-services .bdl-svc-price {
  font-size: 36px;
  font-weight: 800;
  color: var(--bdl-svc-green);
  line-height: 1;
  margin: 0;
}

#pricing-services .bdl-svc-chf {
  font-size: 18px;
  font-weight: 700;
}

#pricing-services .bdl-svc-rate,
#pricing-services .bdl-svc-effective {
  font-size: 15px;
  color: #555555;
  font-weight: 600;
  margin: 6px 0 0;
}

/* ---------- Titres du bloc abonnements ---------- */

#pricing-services .bdl-svc-label {
  text-align: center;
  color: #ffffff;
  font-weight: 800;
  font-size: 32px;
  line-height: 1.2;
  letter-spacing: .3px;
  margin: 0 0 10px;
}

#pricing-services .bdl-svc-sublabel {
  text-align: center;
  color: rgba(255, 255, 255, .85);
  font-size: 20px;
  font-style: italic;
  font-weight: 500;
  line-height: 1.4;
  margin: 0 auto 28px;
}

/* ---------- Abonnements ---------- */

#pricing-services .bdl-svc-subs {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin: 0 0 28px;
}

#pricing-services .bdl-svc-sub-card {
  position: relative;
  padding: 22px 24px;
  text-align: center;
  border: 2px solid transparent;
}

#pricing-services .bdl-svc-sub-card--featured {
  border-color: var(--bdl-svc-gold);
  box-shadow: 0 6px 20px rgba(201, 151, 28, .25);
}

#pricing-services .bdl-svc-sub-name {
  font-size: 30px;
  font-weight: 800;
  color: #000000;
  line-height: 1.1;
  margin: 0 0 8px;
}

#pricing-services .bdl-svc-sub-name-translation {
  font-size: 13px;
  font-weight: 600;
  color: #777777;
  margin: -6px 0 8px;
  font-style: italic;
}

#pricing-services .bdl-svc-sub-duration {
  font-size: 15px;
  color: #555555;
  font-weight: 600;
  margin: 0 0 16px;
}

#pricing-services .bdl-svc-hours {
  font-size: 52px;
  font-weight: 800;
  color: var(--bdl-svc-blue);
  line-height: 1;
  margin: 0 0 2px;
}

#pricing-services .bdl-svc-hours-unit {
  font-size: 26px;
  font-weight: 700;
}

#pricing-services .bdl-svc-hours-note {
  font-size: 15px;
  color: #888888;
  font-weight: 600;
  margin: 0 0 14px;
}

/* ---------- Encadré avantages ---------- */

#pricing-services .bdl-svc-info {
  padding: 24px 22px;
}

#pricing-services .bdl-svc-info-title {
  font-size: 22px;
  font-weight: 800;
  color: #000000;
  text-align: center;
  margin: 0 0 18px;
}

#pricing-services .bdl-svc-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

#pricing-services .bdl-svc-list li {
  position: relative;
  font-size: 16px;
  color: #333333;
  font-weight: 500;
  line-height: 1.5;
  margin: 0 0 12px;
  padding-left: 28px;
}

#pricing-services .bdl-svc-list li:last-child {
  margin-bottom: 0;
}

#pricing-services .bdl-svc-list li::before {
  content: "\2714";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--bdl-svc-green);
  font-weight: 800;
  font-size: 16px;
}

/* ---------- Note déplacement ---------- */

#pricing-services .bdl-svc-travel {
  text-align: center;
  color: #ffffff;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.45;
  margin: 22px auto 0;
}

#pricing-services .bdl-svc-travel strong {
  color: var(--bdl-svc-blue);
}

/* ---------- Ordinateur ---------- */

@media (min-width: 769px) {
  #pricing-services .section-title {
    font-size: 36px;
    margin-bottom: 12px;
  }

  #pricing-services .section-intro {
    font-size: 22px;
  }

  #pricing-services .bdl-svc {
    margin-top: 48px;
  }

  #pricing-services .bdl-svc-hourly {
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    gap: 24px;
    margin-bottom: 56px;
  }

  #pricing-services .bdl-svc-hourly-card {
    flex: 1 1 280px;
    max-width: 340px;
    padding: 32px 28px;
  }

  #pricing-services .bdl-svc-duration {
    font-size: 38px;
    margin-bottom: 16px;
  }

  #pricing-services .bdl-svc-price {
    font-size: 46px;
  }

  #pricing-services .bdl-svc-chf {
    font-size: 24px;
  }

  #pricing-services .bdl-svc-rate,
  #pricing-services .bdl-svc-effective {
    font-size: 17px;
  }

  #pricing-services .bdl-svc-label {
    font-size: 36px;
    margin-bottom: 12px;
  }

  #pricing-services .bdl-svc-sublabel {
    font-size: 22px;
    margin-bottom: 36px;
  }

  #pricing-services .bdl-svc-subs {
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    gap: 24px;
    margin-bottom: 40px;
  }

  #pricing-services .bdl-svc-sub-card {
    flex: 1 1 300px;
    max-width: 360px;
    padding: 36px 28px;
  }

  #pricing-services .bdl-svc-sub-card--featured {
    transform: scale(1.04);
  }

  #pricing-services .bdl-svc-sub-name {
    font-size: 38px;
    margin-bottom: 10px;
  }

  #pricing-services .bdl-svc-sub-name-translation {
    font-size: 14px;
    margin-bottom: 10px;
  }

  #pricing-services .bdl-svc-sub-duration {
    font-size: 17px;
    margin-bottom: 18px;
  }

  #pricing-services .bdl-svc-hours {
    font-size: 64px;
  }

  #pricing-services .bdl-svc-hours-unit {
    font-size: 32px;
  }

  #pricing-services .bdl-svc-hours-note {
    font-size: 17px;
  }

  #pricing-services .bdl-svc-info {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    padding: 36px 40px;
  }

  #pricing-services .bdl-svc-info-title {
    font-size: 26px;
    margin-bottom: 22px;
  }

  #pricing-services .bdl-svc-list li {
    font-size: 18px;
    padding-left: 34px;
    margin-bottom: 14px;
  }

  #pricing-services .bdl-svc-list li::before {
    font-size: 18px;
  }

  #pricing-services .bdl-svc-travel {
    font-size: 18px;
  }
}


/* =========================================================
   Bricks Du Lac — Nos frais de déplacement
   Section #travel-fees

   Même famille visuelle que #pricing-services (cartes blanches
   sur fond noir, Raleway 700/800), classes préfixées .bdl-trip-
   et règles limitées à #travel-fees.
   ========================================================= */

/* Dégradé doré partagé (.section-card .section-inner), comme #pricing-lego
   et #pricing-services — plus de fond noir uni forcé ici. */
#travel-fees .section-inner {
  font-family: 'Archivo', 'Raleway', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}

#travel-fees .section-title {
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  font-size: 32px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: .3px;
  color: #ffffff;
  text-align: center;
  text-transform: uppercase;
  margin: 0 0 10px;
}

#travel-fees .section-intro {
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  font-size: 20px;
  font-style: italic;
  font-weight: 500;
  line-height: 1.4;
  color: rgba(255, 255, 255, .85);
  text-align: center;
  max-width: 640px;
  margin: 0 auto;
}

#travel-fees .bdl-trip {
  --bdl-trip-green: #339933;
  --bdl-trip-blue: #66CCFF;

  max-width: 1100px;
  margin: 32px auto 0;
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}

#travel-fees .bdl-trip *,
#travel-fees .bdl-trip *::before,
#travel-fees .bdl-trip *::after {
  box-sizing: border-box;
}

/* ---------- Règles de calcul ---------- */

#travel-fees .bdl-trip-rules,
#travel-fees .bdl-trip-card {
  background: #ffffff;
  border-radius: 18px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, .1);
}

#travel-fees .bdl-trip-rules {
  max-width: 800px;
  margin: 0 auto 36px;
  padding: 24px 22px;
}

#travel-fees .bdl-trip-rules-title {
  font-size: 22px;
  font-weight: 800;
  color: #000000;
  text-align: center;
  margin: 0 0 18px;
}

#travel-fees .bdl-trip-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

#travel-fees .bdl-trip-list li {
  position: relative;
  font-size: 16px;
  color: #333333;
  font-weight: 500;
  line-height: 1.5;
  margin: 0 0 12px;
  padding-left: 28px;
}

#travel-fees .bdl-trip-list li:last-child {
  margin-bottom: 0;
}

#travel-fees .bdl-trip-list li::before {
  content: "\2714";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--bdl-trip-green);
  font-weight: 800;
  font-size: 16px;
}

#travel-fees .bdl-trip-list sup {
  font-size: .7em;
}

#travel-fees .bdl-trip-note {
  font-size: 15px;
  color: #555555;
  font-weight: 500;
  line-height: 1.55;
  margin: 18px 0 0;
  padding-top: 18px;
  border-top: 1px solid #e5e5e5;
}

#travel-fees .bdl-trip-note + .bdl-trip-note {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 0;
}

/* ---------- Titre des exemples ---------- */

#travel-fees .bdl-trip-label {
  text-align: center;
  color: #ffffff;
  font-weight: 800;
  font-size: 32px;
  line-height: 1.2;
  letter-spacing: .3px;
  margin: 0 0 24px;
}

/* ---------- Cartes d'exemples ---------- */

#travel-fees .bdl-trip-examples {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

#travel-fees .bdl-trip-card {
  padding: 22px 20px;
  text-align: center;
}

#travel-fees .bdl-trip-route {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  margin: 0 0 16px;
}

#travel-fees .bdl-trip-city {
  font-size: 19px;
  font-weight: 800;
  color: #000000;
  line-height: 1.2;
  text-transform: uppercase;
}

#travel-fees .bdl-trip-arrow {
  font-size: 22px;
  font-weight: 700;
  color: var(--bdl-trip-blue);
  line-height: 1;
}

#travel-fees .bdl-trip-price {
  font-size: 36px;
  font-weight: 800;
  color: var(--bdl-trip-green);
  line-height: 1;
  margin: 0;
}

#travel-fees .bdl-trip-chf {
  font-size: 18px;
  font-weight: 700;
}

#travel-fees .bdl-trip-disclaimer {
  font-size: 13px;
  font-weight: 600;
  color: #888888;
  line-height: 1.45;
  margin: 14px 0 0;
}

/* ---------- Ordinateur ---------- */

@media (min-width: 769px) {
  #travel-fees .section-title {
    font-size: 36px;
    margin-bottom: 12px;
  }

  #travel-fees .section-intro {
    font-size: 22px;
  }

  #travel-fees .bdl-trip {
    margin-top: 48px;
  }

  #travel-fees .bdl-trip-rules {
    margin-bottom: 56px;
    padding: 36px 40px;
  }

  #travel-fees .bdl-trip-rules-title {
    font-size: 26px;
    margin-bottom: 22px;
  }

  #travel-fees .bdl-trip-list li {
    font-size: 18px;
    padding-left: 34px;
    margin-bottom: 14px;
  }

  #travel-fees .bdl-trip-list li::before {
    font-size: 18px;
  }

  #travel-fees .bdl-trip-note {
    font-size: 16px;
  }

  #travel-fees .bdl-trip-label {
    font-size: 36px;
    margin-bottom: 32px;
  }

  #travel-fees .bdl-trip-examples {
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    gap: 24px;
  }

  #travel-fees .bdl-trip-card {
    flex: 1 1 300px;
    max-width: 340px;
    padding: 32px 28px;
  }

  #travel-fees .bdl-trip-city {
    font-size: 21px;
  }

  #travel-fees .bdl-trip-arrow {
    font-size: 26px;
  }

  #travel-fees .bdl-trip-price {
    font-size: 46px;
  }

  #travel-fees .bdl-trip-chf {
    font-size: 24px;
  }

  #travel-fees .bdl-trip-disclaimer {
    font-size: 14px;
  }
}
/* =========================================================
   Harmonisation typographique — titres & sous-titres
   Alignés sur styles.css (police héritée: Archivo/Raleway,
   même échelle que .section-title / .section-subtitle / .card-title)
   ========================================================= */

/* Titre principal du bloc abonnements : "Vos formules d'engagement" */
.pricing-svc-subs-intro h3 {
  font-family: inherit;
  font-size: 22px;
  font-weight: 700;
  text-transform: none;
  letter-spacing: normal;
  color: #fff;
  margin: 0 0 8px;
}

.pricing-svc-subs-intro p {
  font-family: inherit;
  font-size: 15px;
  font-weight: 400;
  color: var(--color-text-on-color-muted);
}

/* Sous-titre "Pourquoi choisir un abonnement ?" */
.pricing-svc-why h3 {
  font-family: inherit;
  font-size: 16px;
  font-weight: 700;
  text-transform: none;
  letter-spacing: normal;
  color: #fff;
  margin: 0 0 12px;
}

/* Titres des cartes d'abonnement (Découverte / Équilibre / Fidélité) */
.pricing-svc-sub-name {
  font-family: inherit;
  font-size: 17px;
  font-weight: 700;
  text-transform: none;
  letter-spacing: normal;
  color: #fff;
  margin: 4px 0 0;
}

/* Onglets Assistance / Workshop */
.pricing-svc-tab {
  font-family: inherit;
  font-weight: 700;
  text-transform: none;
  letter-spacing: normal;
}

/* Libellés des durées (30 min, 1 heure, 3 heures...) */
.pricing-svc-duration-label {
  font-family: inherit;
  font-weight: 600;
  text-transform: none;
  letter-spacing: normal;
}

/* =========================================================
   Harmonisation Titres (30px) & Sous-titres (20px) des blocs
   — les titres de cartes ne sont pas concernés par cette passe —
   ========================================================= */

/* ---------- Titres ---------- */

#pricing-services .section-title {
  font-family: 'Archivo', 'Raleway', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  font-size: 30px;
  font-weight: 700;
  font-style: normal;
  text-transform: none;
  letter-spacing: normal;
}

#pricing-services .bdl-svc-label {
  font-family: 'Archivo', 'Raleway', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  font-size: 30px;
  font-weight: 700;
  font-style: normal;
  text-transform: none;
  letter-spacing: normal;
}

#travel-fees .section-title {
  font-family: 'Archivo', 'Raleway', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  font-size: 30px;
  font-weight: 700;
  font-style: normal;
  text-transform: none;
  letter-spacing: normal;
}

/* ---------- Sous-titres (20px, même traitement, non-italique) ---------- */
/* "Pourquoi choisir un abonnement ?" (.bdl-svc-info-title) reste inchangé
   à la demande explicite — pas de règle ici. */

#travel-fees .bdl-trip-label {
  font-family: 'Archivo', 'Raleway', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  font-size: 20px;
  font-weight: 700;
  font-style: normal;
  text-transform: none;
  letter-spacing: normal;
}

#pricing-services .bdl-svc-sublabel {
  font-family: 'Archivo', 'Raleway', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  font-size: 20px;
  font-weight: 400;
  font-style: normal;
  color: var(--color-text-on-color-muted);
}

#pricing-services .section-intro {
  font-family: 'Archivo', 'Raleway', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  font-size: 20px;
  font-weight: 400;
  font-style: normal;
  color: var(--color-text-on-color-muted);
}

#travel-fees .section-intro {
  font-family: 'Archivo', 'Raleway', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  font-size: 20px;
  font-weight: 400;
  font-style: normal;
  color: var(--color-text-on-color-muted);
}