/* Microsoft 365: approved ALT desktop composition, original app colors. */
@import url("cloud-theme.css");
@media (min-width:1051px) {
  .m365-page.projects-page .m365-hero {
    background:var(--cloud-shell) url("../m365-vitres-sans-logo-net-v02.webp") center / cover no-repeat;
    background-blend-mode:normal;
  }
  /* One continuous lossless image, without the former wordmark or sprite overlays. */
  .m365-page.projects-page .m365-hero::before,
  .m365-page.projects-page .m365-hero::after {
    content:none;
  }
  .m365-main .m365-hero .m365-eyebrow {
    position:absolute;
    bottom:calc(100% + 24px);
    margin:0;
    color:#FFFFFF;
    font-size:14px;
    font-weight:500;
  }
  .m365-main .m365-accompaniment { padding:80px 0 0; }
  .m365-main .m365-managed-points { max-width:760px; margin:24px 0 0; padding-left:20px; list-style:disc; color:#000000; }
  .m365-main .m365-managed-points li + li { margin-top:8px; }
  .m365-main .m365-managed-points li::marker { color:var(--cloud-accent); }
  .m365-main .projects-tabs { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .m365-main .projects-tabs button { text-wrap:balance; }
  .m365-themes-layout .projects-panel { grid-template-columns:repeat(2,minmax(0,1fr)); gap:64px; }
  .m365-themes-layout .projects-panel > div { min-width:0; }
  .m365-diagram { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:center; gap:24px; min-height:176px; margin:0; padding:20px 0; }
  .m365-diagram-node { position:relative; display:grid; grid-template-rows:48px minmax(40px,auto); justify-items:center; gap:10px; min-width:0; text-align:center; font-size:13px; line-height:1.5; color:#000000; }
  .m365-diagram-icon { display:grid; place-items:center; width:56px; height:48px; color:var(--cloud-accent); }
  .m365-diagram-icon svg { display:block; width:32px; height:32px; }
  .m365-diagram-node:not(:last-child)::after { content:""; position:absolute; top:24px; left:calc(50% + 34px); width:calc(100% - 44px); border-top:1px dashed var(--cloud-accent); }
  .m365-main :is(.m365-apps,.m365-protection) { margin-top:80px; padding:0; }
  .m365-main .m365-section-lead { max-width:900px; margin-bottom:40px; }
  .m365-app-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; }
  .m365-app { min-width:0; padding:24px; border:1px solid #DDE6ED; border-radius:8px; background:#FFFFFF; }
  .m365-logo { display:flex; align-items:center; justify-content:center; width:48px; height:48px; overflow:hidden; margin-bottom:24px; }
  .m365-logo img { display:block; width:48px; height:48px; object-fit:contain; }
  .m365-logo img[src$="bookings.png"] { transform:scale(2.6); }
  .m365-logo img[src$="todo.png"] { width:32px; height:32px; }
  .m365-app h3 { margin:0 0 14px; font-size:20px; }
  .m365-apps-toggle {
    display:flex;
    align-items:center;
    justify-content:center;
    width:48px;
    height:48px;
    margin:32px auto 0;
    padding:10px;
    border:0;
    background:transparent;
    color:var(--cloud-accent);
    cursor:pointer;
  }
  .m365-apps-toggle:hover { color:var(--cloud-hover); }
  .m365-apps-toggle:focus-visible { outline:2px solid var(--cloud-accent); outline-offset:4px; }
  .m365-apps-toggle svg { display:block; width:28px; height:28px; flex:none; transition:transform 220ms ease; }
  .m365-apps-toggle[aria-expanded="true"] svg { transform:rotate(180deg); }
  .m365-more-apps { margin-top:24px; }
  .m365-more-apps[data-animating] { overflow:hidden; }
  .m365-more-apps > h3 { margin:0 0 24px; font-size:24px; }
  .m365-more-apps .m365-app-grid { grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px; }
  .m365-more-apps .m365-app { padding:20px; }
  .m365-more-apps .m365-logo { width:32px; height:32px; margin-bottom:16px; }
  .m365-more-apps .m365-logo img { width:32px; height:32px; }
  .m365-more-apps .m365-app h4 { margin:0 0 12px; font-size:18px; }
  .m365-more-apps .m365-app p { font-size:15px; line-height:1.5; }
  .m365-more-apps[hidden], .m365-apps-toggle[hidden] { display:none; }
  .m365-main .m365-guidance { margin-top:80px; padding:48px 0; background:var(--cloud-tint); }
  .m365-guidance :is(h2,h3,p) { color:#000000; }
  .m365-training-layout { display:grid; grid-template-columns:minmax(0,1fr) 340px; align-items:center; gap:64px; }
  .m365-training-layout > div { min-width:0; }
  .m365-training-photo { display:block; width:340px; max-width:100%; height:auto; aspect-ratio:1; object-fit:cover; object-position:45% 45%; border-radius:8px; }
  .m365-training-markers { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin:28px 0 0; padding:0; list-style:none; }
  .m365-training-markers li { display:flex; align-items:center; gap:8px; min-width:0; font-size:14px; line-height:1.5; color:#000000; }
  .m365-marker-icon { display:block; width:24px; height:24px; flex:none; color:var(--cloud-accent); }
  .m365-marker-icon svg { display:block; width:100%; height:100%; }
  .m365-protection-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px; margin-top:36px; }
  .m365-protection-grid > div { min-width:0; }
  .m365-protection-icon { display:block; width:32px; height:32px; margin-bottom:20px; color:var(--cloud-accent); }
  .m365-protection-icon svg { display:block; width:100%; height:100%; }
  .m365-protection-grid h3 { margin:0 0 12px; font-size:20px; }
  .m365-main :is(.m365-guidance,.m365-protection) p { max-width:960px; }
  .m365-main :is(.m365-guidance,.m365-protection) p + p { margin-top:24px; }
  /* The related frame already leaves 80px before the FAQ. */
  .m365-main .projects-related { margin-top:80px; }
  .m365-main .faq .section-inner { padding-top:0; padding-bottom:80px; }
  .m365-main .faq .serif-title { margin-bottom:36px; }
  .m365-main .projects-contact { padding-top:0; padding-bottom:80px; }

}
@media (min-width:1051px) and (prefers-reduced-motion:reduce) {
  .m365-apps-toggle svg { transition:none; }
}
