* { box-sizing: border-box; margin: 0; padding: 0; }
    body { background: #f5f4f1; font-family: 'DM Sans', sans-serif; }
    @keyframes pgIn { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
    .pg-anim { animation: pgIn 0.25s ease; }
    .nl { font-family:'DM Sans',sans-serif; font-size:11px; letter-spacing:1.5px; text-transform:uppercase; background:none; border:none; cursor:pointer; color:rgba(255,255,255,0.65); padding:4px 0; transition:color .18s; position:relative; }
    .nl:hover { color:#fff !important; }
    .nl-on { color:#fff !important; }
    .nl-on::after { content:''; position:absolute; bottom:-2px; left:0; right:0; height:2px; background:#efc7b4; border-radius:1px; }
    .pie-slice { cursor:pointer; transition:filter 0.18s; }
    .pie-slice:hover { filter:brightness(1.1); }
    .pie-lbl { font-family:'DM Sans',sans-serif; font-size:8.5px; font-weight:600; letter-spacing:2px; text-transform:uppercase; opacity:0.72; line-height:1.4; }
    .pie-cta { font-family:'DM Sans',sans-serif; font-size:8px; letter-spacing:2px; text-transform:uppercase; opacity:0.7; margin-top:2px; }
    .img-ph { background:#ece8e2; border-radius:8px; display:flex; align-items:center; justify-content:center; color:#9e9080; font-family:'DM Sans',sans-serif; font-size:12px; letter-spacing:2px; text-transform:uppercase; }
    .vasistas-logo { --logo-size:32px; --logo-color:#efc7b4; --logo-duration:3s; --logo-stagger:0.09s; display:inline-block; width:var(--logo-size); height:var(--logo-size); flex-shrink:0; }
    .vasistas-logo svg { width:100%; height:100%; overflow:visible; }
    .vasistas-logo .ring { fill:none; stroke:var(--logo-color); stroke-linecap:round; stroke-linejoin:round; }
    .faq-row { cursor:pointer; border-bottom:1px solid #e8e8e8; }
    .faq-row:hover { background:#fdf9f7; }
    .cta-btn { font-family:'DM Sans',sans-serif; font-size:12px; font-weight:600; letter-spacing:2px; text-transform:uppercase; border:none; padding:16px 28px; cursor:pointer; white-space:nowrap; transition:opacity .15s; }
    .cta-btn:hover { opacity:0.85; }

    /* Logo rings animation */
    .vring { fill:none; stroke:#efc7b4; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:var(--len); stroke-dashoffset:var(--len); animation:vst 3s ease-out infinite; }
    .r0{animation-delay:0s}.r1{animation-delay:.09s}.r2{animation-delay:.18s}.r3{animation-delay:.27s}.r4{animation-delay:.36s}.r5{animation-delay:.45s}.r6{animation-delay:.54s}.r7{animation-delay:.63s}.r8{animation-delay:.72s}.r9{animation-delay:.81s}.r10{animation-delay:.9s}.r11{animation-delay:.99s}.r12{animation-delay:1.08s}.r13{animation-delay:1.17s}
    @keyframes vst { 0%{stroke-dashoffset:var(--len);opacity:0} 6%{opacity:1} 60%{stroke-dashoffset:0;opacity:1} 88%{stroke-dashoffset:0;opacity:1} 100%{stroke-dashoffset:0;opacity:0} }

    /* Liens de navigation (ex-boutons SPA) */
    nav a { text-decoration:none; }
    a.nl { display:inline-block; }

    /* ═══════════════════ RESPONSIVE ═══════════════════ */

    /* Bouton hamburger (caché sur desktop) */
    .nav-burger { display:none; flex-direction:column; justify-content:center; gap:5px; width:40px; height:40px; padding:8px; background:none; border:none; cursor:pointer; }
    .nav-burger span { display:block; width:100%; height:2px; background:#fff; border-radius:2px; transition:transform .25s, opacity .25s; }
    .nav-burger.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
    .nav-burger.open span:nth-child(2){ opacity:0; }
    .nav-burger.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

    @media (max-width: 860px) {
      /* Navigation : menu déroulant vertical */
      #main-nav { flex-wrap:wrap; height:auto !important; padding:10px 20px !important; }
      .nav-burger { display:flex !important; }
      .nav-links { display:none !important; flex-direction:column; align-items:flex-start !important; width:100%; gap:4px !important; padding:6px 0 14px !important; }
      .nav-links.open { display:flex !important; }
      .nav-links .nl { padding:9px 0 !important; font-size:13px !important; }
      #nl-contact { margin-top:8px; }

      /* Sections : padding horizontal réduit + hauteurs fixes neutralisées */
      section { padding-left:22px !important; padding-right:22px !important; height:auto !important; }
      section[style*="display:flex"], section[style*="display: flex"] { flex-wrap:wrap; gap:16px; }

      /* Pied de page : marges réduites + éléments empilés et espacés */
      footer { padding:18px 22px !important; flex-direction:column; align-items:flex-start !important; gap:12px !important; }
      footer > div { flex-wrap:wrap; gap:16px !important; }

      /* Grilles multi-colonnes -> une seule colonne */
      [style*="grid-template-columns"] { grid-template-columns:1fr !important; gap:32px !important; }

      /* Empêche le défilement horizontal dû aux formes décoratives */
      body { overflow-x:hidden; }
    }

    /* Camembert d'accueil : mise à l'échelle sur mobile */
    @media (max-width: 640px) {
      .hero-pie { transform:scale(0.72); transform-origin:top center; margin:-8px 0 -120px !important; }
    }