/* Page d'accueil : proportions, couleurs et cadrages de la maquette initiale. */
#main.page-accueil {
  --navy: #08295a;
  --blue: #08295a;
  --orange: #ff5a19;
  color: var(--navy);
  background: #fbfaf7;
}

body:has(#main.page-accueil) .site-header {
  position: absolute;
  inset: 0 0 auto;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}
body:has(#main.page-accueil) .header-inner {
  width: 88%;
  max-width: none;
  min-height: 72px;
}
body:has(#main.page-accueil) .site-nav a { color: #08295a; }
body:has(#main.page-accueil) .site-nav a:hover,
body:has(#main.page-accueil) .site-nav a.active { color: #ff5a19; }
body:has(#main.page-accueil) .brand,
body:has(#main.page-accueil) .brand img { width: 130px; }
body:has(#main.page-accueil) .brand { height: 67px; }
body:has(#main.page-accueil) .header-contact { min-height: 39px; }

.page-accueil .mockup-home-continuum {
  background-color: #f8f7f3;
  background-image: url('assets/hero.png');
  background-size: 100% auto;
  background-position: center -60px;
  background-repeat: no-repeat;
}
.page-accueil .mockup-home-continuum > .hero {
  height: 350px;
  min-height: 350px;
  align-items: flex-start;
  background: linear-gradient(90deg,rgba(255,255,255,.67),rgba(255,255,255,.20) 44%,transparent 66%);
}
.page-accueil .hero .shell {
  width: 88%;
  max-width: none;
  padding: 104px 0 0;
}
.page-accueil .hero-copy { max-width: 500px; }
.page-accueil .hero .eyebrow { display: none; }
.page-accueil .hero h1 {
  font-size: clamp(3rem,4.25vw,4.2rem);
  line-height: .96;
  letter-spacing: -.055em;
  margin-bottom: .48rem;
}
.page-accueil .hero h1::after {
  content: '';
  display: block;
  width: 28px;
  height: 3px;
  margin-top: .38rem;
  background: var(--orange);
}
.page-accueil .hero p {
  max-width: 425px;
  font-size: .98rem;
  line-height: 1.28;
}

.page-accueil .mockup-home-continuum > .home-expertises {
  min-height: 265px;
  padding: 15px 0 20px;
  background: linear-gradient(90deg,rgba(255,255,255,.94),rgba(255,255,255,.85) 69%,rgba(255,255,255,.56));
}
.page-accueil .home-expertises .shell { width: 80%; max-width: none; }
.page-accueil .home-expertises .eyebrow,
.page-accueil .about-band .eyebrow,
.page-accueil .home-references .eyebrow,
.page-accueil .trust .eyebrow {
  font-size: .72rem;
  margin-bottom: .3rem;
}
.page-accueil .eyebrow::before { width: 25px; height: 2px; }
.page-accueil .home-expertises .section-heading { margin: 0 0 .55rem 25px; }
.page-accueil .home-expertises .section-heading h2 { font-size: clamp(1.45rem,1.9vw,1.8rem); }
.page-accueil .home-expertises .expertise-grid { max-width: none; gap: 0; }
.page-accueil .home-expertises .expertise-card {
  min-height: 172px;
  padding: .25rem 1.5rem .2rem;
  border-left: 1px solid #d9dde1;
}
.page-accueil .home-expertises .expertise-card .num { font-size: 2.55rem; font-weight: 400; }
.page-accueil .home-expertises .expertise-card .line { width: 27px; height: 2px; margin: .3rem 0 .45rem; }
.page-accueil .home-expertises .expertise-card h3 { font-size: 1.13rem; margin-bottom: .3rem; }
.page-accueil .home-expertises .expertise-card p { font-size: .9rem; line-height: 1.18; margin-bottom: .45rem; }
.page-accueil .home-expertises .expertise-card .circle-link { width: 29px; height: 29px; font-size: 1rem; }

.page-accueil .mockup-home-continuum > .about-band {
  min-height: 205px;
  background-image: linear-gradient(90deg,rgba(255,255,255,.94),rgba(255,255,255,.79) 42%,rgba(255,255,255,.03) 74%),url('assets/hero.png');
  background-size: auto,100% auto;
  background-position: center,center bottom;
  background-repeat: no-repeat;
}
.page-accueil .about-band .shell { width: 88%; max-width: none; padding: 1.1rem 0; }
.page-accueil .about-band h2 { font-size: clamp(1.7rem,2.2vw,2.1rem); line-height: 1.06; margin-bottom: .4rem; }
.page-accueil .about-band p { font-size: .94rem; line-height: 1.25; margin-bottom: .6rem; }
.page-accueil .about-band .button { min-height: 36px; padding: .45rem 1.1rem; font-size: .8rem; }

.page-accueil .home-references {
  padding: 1.25rem 0 .9rem;
  background: #fbfaf7;
}
.page-accueil .home-references .shell { width: 82%; max-width: none; }
.page-accueil .home-references .section-heading { margin-bottom: .55rem; }
.page-accueil .home-references .section-heading h2 { font-size: clamp(1.45rem,1.95vw,1.85rem); }
.page-accueil .home-more { margin-top: .5rem; }

.page-accueil .trust { padding: .5rem 0 .8rem; background: #fff; }
.page-accueil .trust .shell { width: 82%; max-width: none; }
.page-accueil .trust .eyebrow { margin-bottom: .3rem; }
.page-accueil .client-carousel { display: flex; align-items: center; gap: .35rem; }
.page-accueil .client-arrow { display: none; }
.page-accueil .mockup-clients-track { flex: 1; overflow: hidden; }
.page-accueil .mockup-clients-logos {
  width: 1100px;
  min-width: 1100px;
  height: 49px;
  aspect-ratio: auto;
  background-image: url('assets/home-initial-mockup.png');
  background-size: 1956px 1304px;
  background-position: -224px -1114px;
}

@media (max-width: 700px) {
  body:has(#main.page-accueil) .site-header {
    position: relative;
    background: #fff;
    box-shadow: 0 1px 0 #e8eaeb;
  }
  body:has(#main.page-accueil) .header-inner { width: 92%; min-height: 64px; }
  body:has(#main.page-accueil) .brand,
  body:has(#main.page-accueil) .brand img { width: 100px; }
  body:has(#main.page-accueil) .brand { height: 56px; }
  body:has(#main.page-accueil) .site-nav { top: 64px; }
  .page-accueil .mockup-home-continuum { background: none; }
  .page-accueil .mockup-home-continuum > .hero {
    height: 250px;
    min-height: 250px;
    background-image: linear-gradient(90deg,rgba(255,255,255,.91),rgba(255,255,255,.58) 53%,rgba(255,255,255,.03)),url('assets/hero.png');
    background-size: auto,auto 290px;
    background-position: center,center top;
    background-repeat: no-repeat;
  }
  .page-accueil .hero .shell { width: 92%; padding-top: 1.2rem; }
  .page-accueil .hero-copy { max-width: none; }
  .page-accueil .hero h1 { font-size: clamp(2rem,8vw,2.5rem); }
  .page-accueil .hero p { max-width: 250px; font-size: .75rem; line-height: 1.18; }
  .page-accueil .mockup-home-continuum > .home-expertises {
    min-height: 0;
    padding: .7rem 0 .2rem;
    background: #fff;
  }
  .page-accueil .home-expertises .shell { width: 92%; }
  .page-accueil .home-expertises .section-heading { margin: 0 0 .25rem 25px; }
  .page-accueil .home-expertises .section-heading h2 { font-size: 1.15rem; line-height: 1.1; }
  .page-accueil .home-expertises .expertise-card {
    display: grid;
    grid-template-columns: 43px 2px minmax(0,1fr) 30px;
    column-gap: .55rem;
    min-height: 76px;
    padding: .3rem 0;
    border-left: 0;
    border-bottom: 1px solid #e2e3e4;
  }
  .page-accueil .home-expertises .expertise-card .num { grid-column: 1; grid-row: 1/3; font-size: 2rem; }
  .page-accueil .home-expertises .expertise-card .line {
    display: block;
    grid-column: 2;
    grid-row: 1/3;
    width: 2px;
    height: 54px;
    margin: 0;
  }
  .page-accueil .home-expertises .expertise-card h3 { grid-column: 3; grid-row: 1; font-size: .98rem; margin: 0; }
  .page-accueil .home-expertises .expertise-card p { grid-column: 3; grid-row: 2; font-size: .77rem; line-height: 1.08; margin: 0; }
  .page-accueil .home-expertises .expertise-card .circle-link {
    grid-column: 4;
    grid-row: 1/3;
    width: 28px;
    height: 28px;
    margin: 0;
  }
  .page-accueil .mockup-home-continuum > .about-band {
    min-height: 150px;
    background-image: linear-gradient(90deg,rgba(255,255,255,.97),rgba(255,255,255,.78) 49%,rgba(255,255,255,.05)),url('assets/hero.png');
    background-size: auto,auto 500px;
    background-position: center,right bottom;
    background-repeat: no-repeat;
  }
  .page-accueil .about-band .shell { width: 92%; padding: .65rem 0; }
  .page-accueil .about-band h2 { font-size: 1.25rem; margin-bottom: .3rem; }
  .page-accueil .about-band p { max-width: 245px; font-size: .74rem; margin-bottom: .4rem; }
  .page-accueil .about-band .button { min-height: 31px; padding: .3rem .8rem; font-size: .68rem; }
  .page-accueil .home-references { padding: .8rem 0; }
  .page-accueil .home-references .shell,
  .page-accueil .trust .shell { width: 92%; }
  .page-accueil .home-references .section-heading h2 { font-size: 1.17rem; }
  .page-accueil .trust { padding: .35rem 0 .55rem; }
  .page-accueil .client-arrow {
    display: grid;
    place-items: center;
    flex: 0 0 25px;
    width: 25px;
    height: 25px;
    padding: 0;
    border: 1px solid #cbd1d7;
    border-radius: 50%;
    background: #fff;
    color: #7b8792;
    cursor: pointer;
  }
  .page-accueil .mockup-clients-track {
    overflow-x: auto;
    scrollbar-width: none;
  }
  .page-accueil .mockup-clients-track::-webkit-scrollbar { display: none; }
  .page-accueil .mockup-clients-logos {
    width: 660px;
    min-width: 660px;
    height: 32px;
    background-size: 1174px 782px;
    background-position: -134px -668px;
  }
}