/* ================================================================ SWM · SHELL GLOBAL (header, menu mobile, dock, footer, popup, formulaire) Généré par deploy/build_deploy.py — ne pas éditer : modifier les sources (components/header.css, components/popup.css, CSS des pages, deploy/src/swm-form.src.css). Chargé par le widget HTML du header global (template 15052) sur TOUTES les pages. Tout est limité aux racines #swh, #swh-scrim, #swh-menu, #swh-dock, #swm-footer, #swp et à .swm-form-slot[data-swm-form] / .swm-form-source : aucune règle sur html, body, h1-h6, a, p, button… seuls. Référence : footer et pile CSS de refonte.html. ================================================================ */ /* ---------- 1. Polices (3 familles, auto-hébergées) ---------- */ @font-face{font-family:'Plus Jakarta Sans';src:url("/wp-content/uploads/swm-v2/2026-09-23-swm-identity-page-r5/package/swm-identity-stage/assets/fonts/jakarta.woff2") format('woff2');font-style:normal;font-weight:800;font-display:swap} @font-face{font-family:'Space Grotesk';src:url("/wp-content/uploads/swm-v2/2026-09-23-swm-identity-page-r5/package/swm-identity-stage/assets/fonts/space.woff2") format('woff2');font-style:normal;font-weight:700;font-display:swap} @font-face{font-family:'Rubik Mono One';src:url("/wp-content/uploads/swm-v2/2026-09-23-swm-identity-page-r5/package/swm-identity-stage/assets/fonts/rubik.woff2") format('woff2');font-style:normal;font-weight:400;font-display:swap} @font-face{font-family:'Space Grotesk';src:url("/wp-content/uploads/swm-v2/2026-09-23-swm-identity-page-r5/package/swm-identity-stage/assets/fonts/space-400.woff2") format('woff2');font-weight:400;font-style:normal;font-display:swap} @font-face{font-family:'Space Grotesk';src:url("/wp-content/uploads/swm-v2/2026-09-23-swm-identity-page-r5/package/swm-identity-stage/assets/fonts/space-500.woff2") format('woff2');font-weight:500;font-style:normal;font-display:swap} /* ---------- 2. Variables de la DA, posées sur les racines du shell ---------- */ :is(#swh,#swh-scrim,#swh-menu,#swh-dock,#swm-footer,#swp){--display:'Plus Jakarta Sans','Space Grotesk',system-ui,sans-serif;--body:'Space Grotesk',system-ui,sans-serif;--mono:'Rubik Mono One',monospace;--ink:#12131c;--ink-soft:#454a63;--white:#fff;--lime:#c8ff3e;--pink:#ff5ec4;--cobalt:#2130ea;--cobalt-deep:#111c9c;--cobalt-soft:#e7e9ff;--yellow:#ffd93d;--s3:24px;--s4:40px;--tx-main:var(--ink);--tx-soft:var(--ink-soft);--accent-action:var(--cobalt);--brd:#e5e7eb;--cobalt-line:rgba(255,255,255,.14);--grid-w:linear-gradient(var(--cobalt-line) 1px,transparent 1px),linear-gradient(90deg,var(--cobalt-line) 1px,transparent 1px);--grid-size:34px 34px;--btn-bg:var(--cobalt);--btn-tx:var(--white);--btn-radius:9px;--btn-shadow:0 14px 30px -14px rgba(33,48,234,.55);--field-bg:#fff;--field-brd:var(--brd);--field-radius:9px;--badge-radius:7px;--badge-action-bg:var(--pink);--badge-action-tx:var(--white);--cta-duration:150ms;--cta-ease:cubic-bezier(.22,.78,.25,1);--badge-shadow:0 6px 16px -6px rgba(18,19,28,.35);--sw-blue:var(--cobalt);--sw-pink:var(--pink);--sw-lime:var(--lime);--sw-ink:var(--ink);--sw-copy:#51576c} /* ---------- 3. Remise à zéro : le thème et le kit Elementor n'atteignent plus le shell ni les pages v2. all:revert = valeurs par défaut du navigateur ; les règles de la refonte (renforcées) s'appliquent ensuite, comme dans les maquettes. Images, SVG et médias exclus (leurs attributs width/height sont conservés). ---------- */ :is(#swh,#swh-scrim,#swh-menu,#swh-dock,#swm-footer,#swp):where(:not(svg)){all:revert} :is(#swh *,#swh-scrim *,#swh-menu *,#swh-dock *,#swm-footer *,#swp *):where(:not(svg,svg *,img,picture,video,audio,source,track,iframe,canvas,object,embed)){all:revert} #swm-v2{all:revert} :is(#swm-v2 *):where(:not(svg,svg *,img,picture,video,audio,source,track,iframe,canvas,object,embed)){all:revert} /* ---------- 4. Héritage : ce que le shell reçoit du dans les maquettes ---------- */ :is(#swh,#swh-scrim,#swh-menu,#swh-dock,#swm-footer,#swp){font-style:normal;font-variant:normal;font-weight:400;font-stretch:normal;letter-spacing:normal;word-spacing:normal;text-align:start;text-indent:0;text-transform:none;text-shadow:none;white-space:normal;word-break:normal;overflow-wrap:normal;hyphens:manual;visibility:visible;cursor:auto;list-style:disc outside none;font-feature-settings:normal;font-kerning:auto;text-rendering:auto;-webkit-font-smoothing:auto;direction:ltr} :is(#swh,#swh-scrim,#swh-menu,#swh-dock,#swm-footer,#swp){font:17px/1.65 var(--body);color:var(--tx-main)} @media(max-width:640px){:is(#swh,#swh-scrim,#swh-menu,#swh-dock,#swm-footer,#swp){font-size:16px}} :is(#swh,#swh-scrim,#swh-menu,#swh-dock,#swm-footer,#swp){color:var(--sw-ink);font-family:'Space Grotesk',sans-serif;font-size:17px;line-height:1.65} @media(max-width:760px){:is(#swh,#swh-scrim,#swh-menu,#swh-dock,#swm-footer,#swp){font-size:16px}} :is(#swh,#swh-scrim,#swh-menu,#swh-dock,#swm-footer,#swp){font-size:17px} /* ---------- 5. Règles des feuilles de page qui s'appliquent au shell (ordre d'origine) ---------- */ /* 2026-09-24-swm-unified/pilot-reference.css */ *:is(#swh,#swh *,#swh-scrim,#swh-scrim *,#swh-menu,#swh-menu *,#swh-dock,#swh-dock *,#swm-footer,#swm-footer *,#swp,#swp *){box-sizing:border-box} a:is(#swh,#swh *,#swh-menu,#swh-menu *,#swh-dock,#swh-dock *,#swm-footer,#swm-footer *,#swp,#swp *){color:inherit;text-underline-offset:5px} button:is(#swp,#swp *),input:is(#swp,#swp *){font:inherit} button:is(#swp,#swp *),a:is(#swh,#swh *,#swh-menu,#swh-menu *,#swh-dock,#swh-dock *,#swm-footer,#swm-footer *,#swp,#swp *),summary:is(#swh,#swh *,#swh-menu,#swh-menu *){-webkit-tap-highlight-color:transparent} a:focus-visible:is(#swh,#swh *,#swh-menu,#swh-menu *,#swh-dock,#swh-dock *,#swm-footer,#swm-footer *,#swp,#swp *),button:focus-visible:is(#swp,#swp *),input:focus-visible:is(#swp,#swp *),summary:focus-visible:is(#swh,#swh *,#swh-menu,#swh-menu *){outline:3px solid var(--cobalt);outline-offset:4px;box-shadow:0 0 0 8px var(--cobalt-soft)} :is(h2:where(:not(.section-kicker)),h3:where(.section-title)):is(#swm-footer,#swm-footer *,#swp,#swp *){font-family:var(--display);line-height:1.12;letter-spacing:-.04em;margin:0 0 var(--s3);font-weight:800;text-wrap:balance} :is(h2:where(:not(.section-kicker)),h3:where(.section-title)):is(#swm-footer,#swm-footer *,#swp,#swp *){font-size:clamp(30px,3.1vw,44px);max-width:24ch} em:is(#swh,#swh *,#swm-footer,#swm-footer *,#swp,#swp *){font-style:normal;color:var(--cobalt)} .pt:is(#swm-footer,#swm-footer *){color:var(--pink)} p:is(#swh,#swh *,#swh-menu,#swh-menu *,#swm-footer,#swm-footer *,#swp,#swp *){margin:0 0 var(--s3)} .eyebrow:is(#swm-footer,#swm-footer *){font:400 10px/1.7 var(--mono);letter-spacing:.1em;text-transform:uppercase;display:flex;align-items:center;gap:12px;margin-bottom:var(--s3);color:var(--tx-soft)} .eyebrow:is(#swm-footer,#swm-footer *):before{content:'';display:inline-block;flex:0 0 22px;height:6px;border-radius:3px;background:var(--pink)} .brand-footer:is(#swm-footer,#swm-footer *){margin-top:var(--s4);background-color:var(--cobalt);background-image:var(--grid-w);background-size:var(--grid-size);color:var(--white)} .footer-inner:is(#swm-footer,#swm-footer *){max-width:1260px;padding:64px 40px 32px;margin:auto} .footer-grid:is(#swm-footer,#swm-footer *){display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:64px} .footer-brand img:is(#swm-footer,#swm-footer *){width:200px;height:auto;margin-bottom:28px} .footer-brand p:is(#swm-footer,#swm-footer *){max-width:38ch;font-size:15px;color:var(--white)} .footer-grid nav:is(#swm-footer,#swm-footer *){display:grid;align-content:start;gap:14px;font-size:14px} .footer-grid nav strong:is(#swm-footer,#swm-footer *){font-family:var(--display);font-size:18px;margin-bottom:12px} .footer-grid nav a:is(#swm-footer,#swm-footer *){color:var(--white);text-decoration:none} .footer-grid a:hover:is(#swm-footer,#swm-footer *){color:var(--lime)} .footer-note:is(#swm-footer,#swm-footer *){border-top:1px solid var(--cobalt-line);padding-top:24px;margin-top:40px;font-size:12px;display:flex;justify-content:space-between;gap:24px} input:is(#swp,#swp *){width:100%;padding:14px 16px;border:2px solid var(--field-brd);background:var(--field-bg);border-radius:var(--field-radius);min-width:0;min-height:48px;color:var(--tx-main)} input:is(#swp,#swp *)::placeholder{color:var(--ink-soft)} @media(max-width:1100px){.footer-grid:is(#swm-footer,#swm-footer *){gap:32px}} @media(max-width:850px){.footer-grid:is(#swm-footer,#swm-footer *){grid-template-columns:1fr 1fr}} @media(max-width:850px){.footer-brand:is(#swm-footer,#swm-footer *){grid-column:1/-1}} @media(max-width:640px){.footer-inner:is(#swm-footer,#swm-footer *){padding:48px 20px 24px}} @media(max-width:640px){.footer-grid:is(#swm-footer,#swm-footer *){gap:32px 24px}} @media(max-width:640px){.footer-note:is(#swm-footer,#swm-footer *){display:block}} @media(max-width:360px){.eyebrow:is(#swm-footer,#swm-footer *){font-size:9px}} @media(max-width:360px){.footer-grid:is(#swm-footer,#swm-footer *){grid-template-columns:1fr}} @media(max-width:360px){.footer-brand:is(#swm-footer,#swm-footer *){grid-column:auto}} @media(prefers-reduced-motion:reduce){*:is(#swh,#swh *,#swh-scrim,#swh-scrim *,#swh-menu,#swh-menu *,#swh-dock,#swh-dock *,#swm-footer,#swm-footer *,#swp,#swp *){transition:none!important}} @media print{.brand-footer:is(#swm-footer,#swm-footer *){print-color-adjust:exact}} .cta-label:is(#swm-footer,#swm-footer *){display:block} [hidden]:is(#swp,#swp *){display:none!important} .button:is(#swm-footer,#swm-footer *){position:relative;display:inline-flex;align-items:center;justify-content:center; gap:8px;max-width:100%;min-height:48px;padding:.9rem 1.8rem; border:0;border-radius:var(--btn-radius);background:var(--btn-bg);color:var(--btn-tx); font:800 1rem/1.4 var(--display);letter-spacing:0;text-transform:none; text-decoration:none;text-align:center;cursor:pointer;overflow:visible; box-shadow:var(--btn-shadow);transition:transform var(--cta-duration) var(--cta-ease);} .button.has-badge:is(#swm-footer,#swm-footer *){margin-bottom:16px;padding-bottom:1rem} .cta-label:is(#swm-footer,#swm-footer *){display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:0} .cta-arrow:is(#swm-footer,#swm-footer *){flex:none;line-height:1;font-size:1.12em} .button:hover:is(#swm-footer,#swm-footer *){transform:translateY(-2px);color:var(--btn-tx)} .button:active:is(#swm-footer,#swm-footer *){transform:translateY(1px);box-shadow:none} .button:focus-visible:is(#swm-footer,#swm-footer *){outline:3px solid var(--lime);outline-offset:2px;box-shadow:0 0 0 5px var(--cobalt)} .cta-badge:is(#swm-footer,#swm-footer *){position:absolute;top:auto;bottom:0;left:50%;transform:translate(-50%,50%); display:inline-flex;align-items:center;justify-content:center;gap:.3rem; width:max-content;max-width:calc(100% - 2rem);padding:.3rem .8rem; border-radius:var(--badge-radius);background:var(--badge-action-bg);color:var(--badge-action-tx); font:700 .78rem/1.3 var(--body);letter-spacing:0;text-transform:none; box-shadow:var(--badge-shadow);pointer-events:none;} .cta-badge-text:is(#swm-footer,#swm-footer *){white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0} .cta-badge-icon:is(#swm-footer,#swm-footer *){flex:none;line-height:1;font-size:1em} @media(max-width:640px){.button:is(#swm-footer,#swm-footer *){font-size:14px;padding:14px 20px}} @media(max-width:640px){.cta-badge:is(#swm-footer,#swm-footer *){font-size:12px}} @media(prefers-reduced-motion:reduce){.button:is(#swm-footer,#swm-footer *){transition:none}} @media(prefers-reduced-motion:reduce){.button:hover:is(#swm-footer,#swm-footer *),.button:active:is(#swm-footer,#swm-footer *){transform:none}} .footer-v12.brand-footer:is(#swm-footer,#swm-footer *){margin-top:60px;background:var(--cobalt);background-image:var(--grid-w);background-size:var(--grid-size);color:var(--white);overflow:hidden} .footer-v12 .footer-inner:is(#swm-footer,#swm-footer *){max-width:1340px;padding:60px 40px 28px} .footer-invitation:is(#swm-footer,#swm-footer *){display:flex;align-items:center;justify-content:space-between;gap:40px;padding-bottom:48px;margin-bottom:48px;border-bottom:1px solid var(--cobalt-line)} .footer-invitation .eyebrow:is(#swm-footer,#swm-footer *){color:var(--white)} .footer-invitation :is(h2:where(:not(.section-kicker)),h3:where(.section-title)):is(#swm-footer,#swm-footer *){font:800 clamp(28px,4vw,49px)/1.1 var(--display);letter-spacing:-.045em;color:var(--white);margin:14px 0 0} .footer-invitation :is(h2:where(:not(.section-kicker)),h3:where(.section-title)) em:is(#swm-footer,#swm-footer *){color:var(--lime)} .footer-invitation .pt:is(#swm-footer,#swm-footer *){color:var(--pink)} .footer-invitation>.button:is(#swm-footer,#swm-footer *){flex-shrink:0;background:var(--lime);color:var(--ink)} .footer-invitation .cta-badge:is(#swm-footer,#swm-footer *){background:var(--white);color:var(--cobalt)} .footer-v12 .footer-grid:is(#swm-footer,#swm-footer *){display:grid;grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr));gap:40px} .footer-logo:is(#swm-footer,#swm-footer *){display:inline-block;background:var(--white);border-radius:12px;padding:14px 18px;margin-bottom:20px} .footer-v12 .footer-brand img:is(#swm-footer,#swm-footer *){display:block;width:180px;height:auto;margin:0} .footer-v12 .footer-brand p:is(#swm-footer,#swm-footer *){font-size:14px;line-height:1.7;margin:0 0 23px;max-width:37ch} .footer-v12 .footer-grid nav:is(#swm-footer,#swm-footer *){gap:16px;font-size:14px} .footer-v12 .footer-grid nav strong:is(#swm-footer,#swm-footer *){font:800 17px var(--display);color:var(--lime);margin:10px 0 7px;line-height:1.35} .footer-v12 .footer-grid nav a:is(#swm-footer,#swm-footer *){line-height:1.55;display:block} .footer-wordmark:is(#swm-footer,#swm-footer *){font:800 clamp(38px,8.1vw,112px)/1.1 var(--display);letter-spacing:-.065em;white-space:nowrap;color:rgba(255,255,255,.14);padding:45px 0 22px} .footer-v12 .footer-note:is(#swm-footer,#swm-footer *){margin-top:0;align-items:flex-start;font:400 12px/1.65 var(--body)} .footer-v12 .footer-note p:is(#swm-footer,#swm-footer *){margin:0} .footer-v12 .footer-note>a:is(#swm-footer,#swm-footer *){white-space:nowrap;color:var(--white);text-decoration:none} @media(max-width:1100px){.footer-v12 .footer-grid:is(#swm-footer,#swm-footer *){grid-template-columns:1.5fr 1fr 1fr;gap:32px}} @media(max-width:1100px){.footer-v12 .footer-grid nav:last-child:is(#swm-footer,#swm-footer *){grid-column:2/4}} @media(max-width:850px){.footer-invitation:is(#swm-footer,#swm-footer *){align-items:flex-start;flex-direction:column;gap:28px}} @media(max-width:850px){.footer-v12 .footer-grid:is(#swm-footer,#swm-footer *){grid-template-columns:1.35fr 1fr;gap:32px}} @media(max-width:850px){.footer-v12 .footer-grid .footer-brand:is(#swm-footer,#swm-footer *){grid-column:1;grid-row:1/3}} @media(max-width:850px){.footer-v12 .footer-grid nav:last-child:is(#swm-footer,#swm-footer *){grid-column:2}} @media(max-width:850px){.footer-v12 .footer-note:is(#swm-footer,#swm-footer *){flex-wrap:wrap}} @media(max-width:640px){.footer-v12 .footer-inner:is(#swm-footer,#swm-footer *){padding:44px 24px 25px}} @media(max-width:640px){.footer-invitation:is(#swm-footer,#swm-footer *){padding-bottom:38px;margin-bottom:34px}} @media(max-width:640px){.footer-invitation :is(h2:where(:not(.section-kicker)),h3:where(.section-title)):is(#swm-footer,#swm-footer *){font-size:34px}} @media(max-width:640px){.footer-v12 .footer-grid:is(#swm-footer,#swm-footer *){grid-template-columns:1fr 1fr;gap:30px 24px}} @media(max-width:640px){.footer-v12 .footer-grid .footer-brand:is(#swm-footer,#swm-footer *){grid-column:1/-1;grid-row:auto}} @media(max-width:640px){.footer-v12 .footer-grid nav:last-child:is(#swm-footer,#swm-footer *){grid-column:1/-1}} @media(max-width:640px){.footer-v12 .footer-grid nav:is(#swm-footer,#swm-footer *){gap:13px;font-size:13px}} @media(max-width:640px){.footer-v12 .footer-grid nav strong:is(#swm-footer,#swm-footer *){font-size:16px}} @media(max-width:640px){.footer-v12 .footer-brand p:is(#swm-footer,#swm-footer *){max-width:50ch}} @media(max-width:640px){.footer-wordmark:is(#swm-footer,#swm-footer *){font-size:clamp(24px,7.7vw,48px);padding:36px 0 22px}} @media(max-width:640px){.footer-v12 .footer-note:is(#swm-footer,#swm-footer *){display:grid;gap:17px;padding-top:20px}} @media(max-width:640px){.footer-invitation>.button:is(#swm-footer,#swm-footer *){font-size:15px}} @media(max-width:360px){.footer-invitation :is(h2:where(:not(.section-kicker)),h3:where(.section-title)):is(#swm-footer,#swm-footer *){font-size:30px}} h2.section-kicker:is(#swm-footer,#swm-footer *){max-width:100%;margin:0;text-wrap:pretty;overflow-wrap:normal;min-width:0} h2.section-kicker.eyebrow:is(#swm-footer,#swm-footer *){margin-bottom:var(--s3)} h2.section-kicker .section-kicker-text:is(#swm-footer,#swm-footer *){min-width:0;overflow-wrap:break-word} /* 2026-09-25-swm-refonte-claude/shell-base.css */ *:is(#swh,#swh *,#swh-scrim,#swh-scrim *,#swh-menu,#swh-menu *,#swh-dock,#swh-dock *,#swm-footer,#swm-footer *,#swp,#swp *){box-sizing:border-box} img:is(#swh,#swh *,#swh-menu,#swh-menu *,#swm-footer,#swm-footer *,#swp,#swp *){max-width:100%;height:auto} button:is(#swp,#swp *),input:is(#swp,#swp *){font:inherit} button:is(#swp,#swp *),a:is(#swh,#swh *,#swh-menu,#swh-menu *,#swh-dock,#swh-dock *,#swm-footer,#swm-footer *,#swp,#swp *),summary:is(#swh,#swh *,#swh-menu,#swh-menu *){-webkit-tap-highlight-color:transparent} a:focus-visible:is(#swh,#swh *,#swh-menu,#swh-menu *,#swh-dock,#swh-dock *,#swm-footer,#swm-footer *,#swp,#swp *),button:focus-visible:is(#swp,#swp *),summary:focus-visible:is(#swh,#swh *,#swh-menu,#swh-menu *){outline:3px solid var(--sw-pink);outline-offset:5px} h2:is(#swm-footer,#swm-footer *,#swp,#swp *),h3:is(#swm-footer,#swm-footer *){font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;letter-spacing:-.04em;line-height:1.12;text-wrap:balance;color:var(--sw-ink)} h2:is(#swm-footer,#swm-footer *,#swp,#swp *),h3:is(#swm-footer,#swm-footer *){font-size:clamp(30px,3.5vw,48px)} em:is(#swh,#swh *,#swm-footer,#swm-footer *,#swp,#swp *){font-style:normal;color:var(--sw-blue)} p:is(#swh,#swh *,#swh-menu,#swh-menu *,#swm-footer,#swm-footer *,#swp,#swp *){color:var(--sw-copy);max-width:70ch} .pt:is(#swm-footer,#swm-footer *){color:var(--sw-pink);font-style:normal} .brand-footer .footer-logo img:is(#swm-footer,#swm-footer *){width:195px;height:auto} .brand-footer:is(#swm-footer,#swm-footer *){margin-top:96px} .brand-footer .footer-invitation h3:is(#swm-footer,#swm-footer *){color:white} .brand-footer em:is(#swm-footer,#swm-footer *){color:var(--sw-lime)} .cta-badge:is(#swm-footer,#swm-footer *),.button .cta-badge *:is(#swm-footer,#swm-footer *){color:#fff!important;background:var(--sw-pink)} .button:is(#swm-footer,#swm-footer *){transition:transform .24s ease,box-shadow .24s ease} .button:hover:is(#swm-footer,#swm-footer *){transform:translateY(-3px)} .button:active:is(#swm-footer,#swm-footer *){transform:translateY(0)} .button .cta-arrow:is(#swm-footer,#swm-footer *){color:var(--sw-lime)} .has-badge:is(#swm-footer,#swm-footer *){position:relative;overflow:visible} .eyebrow:is(#swm-footer,#swm-footer *){font-family:'Rubik Mono One','Space Grotesk',sans-serif;font-size:11px;font-weight:400;letter-spacing:.05em;line-height:1.7;text-transform:uppercase;color:var(--sw-blue);display:block;margin:0 0 20px;max-width:75ch} summary:is(#swh,#swh *,#swh-menu,#swh-menu *)::-webkit-details-marker{display:none} @media(max-width:760px){h2:is(#swm-footer,#swm-footer *,#swp,#swp *),h3:is(#swm-footer,#swm-footer *){font-size:32px}} @media(max-width:760px){.brand-footer:is(#swm-footer,#swm-footer *){margin-top:56px}} @media(prefers-reduced-motion:reduce){*:is(#swh,#swh *,#swh-scrim,#swh-scrim *,#swh-menu,#swh-menu *,#swh-dock,#swh-dock *,#swm-footer,#swm-footer *,#swp,#swp *),*:is(#swh,#swh *,#swh-scrim,#swh-scrim *,#swh-menu,#swh-menu *,#swh-dock,#swh-dock *,#swm-footer,#swm-footer *,#swp,#swp *):before,*:is(#swh,#swh *,#swh-scrim,#swh-scrim *,#swh-menu,#swh-menu *,#swh-dock,#swh-dock *,#swm-footer,#swm-footer *,#swp,#swp *):after{animation:none!important;transition:none!important}} .brand-footer .footer-logo:is(#swm-footer,#swm-footer *){background:transparent} .brand-footer.footer-v12 .footer-invitation .button:is(#swm-footer,#swm-footer *){color:var(--sw-blue)} .brand-footer.footer-v12 .footer-invitation .button .cta-label:is(#swm-footer,#swm-footer *),.brand-footer.footer-v12 .footer-invitation .button .cta-arrow:is(#swm-footer,#swm-footer *){color:var(--sw-blue)} .brand-footer.footer-v12 .button .cta-badge:is(#swm-footer,#swm-footer *){background:var(--sw-pink);color:white!important} .brand-footer.footer-v12 .button .cta-badge span:is(#swm-footer,#swm-footer *){background:transparent;color:white!important} .brand-footer.footer-v12 .footer-note p:is(#swm-footer,#swm-footer *){color:#fff} /* site-web-fr-design-system/components/agency-components.css */ .button:is(#swm-footer,#swm-footer *){position:relative;display:inline-flex;align-items:center;justify-content:center; gap:8px;max-width:100%;min-height:48px;padding:.9rem 1.8rem; border:0;border-radius:var(--btn-radius);background:var(--btn-bg);color:var(--btn-tx); font:800 1rem/1.4 var(--display);letter-spacing:0;text-transform:none; text-decoration:none;text-align:center;cursor:pointer;overflow:visible; box-shadow:var(--btn-shadow);transition:transform var(--cta-duration) var(--cta-ease);} .button.has-badge:is(#swm-footer,#swm-footer *){margin-bottom:16px;padding-bottom:1rem} .cta-label:is(#swm-footer,#swm-footer *){display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:0} .cta-arrow:is(#swm-footer,#swm-footer *){flex:none;line-height:1;font-size:1.12em} .button:hover:is(#swm-footer,#swm-footer *){transform:translateY(-2px);color:var(--btn-tx)} .button:active:is(#swm-footer,#swm-footer *){transform:translateY(1px);box-shadow:none} .button:focus-visible:is(#swm-footer,#swm-footer *){outline:3px solid var(--lime);outline-offset:2px;box-shadow:0 0 0 5px var(--cobalt)} .cta-badge:is(#swm-footer,#swm-footer *){position:absolute;top:auto;bottom:0;left:50%;transform:translate(-50%,50%); display:inline-flex;align-items:center;justify-content:center;gap:.3rem; width:max-content;max-width:calc(100% - 2rem);padding:.3rem .8rem; border-radius:var(--badge-radius);background:var(--badge-action-bg);color:var(--badge-action-tx); font:700 .78rem/1.3 var(--body);letter-spacing:0;text-transform:none; box-shadow:var(--badge-shadow);pointer-events:none;} .cta-badge-text:is(#swm-footer,#swm-footer *){white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0} .cta-badge-icon:is(#swm-footer,#swm-footer *){flex:none;line-height:1;font-size:1em} @media(max-width:640px){.button:is(#swm-footer,#swm-footer *){font-size:14px;padding:14px 20px}} @media(max-width:640px){.cta-badge:is(#swm-footer,#swm-footer *){font-size:12px}} @media(prefers-reduced-motion:reduce){.button:is(#swm-footer,#swm-footer *){transition:none}} @media(prefers-reduced-motion:reduce){.button:hover:is(#swm-footer,#swm-footer *),.button:active:is(#swm-footer,#swm-footer *){transform:none}} /* 2026-09-25-swm-refonte-claude/shell.css */ .eyebrow:is(#swm-footer,#swm-footer *){display:flex;gap:12px;align-items:center;font-size:10px} .eyebrow:is(#swm-footer,#swm-footer *)::before{content:'';width:22px;height:6px;border-radius:3px;background:var(--pink);flex:none} .button .cta-arrow:is(#swm-footer,#swm-footer *){color:inherit} .cta-badge:is(#swm-footer,#swm-footer *),.button .cta-badge:is(#swm-footer,#swm-footer *){background:var(--pink);color:white!important;font:700 12px/1.3 var(--body);bottom:0;left:50%;transform:translate(-50%,50%);max-width:calc(100% - 12px);padding:5px 9px;white-space:nowrap} .button .cta-badge *:is(#swm-footer,#swm-footer *){color:white!important;background:transparent} .brand-footer:is(#swm-footer,#swm-footer *){margin-top:0;background-color:var(--cobalt);background-image:var(--grid-w);background-size:var(--grid-size)} .brand-footer .footer-inner:is(#swm-footer,#swm-footer *){max-width:1180px} .brand-footer .footer-note p:is(#swm-footer,#swm-footer *){color:white} .brand-footer .eyebrow:is(#swm-footer,#swm-footer *){color:var(--lime)} .brand-footer .footer-invitation .button:is(#swm-footer,#swm-footer *){--btn-bg:white;--btn-tx:var(--cobalt)} .brand-footer .footer-note a:is(#swm-footer,#swm-footer *){color:white} @media(max-width:760px){.brand-footer:is(#swm-footer,#swm-footer *){padding-bottom:80px}} @media(max-width:760px){.brand-footer .footer-inner:is(#swm-footer,#swm-footer *){width:calc(100% - 36px)}} @media(prefers-reduced-motion:reduce){*:is(#swh,#swh *,#swh-scrim,#swh-scrim *,#swh-menu,#swh-menu *,#swh-dock,#swh-dock *,#swm-footer,#swm-footer *,#swp,#swp *),*:is(#swh,#swh *,#swh-scrim,#swh-scrim *,#swh-menu,#swh-menu *,#swh-dock,#swh-dock *,#swm-footer,#swm-footer *,#swp,#swp *)::before,*:is(#swh,#swh *,#swh-scrim,#swh-scrim *,#swh-menu,#swh-menu *,#swh-dock,#swh-dock *,#swm-footer,#swm-footer *,#swp,#swp *)::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}} /* ---------- components/header.css (sélecteurs renforcés) ---------- */ /* ================================================================ SWH · Header global Site Web Montpellier · v1 du 25/09/2026 DA Site-web.fr : blanc, cobalt quadrillé, encre, ponctuation rose, touches lime. Autonome : toutes les valeurs ont un repli si tokens.css n'est pas chargé. Polices attendues (déjà chargées par le site) : Plus Jakarta Sans 800, Space Grotesk 400/500/700, Rubik Mono One 400. Points de rupture : PC ≥ 1101 px · header mobile ≤ 1100 px · dock ≤ 760 px. ================================================================ */ .swh:not(#swm-x),.swh-menu:not(#swm-x),.swh-dock:not(#swm-x),.swh-scrim:not(#swm-x){ --swh-cobalt:var(--cobalt,#2130ea);--swh-cobalt-deep:var(--cobalt-deep,#111c9c);--swh-cobalt-soft:var(--cobalt-soft,#e7e9ff); --swh-ink:var(--ink,#12131c);--swh-ink-soft:var(--ink-soft,#454a63);--swh-pink:var(--pink,#ff5ec4);--swh-lime:var(--lime,#c8ff3e); --swh-yellow:var(--yellow,#ffd93d);--swh-brd:var(--brd,#e5e7eb);--swh-pink-line:#ffc4ea; --swh-display:var(--display,'Plus Jakarta Sans','Space Grotesk',system-ui,sans-serif); --swh-body:var(--body,'Space Grotesk',system-ui,sans-serif); --swh-mono:var(--mono,'Rubik Mono One',monospace); --swh-grid:linear-gradient(rgba(255,255,255,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.14) 1px,transparent 1px); --swh-ease:cubic-bezier(.22,.78,.25,1); } .swh *:not(#swm-x),.swh *:not(#swm-x)::before,.swh *:not(#swm-x)::after,.swh-menu *:not(#swm-x),.swh-menu *:not(#swm-x)::before,.swh-menu *:not(#swm-x)::after,.swh-dock *:not(#swm-x){box-sizing:border-box} .swh-sprite:not(#swm-x){position:absolute;width:0;height:0;overflow:hidden} .swh-ico:not(#swm-x){width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round} .swh p:not(#swm-x),.swh-menu p:not(#swm-x){margin:0;max-width:none;color:inherit} .swh ul:not(#swm-x),.swh ol:not(#swm-x),.swh-menu ul:not(#swm-x),.swh-menu ol:not(#swm-x){list-style:none;margin:0;padding:0} .swh summary:not(#swm-x),.swh-menu summary:not(#swm-x){list-style:none;cursor:pointer} .swh summary:not(#swm-x)::-webkit-details-marker,.swh-menu summary:not(#swm-x)::-webkit-details-marker{display:none} .swh summary:not(#swm-x)::marker,.swh-menu summary:not(#swm-x)::marker{content:''} .swh-pt:not(#swm-x){color:var(--swh-pink)} /* ---------- Coque ---------- */ .swh:not(#swm-x){position:sticky;top:0;z-index:80;background:#fff;color:var(--swh-ink);font:500 15px/1.4 var(--swh-body);transition:transform .24s var(--swh-ease)} .swh-wrap:not(#swm-x){width:min(1180px,calc(100% - 64px));margin-inline:auto} /* Bandeau utile */ .swh-util:not(#swm-x){max-height:38px;overflow:hidden;border-bottom:1px solid var(--swh-brd);transition:max-height .22s var(--swh-ease),opacity .18s ease,visibility 0s linear 0s} .swh-util-inner:not(#swm-x){display:flex;align-items:center;gap:18px;min-height:37px;font:500 12.5px/1.3 var(--swh-body);color:var(--swh-ink-soft);white-space:nowrap} .swh-util a:not(#swm-x){color:inherit;text-decoration:none} .swh-util strong:not(#swm-x){color:var(--swh-ink);font-weight:700} .swh-util-muted:not(#swm-x){color:var(--swh-ink-soft);font-weight:400} .swh-util-proof:not(#swm-x){display:inline-flex;align-items:center;gap:6px} .swh-util-proof:hover strong:not(#swm-x),.swh-util-tel:hover strong:not(#swm-x){color:var(--swh-cobalt);text-decoration:underline;text-underline-offset:3px} .swh-stars:not(#swm-x){color:var(--swh-yellow);letter-spacing:1px;font-size:12px} .swh-util-place:not(#swm-x){display:inline-flex;align-items:center;gap:6px} .swh-util-place .swh-ico:not(#swm-x),.swh-util-tel .swh-ico:not(#swm-x){width:15px;height:15px;color:var(--swh-pink)} .swh-util-prices:not(#swm-x){margin-left:auto!important} .swh-util-prices strong:not(#swm-x){color:var(--swh-cobalt)} .swh-util-sim:not(#swm-x){margin-left:10px;color:var(--swh-cobalt);font-weight:700;text-decoration:underline;text-underline-offset:3px;white-space:nowrap} .swh-util-sim:hover:not(#swm-x){text-decoration-thickness:2px} .swh-feature-link--sim:not(#swm-x){margin-top:0} .swh-util-tel:not(#swm-x){display:inline-flex;align-items:center;gap:7px;padding-left:18px;border-left:1px solid var(--swh-brd)} .swh.is-compact .swh-util:not(#swm-x){max-height:0;opacity:0;visibility:hidden;border-bottom-color:transparent;transition:max-height .22s var(--swh-ease),opacity .12s ease,visibility 0s linear .22s} /* Barre principale */ .swh-bar:not(#swm-x){position:relative;border-bottom:1px solid var(--swh-brd);background:#fff} .swh-bar-inner:not(#swm-x){display:flex;align-items:center;gap:26px;min-height:84px;transition:min-height .22s var(--swh-ease)} .swh.is-compact .swh-bar-inner:not(#swm-x){min-height:66px} .swh.is-compact .swh-bar:not(#swm-x){box-shadow:0 10px 24px -22px rgba(18,19,28,.5)} /* Logo : fichier officiel blanc, posé sur une tuile cobalt quadrillée */ .swh-brand:not(#swm-x){display:flex;align-items:center;flex:none;padding:9px 13px;border-radius:10px;background-color:var(--swh-cobalt);background-image:var(--swh-grid);background-size:14px 14px;background-position:-1px -1px;text-decoration:none} .swh-brand img:not(#swm-x){display:block;width:156px;height:auto;transition:width .22s var(--swh-ease)} .swh.is-compact .swh-brand:not(#swm-x){padding:7px 11px} .swh.is-compact .swh-brand img:not(#swm-x){width:128px} /* Navigation PC */ .swh-nav:not(#swm-x){flex:1;display:flex;justify-content:center;min-width:0} .swh-nav-list:not(#swm-x){display:flex;align-items:center;gap:2px} .swh-link:not(#swm-x){position:relative;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:10px 12px;border-radius:9px;color:var(--swh-ink);font:500 15.5px/1.2 var(--swh-body);letter-spacing:-.01em;text-decoration:none;white-space:nowrap;transition:color .15s ease,background-color .15s ease} .swh-link:not(#swm-x)::after{content:'';position:absolute;left:12px;right:12px;bottom:5px;height:3px;border-radius:3px;background:var(--swh-pink);transform:scaleX(0);transform-origin:0 50%;transition:transform .2s var(--swh-ease)} .swh-link:hover:not(#swm-x){color:var(--swh-cobalt)} .swh-link:hover:not(#swm-x)::after,.swh-link[aria-current="page"]:not(#swm-x)::after,.swh-group.is-current>.swh-link:not(#swm-x)::after{transform:scaleX(1)} .swh-link[aria-current="page"]:not(#swm-x),.swh-group.is-current>.swh-link:not(#swm-x){color:var(--swh-cobalt)} .swh-chev:not(#swm-x){width:16px;height:16px;color:var(--swh-pink);stroke-width:2.4;transition:transform .2s var(--swh-ease)} .swh-group[open]>.swh-link:not(#swm-x){background:var(--swh-cobalt-soft);color:var(--swh-cobalt)} .swh-group[open]>.swh-link:not(#swm-x)::after{transform:scaleX(0)} .swh-group[open]>.swh-link .swh-chev:not(#swm-x){transform:rotate(180deg)} /* Actions PC */ .swh-actions:not(#swm-x){display:flex;align-items:center;gap:12px;flex:none} .swh-call:not(#swm-x){display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;margin-bottom:11px;border:1.5px solid var(--swh-brd);border-radius:10px;background:#fff;color:var(--swh-pink);transition:border-color .15s ease,transform .15s var(--swh-ease)} .swh-call:hover:not(#swm-x){border-color:var(--swh-cobalt);transform:translateY(-2px)} /* Bouton partagé : Plus Jakarta 800, rayon 9, icône, badge à cheval exactement à 50 % */ .swh-btn:not(#swm-x){position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:13px 22px;border-radius:9px;background:var(--swh-cobalt);color:#fff;font:800 15px/1.2 var(--swh-display);letter-spacing:-.01em;text-decoration:none;white-space:nowrap;box-shadow:0 14px 30px -14px rgba(33,48,234,.55);transition:transform .15s var(--swh-ease)} .swh-btn:hover:not(#swm-x){transform:translateY(-2px);color:#fff} .swh-btn:active:not(#swm-x){transform:translateY(1px);box-shadow:none} .swh-btn-label:not(#swm-x){display:inline-flex;align-items:center;gap:9px} .swh-btn-label .swh-ico:not(#swm-x){width:18px;height:18px;stroke-width:2.3} .swh-badge:not(#swm-x){position:absolute;left:50%;bottom:0;transform:translate(-50%,50%);display:inline-flex;align-items:center;gap:5px;max-width:calc(100% - 12px);padding:4px 9px;border-radius:7px;background:var(--swh-pink);color:#fff;font:700 11.5px/1.25 var(--swh-body);letter-spacing:0;white-space:nowrap;box-shadow:0 6px 16px -6px rgba(18,19,28,.35);pointer-events:none} .swh-badge--white:not(#swm-x){background:#fff;color:var(--swh-cobalt)} .swh-badge--white>span:not(#swm-x){color:var(--swh-pink)} .swh-btn--lime:not(#swm-x){background:var(--swh-lime);color:var(--swh-cobalt);box-shadow:0 12px 26px -14px rgba(10,16,90,.6)} .swh-btn--lime:hover:not(#swm-x){color:var(--swh-cobalt)} .swh-cta:not(#swm-x){margin-bottom:11px} .swh-menu-btn:not(#swm-x){display:none} /* Progression de lecture : barre cobalt, point rose en tête (ponctuation) */ .swh-progress:not(#swm-x){position:absolute;left:0;right:0;bottom:-1px;height:3px;overflow:hidden;pointer-events:none;opacity:0;transition:opacity .2s ease} .swh.is-compact .swh-progress:not(#swm-x){opacity:1} .swh-progress i:not(#swm-x){position:absolute;inset:0;background:var(--swh-cobalt);transform:translateX(calc((var(--p,0) - 1) * 100%));will-change:transform} .swh-progress i:not(#swm-x)::after{content:'';position:absolute;right:0;top:0;width:10px;height:3px;border-radius:3px;background:var(--swh-pink)} /* ---------- Méga-panneaux PC ---------- */ .swh-panel:not(#swm-x){position:absolute;left:0;right:0;top:100%;z-index:2;padding-top:10px;cursor:auto} .swh-group:not([open])>.swh-panel:not(#swm-x){display:none} .swh-group[open]>.swh-panel:not(#swm-x){animation:swh-drop .2s var(--swh-ease)} .swh-panel-inner:not(#swm-x){position:relative;width:min(1180px,calc(100% - 64px));margin:0 auto;display:grid;grid-template-columns:318px minmax(0,1fr);gap:18px;padding:16px;border:1px solid var(--swh-brd);border-radius:20px;background:#fff;box-shadow:0 34px 60px -34px rgba(18,19,28,.5)} .swh-feature:not(#swm-x){position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:26px 24px 22px;border-radius:14px;background-color:var(--swh-cobalt);background-image:var(--swh-grid);background-size:34px 34px;color:#fff} .swh-feature-kicker:not(#swm-x){font:400 10.5px/1.6 var(--swh-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--swh-lime)} .swh-feature-title:not(#swm-x){font:800 25px/1.14 var(--swh-display);letter-spacing:-.035em;color:#fff;text-wrap:balance} .swh-feature-title em:not(#swm-x){font-style:normal;color:var(--swh-lime)} .swh-feature-text:not(#swm-x){font:400 14px/1.55 var(--swh-body);color:#fff} .swh-sticker:not(#swm-x){position:absolute;top:-9px;right:16px;padding:5px 10px;border-radius:7px;background:var(--swh-lime);color:var(--swh-cobalt);font:700 12px/1.2 var(--swh-body);transform:rotate(4deg);box-shadow:0 8px 18px -10px rgba(10,16,90,.7)} .swh-prices:not(#swm-x){display:grid;gap:8px;width:100%} .swh-price:not(#swm-x){display:grid;gap:1px;padding:11px 14px 12px;border-radius:11px;background:#fff;color:var(--swh-ink)} .swh-price>span:not(#swm-x){font:700 12.5px/1.3 var(--swh-body);color:var(--swh-ink)} .swh-price strong:not(#swm-x){font:800 21px/1.2 var(--swh-display);letter-spacing:-.03em;color:var(--swh-cobalt)} .swh-price strong small:not(#swm-x){font:500 13px/1 var(--swh-body);letter-spacing:0;color:var(--swh-ink-soft)} .swh-price em:not(#swm-x){font:400 12px/1.4 var(--swh-body);font-style:normal;color:var(--swh-ink-soft)} .swh-feature-link:not(#swm-x){display:flex;align-items:center;gap:10px;width:100%;min-height:44px;margin-top:auto;padding-top:12px;border-top:1px solid rgba(255,255,255,.35);color:#fff;font:700 14px/1.3 var(--swh-body);text-decoration:none} .swh-feature-link span:not(#swm-x){text-decoration:underline;text-decoration-color:rgba(255,255,255,.55);text-underline-offset:4px} .swh-feature-link .swh-ico:not(#swm-x){margin-left:auto;color:var(--swh-lime);transition:transform .15s var(--swh-ease)} .swh-feature-link:hover .swh-ico:not(#swm-x){transform:translateX(3px)} .swh-person:not(#swm-x){display:flex;align-items:center;gap:12px} .swh-person:not(#swm-x){margin:4px 0 2px} .swh-person img:not(#swm-x){width:86px;height:98px;border-radius:14px;object-fit:cover;object-position:50% 20%;border:4px solid #fff;flex:none;transform:rotate(-3deg);box-shadow:0 16px 28px -18px rgba(8,12,70,.8)} .swh-person strong:not(#swm-x){display:block;font:800 18px/1.2 var(--swh-display);letter-spacing:-.02em} .swh-person span:not(#swm-x){display:block;font:400 12.5px/1.35 var(--swh-body)} .swh-items:not(#swm-x){display:grid;gap:8px;align-content:start} .swh-items--2:not(#swm-x){grid-template-columns:repeat(2,minmax(0,1fr))} .swh-items--3:not(#swm-x){grid-template-columns:repeat(3,minmax(0,1fr))} .swh-item:not(#swm-x){display:grid;grid-template-columns:46px minmax(0,1fr) 20px;align-items:start;gap:14px;height:100%;min-height:96px;padding:18px 16px 18px 18px;border:1.5px solid var(--swh-brd);border-radius:14px;background:#fff;color:var(--swh-ink);text-decoration:none;transition:border-color .15s ease,transform .15s var(--swh-ease)} .swh-item:hover:not(#swm-x){border-color:var(--swh-cobalt);transform:translateY(-2px)} .swh-item[aria-current="page"]:not(#swm-x){border-color:var(--swh-cobalt)} .swh-item[aria-current="page"] .swh-item-copy strong:not(#swm-x)::after{content:'Vous êtes ici';display:inline-block;margin-left:8px;padding:2px 7px;border-radius:6px;background:var(--swh-cobalt-soft);color:var(--swh-cobalt);font:700 11px/1.3 var(--swh-body);letter-spacing:0;vertical-align:2px} .swh-item-ico:not(#swm-x){display:flex;align-items:center;justify-content:center;width:46px;height:46px;border:1.5px solid var(--swh-pink-line);border-radius:12px;color:var(--swh-pink)} .swh-item-ico .swh-ico:not(#swm-x){width:23px;height:23px} .swh-item-copy:not(#swm-x){display:grid;gap:4px;min-width:0} .swh-item-copy strong:not(#swm-x){font:800 16.5px/1.25 var(--swh-display);letter-spacing:-.025em;color:var(--swh-ink)} .swh-item-copy>span:not(#swm-x){font:400 13.5px/1.5 var(--swh-body);color:var(--swh-ink-soft)} .swh-item-copy b:not(#swm-x){margin-top:4px;font:700 13px/1.35 var(--swh-body);color:var(--swh-cobalt)} .swh-item-arrow:not(#swm-x){width:19px;height:19px;margin-top:2px;color:var(--swh-pink);stroke-width:2.2;transition:transform .15s var(--swh-ease)} .swh-item:hover .swh-item-arrow:not(#swm-x){transform:translateX(3px)} .swh-item--all:not(#swm-x){background:var(--swh-cobalt-soft);border-color:var(--swh-cobalt-soft)} .swh-item--all .swh-item-ico:not(#swm-x){background:#fff} .swh-item--all strong:not(#swm-x){color:var(--swh-cobalt)} .swh-panel-foot:not(#swm-x){grid-column:2;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 4px 2px;border-top:1px solid var(--swh-brd);font:400 14px/1.4 var(--swh-body);color:var(--swh-ink-soft)} .swh-panel-foot a:not(#swm-x){display:inline-flex;align-items:center;gap:6px;color:var(--swh-cobalt);font-weight:700;text-decoration:underline;text-underline-offset:4px} .swh-panel-foot .swh-ico:not(#swm-x){width:16px;height:16px;color:var(--swh-pink);stroke-width:2.3} .swh-panel-inner--creation:not(#swm-x){grid-template-rows:1fr auto} .swh-panel-inner--creation .swh-feature:not(#swm-x){grid-row:1/3} .swh-panel-inner--creation .swh-items:not(#swm-x){grid-auto-rows:1fr;align-content:stretch} /* Expertises : icône au-dessus, texte sur toute la largeur de la carte */ .swh-items--3 .swh-item:not(#swm-x){grid-template-columns:minmax(0,1fr) 20px;grid-template-rows:auto 1fr;row-gap:14px;min-height:0} .swh-items--3 .swh-item-ico:not(#swm-x){grid-column:1;grid-row:1} .swh-items--3 .swh-item-arrow:not(#swm-x){grid-column:2;grid-row:1} .swh-items--3 .swh-item-copy:not(#swm-x){grid-column:1/-1;grid-row:2} /* Voile sous le header quand un panneau est ouvert */ .swh-scrim:not(#swm-x){position:fixed;inset:0;z-index:79;background:rgba(18,19,28,.3);opacity:0;visibility:hidden;transition:opacity .2s ease,visibility 0s linear .2s} .swh-scrim.is-on:not(#swm-x){opacity:1;visibility:visible;transition:opacity .2s ease} /* Focus visible : rose sur blanc, lime sur cobalt */ .swh a:focus-visible:not(#swm-x),.swh summary:focus-visible:not(#swm-x),.swh button:focus-visible:not(#swm-x),.swh-dock a:focus-visible:not(#swm-x),.swh-menu .swh-m-top a:focus-visible:not(#swm-x),.swh-menu .swh-m-sub a:focus-visible:not(#swm-x),.swh-menu .swh-proof:focus-visible:not(#swm-x){outline:3px solid var(--swh-pink);outline-offset:3px;box-shadow:none} .swh .swh-feature a:focus-visible:not(#swm-x),.swh-menu .swh-m-body>nav summary:focus-visible:not(#swm-x),.swh-menu .swh-m-link:focus-visible:not(#swm-x),.swh-menu .swh-m-bottom a:focus-visible:not(#swm-x),.swh-dock .swh-dock-cta:focus-visible:not(#swm-x){outline:3px solid var(--swh-lime);outline-offset:3px;box-shadow:none} .swh-dock .swh-dock-call:focus-visible:not(#swm-x){outline-color:var(--swh-lime)} /* ---------- Tablette et mobile : header compact + bouton Menu ---------- */ @media (min-width:1101px) and (max-width:1380px){.swh-util-place:not(#swm-x){display:none}} @media (min-width:1101px) and (max-width:1260px){ .swh-bar-inner:not(#swm-x){gap:16px} .swh-link:not(#swm-x){padding:10px 9px;font-size:15px} .swh-util-place:not(#swm-x),.swh-util-proof .swh-util-muted:not(#swm-x),.swh-util-tel .swh-util-muted:not(#swm-x){display:none} .swh-brand img:not(#swm-x){width:140px} .swh-items--3:not(#swm-x){grid-template-columns:repeat(2,minmax(0,1fr))} } @media (max-width:1100px){ .swh-util:not(#swm-x),.swh-nav:not(#swm-x),.swh-scrim:not(#swm-x){display:none} .swh-bar-inner:not(#swm-x){min-height:68px;gap:12px} .swh.is-compact .swh-bar-inner:not(#swm-x){min-height:68px} .swh-brand:not(#swm-x){padding:8px 11px} .swh-brand:not(#swm-x),.swh.is-compact .swh-brand:not(#swm-x){padding:7px 11px} .swh-brand img:not(#swm-x),.swh.is-compact .swh-brand img:not(#swm-x){width:132px} .swh-actions:not(#swm-x){margin-left:auto;gap:10px} .swh-cta:not(#swm-x){font-size:14px;padding:12px 18px} .swh-menu-btn:not(#swm-x){display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 17px 0 14px;border-radius:10px;background:var(--swh-cobalt);color:#fff;font:800 15px/1 var(--swh-display);letter-spacing:-.01em;text-decoration:none;box-shadow:0 12px 24px -14px rgba(33,48,234,.6)} .swh-menu-btn .swh-ico:not(#swm-x){width:21px;height:21px;color:var(--swh-lime);stroke-width:2.3} .swh-call:not(#swm-x),.swh-cta:not(#swm-x){margin-bottom:0} .swh-cta:not(#swm-x){margin-bottom:11px} .swh.is-typing:not(#swm-x){transform:translateY(-102%)} .swh-progress:not(#swm-x){opacity:1} } @media (max-width:760px){ .swh-wrap:not(#swm-x){width:calc(100% - 36px)} .swh-bar-inner:not(#swm-x),.swh.is-compact .swh-bar-inner:not(#swm-x){min-height:64px} .swh-brand:not(#swm-x){padding:7px 10px;border-radius:9px} .swh-brand img:not(#swm-x),.swh.is-compact .swh-brand img:not(#swm-x){width:124px} .swh-call:not(#swm-x),.swh-cta:not(#swm-x){display:none} .swh-menu-btn:not(#swm-x){min-height:44px} } @media (max-width:359px){ .swh-brand img:not(#swm-x),.swh.is-compact .swh-brand img:not(#swm-x){width:108px} .swh-menu-btn:not(#swm-x){padding:0 13px 0 11px} } /* ---------- Menu mobile plein écran ---------- */ .swh-menu:not(#swm-x){position:fixed;inset:0;z-index:120;display:none;flex-direction:column;background:var(--swh-cobalt);color:#fff;font:500 15px/1.4 var(--swh-body)} .swh-menu:target:not(#swm-x),.swh-menu.is-open:not(#swm-x){display:flex} @media (min-width:1101px){.swh-menu:not(#swm-x){display:none!important}} .swh-m-top:not(#swm-x){flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px;padding:0 18px;background:#fff;border-bottom:1px solid var(--swh-brd)} .swh-m-top .swh-brand:not(#swm-x){padding:7px 10px;border-radius:9px} .swh-m-top .swh-brand img:not(#swm-x){width:124px} .swh-m-close:not(#swm-x){display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 4px 0 12px;color:var(--swh-cobalt);font:700 15px/1 var(--swh-body);text-decoration:none} .swh-m-close .swh-ico:not(#swm-x){width:26px;height:26px;color:var(--swh-pink);stroke-width:2.2} .swh-m-body:not(#swm-x){flex:1;overflow-y:auto;overscroll-behavior:contain;padding:26px 20px 28px;background-color:var(--swh-cobalt);background-image:var(--swh-grid);background-size:34px 34px;background-position:-1px -1px} .swh-m-hello:not(#swm-x){display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 18px!important;font:800 27px/1.15 var(--swh-display);letter-spacing:-.035em;color:#fff} .swh-m-hello .swh-ico:not(#swm-x){width:26px;height:26px;color:var(--swh-lime)} .swh-m-list:not(#swm-x){border-bottom:1px solid rgba(255,255,255,.26)} .swh-m-row:not(#swm-x){border-top:1px solid rgba(255,255,255,.26)} .swh-m-group>summary:not(#swm-x),.swh-m-link:not(#swm-x){display:grid;grid-template-columns:30px minmax(0,1fr) 40px;align-items:center;gap:8px;min-height:68px;padding:10px 0;color:#fff;text-decoration:none} .swh-m-num:not(#swm-x){font:400 10px/1 var(--swh-mono);letter-spacing:.04em;color:var(--swh-lime)} .swh-m-label:not(#swm-x){font:800 25px/1.15 var(--swh-display);letter-spacing:-.035em;color:#fff} .swh-m-link[aria-current="page"] .swh-m-label:not(#swm-x)::after{content:'.';color:var(--swh-pink)} .swh-m-plus:not(#swm-x){display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1.5px solid rgba(255,255,255,.55);border-radius:50%;color:var(--swh-lime);transition:transform .22s var(--swh-ease),background-color .15s ease} .swh-m-plus .swh-ico:not(#swm-x){width:20px;height:20px;stroke-width:2.4} .swh-m-group[open] .swh-m-plus:not(#swm-x){transform:rotate(45deg);background:var(--swh-lime);border-color:var(--swh-lime);color:var(--swh-cobalt)} .swh-m-go:not(#swm-x){justify-self:center;width:24px;height:24px;color:var(--swh-lime);stroke-width:2.2} .swh-m-sub:not(#swm-x){display:grid;margin:0 0 16px;padding:6px 8px;border-radius:16px;background:#fff;color:var(--swh-ink)} .swh-m-group[open] .swh-m-sub:not(#swm-x){animation:swh-drop .24s var(--swh-ease)} .swh-m-sub a:not(#swm-x){display:grid;grid-template-columns:40px minmax(0,1fr) 18px;align-items:center;gap:12px;min-height:60px;padding:10px 6px;border-top:1px solid var(--swh-brd);color:var(--swh-ink);text-decoration:none} .swh-m-sub a:first-child:not(#swm-x){border-top:0} .swh-m-ico:not(#swm-x){display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1.5px solid var(--swh-pink-line);border-radius:11px;color:var(--swh-pink)} .swh-m-copy:not(#swm-x){display:grid;gap:2px;min-width:0} .swh-m-copy strong:not(#swm-x){font:800 15.5px/1.25 var(--swh-display);letter-spacing:-.02em;color:var(--swh-ink)} .swh-m-copy small:not(#swm-x){font:400 12.5px/1.4 var(--swh-body);color:var(--swh-ink-soft)} .swh-m-copy b:not(#swm-x){font-weight:700;color:var(--swh-cobalt)} .swh-m-arrow:not(#swm-x){width:18px;height:18px;color:var(--swh-pink);stroke-width:2.3} .swh-m-sub a.swh-m-all:not(#swm-x){grid-template-columns:minmax(0,1fr) 18px;min-height:50px;padding-left:8px} .swh-m-all strong:not(#swm-x){color:var(--swh-cobalt)} .swh-m-sub a[aria-current="page"] .swh-m-copy strong:not(#swm-x){color:var(--swh-cobalt)} .swh-proof:not(#swm-x){display:flex;align-items:center;gap:10px;width:max-content;max-width:100%;margin-top:24px;padding:9px 16px 9px 10px;border-radius:999px;background:#fff;color:var(--swh-ink);text-decoration:none} .swh-faces:not(#swm-x){display:flex;flex:none} .swh-faces img:not(#swm-x){width:34px;height:34px;border:2px solid #fff;border-radius:50%;object-fit:cover} .swh-faces img+img:not(#swm-x){margin-left:-9px} .swh-proof-copy:not(#swm-x){display:grid;gap:1px;min-width:0} .swh-proof-copy strong:not(#swm-x){font:700 13px/1.2 var(--swh-body)} .swh-proof-copy small:not(#swm-x){font:400 10.5px/1.35 var(--swh-body);color:var(--swh-ink-soft)} .swh-m-where:not(#swm-x){display:flex;align-items:flex-start;gap:8px;margin-top:14px!important;font:400 13px/1.45 var(--swh-body);color:#fff} .swh-m-where .swh-ico:not(#swm-x){width:16px;height:16px;margin-top:2px;color:var(--swh-lime)} .swh-m-where a:not(#swm-x){color:#fff;font-weight:700;text-decoration:underline;text-decoration-color:rgba(255,255,255,.5);text-underline-offset:3px} .swh-menu .swh-m-where a:focus-visible:not(#swm-x){outline:3px solid var(--swh-lime);outline-offset:3px} .swh-m-bottom:not(#swm-x){flex:none;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:10px;padding:14px 18px calc(24px + env(safe-area-inset-bottom));background:var(--swh-cobalt);border-top:1px solid rgba(255,255,255,.26)} .swh-m-call:not(#swm-x){display:flex;align-items:center;gap:8px;min-height:52px;padding:8px 12px 8px 10px;border-radius:9px;background:#fff;color:var(--swh-cobalt);text-decoration:none} .swh-m-call .swh-ico:not(#swm-x){width:18px;height:18px;color:var(--swh-pink)} .swh-m-call strong:not(#swm-x){display:block;font:800 13px/1.15 var(--swh-display);letter-spacing:-.01em} .swh-m-call small:not(#swm-x){display:block;font:500 10.5px/1.3 var(--swh-body);color:var(--swh-ink-soft);white-space:nowrap} /* 26/09 (Noham) : « Parlons de votre projet » tenait sur deux lignes sur téléphone : typo réduite, une seule ligne */ .swh-m-bottom .swh-btn:not(#swm-x){min-height:52px;padding:12px 10px 14px;font-size:clamp(12px,3.4vw,13.5px);white-space:nowrap;text-align:center} .swh-m-bottom .swh-btn-label:not(#swm-x){gap:7px} .swh-m-bottom .swh-btn-label .swh-ico:not(#swm-x){width:16px;height:16px} .swh-m-bottom .swh-badge:not(#swm-x){font-size:11px;padding:3px 8px} /* Entrée du menu : nappe cobalt depuis le bouton Menu, rubriques en cascade */ .swh-menu.is-open:not(#swm-x){clip-path:circle(0 at calc(100% - 52px) 32px)} .swh-menu.is-open.is-in:not(#swm-x){clip-path:circle(150% at calc(100% - 52px) 32px);transition:clip-path .42s var(--swh-ease)} .swh-menu.is-open.is-out:not(#swm-x){clip-path:circle(0 at calc(100% - 52px) 32px);transition:clip-path .22s ease-in} .swh-menu.is-open .swh-m-hello:not(#swm-x),.swh-menu.is-open .swh-m-row:not(#swm-x),.swh-menu.is-open .swh-proof:not(#swm-x){opacity:0;transform:translateY(14px)} .swh-menu.is-in .swh-m-hello:not(#swm-x),.swh-menu.is-in .swh-m-row:not(#swm-x),.swh-menu.is-in .swh-proof:not(#swm-x){opacity:1;transform:none;transition:opacity .32s ease calc(var(--i,0) * 45ms + 120ms),transform .38s var(--swh-ease) calc(var(--i,0) * 45ms + 120ms)} .swh-menu:target:not(.is-open):not(#swm-x){clip-path:none} /* ---------- Dock mobile ---------- */ .swh-dock:not(#swm-x){display:none} @media (max-width:760px){ .swh-dock:not(#swm-x){position:fixed;left:0;right:0;bottom:0;z-index:90;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:10px;padding:10px 18px calc(18px + env(safe-area-inset-bottom));background-color:var(--swh-cobalt);background-image:var(--swh-grid);background-size:34px 34px;box-shadow:0 -12px 28px -20px rgba(18,19,28,.6);transition:transform .24s var(--swh-ease)} .swh-dock.is-hidden:not(#swm-x){transform:translateY(125%);pointer-events:none} .swh-dock-call:not(#swm-x){display:flex;align-items:center;justify-content:center;gap:9px;min-height:48px;border-radius:9px;background:#fff;color:var(--swh-cobalt);font:800 15px/1 var(--swh-display);letter-spacing:-.01em;text-decoration:none} .swh-dock-call .swh-ico:not(#swm-x){width:19px;height:19px;color:var(--swh-pink)} .swh-dock-cta:not(#swm-x){min-height:48px;padding:12px 14px;font-size:15px} .swh-dock .swh-badge:not(#swm-x){font-size:10.5px;padding:3px 8px} } @keyframes swh-drop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}} @media (prefers-reduced-motion:reduce){ .swh:not(#swm-x),.swh *:not(#swm-x),.swh-menu:not(#swm-x),.swh-menu *:not(#swm-x),.swh-dock:not(#swm-x),.swh-dock *:not(#swm-x),.swh-scrim:not(#swm-x){transition:none!important;animation:none!important} .swh-menu.is-open:not(#swm-x),.swh-menu.is-open.is-in:not(#swm-x){clip-path:none} .swh-menu.is-open .swh-m-hello:not(#swm-x),.swh-menu.is-open .swh-m-row:not(#swm-x),.swh-menu.is-open .swh-proof:not(#swm-x){opacity:1;transform:none} .swh-btn:hover:not(#swm-x),.swh-item:hover:not(#swm-x),.swh-call:hover:not(#swm-x){transform:none} } @media print{.swh-util:not(#swm-x),.swh-nav:not(#swm-x),.swh-actions:not(#swm-x),.swh-menu:not(#swm-x),.swh-dock:not(#swm-x),.swh-scrim:not(#swm-x),.swh-progress:not(#swm-x){display:none!important}.swh:not(#swm-x){position:static}} /* ---------- components/popup.css (sélecteurs renforcés) ---------- */ /* ================================================================ SWP · Popup de conversion Site Web Montpellier · v1 du 25/09/2026 DA Site-web.fr. Autonome : aucune dépendance aux feuilles de page (valeurs de repli si tokens.css absent). PC : fenêtre centrée en deux volets (cobalt quadrillé + blanc). Mobile ≤ 640 px : feuille montante. .swp = conteneur