
:root{
  --green:#0a9b42;
  --green2:#087f39;
  --blue:#0876d1;
  --navy:#092b55;
  --light:#eef9fb;
  --text:#082d55;
  --muted:#48627b;
  --white:#fff;
  --shadow:0 10px 30px rgba(9,43,85,.10);
  --radius:16px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--text);background:#fff;line-height:1.55}
a{text-decoration:none;color:inherit}
.container{width:min(1180px,92%);margin:auto}
.topbar{background:#fff;border-bottom:1px solid #e9eef2;position:sticky;top:0;z-index:50}
.nav{height:86px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:10px}
.brand img{width:205px;height:72px;object-fit:cover;object-position:left center;border-radius:5px}
.navlinks{display:flex;align-items:center;gap:25px;font-size:14px;font-weight:700}
.navlinks a{padding:8px 2px}
.navlinks a:hover,.navlinks a.active{color:var(--green)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 21px;border-radius:9px;font-weight:700;border:0;cursor:pointer}
.btn-green{background:var(--green);color:#fff}
.btn-blue{background:var(--blue);color:#fff}
.btn-outline{border:1px solid #1681cf;color:#1268a7;background:#fff}
.btn:hover{transform:translateY(-1px);box-shadow:0 7px 18px rgba(0,0,0,.10)}
.hero{background:linear-gradient(90deg,#e8fae9 0%,#f8ffff 45%,#dff5fb 100%);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:46% 54%;min-height:455px;align-items:center}
.hero-copy{padding:48px 15px 48px 0}
.badge{display:inline-block;background:var(--green);color:#fff;font-weight:700;padding:5px 12px;border-radius:6px;margin-bottom:10px}
h1{font-size:48px;line-height:1.05;margin:5px 0 10px;color:#0a0f12}
h1 span{color:var(--green)}
.hero-copy .tagline{font-size:23px;font-style:italic;margin:0 0 18px}
.hero-copy p{font-size:17px;max-width:620px;margin:8px 0}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.hero-img{height:455px;background-image:url("assets/hero-family.jpg");background-size:cover;background-position:center;border-radius:0 0 0 60px}
.section{padding:55px 0}
.section.alt{background:#f5fbfd}
.section-title{margin-bottom:24px}
.section-title .eyebrow{display:inline-block;background:var(--green);color:#fff;padding:4px 12px;border-radius:5px;font-weight:700}
.section-title h2{font-size:31px;margin:7px 0 3px}
.section-title p{margin:0;color:var(--muted)}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card{background:#f1fbfd;border-radius:14px;padding:26px 20px;text-align:center;box-shadow:var(--shadow)}
.icon{width:66px;height:66px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--green),#0ebd65);color:#fff;font-size:30px;margin:0 auto 14px}
.icon.blue{background:linear-gradient(135deg,#0576d4,#1b9df4)}
.card h3{margin:0 0 8px;font-size:20px}
.card p{font-size:14px;margin:0;color:#173d61}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;align-items:start}
.step{position:relative;text-align:center;padding:18px 12px}
.step-num{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#fff;font-size:22px;font-weight:800;margin:0 auto 10px}
.step:nth-child(even) .step-num{background:var(--blue)}
.step h3{font-size:16px;margin:4px 0;color:var(--green2)}
.step p{font-size:13px;color:#385875}
.step:not(:last-child)::after{content:"→";position:absolute;right:-13px;top:25px;color:var(--green);font-size:30px}
.feature-grid{display:grid;grid-template-columns:1.25fr .9fr .7fr;gap:22px;align-items:stretch}
.table-wrap{overflow:hidden;border:1px solid #b8dfe0;border-radius:10px}
table{width:100%;border-collapse:collapse}
th{background:var(--green);color:#fff;padding:11px}
td{text-align:center;padding:9px;border-bottom:1px solid #d7e8ec}
.info-box{background:#eaf7fd;border-radius:14px;padding:25px}
.info-box h3{margin:0 0 12px;font-size:22px}
.checks{list-style:none;padding:0;margin:12px 0}
.checks li{margin:7px 0}
.checks li::before{content:"✓";display:inline-grid;place-items:center;width:20px;height:20px;background:var(--green);color:#fff;border-radius:50%;font-size:12px;margin-right:8px}
.photo-box{border-radius:15px;overflow:hidden;min-height:250px;background-size:cover;background-position:center}
.photo-hands{background-image:url("assets/solidarity-hands.jpg")}
.photo-health{background-image:url("assets/health.jpg")}
.vision{display:grid;grid-template-columns:1.1fr .9fr;gap:25px;align-items:center}
.city{min-height:220px;background:url("assets/city.jpg") center/cover;border-radius:16px}
.contact-card{background:#f0fafc;border-radius:16px;padding:28px}
.contact-card h3{margin-top:0}
.cta{background:linear-gradient(100deg,#08a143,#0578d3);color:#fff;padding:28px 0}
.cta-inner{display:flex;justify-content:space-between;align-items:center;gap:20px}
.cta h2{margin:0;font-size:27px}
.cta p{margin:2px 0 0}
footer{background:#06294e;color:#fff;padding:30px 0}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:25px}
footer a{color:#dcefff;font-size:14px}
.footer-logo{width:190px;height:62px;object-fit:cover;object-position:left center;background:#fff;border-radius:4px}
.page-hero{padding:55px 0;background:linear-gradient(100deg,#eafaf0,#edf7ff)}
.page-hero h1{font-size:40px;margin:0 0 8px;color:var(--navy)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center}
.list{padding-left:20px}
.list li{margin:9px 0}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.news-card{border:1px solid #dbeaf0;border-radius:15px;overflow:hidden;background:#fff;box-shadow:var(--shadow)}
.news-card .news-img{height:180px;background-size:cover;background-position:center}
.news-card .news-body{padding:20px}
.news-card h3{margin:0 0 8px}
.form{display:grid;gap:15px}
.form label{font-weight:700;font-size:14px}
.form input,.form textarea,.form select{width:100%;padding:13px;border:1px solid #c9dce5;border-radius:8px;font:inherit}
.form textarea{min-height:140px;resize:vertical}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.notice{padding:15px 18px;background:#eef9f1;border-left:5px solid var(--green);border-radius:8px}
@media(max-width:900px){
 .nav{height:auto;padding:12px 0;flex-wrap:wrap}
 .navlinks{order:3;width:100%;overflow:auto;gap:18px;padding-bottom:6px}
 .hero-grid,.two-col,.vision,.feature-grid{grid-template-columns:1fr}
 .hero-img{height:330px;border-radius:0}
 .cards,.steps{grid-template-columns:repeat(2,1fr)}
 .step:not(:last-child)::after{display:none}
 .news-grid{grid-template-columns:1fr}
 .footer-grid{grid-template-columns:1fr}
}
@media(max-width:560px){
 h1{font-size:36px}.hero-copy .tagline{font-size:18px}
 .cards,.steps,.form-row{grid-template-columns:1fr}
 .cta-inner{flex-direction:column;align-items:flex-start}
 .brand img{width:170px}
}

/* ===== Mutualité ROBI homepage — visual refresh based on supplied reference ===== */
.ro-home{font-family:Arial,Helvetica,sans-serif;color:#102b3f}
.ro-home .topbar{position:relative;border-bottom:1px solid #e4e9ec}
.ro-nav .nav{height:112px;max-width:1260px}
.ro-nav .brand img{width:250px;height:85px;object-fit:contain;object-position:center;border-radius:0}
.ro-nav .navlinks{gap:24px;font-size:13px;white-space:nowrap}
.ro-nav .navlinks a{padding:8px 0}
.ro-phone{background:#168d45;color:#fff;padding:13px 19px;border-radius:8px;font-weight:700;font-size:14px;white-space:nowrap}
.ro-hero{background:linear-gradient(100deg,#eafaf8 0%,#f8ffff 46%,#e1f5fb 100%);overflow:hidden}
.ro-hero-inner{min-height:490px;display:grid;grid-template-columns:39% 61%;position:relative;align-items:stretch}
.ro-hero-copy{padding:54px 15px 48px 12px;z-index:2}
.ro-hero-copy h1{font-size:43px;line-height:1.05;margin:0;color:#092b55;letter-spacing:.2px}
.ro-hero-copy h1 span{color:#18954b}
.ro-green-line{width:48px;height:3px;background:#15924a;margin:16px 0 18px}
.ro-hero-copy p{font-size:14px;line-height:1.65;max-width:445px;margin:0 0 22px;color:#354d5e}
.ro-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:14px}
.ro-btn{display:inline-flex;align-items:center;justify-content:center;min-height:43px;padding:11px 18px;border-radius:5px;font-size:12px;font-weight:800;letter-spacing:.1px}
.ro-btn-green{background:#148c44;color:#fff}.ro-btn-white{background:#fff;border:1px solid #a8b9c4;color:#203b4d}
.ro-hero-photo{height:490px;position:relative;overflow:hidden;display:flex;align-items:stretch}
.ro-hero-photo img{width:100%;height:100%;object-fit:cover;object-position:center;border-radius:55% 0 0 0}
.ro-hero-bubble{position:absolute;right:-12px;bottom:0;width:300px;height:155px;background:linear-gradient(140deg,#087fca,#075a9f);border-radius:100% 0 0 0;color:#fff;padding:45px 28px 18px 95px;text-align:center;font-size:12px;line-height:1.45}
.bubble-icon{position:absolute;left:72px;top:18px;font-size:25px}
.ro-section{padding:40px 0}
.ro-heading h2{font-size:20px;margin:0;font-weight:800;color:#142a3c}.ro-heading span{display:block;width:38px;height:3px;background:#16924a;margin-top:8px}.ro-heading.center{text-align:center}.ro-heading.center span{margin:8px auto 0}.ro-heading.white h2{color:#fff}.ro-services{padding-top:23px;padding-bottom:22px}
.ro-service-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:23px}
.ro-card{min-height:210px;background:#fff;border:1px solid #edf0f2;border-radius:12px;padding:18px 13px;text-align:center;box-shadow:0 4px 17px rgba(20,49,68,.08)}
.ro-icon{width:55px;height:55px;margin:0 auto 10px;display:grid;place-items:center;border-radius:50%;font-size:26px;font-weight:800;color:#fff;background:#169448}.ro-icon.blue{background:#0c6ca8}
.ro-card h3{font-size:14px;margin:5px 0 7px;color:#182c3b}.ro-card p{font-size:11px;line-height:1.45;color:#566a77;margin:0 0 8px}.ro-card a{font-size:11px;color:#15924a;font-weight:700}
.ro-values{background:linear-gradient(90deg,#149647,#086aa9);color:#fff;padding:18px 0 21px}.ro-values .ro-heading{margin-bottom:17px}.ro-values-grid{display:grid;grid-template-columns:repeat(4,1fr)}.ro-values-grid>div{display:flex;gap:12px;padding:4px 20px;border-right:1px solid rgba(255,255,255,.35)}.ro-values-grid>div:last-child{border-right:0}.v-icon{font-size:29px;font-weight:400;min-width:42px;text-align:center}.ro-values h3{margin:0 0 2px;font-size:14px}.ro-values p{margin:0;font-size:10px;line-height:1.45;color:#e8f5fb}
.ro-about{padding:27px 0 22px}.ro-about-grid{display:grid;grid-template-columns:1.05fr .95fr 1.1fr;gap:25px;align-items:center}.ro-about-text p,.ro-mission p{font-size:11px;line-height:1.65;color:#455b68}.ro-outline{display:inline-block;border:1px solid #15924a;color:#15924a;padding:8px 15px;border-radius:4px;font-size:11px;font-weight:700;margin-top:7px}.ro-about-photo img{display:block;width:100%;height:205px;object-fit:cover;border-radius:9px}.ro-mission{background:#f0f9f5;border-radius:8px;padding:25px 22px;min-height:205px;position:relative}.mission-mark{position:absolute;right:30px;bottom:22px;width:75px;height:75px;border:9px solid #169448;border-radius:50%;display:grid;place-items:center;color:#086aa9;font-size:32px;opacity:.95}
.ro-join{padding:13px 0 19px}.ro-join-inner{min-height:105px;border-radius:11px;background:linear-gradient(105deg,#0b5c98,#087fb1);color:#fff;display:flex;align-items:center;padding:18px 30px;gap:20px}.join-symbol{font-size:39px;width:62px;text-align:center}.ro-join h2{font-size:20px;line-height:1.25;margin:0}.join-sep{height:52px;width:1px;background:rgba(255,255,255,.6);margin-left:auto}.ro-join p{font-size:12px;line-height:1.5;min-width:215px}.ro-join-btn{border:1px solid rgba(255,255,255,.8);border-radius:6px;padding:11px 17px;color:#fff;font-size:11px;font-weight:800;white-space:nowrap}
.ro-contactbar{padding:16px 0 18px;border-top:1px solid #e5ebee;background:#fff}.ro-contact-grid{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:30px}.ro-contact-grid b{font-size:11px;color:#183244}.ro-contact-grid p{font-size:10px;line-height:1.6;margin:6px 0 0;color:#475c69}.ro-contact-grid a{color:inherit}
.ro-footer{background:#062d55;color:#fff;padding:24px 0 0}.ro-footer-grid{display:grid;grid-template-columns:1.05fr 1.45fr .7fr;gap:35px;align-items:start}.ro-footer-logo{width:185px;height:63px;object-fit:contain;object-position:left center;filter:none}.ro-footer p{font-size:10px;color:#d7e8f5}.ro-footer h3{font-size:11px;margin:9px 0 11px}.ro-footer a{font-size:10px;color:#dcefff}.socials{display:flex;gap:10px}.socials span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#126fb0;font-weight:800}.ro-copyright{border-top:1px solid rgba(255,255,255,.18);margin-top:16px;padding:11px 0 13px;font-size:9px;color:#d3e2ee}.ro-copyright span{float:right}
@media(max-width:1050px){.ro-nav .navlinks{gap:12px}.ro-nav .brand img{width:205px}.ro-phone{font-size:12px}.ro-hero-inner{grid-template-columns:44% 56%}.ro-service-grid{grid-template-columns:repeat(3,1fr)}.ro-about-grid{grid-template-columns:1fr 1fr}.ro-mission{grid-column:1/-1}}
@media(max-width:760px){.ro-nav .nav{height:auto;padding:12px 0}.ro-nav .navlinks{order:3;width:100%;overflow:auto}.ro-phone{margin-left:auto}.ro-hero-inner{grid-template-columns:1fr}.ro-hero-copy{padding:35px 20px}.ro-hero-photo{height:320px}.ro-hero-bubble{display:none}.ro-service-grid{grid-template-columns:1fr 1fr}.ro-values-grid{grid-template-columns:1fr 1fr}.ro-values-grid>div:nth-child(2){border-right:0}.ro-values-grid>div{border-bottom:1px solid rgba(255,255,255,.25);padding:12px}.ro-about-grid{grid-template-columns:1fr}.ro-join-inner{flex-wrap:wrap}.join-sep{display:none}.ro-contact-grid{grid-template-columns:1fr}.ro-footer-grid{grid-template-columns:1fr}.ro-copyright span{float:none;display:block;margin-top:5px}}
@media(max-width:520px){.ro-nav .brand img{width:170px}.ro-phone{display:none}.ro-hero-copy h1{font-size:34px}.ro-service-grid,.ro-values-grid{grid-template-columns:1fr}.ro-values-grid>div{border-right:0}.ro-join h2{font-size:17px}}
