/* Professionnels */

/* Hero ------------------------------------------------------------------- */
.pro-hero { position: relative; display: flex; flex-direction: column; min-height: max(760px, 100svh); background: var(--nuit); overflow: hidden; isolation: isolate; }
.pro-hero__bg { position: absolute; inset: 0; z-index: -1; }
.pro-hero__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 75% 30%; }
.pro-hero__bg::after {
  content: ''; position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(11, 18, 32, .96) 0%, rgba(11, 18, 32, .82) 45%, rgba(11, 18, 32, .15) 100%),
    linear-gradient(180deg, rgba(11, 18, 32, .5) 0%, rgba(11, 18, 32, 0) 30%, rgba(11, 18, 32, .6) 100%);
}
.pro-hero__inner { flex: 1; display: grid; align-content: center; justify-items: start; gap: 28px; padding-top: calc(var(--header-h) + 64px); padding-bottom: 72px; }
.pro-hero__inner .breadcrumb { color: var(--texte-inverse-2); }
.pro-hero__title { max-width: 14ch; }
.pro-hero__lead { max-width: 560px; color: var(--texte-inverse-2); }
.pro-hero__actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 12px; }

.pro-facts { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(244, 241, 234, .14); background: rgba(11, 18, 32, .72); backdrop-filter: blur(6px); }
.pro-facts > div { display: grid; gap: 8px; padding: 28px clamp(20px, 2.4vw, 32px) 30px; border-left: 1px solid rgba(244, 241, 234, .14); }
.pro-facts > div:first-child { border-left: 0; padding-left: max(var(--gutter), calc((100vw - var(--container)) / 2)); }
.pro-facts dt { font-size: 10px; }
.pro-facts dd { font-family: var(--font-titre); font-size: 20px; font-weight: 500; letter-spacing: -.02em; }
.pro-facts dd.pro-facts__aut { font-family: var(--font-mono); font-size: 13px; letter-spacing: .02em; padding-top: 4px; overflow-wrap: anywhere; }
@media (max-width: 1023px) {
  .pro-facts { grid-template-columns: 1fr 1fr; }
  .pro-facts > div:first-child { padding-left: var(--gutter); }
  .pro-facts > div:nth-child(3) { border-left: 0; padding-left: var(--gutter); }
  .pro-facts > div:nth-child(n + 3) { border-top: 1px solid rgba(244, 241, 234, .14); }
}
@media (max-width: 599px) {
  .pro-hero { min-height: 0; }
  .pro-hero__inner { padding-top: calc(var(--header-h) + 88px); padding-bottom: 48px; gap: 20px; }
  .pro-hero__actions .btn { width: 100%; }
  .pro-facts dd { font-size: 17px; }
}

/* 01 — Enjeux ------------------------------------------------------------ */
.pro-split { display: grid; grid-template-columns: minmax(0, 440px) minmax(0, 1fr); gap: clamp(48px, 7vw, 96px); align-items: start; }
.pro-split__intro { display: grid; gap: 28px; position: sticky; top: calc(var(--header-h) + 40px); }
.pro-split__title { font-size: clamp(34px, 3.9vw, 56px); }
.enjeux { border-top: 1px solid var(--ligne); }
.enjeu { display: grid; grid-template-columns: 40px 1fr 1.2fr; gap: 12px 24px; padding-block: 36px; border-bottom: 1px solid var(--ligne); }
.enjeu__index { font-family: var(--font-mono); font-size: 11px; color: var(--laiton-encre); padding-top: 6px; }
@media (max-width: 1023px) {
  .pro-split { grid-template-columns: 1fr; }
  .pro-split__intro { position: static; }
}
@media (max-width: 767px) {
  .enjeu { grid-template-columns: 32px 1fr; padding-block: 24px; }
  .enjeu .text { grid-column: 2; }
}

