/* =============================================================================
   da.css — DIRECTION ARTISTIQUE « ENCRE & SIGNAL »

   Un seul système pour toutes les pages : la vitrine de démonstration,
   l'espace d'administration et le site de l'offre. Trois idées portent tout :

     1. LA SURFACE. Une matière chaude, jamais un gris neutre. Deux thèmes en
        partagent les mêmes rôles : `clair` (papier crème — vitrine et
        administration) et le thème par défaut, sombre (encre — site de
        l'offre). Aucune règle plus bas ne connaît la couleur : elles ne
        manipulent que des rôles.
     2. LE SIGNAL. Une seule couleur vive par site (émeraude, ou cobalt pour la
        vitrine Boréale) + un jaune-vert de surlignage. Rien d'autre ne crie.
     3. LE MOUVEMENT. Tout entre en scène : titres mot à mot, photos dévoilées
        par un volet, chiffres qui montent, plans qui glissent en parallaxe.
        Le mouvement dit la hiérarchie ; il ne décore pas.

   Le contenu reste VISIBLE si le JavaScript ne s'exécute pas : les états
   masqués sont conditionnés à la classe `js` posée par motion.js.
   ========================================================================== */

/* =============================================================================
   1. JETONS — thème sombre (par défaut)
   ========================================================================== */
:root{
  /* --- surfaces, de la plus profonde à la plus haute --- */
  --ink-950:#080F0D;
  --ink-900:#0C1613;   /* fond de page */
  --ink-850:#111D19;
  --ink-800:#16241F;
  --ink-700:#1E302A;
  --ink-600:#284037;
  --ink-500:#345548;

  /* --- papier : la respiration claire au milieu du sombre --- */
  --paper:#F4F2EC;
  --paper-2:#EBE7DE;
  --paper-3:#DFDACF;
  --white:#FFFFFF;

  /* --- texte --- */
  --on-ink:#F4F7F5;
  --on-ink-2:#CBD8D2;
  --on-ink-3:#9BAAA3;
  --on-ink-4:#77877F;
  --on-paper:#0B1512;
  --on-paper-2:#3D4B45;
  --on-paper-3:#6B7A73;
  --on-paper-4:#97A29B;
  /* texte posé SUR une photo : toujours clair, quel que soit le thème */
  --on-media:#F4F7F5;
  --on-media-2:#C9D6D0;

  /* --- filets --- */
  --rule-ink:rgba(244,247,245,.16);
  --rule-ink-2:rgba(244,247,245,.075);
  --rule-paper:rgba(11,21,18,.13);
  --rule-paper-2:rgba(11,21,18,.06);

  /* --- teintes : ce qui fait « monter » une surface sans la cerner --- */
  --tint:rgba(244,247,245,.055);
  --tint-2:rgba(244,247,245,.10);
  --tint-3:rgba(244,247,245,.18);
  --glass:linear-gradient(160deg,rgba(22,36,31,.86),rgba(12,22,19,.8));
  --glass-ring:rgba(244,247,245,.15);

  /* --- ombres --- */
  --sh-1:0 2px 8px rgba(0,0,0,.3);
  --sh-2:0 4px 12px rgba(0,0,0,.32), 0 24px 46px -28px rgba(0,0,0,.7);
  --sh-3:0 10px 24px -16px rgba(0,0,0,.6), 0 46px 90px -44px rgba(0,0,0,.95);

  /* --- bouton « contraste » : l'inverse du fond de page --- */
  --solid-bg:var(--paper);
  --solid-fg:#0B1512;

  /* --- signal (émeraude par défaut) --- */
  --sig-050:#E7F7F0;
  --sig-200:#9EE6CB;
  --sig-300:#5FD3AC;
  --sig-400:#22BE8E;
  --sig-500:#10B981;
  --sig-600:#0B7A58;
  --sig-700:#075E44;
  --sig-glow:rgba(16,185,129,.42);
  --on-sig:#04140E;          /* texte posé sur le signal */
  --lime:#C6F24E;
  --on-lime:#16210A;
  --amber:#F5A524;
  --coral:#FF8E5C;
  --danger:#E05747;

  /* --- typographie --- */
  --disp:'Bricolage Grotesque',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --ui:'Inter',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --serif:'Newsreader',Georgia,'Times New Roman',serif;
  --mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;

  --t-mega:clamp(3.1rem,10.4vw,10.5rem);
  --t-hero:clamp(2.8rem,7.6vw,7.4rem);
  --t-h1:clamp(2.35rem,5.6vw,5.2rem);
  --t-h2:clamp(1.85rem,3.9vw,3.5rem);
  --t-h3:clamp(1.25rem,1.9vw,1.75rem);
  --t-lead:clamp(1.02rem,1.24vw,1.32rem);
  --t-micro:700 10px/1.4 var(--mono);

  /* --- géométrie --- */
  --gut:clamp(20px,4.4vw,64px);
  --maxw:1440px;
  --r-xs:6px; --r-sm:12px; --r-md:20px; --r-lg:30px; --r-xl:44px;

  /* --- courbes --- */
  --e:cubic-bezier(.16,1,.3,1);
  --e-soft:cubic-bezier(.22,.75,.24,1);
  --e-back:cubic-bezier(.34,1.4,.5,1);

  /* --- matières --- */
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
  --grain-blend:overlay;
  --grain-opacity:.045;
}

