/* ═══════════════════════════════════════════════════════════════
   partenaire.css — Styles specific to partenaire.html
   Requires shared.css to be loaded first.
   ═══════════════════════════════════════════════════════════════ */

/* ── Page accent color for glow effects ── */
:root {
  --page-accent: var(--g-principal);
  --page-accent-rgb: 45, 140, 71;
}

/* ── Body background tint — subtle green, same as shared.css pattern ── */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(ellipse at 20% 30%, rgba(45,140,71,.04) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 70%, rgba(45,140,71,.03) 0%, transparent 50%),
    linear-gradient(180deg, #F4F7FE, #F7FDF9);
  pointer-events: none;
}

/* ── Skip link ── */
.skip-link {
  background: var(--g-principal);
}

/* ── Nav overrides ── */
nav { height: 72px; }
.nav-cta {
  background: linear-gradient(135deg, var(--g-principal), var(--g-vif)) !important;
  color: #fff !important;
  box-shadow: 0 4px 18px rgba(45, 140, 71, .25);
}
.nav-cta:hover {
  box-shadow: 0 8px 28px rgba(45, 140, 71, .35);
  transform: translateY(-2px);
}
.nav-cta-alt {
  background: rgba(255,255,255,.12) !important;
  color: rgba(255,255,255,.88) !important;
  border: 1px solid rgba(255,255,255,.22) !important;
}

/* ── Eyebrow ── */
/* Eyebrow pills — keep pill shape, just tint green */
.eyebrow, .why-eyebrow {
  background: linear-gradient(135deg, var(--g-principal), var(--g-vif)) !important;
  color: #fff !important;
}
.hero-eyebrow {
  background: rgba(45, 140, 71, .12) !important;
  color: var(--g-principal) !important;
  border-color: var(--g-l3) !important;
}

/* ── KPIs green theme ── */
.kpi-num { color: var(--g-principal) !important; }
.hero-kpis > div { border-color: var(--g-l3) !important; }

/* ── Primary buttons ── */
.btn-p,
.hero-btns .btn-p {
  background: linear-gradient(135deg, var(--g-principal), var(--g-vif)) !important;
  color: #fff !important;
  box-shadow: 0 8px 24px rgba(45, 140, 71, .3) !important;
  animation: pulse-glow-g 3s ease-in-out infinite;
}
.btn-p:hover {
  box-shadow: 0 14px 40px rgba(45, 140, 71, .4);
  transform: translateY(-3px);
}
@keyframes pulse-glow-g {
  0%, 100% { box-shadow: 0 8px 24px rgba(45, 140, 71, .3); }
  50% { box-shadow: 0 8px 32px rgba(45, 140, 71, .5), 0 0 0 6px rgba(45, 140, 71, 0); }
}

/* ── Ghost button ── */
.btn-g {
  border-color: var(--g-l3) !important;
  color: var(--g-principal) !important;
}
.btn-g:hover {
  background: var(--g-l1) !important;
  border-color: var(--g-principal) !important;
}

/* ── Accent spans ── */
.acc-g { color: var(--g-vif); }

/* ── Hero particles ── */
.hero-particles .particle {
  background: var(--g-l4) !important;
}

/* ── Focus ring ── */
:focus-visible {
  outline-color: var(--g-vif) !important;
}

/* ═══════════════════════════════════════════════
   PARTNERSHIP TYPES GRID
   ═══════════════════════════════════════════════ */
.partner-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin-top: 2rem;
}
.partner-card {
  background: rgba(255, 255, 255, .7);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(45, 140, 71, .08);
  border-radius: 20px;
  padding: 2rem 1.5rem;
  text-align: center;
  transition: all .35s ease;
  box-shadow: 0 2px 16px rgba(45, 140, 71, .04);
}
.partner-card:hover {
  background: rgba(255, 255, 255, .95);
  transform: translateY(-6px);
  box-shadow: 0 16px 48px rgba(45, 140, 71, .12);
  border-color: var(--g-l3);
}
.partner-card .pc-emoji {
  font-size    : 1.6rem;
  margin-bottom: 1rem;
  display      : flex;
  align-items  : center;
  justify-content: center;
  width        : 56px;
  height       : 56px;
  margin-left  : auto;
  margin-right : auto;
  border-radius: 16px;
  background   : rgba(45,140,71,.18);
  border       : 1.5px solid rgba(45,140,71,.35);
}
.partner-card .pc-emoji::after {
  content: none;
}
.partner-card .pc-title {
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--b-noir);
  margin-bottom: .5rem;
}
.partner-card .pc-desc {
  font-size: .88rem;
  color: var(--texte-soft);
  line-height: 1.6;
}

