/* Harmonisation forte de la page À propos avec le reste du site.
   Aucun texte, aucune image ni aucun pictogramme n'est remplacé. */
body.about-redesign {
  --a-teal:#064858;
  --a-teal-deep:#073f4d;
  --a-gold:#e79a08;
  --a-cream:#fbf6ee;
  --a-cream-2:#f7efe4;
  --a-line:#eadfce;
  --a-text:#274954;
  background:#fff !important;
  color:var(--a-teal) !important;
  font-family:"Avenir Next","Segoe UI",Arial,Helvetica,sans-serif !important;
}

body.about-redesign .about-main,
body.about-redesign .about-main--harmonised {
  width:min(100%,1536px) !important;
  max-width:1536px !important;
  margin:0 auto !important;
  padding:0 !important;
  background:#fff !important;
  overflow:hidden !important;
}

/* Hero : même architecture visuelle que la page Accompagnements */
body.about-redesign .about-hero {
  position:relative !important;
  min-height:430px !important;
  display:flex !important;
  align-items:center !important;
  padding:clamp(54px,6vw,92px) clamp(34px,6.2vw,96px) !important;
  background:linear-gradient(120deg,#fffaf4 0%,#f7eee2 68%,#fff 100%) !important;
  border:0 !important;
  overflow:hidden !important;
}
body.about-redesign .about-hero::before {
  content:"" !important;
  display:block !important;
  position:absolute !important;
  right:-110px !important;
  top:-160px !important;
  width:520px !important;
  height:520px !important;
  border:2px solid rgba(231,154,8,.28) !important;
  border-radius:50% !important;
  background:transparent !important;
}
body.about-redesign .about-hero::after {
  content:"" !important;
  position:absolute !important;
  right:55px !important;
  bottom:-220px !important;
  width:420px !important;
  height:420px !important;
  border-radius:50% !important;
  background:rgba(6,72,88,.055) !important;
  left:auto !important;
  opacity:1 !important;
}
body.about-redesign .about-hero-inner {
  position:relative !important;
  z-index:2 !important;
  width:100% !important;
  max-width:1120px !important;
  margin:0 !important;
  padding:0 !important;
  text-align:left !important;
}
body.about-redesign .about-kicker {
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
  margin:0 0 16px !important;
  color:var(--a-gold) !important;
  font-size:15px !important;
  font-weight:800 !important;
  letter-spacing:.14em !important;
  text-transform:uppercase !important;
}
body.about-redesign .about-kicker::after {
  content:"" !important;
  display:block !important;
  width:64px !important;
  height:3px !important;
  border-radius:99px !important;
  background:var(--a-gold) !important;
}
body.about-redesign .about-hero h1 {
  max-width:1040px !important;
  margin:0 0 26px !important;
  color:var(--a-teal) !important;
  font-family:"Avenir Next","Segoe UI",Arial,Helvetica,sans-serif !important;
  font-size:clamp(48px,5.2vw,78px) !important;
  font-weight:800 !important;
  line-height:1.02 !important;
  letter-spacing:-.045em !important;
  text-align:left !important;
}
body.about-redesign .about-lead {
  max-width:1030px !important;
  margin:0 !important;
  color:var(--a-text) !important;
  font-family:"Avenir Next","Segoe UI",Arial,Helvetica,sans-serif !important;
  font-size:clamp(18px,1.35vw,21px) !important;
  font-weight:500 !important;
  line-height:1.68 !important;
  text-align:left !important;
}

/* Sections : alternance blanc/crème comme sur les pages principales */
body.about-redesign .about-band {
  padding:clamp(56px,6vw,88px) clamp(28px,4.2vw,64px) !important;
}
body.about-redesign .about-band--cream { background:linear-gradient(180deg,#fbf8f3 0%,#fffaf5 100%) !important; }
body.about-redesign .about-band--white { background:#fff !important; }

/* Parcours : plus grand, centré, même qualité de carte que les accompagnements */
body.about-redesign .about-parcours-figure {
  width:min(100%,900px) !important;
  max-width:900px !important;
  margin:0 auto !important;
  padding:18px !important;
  border:1px solid var(--a-line) !important;
  border-radius:28px !important;
  background:#fff !important;
  box-shadow:0 14px 40px rgba(6,72,88,.08) !important;
  overflow:hidden !important;
}
body.about-redesign .about-parcours-figure::before { display:none !important; }
body.about-redesign .about-parcours-figure img {
  display:block !important;
  width:100% !important;
  max-width:none !important;
  height:auto !important;
  border-radius:20px !important;
  filter:none !important;
}

/* Deux grands visuels : pleine largeur, sans cadre parasite */
body.about-redesign .about-section--visual {
  padding-top:clamp(52px,5.5vw,82px) !important;
  padding-bottom:clamp(52px,5.5vw,82px) !important;
}
body.about-redesign .about-wide-visual {
  width:100% !important;
  max-width:1408px !important;
  margin:0 auto !important;
  padding:0 !important;
  border:1px solid var(--a-line) !important;
  border-radius:28px !important;
  background:#fff !important;
  box-shadow:0 14px 40px rgba(6,72,88,.07) !important;
  overflow:hidden !important;
}
body.about-redesign .about-wide-visual::before { display:none !important; }
body.about-redesign .about-wide-visual img {
  display:block !important;
  width:100% !important;
  height:auto !important;
  object-fit:contain !important;
  border-radius:0 !important;
  filter:none !important;
}

/* CTA de fin aligné avec la page Accompagnements */
body.about-redesign .about-closing {
  padding:clamp(54px,6vw,88px) clamp(28px,4.2vw,64px) !important;
  background:#fff !important;
}
body.about-redesign .about-closing-inner {
  max-width:1408px !important;
  margin:0 auto !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:36px !important;
  padding:clamp(30px,4vw,50px) !important;
  border:1px solid var(--a-line) !important;
  border-radius:28px !important;
  background:linear-gradient(110deg,#fffaf2 0%,#f7ead7 100%) !important;
  box-shadow:0 14px 40px rgba(6,72,88,.07) !important;
}
body.about-redesign .about-section-eyebrow {
  margin:0 0 10px !important;
  color:var(--a-gold) !important;
  font-family:"Avenir Next","Segoe UI",Arial,Helvetica,sans-serif !important;
  font-size:14px !important;
  font-weight:800 !important;
  letter-spacing:.12em !important;
  text-transform:uppercase !important;
}
body.about-redesign .about-closing h2 {
  max-width:900px !important;
  margin:0 0 12px !important;
  color:var(--a-teal) !important;
  font-family:"Avenir Next","Segoe UI",Arial,Helvetica,sans-serif !important;
  font-size:clamp(31px,3vw,48px) !important;
  font-weight:800 !important;
  line-height:1.1 !important;
  letter-spacing:-.03em !important;
}
body.about-redesign .about-closing p:not(.about-section-eyebrow) {
  max-width:940px !important;
  margin:0 !important;
  color:var(--a-text) !important;
  font-family:"Avenir Next","Segoe UI",Arial,Helvetica,sans-serif !important;
  font-size:clamp(17px,1.2vw,19px) !important;
  font-weight:500 !important;
  line-height:1.62 !important;
}
body.about-redesign .about-cta {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:190px !important;
  min-height:54px !important;
  padding:14px 24px !important;
  border:0 !important;
  border-radius:14px !important;
  background:var(--a-teal) !important;
  color:#fff !important;
  font-family:"Avenir Next","Segoe UI",Arial,Helvetica,sans-serif !important;
  font-size:16px !important;
  font-weight:800 !important;
  text-decoration:none !important;
  box-shadow:none !important;
}
body.about-redesign .about-cta span { color:#ffc34d !important; }
body.about-redesign .about-cta:hover { background:#07586b !important; transform:none !important; }

@media (max-width:900px) {
  body.about-redesign .about-hero { min-height:0 !important; padding:48px 22px !important; }
  body.about-redesign .about-hero::before { width:300px !important; height:300px !important; right:-150px !important; top:-100px !important; }
  body.about-redesign .about-hero::after { display:none !important; }
  body.about-redesign .about-band,
  body.about-redesign .about-closing { padding-left:16px !important; padding-right:16px !important; }
  body.about-redesign .about-parcours-figure,
  body.about-redesign .about-wide-visual,
  body.about-redesign .about-closing-inner { border-radius:20px !important; }
  body.about-redesign .about-closing-inner { grid-template-columns:1fr !important; }
  body.about-redesign .about-cta { width:100% !important; }
}


/* =========================================================
   À PROPOS — VERSION PLUS COLORÉE / PICTOGRAMMES VALORISÉS
   Modification limitée à cette page.
   ========================================================= */
body.about-redesign {
  --a-coral:#be6049;
  --a-sage:#5b8876;
  --a-sky:#dcecef;
  --a-gold-soft:#f4dfb4;
}

/* Hero plus vivant, toujours dans la palette du site */
body.about-redesign .about-hero {
  background:
    radial-gradient(circle at 88% 22%, rgba(231,154,8,.18) 0 86px, transparent 88px),
    radial-gradient(circle at 77% 78%, rgba(6,72,88,.10) 0 132px, transparent 134px),
    linear-gradient(118deg,#fff9ef 0%,#f7e8cf 58%,#eaf3f2 100%) !important;
  border-bottom:7px solid var(--a-gold) !important;
}
body.about-redesign .about-kicker {
  color:#b86234 !important;
}
body.about-redesign .about-hero h1 {
  text-shadow:0 1px 0 rgba(255,255,255,.65) !important;
}

/* Mon parcours : vrai bandeau canard pour donner du contraste */
body.about-redesign .about-section--parcours {
  position:relative !important;
  background:linear-gradient(135deg,#064858 0%,#0a5d6d 62%,#0f6875 100%) !important;
  overflow:hidden !important;
}
body.about-redesign .about-section--parcours::before,
body.about-redesign .about-section--parcours::after {
  content:"" !important;
  position:absolute !important;
  border-radius:50% !important;
  pointer-events:none !important;
}
body.about-redesign .about-section--parcours::before {
  width:310px !important;
  height:310px !important;
  left:-105px !important;
  top:-80px !important;
  border:3px solid rgba(242,177,45,.50) !important;
}
body.about-redesign .about-section--parcours::after {
  width:220px !important;
  height:220px !important;
  right:-52px !important;
  bottom:-78px !important;
  background:rgba(231,154,8,.16) !important;
}
body.about-redesign .about-parcours-figure {
  position:relative !important;
  z-index:1 !important;
  border:3px solid rgba(231,154,8,.72) !important;
  box-shadow:0 24px 58px rgba(0,31,38,.26) !important;
}

/* Ce qui m'anime : crème doré + filet corail, pictogrammes recolorés dans l'image */
body.about-redesign .about-section--visual.about-band--white {
  background:linear-gradient(180deg,#fffdf9 0%,#fbf0dd 100%) !important;
}
body.about-redesign .about-section--visual.about-band--white .about-wide-visual {
  border:2px solid #efc46c !important;
  box-shadow:0 18px 44px rgba(190,96,73,.12) !important;
}

/* L'esprit : fond bleu-vert très doux pour casser l'effet monochrome */
body.about-redesign .about-section--esprit {
  background:
    linear-gradient(110deg,rgba(6,72,88,.08),rgba(91,136,118,.14)),
    #f5faf9 !important;
}
body.about-redesign .about-section--esprit .about-wide-visual {
  border:2px solid rgba(6,72,88,.34) !important;
  box-shadow:0 18px 44px rgba(6,72,88,.13) !important;
}

/* Petit rythme coloré sur les deux grands visuels */
body.about-redesign .about-section--visual .about-wide-visual {
  position:relative !important;
}
body.about-redesign .about-section--visual .about-wide-visual::after {
  content:"" !important;
  display:block !important;
  position:absolute !important;
  inset:0 auto 0 0 !important;
  width:8px !important;
  background:linear-gradient(180deg,var(--a-gold),var(--a-coral),var(--a-teal)) !important;
  z-index:2 !important;
}

/* CTA final : fond canard et bouton ocre pour retrouver l'énergie du site */
body.about-redesign .about-closing {
  background:linear-gradient(180deg,#fff 0%,#f8f1e7 100%) !important;
}
body.about-redesign .about-closing-inner {
  border:0 !important;
  background:linear-gradient(115deg,#064858 0%,#0a5a68 72%,#0b6670 100%) !important;
  box-shadow:0 18px 46px rgba(6,72,88,.20) !important;
}
body.about-redesign .about-closing h2,
body.about-redesign .about-closing p:not(.about-section-eyebrow) {
  color:#fff !important;
}
body.about-redesign .about-section-eyebrow {
  color:#f3bd55 !important;
}
body.about-redesign .about-cta {
  background:var(--a-gold) !important;
  color:#063f4d !important;
  box-shadow:0 8px 22px rgba(0,0,0,.12) !important;
}
body.about-redesign .about-cta span { color:#063f4d !important; }
body.about-redesign .about-cta:hover { background:#f0ad28 !important; }

@media (max-width:900px) {
  body.about-redesign .about-hero { border-bottom-width:5px !important; }
  body.about-redesign .about-section--visual .about-wide-visual::after { width:5px !important; }
}


/* =========================================================
   TYPOGRAPHIE HARMONISEE — 2026-08-16
   Hiérarchie plus contenue, sans changement de contenu ni de mise en page.
   ========================================================= */
body.about-redesign .about-hero h1 {
  font-size: clamp(37px, 3.8vw, 58px) !important;
  line-height: 1.06 !important;
  letter-spacing: -.025em !important;
}
body.about-redesign .about-lead {
  font-size: clamp(17px, 1.2vw, 20px) !important;
  line-height: 1.7 !important;
}
body.about-redesign .about-closing h2 {
  font-size: clamp(28px, 2.45vw, 39px) !important;
  line-height: 1.16 !important;
}
@media (max-width: 680px) {
  body.about-redesign .about-hero h1 {
    font-size: clamp(34px, 9.5vw, 46px) !important;
  }
}

/* =========================================================
   À PROPOS — HARMONISATION DES DIMENSIONS
   Réduction des volumes uniquement : structure, textes et images inchangés.
   ========================================================= */
body.about-redesign .about-hero {
  min-height: 360px !important;
  padding: clamp(42px, 4.8vw, 70px) clamp(34px, 6.2vw, 96px) !important;
}
body.about-redesign .about-hero-inner {
  max-width: 1040px !important;
}
body.about-redesign .about-hero h1 {
  max-width: 930px !important;
  font-size: clamp(36px, 3.5vw, 54px) !important;
  margin-bottom: 20px !important;
}
body.about-redesign .about-lead {
  max-width: 930px !important;
  font-size: clamp(16.5px, 1.1vw, 19px) !important;
}
body.about-redesign .about-band {
  padding-top: clamp(42px, 4.6vw, 66px) !important;
  padding-bottom: clamp(42px, 4.6vw, 66px) !important;
}
/* Image verticale « Mon parcours » volontairement plus compacte */
body.about-redesign .about-parcours-figure {
  width: min(100%, 650px) !important;
  max-width: 650px !important;
  padding: 14px !important;
  border-radius: 24px !important;
}
body.about-redesign .about-parcours-figure img {
  width: 100% !important;
  max-width: 620px !important;
  margin: 0 auto !important;
  border-radius: 17px !important;
}
/* Les deux autres visuels restent grands, mais moins massifs que précédemment */
body.about-redesign .about-wide-visual {
  width: min(100%, 1180px) !important;
  max-width: 1180px !important;
  border-radius: 24px !important;
}
body.about-redesign .about-section--visual {
  padding-top: clamp(42px, 4.5vw, 64px) !important;
  padding-bottom: clamp(42px, 4.5vw, 64px) !important;
}
body.about-redesign .about-closing {
  padding-top: clamp(44px, 4.8vw, 68px) !important;
  padding-bottom: clamp(44px, 4.8vw, 68px) !important;
}
body.about-redesign .about-closing-inner {
  max-width: 1180px !important;
  padding: clamp(26px, 3.2vw, 40px) !important;
}
body.about-redesign .about-closing h2 {
  font-size: clamp(27px, 2.25vw, 36px) !important;
}
body.about-redesign .about-closing p:not(.about-section-eyebrow) {
  font-size: clamp(16px, 1.05vw, 18px) !important;
}

@media (max-width: 900px) {
  body.about-redesign .about-hero {
    padding: 40px 22px !important;
  }
  body.about-redesign .about-parcours-figure {
    width: min(100%, 560px) !important;
    max-width: 560px !important;
    padding: 10px !important;
  }
  body.about-redesign .about-parcours-figure img {
    max-width: 540px !important;
  }
  body.about-redesign .about-wide-visual {
    width: min(100%, 980px) !important;
  }
}

@media (max-width: 680px) {
  body.about-redesign .about-hero h1 {
    font-size: clamp(32px, 9vw, 42px) !important;
  }
  body.about-redesign .about-band {
    padding-top: 34px !important;
    padding-bottom: 34px !important;
  }
  body.about-redesign .about-parcours-figure {
    width: min(100%, 430px) !important;
    max-width: 430px !important;
    padding: 8px !important;
  }
  body.about-redesign .about-parcours-figure img {
    max-width: 414px !important;
  }
}