/* prestations + article shared page styles (thème clair) */

.page-hero{ position:relative; padding-block: clamp(48px,7vw,96px) clamp(34px,5vw,60px); overflow:hidden; border-bottom:1px solid var(--line); }
.page-hero-bg{ position:absolute; inset:0; z-index:0; pointer-events:none;
  background: radial-gradient(50% 70% at 85% 8%, rgba(107,142,87,.18), transparent 60%); }
.page-hero-bg::after{ content:""; position:absolute; top:-10%; right:14%; width:3px; height:130%; background:linear-gradient(var(--green), transparent); transform:skewX(-22deg); opacity:.35; }
.page-hero .wrap{ position:relative; z-index:1; }
.crumbs{ display:flex; gap:10px; align-items:center; font-family:var(--font-display); font-weight:600; font-size:.86rem; color:var(--ink-faint); margin-bottom:22px; }
.crumbs a{ color:var(--ink-soft); }
.crumbs a:hover{ color:var(--green-deep); }
.crumbs span{ opacity:.5; }
.crumbs b{ color:var(--ink); }
.page-hero .eyebrow{ margin-bottom:18px; }

.prest-nav{ display:flex; flex-wrap:wrap; gap:9px; margin-top:30px; }
.prest-nav a{ font-family:var(--font-display); font-weight:600; font-size:.86rem; padding:.5em 1em; border:1px solid var(--line); border-radius:100px; color:var(--ink-soft); background:var(--surface); transition:all .18s; }
.prest-nav a:hover{ border-color:var(--green); color:var(--green-deep); background:var(--green-soft); }

/* detailed prestation rows */
.prest-list{ display:block; }
.prest{ display:grid; grid-template-columns: .9fr 1.1fr; gap: clamp(28px,5vw,64px); align-items:center; padding-block: clamp(32px,4vw,52px); border-bottom:1px solid var(--line); }
.prest:last-child{ border-bottom:0; }
.prest.reverse .prest-media{ order:2; }
.prest-media .ph{ width:100%; }


.prest-img{ width:100%; aspect-ratio:1/1; object-fit:cover; display:block; border-radius:12px; }
.prest-media{ position:relative; }
.prest-img{ box-shadow: 0 22px 34px -20px rgba(40,38,33,.42); }

.prest-body a.inline{ color:var(--green-deep); text-decoration:underline; text-underline-offset:3px; }
.zone-copy a.inline{ color:var(--green-deep); text-decoration:underline; text-underline-offset:3px; }
.zone-cols{ display:grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap:22px 30px; margin-top:26px; }
.zone-cols h3{ font-size:1rem; margin:0 0 6px; color:var(--green-deep); }
.zone-cols p{ margin:0; font-size:.93rem; line-height:1.55; }
.prest-body strong{ color:var(--ink); }
.prest-num{ font-family:var(--font-display); font-weight:900; font-size:.95rem; color:var(--green); letter-spacing:.1em; }
.prest-body h2{ margin:8px 0 14px; }
.ticks{ list-style:none; padding:0; margin:20px 0 0; display:grid; gap:11px; }
.ticks li{ position:relative; padding-left:30px; color:var(--ink-soft); }
.ticks li::before{ content:""; position:absolute; left:0; top:.5em; width:14px; height:8px; border-left:2.5px solid var(--green); border-bottom:2.5px solid var(--green); transform:rotate(-45deg); }

/* process */
.process{ background:var(--surface-2); border-block:1px solid var(--line); }
.steps{ grid-template-columns: repeat(4,1fr); }
.step{ position:relative; padding-top:8px; }
.step-n{ display:flex; align-items:center; justify-content:center; width:46px; height:46px; border-radius:var(--r); background:var(--green); color:#fff; font-family:var(--font-display); font-weight:900; font-size:1.3rem; margin-bottom:18px; transform:skewX(-8deg); }
.step h3{ font-size:1.18rem; margin-bottom:8px; }
.step p{ margin:0; font-size:.96rem; }

/* CTA band */
.cta-band{ background: linear-gradient(100deg, var(--green-deep), var(--green)); }
.cta-inner{ display:flex; align-items:center; justify-content:space-between; gap:28px; flex-wrap:wrap; padding-block: clamp(40px,5vw,64px); }
.cta-band h2{ color:#fff; }
.cta-band .lead{ color: rgba(255,255,255,.92); }
.cta-actions{ display:flex; gap:14px; flex-wrap:wrap; }
.cta-band .btn{ --bg:#fffdf8; color:var(--green-deep); box-shadow:0 14px 30px -16px rgba(0,0,0,.4); }
.cta-band .btn--ghost{ background:transparent; color:#fff; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.55); }
.cta-band .btn--ghost:hover{ box-shadow: inset 0 0 0 1.5px #fff; color:#fff; }

@media (max-width: 860px){
  .steps{ grid-template-columns:1fr 1fr; }
}
@media (max-width: 700px){
  .prest, .prest.reverse{ grid-template-columns:1fr; }
  .prest.reverse .prest-media{ order:0; }
  .prest-media{ width:100%; max-width:440px; margin-inline:auto; }
  .steps{ grid-template-columns:1fr; }
}
