:root{
    --primary:#005c99; --primary-dark:#003f6b; --accent:#d7262e; --cool:#1183d1; --gold:#ffd700;
    --ink:#151515; --muted:#5a6470; --bg:#ffffff; --soft:#eef6f9; --line:#e2e8f3;
    --radius:16px; --shadow:0 10px 30px rgba(15,27,51,.08);
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{font-family:'Open Sans',Arial,Helvetica,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6}
  a{color:inherit;text-decoration:none}
  img{max-width:100%;display:block}
  .container{width:min(1180px,100% - 32px);margin-inline:auto}
  section{padding:72px 0}
  h1,h2,h3{line-height:1.25;font-family:Merriweather,Georgia,serif}
  h2{font-size:clamp(1.6rem,3vw,2.2rem);margin-bottom:16px}
  .lead{color:var(--muted);font-size:1.08rem;max-width:720px}
  .btn{display:inline-flex;align-items:center;gap:8px;padding:14px 26px;border-radius:999px;font-weight:600;border:2px solid transparent;cursor:pointer;transition:.2s;font-size:1rem}
  .btn-primary{background:var(--accent);color:#fff}
  .btn-primary:hover{background:#b01d24}
  .btn-outline{border-color:var(--primary);color:var(--primary);background:#fff}
  .btn-outline:hover{background:var(--primary);color:#fff}
  .tag{display:inline-block;background:var(--soft);color:var(--primary);font-weight:600;font-size:.82rem;padding:6px 12px;border-radius:999px;margin-bottom:12px}

  /* Header */
  .topbar{background:var(--ink);color:#cfd8ea;font-size:.85rem;padding:8px 0}
  .topbar .container{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
  header.site{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}
  header.site .container{display:flex;align-items:center;justify-content:space-between;height:72px;gap:20px}
  .logo{font-family:Merriweather,Georgia,serif;font-weight:900;font-size:1.3rem;display:flex;align-items:center;gap:8px}
  .logo span{color:var(--accent)}
  .logo img{width:58px;height:58px;object-fit:contain;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
  .logo:hover img{transform:rotate(-20deg) scale(1.05)}
  .logo{gap:12px}
  nav.main{display:flex;gap:26px;font-weight:500}
  nav.main a:hover{color:var(--primary)}
  .burger{display:none;background:none;border:0;font-size:1.6rem;cursor:pointer}

  /* Hero */
  .hero{background:linear-gradient(120deg,#e3f1f7 0%,#f6fbfd 55%,#fdeeee 100%);padding:28px 0 72px}
  .crumbs{font-size:.85rem;color:var(--muted);margin-bottom:28px}
  .crumbs a:hover{text-decoration:underline}
  .hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
  .hero h1{font-size:clamp(2rem,4.4vw,3.1rem);margin-bottom:18px}
  .hero h1 em{font-style:italic;background:linear-gradient(90deg,var(--cool),var(--primary),var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent}
  .rating{display:flex;align-items:center;gap:10px;margin:22px 0;font-weight:600}
  .stars{color:#ffb400;letter-spacing:2px}
  .hero-ctas{display:flex;gap:12px;flex-wrap:wrap}
  .finder{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:28px}
  .finder h3{margin-bottom:6px}
  .finder p{color:var(--muted);font-size:.95rem;margin-bottom:18px}
  .step-dots{display:flex;gap:6px;margin-bottom:18px}
  .step-dots b{flex:1;height:6px;border-radius:6px;background:var(--line)}
  .step-dots b.on{background:var(--primary)}
  .q-title{font-weight:600;margin-bottom:12px}
  .choices{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .choice{border:2px solid var(--line);border-radius:12px;padding:14px;cursor:pointer;background:#fff;font:inherit;text-align:left;transition:.15s}
  .choice:hover{border-color:var(--primary);background:var(--soft)}
  .finder-result{display:none}
  .finder-result.show{display:block}
  .finder-result .price{font-size:1.8rem;font-weight:800;color:var(--primary)}

  /* Products */
  .grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:36px}
  .card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;display:flex;flex-direction:column;transition:.2s}
  .card:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
  .prod-visual{height:130px;border-radius:12px;background:linear-gradient(180deg,var(--soft),#fff);display:grid;place-items:center;margin-bottom:16px;position:relative}
  .unit{width:78%;height:38px;background:#fff;border-radius:10px;box-shadow:0 6px 14px rgba(15,27,51,.12);position:relative}
  .unit::after{content:"";position:absolute;left:10%;right:10%;bottom:8px;height:3px;border-radius:3px;background:var(--line)}
  .unit.console{width:60%;height:70px}
  .badge{position:absolute;top:10px;left:10px;background:var(--accent);color:#fff;font-weight:700;font-size:.78rem;padding:4px 9px;border-radius:999px}
  .card h3{font-size:1.1rem;margin-bottom:4px}
  .card .type{color:var(--muted);font-size:.88rem;margin-bottom:12px}
  .card ul{list-style:none;font-size:.9rem;color:var(--muted);margin-bottom:16px}
  .card li::before{content:"✓ ";color:var(--primary);font-weight:700}
  .from{font-size:.8rem;color:var(--muted)}
  .price-line{display:flex;align-items:baseline;gap:10px;margin-bottom:16px}
  .price-line strong{font-size:1.5rem}
  .price-line s{color:var(--muted)}
  .card .btn{margin-top:auto;justify-content:center}
  .center{text-align:center}
  .mt{margin-top:32px}

  /* Benefits */
  .benefits{background:var(--soft)}
  .ben{background:#fff;border-radius:var(--radius);padding:26px;text-align:center}
  .ico{width:56px;height:56px;border-radius:14px;margin:0 auto 14px;display:grid;place-items:center;font-size:1.6rem;background:var(--soft)}
  .ben h3{font-size:1.05rem;margin-bottom:6px}
  .ben p{color:var(--muted);font-size:.92rem}

  /* CTA band */
  .band{background:linear-gradient(110deg,var(--primary-dark),var(--primary));color:#fff;border-radius:24px;padding:40px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
  .band p{opacity:.85}

  /* Content */
  .split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
  .content p{color:var(--muted);margin-bottom:14px}
  .diagram{background:var(--soft);border-radius:var(--radius);padding:24px}
  .modes{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  .mode{border-radius:14px;padding:20px;color:#fff}
  .mode.summer{background:linear-gradient(135deg,#1183d1,#005c99)}
  .mode.winter{background:linear-gradient(135deg,#f05a5f,#d7262e)}
  .mode h4{font-size:1.1rem;margin-bottom:6px}
  .mode p{color:#fff;opacity:.92;font-size:.9rem;margin:0}
  .kpi{display:flex;gap:16px;margin-top:16px}
  .kpi div{flex:1;background:#fff;border-radius:12px;padding:16px;text-align:center}
  .kpi strong{display:block;font-size:1.6rem;color:var(--primary)}
  .kpi span{font-size:.85rem;color:var(--muted)}
  .compare{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:28px}
  .compare .card h3{margin-bottom:8px}
  .compare .card p{color:var(--muted);font-size:.95rem}

  /* Prices table */
  table{width:100%;border-collapse:collapse;margin-top:24px;background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
  th,td{padding:16px 18px;text-align:left;border-bottom:1px solid var(--line)}
  th{background:var(--ink);color:#fff;font-weight:600}
  tr:last-child td{border-bottom:0}
  .note{font-size:.88rem;color:var(--muted);margin-top:12px}

  /* Steps */
  .steps{counter-reset:s;display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:32px}
  .stp{position:relative;padding:24px;border-radius:var(--radius);border:1px solid var(--line)}
  .stp::before{counter-increment:s;content:counter(s);width:38px;height:38px;border-radius:50%;background:var(--primary);color:#fff;display:grid;place-items:center;font-weight:700;margin-bottom:12px}
  .stp h3{font-size:1.02rem;margin-bottom:6px}
  .stp p{font-size:.92rem;color:var(--muted)}

  /* Reviews */
  .reviews{background:var(--soft)}
  .rev{background:#fff;border-radius:var(--radius);padding:24px}
  .rev p{margin:10px 0 14px;font-size:.95rem}
  .rev small{color:var(--muted)}
  .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:32px}

  /* Aides */
  .aides .card h3{margin-bottom:6px}
  .aides .card p{color:var(--muted);font-size:.93rem}
  .pill-yes,.pill-no{display:inline-block;font-size:.78rem;font-weight:700;padding:3px 10px;border-radius:999px;margin-bottom:10px;width:fit-content}
  .pill-yes{background:#e3f8ec;color:#137a3e}
  .pill-no{background:#fdeaea;color:#b42318}

  /* FAQ */
  .faq{max-width:860px;margin:32px auto 0}
  details{border:1px solid var(--line);border-radius:14px;margin-bottom:12px;background:#fff}
  summary{cursor:pointer;padding:18px 22px;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:16px}
  summary::after{content:"+";font-size:1.4rem;color:var(--primary);line-height:1}
  details[open] summary::after{content:"–"}
  details p{padding:0 22px 18px;color:var(--muted)}

  /* Devis */
  .devis{background:linear-gradient(120deg,#003f6b,#005c99);color:#fff}
  .devis .lead{color:#d4e6f1}
  form.quote{background:#fff;color:var(--ink);border-radius:var(--radius);padding:30px;display:grid;grid-template-columns:1fr 1fr;gap:16px}
  form.quote .full{grid-column:1/-1}
  label{font-size:.88rem;font-weight:600;display:block;margin-bottom:6px}
  input,select,textarea{width:100%;padding:12px 14px;border:1.5px solid var(--line);border-radius:10px;font:inherit}
  input:focus,select:focus,textarea:focus{outline:none;border-color:var(--primary)}
  .consent{display:flex;gap:10px;font-size:.82rem;color:var(--muted);align-items:flex-start}
  .consent input{width:auto;margin-top:4px}
  .error{display:none;grid-column:1/-1;background:#fdeaea;color:#b42318;padding:14px;border-radius:10px;font-weight:600}
  .error a{text-decoration:underline}
  .success{display:none;grid-column:1/-1;background:#e3f8ec;color:#137a3e;padding:14px;border-radius:10px;font-weight:600}
  .devis ul.why{list-style:none;margin-top:24px}
  .devis ul.why li{margin-bottom:12px;padding-left:30px;position:relative}
  .devis ul.why li::before{content:"✓";position:absolute;left:0;width:22px;height:22px;border-radius:50%;background:var(--accent);display:grid;place-items:center;font-size:.8rem;font-weight:700}

  /* Footer */
  footer{background:#0d2233;color:#b4c4d2;padding:56px 0 24px;font-size:.92rem}
  .fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
  footer h4{color:#fff;margin-bottom:12px}
  footer li{list-style:none;margin-bottom:8px}
  footer a:hover{color:#fff}
  .legal{border-top:1px solid #1e3a52;margin-top:40px;padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.82rem}
  .logo.light{color:#fff;margin-bottom:12px}
  .rge{display:inline-flex;align-items:center;gap:6px;background:#5b2a86;color:#fff;font-weight:800;font-size:.78rem;letter-spacing:.04em;padding:5px 11px;border-radius:8px}
  .rge b{background:#fff;color:#5b2a86;padding:1px 6px;border-radius:5px}
  .rge.big{font-size:1rem;padding:9px 14px;flex-shrink:0}
  .certif{display:flex;gap:18px;align-items:center;margin-top:36px;padding:18px;border:1px solid #1e3a52;border-radius:14px;font-size:.85rem}
  .certif a{text-decoration:underline}
  @media (max-width:600px){.certif{flex-direction:column;align-items:flex-start}}
  .logo.light img{background:#fff;border-radius:50%;padding:4px;width:62px;height:62px}
  .motto{font-family:Merriweather,Georgia,serif;font-style:italic;color:var(--gold);margin-bottom:10px}

  /* Responsive */
  @media (max-width:980px){
    .hero-grid,.split,.compare{grid-template-columns:1fr}
    .grid4,.steps{grid-template-columns:1fr 1fr}
    .grid3{grid-template-columns:1fr}
    .fgrid{grid-template-columns:1fr 1fr}
    nav.main{display:none;position:absolute;top:72px;left:0;right:0;background:#fff;flex-direction:column;padding:20px;border-bottom:1px solid var(--line)}
    nav.main.open{display:flex}
    .burger{display:block}
    header .btn{display:none}
  }
  @media (max-width:600px){
    .logo img{width:48px;height:48px}
    section{padding:52px 0}
    .grid4,.steps,.modes,.choices,form.quote{grid-template-columns:1fr}
    .fgrid{grid-template-columns:1fr}
    .band{padding:28px}
    th,td{padding:12px 10px;font-size:.9rem}
  }

  /* ================= ANIMATIONS ================= */
  @keyframes fadeUp{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
  @keyframes fadeLeft{from{opacity:0;transform:translateX(40px) scale(.98)}to{opacity:1;transform:none}}
  @keyframes shimmer{to{background-position:200% center}}
  @keyframes drift1{to{transform:translate(120px,60px) scale(1.15)}}
  @keyframes drift2{to{transform:translate(-140px,-40px) scale(.9)}}
  @keyframes drift3{to{transform:translate(60px,-90px) scale(1.1)}}
  @keyframes spin{to{transform:rotate(360deg)}}
  @keyframes dash{to{stroke-dashoffset:-64}}
  @keyframes breeze{0%{opacity:0;transform:translateY(-6px)}40%{opacity:1}100%{opacity:0;transform:translateY(18px)}}
  @keyframes fall{from{transform:translateY(-30px)}to{transform:translateY(120px)}}
  @keyframes bandShift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
  @keyframes pulseRing{0%{box-shadow:0 0 0 0 rgba(215,38,46,.45)}100%{box-shadow:0 0 0 16px rgba(215,38,46,0)}}

  /* Barre de progression de lecture + en-tête au défilement */
  .progress{position:fixed;top:0;left:0;height:3px;width:100%;z-index:100;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--cool),var(--primary),var(--accent))}
  header.site{transition:box-shadow .3s}
  header.site.scrolled{box-shadow:0 6px 24px rgba(13,34,51,.08)}

  /* Hero : aurores lumineuses + entrée en cascade */
  .hero{position:relative;overflow:hidden}
  .hero .container{position:relative;z-index:1}
  .aurora span{position:absolute;border-radius:50%;filter:blur(70px);opacity:.45;pointer-events:none}
  .aurora span:nth-child(1){width:460px;height:460px;background:#7cc4ee;top:-140px;left:-120px;animation:drift1 16s ease-in-out infinite alternate}
  .aurora span:nth-child(2){width:380px;height:380px;background:#f5a3a6;bottom:-160px;right:8%;animation:drift2 19s ease-in-out infinite alternate}
  .aurora span:nth-child(3){width:300px;height:300px;background:#bfe0f1;top:30%;left:45%;animation:drift3 22s ease-in-out infinite alternate}
  .hero-grid>div:first-child>*{opacity:0;animation:fadeUp .9s cubic-bezier(.2,.7,.2,1) forwards}
  .hero-grid>div:first-child>*:nth-child(1){animation-delay:.1s}
  .hero-grid>div:first-child>*:nth-child(2){animation-delay:.22s}
  .hero-grid>div:first-child>*:nth-child(3){animation-delay:.38s}
  .hero-grid>div:first-child>*:nth-child(4){animation-delay:.52s}
  .hero-grid>div:first-child>*:nth-child(5){animation-delay:.66s}
  .finder{opacity:0;animation:fadeLeft 1s .45s cubic-bezier(.2,.7,.2,1) forwards}
  .hero h1 em{background-size:200% auto;background-image:linear-gradient(90deg,var(--cool),var(--primary),var(--accent),var(--primary),var(--cool));animation:shimmer 6s linear infinite}
  .hero .btn-primary{animation:pulseRing 2.2s 1.6s ease-out 3}

  /* Boutons : reflet satiné au survol */
  .btn{position:relative;overflow:hidden}
  .btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s}
  .btn:hover::after{transform:translateX(120%)}
  .btn:hover{transform:translateY(-2px)}
  .btn:active{transform:translateY(0)}

  /* Chiffres clés */
  .stats{padding:0;margin-top:-36px;position:relative;z-index:2}
  .stats .wrap{background:#fff;border-radius:20px;box-shadow:var(--shadow);display:grid;grid-template-columns:repeat(4,1fr);padding:26px 10px}
  .stat{text-align:center;padding:4px 12px;border-right:1px solid var(--line)}
  .stat:last-child{border-right:0}
  .stat strong{display:block;font-family:Merriweather,Georgia,serif;font-size:2rem;color:var(--primary)}
  .stat span{font-size:.88rem;color:var(--muted)}

  /* Apparition au défilement */
  .rv{opacity:0;transform:translateY(30px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
  .rv.in{opacity:1;transform:none}

  /* Cartes produits : inclinaison 3D + lumière + souffle d'air */
  #produits .card{transform-style:preserve-3d;will-change:transform;position:relative;overflow:hidden}
  #produits .card::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(17,131,209,.10),transparent 45%)}
  #produits .card:hover::before{opacity:1}
  .prod-visual i{position:absolute;top:calc(50% + 24px);width:2px;height:16px;border-radius:2px;background:var(--cool);opacity:0}
  .prod-visual i:nth-of-type(1){left:38%}.prod-visual i:nth-of-type(2){left:50%}.prod-visual i:nth-of-type(3){left:62%}
  .card:hover .prod-visual i{animation:breeze 1.4s ease-in infinite}
  .card:hover .prod-visual i:nth-of-type(2){animation-delay:.25s}
  .card:hover .prod-visual i:nth-of-type(3){animation-delay:.5s}
  .badge{transition:transform .3s}
  .card:hover .badge{transform:rotate(-6deg) scale(1.08)}

  /* Simulateur été / hiver */
  .season{--flow:#1183d1;--out:#d7262e;--room:#e6f3fb}
  .season.winter{--flow:#d7262e;--out:#1183d1;--room:#fdecec}
  .switch{display:inline-flex;background:#fff;border-radius:999px;padding:5px;box-shadow:0 4px 14px rgba(13,34,51,.08);margin-bottom:16px;position:relative}
  .switch button{position:relative;z-index:1;border:0;background:none;font:inherit;font-weight:600;padding:9px 18px;border-radius:999px;cursor:pointer;color:var(--muted);transition:color .4s}
  .switch button.on{color:#fff}
  .switch .pill{position:absolute;top:5px;bottom:5px;left:5px;width:calc(50% - 5px);border-radius:999px;background:linear-gradient(135deg,#1183d1,#005c99);transition:transform .5s cubic-bezier(.6,.0,.2,1),background .5s}
  .season.winter .switch .pill{transform:translateX(100%);background:linear-gradient(135deg,#f05a5f,#d7262e)}
  .season svg{width:100%;height:auto;display:block}
  .season .room{fill:var(--room);transition:fill .8s}
  .season .flow{fill:none;stroke:var(--flow);stroke-width:3;stroke-linecap:round;stroke-dasharray:10 22;animation:dash 1.6s linear infinite;transition:stroke .8s}
  .season .flow:nth-of-type(2){animation-delay:-.5s}.season .flow:nth-of-type(3){animation-delay:-1s}
  .season .exhaust{fill:none;stroke:var(--out);stroke-width:3;stroke-linecap:round;stroke-dasharray:8 16;animation:dash 1.2s linear infinite;transition:stroke .8s}
  .season.winter .exhaust{animation-direction:reverse}
  .season .fan{transform-box:fill-box;transform-origin:center;animation:spin 1.4s linear infinite}
  .season .led{fill:var(--flow);transition:fill .8s}
  .season .sun{transform-box:fill-box;transform-origin:center;animation:spin 30s linear infinite;transition:opacity .8s}
  .season .snow{opacity:0;transition:opacity .8s}
  .season.winter .sun{opacity:0}
  .season.winter .snow{opacity:1}
  .season .snow circle{animation:fall 4s linear infinite}
  .season .snow circle:nth-child(2n){animation-duration:5.5s;animation-delay:-2s}
  .season .snow circle:nth-child(3n){animation-duration:3.6s;animation-delay:-1s}
  .season .temp{font-family:Merriweather,Georgia,serif;font-weight:900;fill:var(--ink)}
  .season .t-out{fill:var(--out);transition:fill .8s}
  .season .caption{margin-top:12px;font-size:.95rem;color:var(--muted);min-height:3em;transition:opacity .3s}

  /* Bandeau d'appel : dégradé vivant */
  .band{background:linear-gradient(110deg,#003f6b,#005c99,#1183d1,#005c99);background-size:300% 300%;animation:bandShift 12s ease infinite}

  /* FAQ : ouverture douce */
  details p{animation:fadeUp .45s ease}
  details{transition:box-shadow .3s,border-color .3s}
  details:hover{border-color:#bcd6e6;box-shadow:0 6px 18px rgba(13,34,51,.06)}

  /* Champs du formulaire */
  input,select,textarea{transition:border-color .25s,box-shadow .25s}
  input:focus,select:focus,textarea:focus{box-shadow:0 0 0 4px rgba(17,131,209,.15)}

  @media (max-width:760px){
    .stats .wrap{grid-template-columns:1fr 1fr;row-gap:18px}
    .stat:nth-child(2){border-right:0}
  }
  @media (prefers-reduced-motion:reduce){
    *,*::before,*::after{animation:none!important;transition:none!important}
    .rv,.hero-grid>div:first-child>*,.finder{opacity:1!important;transform:none!important}
  }

  /* ================= SITE MULTI-PAGES ================= */
  .topbar a:hover{color:#fff;text-decoration:underline}
  .topbar .links{display:flex;gap:16px}

  /* Menu principal avec sous-menus */
  nav.main{gap:4px;align-items:center}
  nav.main>.item{position:relative}
  nav.main>.item>a{display:block;padding:24px 10px;font-size:.93rem}
  nav.main .has-sub>a::after{content:"▾";font-size:.7rem;margin-left:5px;opacity:.6}
  .sub{position:absolute;top:100%;left:-12px;min-width:270px;background:#fff;border-radius:14px;box-shadow:0 18px 40px rgba(13,34,51,.14);padding:10px;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .25s,transform .25s,visibility .25s;z-index:60}
  .has-sub:hover .sub,.has-sub:focus-within .sub{opacity:1;visibility:visible;transform:none}
  .sub a{display:flex;gap:10px;align-items:center;padding:9px 12px;border-radius:9px;font-size:.92rem;font-weight:500}
  .sub a:hover{background:var(--soft);color:var(--primary)}
  .sub a i{font-style:normal;width:26px;text-align:center}
  .sub .all{border-top:1px solid var(--line);margin-top:6px;padding-top:12px;color:var(--primary);font-weight:600}
  .nav-cta{display:flex;gap:10px;align-items:center}
  .nav-cta .track{font-weight:600;font-size:.9rem;color:var(--primary)}
  nav.main>.item>a{white-space:nowrap}
  @media (max-width:1320px){nav.main>.item>a{padding:24px 7px;font-size:.88rem}.nav-cta .track{display:none}}
  @media (max-width:1120px){
    nav.main{display:none;position:absolute;top:72px;left:0;right:0;background:#fff;flex-direction:column;padding:20px;border-bottom:1px solid var(--line)}
    nav.main.open{display:flex}
    .burger{display:block}
    nav.main{max-height:calc(100vh - 72px);overflow:auto;align-items:stretch;gap:0}
    nav.main>.item>a{padding:14px 4px;border-bottom:1px solid var(--line);font-size:1rem}
    .sub{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;display:none;padding:4px 0 10px 10px}
    .has-sub.open .sub{display:block}
    .nav-cta{display:none}
  }

  /* En-tête des pages intérieures */
  .page-hero{position:relative;overflow:hidden;background:linear-gradient(120deg,#e3f1f7 0%,#f6fbfd 55%,#fdeeee 100%);padding:28px 0 64px}
  .page-hero .container{position:relative;z-index:1}
  .page-hero .grid{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;align-items:center}
  .page-hero h1{font-size:clamp(1.9rem,4vw,2.8rem);margin-bottom:16px}
  .page-hero h1 em{font-style:italic;background-image:linear-gradient(90deg,var(--cool),var(--primary),var(--accent),var(--primary),var(--cool));background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 6s linear infinite}
  .page-hero .grid>div:first-child>*{opacity:0;animation:fadeUp .9s cubic-bezier(.2,.7,.2,1) forwards}
  .page-hero .grid>div:first-child>*:nth-child(2){animation-delay:.12s}
  .page-hero .grid>div:first-child>*:nth-child(3){animation-delay:.24s}
  .page-hero .grid>div:first-child>*:nth-child(4){animation-delay:.36s}
  .page-hero .grid>div:first-child>*:nth-child(5){animation-delay:.48s}
  .page-hero .grid>.photo{opacity:0;animation:fadeLeft 1s .3s cubic-bezier(.2,.7,.2,1) forwards}
  .checks{list-style:none;margin:18px 0 24px}
  .checks li{padding-left:28px;position:relative;margin-bottom:8px;font-weight:500}
  .checks li::before{content:"✓";position:absolute;left:0;top:1px;width:20px;height:20px;border-radius:50%;background:var(--primary);color:#fff;font-size:.72rem;font-weight:800;display:grid;place-items:center}

  /* Emplacements photo */
  .photo{position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:4/3;background:linear-gradient(135deg,#d9ecf6,#f3f8fb 50%,#f9e3e4);display:grid;place-items:center;box-shadow:var(--shadow);margin:0}
  .photo img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
  .photo:hover img{transform:scale(1.05)}
  .photo .ph{display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--primary);text-align:center;padding:16px;font-size:.88rem;font-weight:600}
  .photo .ph b{font-size:2rem}
  .photo .ph small{color:var(--muted);font-weight:500}
  .photo figcaption{position:absolute;left:12px;bottom:12px;background:rgba(255,255,255,.92);border-radius:8px;padding:4px 10px;font-size:.82rem;font-weight:600}
  .photo.tall{aspect-ratio:3/4}
  .photo.wide{aspect-ratio:16/9}

  /* Tuiles univers */
  .tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:28px}
  .tile{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px 18px;display:flex;flex-direction:column;gap:8px;transition:border-color .3s,box-shadow .3s,transform .3s;position:relative;overflow:hidden}
  .tile:hover{border-color:var(--cool);box-shadow:var(--shadow);transform:translateY(-4px)}
  .tile .ico{margin:0;width:50px;height:50px;font-size:1.5rem;transition:transform .4s}
  .tile:hover .ico{transform:scale(1.12) rotate(-6deg)}
  .tile h3{font-size:1rem}
  .tile p{font-size:.88rem;color:var(--muted)}
  .tile .go{margin-top:auto;color:var(--primary);font-weight:600;font-size:.9rem}
  .tile .go::after{content:" →";transition:margin .3s}
  .tile:hover .go::after{margin-left:6px}

  /* Blocs univers sur l'accueil */
  .uni{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin-bottom:72px}
  .uni:nth-child(even) .photo{order:2}
  .uni .links{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 22px}
  .uni .links a{background:var(--soft);color:var(--primary);font-weight:600;font-size:.88rem;padding:7px 14px;border-radius:999px;transition:background .25s,color .25s}
  .uni .links a:hover{background:var(--primary);color:#fff}
  .uni p{color:var(--muted)}

  /* Texte long */
  .prose{max-width:820px}
  .prose h2{margin-top:36px}
  .prose h3{margin:22px 0 8px}
  .prose p,.prose li{color:var(--muted);margin-bottom:12px}
  .prose ul{padding-left:20px}
  .two{display:grid;grid-template-columns:1.3fr .7fr;gap:48px;align-items:start}
  .aside{position:sticky;top:96px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
  .aside h3{margin-bottom:8px}
  .aside p{color:var(--muted);font-size:.92rem;margin-bottom:16px}
  .aside .btn{width:100%;justify-content:center;margin-bottom:10px}

  /* Aides */
  .aides-band{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:28px;counter-reset:a}
  .aides-band div{background:#fff;border-radius:var(--radius);padding:24px;position:relative}
  .aides-band div::before{counter-increment:a;content:counter(a);font-family:Merriweather,Georgia,serif;font-size:2.6rem;font-weight:900;color:var(--soft);position:absolute;right:18px;top:6px}
  .aides-band h3{font-size:1.02rem;margin-bottom:6px;position:relative}
  .aides-band p{color:var(--muted);font-size:.92rem;position:relative}
  .warn{background:#fff8db;border-left:4px solid var(--gold);padding:12px 16px;border-radius:8px;font-size:.9rem;color:#5a4a00;margin-top:20px}

  /* Pro / tertiaire */
  .pro-band{background:linear-gradient(120deg,#151515,#2a2f36);color:#fff;border-radius:24px;padding:44px;display:grid;grid-template-columns:1.2fr .8fr;gap:30px;align-items:center}
  .pro-band p{color:#c9d1da}
  .pro-band .tag{background:rgba(255,255,255,.12);color:#fff}

  /* Contact */
  .contact-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:40px;align-items:start}
  .req-type{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:20px}
  .req-type button{border:2px solid var(--line);background:#fff;border-radius:12px;padding:14px 10px;font:inherit;font-weight:600;cursor:pointer;transition:.2s;font-size:.9rem}
  .req-type button:hover{border-color:var(--cool)}
  .req-type button.on{border-color:var(--primary);background:var(--soft);color:var(--primary)}
  .coord{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:26px}
  .coord li{list-style:none;margin-bottom:14px;display:flex;gap:12px}
  .coord li b{width:34px;height:34px;flex-shrink:0;border-radius:10px;background:var(--soft);display:grid;place-items:center}
  form.quote.light{box-shadow:var(--shadow)}

  /* Simulateur rénovation */
  .sim{background:#fff;border-radius:20px;box-shadow:var(--shadow);padding:30px;max-width:720px;margin:28px auto 0}
  .sim-r{display:none}
  .sim-r.show{display:block}
  .sim-item{display:flex;gap:14px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin-bottom:10px;opacity:0;animation:fadeUp .6s forwards;transition:border-color .25s,background .25s}
  .sim-item:hover{border-color:var(--primary);background:var(--soft)}
  .sim-item b{width:34px;height:34px;border-radius:50%;background:var(--primary);color:#fff;display:grid;place-items:center;flex-shrink:0}
  .sim-item span{flex:1}
  .sim-item small{display:block;color:var(--muted)}
  .sim-item em{font-style:normal;color:var(--primary);font-weight:700}

  /* Équipe / certifications */
  .team{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:28px}
  .team .member h3{font-size:1rem;margin-top:12px}
  .team .member p{color:var(--muted);font-size:.88rem}
  .certs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px}
  .cert{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px}
  .cert.todo{border-style:dashed;color:var(--muted)}
  .cert h3{font-size:1rem;margin:10px 0 6px}
  .cert p{font-size:.88rem;color:var(--muted)}
  .filters{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:24px}
  .filters button{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:8px 16px;font:inherit;font-weight:600;cursor:pointer;transition:.2s}
  .filters button.on{background:var(--primary);border-color:var(--primary);color:#fff}
  .gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px}
  .gallery .photo.hide{display:none}

  .related{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
  .related a{border:1.5px solid var(--line);border-radius:999px;padding:8px 16px;font-weight:600;font-size:.9rem;transition:.2s}
  .related a:hover{border-color:var(--primary);color:var(--primary)}

  @media (max-width:980px){
    .page-hero .grid,.uni,.two,.contact-grid,.pro-band{grid-template-columns:1fr}
    .uni:nth-child(even) .photo{order:0}
    .tiles,.team{grid-template-columns:1fr 1fr}
    .aides-band,.certs,.gallery{grid-template-columns:1fr 1fr}
    .aside{position:static}
  }
  @media (max-width:600px){
    .tiles,.team,.aides-band,.certs,.gallery,.req-type{grid-template-columns:1fr}
    .pro-band{padding:28px}
    .topbar .links{display:none}
  }
  @media (prefers-reduced-motion:reduce){
    .page-hero .grid>div:first-child>*,.page-hero .grid>.photo,.sim-item{opacity:1!important;transform:none!important}
  }

  .fgrid-main{grid-template-columns:1.4fr repeat(3,1fr)}
  .fgrid-uni{grid-template-columns:repeat(5,1fr);margin-top:28px}
  .steps.five{grid-template-columns:repeat(5,1fr)}
  @media (max-width:980px){.fgrid-main,.fgrid-uni{grid-template-columns:1fr 1fr}.steps.five{grid-template-columns:1fr 1fr}}
  @media (max-width:600px){.fgrid-main,.fgrid-uni,.steps.five{grid-template-columns:1fr}}

  .team{grid-template-columns:repeat(auto-fit,minmax(200px,260px));justify-content:center}
  .photo img{object-position:center 30%}

  /* ===== En-têtes sans photo, façon sélecteur de projet ===== */
  .pick{background:#fff;border-radius:22px;box-shadow:0 22px 50px rgba(13,34,51,.12);padding:26px;opacity:0;animation:fadeLeft 1s .35s cubic-bezier(.2,.7,.2,1) forwards}
  .pick h3{font-size:1.25rem;margin-bottom:4px}
  .pick>p{color:var(--muted);font-size:.92rem;margin-bottom:16px}
  .pick-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
  .pick-grid a{display:flex;align-items:center;gap:10px;border:1.5px solid var(--line);border-radius:14px;padding:12px;font-weight:600;font-size:.92rem;transition:border-color .25s,background .25s,transform .25s}
  .pick-grid a i{font-style:normal;width:40px;height:40px;border-radius:11px;background:var(--soft);display:grid;place-items:center;font-size:1.25rem;flex-shrink:0;transition:transform .35s}
  .pick-grid a:hover{border-color:var(--primary);background:var(--soft);transform:translateY(-2px)}
  .pick-grid a:hover i{transform:scale(1.12) rotate(-6deg);background:#fff}
  .pick-pied{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:.88rem;font-weight:600;color:var(--primary)}
  .pick-pied a:hover{text-decoration:underline}

  .rappel{background:#fff;border-radius:22px;box-shadow:0 22px 50px rgba(13,34,51,.12);overflow:hidden;opacity:0;animation:fadeLeft 1s .3s cubic-bezier(.2,.7,.2,1) forwards}
  .rappel-prix{background:linear-gradient(110deg,#003f6b,#005c99,#1183d1);background-size:200% 200%;animation:bandShift 10s ease infinite;color:#fff;padding:18px 24px}
  .rappel-prix span{display:block;font-size:.85rem;opacity:.85}
  .rappel-prix strong{display:block;font-family:Merriweather,Georgia,serif;font-size:1.6rem;line-height:1.3}
  .rappel-prix small{opacity:.8;font-size:.78rem}
  .rappel-form{padding:22px 24px 8px;display:grid;gap:10px}
  .rappel-form h3{font-size:1.15rem}
  .rappel-form>p{color:var(--muted);font-size:.9rem;margin-top:-4px}
  .rappel-form .btn{justify-content:center;width:100%}
  .rappel-form .consent{font-size:.78rem}
  .rappel-pied{display:flex;justify-content:space-around;gap:8px;flex-wrap:wrap;padding:12px 18px 18px;font-size:.82rem;font-weight:600;color:var(--ok,#137a3e)}

  .uni-card{background:linear-gradient(135deg,#e3f1f7,#fff 60%,#fdeeee);border-radius:var(--radius);padding:22px;display:grid;gap:10px;box-shadow:var(--shadow)}
  .uni-card a{display:flex;align-items:center;gap:14px;background:#fff;border-radius:14px;padding:14px 16px;font-weight:600;transition:transform .25s,box-shadow .25s}
  .uni-card a[href]:hover{transform:translateX(6px);box-shadow:0 8px 20px rgba(13,34,51,.08)}
  .uni-card i{font-style:normal;font-size:1.4rem;width:44px;height:44px;border-radius:12px;background:var(--soft);display:grid;place-items:center;flex-shrink:0}
  .uni-card span{flex:1}
  .uni-card em{font-style:normal;color:var(--primary)}
  .vide{grid-column:1/-1;text-align:center;background:var(--soft);border-radius:var(--radius);padding:48px 20px}
  .vide b{font-size:2.6rem}
  .vide h3{margin:10px 0 6px}
  .vide p{color:var(--muted);margin-bottom:18px}
  @media (max-width:600px){.pick-grid{grid-template-columns:1fr}}
  @media (prefers-reduced-motion:reduce){.pick,.rappel{opacity:1!important}}

  /* ================= SITE DYNAMIQUE ================= */
  /* Transitions fluides entre les pages (navigateurs récents) */
  @view-transition{navigation:auto}
  ::view-transition-old(root){animation:vtOut .35s ease both}
  ::view-transition-new(root){animation:vtIn .45s ease both}
  @keyframes vtOut{to{opacity:0;transform:translateY(-10px)}}
  @keyframes vtIn{from{opacity:0;transform:translateY(14px)}}

  /* Bandeau d'annonces défilant */
  .annonce{background:linear-gradient(90deg,var(--accent),#b01d24);color:#fff;overflow:hidden;font-size:.84rem;font-weight:600;white-space:nowrap}
  .annonce-track{display:inline-flex;gap:0;animation:ticker 38s linear infinite;padding:7px 0}
  .annonce-track span{padding:0 28px;position:relative}
  .annonce-track span::after{content:"✦";position:absolute;right:-6px;opacity:.6}
  .annonce:hover .annonce-track{animation-play-state:paused}
  @keyframes ticker{to{transform:translateX(-50%)}}

  /* Offre phare avec pompe à chaleur animée */
  .phare{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;background:linear-gradient(120deg,#0d2233,#003f6b 60%,#005c99);color:#fff;border-radius:28px;padding:48px;position:relative;overflow:hidden}
  .phare::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(17,131,209,.45),transparent 65%);right:-120px;top:-160px;animation:drift2 14s ease-in-out infinite alternate}
  .phare-txt{position:relative}
  .phare-txt p{color:#cfe0ec}
  .phare-txt .tag{background:rgba(255,255,255,.14);color:#fff}
  .phare h2 em{font-style:italic;color:var(--gold)}
  .phare .checks li{color:#fff}
  .phare .checks li::before{background:var(--gold);color:#151515}
  .phare .btn-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
  .phare .btn-outline:hover{background:#fff;color:var(--primary)}
  .phare-visu{position:relative;height:300px;display:grid;place-items:center}
  .pac{width:250px;height:190px;background:linear-gradient(180deg,#fff,#e8eef2);border-radius:18px;box-shadow:0 30px 60px rgba(0,0,0,.35);display:grid;grid-template-columns:1.3fr .7fr;align-items:center;padding:18px;gap:14px;animation:float 5s ease-in-out infinite}
  .pac-fan{aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#cfd8de 0 14%,#eef3f6 15% 100%);border:6px solid #d7e0e6;position:relative;animation:spin 1.6s linear infinite}
  .pac-fan i{position:absolute;left:50%;top:50%;width:42%;height:16%;background:#9fb3c2;border-radius:50%;transform-origin:0 50%}
  .pac-fan i:nth-child(1){transform:rotate(0)}.pac-fan i:nth-child(2){transform:rotate(90deg)}.pac-fan i:nth-child(3){transform:rotate(180deg)}.pac-fan i:nth-child(4){transform:rotate(270deg)}
  .pac-grille{height:80%;border-radius:8px;background:repeating-linear-gradient(180deg,#d7e0e6 0 4px,transparent 4px 10px)}
  .phare-flux{position:absolute;left:4%;top:50%;transform:translateY(-50%);display:grid;gap:14px}
  .phare-flux span{display:block;width:70px;height:4px;border-radius:4px;background:linear-gradient(90deg,transparent,var(--gold));animation:flux 1.6s ease-in infinite}
  .phare-flux span:nth-child(2){animation-delay:.35s}.phare-flux span:nth-child(3){animation-delay:.7s}
  @keyframes flux{0%{opacity:0;transform:translateX(-30px)}50%{opacity:1}100%{opacity:0;transform:translateX(40px)}}
  @keyframes float{50%{transform:translateY(-10px)}}
  .phare-badge{position:absolute;right:0;bottom:6px;background:#fff;color:var(--ink);border-radius:16px;padding:12px 16px;box-shadow:0 14px 30px rgba(0,0,0,.25);animation:float 5s 1s ease-in-out infinite}
  .phare-badge strong{display:block;font-family:Merriweather,Georgia,serif;font-size:1.5rem;color:var(--accent)}
  .phare-badge small{color:var(--muted);font-size:.78rem;line-height:1.3;display:block}

  /* Parcours en 5 étapes, animé */
  .parcours{list-style:none;display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin-top:40px;position:relative}
  .parcours-line{position:absolute;left:10%;right:10%;top:27px;height:4px;background:var(--line);border-radius:4px}
  .parcours-line span{display:block;height:100%;width:0;border-radius:4px;background:linear-gradient(90deg,var(--cool),var(--primary),var(--accent));transition:width 2.4s cubic-bezier(.6,0,.2,1)}
  .parcours.go .parcours-line span{width:100%}
  .parcours li{text-align:center;position:relative}
  .parcours b{width:58px;height:58px;margin:0 auto 14px;border-radius:50%;background:#fff;border:3px solid var(--line);display:grid;place-items:center;font-family:Merriweather,Georgia,serif;font-size:1.3rem;color:var(--muted);position:relative;transition:background .4s,border-color .4s,color .4s,transform .4s}
  .parcours li.on b{background:var(--primary);border-color:var(--primary);color:#fff;transform:scale(1.08);box-shadow:0 0 0 8px rgba(0,92,153,.12)}
  .parcours li.actif b{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 10px rgba(215,38,46,.15)}
  .parcours h3{font-size:1rem;margin-bottom:4px}
  .parcours p{font-size:.88rem;color:var(--muted)}

  /* Étiquette énergie animée */
  .dpe{position:relative;display:grid;gap:7px;padding:24px;background:#fff;border-radius:20px;box-shadow:var(--shadow)}
  .dpe-bar{height:36px;width:var(--w);border-radius:6px 22px 22px 6px;display:flex;align-items:center;padding-left:14px;color:#fff;font-weight:800;font-family:Merriweather,Georgia,serif;transform-origin:left;transform:scaleX(0);transition:transform .7s cubic-bezier(.2,.7,.2,1)}
  .dpe.go .dpe-bar{transform:scaleX(1)}
  .dpe-bar[data-l=A]{background:#008c45}.dpe-bar[data-l=B]{background:#3aa935}.dpe-bar[data-l=C]{background:#9bc31b}.dpe-bar[data-l=D]{background:#f4e300;color:#333}.dpe-bar[data-l=E]{background:#f6b200}.dpe-bar[data-l=F]{background:#ea6b0d}.dpe-bar[data-l=G]{background:#d7262e}
  .dpe-cursor{position:absolute;right:24px;top:calc(24px + 6 * 43px);height:36px;display:flex;align-items:center;transition:top 1.8s cubic-bezier(.6,0,.2,1)}
  .dpe-cursor span{background:var(--ink);color:#fff;font-size:.8rem;font-weight:700;padding:7px 12px 7px 16px;border-radius:6px;position:relative;white-space:nowrap}
  .dpe-cursor span::before{content:"";position:absolute;left:-8px;top:50%;transform:translateY(-50%);border:9px solid transparent;border-right-color:var(--ink);border-left:0}
  .dpe.gagne .dpe-cursor{top:calc(24px + 1 * 43px)}
  .dpe.gagne .dpe-cursor span{background:var(--ok,#137a3e)}
  .dpe.gagne .dpe-cursor span::before{border-right-color:var(--ok,#137a3e)}

  /* Carrousel des artisans */
  .art-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:26px}
  .art-nav{display:flex;gap:10px}
  .art-nav button{width:50px;height:50px;border-radius:50%;border:1.5px solid var(--line);background:#fff;font-size:1.2rem;cursor:pointer;transition:.25s}
  .art-nav button:hover{background:var(--primary);color:#fff;border-color:var(--primary);transform:scale(1.06)}
  .carousel{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:6px 2px 22px;scrollbar-width:none;outline:none}
  .carousel::-webkit-scrollbar{display:none}
  .art-card{flex:0 0 280px;scroll-snap-align:start;background:#fff;border-radius:20px;overflow:hidden;box-shadow:var(--shadow);transition:transform .4s,box-shadow .4s}
  .art-card.large{flex-basis:440px}
  .art-card:hover{transform:translateY(-6px);box-shadow:0 20px 40px rgba(13,34,51,.14)}
  .art-img{height:320px;overflow:hidden}
  .art-img img{width:100%;height:100%;object-fit:cover;object-position:center 25%;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
  .art-card:hover .art-img img{transform:scale(1.06)}
  .art-txt{padding:18px 20px 22px}
  .art-txt h3{font-size:1.1rem}
  .art-txt span{color:var(--accent);font-weight:700;font-size:.85rem;text-transform:uppercase;letter-spacing:.04em}
  .art-txt p{color:var(--muted);font-size:.9rem;margin-top:6px}
  .dots{display:flex;justify-content:center;gap:8px}
  .dots button{width:9px;height:9px;border-radius:9px;border:0;background:#c9d6df;cursor:pointer;transition:width .3s,background .3s;padding:0}
  .dots button.on{width:28px;background:var(--primary)}

  /* Conseils */
  .guides{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:24px}
  .guide{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;display:flex;flex-direction:column;gap:8px;position:relative;overflow:hidden;transition:border-color .3s,box-shadow .3s}
  .guide::after{content:"";position:absolute;inset:auto -40% -60% auto;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,rgba(17,131,209,.12),transparent 70%);transition:transform .5s}
  .guide:hover{border-color:var(--cool);box-shadow:var(--shadow)}
  .guide:hover::after{transform:scale(1.6)}
  .guide i{font-style:normal;font-size:1.8rem}
  .guide h3{font-size:1.02rem}
  .guide p{color:var(--muted);font-size:.9rem}
  .guide .go{margin-top:auto;color:var(--primary);font-weight:600}
  .guide .go::after{content:" →"}

  /* Barre d'action fixe sur mobile */
  .mobile-cta{display:none}
  @media (max-width:760px){
    .mobile-cta{display:grid;grid-template-columns:1fr 1.4fr;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:90;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.92);backdrop-filter:blur(10px);box-shadow:0 -6px 20px rgba(13,34,51,.1);transform:translateY(110%);transition:transform .4s cubic-bezier(.2,.7,.2,1)}
    .mobile-cta.show{transform:none}
    .mobile-cta .btn{justify-content:center;padding:12px}
    body{padding-bottom:72px}
  }

  @media (max-width:980px){
    .phare{grid-template-columns:1fr;padding:32px}
    .parcours{grid-template-columns:1fr;gap:12px}
    .parcours-line{left:28px;right:auto;top:20px;bottom:20px;width:4px;height:auto}
    .parcours-line span{width:100%!important;height:0;transition:height 2.4s cubic-bezier(.6,0,.2,1)}
    .parcours.go .parcours-line span{height:100%}
    .parcours li{display:grid;grid-template-columns:58px 1fr;column-gap:16px;text-align:left;align-items:center}
    .parcours b{margin:0;grid-row:span 2}
    .guides{grid-template-columns:1fr 1fr}
  }
  @media (max-width:600px){
    .guides{grid-template-columns:1fr}
    .art-card,.art-card.large{flex-basis:78%}
    .phare-visu{height:240px}
    .pac{width:200px;height:150px}
  }
  @media (prefers-reduced-motion:reduce){
    .annonce-track{animation:none}
    .dpe-bar{transform:none}
  }

  /* Bouton WhatsApp flottant */
  .whatsapp{position:fixed;right:20px;bottom:20px;z-index:95;display:flex;align-items:center;gap:0;background:#25d366;color:#fff;border-radius:999px;padding:13px;box-shadow:0 10px 26px rgba(37,211,102,.45);font-weight:700;font-size:.92rem;overflow:hidden;animation:waIn .6s 1.2s both cubic-bezier(.2,.7,.2,1);transition:gap .3s,padding .3s,transform .25s}
  .whatsapp svg{width:30px;height:30px;flex-shrink:0}
  .whatsapp span{max-width:0;overflow:hidden;white-space:nowrap;transition:max-width .35s}
  .whatsapp:hover{gap:10px;padding-right:20px;transform:translateY(-2px)}
  .whatsapp:hover span{max-width:140px}
  .whatsapp::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 0 rgba(37,211,102,.6);animation:waPulse 2.4s 2s ease-out infinite}
  @keyframes waIn{from{opacity:0;transform:scale(.4) translateY(30px)}}
  @keyframes waPulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.55)}80%,100%{box-shadow:0 0 0 18px rgba(37,211,102,0)}}
  @media (max-width:760px){.whatsapp{bottom:84px;right:14px;padding:12px}.whatsapp svg{width:28px;height:28px}}
  @media (prefers-reduced-motion:reduce){.whatsapp,.whatsapp::after{animation:none}}

  /* Icônes des offres (SVG au trait) */
  svg.ic{width:26px;height:26px;fill:none;stroke:var(--primary);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;display:block}
  svg.ic .ac{stroke:var(--accent)}
  .sub a i{display:grid;place-items:center}
  .sub svg.ic{width:22px;height:22px}
  .tile .ico svg.ic,.uni-card i svg.ic{width:28px;height:28px}
  .pick-grid a i svg.ic{width:24px;height:24px}
  .guide i svg.ic{width:34px;height:34px}
  /* Au survol, le trait se « dessine » à nouveau */
  .tile:hover svg.ic path,.uni-card a:hover svg.ic path,.pick-grid a:hover svg.ic path,.guide:hover svg.ic path{stroke-dasharray:60;animation:trace .9s ease-out}
  @keyframes trace{from{stroke-dashoffset:60}to{stroke-dashoffset:0}}

  /* ===== Accessibilité & mentions légales ===== */
  .skip{position:absolute;left:12px;top:-60px;z-index:200;background:var(--primary);color:#fff;padding:10px 16px;border-radius:8px;font-weight:700;transition:top .2s}
  .skip:focus{top:12px}
  a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,.carousel:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:6px}
  .rgpd{font-size:.76rem;color:var(--muted);line-height:1.45;margin:0}
  .rgpd a{text-decoration:underline}
  mark.todo{background:#fff1b8;color:#7a4b00;padding:1px 6px;border-radius:4px;font-weight:700}
  .formulaire-retractation{border:2px dashed var(--line);border-radius:var(--radius);padding:22px;margin:18px 0;background:#fff}
  .formulaire-retractation p{color:var(--ink)}
  .legal span:last-child{display:flex;flex-wrap:wrap;gap:4px 6px}
  @media print{
    header.site,.topbar,.annonce,footer,.whatsapp,.mobile-cta,.progress,.page-hero,.prose>*:not(.formulaire-retractation){display:none!important}
    .formulaire-retractation{border:1px solid #000}
    .formulaire-retractation button{display:none}
  }