/* =============================================================================
   1b. THÈME CLAIR — mêmes rôles, matière papier.
   Les surfaces « profondes » deviennent les papiers les plus soutenus : toute
   la mise en page écrite pour le sombre continue de fonctionner telle quelle.
   ========================================================================== */
[data-theme="clair"]{
  --ink-950:#ECE8DF;   /* bandes appuyées (pied de page, bandeaux) */
  --ink-900:#F7F5EF;   /* fond de page */
  --ink-850:#FCFBF7;
  --ink-800:#FFFFFF;   /* surfaces hautes */
  --ink-700:#F2EFE7;
  --ink-600:#E6E2D8;
  --ink-500:#D6D1C5;

  --on-ink:#0B1512;
  --on-ink-2:#3A4941;
  --on-ink-3:#5F6F67;
  --on-ink-4:#8B968F;

  --paper:#FFFFFF;
  --paper-2:#F7F5EF;
  --paper-3:#ECE8DF;

  --rule-ink:rgba(11,21,18,.15);
  --rule-ink-2:rgba(11,21,18,.07);

  --tint:rgba(11,21,18,.035);
  --tint-2:rgba(11,21,18,.065);
  --tint-3:rgba(11,21,18,.14);
  --glass:linear-gradient(160deg,rgba(255,255,255,.94),rgba(255,255,255,.82));
  --glass-ring:rgba(11,21,18,.1);

  --sh-1:0 1px 2px rgba(11,21,18,.05), 0 8px 20px -16px rgba(11,21,18,.3);
  --sh-2:0 2px 6px rgba(11,21,18,.05), 0 24px 46px -30px rgba(11,21,18,.4);
  --sh-3:0 8px 20px -14px rgba(11,21,18,.22), 0 44px 80px -46px rgba(11,21,18,.5);

  --solid-bg:#0B1512;
  --solid-fg:#F7F5EF;

  --grain-blend:multiply;
  --grain-opacity:.038;
}

