/* ═══════════════════════════════════════════════════════════
   PAGE SERVICES — Mobile-first
═══════════════════════════════════════════════════════════ */

/* ── HERO ─────────────────────────────────────────────────── */
.page-hero {
  background: linear-gradient(145deg,#1a1d3b 0%,#2d1060 50%,#0f3460 100%);
  padding: clamp(90px,12vw,130px) 0 clamp(60px,8vw,90px);
  position: relative; overflow: hidden;
}
.page-hero::before {
  content:''; position:absolute; inset:0;
  background-image: radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: 32px 32px; pointer-events:none;
}
.ph-orb { position:absolute; border-radius:50%; pointer-events:none; }
.ph-orb-1 { width:500px;height:500px;top:-180px;right:-120px;background:radial-gradient(circle,rgba(54,162,206,.18),transparent 70%); }
.ph-orb-2 { width:380px;height:380px;bottom:-120px;left:-80px; background:radial-gradient(circle,rgba(130,190,96,.14),transparent 70%); }

.ph-label {
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);
  color:rgba(255,255,255,.7);font-size:.75rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;
  padding:7px 18px;border-radius:50px;margin-bottom:20px;
}
.page-hero h1 {
  font-family:var(--font-heading);
  font-size:clamp(1.9rem,5vw,3.2rem);
  font-weight:800;color:#fff;line-height:1.15;margin-bottom:18px;
}
.page-hero-sub {
  font-size:clamp(.9rem,2vw,1.05rem);
  color:rgba(255,255,255,.7);line-height:1.8;max-width:560px;
}
.ph-breadcrumb {
  display:flex;align-items:center;gap:8px;
  margin-top:28px;font-size:.78rem;color:rgba(255,255,255,.4);flex-wrap:wrap;
}
.ph-breadcrumb a { color:rgba(255,255,255,.55);text-decoration:none; }
.ph-breadcrumb a:hover { color:#fff; }

/* ── SECTION CARTES SERVICES ──────────────────────────────── */
.section-services { padding: clamp(64px,10vw,110px) 0; background:#fff; }

.service-card {
  background: #fff;
  border-radius: 22px;
  border: 1.5px solid var(--c-border);
  padding: clamp(28px,4vw,44px);
  height: 100%;
  position: relative;
  overflow: hidden;
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  display: flex;
  flex-direction: column;
}
.service-card::before {
  content:'';
  position:absolute; top:0;left:0;right:0; height:4px;
  transition: opacity .28s;
  opacity: 0;
}
.sc-recrutement::before { background: linear-gradient(90deg,var(--c-purple),var(--c-blue)); }
.sc-interim::before     { background: linear-gradient(90deg,var(--c-blue),var(--c-green)); }
.sc-formation::before   { background: linear-gradient(90deg,var(--c-green),var(--c-blue)); }
.sc-sirh::before        { background: linear-gradient(90deg,var(--c-navy),var(--c-purple)); }

.service-card:hover { transform:translateY(-8px); box-shadow:0 24px 60px rgba(78,43,134,.12); border-color:transparent; }
.service-card:hover::before { opacity:1; }

/* Numéro décoratif */
.sc-num {
  position:absolute; top:18px; right:22px;
  font-family:var(--font-heading); font-size:3.5rem; font-weight:900;
  line-height:1; color:rgba(0,0,0,.04); pointer-events:none; user-select:none;
}

/* Icône */
.sc-icon {
  width: 64px; height: 64px; border-radius: 18px;
  display:flex;align-items:center;justify-content:center;
  font-size: 1.5rem; margin-bottom: 22px; flex-shrink:0;
}
.sc-recrutement .sc-icon { background:rgba(78,43,134,.1);  color:var(--c-purple); }
.sc-interim     .sc-icon { background:rgba(54,162,206,.1);  color:var(--c-blue);   }
.sc-formation   .sc-icon { background:rgba(130,190,96,.12); color:var(--c-green);  }
.sc-sirh        .sc-icon { background:rgba(26,29,59,.08);   color:var(--c-navy);   }

/* Titre + desc */
.sc-title {
  font-family:var(--font-heading); font-size:clamp(1.05rem,2vw,1.2rem);
  font-weight:800; color:var(--c-navy); margin-bottom:12px;
}
.sc-desc {
  font-size:.9rem; color:var(--c-text); line-height:1.8;
  margin-bottom:24px; flex:1;
}

/* Points forts */
.sc-points { list-style:none;padding:0;margin:0 0 28px; }
.sc-points li {
  display:flex;align-items:flex-start;gap:10px;
  font-size:.84rem;color:var(--c-text);line-height:1.65;
  padding:8px 0; border-bottom:1px solid rgba(0,0,0,.05);
}
.sc-points li:last-child { border-bottom:none; padding-bottom:0; }
.sc-check {
  width:18px;height:18px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:.55rem;color:#fff;flex-shrink:0;margin-top:2px;
}
.sc-recrutement .sc-check { background:var(--c-purple); }
.sc-interim     .sc-check { background:var(--c-blue);   }
.sc-formation   .sc-check { background:var(--c-green);  }
.sc-sirh        .sc-check { background:var(--c-navy);   }

/* Bouton carte */
.sc-btn {
  display:inline-flex;align-items:center;gap:8px;
  padding:12px 22px;border-radius:50px;
  font-family:var(--font-heading);font-size:.82rem;font-weight:700;
  text-decoration:none;border:1.5px solid;
  transition:all .22s;align-self:flex-start;margin-top:auto;
}
.sc-recrutement .sc-btn { color:var(--c-purple);border-color:rgba(78,43,134,.3);background:rgba(78,43,134,.06); }
.sc-interim     .sc-btn { color:var(--c-blue);  border-color:rgba(54,162,206,.3);background:rgba(54,162,206,.06); }
.sc-formation   .sc-btn { color:var(--c-green); border-color:rgba(130,190,96,.35);background:rgba(130,190,96,.08); }
.sc-sirh        .sc-btn { color:var(--c-navy);  border-color:rgba(26,29,59,.25); background:rgba(26,29,59,.05); }
.sc-recrutement .sc-btn:hover { background:var(--c-purple);color:#fff;border-color:var(--c-purple); }
.sc-interim     .sc-btn:hover { background:var(--c-blue);  color:#fff;border-color:var(--c-blue);   }
.sc-formation   .sc-btn:hover { background:var(--c-green); color:#fff;border-color:var(--c-green);  }
.sc-sirh        .sc-btn:hover { background:var(--c-navy);  color:#fff;border-color:var(--c-navy);   }

/* ── BANDEAU GARANTIE ─────────────────────────────────────── */
.section-garantie {
  padding: clamp(48px,7vw,80px) 0;
  background: var(--c-light);
  border-top:1px solid var(--c-border);
  border-bottom:1px solid var(--c-border);
}
.garantie-inner {
  background: var(--grad-full);
  border-radius: 22px;
  padding: clamp(32px,5vw,52px) clamp(24px,5vw,52px);
  display:flex;align-items:center;gap:28px;flex-wrap:wrap;
  box-shadow:0 16px 48px rgba(78,43,134,.25);
}
.garantie-icon {
  width:72px;height:72px;border-radius:50%;
  background:rgba(255,255,255,.15);border:2px solid rgba(255,255,255,.25);
  display:flex;align-items:center;justify-content:center;
  font-size:1.8rem;color:#fff;flex-shrink:0;
}
.garantie-text { flex:1;min-width:200px; }
.garantie-text h3 {
  font-family:var(--font-heading);font-size:clamp(1.1rem,2.5vw,1.45rem);
  font-weight:800;color:#fff;margin-bottom:8px;
}
.garantie-text p { font-size:.88rem;color:rgba(255,255,255,.8);line-height:1.7;margin:0; }
.garantie-cta { flex-shrink:0; }

/* ── CTA FINAL ────────────────────────────────────────────── */
.section-cta-services {
  padding: clamp(64px,10vw,100px) 0;
  background: linear-gradient(145deg,#1a1d3b 0%,#2d1060 60%,#0f3460 100%);
  position:relative;overflow:hidden;
  text-align:center;
}
.section-cta-services::before {
  content:'';position:absolute;inset:0;
  background-image:radial-gradient(rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:28px 28px;pointer-events:none;
}
.cta-box {
  max-width: 640px; margin:0 auto;
  position:relative;z-index:2;
}
.cta-box h2 {
  font-family:var(--font-heading);
  font-size:clamp(1.7rem,4vw,2.6rem);
  font-weight:800;color:#fff;margin-bottom:16px;line-height:1.2;
}
.cta-box p { font-size:clamp(.88rem,1.5vw,.97rem);color:rgba(255,255,255,.7);line-height:1.8;margin-bottom:36px; }
.cta-btns { display:flex;gap:14px;justify-content:center;flex-wrap:wrap; }

/* ── RESPONSIVE ───────────────────────────────────────────── */
@media (max-width: 991px) {
  .garantie-inner { gap:20px; }
}
@media (max-width: 767px) {
  .service-card { padding:24px 20px; }
  .sc-icon { width:52px;height:52px;font-size:1.2rem;border-radius:14px; }
  .sc-num { font-size:2.5rem; }
  .garantie-icon { width:56px;height:56px;font-size:1.4rem; }
  .cta-btns { flex-direction:column;align-items:center; }
  .cta-btns a { width:100%;max-width:320px;justify-content:center; }
}
@media (max-width: 480px) {
  .garantie-inner { flex-direction:column;text-align:center; }
  .garantie-cta { width:100%; }
  .garantie-cta a { width:100%;justify-content:center; }
}