/* =============================================================================
   PAGES DE CONTENU — composants partagés (réutilise refonte.css)
   ============================================================================= */

/* ---- Page hero (bandeau titre) ---- */
.page-hero{background:linear-gradient(180deg,var(--rose-050),var(--cream));border-bottom:1px solid var(--line);padding:clamp(2.5rem,6vw,4.5rem) 0}
.page-hero .wrap{text-align:center;max-width:51.25rem}
.page-hero h1{font-size:clamp(2.125rem,5vw,3.75rem);font-weight:900;letter-spacing:-.02em;margin-top:0.75rem}
.page-hero p{color:var(--ink-700);font-size:clamp(1rem,1.5vw,1.1875rem);margin-top:0.875rem}
.breadcrumb{font-size:0.8125rem;color:var(--muted);margin-bottom:0.375rem;display:flex;gap:0.5rem;justify-content:center}
.breadcrumb a:hover{color:var(--rose)}

/* ---- Prose (articles, légal) ---- */
.prose{max-width:47.5rem;margin-inline:auto;color:var(--ink-700);font-size:1.0625rem;line-height:1.75}
.prose.wide{max-width:53.75rem}
.prose h2{font-size:clamp(1.5rem,2.6vw,2rem);font-weight:900;color:var(--ink);margin:2.375rem 0 0.875rem;letter-spacing:-.02em}
.prose h3{font-size:1.25rem;font-weight:800;color:var(--ink);margin:1.625rem 0 0.625rem}
.prose p{margin:0 0 1rem}
.prose ul,.prose ol{margin:0 0 1rem 1.375rem;display:grid;gap:0.5rem}
.prose li{padding-left:0.25rem}
.prose a{color:var(--rose);font-weight:700}
.prose blockquote{border-left:4px solid var(--rose);background:var(--rose-050);padding:1rem 1.25rem;border-radius:0 12px 12px 0;margin:1.375rem 0;font-weight:600;color:var(--ink)}
.prose img{border-radius:16px;margin:1.25rem 0;box-shadow:var(--shadow)}
.prose strong{color:var(--ink)}
.lead-p{font-size:1.25rem;line-height:1.6;color:var(--ink);font-weight:600;margin-bottom:1.5rem}

/* ---- Value / feature grid ---- */
.value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
@media(max-width:820px){.value-grid{grid-template-columns:1fr}}
.value-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:1.75rem 1.5rem;transition:.25s var(--ease)}
.value-card:hover{transform:translateY(-0.25rem);box-shadow:var(--shadow);border-color:transparent}
.value-card .vic{width:3.25rem;height:3.25rem;border-radius:16px;background:var(--rose-050);color:var(--rose);display:grid;place-items:center;margin-bottom:1rem}
.value-card .vic svg{width:1.625rem;height:1.625rem}
.value-card h3{font-size:1.1875rem;font-weight:800;margin-bottom:0.5rem}
.value-card p{color:var(--muted);font-size:0.9375rem;line-height:1.6}

/* ---- About split ---- */
.split2{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.split2.rev>*:first-child{order:2}
@media(max-width:860px){.split2{grid-template-columns:1fr;gap:1.875rem}.split2.rev>*:first-child{order:0}}
.split2 img{border-radius:var(--radius-lg);box-shadow:var(--shadow);width:100%}
.split2 h2{font-size:clamp(1.75rem,3.4vw,2.625rem);font-weight:900;letter-spacing:-.02em;margin-bottom:1rem}
.split2 h2 em{font-style:normal;color:var(--rose)}
.split2 p{color:var(--ink-700);margin-bottom:0.875rem}

/* ---- Stats band ---- */
.stats-band{background:var(--ink);color:var(--white);border-radius:var(--radius-lg)}
.stats-band .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem;padding:2.75rem 2.5rem}
.stats-band .st{text-align:center}
.stats-band .st .n{font-size:clamp(1.875rem,3.6vw,2.875rem);font-weight:900;letter-spacing:-.03em}
.stats-band .st .n small{color:var(--rose)}
.stats-band .st .l{font-size:0.875rem;color:rgba(255,255,255,.7);margin-top:0.25rem}
@media(max-width:680px){.stats-band .wrap{grid-template-columns:repeat(2,1fr);gap:1.75rem}}