/* --- variante de signal : la vitrine Boréale parle cobalt & ambre --------- */
[data-skin="boreale"]{
  --sig-050:#E8F0FE;
  --sig-200:#A8C7FA;
  --sig-300:#7FA9F7;
  --sig-400:#3F7AEE;
  --sig-500:#2E6BE6;
  --sig-600:#1D4ED8;
  --sig-700:#12379B;
  --sig-glow:rgba(46,107,230,.42);
  --on-sig:#FFFFFF;          /* le cobalt exige du blanc, pas de l'encre */
  --lime:#F7C948;
  --on-lime:#3A2A00;
}
/* Sur fond clair, le signal doit descendre d'un cran pour rester lisible. */
[data-theme="clair"]{ --sig-400:var(--sig-600); }
[data-theme="clair"][data-skin="boreale"]{ --sig-400:#1D4ED8; }

/* =============================================================================
   2. BASE
   ========================================================================== */
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
html.js{scroll-behavior:auto;}
body{
  margin:0;background:var(--ink-900);color:var(--on-ink);
  font-family:var(--ui);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  /* `clip` et non `hidden` : `hidden` transformerait le corps en conteneur de
     défilement et casserait tous les `position:sticky` de la page. */
  overflow-x:clip;
}
@supports not (overflow-x:clip){ body{overflow-x:hidden;} }
html.m-lock,html.m-lock body{overflow:hidden;}
img,svg,video{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
button{font:inherit;color:inherit;}
h1,h2,h3,h4{font-family:var(--disp);margin:0;font-weight:800;letter-spacing:-.042em;line-height:.95;}
p{margin:0;}
::selection{background:var(--sig-500);color:var(--on-sig);}

/* Barre de défilement discrète, dans la teinte de la page. */
*{scrollbar-width:thin;scrollbar-color:var(--tint-3) transparent;}
::-webkit-scrollbar{width:9px;height:9px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:var(--tint-3);border-radius:99px;}

/* =============================================================================
   3. MISE EN PAGE
   ========================================================================== */
.shell{width:100%;max-width:var(--maxw);margin:0 auto;padding-left:var(--gut);padding-right:var(--gut);}
.shell--wide{max-width:1680px;}
.shell--tight{max-width:1080px;}
.g12{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(16px,2vw,34px);}
.band{position:relative;padding:clamp(72px,10vw,168px) 0;}
.band--tight{padding:clamp(52px,6vw,96px) 0;}
.paper{background:var(--paper);color:var(--on-paper);}
.paper h1,.paper h2,.paper h3{color:var(--on-paper);}
.ink{background:var(--ink-900);color:var(--on-ink);}

/* Grain global : une matière, pas une texture visible. */
.grain{position:fixed;inset:0;pointer-events:none;z-index:400;opacity:var(--grain-opacity);
  background-image:var(--grain);mix-blend-mode:var(--grain-blend);}

/* =============================================================================
   4. TYPOGRAPHIE
   ========================================================================== */
.mega{font-family:var(--disp);font-weight:800;font-size:var(--t-mega);line-height:.86;letter-spacing:-.055em;}
.h1{font-size:var(--t-h1);line-height:.94;}
.h2{font-size:var(--t-h2);line-height:.98;}
.h3{font-size:var(--t-h3);line-height:1.1;letter-spacing:-.03em;}
.lead{font-size:var(--t-lead);line-height:1.58;color:var(--on-ink-2);max-width:56ch;}
.paper .lead{color:var(--on-paper-2);}
.serif{font-family:var(--serif);font-weight:400;font-style:italic;letter-spacing:-.015em;}
.sig{color:var(--sig-400);}
.paper .sig{color:var(--sig-600);}

.eyebrow{font:var(--t-micro);letter-spacing:.2em;text-transform:uppercase;
  color:var(--sig-400);display:inline-flex;align-items:center;gap:12px;margin:0 0 22px;}
.eyebrow::before{content:"";width:26px;height:1px;background:currentColor;flex:none;opacity:.7;}
.paper .eyebrow{color:var(--sig-600);}
.mono{font:var(--t-micro);letter-spacing:.17em;text-transform:uppercase;color:var(--on-ink-3);}
.paper .mono{color:var(--on-paper-3);}

/* Surlignage tracé à la main, jamais un aplat rectangulaire. */
.mark{position:relative;white-space:nowrap;}
.mark::after{content:"";position:absolute;left:-.06em;right:-.06em;bottom:.06em;height:.34em;
  background:var(--lime);z-index:-1;transform:scaleX(var(--mk,1));transform-origin:left;
  border-radius:.06em;}
.js .mark::after{--mk:0;transition:transform .9s var(--e) .45s;}
.js .is-in .mark::after,.js .mark.is-in::after{--mk:1;}

/* Filet : une séparation qui s'éteint plutôt qu'une bordure fermée. */
.rule{height:1px;border:0;margin:0;background:linear-gradient(90deg,var(--rule-ink),var(--rule-ink-2) 62%,transparent);}
.paper .rule{background:linear-gradient(90deg,var(--rule-paper),var(--rule-paper-2) 62%,transparent);}

/* =============================================================================
   5. PRIMITIVES D'ANIMATION
   ========================================================================== */
.js [data-reveal]{
  opacity:0;
  transition:opacity .9s var(--e) var(--d,0ms),
             transform 1.05s var(--e) var(--d,0ms),
             clip-path 1.15s var(--e) var(--d,0ms),
             filter .9s var(--e) var(--d,0ms);
}
.js [data-reveal="up"]{transform:translate3d(0,38px,0);}
.js [data-reveal="down"]{transform:translate3d(0,-28px,0);}
.js [data-reveal="left"]{transform:translate3d(-42px,0,0);}
.js [data-reveal="right"]{transform:translate3d(42px,0,0);}
.js [data-reveal="scale"]{transform:scale(.93);}
.js [data-reveal="blur"]{filter:blur(14px);transform:translate3d(0,22px,0);}
/* Volet photographique. Le découpage porte sur l'IMAGE, jamais sur le conteneur
   observé : un `clip-path` sur la cible annule son intersection et
   l'IntersectionObserver ne la verrait jamais entrer dans l'écran. */
.js [data-reveal="mask"],
.js [data-reveal="mask-r"]{opacity:1;}
.js [data-reveal="mask"] img,
.js [data-reveal="mask-r"] img{
  clip-path:inset(0 0 100% 0);transform:scale(1.22);
  transition:clip-path 1.2s var(--e) var(--d,0ms),transform 1.7s var(--e) var(--d,0ms);}
.js [data-reveal="mask-r"] img{clip-path:inset(0 100% 0 0);}
.js [data-reveal].is-in{opacity:1;transform:none;filter:none;}
.js [data-reveal="mask"].is-in img,
.js [data-reveal="mask-r"].is-in img{clip-path:inset(0 0 0 0);transform:scale(1);}

/* Découpe des titres : chaque mot monte depuis sa propre fenêtre. */
.m-w{display:inline-block;overflow:hidden;vertical-align:bottom;
  padding-bottom:.14em;margin-bottom:-.14em;}
.js .m-i{display:inline-block;transform:translate3d(0,110%,0) rotate(2.5deg);
  transition:transform 1.05s var(--e);
  transition-delay:calc(var(--i,0) * 42ms + var(--d,0ms));}
.js .is-in .m-i{transform:none;}

/* Parallaxe — toujours sur un élément dédié, jamais sur un élément révélé. */
[data-parallax]{transform:translate3d(0,var(--y,0px),0);will-change:transform;}

/* Inclinaison 3D douce. */
[data-tilt]{transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));
  transition:transform .5s var(--e-soft);}

