/* Transparent footer branding and enlarged navigation logo. */
/* Let incomplete card rows fill the available width on every public page. */
body[data-page] :is(.projects-grid, .exp-grid-3, .service-grid, .training-grid, .team-grid, .training-steps) {
  --card-columns: 3;
  --card-gap: 24px;
  display: flex;
  flex-wrap: wrap;
  gap: var(--card-gap);
  align-items: stretch;
}
body[data-page] :is(.team-grid, .training-steps) { --card-columns: 4; }
body[data-page] .training-steps { --card-gap: 16px; }
body[data-page="services"] .service-grid { --card-gap: 20px; }
body[data-page="services"] #dev-it .it-services-grid { --card-gap: 24px; }
@media (max-width: 900px) {
  body[data-page="services"] #dev-it .it-services-grid { --card-gap: 20px; }
}
body[data-page] :is(.projects-grid, .exp-grid-3, .service-grid, .training-grid, .team-grid, .training-steps) > * {
  flex: 1 1 calc((100% - (var(--card-columns) - 1) * var(--card-gap)) / var(--card-columns));
  min-width: 0;
  max-width: 100%;
}
body[data-page] .projects-grid > .project-card {
  display: flex;
  flex-direction: column;
  height: auto;
  min-height: 0;
}
body[data-page] .projects-grid .project-meta p { min-height: 0; }
@media (max-width: 1100px) {
  body[data-page] :is(.projects-grid, .exp-grid-3, .service-grid, .training-grid, .team-grid, .training-steps) { --card-columns: 2; }
  body[data-page="index"] .growth-showcase .exp-grid-3 { --card-columns: 3; }
}
@media (max-width: 900px) {
  body[data-page="index"] .growth-showcase .exp-grid-3 { --card-columns: 1; }
}
@media (max-width: 780px) {
  body[data-page="services"] .service-grid { --card-columns: 1; }
}
@media (max-width: 600px) {
  body[data-page] :is(.projects-grid, .exp-grid-3, .service-grid, .training-grid, .team-grid, .training-steps) { --card-columns: 1; }
}
/* Keep the three project cards together, as in the reference layout. */
body[data-page] .projects-grid > .project-card .project-img-wrap {
  height: auto;
  flex: 0 0 auto;
  aspect-ratio: 16 / 10;
}
@media (min-width: 781px) {
  body[data-page] .projects-grid { --card-columns: 3; }
}
@media (max-width: 780px) {
  body[data-page] .projects-grid { --card-columns: 1; }
}
/* All groups containing exactly three cards use the same row layout. */
@media (min-width: 781px) {
  body[data-page] :is(.projects-grid, .exp-grid-3, .service-grid, .training-grid, .team-grid, .training-steps):has(> :nth-child(3):last-child) {
    --card-columns: 3;
  }
}
@media (max-width: 780px) {
  body[data-page] :is(.projects-grid, .exp-grid-3, .service-grid, .training-grid, .team-grid, .training-steps):has(> :nth-child(3):last-child) {
    --card-columns: 1;
  }
}
body[data-page] .growth-showcase .exp-grid-3 > .exp-block {
  height: auto;
  min-height: 460px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  background: #0b1f4a;
  border: 0;
}
body[data-page] .growth-showcase .exp-grid-3 > .exp-block::after { display: block; }
body[data-page] .growth-showcase .exp-grid-3 .exp-img-wrap {
  position: absolute;
  inset: 0;
  width: 100%;
  height: auto;
  aspect-ratio: auto;
  flex: 0 0 auto;
}
body[data-page] .growth-showcase .exp-grid-3 .exp-img-wrap img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
body[data-page] .growth-showcase .exp-grid-3 .exp-body { margin-top: auto; padding: 30px 28px 26px; color: #fff; }
body[data-page] .growth-showcase .exp-grid-3 .exp-body h3 { color: #fff; }
body[data-page] .growth-showcase .exp-grid-3 .exp-body :is(p, li) { color: rgba(255,255,255,.84); }
body[data-page] .growth-showcase .exp-grid-3 .exp-num-label { color: #b5c1ff; }
body[data-page] .growth-showcase .exp-grid-3 .exp-foot { border-color: rgba(255,255,255,.22); }
body[data-page] .growth-showcase .exp-grid-3 .exp-foot a { color: #fff; border-color: rgba(255,255,255,.42); background: rgba(255,255,255,.1); }
/* Internal pages keep the same desktop layout at desktop-mode phone widths. */
body[data-page]:not([data-page="index"]) .page-section { padding-block: 40px; }
body[data-page] .illustration-media img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
body[data-page="realisations"] .illustration-block { align-items: start; }
@media (min-width: 781px) {
  body[data-page] :is(.illustration-block, .illustration-block.reverse) { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 32px; }
  body[data-page] .about-layout { grid-template-columns: minmax(0,1.35fr) minmax(0,.9fr); }
  body[data-page] .contact-grid { grid-template-columns: minmax(0,1fr) minmax(0,1.8fr); }
  body[data-page] .formation-pricing-wrap { grid-template-columns: minmax(0,1fr) minmax(0,2fr); }
  body[data-page] :is(.team-grid, .training-steps):has(> :nth-child(4):last-child) { --card-columns: 4; }
  body[data-page] .kpi-strip, body[data-page] .chiffres-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
  body[data-page] .footer-inner { grid-template-columns: 1.2fr .8fr 1.2fr 1fr; gap: 24px; }
  html body[data-page="services"] .page-hero-inner.services-hero-grid { grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); gap: 32px; }
  html body[data-page="services"] #dev-it .it-services-heading { grid-template-columns: minmax(0,1.15fr) minmax(0,1fr); gap: 32px; }
  html body[data-page="services"] .services-project > div { flex-direction: row; align-items: center; }
  body[data-page="apropos"] [data-cms-group="apropos-section-3"] .about-layout { gap: 32px; }
}
@media (max-width: 780px) {
  body[data-page]:not([data-page="index"]) .page-section { padding-block: 30px; }
  body[data-page] .growth-showcase .exp-grid-3 > .exp-block { min-height: 400px; }
}
:root { color-scheme: only light; }
html { overflow-y: scroll; }
body[data-page] .site-header, body[data-page] .site-header.scrolled { background: #fff; color: var(--n900); }
.site-header { border-bottom: 1px solid #dbe3f1; }
.nav-links, .nav-cta, .language-switch { font-family: "Segoe UI", Arial, sans-serif; }
.language-switch { flex: 0 0 68px; width: 68px; justify-content: center; white-space: nowrap; }
.footer-logo { display: block; width: 232px; max-width: 100%; height: 52px; overflow: hidden; }
.footer-logo img { display: block; width: 232px; max-width: none; height: auto; margin-top: -28px; filter: brightness(0) invert(1); }
.footer-brand small { margin-top: 16px; }
.nav-inner { gap: 16px; }
.nav-links > a, .nav-drop-toggle { white-space: nowrap; padding-inline: 8px; }
.site-header:not(.scrolled) .mobile-menu-toggle span, .site-header.scrolled .mobile-menu-toggle span { background: #0b1f4a; }
.site-header .brand { display: block; flex-shrink: 0; width: 236px; height: 60px; overflow: hidden; }
.site-header .brand-logo { display: block; width: 236px; height: auto; max-width: none; margin-top: -27px; }
.mobile-drawer-logo { width: 200px; height: 52px; overflow: hidden; }
.mobile-drawer-logo img { width: 200px; height: auto; max-width: none; margin-top: -24px; }
@media (min-width: 1101px) and (max-width: 1350px) {
  .nav-inner { padding-inline: 24px; gap: 14px; }
  .site-header .brand { width: 202px; }
  .site-header .brand-logo { width: 202px; margin-top: -20px; }
}
@media (max-width: 1100px) {
  .site-header .brand { width: 188px; height: 54px; }
  .site-header .brand-logo { width: 188px; height: auto; margin-top: -19px; }
}
@media (min-width: 781px) and (max-width: 1100px) {
  .nav-inner { padding-inline: 16px; gap: 8px; }
  .nav-cta { display: none; }
  .nav-links > a, .nav-drop-toggle { font-size: 10px; letter-spacing: .02em; padding-inline: 5px; }
}
@media (min-width: 1101px) {
  .nav-links { display: grid; grid-template-columns: 72px 98px 246px 104px 88px; flex-shrink: 0; }
  .nav-links > a { text-align: center; }
  .nav-drop-toggle { width: 100%; }
}
@media (min-width: 781px) and (max-width: 1100px) {
  .nav-links { display: grid; grid-template-columns: 50px 64px 174px 66px 58px; flex-shrink: 0; }
  .nav-links > a { text-align: center; }
  .nav-drop-toggle { width: 100%; }
  body[data-page] .nav-cta { display: inline-flex; padding: 10px 12px; font-size: 11px; white-space: nowrap; }
}