/* ═══════════════════════════════════════════════
   ADVANTAGES LIST
   ═══════════════════════════════════════════════ */
.advantages-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
  margin-top: 2rem;
}
.advantage-item {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  background: rgba(255,255,255,.6);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(45,140,71,.06);
  border-radius: 16px;
  padding: 1.5rem;
  transition: all .3s ease;
}
.advantage-item:hover {
  background: rgba(255,255,255,.9);
  transform: translateY(-3px);
  box-shadow: 0 8px 30px rgba(45,140,71,.08);
}
.advantage-item .ai-emoji {
  font-size    : 1.3rem;
  flex-shrink  : 0;
  width        : 40px;
  height       : 40px;
  min-width    : 40px;
  border-radius: 11px;
  background   : rgba(45,140,71,.18);
  border       : 1.5px solid rgba(45,140,71,.32);
  display      : flex;
  align-items  : center;
  justify-content: center;
}
.advantage-item .ai-emoji::after {
  content: none;
}
.advantage-item .ai-title {
  font-size: .95rem;
  font-weight: 700;
  color: var(--b-noir);
  margin-bottom: .3rem;
}
.advantage-item .ai-desc {
  font-size: .85rem;
  color: var(--texte-soft);
  line-height: 1.6;
}

/* ═══════════════════════════════════════════════
   STICKY BAR
   ═══════════════════════════════════════════════ */
.sticky-cta-bar .sticky-primary {
  background: linear-gradient(135deg, var(--g-principal), var(--g-vif));
  color: #fff;
  box-shadow: 0 6px 24px rgba(45, 140, 71, .4), 0 2px 8px rgba(0, 0, 0, .08);
  animation: stickyPulseGreen 3s ease-in-out infinite;
}
@keyframes stickyPulseGreen {
  0%, 100% { box-shadow: 0 6px 24px rgba(45, 140, 71, .4), 0 2px 8px rgba(0, 0, 0, .08); }
  50% { box-shadow: 0 8px 32px rgba(45, 140, 71, .55), 0 4px 16px rgba(45, 140, 71, .2); }
}

/* CTA shimmer for green buttons — inherited from shared.css
   (.btn-p, .nav-cta position/overflow/::after already defined there) */

/* ═══════════════════════════════════════════════
   RESPONSIVE — max-width: 960px
   ═══════════════════════════════════════════════ */
/* ═══════════════════════════════════════════════
   DESKTOP — Vision section fits one screen
   ═══════════════════════════════════════════════ */
@media (min-width: 601px) {
  #vision > div[style*="padding"] { padding: 56px 4% 32px !important; }
  #vision .tc { margin-bottom: 1.2rem !important; }
  #vision .tc > div[style*="margin-bottom:1.5rem"] { margin-bottom: .8rem !important; }
  #vision .tc h2 { font-size: clamp(1.8rem, 3.2vw, 2.5rem) !important; margin-bottom: .4rem !important; }
  #vision .tc p { font-size: 1rem !important; }
  .vision-manifeste { margin-bottom: 1.2rem !important; gap: .8rem !important; }
  .vision-manifeste > div { padding: 1.2rem 1.3rem !important; gap: .6rem !important; flex: 1 !important; min-width: 0 !important; }
  .vision-manifeste > div > div:first-child { font-size: 2.2rem !important; }
  .vision-manifeste > div > div > div:first-child { font-size: .95rem !important; }
  .vision-manifeste > div > div > p { font-size: .8rem !important; line-height: 1.5 !important; }
  .vision-mechanics { margin-bottom: .8rem !important; gap: .6rem !important; }
  .vision-mechanics > div { padding: .8rem .6rem !important; }
  .vision-mechanics > div > div[style*="font-size:1rem"] { font-size: 1rem !important; }
  #vision .vision-result-pill { padding: .7rem 1.2rem !important; }
  #vision .pill-line { font-size: .85rem !important; }
}

