/*! Kit de site NOVATIS v1.1.0 — comportements et structure des composants. */
:root {
--nv-bg: #ffffff;
--nv-surface: #ffffff;
--nv-surface-2: #f5f5f4;
--nv-text: #1c1917;
--nv-muted: #57534e;
--nv-border: #e7e5e4;
--nv-primary: #1d4ed8;
--nv-primary-contrast: #ffffff;
--nv-accent: #f59e0b;
--nv-accent-contrast: #1c1917;
--nv-dark: #0c0a09;
--nv-dark-text: #fafaf9;
--nv-font-title: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
--nv-font-text: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
--nv-title-weight: 700;
--nv-title-tracking: -0.01em;
--nv-radius: 14px;
--nv-radius-btn: 999px;
--nv-shadow: 0 10px 30px -12px rgba(0, 0, 0, 0.18);
--nv-space: clamp(3.5rem, 8vw, 6.5rem);
--nv-gap: clamp(1rem, 2.5vw, 2rem);
--nv-container: 1180px;
--nv-gutter: clamp(1.25rem, 4vw, 2.5rem);
--nv-ease: cubic-bezier(0.22, 1, 0.36, 1);
--nv-duration: 700ms;
--nv-distance: 28px;
--nv-header-h: 0px;
}
html.nv-js,
html.nv-js body {
overflow-x: clip;
}
[data-nv-icon] {
display: inline-block;
width: 1em;
height: 1em;
flex: none;
vertical-align: -0.125em;
background-color: currentColor;
-webkit-mask: var(--nv-i) center / contain no-repeat;
mask: var(--nv-i) center / contain no-repeat;
}
.nv-sr {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
.nv-ctl {
display: inline-grid;
place-items: center;
width: 44px;
height: 44px;
padding: 0;
border: 0;
border-radius: 999px;
background: var(--nv-surface);
color: var(--nv-text);
box-shadow: var(--nv-shadow);
cursor: pointer;
font: inherit;
transition:
transform 200ms var(--nv-ease),
background-color 200ms,
color 200ms,
opacity 200ms;
}
.nv-ctl:hover {
background: var(--nv-primary);
color: var(--nv-primary-contrast);
}
.nv-ctl:focus-visible {
outline: 3px solid var(--nv-primary);
outline-offset: 3px;
}
.nv-ctl[disabled] {
opacity: 0.35;
cursor: default;
}
.nv-ctl svg {
width: 20px;
height: 20px;
fill: none;
stroke: currentColor;
stroke-width: 2;
stroke-linecap: round;
stroke-linejoin: round;
}
[dir='rtl'] .nv-ctl--prev svg,
[dir='rtl'] .nv-ctl--next svg {
transform: scaleX(-1);
}
@media (prefers-reduced-motion: reduce) {
html.nv-js {
scroll-behavior: auto !important;
}
}
[dir='rtl'] a[href^='tel:'] {
direction: ltr;
unicode-bidi: isolate;
}
html.nv-reveal:not(.nv-off-reveal) [data-nv-reveal]:not(.is-shown),
html.nv-reveal:not(.nv-off-reveal) [data-nv-stagger] > :not(.is-shown) {
opacity: 0;
transform: translate3d(0, var(--nv-distance), 0);
transition:
opacity var(--nv-duration) var(--nv-ease) var(--nv-delay, 0ms),
transform var(--nv-duration) var(--nv-ease) var(--nv-delay, 0ms);
}
html.nv-reveal:not(.nv-off-reveal) [data-nv-reveal='down']:not(.is-shown) {
transform: translate3d(0, calc(var(--nv-distance) * -1), 0);
}
html.nv-reveal:not(.nv-off-reveal) [data-nv-reveal='left']:not(.is-shown) {
transform: translate3d(calc(var(--nv-distance) * -1), 0, 0);
}
html.nv-reveal:not(.nv-off-reveal) [data-nv-reveal='right']:not(.is-shown) {
transform: translate3d(var(--nv-distance), 0, 0);
}
@media (max-width: 860px) {
html.nv-reveal:not(.nv-off-reveal) [data-nv-reveal='left']:not(.is-shown),
html.nv-reveal:not(.nv-off-reveal) [data-nv-reveal='right']:not(.is-shown) {
transform: translate3d(0, var(--nv-distance), 0);
}
}
html.nv-reveal:not(.nv-off-reveal) [data-nv-reveal='zoom']:not(.is-shown) {
transform: scale(0.94);
}
html.nv-reveal:not(.nv-off-reveal) [data-nv-reveal='fade']:not(.is-shown) {
transform: none;
}
html.nv-reveal:not(.nv-off-reveal) [data-nv-reveal].is-visible:not(.is-shown),
html.nv-reveal:not(.nv-off-reveal) [data-nv-stagger] > .is-visible:not(.is-shown) {
opacity: 1;
transform: none;
}
@media (prefers-reduced-motion: reduce) {
html.nv-reveal [data-nv-reveal]:not(.is-shown),
html.nv-reveal [data-nv-stagger] > :not(.is-shown) {
opacity: 1 !important;
transform: none !important;
transition: none !important;
}
}
@media print {
html.nv-reveal [data-nv-reveal]:not(.is-shown),
html.nv-reveal [data-nv-stagger] > :not(.is-shown) {
opacity: 1 !important;
transform: none !important;
}
}
[data-nv-header] {
position: sticky;
top: 0;
z-index: 50;
transition:
transform 320ms var(--nv-ease),
background-color 240ms,
box-shadow 240ms;
}
:where([data-nv-header]).is-scrolled {
background: var(--nv-surface);
box-shadow:
0 1px 0 var(--nv-border),
0 10px 28px -18px rgba(0, 0, 0, 0.28);
}
[data-nv-header].is-hidden {
transform: translateY(-100%);
}
@media (prefers-reduced-motion: reduce) {
[data-nv-header] {
transition: none;
}
}
[data-nv-menu-toggle] {
display: none;
}
.nv-burger {
display: grid;
gap: 5px;
width: 22px;
}
.nv-burger span {
display: block;
height: 2px;
border-radius: 2px;
background: currentColor;
transition:
transform 260ms var(--nv-ease),
opacity 200ms;
}
[aria-expanded='true'] > .nv-burger span:nth-child(1) {
transform: translateY(7px) rotate(45deg);
}
[aria-expanded='true'] > .nv-burger span:nth-child(2) {
opacity: 0;
}
[aria-expanded='true'] > .nv-burger span:nth-child(3) {
transform: translateY(-7px) rotate(-45deg);
}
@media (max-width: 860px) {
html.nv-js [data-nv-menu-toggle]:not([data-nv-menu-toggle='wide']) {
display: inline-grid;
place-items: center;
width: 48px;
height: 48px;
padding: 0;
border: 0;
border-radius: 12px;
background: none;
color: inherit;
cursor: pointer;
}
html.nv-js [data-nv-menu]:not([data-nv-menu='wide']) {
position: absolute;
inset-inline: 0;
top: 100%;
display: flex;
flex-direction: column;
align-items: stretch;
gap: 0;
max-height: calc(100vh - var(--nv-header-h));
margin: 0;
padding: 0.5rem var(--nv-gutter) 1rem;
overflow-y: auto;
border-top: 1px solid var(--nv-border);
background: var(--nv-surface);
box-shadow: 0 18px 30px -18px rgba(0, 0, 0, 0.35);
color: var(--nv-text);
opacity: 0;
visibility: hidden;
transform: translateY(-8px);
transition:
opacity 220ms var(--nv-ease),
transform 220ms var(--nv-ease),
visibility 0s linear 220ms;
}
html.nv-js [data-nv-menu]:not([data-nv-menu='wide']).is-open {
opacity: 1;
visibility: visible;
transform: none;
transition-delay: 0s;
}
html.nv-js [data-nv-menu]:not([data-nv-menu='wide']) a {
display: flex;
align-items: center;
min-height: 48px;
}
}
@media (max-width: 1100px) {
html.nv-js [data-nv-menu-toggle='wide'] {
display: inline-grid;
place-items: center;
width: 48px;
height: 48px;
padding: 0;
border: 0;
border-radius: 12px;
background: none;
color: inherit;
cursor: pointer;
}
html.nv-js [data-nv-menu='wide'] {
position: absolute;
inset-inline: 0;
top: 100%;
display: flex;
flex-direction: column;
align-items: stretch;
gap: 0;
max-height: calc(100vh - var(--nv-header-h));
margin: 0;
padding: 0.5rem var(--nv-gutter) 1rem;
overflow-y: auto;
border-top: 1px solid var(--nv-border);
background: var(--nv-surface);
box-shadow: 0 18px 30px -18px rgba(0, 0, 0, 0.35);
color: var(--nv-text);
opacity: 0;
visibility: hidden;
transform: translateY(-8px);
transition:
opacity 220ms var(--nv-ease),
transform 220ms var(--nv-ease),
visibility 0s linear 220ms;
}
html.nv-js [data-nv-menu='wide'].is-open {
opacity: 1;
visibility: visible;
transform: none;
transition-delay: 0s;
}
html.nv-js [data-nv-menu='wide'] a {
display: flex;
align-items: center;
min-height: 48px;
}
}
[data-nv-menu-toggle]:focus-visible {
outline: 3px solid var(--nv-primary);
outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
html.nv-js [data-nv-menu],
.nv-burger span {
transition: none !important;
}
}
html.nv-js:has(body[data-nv-smooth]) {
scroll-padding-top: calc(var(--nv-header-h) + 12px);
}
body[data-nv-smooth]:focus,
body[data-nv-smooth] [tabindex='-1']:focus {
outline: none;
}
html:not(.nv-js) [data-nv-top]:empty {
display: none;
}
html.nv-js [data-nv-top] {
position: fixed;
inset-inline-end: 1.25rem;
bottom: 1.25rem;
z-index: 60;
display: inline-grid;
place-items: center;
width: 48px;
height: 48px;
padding: 0;
border: 0;
border-radius: 999px;
background: var(--nv-primary);
box-shadow: var(--nv-shadow);
color: var(--nv-primary-contrast);
cursor: pointer;
text-decoration: none;
opacity: 0;
visibility: hidden;
transform: translateY(10px);
transition:
opacity 240ms var(--nv-ease),
transform 240ms var(--nv-ease),
visibility 0s linear 240ms;
}
html.nv-js [data-nv-top].is-visible {
opacity: 1;
visibility: visible;
transform: none;
transition-delay: 0s;
}
[data-nv-top]:focus-visible {
outline: 3px solid var(--nv-primary);
outline-offset: 3px;
}
[data-nv-top] svg {
width: 22px;
height: 22px;
fill: none;
stroke: currentColor;
stroke-width: 2;
stroke-linecap: round;
stroke-linejoin: round;
}
@media (prefers-reduced-motion: reduce) {
html.nv-js [data-nv-top] {
transition: none;
}
}
.nv-field-error {
display: block;
margin: 0.35rem 0 0;
font-weight: 400;
color: color-mix(in srgb, #d92d20 72%, var(--nv-text));
font-size: 0.875rem;
line-height: 1.35;
}
label > .nv-field-error {
margin-top: 0.2rem;
}
[data-nv-form] .is-invalid {
border-color: color-mix(in srgb, #d92d20 72%, var(--nv-text)) !important;
outline-color: color-mix(in srgb, #d92d20 72%, var(--nv-text));
}
.nv-form-status {
margin: 1rem 0 0;
padding: 0.75rem 1rem;
border-radius: var(--nv-radius);
background: color-mix(in srgb, var(--nv-primary) 10%, transparent);
color: var(--nv-text);
}
[data-nv-hover] {
transition:
transform 320ms var(--nv-ease),
box-shadow 320ms var(--nv-ease),
background-size 320ms var(--nv-ease);
}
[data-nv-hover='zoom'] {
overflow: hidden;
}
[data-nv-hover='zoom'] img {
transition: transform 700ms var(--nv-ease);
}
:where([data-nv-hover='shine']) {
position: relative;
}
[data-nv-hover='shine'] {
overflow: hidden;
}
[data-nv-hover='shine']::after {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(
100deg,
transparent 30%,
rgba(255, 255, 255, 0.4) 50%,
transparent 70%
);
transform: translateX(-130%) skewX(-18deg);
transition: transform 750ms var(--nv-ease);
pointer-events: none;
}
[data-nv-hover='underline'] {
padding-bottom: 2px;
background: linear-gradient(currentColor, currentColor) no-repeat 0 100% / 0 2px;
text-decoration: none;
}
[dir='rtl'] [data-nv-hover='underline'] {
background-position: 100% 100%;
}
[data-nv-hover='lift']:focus-within,
[data-nv-hover='lift']:focus-visible {
box-shadow: 0 20px 44px -20px rgba(0, 0, 0, 0.35);
transform: translateY(-6px);
}
[data-nv-hover='zoom']:focus-within img {
transform: scale(1.06);
}
[data-nv-hover='glow']:focus-within,
[data-nv-hover='glow']:focus-visible {
box-shadow:
0 0 0 1px var(--nv-primary),
0 14px 40px -14px var(--nv-primary);
}
[data-nv-hover='shine']:focus-within::after,
[data-nv-hover='shine']:focus-visible::after {
transform: translateX(130%) skewX(-18deg);
}
[data-nv-hover='underline']:focus-visible {
background-size: 100% 2px;
}
@media (hover: hover) {
[data-nv-hover='lift']:hover {
box-shadow: 0 20px 44px -20px rgba(0, 0, 0, 0.35);
transform: translateY(-6px);
}
[data-nv-hover='zoom']:hover img {
transform: scale(1.06);
}
[data-nv-hover='glow']:hover {
box-shadow:
0 0 0 1px var(--nv-primary),
0 14px 40px -14px var(--nv-primary);
}
[data-nv-hover='shine']:hover::after {
transform: translateX(130%) skewX(-18deg);
}
[data-nv-hover='underline']:hover {
background-size: 100% 2px;
}
}
@media (prefers-reduced-motion: reduce) {
[data-nv-hover],
[data-nv-hover] img,
[data-nv-hover]::after {
transition: none !important;
}
[data-nv-hover='lift']:hover,
[data-nv-hover='lift']:focus-within,
[data-nv-hover='lift']:focus-visible,
[data-nv-hover='zoom']:hover img,
[data-nv-hover='zoom']:focus-within img {
transform: none;
}
[data-nv-hover='shine']::after {
display: none;
}
}
html.nv-js:not(.nv-off-slider) [data-nv-slider] {
display: grid;
touch-action: pan-y pinch-zoom;
}
html.nv-js:not(.nv-off-slider) [data-nv-slider] > * {
grid-area: 1 / 1;
min-width: 0;
}
html.nv-js:not(.nv-off-slider) [data-nv-slider='slide'] {
overflow: hidden;
overflow: clip visible;
}
html.nv-js:not(.nv-off-slider) [data-nv-slider] > [data-nv-slide] ~ [data-nv-slide]:not(.is-active),
html.nv-js:not(.nv-off-slider) [data-nv-slider] > [data-nv-slide][aria-hidden='true'] {
visibility: hidden;
}
[data-nv-slider] > .is-active {
z-index: 1;
}
@media (prefers-reduced-motion: no-preference) {
[data-nv-slider] > .is-out {
animation: nv-slider-out var(--nv-duration) var(--nv-ease);
}
[data-nv-slider]:has(> .is-out) > .is-active {
animation: nv-slider-in var(--nv-duration) var(--nv-ease);
}
[data-nv-slider='slide'] > .is-out {
animation-name: nv-slider-move-out;
}
[data-nv-slider='slide']:has(> .is-out) > .is-active {
animation-name: nv-slider-move-in;
}
}
@keyframes nv-slider-in {
from {
opacity: 0;
}
}
@keyframes nv-slider-out {
from,
50% {
visibility: visible;
opacity: 1;
}
to {
visibility: visible;
opacity: 0;
}
}
@keyframes nv-slider-move-in {
from {
transform: translateX(var(--nv-x));
}
}
@keyframes nv-slider-move-out {
from {
visibility: visible;
}
to {
visibility: visible;
transform: translateX(calc(var(--nv-x) * -1));
}
}
[data-nv-slider].has-nav > [data-nv-slide] {
padding-bottom: var(--nv-slider-space, calc(var(--nv-slider-nav, 3.25rem) + 2.25rem));
}
.nv-slider__nav {
z-index: 2;
place-self: end center;
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 1rem;
padding: 4px;
border-radius: 26px;
background: var(--nv-surface);
box-shadow: var(--nv-shadow);
}
.nv-slider__nav .nv-ctl:not(:hover) {
background: none;
box-shadow: none;
}
.nv-ctl--pause svg {
display: none;
}
.nv-ctl.nv-ctl--pause::before {
content: '';
box-sizing: content-box;
width: 4px;
height: 14px;
border-inline: 4px solid;
}
.nv-ctl.nv-ctl--pause.is-paused::before {
width: 0;
height: 0;
border-block: solid transparent;
border-width: 7px 0 7px 12px;
}
.nv-slider__dots {
display: flex;
}
.nv-slider__dot {
display: grid;
place-items: center;
width: 44px;
height: 44px;
padding: 0;
border: 0;
border-radius: 999px;
background: none;
color: var(--nv-text);
cursor: pointer;
}
.nv-slider__dot::before {
content: '';
width: 24px;
height: 4px;
border-radius: 4px;
background: currentColor;
opacity: 0.25;
transition: opacity 200ms;
}
.nv-slider__dot:hover::before {
opacity: 0.6;
}
.nv-slider__dot.is-active::before {
background: var(--nv-primary);
opacity: 1;
}
.nv-slider__dot:focus-visible {
outline: 3px solid var(--nv-primary);
outline-offset: -6px;
}
@media (prefers-reduced-motion: no-preference) {
@supports selector(:has(*)) {
[data-nv-kenburns] {
animation: nv-kenburns 20s ease-in-out infinite alternate;
}
.nv-media:has([data-nv-kenburns]),
[data-nv-slide]:has([data-nv-kenburns]) {
overflow: hidden;
}
}
}
@keyframes nv-kenburns {
to {
transform: scale(1.12) translate3d(2%, -1.5%, 0);
}
}
[data-nv-carousel] {
display: grid;
grid-auto-flow: column;
grid-auto-columns: minmax(min(var(--nv-carousel-min, 280px), 85%), 1fr);
gap: var(--nv-gap);
margin: -6px;
padding: 6px;
overflow-x: auto;
overscroll-behavior-x: contain;
scroll-padding-inline: 6px;
scroll-snap-type: x mandatory;
scrollbar-width: none;
}
[data-nv-carousel]::-webkit-scrollbar {
display: none;
}
[data-nv-carousel] > * {
min-width: 0;
scroll-snap-align: start;
}
:where([data-nv-carousel] > *) {
position: relative;
}
.nv-carousel__nav {
margin-top: 1rem;
text-align: end;
}
.nv-carousel__nav .nv-ctl + .nv-ctl {
margin-inline-start: 0.5rem;
}
.nv-carousel__nav [disabled] {
pointer-events: none;
}
.nv-zoom {
cursor: zoom-in;
}
.nv-lightbox {
position: fixed;
inset: 0;
z-index: 9999;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 0.75rem;
padding: 4.5rem 1rem 1.5rem;
overflow: auto;
overscroll-behavior: contain;
background: rgba(0, 0, 0, 0.9);
color: #fff;
}
.nv-lightbox img {
max-width: 100%;
max-height: calc(100vh - 10rem);
max-height: calc(100dvh - 10rem);
}
.nv-lightbox p {
max-width: 60ch;
margin: 0;
font-size: 0.9375rem;
line-height: 1.4;
text-align: center;
}
.nv-lightbox small {
display: block;
font-size: 0.8125rem;
opacity: 0.7;
}
.nv-lightbox .nv-ctl {
position: fixed;
top: calc(50% - 22px);
}
.nv-lightbox .nv-ctl:not(:hover) {
background: rgba(0, 0, 0, 0.55);
color: #fff;
}
.nv-lightbox .nv-ctl:focus-visible {
outline-color: #fff;
}
.nv-lightbox .nv-ctl--prev {
inset-inline-start: 0.75rem;
}
.nv-lightbox .nv-ctl--next,
.nv-lightbox .nv-ctl--close {
inset-inline-end: 0.75rem;
}
.nv-lightbox .nv-ctl--close {
top: 0.75rem;
}
@media (min-width: 768px) {
.nv-lightbox {
padding-inline: 5rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.nv-lightbox {
animation: nv-fondu 200ms;
}
}
@keyframes nv-fondu {
from {
opacity: 0;
}
}
[data-nv-accordion] summary {
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
box-sizing: border-box;
min-height: 48px;
cursor: pointer;
list-style: none;
}
[data-nv-accordion] summary::-webkit-details-marker {
display: none;
}
[data-nv-accordion] summary::after {
content: '';
flex: none;
width: 0.55em;
height: 0.55em;
margin-inline: 0.3em;
border: solid currentColor;
border-width: 0 2px 2px 0;
transform: translateY(-25%) rotate(45deg);
transition: transform 300ms var(--nv-ease);
}
[data-nv-accordion] details[open]:not(.is-closing) > summary::after {
transform: translateY(25%) rotate(225deg);
}
@media (prefers-reduced-motion: reduce) {
[data-nv-accordion] summary::after {
transition: none;
}
}
[data-nv-panel][hidden] {
display: none !important;
}
[data-nv-filter-item][hidden] {
display: none !important;
}
