/* Charte dédiée manille studio — chargée uniquement sur les pages du tenant
   (theme.customCssUrl). La charte Manille (sable / terracotta / graphite) est
   déjà posée en variables de rôle par le renderer (themeToCssVars). Ce fichier
   ajoute : les alias d'usage des composants « chaîne » (--terracotta, --sable…),
   les couleurs HORS schéma (acier, sync), la graisse display et l'anim hero. */

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap");

[data-tenant="manille-studio"] {
  /* Alias lisibles, branchés sur les rôles du thème (pas de couleur en double). */
  --terracotta: var(--accent); /* marque, rare et précieuse */
  --graphite: var(--texte);
  --sable: var(--fond); /* fond principal — jamais de blanc pur */
  --sable-clair: var(--cartouche);
  /* Hors ThemeSchema (cf. STUDIO_COLORS de @manille/core). */
  --acier: #5b6b76; /* illustrations techniques, éléments secondaires */
  --sync: #1d9e75; /* RÉSERVÉ aux états « synchronisé ERP » */
}

[data-tenant="manille-studio"] *,
[data-tenant="manille-studio"] *::before,
[data-tenant="manille-studio"] *::after {
  box-sizing: border-box;
}

/* Graisse « display » : très grands titres uniquement (hero, CTA final). */
[data-tenant="manille-studio"] .ms-display {
  font-weight: 600;
  letter-spacing: -0.03em;
  line-height: 1.02;
}

/* Apparition au chargement — réservée au hero, sobre. */
@media (prefers-reduced-motion: no-preference) {
  @keyframes ms-apparait {
    from {
      opacity: 0;
      transform: translateY(14px);
    }
    to {
      opacity: 1;
      transform: none;
    }
  }
  [data-tenant="manille-studio"] .ms-apparait {
    animation: ms-apparait 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
  }
  [data-tenant="manille-studio"] .ms-apparait-2 {
    animation-delay: 0.12s;
  }
  [data-tenant="manille-studio"] .ms-apparait-3 {
    animation-delay: 0.24s;
  }
}

/* Header responsive : nav complète au-dessus de 760px, menu burger en dessous. */
[data-tenant="manille-studio"] .ms-show-mobile {
  display: none;
}
[data-tenant="manille-studio"] .ms-mobile-panel {
  display: none;
}
@media (max-width: 760px) {
  [data-tenant="manille-studio"] .ms-hide-mobile {
    display: none !important;
  }
  [data-tenant="manille-studio"] .ms-show-mobile {
    display: inline-flex;
  }
  [data-tenant="manille-studio"] .ms-mobile-panel {
    display: block;
  }
}