/* GodMaster — design system transversal PrimeO
   Nexus = Core + Grade + Scope · Core = Dock ± Cell ± Engine */

.po-godmaster {
  --ug-depth: #0a1628;
  --ug-tide: #0d2a4a;
  --ug-foam: #f2f8ff;
  --ug-mist: #f5f8fc;
  --ug-signal: #0071e3;
  --ug-signal-2: #0d477f;
  --ug-ink: #1d1d1f;
  --ug-ink-soft: #6e6e73;
  --ug-line: rgba(0, 0, 0, 0.08);
  --po-ink: var(--ug-ink);
  --po-ink-2: #515154;
  --po-ink-3: #86868b;
  --po-card: #ffffff;
  --po-card-border: var(--ug-line);
}

/* Dev pill — hidden on customer pages */
.po-godmaster .proto-pill {
  display: none !important;
}

/* ── Reveal (global) ── */
.po-godmaster.po-motion .po-reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}
.po-godmaster.po-motion .po-reveal.visible {
  opacity: 1;
  transform: none;
}
.po-godmaster .po-reveal-delay-1 { transition-delay: 0.08s; }
.po-godmaster .po-reveal-delay-2 { transition-delay: 0.16s; }
.po-godmaster .po-reveal-delay-3 { transition-delay: 0.24s; }

/* ── Hero compact (hub, landing secondaires) ── */
.ug-hero--compact {
  position: relative;
  min-height: min(68svh, 620px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: 80px 22px 48px;
  overflow: hidden;
  color: var(--ug-foam);
  background: var(--ug-depth);
  text-align: center;
}
.ug-hero--compact .ug-hero-bleed {
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    radial-gradient(ellipse 75% 45% at 50% -8%, rgba(0, 113, 227, 0.3) 0%, transparent 58%),
    linear-gradient(180deg, #071018 0%, var(--ug-depth) 50%, #0c1e38 100%);
}
.ug-hero--compact .ug-caustic,
.ug-hero--compact .ug-tide {
  position: absolute;
  pointer-events: none;
}
.ug-hero--compact .ug-caustic {
  inset: -10% -5%;
  background: repeating-linear-gradient(
    115deg,
    transparent 0 18px,
    rgba(106, 161, 245, 0.05) 18px 20px
  );
  mix-blend-mode: screen;
  animation: gmCaustic 16s linear infinite;
  opacity: 0.55;
}
.ug-hero--compact .ug-tide {
  left: -10%;
  right: -10%;
  bottom: -12%;
  height: 38%;
  background: radial-gradient(ellipse 55% 75% at 50% 100%, rgba(0, 113, 227, 0.35), transparent 62%);
  filter: blur(3px);
  animation: gmTide 10s ease-in-out infinite alternate;
}
.ug-hero--compact .ug-hero-copy {
  position: relative;
  z-index: 2;
  max-width: 680px;
}
.ug-hero--compact .ug-headline {
  font-size: clamp(36px, 5.5vw, 52px);
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1.05;
  margin: 0 0 12px;
}
.ug-hero--compact .ug-sub {
  font-size: clamp(17px, 2.2vw, 20px);
  line-height: 1.4;
  color: rgba(242, 248, 255, 0.78);
  margin: 0 auto 24px;
  max-width: 28em;
}

/* 4-step journey strip */
.gm-steps {
  position: relative;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 20px;
  margin-top: 8px;
  padding: 0 12px;
}
.gm-step {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: rgba(242, 248, 255, 0.55);
}
.gm-step .n {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.15);
}
.gm-step.is-here {
  color: #fff;
}
.gm-step.is-here .n {
  background: var(--ug-signal);
  border-color: var(--ug-signal);
}

/* Hub solution tiles */
.gm-hub-section {
  padding: 56px 22px 72px;
  background: var(--ug-mist);
}
.gm-hub-section .po-product-row {
  max-width: 1040px;
  margin: 0 auto;
}
.gm-hub-section .po-product-tile {
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.35s ease;
}
.gm-hub-section .po-product-tile:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 48px rgba(13, 71, 127, 0.12);
}

/* Closing band */
.gm-band {
  text-align: center;
  padding: 56px 22px;
  background: var(--ug-depth);
  color: var(--ug-foam);
}
.gm-band h2 {
  font-size: clamp(26px, 3.5vw, 36px);
  font-weight: 700;
  letter-spacing: -0.035em;
  margin: 0 0 8px;
}
.gm-band p {
  margin: 0 0 22px;
  color: rgba(242, 248, 255, 0.65);
  font-size: 16px;
}

