/* ============================================================
   À PROPOS refonte V2.5 — fashioncurvyshop.com (03/08/2026, refonte-code)
   Déployé dans : wp-content/themes/enfold-child/refonte-apropos.css (STAGING)
   Source de vérité : maintenance-fcs/ux/refonte-apropos.css
   Enfilé UNIQUEMENT sur is_page(12365) — page dédiée, distincte de
   refonte-vitrine.css depuis que cette page a reçu un remplacement complet
   de texte (contenu maquette V2.5, EXCEPTION explicitement autorisée par
   la gérante le 03/08/2026 à la règle générale de non-réécriture — valable
   pour cette seule page). Backup du texte d'origine :
   maintenance-fcs/ux/page-12365.avant-refonte-texte-20260803-044702.txt
   ============================================================ */

#top.page-id-12365 .fcs-apropos-h1 {
  font-family: var(--fcs-font-title);
  color: var(--fcs-prune);
  font-weight: 400;
  font-size: clamp(26px, 5vw, 44px);
  /* --fcs-hn-lh : la règle sitewide de refonte-socle.css (3 ID) bat toute
     redéclaration de `line-height` d'un fichier de gabarit (2 ID max). La
     valeur doit donc passer par la variable, posée SUR LE TITRE lui-même. */
  --fcs-hn-lh: 1.15;
  line-height: 1.15;
  margin: 8px 0 14px;
  max-width: 18ch;
}
#top.page-id-12365 .fcs-apropos-lead {
  font-family: var(--fcs-font-text);
  color: var(--fcs-text-secondary);
  font-size: 18px;
  line-height: 1.6;
  max-width: 60ch;
  margin: 0 0 8px;
}

#top.page-id-12365 .fcs-apropos-stat { max-width: 76ch; margin-top: 32px; }
#top.page-id-12365 .fcs-apropos-stat-figure {
  font-family: var(--fcs-font-title);
  color: var(--fcs-framboise);
  font-size: clamp(22px, 3vw, 28px);
  font-weight: 400;
  margin: 0 0 14px;
}
#top.page-id-12365 .fcs-apropos-stat p {
  font-family: var(--fcs-font-text);
  color: var(--fcs-text-secondary);
  line-height: 1.75;
  font-size: 16.5px;
}
#top.page-id-12365 .fcs-apropos-stat a { color: var(--fcs-framboise, #b04d6b); text-decoration: underline; text-underline-offset: 2px; }
#top.page-id-12365 .fcs-apropos-stat a:hover { color: var(--fcs-framboise, #b04d6b); }

#top.page-id-12365 .fcs-apropos-body { max-width: 76ch; margin: 0 auto; }
#top.page-id-12365 .fcs-apropos-body h2,
#top.page-id-12365 .fcs-apropos-section-title {
  font-family: var(--fcs-font-title);
  color: var(--fcs-prune);
  font-weight: 400;
  font-size: clamp(24px, 3.5vw, 32px);
  margin: 0 0 18px;
}
#top.page-id-12365 .fcs-apropos-body p,
#top.page-id-12365 .fcs-apropos-body-p {
  font-family: var(--fcs-font-text);
  color: var(--fcs-text-secondary);
  line-height: 1.75;
  font-size: 16.5px;
  max-width: 76ch;
}

#top.page-id-12365 .fcs-apropos-grid3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 24px;
}
#top.page-id-12365 .fcs-apropos-grid4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 24px;
}
#top.page-id-12365 .fcs-apropos-card {
  background: var(--fcs-white);
  border: 1px solid var(--fcs-border-light);
  border-radius: var(--fcs-radius-md);
  padding: 24px;
  text-decoration: none;
  display: block;
}
#top.page-id-12365 .fcs-apropos-card--sm { padding: 20px; }
#top.page-id-12365 .fcs-apropos-card-icon { font-size: 26px; display: block; margin-bottom: 10px; }
#top.page-id-12365 .fcs-apropos-card h3 {
  font-family: var(--fcs-font-text);
  color: var(--fcs-prune);
  font-size: 15.5px;
  font-weight: 600;
  margin: 0 0 8px;
}
#top.page-id-12365 .fcs-apropos-card p {
  font-family: var(--fcs-font-text);
  color: var(--fcs-text-secondary);
  font-size: 14px;
  line-height: 1.6;
  margin: 0;
}
#top.page-id-12365 .fcs-apropos-social-card {
  transition: box-shadow var(--fcs-duration-enter) var(--fcs-ease-out), transform var(--fcs-duration-enter) var(--fcs-ease-out);
}
#top.page-id-12365 .fcs-apropos-social-card:hover,
#top.page-id-12365 .fcs-apropos-social-card:focus-visible { box-shadow: var(--fcs-shadow-lg); transform: translateY(-4px); }

/* Section fond sombre (FAQ + accordéon natif Enfold — mêmes classes que la
   page FAQ dédiée, restylées de façon identique pour cohérence). */
#top.page-id-12365 .fcs-apropos-faq .togglecontainer,
#top.page-id-12365 .fcs-apropos-toggle { margin-bottom: 0; }
#top.page-id-12365 .fcs-apropos-toggle .single_toggle {
  border: 1px solid var(--fcs-border-light);
  border-radius: var(--fcs-radius-md);
  margin-bottom: 10px;
  overflow: hidden;
  background: var(--fcs-white);
}
#top.page-id-12365 .fcs-apropos-toggle p.toggler {
  font-family: var(--fcs-font-text);
  font-weight: 600;
  font-size: 15px;
  color: var(--fcs-prune) !important;
  background: transparent !important;
  padding: 15px 20px !important;
  min-height: 44px;
  display: flex;
  align-items: center;
}
#top.page-id-12365 .fcs-apropos-toggle .single_toggle.active_tab p.toggler,
#top.page-id-12365 .fcs-apropos-toggle p.toggler:hover {
  background: var(--fcs-bg-soft) !important;
  color: var(--fcs-framboise) !important;
}
#top.page-id-12365 .fcs-apropos-toggle .toggle_content {
  font-family: var(--fcs-font-text);
  color: var(--fcs-text-secondary);
  line-height: 1.7;
  padding: 4px 20px 18px !important;
  background: var(--fcs-white) !important;
}

