
    :root{
      --bg:#f3f5f7;
      --card:#ffffff;
      --text:#0f172a;
      --muted:#5b6473;
      --border:#e5e7eb;
      --shadow: 0 10px 28px rgba(15,23,42,.08);
      --shadow2: 0 6px 18px rgba(15,23,42,.06);
      --radius:16px;

      --blue:#0b5ed7;
      --teal:#0ea5a5;
      --green:#16a34a;

      --pill:#eef2f7;
    }

    *{box-sizing:border-box}
    html,body{height:100%}
    body{
      margin:0;
      font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
      color:var(--text);
      background: radial-gradient(1200px 600px at 15% 5%, rgba(14,165,165,.18), transparent 50%),
                  radial-gradient(1200px 600px at 85% 15%, rgba(11,94,215,.16), transparent 55%),
                  var(--bg);
    }

    a{color:inherit}
    .wrap{max-width:1100px;margin:0 auto;padding:28px 18px 70px}
    .nav{
      display:flex;align-items:center;justify-content:space-between;
      gap:16px;
      position:sticky;top:0;z-index:50;
      padding:14px 18px;
      border:1px solid rgba(229,231,235,.8);
      border-radius:18px;
      background:rgba(255,255,255,.75);
      backdrop-filter: blur(10px);
      box-shadow: var(--shadow2);
    }

    .brand{display:flex;align-items:center;gap:10px;text-decoration:none}
    .brand svg{width:38px;height:38px;flex:0 0 auto}
    .brand-text{display:flex;flex-direction:column;line-height:1.15}
    .brand-text strong{font-size:15px}
    .brand-text small{font-size:12px;color:var(--muted)}

    .navlinks{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
    .navlinks a{
      text-decoration:none;font-size:13px;color:#1f2937;
      padding:8px 10px;border-radius:12px;
    }
    .navlinks a:hover{background:rgba(17,24,39,.05)}

    .btn{
      border:0;cursor:pointer;
      padding:10px 14px;border-radius:12px;
      font-weight:800;font-size:13px;
      background:linear-gradient(90deg, var(--blue), var(--teal));
      color:white;
      box-shadow: 0 10px 22px rgba(11,94,215,.18);
      text-decoration:none;
      display:inline-flex;align-items:center;justify-content:center;
      white-space:nowrap;
    }
    .btn.secondary{
      background:#eef2f7;color:#0f172a;
      box-shadow:none;border:1px solid var(--border);
      font-weight:800;
    }

    .heroGrid{
      margin-top:18px;
      display:grid;
      grid-template-columns: 1.25fr .95fr;
      gap:14px;
      align-items:stretch;
    }

    .card{
      background:rgba(255,255,255,.72);
      border:1px solid rgba(229,231,235,.9);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      padding:18px;
      backdrop-filter: blur(10px);
    }

    .pill{
      display:inline-flex;align-items:center;gap:8px;
      background:var(--pill);
      border:1px solid rgba(229,231,235,.9);
      border-radius:999px;
      padding:6px 10px;
      font-size:12px;
      font-weight:800;
    }

    h1{
      margin:12px 0 8px;
      font-size:42px;
      letter-spacing:-.02em;
      line-height:1.05;
    }
    .lead{
      margin:0 0 14px;
      color:var(--muted);
      font-size:14px;
      line-height:1.5;
    }

    .ctaRow{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}

    .featureRow{
      margin-top:14px;
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:10px;
    }
    .mini{
      background:rgba(255,255,255,.7);
      border:1px solid rgba(229,231,235,.9);
      border-radius:14px;
      padding:12px;
      box-shadow: var(--shadow2);
    }
    .mini strong{display:block;font-size:13px}
    .mini small{color:var(--muted);font-size:12px}

    .list{margin-top:10px;display:flex;flex-direction:column;gap:10px}
    .sectionTitle{margin:22px 0 8px;font-size:16px;color:#111827}
    .sectionSub{margin:0 0 12px;color:var(--muted);font-size:13px}

    .item{
      background:rgba(255,255,255,.7);
      border:1px solid rgba(229,231,235,.9);
      border-radius:14px;
      padding:12px;
      display:flex;gap:10px;align-items:flex-start;
      box-shadow: var(--shadow2);
    }
    .dot{
      width:8px;height:8px;border-radius:999px;
      background:linear-gradient(180deg, var(--blue), var(--teal));
      margin-top:6px;flex:0 0 auto;
    }
    .item p{margin:0;color:var(--muted);font-size:13px;line-height:1.45}

    .grid3{display:grid;grid-template-columns: 1fr 1fr 1fr;gap:12px}
    .grid2{display:grid;grid-template-columns: 1fr 1fr;gap:12px}

    .serviceCard h4{margin:0 0 6px;font-size:14px}
    .serviceCard p{margin:0;color:var(--muted);font-size:13px;line-height:1.45}
    .serviceCard ul{margin:10px 0 0;padding-left:18px;color:#334155}
    .serviceCard li{margin:6px 0;font-size:13px}

    .steps{display:grid;grid-template-columns: 1fr 1fr 1fr;gap:12px;margin-top:8px}
    .stepCard{
      background:rgba(255,255,255,.7);
      border:1px solid rgba(229,231,235,.9);
      border-radius:14px;
      padding:12px;
      box-shadow: var(--shadow2);
    }
    .stepCard b{display:block;margin-bottom:6px}
    .step{font-size:13px;color:var(--muted)}

    /* QUOTE area */
    .quoteGrid{display:grid;grid-template-columns: 1fr 420px;gap:12px;align-items:start}

    form{display:flex;flex-direction:column;gap:10px;margin-top:6px}
    label{font-size:12px;color:#111827;font-weight:800}
    input,select,textarea{
      width:100%;
      padding:11px 12px;
      border-radius:12px;
      border:1px solid rgba(229,231,235,.95);
      background:rgba(255,255,255,.85);
      outline:none;
      font-size:13px;
    }
    textarea{min-height:98px;resize:vertical}
    input:focus,select:focus,textarea:focus{
      border-color: rgba(11,94,215,.55);
      box-shadow: 0 0 0 4px rgba(11,94,215,.10);
    }

    .submitBtn{
      border:0;cursor:pointer;
      padding:12px 14px;border-radius:12px;
      font-weight:900;font-size:13px;
      background:linear-gradient(90deg, var(--blue), var(--green));
      color:white;
      box-shadow: 0 12px 26px rgba(11,94,215,.18);
    }

    .contactBox{margin-top:12px;display:grid;grid-template-columns: 1fr;gap:10px}
    .phone-link{
      color:var(--blue);
      font-weight:900;
      text-decoration:none;
    }
    .phone-link:hover{text-decoration:underline}

    /* Reviews */
    .reviews-box{
      background:rgba(255,255,255,.72);
      border:1px solid rgba(229,231,235,.9);
      border-radius:14px;
      padding:18px;
      box-shadow: var(--shadow);
      backdrop-filter: blur(10px);
    }
    .reviews-box h3{margin:0 0 12px;font-size:14px}
    .review{margin-bottom:14px}
    .stars{color:#f5b301;font-size:14px;margin-bottom:4px}
    .review p{font-size:13px;margin:0 0 4px;color:#374151;line-height:1.45}
    .review span{font-size:12px;color:var(--muted)}
    .review:last-child{margin-bottom:0}

    footer{margin-top:22px;color:var(--muted);font-size:12px;text-align:center;opacity:.95}

    @media (max-width: 980px){
      h1{font-size:34px}
      .heroGrid{grid-template-columns:1fr}
      .grid3{grid-template-columns:1fr}
      .grid2{grid-template-columns:1fr}
      .steps{grid-template-columns:1fr}
      .quoteGrid{grid-template-columns:1fr}
      .navlinks{gap:6px}
    }
    /* Airbnb bouton rouge */
.airbnb-btn{
  background: linear-gradient(90deg, #ff2e2e, #c40000);
  color: white;
  border: none;
}

.airbnb-btn:hover{
  opacity: 0.9;
  transform: translateY(-1px);
}

/* Rénovation bouton orange */
.reno-btn{
  background: linear-gradient(90deg, #ff8c00, #ff5e00);
  color: white;
  border: none;
}

.reno-btn:hover{
  opacity: 0.9;
  transform: translateY(-1px);
}
  