/* Défilement horizontal infini. */
.marquee{overflow:hidden;--dur:40s;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);}
.marquee__track{display:flex;width:max-content;animation:m-run var(--dur) linear infinite;}
.marquee:hover .marquee__track{animation-play-state:paused;}
.marquee--rev .marquee__track{animation-direction:reverse;}
@keyframes m-run{from{transform:translate3d(0,0,0);}to{transform:translate3d(-50%,0,0);}}

/* Barre de progression de lecture. */
[data-progress]{position:fixed;top:0;left:0;right:0;height:2px;z-index:320;pointer-events:none;}
[data-progress]::after{content:"";display:block;height:100%;transform-origin:left;
  transform:scaleX(var(--sp,0));background:linear-gradient(90deg,var(--sig-500),var(--lime));}

/* Rideau d'ouverture — piloté par une ANIMATION CSS, jamais par le JavaScript :
   si un script échoue, le rideau se lève quand même et la page reste lisible. */
.curtain{position:fixed;inset:0;z-index:600;background:var(--ink-950);
  display:grid;place-items:center;
  animation:c-lift 1.05s var(--e) .55s forwards;}
.curtain__word{font-family:var(--disp);font-weight:800;font-size:clamp(16px,2.4vw,26px);
  letter-spacing:-.03em;color:var(--on-ink);opacity:0;animation:c-in .6s var(--e) .08s forwards;}
