/* Page de marque (copie de fidentialp.css, voir CLAUDE.md §14). Placeholder : l'image du héros est celle de ripert-de-grissac (hero-ripert.jpg) faute d'image dédiée. */
html{scroll-behavior:smooth}

/* ─── HERO ──────────────────────────────────────────────────── */
.hero{background:linear-gradient(to right, rgba(255,255,255,.55) 0%, rgba(255,255,255,.3) 45%, rgba(255,255,255,0) 70%),
    url('../images/hero-ripert.jpg') center center / cover no-repeat}

/* ─── NOTRE HISTOIRE ─────────────────────────────────────────── */
.histoire{padding:120px 2.5rem 80px;background:rgba(146,186,214,0.25)}
.histoire-inner{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:5rem;min-height:320px}
.histoire h2{font-size:var(--ty-h2-size);font-weight:800;margin-bottom:48px;letter-spacing:-0.5px}
.histoire p{font-size:var(--ty-body);color:#000;line-height:1.8;font-weight:400;margin-bottom:16px}
.histoire p:last-child{margin-bottom:0}
.histoire-left{padding-bottom:100px}
.histoire-quote{display:flex;flex-direction:column;justify-content:flex-end}
.histoire .hq-text{font-size:var(--ty-h3-size);font-weight:800;color:#1c1c36;line-height:1.5;text-align:right}
.histoire .hq-text em{font-style:normal;color:#668CC2;font-weight:800}

/* ─── NOS ENGAGEMENTS ────────────────────────────────────────── */
.engagements{padding:80px 2.5rem;background:var(--white)}
.engagements h2{font-size:var(--ty-h2-size);font-weight:800;margin-bottom:40px;letter-spacing:-0.5px}
.engagements-inner{max-width:1280px;margin:0 auto}
.eng-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.eng-card{background:rgba(146,186,214,0.25);border:none;border-radius:17px;padding:20px;display:flex;align-items:center;gap:15px}
.eng-icon{flex-shrink:0;width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:#1c1c36}
.eng-title{font-size:var(--ty-h4-size);font-weight:600;color:#1c1c36;margin-bottom:3px}
.eng-sub{font-size:var(--ty-body);color:#1c1c36;font-weight:400}

/* ─── NOS PRODUITS ───────────────────────────────────────────── */
.produits{padding:80px 2.5rem;background:rgba(146,186,214,0.25)}
.produits-inner{max-width:1280px;margin:0 auto}
.produits h2 + .bento{margin-top:26px}
@media(min-width:1101px){.produits .bento{grid-template-columns:repeat(4,1fr)}}   /* 4 produits : une seule rangée (comme courtiers.html) */
@media(max-width:1100px){.produits .bento{grid-template-columns:repeat(2,1fr)}}   /* 2 × 2 sur tablette, jamais de carte orpheline */
@media(max-width:768px){.produits .bento{grid-template-columns:1fr}}
.produits h2{font-size:var(--ty-h2-size);font-weight:800;margin-bottom:14px;letter-spacing:-0.5px}
.prod-intro{font-size:var(--ty-body);color:#000;font-weight:400;line-height:1.7;margin-bottom:40px;max-width:540px}
.prod-intro-after{margin:28px 0 0;max-width:none}
.engagements h2 + .prod-intro{margin-top:-26px;margin-bottom:32px}   /* le h2 des sections « engagements » a déjà 40 px de marge basse */
.chiffres h2 + .prod-intro{margin-bottom:32px}

/* ─── NOS CHIFFRES CLÉS (propre à cette page : mêmes cartes arrondies et mêmes teintes que .eng-card / .produits) ─── */
.chiffres{padding:80px 2.5rem;background:rgba(146,186,214,0.25)}
.chiffres-inner{max-width:1280px;margin:0 auto}
.chiffres h2{font-size:var(--ty-h2-size);font-weight:800;margin-bottom:14px;letter-spacing:-0.5px}
.chiffres-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.chiffre{background:var(--white);border-radius:17px;padding:28px 24px}
.chiffre-num{font-size:clamp(2.2rem,3.4vw,3rem);font-weight:800;line-height:1.05;letter-spacing:-1px;color:#668CC2}
.chiffre-lbl{font-size:var(--ty-body);font-weight:400;color:#1c1c36;line-height:1.5;margin-top:10px}

/* ─── COLOR BAR ──────────────────────────────────────────────── */

/* ─── FORMATIONS ─────────────────────────────────────────────── */
.formations{display:none}
.formations-inner{max-width:1280px;margin:0 auto}
.formations h2{font-size:var(--ty-h2-size);font-weight:800;margin-bottom:24px;letter-spacing:-0.5px}
.formations p{font-size:var(--ty-body);color:#000;font-weight:400;line-height:1.8;max-width:760px;margin-bottom:32px}

/* ─── NOUS CONTACTER ─────────────────────────────────────────── */
.contacter{padding:80px 2.5rem;background:var(--cop)}
.contacter .stitle{color:var(--white)}
.contacter-inner{max-width:1280px;margin:0 auto}
.contacter h2{font-size:var(--ty-h2-size);font-weight:800;margin-bottom:36px;letter-spacing:-0.5px}
.contact-card{background:var(--white);border-radius:17px;overflow:hidden}
.contact-cols{display:grid;grid-template-columns:repeat(3,1fr)}
.contact-col{padding:20px 24px;display:flex;align-items:center;gap:15px;border-right:1px solid var(--border)}
.contact-col:last-child{border-right:none}
.cc-icon{flex-shrink:0;color:#1c1c36}
.cc-label{font-size:var(--ty-h4-size);font-weight:600;color:#1c1c36;margin-bottom:3px}
.cc-value{font-size:var(--ty-xs);color:#1c1c36;font-weight:400;line-height:1.5}
.cc-value a{color:#1c1c36}.cc-value a:hover{color:var(--cop)}

/* RESPONSIVE */
@media(max-width:900px){
  .histoire-inner{grid-template-columns:1fr;gap:2.5rem}.histoire-quote{height:auto}.histoire .hq-text{text-align:left}
  .eng-grid{grid-template-columns:1fr}
  .chiffres-grid{grid-template-columns:1fr 1fr}
  
  .contact-cols{grid-template-columns:1fr}.contact-col{border-right:none;border-bottom:1px solid var(--border)}.contact-col:last-child{border-bottom:none}
}
@media(max-width:600px){
  .histoire,.engagements,.chiffres,.produits,.formations,.contacter{padding-left:1.2rem;padding-right:1.2rem}
  .chiffres-grid{grid-template-columns:1fr}
}
.histoire .stitle,.engagements .stitle,.chiffres .stitle,.produits .stitle,.formations .stitle{color:#668CC2}
