/* ============================================================
   SCIP — réseau (Réseau). Héros : copie à gauche, vrai écran
   Fournisseurs incliné, mot géant RÉSEAU derrière. Puis : Stocks
   et Commandes en blocs alternés avec leur capture, référentiel
   en grille de filets à côté de son écran, panneau sécurité.
   ============================================================ */

/* ---------- Héros ---------- */
.hero {
  position: relative; min-height: 94svh; overflow: hidden;
  display: flex; align-items: center;
  padding: clamp(104px, 14vh, 160px) var(--gutter) clamp(56px, 8vh, 104px);
}
.hero .ghost { left: -0.04em; bottom: -0.06em; font-size: 30vw; }
.hero-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 3vw; align-items: center; width: 100%; }
.hero-copy { position: relative; z-index: 3; }
.hero-copy .t-body { margin-top: 22px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 32px; }
.hero-figure { position: relative; z-index: 2; margin-right: calc(-1 * var(--gutter) - 3vw); perspective: 1400px; }
.hero-figure .shot-win { transform: perspective(1400px) rotateY(-7deg); transform-origin: 0 50%; }
.hero-figure figcaption { padding: 0 calc(var(--gutter) + 3vw) 0 4px; }
@media (max-width: 1000px) {
  .hero-figure figcaption { padding: 0; }
  .hero { min-height: 0; padding-top: 150px; }
  .hero-grid { grid-template-columns: 1fr; gap: 34px; }
  .hero-figure { margin-right: 0; }
  .hero-figure .shot-win { transform: none; }
  .hero .ghost { font-size: 44vw; bottom: 12%; }
}
@media (max-width: 640px) { .hero-actions .btn { width: 100%; } }

/* ---------- Blocs onglet : capture + copie ---------- */
.tab-block {
  display: grid; grid-template-columns: minmax(0, 1.28fr) minmax(0, .72fr); gap: clamp(26px, 4vw, 64px); align-items: center;
  padding: clamp(30px, 4vw, 60px) 0; border-top: 1px solid var(--line);
}
.tab-block.flip { grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr); }
.tab-block.flip .tab-copy { order: -1; }
.tab-copy .n { display: block; color: var(--muted); margin-bottom: 12px; }
.tab-copy h3 { margin-bottom: 16px; }
.tab-copy .t-body { max-width: 42ch; }
.fact {
  margin: 20px 0 0; padding: 14px 16px; max-width: 46ch;
  background: var(--surface); border-radius: var(--radius);
  border-left: 2px dashed var(--sim);                       /* provenance : données démo */
  font-size: 13.5px; line-height: 1.55; color: var(--ink);
}
@media (max-width: 960px) {
  .tab-block, .tab-block.flip { grid-template-columns: 1fr; }
  .tab-block.flip .tab-copy { order: 0; }
  .tab-block .tab-copy { order: -1; }
}
.score { display: grid; grid-template-columns: 180px 1fr; gap: 24px; padding-top: clamp(26px, 3vw, 44px); border-top: 1px solid var(--line); }
.score .n { color: var(--muted); }
.score p { margin: 0; max-width: 78ch; color: var(--muted); font-size: 14.5px; }
@media (max-width: 700px) { .score { grid-template-columns: 1fr; gap: 10px; } }

/* ---------- Référentiel ---------- */
.ref-section { padding-top: clamp(24px, 3vw, 48px); }
.ref-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(26px, 4vw, 64px); align-items: center; }
.ref-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.ref-grid li {
  display: flex; flex-direction: column; gap: 6px;
  padding: clamp(18px, 1.8vw, 26px) clamp(16px, 1.6vw, 24px);
  border-right: 1px solid var(--line); border-bottom: 1px solid var(--line);
}
.ref-grid b { font-family: var(--display); font-size: clamp(20px, 1.7vw, 27px); font-weight: 600; }
.ref-grid span { color: var(--muted); font-size: 13.5px; }
@media (max-width: 1000px) { .ref-layout { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .ref-grid { grid-template-columns: 1fr; } }

/* ---------- Sécurité ---------- */
.sec-panel { padding: clamp(26px, 3vw, 52px) clamp(22px, 3.6vw, 64px) clamp(24px, 2.4vw, 40px); }
.sec-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(24px, 2.6vw, 42px) clamp(24px, 3vw, 56px); }
.sec-item b { display: block; font-weight: 600; font-size: clamp(16px, 1.2vw, 19px); margin: 0 0 6px; }
.sec-item p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.55; max-width: 36ch; }
.sec-meta { margin: 32px 0 0; padding-top: 18px; border-top: 1px solid var(--line); color: var(--muted); font-size: 14px; display: flex; flex-wrap: wrap; gap: 8px 22px; align-items: baseline; }
@media (max-width: 960px) { .sec-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .sec-grid { grid-template-columns: 1fr; } }

/* ---------- CTA ---------- */
.cta-section { padding-bottom: clamp(72px, 8vw, 128px); }