.curtain__word b{color:var(--sig-400);}
@keyframes c-in{to{opacity:1;}}
@keyframes c-lift{to{transform:translateY(-101%);visibility:hidden;}}
html:not(.js) .curtain{display:none;}

/* =============================================================================
   6. COMPOSANTS
   ========================================================================== */

/* --- boutons ------------------------------------------------------------- */
.btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:11px;
  font-family:var(--disp);font-weight:700;font-size:15.5px;letter-spacing:-.015em;
  padding:16px 28px;border:none;border-radius:999px;cursor:pointer;overflow:hidden;
  transform:translate3d(var(--mx,0px),var(--my,0px),0) scale(var(--s,1));
  transition:transform .4s var(--e-soft),box-shadow .35s var(--e),color .3s var(--e);
  will-change:transform;
}
.btn:hover{--s:1.03;}
.btn:active{--s:.99;}
.btn > *{position:relative;z-index:2;}
.btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;transition:transform .4s var(--e);}
.btn:hover svg{transform:translateX(4px);}
.btn:focus-visible{outline:2px solid var(--sig-500);outline-offset:4px;}

.btn--sig{background:var(--sig-500);color:var(--on-sig);
  box-shadow:0 10px 30px -12px var(--sig-glow),inset 0 1px 0 rgba(255,255,255,.28);}
.btn--sig::before{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit;
  background:var(--lime);transform:translateY(101%);transition:transform .5s var(--e);}
.btn--sig:hover{color:var(--on-lime);box-shadow:0 16px 44px -14px rgba(198,242,78,.45);}
.btn--sig:hover::before{transform:translateY(0);}

/* Bouton « contraste » : toujours l'inverse du fond de page. */
.btn--paper{background:var(--solid-bg);color:var(--solid-fg);box-shadow:var(--sh-2);}
.btn--paper::before{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit;
  background:var(--sig-500);transform:translateY(101%);transition:transform .5s var(--e);}
.btn--paper:hover{color:var(--on-sig);}
.btn--paper:hover::before{transform:translateY(0);}

.btn--ghost{background:transparent;color:currentColor;box-shadow:inset 0 0 0 1px var(--rule-ink);}
.paper .btn--ghost{box-shadow:inset 0 0 0 1px var(--rule-paper);}
.btn--ghost::before{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit;
  background:currentColor;opacity:0;transition:opacity .4s var(--e);}
.btn--ghost:hover::before{opacity:.09;}

/* Lien souligné qui se retrace au survol. */
.link{position:relative;display:inline-flex;align-items:center;gap:9px;
  font-family:var(--disp);font-weight:700;font-size:15px;letter-spacing:-.02em;padding-bottom:4px;}
.link::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;
  background:currentColor;transform-origin:right;transform:scaleX(1);
  transition:transform .45s var(--e);}
.link:hover::after{transform:scaleX(0);transform-origin:left;}
.link svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.2;
  stroke-linecap:round;stroke-linejoin:round;transition:transform .4s var(--e);}
.link:hover svg{transform:translateX(5px);}

/* --- pastilles ----------------------------------------------------------- */
.pill{display:inline-flex;align-items:center;gap:9px;padding:9px 16px;border-radius:999px;
  font:var(--t-micro);letter-spacing:.14em;text-transform:uppercase;
  background:var(--tint);box-shadow:inset 0 0 0 1px var(--rule-ink);
  color:var(--on-ink-2);}
.paper .pill{background:rgba(11,21,18,.03);box-shadow:inset 0 0 0 1px var(--rule-paper);
  color:var(--on-paper-2);}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--sig-400);flex:none;}