@media (max-width: 960px) {
  .partner-grid { grid-template-columns: repeat(2, 1fr); }
  .advantages-list { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════
   RESPONSIVE — max-width: 600px
   ═══════════════════════════════════════════════ */
@media (max-width: 600px) {
  /* Hero: flex-column without width:100% expands to h1 intrinsic width → overflow */
  .hero-inner { width: 100% !important; box-sizing: border-box !important; }
  .hero h1 { font-size: clamp(1.7rem, 7vw, 2.4rem) !important; letter-spacing: -1.5px !important; }

  /* Vision section: tighter padding */
  #vision { padding-top: clamp(15px, 2vh, 30px) !important; }

  /* Partner types grid: compact expandable rows */
  .partner-grid { grid-template-columns: 1fr !important; gap: .5rem !important; }
  .partner-card {
    display: flex !important; flex-direction: row !important;
    align-items: center !important; gap: .75rem !important;
    padding: .6rem .9rem !important; border-radius: 14px !important;
    cursor: pointer; text-align: left !important;
  }
  .partner-card .pc-emoji {
    width: 34px !important; height: 34px !important; min-width: 34px !important;
    font-size: 1rem !important; flex-shrink: 0 !important;
    margin: 0 !important; border-radius: 10px !important;
  }
  .partner-card .pc-title { font-size: .82rem !important; margin: 0 !important; line-height: 1.3 !important; }
  .partner-card .pc-desc { display: none !important; }
  .partner-card.expanded { flex-direction: column !important; align-items: flex-start !important; }
  .partner-card.expanded .pc-emoji { margin-bottom: .1rem !important; }
  .partner-card.expanded .pc-desc {
    display: block !important; font-size: .72rem !important; line-height: 1.55;
    margin-top: .2rem; color: rgba(255,255,255,.72) !important;
    animation: fadeSlideIn .4s cubic-bezier(.22,1,.36,1) forwards;
  }

  /* Advantages list: compact rows, hide desc until tapped */
  .advantages-list { grid-template-columns: 1fr !important; gap: .5rem !important; }
  .advantage-item {
    padding: .6rem .9rem !important; gap: .75rem !important;
    cursor: pointer; border-radius: 14px !important; align-items: center !important;
  }
  .advantage-item .ai-emoji {
    width: 32px !important; height: 32px !important; min-width: 32px !important;
    font-size: 1rem !important; border-radius: 10px !important;
  }
  .advantage-item .ai-title { font-size: .82rem !important; margin-bottom: 0 !important; line-height: 1.3 !important; }
  .advantage-item .ai-desc { display: none !important; }
  .advantage-item.expanded { align-items: flex-start !important; }
  .advantage-item.expanded .ai-desc {
    display: block !important; font-size: .72rem !important; line-height: 1.55;
    margin-top: .3rem; color: rgba(255,255,255,.68) !important;
    animation: fadeSlideIn .4s cubic-bezier(.22,1,.36,1) forwards;
  }
}

/* ═══════════════════════════════════════════════════════════════════
   ██  v3 CHROMATIC WORLDS — Partenaire (forest / trust / growth)
   ═══════════════════════════════════════════════════════════════════
   World: Deep forest-dark base + vivid emerald animated blobs.
   Glass panels become green-tinted trust & growth windows.
   ─────────────────────────────────────────────────────────────────── */

/* ── The World — moUve Green #2D8C47 / #34A853 ── */
body { background: #020D05 !important; }

/* ── U logo glow — brand signature background (right U removed) ── */
body::before {
  display            : none !important;
}
body::after {
  content            : '' !important;
  position           : fixed !important;
  inset              : auto !important;
  background         : url('img/U.svg') no-repeat center center !important;
  background-size    : contain !important;
  width              : 44vw !important;
  height             : 68vw !important;
  bottom             : -12% !important;
  left               : -8% !important;
  z-index            : -1 !important;
  pointer-events     : none !important;
  opacity            : .055 !important;
  filter             : brightness(0) invert(1)
                       drop-shadow(0 0 70px rgba(52,168,83,.9)) !important;
  animation          : uGlow 17s ease-in-out infinite reverse !important;
}

/* ── Hero ── */
.hero { background: transparent !important; position: relative; overflow: visible; }
.hero::before {
  content    : '';
  position   : absolute;
  width      : 80vw; height: 66vw;
  top        : -16%; left: 50%;
  transform  : translateX(-50%);
  background : radial-gradient(ellipse, rgba(52,168,83,.32) 0%, rgba(45,140,71,.1) 50%, transparent 70%);
  filter     : blur(52px);
  pointer-events: none;
  z-index    : 0;
}
.hero-inner { position: relative; z-index: 1; }

.hero h1 { color: #fff !important; letter-spacing: -3px !important; }
.hero .acc-g {
  background              : linear-gradient(135deg, #7DC08E 0%, #34A853 100%) !important;
  -webkit-background-clip : text !important;
  -webkit-text-fill-color : transparent !important;
  background-clip         : text !important;
  filter                  : drop-shadow(0 0 28px rgba(52,168,83,.7));
}
.hero .hero-eyebrow, .hero .why-eyebrow {
  background  : rgba(52,168,83,.15) !important;
  color       : rgba(125,192,142,.9) !important;
  border      : 1px solid rgba(52,168,83,.28) !important;
}
.hero .kpi-num {
  background              : linear-gradient(135deg, #7DC08E, #34A853) !important;
  -webkit-background-clip : text !important;
  -webkit-text-fill-color : transparent !important;
  background-clip         : text !important;
  filter                  : drop-shadow(0 0 18px rgba(52,168,83,.55)) !important;
}

/* ── CTA buttons — moUve green #34A853 / #2D8C47 ── */
.btn-p, .btn-partenaire {
  background : linear-gradient(135deg, #34A853, #2D8C47) !important;
  box-shadow : 0 8px 32px rgba(52,168,83,.45),
               inset 0 1px 0 rgba(255,255,255,.25) !important;
  color      : #fff !important;
}
.btn-p:hover, .btn-partenaire:hover {
  box-shadow : 0 16px 52px rgba(52,168,83,.65),
               inset 0 1px 0 rgba(255,255,255,.25) !important;
  transform  : translateY(-3px) !important;
}
.nav-cta {
  background : linear-gradient(135deg, #34A853, #2D8C47) !important;
  box-shadow : 0 4px 20px rgba(52,168,83,.4),
               inset 0 1px 0 rgba(255,255,255,.22) !important;
}

/* ── Sticky bar ── */
.sticky-cta-bar .sticky-primary {
  background : linear-gradient(135deg, #34A853, #2D8C47);
  color      : #fff;
  animation  : stickyPulseGreenV3 3s ease-in-out infinite;
}
@keyframes stickyPulseGreenV3 {
  0%, 100% { box-shadow: 0 6px 28px rgba(52,168,83,.45); }
  50%       { box-shadow: 0 10px 40px rgba(52,168,83,.65); }
}

/* ── Partner + advantage cards: dark-world backgrounds + text ── */
.partner-card {
  background  : rgba(45,140,71,.15) !important;
  border      : 1px solid rgba(52,168,83,.28) !important;
}
.partner-card:hover {
  background  : rgba(45,140,71,.22) !important;
  border-color: rgba(52,168,83,.45) !important;
  box-shadow  : var(--gl-shine), 0 32px 80px rgba(0,0,0,.5),
                0 0 70px rgba(52,168,83,.16) !important;
}
.partner-card .pc-title { color: #fff !important; }
.partner-card .pc-desc  { color: rgba(255,255,255,.72) !important; }

.advantage-item {
  background  : rgba(45,140,71,.12) !important;
  border      : 1px solid rgba(52,168,83,.22) !important;
}
.advantage-item:hover {
  background  : rgba(45,140,71,.2) !important;
  border-color: rgba(52,168,83,.38) !important;
  box-shadow  : var(--gl-shine), 0 20px 56px rgba(0,0,0,.45),
                0 0 50px rgba(52,168,83,.12) !important;
}
.advantage-item .ai-title { color: #fff !important; }
.advantage-item .ai-desc  { color: rgba(255,255,255,.68) !important; }

/* ── Ghost btn ── */
.btn-g {
  border-color: rgba(52,168,83,.35) !important;
  color       : rgba(125,192,142,.9) !important;
}
.btn-g:hover {
  background  : rgba(52,168,83,.12) !important;
  border-color: rgba(52,168,83,.6) !important;
}

/* ── v3 Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  .hero::before { display: none !important; }
  body::before, body::after { animation: none !important; }
}