/* ---- Contact ---- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:start}
@media(max-width:860px){.contact-grid{grid-template-columns:1fr;gap:1.75rem}}
.contact-info{display:grid;gap:1rem}
.ci-card{display:flex;gap:0.875rem;align-items:flex-start;background:var(--white);border:1px solid var(--line);border-radius:16px;padding:1.125rem 1.25rem}
.ci-card .cic{width:2.75rem;height:2.75rem;border-radius:12px;background:var(--rose-050);color:var(--rose);display:grid;place-items:center;flex:none}
.ci-card .cic svg{width:1.375rem;height:1.375rem}
.ci-card b{display:block;font-size:0.9375rem;margin-bottom:0.125rem}
.ci-card span,.ci-card a{color:var(--muted);font-size:0.875rem}
.ci-card a:hover{color:var(--rose)}
.form-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:1.75rem}
.form-card .field{display:grid;gap:0.375rem;margin-bottom:1rem}
.form-card label{font-weight:800;font-size:0.875rem}
.form-card input,.form-card textarea,.form-card select{font-family:var(--font);font-size:0.9375rem;padding:0.8125rem 0.9375rem;border:2px solid var(--line);border-radius:12px;width:100%;background:var(--white);transition:.2s}
.form-card input:focus,.form-card textarea:focus,.form-card select:focus{outline:0;border-color:var(--rose);box-shadow:0 0 0 3px var(--rose-100)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:0.875rem}
@media(max-width:520px){.form-row{grid-template-columns:1fr}}

/* ---- CTA band ---- */
.cta-band{background:linear-gradient(135deg,var(--rose),var(--magenta));border-radius:var(--radius-lg);color:var(--white);text-align:center;padding:clamp(2.5rem,5vw,4rem)}
.cta-band h2{color:var(--white);font-size:clamp(1.75rem,3.4vw,2.75rem);font-weight:900;letter-spacing:-.02em}
.cta-band p{color:rgba(255,255,255,.9);margin:0.875rem auto 1.625rem;max-width:32.5rem;font-size:1.0625rem}
.cta-band .btn-dark{background:var(--white);color:var(--magenta)}
.cta-band .btn-dark:hover{background:var(--ink);color:var(--white)}

/* ---- Article detail ---- */
.article-hero{max-width:56.25rem;margin:0 auto}
.article-hero .cat{color:var(--rose);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:0.8125rem}
.article-hero h1{font-size:clamp(1.875rem,4vw,3.125rem);font-weight:900;letter-spacing:-.02em;margin:0.75rem 0 0.875rem}
.article-hero .meta{color:var(--muted);font-size:0.875rem;display:flex;gap:0.875rem;flex-wrap:wrap}
.article-cover{max-width:60rem;margin:1.625rem auto 0;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow)}
.article-cover img{width:100%;display:block;aspect-ratio:16/9;object-fit:cover}

/* testimonial detail quote */
.tq-big{max-width:47.5rem;margin:0 auto;text-align:center}
.tq-big .stars{display:inline-flex;gap:0.125rem;color:var(--rose);margin-bottom:1rem}
.tq-big .stars svg{width:1.375rem;height:1.375rem}
.tq-big blockquote{font-size:clamp(1.375rem,2.6vw,1.875rem);font-weight:700;line-height:1.4;border:0;background:none;padding:0;color:var(--ink)}
.tq-big .who{margin-top:1.25rem;font-weight:800}
.tq-big .role{color:var(--muted);font-size:0.875rem}