/* CTA finale (fond prune) */
#top.page-id-12365 .fcs-apropos-cta { text-align: center; }
#top.page-id-12365 .fcs-apropos-cta-title {
  font-family: var(--fcs-font-title);
  color: var(--fcs-white);
  font-weight: 400;
  font-size: clamp(26px, 4vw, 36px);
  margin: 0 0 14px;
}
#top.page-id-12365 .fcs-apropos-cta-text {
  font-family: var(--fcs-font-text);
  color: rgba(255, 255, 255, .78);
  font-size: 16px;
  max-width: 56ch;
  margin: 0 auto 28px;
}
#top.page-id-12365 .fcs-apropos-cta-buttons {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  flex-wrap: wrap;
}
#top.page-id-12365 .fcs-apropos-cta-link {
  font-family: var(--fcs-font-text);
  font-size: 14.5px;
  font-weight: 600;
  color: var(--fcs-framboise, #b04d6b); /* étude 3 (06/08) : rose 2,40:1 échoue, framboise 5,10:1 AA */
  text-decoration: none;
  border-bottom: 1px solid var(--fcs-framboise, #b04d6b);
  padding-bottom: 2px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
#top.page-id-12365 .fcs-apropos-cta-link:hover,
#top.page-id-12365 .fcs-apropos-cta-link:focus-visible { color: var(--fcs-prune, #2a1620); border-color: var(--fcs-prune, #2a1620); } /* étude 3 (06/08) : blanc sur blanc rendait le lien invisible au focus clavier — corrigé en prune, AA */

#top.page-id-12365 .fcs-apropos-presse-link {
  text-align: center;
  font-family: var(--fcs-font-text);
  color: var(--fcs-text-secondary);
  margin-top: 8px;
}
#top.page-id-12365 .fcs-apropos-presse-link a { color: var(--fcs-framboise); font-weight: 600; }

@media only screen and (max-width: 989px) {
  #top.page-id-12365 .fcs-apropos-grid3 { grid-template-columns: repeat(2, 1fr); }
  #top.page-id-12365 .fcs-apropos-grid4 { grid-template-columns: repeat(2, 1fr); }
}
@media only screen and (max-width: 767px) {
  #top.page-id-12365 .fcs-apropos-grid3,
  #top.page-id-12365 .fcs-apropos-grid4 { grid-template-columns: 1fr; gap: 14px; }
  #top.page-id-12365 .fcs-apropos-cta-buttons { flex-direction: column; }
}

/* ============================================================
   H1 — application de la maquette V2.5 (décision gérante 04/08/2026)

   Enfold pose TROIS propriétés sur tout h1 du thème, pas une :
     #top #wrap_all .all_colors h1 { font-family: birthstone;
                                     font-size: 80px;        (sous @media desktop)
                                     line-height: 0.7em }
   La passe d'interligne n'en neutralisait qu'UNE. Les règles de gabarit
   ci-dessous étaient sous 2 ID et perdaient donc sur les deux autres.
   Corrigé au niveau `#top #wrap_all #main` (3 ID, convention validée par
   refonte-compat), les trois propriétés traitées d'un coup. L'interligne
   passe par --fcs-hn-lh, posée SUR LE TITRE (la règle sitewide à 3 ID de
   refonte-socle.css bat toute redéclaration de line-height).

   ⚠️ NE PAS UNIFORMISER : la maquette ne veut PAS la même chose partout.
   faq/contact/livraison/presse/entretien/live = Birthstone 76 px ;
   a-propos = Marcellus. Valeurs relevées frame par frame dans le prototype.
   ============================================================ */
/* Maquette « apropos » : Marcellus 44 px (desktop) / 26 px (mobile), lh 1,2.
   Bornes EXACTES de la frame « apropos » (26 px mobile / 44 px desktop),
   servies en clamp fluide plutôt qu'en deux paliers fixes : mêmes valeurs
   aux extrémités, sans marche brutale aux largeurs intermédiaires. */
#top #wrap_all #main h1.fcs-apropos-h1 {
  font-family: var(--fcs-font-title);
  font-size: clamp(26px, 5vw, 44px);
  font-weight: 400;
  color: var(--fcs-prune);
  --fcs-hn-lh: 1.2;
  line-height: 1.2;
}

/* ⚠️ `!important` OBLIGATOIRE ET BORNÉ AU MOBILE — mesuré, pas supposé.
   Enfold pose, sous @media (max-width:767px) :
     #top #wrap_all .all_colors h1, .main-title .entry-title
       { font-size: 35px !important }
   (relevé par getPropertyPriority sur la page réelle). Aucune spécificité,
   si haute soit-elle, ne bat un !important : les 3 ID ci-dessus suffisent
   pour la POLICE et l'INTERLIGNE (règles Enfold en priorité normale) mais
   PAS pour la taille en mobile. En desktop la règle adverse (80px) est en
   priorité normale : aucun !important n'y est nécessaire, et il n'y en a pas. */
@media only screen and (max-width: 767px) {
  #top #wrap_all #main h1.fcs-apropos-h1 { font-size: clamp(26px, 5vw, 44px) !important; }
}