/* ── Hero assembly wow (accueil) ── */
.po-godmaster .ug-hero-stage::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: 28%;
  width: 140px;
  height: 140px;
  margin-left: -70px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0, 113, 227, 0.45) 0%, transparent 70%);
  opacity: 0;
  pointer-events: none;
  animation: gmCoreBurst 9s ease-in-out infinite;
}
.po-godmaster .ug-op {
  animation: gmOpFade 9s ease-in-out infinite;
}
.po-godmaster .ug-piece--dock {
  animation: gmDockAssemble 9s cubic-bezier(0.42, 0, 0.2, 1) infinite;
}
.po-godmaster .ug-piece--cell {
  animation: gmCellAssemble 9s cubic-bezier(0.42, 0, 0.2, 1) infinite;
}
.po-godmaster .ug-piece--engine {
  animation: gmEngineAssemble 9s cubic-bezier(0.42, 0, 0.2, 1) infinite;
}
.po-godmaster .ug-piece--core {
  animation: gmCoreGlow 9s ease-in-out infinite;
}
.po-godmaster .ug-cell-charge {
  animation: gmChargePulse 2.4s ease-in-out infinite;
}

@keyframes gmCaustic {
  to { transform: translate3d(2%, 1%, 0); }
}
@keyframes gmTide {
  0%, 100% { transform: translateY(0) scale(1); opacity: 0.85; }
  50% { transform: translateY(-6px) scale(1.03); opacity: 1; }
}
@keyframes gmOpFade {
  0%, 26% { opacity: 0.55; }
  38%, 72% { opacity: 0.08; }
  84%, 100% { opacity: 0.55; }
}
@keyframes gmDockAssemble {
  0%, 26% { transform: translate(0, 0) scale(1); opacity: 1; }
  44% { transform: translate(491px, 0) scale(0.32); opacity: 0.5; }
  54%, 70% { transform: translate(491px, 0) scale(0.08); opacity: 0; }
  82%, 100% { transform: translate(0, 0) scale(1); opacity: 1; }
}
@keyframes gmCellAssemble {
  0%, 26% { transform: translate(0, 0) scale(1); opacity: 1; }
  44% { transform: translate(312px, 0) scale(0.38); opacity: 0.55; }
  54%, 70% { transform: translate(312px, 0) scale(0.1); opacity: 0; }
  82%, 100% { transform: translate(0, 0) scale(1); opacity: 1; }
}
@keyframes gmEngineAssemble {
  0%, 26% { transform: translate(0, 0) scale(1); opacity: 1; }
  44% { transform: translate(176px, 0) scale(0.42); opacity: 0.55; }
  54%, 70% { transform: translate(176px, 0) scale(0.12); opacity: 0; }
  82%, 100% { transform: translate(0, 0) scale(1); opacity: 1; }
}
@keyframes gmCoreGlow {
  0%, 28% { transform: scale(1); filter: drop-shadow(0 0 0 transparent); }
  48%, 68% { transform: scale(1.08); filter: drop-shadow(0 0 32px rgba(0, 113, 227, 0.85)); }
  82%, 100% { transform: scale(1); filter: drop-shadow(0 0 0 transparent); }
}
@keyframes gmCoreBurst {
  0%, 40% { opacity: 0; transform: scale(0.6); }
  52%, 66% { opacity: 0.75; transform: scale(1.4); }
  78%, 100% { opacity: 0; transform: scale(0.6); }
}
@keyframes gmChargePulse {
  0%, 100% { opacity: 0.5; transform: scaleY(0.82); }
  50% { opacity: 1; transform: scaleY(1); }
}

@media (prefers-reduced-motion: reduce) {
  .po-godmaster .ug-piece--dock,
  .po-godmaster .ug-piece--cell,
  .po-godmaster .ug-piece--engine,
  .po-godmaster .ug-piece--core,
  .po-godmaster .ug-op,
  .po-godmaster .ug-cell-charge,
  .po-godmaster .ug-engine-spin,
  .po-godmaster .ug-hero-stage::after,
  .ug-hero--compact .ug-caustic,
  .ug-hero--compact .ug-tide {
    animation: none !important;
  }
  .po-godmaster.po-motion .po-reveal {
    opacity: 1;
    transform: none;
  }
}