/* small back link */
.backlink{display:inline-flex;align-items:center;gap:0.375rem;color:var(--muted);font-weight:700;font-size:0.875rem;margin-bottom:0.5rem}
.backlink:hover{color:var(--rose)}

/* section title (centered) */
.sec-head{text-align:center;max-width:42.5rem;margin:0 auto 2.75rem}
.sec-head h2{font-size:clamp(1.75rem,3.6vw,2.875rem);font-weight:900;letter-spacing:-.02em}
.sec-head p{color:var(--ink-700);margin-top:0.75rem}

/* category filter chips */
.filters{display:flex;gap:0.625rem;flex-wrap:wrap;justify-content:center;margin-bottom:2.25rem}
.filters .chip{border:2px solid var(--line);background:var(--white);border-radius:99px;padding:0.5625rem 1.125rem;font-weight:700;font-size:0.875rem;color:var(--ink-700);cursor:pointer;transition:.2s}
.filters .chip:hover{border-color:var(--rose);color:var(--rose)}
.filters .chip.on{background:var(--rose);border-color:var(--rose);color:var(--white)}

/* ---- Page Panier ---- */
.cart-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:2rem;align-items:start}
@media(max-width:820px){.cart-grid{grid-template-columns:1fr}}
.cart-list{display:grid;gap:0.875rem}
.cart-item{display:flex;gap:1rem;align-items:center;background:var(--white);border:1px solid var(--line);border-radius:16px;padding:1rem 1.125rem}
.cart-item .ci-ic{width:3.125rem;height:4rem;border-radius:8px;background:linear-gradient(150deg,var(--orange-050),var(--orange-200-2));flex:none;display:grid;place-items:center;color:var(--rose)}
.cart-item .ci-ic svg{width:1.625rem;height:1.625rem}
.cart-item .ci-b{flex:1;min-width:0}
.cart-item .ci-b b{font-size:1rem}
.cart-item .ci-b .cfg{font-size:0.8125rem;color:var(--muted);margin-top:0.1875rem;line-height:1.45}
.cart-item .ci-price{font-weight:900;font-size:1.0625rem;white-space:nowrap}
.cart-item .ci-rm{border:0;background:var(--sand);width:2rem;height:2rem;border-radius:50%;color:var(--muted);cursor:pointer;font-size:0.9375rem;flex:none;line-height:1}
.cart-item .ci-rm:hover{background:var(--rose);color:var(--white)}
.cart-summary{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:1.5rem;position:sticky;top:1.25rem}
.cart-summary h3{font-size:1.125rem;font-weight:900;margin-bottom:1rem}
.cart-summary .sl{display:flex;justify-content:space-between;margin-bottom:0.6875rem;font-size:0.9375rem;color:var(--ink-700)}
.cart-summary .sl .free{color:var(--green-700);font-weight:700}
.cart-summary .sl.tot{font-size:1.375rem;font-weight:900;color:var(--ink);border-top:2px solid var(--line);padding-top:0.875rem;margin-top:0.375rem}
.cart-summary .btn{width:100%;margin-top:1rem}
.cart-summary .note{font-size:0.75rem;color:var(--muted);text-align:center;margin-top:0.75rem}
.cart-empty{text-align:center;padding:3.5rem 1.25rem;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg)}
.cart-empty .ce-ic{font-size:3.375rem;margin-bottom:0.75rem}
.cart-empty h2{font-size:1.5rem;font-weight:900;margin-bottom:0.5rem}
.cart-empty p{color:var(--muted);margin-bottom:1.375rem}
.checkout-ok{text-align:center;padding:3.125rem 1.25rem;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg)}
.checkout-ok .ok{width:4.75rem;height:4.75rem;border-radius:50%;background:linear-gradient(135deg,var(--rose),var(--magenta));display:grid;place-items:center;margin:0 auto 1.125rem;box-shadow:var(--shadow-rose)}
.checkout-ok .ok svg{width:2.375rem;height:2.375rem;color:var(--white)}