@charset "utf-8";
/* CSS Document */
:root{
    --teal:#12793F;
    --teal-dark:#0C5A2E;
    --leaf:#4CAF50;
    --paper:#F7F7F2;
    --card:#FFFFFF;
    --ink:#1E2A22;
    --ink-soft:#51594F;
    --coral:#E0A800;
    --coral-dark:#B88A00;
    --gold:#FDC500;
    --amber-text:#8A6A00;
    --line:#DCE3D8;
    --radius:14px;
    --serif:'Fraunces', Georgia, serif;
    --sans:'Work Sans', -apple-system, sans-serif;
    --mono:'IBM Plex Mono', monospace;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0; background:var(--paper); color:var(--ink);
    font-family:var(--sans); font-size:16px; line-height:1.6;
  }
  a{color:inherit; text-decoration:none;}
  img{max-width:100%; display:block;}
  .wrap{max-width:1180px; margin:0 auto; padding:0 32px;}

  /* ---------- motif lamba (tissage malgache) ---------- */
  .lamba-strip{
    height:10px; width:100%;
    background:#FF000C;
  }
  .lamba-weave{
    background-image:
      linear-gradient(45deg, rgba(255,255,255,.05) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.05) 75%),
      linear-gradient(45deg, rgba(255,255,255,.05) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.05) 75%);
    background-size:16px 16px;
    background-position:0 0, 8px 8px;
  }

  /* ---------- header ---------- */
  header{background:url("../images/fond-header.jpg"); background-size: cover; background-position: center; color:#fff; position:sticky; top:0; z-index:50;}
  .nav-row{display:flex; align-items:center; justify-content:space-between; padding:18px 32px; max-width:100%; margin:0 auto;}
  .logo{display:flex; align-items:center; gap:9px; font-family:var(--serif); font-weight:700; font-size:26px; letter-spacing:.2px; color:#fff;}
  .logo-mark{height:auto; width:50%; display:block; padding-left: 100px;}
  nav ul{list-style:none; display:flex; gap:30px; margin:0; padding:0; font-size:14.5px; font-weight:500;}
  nav a{opacity:.92; padding:6px 2px; border-bottom:2px solid transparent; transition:border-color .15s, opacity .15s;}
  nav a:hover{opacity:1; border-color:var(--gold);}
  .burger{display:none; background:none; border:0; color:#fff; font-size:26px; cursor:pointer;}

  .hotline-bar{background:var(--teal-dark); color:#fff; font-family:var(--mono); font-size:13px;}
  .hotline-inner{max-width:1180px; margin:0 auto; padding:9px 32px; display:flex; flex-wrap:wrap; align-items:center; gap:18px; justify-content:space-between;}
  .hotline-nums{display:flex; flex-wrap:wrap; gap:16px; align-items:center;}
  .hotline-nums span{opacity:.75; font-family:var(--sans);}
  .hotline-nums a{border-bottom:1px dotted rgba(255,255,255,.4); padding-bottom:1px;}
  .hotline-nums a:hover{border-color:var(--gold); color:var(--gold);}
  .call-btn{background:var(--gold); color:var(--teal-dark); font-family:var(--sans); font-weight:600; font-size:13px; padding:7px 16px; border-radius:20px; white-space:nowrap; display:inline-flex; align-items:center; gap:6px;}
  .call-btn:hover{background:var(--teal-dark); color:#fff;}

  /* ---------- hero / grand article ---------- */
  .hero{padding:64px 0 72px;}
  .hero-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center;}
  .kicker{font-family:var(--mono); font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--amber-text); display:flex; align-items:center; gap:8px; margin-bottom:18px;}
  .kicker::before{content:""; width:22px; height:2px; background:var(--amber-text);}
  h1.hero-title{font-family:var(--serif); font-weight:600; font-size:44px; line-height:1.12; margin:0 0 22px; color:var(--teal-dark);}
  .hero-text{font-size:17px; color:var(--ink-soft); max-width:46ch; margin:0 0 30px;}
  .btn-row{display:flex; gap:14px; flex-wrap:wrap;}
  .btn{display:inline-flex; align-items:center; gap:8px; padding:13px 24px; border-radius:30px; font-weight:600; font-size:14.5px; transition:transform .15s;}
  .btn-primary{background:var(--gold); color:var(--teal-dark);}
  .btn-primary:hover{background:var(--teal-dark); color:#fff;}
  .btn-outline{border:1.5px solid var(--teal); color:var(--teal-dark);}
  .btn-outline:hover{background:var(--teal); color:#fff;}

  .hero-media{position:relative;}
  .photo-block{background:var(--teal); border-radius:22px; aspect-ratio:4/3.1; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#fff; position:relative; overflow:hidden;}
  .photo-block.tall{aspect-ratio:auto; height:100%; min-height:300px;}
  .photo-block .cap{position:absolute; bottom:0; left:0; right:0; background:linear-gradient(to top, rgba(10,64,56,.92), transparent); padding:22px 20px 16px; font-size:12.5px; font-family:var(--mono); text-align:left;}
  .photo-block svg{width:54px; height:54px; opacity:.85;}
  .hero-media .photo-block{background:var(--teal);}
  .hero-media::after{content:""; position:absolute; inset:auto -14px -14px auto; width:120px; height:120px; z-index:-1; background:var(--gold); border-radius:22px; opacity:.35;}

  /* ---------- section headers ---------- */
  .section{padding:56px 0;}
  .section-head{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:34px; gap:20px; flex-wrap:wrap;}
  .section-head h2{font-family:var(--serif); font-size:29px; font-weight:600; margin:0; color:var(--teal-dark);}
  .section-head p{margin:6px 0 0; color:var(--ink-soft); font-size:14.5px; max-width:52ch;}
  .see-all{font-family:var(--mono); font-size:12.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--amber-text); border-bottom:1px solid var(--amber-text); padding-bottom:2px;}

  /* ---------- moyens articles ---------- */
  .medium-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:26px;}
  .m-card{background:var(--card); border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); transition:transform .18s, box-shadow .18s;}
  .m-card:hover{transform:translateY(-4px); box-shadow:0 14px 28px rgba(10,64,56,.1);}
  .m-photo{aspect-ratio:16/10.5; background:var(--teal); display:flex; align-items:center; justify-content:center; color:#fff;}
  .m-photo svg{width:32px; height:32px; opacity:.8;}
  .m-body{padding:20px 20px 22px;}
  .m-eyebrow{font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--amber-text); margin-bottom:8px; display:block;}
  .m-body h3{font-family:var(--serif); font-size:19px; font-weight:600; margin:0 0 8px; line-height:1.28; color:var(--ink);}
  .m-body p{font-size:14px; color:var(--ink-soft); margin:0;}

  /* palette variation per theme (subtle, semantic grouping) */
  .m-card:nth-child(1) .m-photo{background:#12793F;}
  .m-card:nth-child(2) .m-photo{background:#4CAF50;}
  .m-card:nth-child(3) .m-photo{background:#E0A800;}
  .m-card:nth-child(4) .m-photo{background:#0C5A2E;}
  .m-card:nth-child(5) .m-photo{background:#3E9A50;}
  .m-card:nth-child(6) .m-photo{background:#8FAE1B;}

  /* ---------- autres articles + module docteur ---------- */
  .split{display:grid; grid-template-columns:1.5fr .9fr; gap:48px; align-items:start;}
  .article-row{padding:22px 0; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; gap:24px; align-items:flex-start;}
  .article-row:first-child{padding-top:0;}
  .article-row .m-eyebrow{margin-bottom:6px;}
  .article-row h4{font-family:var(--serif); font-size:18px; font-weight:600; margin:0 0 6px; color:var(--ink);}
  .article-row p{font-size:13.8px; color:var(--ink-soft); margin:0; max-width:56ch;}
  .article-row a.arrow{font-size:13px; font-family:var(--mono); color:var(--teal-dark); white-space:nowrap; padding-top:3px;}
  .article-row a.arrow:hover{color:var(--amber-text);}

  .doctor-module{background:var(--teal); color:#fff; border-radius:var(--radius); padding:30px 26px 26px; position:sticky; top:118px;}
  .doctor-module .lamba-weave{border-radius:var(--radius) var(--radius) 0 0; height:8px; margin:-30px -26px 22px;}
  .doctor-icon{width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.14); display:flex; align-items:center; justify-content:center; margin-bottom:16px;}
  .doctor-icon svg{width:22px; height:22px;}
  .doctor-module h3{font-family:var(--serif); font-size:21px; font-weight:600; margin:0 0 10px;}
  .doctor-module p{font-size:13.8px; color:rgba(255,255,255,.82); margin:0 0 20px;}
  .doctor-cta{display:block; text-align:center; background:var(--gold); color:var(--teal-dark); padding:13px; border-radius:30px; font-weight:600; font-size:14px; margin-bottom:22px;}
  .doctor-cta:hover{background:#fff; color:var(--teal-dark);}
  .green-numbers{border-top:1px solid rgba(255,255,255,.2); padding-top:18px;}
  .green-numbers .label{font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--gold); margin-bottom:12px; display:block;}
  .num-item{display:flex; align-items:center; gap:10px; font-family:var(--mono); font-size:14.5px; padding:9px 0; border-bottom:1px solid rgba(255,255,255,.1);}
  .num-item:last-child{border-bottom:0;}
  .num-item svg{width:16px; height:16px; flex-shrink:0; opacity:.85;}
  .num-item a:hover{color:var(--gold);}
  .free-tag{font-family:var(--sans); font-size:10.5px; background:rgba(253,197,0,.22); color:var(--gold); padding:2px 8px; border-radius:10px; margin-left:auto;}

  /* ---------- footer ---------- */
  footer{background:var(--teal-dark); color:rgba(255,255,255,.85); margin-top:40px;}
  .footer-top{padding:56px 0 40px; display:grid; grid-template-columns:1.3fr 1fr 1fr 1.1fr; gap:40px;}
  .foot-brand .logo{color:#fff; font-size:24px; margin-bottom:14px;}
  .foot-brand .logo-mark{height:27px;}
  .foot-brand p{font-size:13.5px; color:rgba(255,255,255,.6); max-width:32ch; margin:0;}
  .foot-col h5{font-family:var(--mono); font-size:11.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--gold); margin:0 0 16px;}
  .foot-col ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px; font-size:13.8px;}
  .foot-col a:hover{color:var(--gold);}
  .foot-contact p{font-family:var(--mono); font-size:14px; margin:0 0 10px;}
  .foot-contact a:hover{color:var(--gold);}
  .footer-bottom{border-top:1px solid rgba(255,255,255,.12); padding:20px 0; display:flex; justify-content:space-between; align-items:center; font-size:12.5px; color:rgba(255,255,255,.5); flex-wrap:wrap; gap:10px;}
  .socials{display:flex; gap:14px;}
  .socials a{width:32px; height:32px; border:1px solid rgba(255,255,255,.25); border-radius:50%; display:flex; align-items:center; justify-content:center;}
  .socials svg{width:15px; height:15px;}

  /* ---------- responsive ---------- */
  @media (max-width:920px){
    nav{display:none;}
    .burger{display:block;}
    .hero-grid{grid-template-columns:1fr;}
    .medium-grid{grid-template-columns:1fr 1fr;}
    .split{grid-template-columns:1fr;}
    .doctor-module{position:static;}
    .footer-top{grid-template-columns:1fr 1fr; row-gap:32px;}
  }
  @media (max-width:600px){
    .wrap{padding:0 20px;}
    h1.hero-title{font-size:32px;}
    .medium-grid{grid-template-columns:1fr;}
    .footer-top{grid-template-columns:1fr;}
    .hotline-inner{flex-direction:column; align-items:flex-start;}
  }

  [data-reveal]{opacity:0; transform:translateY(14px); transition:opacity .5s ease, transform .5s ease;}
  [data-reveal].in{opacity:1; transform:none;}
  @media (prefers-reduced-motion: reduce){
    [data-reveal]{opacity:1; transform:none; transition:none;}
    html{scroll-behavior:auto;}
  }