/* 02 — Prestations ------------------------------------------------------- */
.pro-head { padding-bottom: 48px; border-bottom: 1px solid var(--ligne); }
.pro-head__aside { display: grid; justify-items: start; gap: 20px; max-width: 540px; }
.presta-meta { display: flex; justify-content: space-between; gap: 16px; width: 100%; }
.presta-main { display: grid; grid-template-columns: 1.55fr 1fr; gap: clamp(32px, 4.4vw, 64px); align-items: center; }
.presta-main__media { aspect-ratio: 742 / 470; }
.presta-main__body { display: grid; justify-items: start; gap: 22px; }
.dash-list { width: 100%; border-top: 1px solid var(--ligne); }
.dash-list li { display: flex; align-items: center; gap: 14px; padding-block: 11px; border-bottom: 1px solid var(--ligne); font-size: 15px; }
.dash-list li::before { content: ''; width: 12px; height: 1px; background: var(--laiton); flex: none; transition: width var(--t) var(--ease); }
.dash-list li:hover::before { width: 20px; }

.presta-grid { display: grid; grid-template-columns: 1.28fr 1fr 1fr; gap: clamp(24px, 3.3vw, 48px); align-items: start; margin-top: clamp(64px, 6vw, 96px); }
.presta { display: grid; justify-items: start; gap: 14px; }
.presta .media { width: 100%; margin-bottom: 10px; }
.presta__media--a { aspect-ratio: 450 / 350; }
.presta__media--b { aspect-ratio: 356 / 254; }
.presta__media--c { aspect-ratio: 352 / 292; }
.presta--b { margin-top: 118px; }
.presta--c { margin-top: 46px; }
.pro-also { display: flex; align-items: center; gap: 12px 24px; flex-wrap: wrap; margin-top: 72px; padding-top: 28px; border-top: 1px solid var(--ligne); }
.pro-also p { font-size: 15px; color: var(--texte-2); }
@media (max-width: 1023px) {
  .presta-main { grid-template-columns: 1fr; }
  .presta-grid { grid-template-columns: 1fr 1fr; }
  .presta--b, .presta--c { margin-top: 0; }
}
@media (max-width: 599px) {
  .presta-grid { grid-template-columns: 1fr; gap: 48px; }
  .pro-also { margin-top: 48px; }
}

