/* ══════════════════════════════════════════════
   VRTX — services.css
══════════════════════════════════════════════ */

/* ══ AXES ══ */
.svc-axe {
  border-bottom:1px solid var(--border);
  padding:80px 0;
}
.svc-axe:last-child { border-bottom:none; }

/* Intro : texte gauche + photo droite */
.axe-intro {
  display:grid; grid-template-columns:1fr 1fr;
  gap:72px; align-items:center;
  margin-bottom:64px;
}
.axe-tag {
  font-family:var(--mono); font-size:9px; letter-spacing:0.16em;
  text-transform:uppercase; padding:6px 14px; border-radius:40px;
  display:inline-block; margin-bottom:20px;
}
.svc-axe:nth-child(1) .axe-tag { background:var(--em-l); color:var(--em-d); }
.svc-axe:nth-child(2) .axe-tag { background:var(--gold-l); color:#8A6820; }
.svc-axe:nth-child(3) .axe-tag { background:var(--mint); color:var(--em); }
.svc-axe:nth-child(4) .axe-tag { background:#F4F4F2; color:#555; }

.axe-accent { height:3px; border-radius:2px; width:40px; margin-bottom:20px; }
.svc-axe:nth-child(1) .axe-accent { background:var(--em); }
.svc-axe:nth-child(2) .axe-accent { background:var(--gold); }
.svc-axe:nth-child(3) .axe-accent { background:var(--fern); }
.svc-axe:nth-child(4) .axe-accent { background:var(--forest); }

.axe-title { font-family:var(--serif); font-size:36px; font-weight:400; line-height:1.12; margin-bottom:16px; }
.axe-desc { font-size:15px; color:var(--muted); line-height:1.8; }

.axe-photo {
  border-radius:16px; overflow:hidden;
  aspect-ratio:16/10;
  box-shadow:0 8px 40px rgba(10,32,24,0.12);
}
.axe-photo img {
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform 0.5s ease;
}
.svc-axe:hover .axe-photo img { transform:scale(1.04); }

/* ══ OFFRES ══ */
.svc-offer {
  padding:36px 0;
  border-bottom:1px solid var(--border);
}
.svc-offer:last-child { border-bottom:none; padding-bottom:0; }

.offer-header { display:flex; align-items:center; gap:14px; margin-bottom:14px; }
.offer-ref {
  font-family:var(--mono); font-size:9px;
  letter-spacing:0.12em; padding:5px 12px;
  border-radius:20px; flex-shrink:0;
}
.svc-axe:nth-child(1) .offer-ref { background:var(--em-l); color:var(--em); }
.svc-axe:nth-child(2) .offer-ref { background:var(--gold-l); color:#8A6820; }
.svc-axe:nth-child(3) .offer-ref { background:var(--mint); color:var(--fern); }
.svc-axe:nth-child(4) .offer-ref { background:#F4F4F2; color:var(--muted); }

.offer-name { font-family:var(--serif); font-size:26px; font-weight:400; color:var(--forest); line-height:1.2; }
.offer-what { font-size:15px; color:var(--muted); line-height:1.8; margin-bottom:14px; max-width:760px; }
.offer-approach { font-size:15px; color:var(--muted); line-height:1.8; margin-bottom:24px; max-width:760px; }

/* ══ LIVRABLES — cartes toujours visibles ══ */
.offer-livrables { margin-top:8px; }
.offer-livrables-label {
  font-family:var(--mono); font-size:9px; letter-spacing:0.18em;
  color:var(--muted); text-transform:uppercase; margin-bottom:14px;
}
.liv-cards { display:flex; flex-wrap:wrap; gap:10px; }
.liv-card {
  display:flex; align-items:center; gap:10px;
  padding:12px 18px; border-radius:10px;
  border:1.5px solid var(--border); background:white;
  font-size:13px; color:var(--forest); line-height:1.4;
  transition:border-color 0.15s, box-shadow 0.15s;
}
.liv-card:hover { border-color:var(--em-m); box-shadow:0 2px 12px rgba(10,32,24,0.06); }
.liv-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }

/* ══ RESPONSIVE ══ */
@media (max-width:1024px) {
  .axe-intro { grid-template-columns:1fr; gap:40px; }
  .axe-photo { aspect-ratio:16/9; }
}
@media (max-width:768px) {
  .svc-axe { padding:56px 0; }
  .liv-cards { flex-direction:column; }
  .axe-title { font-size:28px; }
}