/* Isospace — nouveau menu principal (2A piste 2 : Office méga-panneau + drawer mobile) Composant autoportant, préfixe .isom-, chargé en . Tous les sélecteurs de composant sont scopés sous .isom pour battre en spécificité les règles globales du thème GeneratePress (ex. button:not(.menu-toggle){font-size:18px}). La nav GeneratePress est masquée mais conservée dans le DOM (liens préservés pour le SEO). */ /* Masquage de l'ancienne nav GP (liens conservés dans la source HTML) */ #mobile-header, #site-navigation, #generate-slideout-menu, .slideout-overlay{display:none !important;} .isom{ --navy:#203164;--gold:#ad893d;--gold-bright:#ca9b42;--red:#af170f;--taupe:#cbbcad; --ink:#282828;--ink-muted:#474747;--surface:#f4f6fb;--line:#e3e7f0; --shadow-raise:0 14px 40px rgba(32,49,100,.16);--ease:cubic-bezier(.22,.61,.36,1); --fd:'Raleway',sans-serif;--fb:'Mulish',sans-serif;--fs:'Spectral',serif; position:sticky;top:0;z-index:1000;background:#fff;border-bottom:1px solid var(--line); font-family:var(--fb); } .isom *{box-sizing:border-box} .isom a{text-decoration:none} @keyframes isomDrop{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}} @keyframes isomFade{from{opacity:0}to{opacity:1}} /* ── barre ─────────────────────────────────────────────── */ /* Conteneur : logo aligné sur la ligne verticale du H1 (hero-inner 1200px + gutter 20px = 1240) */ .isom .isom-bar{max-width:1240px;margin:0 auto;height:60px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;position:relative} .isom .isom-logo{display:flex;align-items:center} .isom .isom-logo img{height:44px;width:auto;display:block} /* Menu centré dans la barre (logo à gauche / Devis à droite restent en flux) */ .isom .isom-nav{display:flex;align-items:center;gap:24px;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:max-content;white-space:nowrap} /* Libellés de nav : pixel-perfect brouillon, réduits ~20% (13px -> 10.5px) à la demande */ .isom .isom-link{display:flex;align-items:center;gap:6px;white-space:nowrap;flex:none;font-family:var(--fb);font-weight:700;font-size:14.7px;text-transform:uppercase;letter-spacing:.04em;color:var(--navy);cursor:pointer;border:none;border-bottom:2px solid transparent;padding:0 0 2px;margin:0;background:none;line-height:1} .isom .isom-link .chev{font-size:10px;color:var(--gold);transition:transform .3s var(--ease)} /* Survol : uniquement le soulignement dans la couleur de l'univers ; le texte reste navy (pas de doré) */ .isom .isom-link:hover{border-bottom-color:var(--hov,var(--gold));color:var(--navy);background:none} .isom .isom-link[aria-expanded="true"]{border-bottom-color:var(--hov,var(--gold))} .isom .isom-link[aria-expanded="true"] .chev{transform:rotate(180deg)} .isom .isom-link:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(32,49,100,.12);border-radius:3px} /* Bouton Devis : identique au brouillon (13px, hauteur 38px, padding 18px) */ /* Bouton Devis : relief doré autour de la bordure (halo) comme sur le brouillon */ .isom .isom-cta{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--fb);font-weight:800;text-transform:uppercase;letter-spacing:.04em;font-size:15px;color:#fff;background:var(--gold-bright);border:2px solid #000;border-radius:5px;padding:0 21px;height:44px;box-shadow:0 0 0 3px rgba(202,155,66,.22),0 4px 14px rgba(202,155,66,.42);transition:transform .3s var(--ease),box-shadow .3s} .isom .isom-cta:hover{transform:translateY(-3px);box-shadow:0 0 0 4px rgba(202,155,66,.30),0 10px 24px rgba(202,155,66,.50);color:#fff;background:var(--gold-bright)} .isom .isom-cta--full{width:100%;height:44px;font-size:14px} /* ── panneaux desktop ──────────────────────────────────── */ .isom .isom-panels{position:absolute;left:0;right:0;top:100%;z-index:2} .isom .isom-panel{display:none;background:#fff;box-shadow:var(--shadow-raise);border-top:3px solid var(--navy)} .isom .isom-panel.open{display:flex;animation:isomDrop .3s var(--ease)} .isom .isom-panel-in{max-width:1240px;margin:0 auto;display:flex;position:relative;width:100%} .isom .isom-id{flex:1.2;padding:26px 32px;display:flex;flex-direction:column;gap:10px;border-right:1px solid var(--line)} .isom .isom-id .row{display:flex;align-items:center;gap:14px} .isom .isom-id img{width:40px;height:40px;object-fit:contain} .isom .isom-id .nm{font-family:var(--fd);font-weight:600;font-size:17px;text-transform:uppercase;letter-spacing:.04em;color:var(--navy)} .isom .isom-id .ds{margin:0;font-family:var(--fs);font-style:italic;font-size:16px;line-height:1.5;color:var(--ink-muted)} .isom .isom-id .more{font-family:var(--fb);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--gold);align-self:flex-start;transition:transform .4s var(--ease),color .4s} .isom .isom-id .more:hover{transform:translate3d(5px,0,0);color:var(--gold-bright)} .isom .isom-cols{flex:2;padding:22px 32px 26px;display:flex;gap:36px} .isom .isom-col{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0} .isom .isom-col .ct{font-family:var(--fb);font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--gold);padding:2px 0 8px} .isom .isom-col a{display:block;padding:7px 0;font-family:var(--fb);font-weight:700;font-size:13px;letter-spacing:.01em;color:var(--navy);border-bottom:1px solid var(--line);transition:transform .4s var(--ease),color .4s} .isom .isom-col a:hover{color:var(--gold);transform:translate3d(5px,0,0)} .isom .isom-panel--mega .isom-id{flex:1} .isom .isom-panel--mega .isom-cols{flex:3.2;flex-wrap:wrap;gap:14px 32px} .isom .isom-panel--mega .isom-col{min-width:158px} .isom .isom-close{position:absolute;top:12px;right:16px;color:var(--ink-muted);font-size:15px;padding:4px;cursor:pointer;background:none;border:none;line-height:1} .isom .isom-close:hover{color:var(--navy);background:none} /* ── mobile ────────────────────────────────────────────── */ .isom .isom-burger{display:none;flex-direction:column;gap:5px;padding:12px 8px;cursor:pointer;background:none;border:none} .isom .isom-burger span{display:block;width:24px;height:2px;background:var(--navy)} .isom .isom-burger span:last-child{width:16px;background:var(--gold);align-self:flex-end} .isom .isom-drawer{display:none;position:fixed;left:0;right:0;top:60px;bottom:0;z-index:1001;background:#fff;flex-direction:column} .isom .isom-drawer.open{display:flex;animation:isomFade .3s} .isom .isom-mlist{flex:1;overflow:auto;padding:8px 28px 20px} .isom .isom-acc{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--line);font-family:var(--fd);font-weight:600;font-size:19px;text-transform:uppercase;color:var(--navy);cursor:pointer;border-top:none;border-left:none;border-right:none;width:100%;text-align:left;background:none;line-height:1.1} .isom .isom-acc .lbl{display:flex;align-items:center;gap:12px} .isom .isom-acc .dot{width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 1px var(--line)} .isom .isom-acc .chev{font-size:11px;color:var(--gold);transition:transform .3s var(--ease)} .isom .isom-acc[aria-expanded="true"] .chev{transform:rotate(180deg)} .isom .isom-sub{display:none;flex-direction:column;padding:6px 0 10px 16px;border-bottom:1px solid var(--line)} .isom .isom-sub.open{display:flex} .isom .isom-sub a{display:block;padding:8px 0;font-family:var(--fb);font-size:14px;font-weight:700;letter-spacing:.02em;color:var(--navy)} .isom .isom-sub a:hover{color:var(--gold)} .isom .isom-mlink{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--line);font-family:var(--fd);font-weight:600;font-size:19px;text-transform:uppercase;color:var(--navy)} .isom .isom-mlink:hover{color:var(--gold)} .isom .isom-mcta{flex:0 0 76px;border-top:1px solid var(--line);background:#fff;display:flex;align-items:center;padding:0 20px} @media(max-width:1024px){ .isom .isom-bar{height:60px;padding:0 20px} .isom .isom-logo img{height:40px} .isom .isom-nav{display:none} .isom .isom-bar>.isom-cta{display:none} .isom .isom-burger{display:flex} .isom .isom-panels{display:none} } body.isom-lock{overflow:hidden}