/* 03 — Secteurs ------------------------------------------------------------ */
.secteurs__intro { max-width: 460px; }
.secteurs { display: grid; grid-template-columns: minmax(0, 430px) minmax(0, 1fr); gap: clamp(40px, 5.5vw, 80px); align-items: start; }
.secteurs__fig { position: sticky; top: calc(var(--header-h) + 40px); display: grid; gap: 14px; }
.secteurs__media { aspect-ratio: 430 / 590; }
.secteurs__list { border-top: 1px solid var(--ligne-sombre); }
.secteurs__list li { position: relative; display: grid; grid-template-columns: 48px minmax(0, 1fr) minmax(0, 270px); gap: 8px 24px; align-items: center; padding-block: 22px; border-bottom: 1px solid var(--ligne-sombre); }
.secteurs__list li::after { content: ''; position: absolute; left: 0; bottom: -1px; height: 1px; width: 100%; background: var(--laiton); transform: scaleX(0); transform-origin: left; transition: transform 700ms var(--ease); }
.secteurs__list li:hover::after { transform: scaleX(1); }
.secteurs__index { font-family: var(--font-mono); font-size: 11px; color: var(--laiton-clair); }
.secteurs__name { font-family: var(--font-titre); font-size: clamp(21px, 1.95vw, 28px); font-weight: 500; letter-spacing: -.025em; line-height: 1.1; transition: transform 480ms var(--ease); }
.secteurs__list li:hover .secteurs__name { transform: translateX(6px); }
.secteurs__list .text { font-size: 14px; }
.clientele { display: flex; flex-wrap: wrap; gap: 32px 64px; margin-top: 72px; padding-top: 40px; border-top: 1px solid var(--ligne-sombre); }
.clientele__group { display: grid; gap: 16px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chips li { padding: 8px 14px; border: 1px solid rgba(244, 241, 234, .3); border-radius: var(--radius); font-size: 14px; font-weight: 500; transition: border-color var(--t) var(--ease), background var(--t) var(--ease), color var(--t) var(--ease); }
.chips li:hover { border-color: var(--laiton-clair); color: var(--laiton-clair); }
@media (max-width: 1023px) {
  .secteurs { grid-template-columns: 1fr; }
  .secteurs__fig { position: static; }
  .secteurs__media { aspect-ratio: 16 / 9; }
}
@media (max-width: 599px) {
  .secteurs__list li { grid-template-columns: 32px 1fr; }
  .secteurs__list .text { grid-column: 2; }
  .clientele { margin-top: 48px; }
}

/* 04 — Expertise & moyens ------------------------------------------------- */
.moyens { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: clamp(40px, 5.5vw, 80px); align-items: start; }
.moyens__fig { position: sticky; top: calc(var(--header-h) + 40px); }
.moyens__media { aspect-ratio: 742 / 700; }
.moyens__body { display: grid; justify-items: start; gap: 24px; padding-top: 24px; }
.moyens__title { font-size: clamp(34px, 3.3vw, 48px); }
.moyens__list { width: 100%; margin-top: 16px; border-top: 1px solid var(--ligne); }
.moyens__list li { display: grid; grid-template-columns: 22px 1fr; gap: 18px; padding-block: 20px; border-bottom: 1px solid var(--ligne); }
.moyens__icon { width: 20px; height: 20px; color: var(--laiton-encre); margin-top: 2px; transition: transform 480ms var(--ease); }
.moyens__list li:hover .moyens__icon { transform: translateY(-2px) rotate(-6deg); }
.moyens__name { font-family: var(--font-titre); font-size: 19px; font-weight: 600; letter-spacing: -.02em; margin-bottom: 6px; }
.moyens__list .text { font-size: 14px; }
@media (max-width: 1023px) {
  .moyens { grid-template-columns: 1fr; }
  .moyens__fig { position: static; }
  .moyens__media { aspect-ratio: 4 / 3; }
}

/* 05 — Méthode ------------------------------------------------------------ */
.pro-steps { display: grid; grid-template-columns: repeat(5, 1fr); }
.pro-steps li { display: grid; align-content: start; gap: 14px; padding-inline: 28px; border-left: 1px solid var(--ligne-sombre); }
.pro-steps li:first-child { border-left: 0; padding-left: 0; }
.pro-steps__num { font-family: var(--font-titre); font-size: clamp(36px, 3.1vw, 44px); font-weight: 300; letter-spacing: -.04em; line-height: 1; color: var(--laiton-clair); margin-bottom: 16px; transition: transform 600ms var(--ease); }
.pro-steps li:hover .pro-steps__num { transform: translateY(-4px); }
.pro-steps .text { font-size: 14px; }
.pro-note { display: flex; align-items: center; gap: 12px 20px; flex-wrap: wrap; margin-top: 72px; padding-top: 28px; border-top: 1px solid var(--ligne-sombre); }
.pro-note p { font-size: 14px; color: var(--texte-inverse-2); }
@media (max-width: 1023px) {
  .pro-steps { grid-template-columns: 1fr 1fr; gap: 40px 0; }
  .pro-steps li:nth-child(odd) { border-left: 0; padding-left: 0; }
}
@media (max-width: 599px) {
  .pro-steps { grid-template-columns: 1fr; gap: 0; }
  .pro-steps li { grid-template-columns: 56px 1fr; padding: 22px 0; border-left: 0; border-top: 1px solid var(--ligne-sombre); }
  .pro-steps__num { grid-row: span 2; margin: 0; font-size: 32px; }
  .pro-note { margin-top: 40px; }
}

/* 06 — FAQ ------------------------------------------------------------------- */
.faq-layout { display: grid; grid-template-columns: minmax(0, 400px) minmax(0, 1fr); gap: clamp(40px, 7.5vw, 112px); align-items: start; }
.faq-layout__intro { display: grid; justify-items: start; gap: 24px; position: sticky; top: calc(var(--header-h) + 40px); }
.faq-layout__title { font-size: clamp(30px, 2.8vw, 40px); }
.faq-layout__phone { font-size: 20px; letter-spacing: .08em; text-transform: none; color: var(--nuit); transition: color var(--t) var(--ease); }
.faq-layout__phone:hover { color: var(--laiton-encre); }
@media (max-width: 1023px) {
  .faq-layout { grid-template-columns: 1fr; }
  .faq-layout__intro { position: static; }
}