/* --- surfaces ------------------------------------------------------------ */
.card{position:relative;border-radius:var(--r-lg);overflow:hidden;
  background:var(--tint);
  box-shadow:inset 0 0 0 1px var(--rule-ink);
  transition:box-shadow .5s var(--e),transform .5s var(--e-soft),background .5s var(--e);}
.card:hover{box-shadow:inset 0 0 0 1px var(--tint-3),var(--sh-3);}
.paper .card{background:var(--white);box-shadow:var(--sh-1);}
.paper .card:hover{box-shadow:var(--sh-2);}

/* Le curseur allume la carte : une lueur, pas un cadre. */
[data-spot]{position:relative;}
[data-spot]::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:3;
  opacity:0;transition:opacity .45s var(--e);border-radius:inherit;
  background:radial-gradient(340px circle at var(--sx,50%) var(--sy,50%),
    var(--tint-2),transparent 62%);}
[data-spot]:hover::after{opacity:1;}
[data-theme="clair"] [data-spot]::after{
  background:radial-gradient(340px circle at var(--sx,50%) var(--sy,50%),
    var(--sig-glow),transparent 64%);}
[data-theme="clair"] [data-spot]:hover::after{opacity:.12;}

/* --- média --------------------------------------------------------------- */
.media{position:relative;overflow:hidden;background:var(--ink-800);}
.media img{width:100%;height:100%;object-fit:cover;}
.media--r{border-radius:var(--r-lg);}
/* Repli peint si une photo manque : jamais un rectangle vide. */
.media::before{content:"";position:absolute;inset:0;z-index:0;
  background:linear-gradient(150deg,var(--ink-700),var(--ink-850) 60%,var(--sig-700));}
.media > img,.media > picture{position:relative;z-index:1;}
.media__zoom img{transition:transform 1.1s var(--e);}
a:hover .media__zoom img,.card:hover .media__zoom img,.media__zoom:hover img{transform:scale(1.06);}

/* Voiles de lecture posés sur les photos — indépendants du thème : une photo
   reste une photo, et le texte qui s'y pose reste clair. */
.scrim{position:absolute;inset:0;z-index:2;pointer-events:none;}
.scrim--b{background:linear-gradient(180deg,transparent 26%,rgba(4,9,7,.55) 68%,rgba(4,9,7,.92));}
.scrim--l{background:linear-gradient(90deg,rgba(4,9,7,.92) 4%,rgba(4,9,7,.55) 42%,transparent 78%);}
.scrim--full{background:linear-gradient(160deg,rgba(4,9,7,.86),rgba(4,9,7,.62) 45%,rgba(4,9,7,.88));}
.scrim--sig{background:radial-gradient(120% 90% at 78% 8%,var(--sig-glow),transparent 58%);
  mix-blend-mode:screen;opacity:.5;}
.on-media{color:var(--on-media);}
.on-media-2{color:var(--on-media-2);}

/* --- chiffres ------------------------------------------------------------ */
.num{font-family:var(--disp);font-weight:800;letter-spacing:-.055em;line-height:.88;
  font-variant-numeric:tabular-nums;font-size:clamp(2.6rem,5.4vw,4.8rem);}
.num-lbl{font:var(--t-micro);letter-spacing:.17em;text-transform:uppercase;
  color:var(--on-ink-3);margin-top:14px;display:block;line-height:1.55;}
.paper .num-lbl{color:var(--on-paper-3);}

/* =============================================================================
   7. RESPECT DES PRÉFÉRENCES
   ========================================================================== */
@media (prefers-reduced-motion:reduce){
  .js [data-reveal]{opacity:1 !important;transform:none !important;filter:none !important;
    clip-path:none !important;transition:none !important;}
  .js [data-reveal="mask"] img,.js [data-reveal="mask-r"] img{
    clip-path:none !important;transform:none !important;transition:none !important;}
  .js .m-i{transform:none !important;transition:none !important;}
  .marquee__track{animation:none !important;}
  .curtain{display:none !important;}
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important;scroll-behavior:auto !important;}
}