/* Consult B · version ordinateur (v2.9.2)
   Tout ce fichier ne s'applique qu'aux écrans de 1024 px et plus : l'affichage sur téléphone ne change pas.
   Principe : un conteneur large, des en-têtes de section sur deux colonnes (titre à gauche, texte à droite),
   une police de titre plus affirmée et des textes plus grands. */
@media (min-width:1024px){

#cb .sh .ttl,.cbp .sh .ttl,#cb .cbh-ttl h1,#cb .cbn-h1,.cbp .ab-hero :is(h1,h2),.cbp .ct-hero :is(h1,h2),#cb .cbr-h1{font-feature-settings:"kern" 1}
:root{--pcw:min(1200px,88vw);--pcpad:max(6vw,calc((100vw - 1200px)/2));--ttl:"Plus Jakarta Sans",Inter,"Helvetica Neue",Arial,sans-serif}

/* Éléments réservés à l'ordinateur */
#cb .cb-pc,.cbp .cb-pc{display:block!important}
#cb span.cb-pc:not(.eyb){display:inline!important}
#cb .cb-mo,.cbp .cb-mo{display:none!important}

/* Petit sur-titre au-dessus des titres de section */
#cb .eyb,.cbp .eyb{display:flex!important;align-items:center;gap:12px;font:600 12px/1 Inter,Arial,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#93a6e3;margin:0 0 20px}
#cb .eyb::before,.cbp .eyb::before{content:"";width:32px;height:1px;background:currentColor;opacity:.7}

/* En-tête de section : titre à gauche, texte à droite */
#cb .sh,.cbp .sh{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);column-gap:clamp(48px,6vw,96px);align-items:end;width:var(--pcw);max-width:none;margin:0 auto 64px;text-align:left}
#cb .sh>.eyb,.cbp .sh>.eyb{grid-column:1/-1}
#cb .sh>h1,#cb .sh>h2,.cbp .sh>h2{grid-column:1;grid-row:2/span 2;align-self:end}
#cb .sh>p,.cbp .sh>p{grid-column:2}
#cb .sh>p,.cbp .sh>p{grid-row:2/span 2;align-self:end}
#cb .sh>p:not(:last-child),.cbp .sh>p:not(:last-child){grid-row:2;align-self:end}
#cb .sh>.sh-more,.cbp .sh>.sh-more{grid-row:3;align-self:start}

/* Titres */
#cb .sh .ttl,.cbp .sh .ttl,#cb .cbr-h1,.cbp .ab-hero :is(h1,h2),.cbp .ct-hero :is(h1,h2){font-family:var(--ttl)!important;font-weight:800!important;letter-spacing:-.035em!important;line-height:1.05!important;text-align:left!important;max-width:none!important;margin:0!important;padding:0!important;font-size:clamp(2.6rem,3.9vw,3.75rem)!important;text-wrap:balance}
#cb .sh .ttl::after,.cbp .sh .ttl::after{display:none!important}
#cb .sh .ttl em,.cbp .sh .ttl em,#cb .cbr-h1 em{font-style:normal;color:#7d93d8}
#cb .sh>.lead,.cbp .sh>.lead,#cb .sh>.cbr-lead,.cbp .sh>p{text-align:left!important;margin:0!important;max-width:46ch!important;font-size:18px!important;line-height:1.7!important;color:#b9bcc6!important;padding:0!important}
#cb .sh>.sh-more,.cbp .sh>.sh-more{margin-top:16px!important;font-size:15px!important;color:#8d919c!important}
#cb .cbh-ttl h1,#cb .cbn-h1,#cb .cbn-cta h2,.cbp .cta-b h2,#cb .cbr-cta h2,#cb #intro .ttl,.cbp .val h3,.cbp .st h3,.cbp .tm-c b,.cbp .how b,#cb .cbn-face h3{font-family:var(--ttl)!important}

/* ---------------------------------------------------------------- */
/* Accueil                                                           */
/* ---------------------------------------------------------------- */
#cb .cbh-ttl h1{font-size:clamp(64px,6.4vw,96px)!important;letter-spacing:-.045em!important;line-height:1.02!important}
#cb .cbh-ttl p{font-size:20px!important;max-width:44ch!important}
#cb .cbh-btn{font-size:16px!important;padding:17px 30px!important}
#cb .cbh-win #intro{padding:0 var(--pcpad)!important}
#cb .cbh-win #intro .ttl{font-size:clamp(3rem,4.6vw,4.4rem)!important;letter-spacing:-.04em;max-width:16ch}
#cb .cbh-win #intro .lead{font-size:19px!important;max-width:56ch!important}

#cb #clients .sh{margin-bottom:48px}
#cb #clients .cbn-all{margin-top:40px}

/* Notre approche : texte à gauche, animation à droite */
#cb #projets{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);grid-template-rows:auto auto auto 1fr;column-gap:clamp(56px,7vw,110px);align-items:start;text-align:left!important;padding-left:var(--pcpad)!important;padding-right:var(--pcpad)!important}
#cb #projets .sh{grid-column:1;grid-row:1;width:auto;grid-template-columns:1fr;margin:0 0 36px}
#cb #projets .sh>h2,#cb #projets .sh>p{grid-column:1;grid-row:auto}
#cb #projets .sh>.lead{margin-top:22px!important}
#cb #projets .pj{display:contents}
#cb #projets .stage{grid-column:2;grid-row:1/span 4;align-self:center;width:100%;max-width:460px;height:320px;margin:0 0 0 auto;transform-origin:center}
#cb #projets .steps{grid-column:1;grid-row:2;justify-content:flex-start;margin-bottom:18px}
#cb #projets .pill{font-size:.88rem;padding:9px 16px}
#cb #projets .cap{grid-column:1;grid-row:3;margin:0 0 18px!important;font-size:17px;max-width:44ch;text-align:left}
#cb #projets .lnk{grid-column:1;grid-row:4;justify-self:start;align-self:start}

/* ---------------------------------------------------------------- */
/* Services                                                          */
/* ---------------------------------------------------------------- */
/* Haut de page : titre, texte et boutons à gauche, carte des 3 offres à droite (v2.9.2) */
#cb .cbn-c{padding-top:clamp(64px,10vh,112px)!important}
#cb .cbn-c .cbn-wrap{max-width:var(--pcw);display:grid;grid-template-columns:minmax(0,1.25fr) minmax(340px,.85fr);column-gap:clamp(48px,6vw,96px);align-items:center;text-align:left}
#cb .cbn-c .cbn-wrap>*{grid-column:1/-1}
#cb .cbn-c .cbn-wrap>.cbn-tag{grid-column:1;grid-row:1;justify-self:start;display:flex;align-items:center;gap:12px;font-size:12px;letter-spacing:.2em;align-self:end}
#cb .cbn-c .cbn-wrap>.cbn-tag::before{content:"";width:32px;height:1px;background:currentColor;opacity:.7}
#cb .cbn-c .cbn-wrap>.cbn-h1{grid-column:1;grid-row:2;font-family:var(--ttl)!important;font-size:clamp(3.2rem,4.8vw,4.6rem)!important;letter-spacing:-.04em!important;line-height:1.02!important;margin:20px 0 0!important;text-align:left;max-width:12ch}
#cb .cbn-c .cbn-wrap>.cbn-lead2{grid-column:1;grid-row:3;margin:26px 0 0!important;text-align:left;font-size:18px;line-height:1.7;max-width:48ch;color:#b9bcc6}
#cb .cbn-c .cbn-wrap>.cbn-acts.cb-pc{grid-column:1;grid-row:4;display:flex!important;align-items:center;gap:26px;margin-top:34px}
#cb .cbn-acts .cbn-btn{font-size:16px;padding:17px 28px}
#cb .cbn-ghost{color:#e9ebf1;font-weight:600;font-size:16px;text-decoration:none;border-bottom:1px solid #ffffff40;padding-bottom:3px;transition:border-color .3s,color .3s}
#cb .cbn-ghost:hover{color:#fff;border-color:#fff}
#cb .cbn-c .cbn-wrap>.cbn-menu.cb-pc{grid-column:2;grid-row:1/span 4;align-self:center;display:flex!important;flex-direction:column;background:linear-gradient(160deg,#ffffff0d,#ffffff04);border:1px solid #ffffff17;border-radius:24px;padding:12px;box-shadow:0 30px 70px #0006}
#cb .cbn-menu-t{font:600 11px/1 Inter,Arial,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#8d919c;padding:14px 16px 12px}
#cb .cbn-menu a{display:flex;align-items:center;gap:16px;padding:18px 16px;border-radius:16px;color:#f2f3f6;text-decoration:none;transition:background .3s}
#cb .cbn-menu a+a{border-top:1px solid #ffffff0f}
#cb .cbn-menu a:hover{background:#ffffff0d}
#cb .cbn-menu i{flex:none;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:#7d93d81f;color:#9fb1ea}
#cb .cbn-menu svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#cb .cbn-menu span{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
#cb .cbn-menu b{font-family:var(--ttl);font-size:clamp(16px,1.3vw,18px);white-space:nowrap;font-weight:700;letter-spacing:-.015em}
#cb .cbn-menu small{font-size:14px;color:#9a9ea9}
#cb .cbn-menu em{font-style:normal;font:600 13px/1 Inter,Arial,sans-serif;color:#6f7480;transition:color .3s,transform .3s}
#cb .cbn-menu a:hover em{color:#c9d3f5;transform:translateX(3px)}
#cb .cbn-c .cbn-pills{display:none!important}
#cb .cbn-c .cbn-ribbons{width:100vw!important;margin:48px 0 56px calc(50% - 50vw)!important}
#cb .cbn-cards.cbn-3{gap:22px}
#cb .cbn-face{padding:30px 28px!important}
#cb .cbn-face h3{font-size:clamp(22px,1.9vw,26px)!important;letter-spacing:-.025em}
#cb .cbn-front p{font-size:16px!important;line-height:1.65}
#cb .cbn-flip:hover .cbn-face.cbn-front{border-color:#7b8be088}
#cb .cbn-note{text-align:center;font-size:15px;margin-top:32px!important}
#cb .cbn-cta{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:48px;align-items:center;text-align:left;padding:52px 60px!important;margin-top:64px!important}
#cb .cbn-cta::before{left:12%!important;top:-80%!important}
#cb .cbn-cta h2{grid-column:1;font-size:40px!important;letter-spacing:-.03em}
#cb .cbn-cta p{grid-column:1;margin:10px 0 0!important;font-size:17px}
#cb .cbn-cta .cbn-btn{grid-column:2;grid-row:1/span 2;font-size:16px;padding:18px 30px}
#cb .cbn-cta .cbn-sign{grid-column:1/-1;margin-top:28px;padding-top:20px;border-top:1px solid #ffffff14}

/* ---------------------------------------------------------------- */
/* Réalisations                                                      */
/* ---------------------------------------------------------------- */
/* Haut de page : le bandeau « Nos Réalisations » de la page sert de titre ;
   ici, une simple bande avec le texte d'intro et trois repères chiffrés (v2.9.2) */
#cb .cbr-page{padding-top:clamp(40px,6vh,64px)!important}
#cb .cbr-page .sh.cbr-intro{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);align-items:center;margin-bottom:72px;padding:36px 0;border-top:1px solid #ffffff17;border-bottom:1px solid #ffffff17}
#cb .cbr-intro>.cbr-lead{grid-column:1!important;grid-row:1!important;align-self:center!important;font-size:22px!important;line-height:1.55!important;color:#e4e6ec!important;max-width:30ch!important}
#cb .cbr-intro>.cbr-facts.cb-pc{grid-column:2;grid-row:1;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;list-style:none;margin:0;padding:0}
#cb .cbr-facts li{display:flex;flex-direction:column;gap:10px;padding:4px 0 4px 26px;border-left:1px solid #ffffff17}
#cb .cbr-facts b{font-family:var(--ttl);font-size:46px;font-weight:800;letter-spacing:-.04em;line-height:1;color:#fff}
#cb .cbr-facts span{font-size:15px;line-height:1.5;color:#9a9ea9;max-width:22ch}
.cbr-pj{border-radius:36px 36px 0 0!important}
.cbr-pj>*{max-width:none}
#cb .cbr-n{font-size:72px}
#cb .cbr-sum{font-size:19px!important;max-width:44ch}
#cb .cbr-cta{padding-left:var(--pcpad)!important;padding-right:var(--pcpad)!important}
#cb .cbr-cta h2{font-size:42px!important;letter-spacing:-.03em}
#cb .cbr-cta p{font-size:18px}

/* ---------------------------------------------------------------- */
/* À propos                                                          */
/* ---------------------------------------------------------------- */
/* Haut de page : texte et boutons à gauche, mosaïque de l'équipe à droite (v2.9.2) */
html .cbp .ab-hero{padding-top:clamp(64px,10vh,112px)!important;padding-bottom:clamp(48px,8vh,96px)!important}
html .cbp .ab-hero .sh{margin-bottom:0;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);grid-template-rows:1fr auto auto auto auto 1fr;align-items:start}
html .cbp .ab-hero .sh>.eyb{grid-column:1;grid-row:2;align-self:end}
html .cbp .ab-hero :is(h1,h2){grid-column:1!important;grid-row:3!important;align-self:start!important;font-size:clamp(2.8rem,4.1vw,4rem)!important;letter-spacing:-.04em!important;max-width:14ch!important}
html .cbp .ab-hero .sh>.lead{grid-column:1!important;grid-row:4!important;align-self:start!important;margin:26px 0 0!important;max-width:44ch!important}
html .cbp .ab-hero .ab-acts.cb-pc{grid-column:1;grid-row:5;display:flex!important;align-items:center;gap:26px;margin-top:34px;align-self:start}
html .cbp .ab-ghost{color:#e9ebf1;font-weight:600;text-decoration:none;border-bottom:1px solid #ffffff40;padding-bottom:3px;transition:border-color .3s}
html .cbp .ab-ghost:hover{border-color:#fff}
html .cbp .ab-vis.cb-pc{grid-column:2;grid-row:1/-1;display:grid!important;grid-template-columns:1fr 1fr;gap:18px;max-width:500px;width:100%;justify-self:end;padding-bottom:48px}
html .cbp .ab-vis figure{margin:0;aspect-ratio:4/5;border-radius:22px;overflow:hidden;background:#20232b;border:1px solid #ffffff14;box-shadow:0 24px 60px #0007}
html .cbp .ab-vis img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.9)}
html .cbp .ab-vis .t2,html .cbp .ab-vis .t4{transform:translateY(48px)}
html .cbp .ab-vis .t4{aspect-ratio:4/5;border-radius:22px;padding:26px;display:flex;flex-direction:column;justify-content:flex-end;gap:10px;background:radial-gradient(120% 120% at 0% 0%,#4b63a5 0%,#2b3a66 55%,#1d2337 100%);border:1px solid #6d84c755;box-shadow:0 24px 60px #0007}
html .cbp .ab-vis .t4 b{font-family:var(--ttl);font-size:64px;font-weight:800;letter-spacing:-.05em;line-height:.9;color:#fff}
html .cbp .ab-vis .t4 span{font-size:15px;line-height:1.5;color:#dfe5f7}
html .cbp .vals{max-width:var(--pcw);gap:22px}
html .cbp .val{padding:34px 30px}
html .cbp .val h3{font-size:1.5rem}
html .cbp .val p{font-size:1rem;line-height:1.65}

/* Méthode : titre fixe à gauche pendant que le fil défile à droite */
html .cbp .tlw{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(56px,7vw,110px);width:var(--pcw);margin:0 auto;align-items:start}
html .cbp .tlw .sh{position:sticky;top:140px;width:auto;grid-template-columns:1fr;margin:0}
html .cbp .tlw .sh>h2,html .cbp .tlw .sh>p{grid-column:1;grid-row:auto}
html .cbp .tlw .sh>.lead{margin-top:24px!important}
html .cbp .tlw .tl{max-width:none;margin:0;padding-top:6px}
html .cbp .st{padding-bottom:64px}
html .cbp .st h3{font-size:2.1rem}
html .cbp .st p{font-size:1.08rem;max-width:44ch}

html .cbp .tm{max-width:var(--pcw);gap:28px}
html .cbp .tm-c{width:calc((100% - 84px)/4)!important}
html .cbp .tm-c b{font-size:1.3rem;margin-top:4px}
html .cbp .tm-c span{font-size:.95rem}

/* Bandeau final : texte à gauche, bouton à droite */
html .cbp .cta-b{max-width:var(--pcw);display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:56px;align-items:center;text-align:left;padding:64px 72px}
html .cbp .cta-b h2{grid-column:1;font-size:clamp(2.6rem,3.6vw,3.4rem);margin-bottom:12px}
html .cbp .cta-b p{grid-column:1;margin:0;font-size:18px;max-width:52ch}
html .cbp .cta-b .btn{grid-column:2;grid-row:1/span 2;font-size:1rem;padding:18px 32px}

/* ---------------------------------------------------------------- */
/* Contact                                                           */
/* ---------------------------------------------------------------- */
html .cbp .ct-hero{padding-top:clamp(72px,11vh,120px)!important;padding-bottom:56px!important}
html .cbp .ct-hero .sh{margin-bottom:0}
html .cbp .ct-hero :is(h1,h2){font-size:clamp(3.2rem,5vw,4.9rem)!important;letter-spacing:-.045em!important}
html .cbp #rdv .bk{max-width:var(--pcw)}
html .cbp section:has(>.oth){display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(56px,7vw,110px);align-items:center;padding-left:var(--pcpad)!important;padding-right:var(--pcpad)!important}
html .cbp section:has(>.oth) .sh{width:auto;grid-template-columns:1fr;margin:0}
html .cbp section:has(>.oth) .sh>h2{grid-row:auto}
html .cbp .oth{max-width:none;margin:0;grid-template-columns:1fr 1fr!important;justify-content:stretch}
html .cbp .how{max-width:var(--pcw);gap:22px}
html .cbp .how div{padding:30px 28px}
html .cbp .how b{font-size:1.25rem}
html .cbp .how p{font-size:.98rem}
}

/* Très grands écrans */
@media (min-width:1600px){
:root{--pcw:1280px;--pcpad:calc((100vw - 1280px)/2)}
}

/* v2.9.69 : titre de l’accueil sur 2 lignes à l’ordinateur (la pyramide inversée reste sur téléphone), taille selon la hauteur de l’écran, bloc centré entre l’en-tête et la petite fenêtre (placée à 66 % de la hauteur) pour que le bouton reste au-dessus */
@media (min-width:1024px){body #cb .cbh-ttl h1{font-size:clamp(48px,min(6.4vw,10vh),96px)!important}body #cb .cbh-ttl h1>span:nth-child(n+2){display:inline!important}body #cb .cbh-ttl{padding-top:120px!important;padding-bottom:calc(34vh + 20px)!important}body #cb .cbh-ttl p{margin-top:22px!important}body #cb .cbh-btn{margin-top:28px!important}}

/* v2.9.77 : titre de la page Réalisations */
@media(min-width:1024px){#cb .cbr-page>h1.cbr-h1{text-align:left!important;padding:0!important;max-width:var(--pcw,1200px)!important;width:var(--pcw,1200px)!important;margin:0 auto 28px!important;font-size:clamp(3.2rem,4.8vw,4.6rem)!important}}

/* v2.9.129 : prénom et rôle au survol des photos de l'équipe (À propos, ordinateur) */
@media(min-width:1024px){html .cbp .ab-vis figure{position:relative}
html .cbp .ab-vis img{transition:transform .5s ease,filter .5s ease}
html .cbp .ab-vis figcaption{position:absolute;inset:auto 0 0 0;padding:60px 20px 18px;background:linear-gradient(to top,rgba(14,16,22,.92),rgba(14,16,22,0));display:flex;flex-direction:column;gap:4px;opacity:0;transform:translateY(10px);transition:opacity .35s ease,transform .35s ease;pointer-events:none}
html .cbp .ab-vis figcaption b{font-family:var(--ttl);font-size:22px;font-weight:800;letter-spacing:-.02em;color:#fff}
html .cbp .ab-vis figcaption span{font-size:14px;line-height:1.4;color:#a9b6e6}}
@media(min-width:1024px) and (hover:hover){html .cbp .ab-vis figure:hover figcaption{opacity:1;transform:none}
html .cbp .ab-vis figure:hover img{transform:scale(1.04);filter:saturate(1)}}
