/* Qreew buttons, navigation, footer titles and publisher CTA strip. Colours stay on the four brand colours. */
/* 1. The disc is the Q favicon: round, square top-right corner, one diagonal cut. On hover it opens: the disc grows until it fills the whole button. */
body:not(#q) :is(#main,.studio-nav,.site-end,dialog) :is(.pill,.ap-btn,.wf-btn,.ac-btn,.oc-btn,.ob-btn,.pc-btn,.dm-submit,.hub-black,.sx-btn,.sat-btn,.button,.obf-submit,.lead-submit){position:relative;overflow:hidden;isolation:isolate;transition:color .35s,background-color .35s,border-color .35s}
body:not(#q) :is(#main,.studio-nav,.site-end,dialog) :is(.pill,.ap-btn,.wf-btn,.ac-btn,.oc-btn,.ob-btn,.pc-btn,.dm-submit,.hub-black,.sx-btn,.sat-btn,.button,.obf-submit,.lead-submit)>:not(:is(.pill-icon,.sx-q)){position:relative;z-index:2}
body:not(#q) :is(#main,.studio-nav,.site-end,dialog) :is(.pill,.ap-btn,.wf-btn,.ac-btn,.oc-btn,.ob-btn,.pc-btn,.dm-submit,.hub-black,.sx-btn,.sat-btn,.button,.obf-submit,.lead-submit) :is(.pill-icon,.sx-q){--q-cut:var(--qreew-blue,#5268EC);--q-grow:#fff;z-index:1;box-shadow:0 0 0 0 var(--q-grow)!important;transition:box-shadow .6s cubic-bezier(.3,.7,.2,1),border-radius .35s cubic-bezier(.3,.8,.3,1)!important;overflow:visible}
body:not(#q) :is(#main,.studio-nav,.site-end,dialog) :is(.pill,.ap-btn,.wf-btn,.ac-btn,.oc-btn,.ob-btn,.pc-btn,.dm-submit,.hub-black,.sx-btn,.sat-btn,.button,.obf-submit,.lead-submit) :is(.pill-icon,.sx-q):before{content:'';position:absolute;left:58%;top:74%;width:17px;height:3px;border-radius:2px;background:var(--q-cut);transform:rotate(45deg);transform-origin:0 0;transition:opacity .25s;pointer-events:none;z-index:2}
body:not(#q) :is(#main,.studio-nav,.site-end,dialog) :is(.pill,.ap-btn,.wf-btn,.ac-btn,.oc-btn,.ob-btn,.pc-btn,.dm-submit,.hub-black,.sx-btn,.sat-btn,.button,.obf-submit,.lead-submit):hover :is(.pill-icon,.sx-q){border-radius:50%!important;box-shadow:0 0 0 150vmax var(--q-grow)!important}
body:not(#q) :is(#main,.studio-nav,.site-end,dialog) :is(.pill,.ap-btn,.wf-btn,.ac-btn,.oc-btn,.ob-btn,.pc-btn,.dm-submit,.hub-black,.sx-btn,.sat-btn,.button,.obf-submit,.lead-submit):hover :is(.pill-icon,.sx-q):before{opacity:0}
/* Primary: blue button, white disc. Hover: the disc fills the button white, text and border stay blue. */
body:not(#q) :is(#main,.studio-nav,.site-end,dialog) :is(.pill,.ap-btn,.wf-btn,.ac-btn,.oc-btn,.ob-btn,.pc-btn,.dm-submit,.hub-black,.sx-btn,.sat-btn,.button,.obf-submit,.lead-submit):not(.outline):hover{background:var(--qreew-blue)!important;border-color:var(--qreew-blue)!important;color:var(--qreew-blue)!important;-webkit-text-fill-color:var(--qreew-blue)!important}
/* Fallback discs (buttons without a .pill-icon) just open into a circle. */
body:not(#q) :is(#main,.studio-nav,.site-end,dialog) :is(.pill,.ap-btn,.wf-btn,.ac-btn,.oc-btn,.ob-btn,.pc-btn,.dm-submit,.hub-black,.sx-btn,.sat-btn,.button,.obf-submit,.lead-submit,button[type=submit]:not(.prompt-submit)):not(:has(.pill-icon,.sx-q)):before{transition:border-radius .35s cubic-bezier(.3,.8,.3,1)}
body:not(#q) :is(#main,.studio-nav,.site-end,dialog) :is(.pill,.ap-btn,.wf-btn,.ac-btn,.oc-btn,.ob-btn,.pc-btn,.dm-submit,.hub-black,.sx-btn,.sat-btn,.button,.obf-submit,.lead-submit,button[type=submit]:not(.prompt-submit)):not(:has(.pill-icon,.sx-q)):hover:before{border-radius:50%}
/* 2. Second button of a pair: translucent white glass, blue outline, blue Q disc with a white arrow. Hover: fills blue, text white. */
body:not(#q) :is(#main,.studio-nav,.site-end,dialog) .pill.outline{background:rgba(255,255,255,.62)!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid var(--qreew-blue)!important;color:var(--qreew-blue)!important;-webkit-text-fill-color:var(--qreew-blue)!important}
body:not(#q) :is(#main,.studio-nav,.site-end,dialog) .pill.outline :is(.pill-icon,.sx-q){--q-cut:rgba(255,255,255,.85);--q-grow:var(--qreew-blue);background:var(--qreew-blue)!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
body:not(#q) :is(#main,.studio-nav,.site-end,dialog) .pill.outline :is(.pill-icon,.sx-q):after{background:#fff!important}
body:not(#q) :is(#main,.studio-nav,.site-end,dialog) .pill.outline:hover{background:rgba(255,255,255,.62)!important;border-color:var(--qreew-blue)!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
body:not(#q) .pc .pc-hero :is(.pc-btn,.pill,.obf-submit),body:not(#q) .pc :is(.pc-hero-right,.pc-hero-copy,.mf-wrap) > :is(a.pill,a.pc-btn){width:auto!important;max-width:100%!important;align-self:flex-end!important;justify-self:end!important;margin-left:auto!important;margin-right:clamp(16px,2.2vw,32px)!important}
/* No "pause animations" switch anywhere. */
[data-motion],.qr-motion,#motion-toggle{display:none!important}
/* Arrow sits up-left in the disc so the Q cuts stay clear of it. */
body:not(#q) :is(#main,.studio-nav,.site-end,dialog) :is(.pill,.ap-btn,.wf-btn,.ac-btn,.oc-btn,.ob-btn,.pc-btn,.dm-submit,.hub-black,.sx-btn,.sat-btn,.button,.obf-submit,.lead-submit) :is(.pill-icon,.sx-q):after{inset:9px}
/* 3. Navigation: slightly larger, semi-bold, same typeface. */
body:not(#q) .studio-nav nav>a:not(.pill){font-size:15.5px!important;font-weight:600!important;letter-spacing:-.012em!important}
body:not(#q) .studio-nav .nav-contact{font-size:14px!important;font-weight:600!important}
body:not(#q) .studio-nav .studio-brand{font-weight:700}
@media(max-width:800px){body:not(#q) .studio-nav nav>a:not(.pill){font-size:15px!important}}
/* 4. Footer column titles: calm labels, not section headings. */
body:not(#q) :is(#main,.site-end) .studio-footer :is(h2,h3,h4,h5){font-size:17px!important;line-height:1.3!important;letter-spacing:-.015em!important;font-weight:600!important;margin-bottom:14px}
/* 5. Publisher pages: the "Vous reconnaissez ces situations ?" strip takes the company palette, pale. */
body:not(#q) .pc .obf-strip{background:var(--pc-soft,#eef1fd)!important;border:1px solid color-mix(in srgb,var(--pc-blue,#263068) 14%,transparent)}
body:not(#q) .pc .obf-strip :is(p,strong){color:var(--pc-blue,#263068)!important}
body:not(#q) .pc .obf-strip p{color:color-mix(in srgb,var(--pc-blue,#263068) 72%,#fff)!important}
body:not(#q) .pc .obf-strip strong{color:var(--pc-blue,#263068)!important}
body:not(#q) .pc .obf-strip .obf-link{color:var(--pc-blue,#263068)!important;border-bottom-color:color-mix(in srgb,var(--pc-blue,#263068) 45%,transparent)!important}
