.docs-hero{min-height:88vh;display:flex;align-items:center;position:relative;overflow:hidden;background:var(--color-bg);}
.docs-hero__grid{position:absolute;inset:0;background-image:linear-gradient(var(--color-divider) 1px,transparent 1px),linear-gradient(90deg,var(--color-divider) 1px,transparent 1px);background-size:60px 60px;opacity:0.2;pointer-events:none;}
.docs-hero__radial{position:absolute;inset:0;background:radial-gradient(ellipse 55% 65% at 70% 35%,oklch(from var(--color-primary) l c h / 0.10) 0%,transparent 60%);pointer-events:none;}
.flow-step{display:flex;gap:var(--space-5);align-items:flex-start;padding:var(--space-6);background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-xl);}
.flow-step__num{width:2.5rem;height:2.5rem;border-radius:50%;background:var(--color-primary-highlight);border:2px solid var(--color-primary);display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;font-size:var(--text-sm);color:var(--color-primary);flex-shrink:0;}
.flow-connector{width:2px;height:var(--space-4);background:var(--color-primary);opacity:0.4;margin-left:calc(1.25rem - 1px);}
@media (max-width: 768px) {
  main section:nth-of-type(2) > .container > div {
    display: flex !important;
    flex-direction: column !important;
    gap: var(--space-5);
  }

  main section:nth-of-type(2) > .container > div > div:nth-child(3),
  main section:nth-of-type(2) > .container > div > div:nth-child(4) {
    order: 1;
    width: 100%;
  }

  main section#processus div[style*="flex-direction:column;gap:var(--space-6);"] > div:nth-child(1),
  main section#processus div[style*="flex-direction:column;gap:var(--space-6);"] > div:nth-child(2),
  main section#processus div[style*="flex-direction:column;gap:var(--space-6);"] > div:nth-child(3) {
    order: 2;
    width: 100%;
  }
  
  main section#processus div[style*="flex-direction:column;gap:var(--space-6);"] > div > div {
    width: 100%;
  }
}